dojox/widget/SortList.js

  • Provides:

    • dojox.widget.SortList

  • Requires:

    • dijit.layout._LayoutWidget in common in project dijit
    • dijit._Templated in common in project dijit

  • dojox.widget.SortList

    • type
      Function
    • chains:
      • dijit.layout._LayoutWidget: (prototype)
      • dijit.layout._LayoutWidget: (call)
      • dijit._Templated: (call)
    • mixins:
      • dijit._Templated.prototype: (prototype)
    • summary
      A sortable unordered-list with a fixed header for use in dijit.demos.chat
for demonstration purposes only for now. feel free to make API suggestions
or fixes.

  • dojox.widget.SortList.title

    • type
      String
    • summary
      The title in the header

  • dojox.widget.SortList.heading

    • type
      String
    • summary
      In the event a parent container is expecting a title="" attribute, set it for the parent
via title, and the title of this widget via heading="" ... assuming you want different
titles for each. eg: TabContainer, AccordionContainer, etc.

  • dojox.widget.SortList.descending

    • type
      Boolean
    • summary
      Toggle sort order based on this value.

  • dojox.widget.SortList.selected

    • type
      Array
    • summary
      A list of the selected <li> nodes at any given time.

  • dojox.widget.SortList.sortable

    • type
      Boolean
    • summary
      toggle to enable/disable sorting

  • dojox.widget.SortList.store

    • summary
  • dojox.widget.SortList.key
       
    • summary
  • dojox.widget.SortList.baseClass
       
    • summary
  • dojox.widget.SortList.templateString
       
    • summary
  • dojox.widget.SortList._addItem
       
    • type
      Function
    • parameters: 
      • item: (typeof )
    • source: [view] 
                    
      

                      dojo.create("li", {
         innerHTML: this.store.getValue(item, this.key).replace(/  }, this.containerNode);
                    
      
                    
    • summary
  • dojox.widget.SortList.postCreate
       
    • type
      Function
    • source: [view] 
                    
      

                      if(this.store){
         this.store = dojo.getObject(this.store);
         var props = {
          onItem: dojo.hitch(this, "_addItem"),
          onComplete: dojo.hitch(this, "onSort")
         };
         this.store.fetch(props);
        }else{ this.onSort(); }
        this.inherited(arguments);
                    
      
                    
    • summary
  • dojox.widget.SortList.startup
       
    • type
      Function
    • source: [view] 
                    
      

                      this.inherited(arguments);
        if(this.heading){
         this.setTitle(this.heading);
         this.title = this.heading;
        }
        // we cheat, and give the browser just enough time so we know our height
        setTimeout(dojo.hitch(this,"resize"), 5);
        if(this.sortable){ this.connect(this.titleNode,"onclick", "onSort"); }
                    
      
                    
    • summary
  • dojox.widget.SortList.resize
       
    • type
      Function
    • source: [view] 
                    
      

                      this.inherited(arguments);
        // FIXME:
        // the 10 comes from the difference between the contentBox and calculated height
        // because of badding and border extents. this shouldn't be done this way, a theme change will
        // break it: but we also don't want to run getComputedStyle or dojo.coords() every time resize()
        // is fired.
        var offset = ((this._contentBox.h) - (dojo.style(this.titleNode,"height")))-10;
        this.bodyWrapper.style.height = Math.abs(offset) + "px";
                    
      
                    
    • summary
      do our additional calculations when resize() is called by or in a parent
  • dojox.widget.SortList.onSort
       
    • type
      Function
    • parameters: 
      • e: (typeof Event)
    • source: [view] 
                    
      

                      var arr = dojo.query("li",this.domNode);
        if (this.sortable){
         this.descending = !this.descending;
         dojo.addClass(this.titleNode,((this.descending)?"sortListDesc":"sortListAsc"));
         dojo.removeClass(this.titleNode,((this.descending)?"sortListAsc":"sortListDesc"));
         arr.sort(this._sorter);
         if(this.descending){ arr.reverse(); }
        }
        var i=0;
        dojo.forEach(arr,function(item){
         dojo[(i++) % 2 === 0 ? "addClass" : "removeClass"](item,"sortListItemOdd");
         this.containerNode.appendChild(item);
        },this);
                    
      
                    
    • summary
      sort the data, and style the nodes.
  • dojox.widget.SortList._set
       
    • type
      Function
    • parameters: 
      • e: (typeof Event)
    • source: [view] 
                    
      

                      if(e.target !== this.bodyWrapper){
         dojo.addClass(e.target,"sortListItemHover");
        }
                    
      
                    
    • summary
      set hover state
  • dojox.widget.SortList._unset
       
    • type
      Function
    • parameters: 
      • e: (typeof Event)
    • source: [view] 
                    
      

                      dojo.removeClass(e.target,"sortListItemHover");
                    
      
                    
    • summary
      remove hover state (FIXME: combine with _set?)
  • dojox.widget.SortList._handleClick
       
    • type
      Function
    • parameters: 
      • e: (typeof Event)
    • source: [view] 
                    
      

                      dojo.toggleClass(e.target,"sortListItemSelected");
        e.target.focus();
        this._updateValues(e.target.innerHTML);
                    
      
                    
    • summary
      click listener for data portion of widget. toggle selected state
of node, and update this.selected array accordingly
  • dojox.widget.SortList._updateValues
       
    • type
      Function
    • source: [view] 
                    
      

                      this._selected = dojo.query("li.sortListItemSelected", this.containerNode);
        this.selected = [];
        dojo.forEach(this._selected, function(node){
         this.selected.push(node.innerHTML);
        }, this);
        this.onChanged(arguments);
                    
      
                    
    • summary
  • dojox.widget.SortList._sorter
       
    • type
      Function
    • parameters: 
      • a: (typeof )
      • b: (typeof )
    • source: [view] 
                    
      

                      var aStr = a.innerHTML;
        var bStr = b.innerHTML;
        if(aStr>bStr){ return 1; }
        if(aStr  return 0;
                    
      
                    
    • summary
      a basic sort function, use query sort, or keep this?
  • dojox.widget.SortList.setTitle
       
    • type
      Function
    • parameters: 
      • title: (typeof String)
    • source: [view] 
                    
      

                      this.focusNode.innerHTML = this.title = title;
                    
      
                    
    • summary
      Sets the widget title to a String
  • dojox.widget.SortList.onChanged
       
    • type
      Function
    • source: [view] 
                    
      

                      // summary: stub function, passes the last changed item, and is fired after current state
                    
      
                    
    • summary
      stub function, passes the last changed item, and is fired after current state
  • dojox.widget.SortList.bodyWrapper.style.height
       
    • summary
  • dojox.widget.SortList._selected
       
    • summary
  • dojox.widget.SortList.focusNode.innerHTML
       
    • summary
  • dojox.widget
       
    • type
      Object
    • summary
  • dojox
       
    • type
      Object
    • summary