Question

I’d like a graphical container that I can add and remove my custom widgets to where I can set a sort function that is automatically applied when these operations take place.

Is there a suitable object in Dojo already that I’ve missed? Or maybe I’m not thinking about the problem correctly?

If not, are there any examples etc. of a minimal working custom container widget out there?

Answer 1

Dont think there is really – how would a standard component’s sort functionality know, with which parameters it should weight the order, when containers can contain any widget type?

Using a layout widget extension would be your best option imho. They each have a function to add children, following this prototype:

addChild(/*Object*/ dijit, /*Integer?*/ insertIndex)

The dijit.layout.StackContainer is a good starting point, it inherits from dijit._Container (and dijit.layout._LayoutWidget). So you choose when to call the extension functionality of your override.

dojo.declare("my.Container", [dijit._Container], {
    getSortOrder : function(newDijit) {
         var newIndex = -1; ??
         // something to work with
         var currentChildren = this.getChildren();
         var currentDescendants = this.getDescendants();
         return newIndex;
    },
    addChild: function(dijit, index) {
           // figure out index
           arguments[1] = this.getSortOrder(dijit);
           this.inherited(arguments);
    }
});

But be aware, that layoutwidgets has more to it then choosing order, also positioning like with bordercontainer’s region parameter.