Projet

General

Profil

Customization of drag icon

Ajouté par Hassen BAMRI il y a plus de 11 ans

By default when you drag an element (a type, a property or a control) the drag icon is a yellow rectangle. In order to make it looks like the clicked element simply change the body of the function "startDrag" (in the file "tree.js" line 605) as follows:

startDrag : function DesignerTree_DND_startDrag(x, y) {
           var dragEl = this.getDragEl();
           var clickEl = this.getEl();
           dragEl.innerHTML = clickEl.innerHTML;
           Dom.setStyle(dragEl, "color", Dom.getStyle(clickEl, "color"));
           Dom.setStyle(dragEl, "background-image", Dom.getStyle(clickEl, "background-image"));
           Dom.setStyle(dragEl, "background-repeat", Dom.getStyle(clickEl, "background-repeat"));
           Dom.setStyle(dragEl, "background-position", Dom.getStyle(clickEl, "background-position"));
           Dom.setStyle(dragEl, "background-size", Dom.getStyle(clickEl, "background-size"));
           Dom.setStyle(dragEl, "padding-left", Dom.getStyle(clickEl, "padding-left"));
           Dom.setStyle(dragEl, "background-color", "#E3EAEC");
           Dom.setStyle(dragEl, "border", "1px solid #6CA5CE");
           Dom.setStyle(dragEl, "width", Dom.getStyle(clickEl, "width"));
       }
Notes :
  • the file "tree.js" is located under "Alfresco/tomcat/webapps/share/components/model-designer"
  • the file "tree-min.js" have to be updated too. You can use 'http://jscompress.com/' to compress the content of the main file "tree.js"

!drag icon preview.png!


Réponses (2)

RE: Customization of drag icon - Ajouté par Hassen BAMRI il y a plus de 11 ans

RE: Customization of drag icon - Ajouté par Matthieu Laborie il y a plus de 11 ans

Thanks a lot for your contribs, I will include it in the next release.

Regards
Matthieu

    (1-2/2)