OpenWGA 7.3 - Guide for OpenWGA Content Manager


Custom drag&drop support for pages

WebTML pages may want to receive drag&drop events from content manager and react on them in a custom way.

In order to enable this support the page needs to create a clientside JavasScript object of the name WGA.ddhandler. This object needs two methods:

  • WGA.ddhandler.notifyOver(type, dropObjects) - This method is called when the mouse pointer hovers over the page while a drag&drop operation is in progress. It should return "true" if the given drop objects are valid to be dropped, false otherwise.
  • WGA.ddhandler.notifyDrop(type, dropObjects) - This method is called when the user actually drops something onto the page, meant to perform the actual action on drop.

The parameter type on these methods is a string identifying the type of droppable object:

  • "doc-link" - A link to a page dragged from the site explorer
  • "attachment" - A file attachment dragged from the "File attachments" or "Images" list on the content management panel
  • "attachment-link" - Like "attachment", but the shift key is held, which may identify some alternate way of drop usage (typically creating a link)

The parameter dropObjects is an array containing a number of drop objects (in most cases only one). These objects represent the entity that is dragged&dropped and are simple JS data objects. Their data properties differ by the type of drop object:

  • For type "doc-link"
    • area: Name of the area from which the page originates
    • bestContentKey: Key of a content document on this page which is the one that will be displayed when the page is chosen in site explorer
    • contenttype: The content type of the page
    • key: The struct key of the page
    • title: The title of the page
  • For types "attachment" and "attachment-link"
    • name: Name of the file attachment
    • primary: Either the string "primary" if this is the primary file attachment or an empty string
    • size: Size of the attachment in bytes
    • url: Relative URL to the attachment

The following is an example of a custom D&D handler on a WebTML page which calls different WebTML actions depending on the drop type and which disallows drop type "attachment":

WGA.ddhandler = {

    notifyDrop: function(type, dropObjects){

if (type == "doc-link") {

    WGA.ajax.action({action: '<tml:action ref="handleDocLink"/>', params: {key: dropObj[0].key}});

        }

        else if (type == "attachment-link") {

    WGA.ajax.action({action: '<tml:action ref="handleAttachmentLink"/>', params: {key: dropObj[0].name}});

        }

    },

    notifyOver: function(type, dropObj){

        if (type == "doc-link") {

            return true;

        }

        if (type == "attachment-link") {

            return true;

        }

        return false;

    }

}