Forums » Contributions »
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 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