Changeset 4793


Ignore:
Timestamp:
Feb 27, 2009, 2:52:13 PM (14 years ago)
Author:
Nicklas Nordborg
Message:

References #1245: Add support for lazy loading of nodes in JoustTree?

Implemented a simple test case for lazy loading. DO NOT FORGET TO REMOVE IT BEFORE RELEASE.
Next step is to start with a real case (eg. #1241).

Location:
trunk/www
Files:
4 added
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/www/admin/extensions/tree.jsp

    r4618 r4793  
    171171    JoustMenu.menuItems[byExtPoint].isOpen = true;
    172172    JoustMenu.menuItems[byFile].isOpen = true;
     173    // TEST CODE FOR LAZY LOADING - REMOVE BEFORE RELEASE
     174    var lazyTest = JoustMenu.addMenuItem(-1, 'Root', 'LazyTest');
     175    var lazyTest = JoustMenu.addLazyChildItem(lazyTest, 'Home', 'LazyTest', "alert('onclick')", 'tip', 'lazy0', "lazyLoad('lazy0')");
     176    // END TEST CODE FOR LAZY LOADING - REMOVE BEFORE RELEASE
    173177    JoustMenu.draw('joust');
    174178    isInitialised = true;
    175179  }
    176180
     181  // TEST CODE FOR LAZY LOADING - REMOVE BEFORE RELEASE
     182  var lazyCount = 0;
     183  function lazyLoad(id)
     184  {
     185    lazyCount++;
     186    var x = lazyCount > 1 ? Math.random() * 4 : 4;
     187    var menuItem = JoustMenu.menuItems[id];
     188    if (x > 1) JoustMenu.addLazyChildItem(menuItem.index, 'Folder', 'Lazy A#'+lazyCount, "alert('childclick')", 'childtip', 'lazy_a'+lazyCount, "lazyLoad('lazy_a" + lazyCount + "')");
     189    if (x > 2) JoustMenu.addLazyChildItem(menuItem.index, 'Folder', 'Lazy B#'+lazyCount, "alert('childclick')", 'childtip', 'lazy_b'+lazyCount, "lazyLoad('lazy_b" + lazyCount + "')");
     190    if (x > 3) JoustMenu.addLazyChildItem(menuItem.index, 'Folder', 'Lazy C#'+lazyCount, "alert('childclick')", 'childtip', 'lazy_c'+lazyCount, "lazyLoad('lazy_c" + lazyCount + "')");
     191    //alert(menuItem);
     192    return x > 1;
     193  }
     194
     195  function openLazy()
     196  {
     197    var menuItem = JoustMenu.menuItems['lazy0'];
     198    JoustMenu.open(menuItem.index);
     199  }
     200  // END TEST CODE FOR LAZY LOADING - REMOVE BEFORE RELEASE
     201 
    177202  function openAll()
    178203  {
     
    266291      </div>
    267292    </div>
     293<a href="javascript:openLazy()">Open lazy</a>,<a href="javascript:openAll()">all</a>
    268294    </base:body>
    269295  </base:page>
  • trunk/www/include/scripts/newjoust.js

    r4510 r4793  
    7979      var padIcon = IconStore.getIcon(menuItem.noOutlineIcon == true ? null : menuItem.nextItemIndex == -1 ? 'iconBlank' : 'iconLine');
    8080      var padHtml = padIcon == null ? '' : padIcon.getImgTag();
    81       if (menuItem.firstChildIndex != -1)
     81      if (menuItem.firstChildIndex != -1 || menuItem.lazyInit)
    8282      {
    8383        html += '<div class="children" id="children'+menuItem.index+'" style="display: '+(menuItem.isOpen ? 'block' : 'none')+'">';
    84         html += this.drawMenuItems(menuItem.firstChildIndex, indentString+padHtml);
     84        if (menuItem.firstChildIndex != -1)
     85        {
     86          html += this.drawMenuItems(menuItem.firstChildIndex, indentString+padHtml);
     87        }
     88        else
     89        {
     90          menuItem.childIndentation = indentString+padHtml;
     91        }
    8592        html += '</div>\n';
    8693      }
     
    100107    @return The index of the new item
    101108  */
    102   this.addMenuItem = function(afterItemIndex, iconName, text, onclick, tooltip, externalId, isOpen)
     109  this.addMenuItem = function(afterItemIndex, iconName, text, onclick, tooltip, externalId, isOpen, lazyInit)
    103110  {
    104111    var afterItem = this.menuItems[afterItemIndex];
     
    111118    var insertIndex = this.menuItems.length;
    112119
    113     var menuItem = new MenuItem(this, insertIndex, iconName, text, onclick, tooltip, nextItemIndex, previousItemIndex, parentItemIndex, externalId, isOpen);
     120    var menuItem = new MenuItem(this, insertIndex, iconName, text, onclick, tooltip, nextItemIndex, previousItemIndex, parentItemIndex, externalId, isOpen, lazyInit);
    114121    this.menuItems[insertIndex] = menuItem;
    115122    if (!this.menuItems[externalId]) this.menuItems[externalId] = menuItem;
     
    123130      else
    124131      {
    125         afterItem.lastChildIndex = insertIndex;
     132        //afterItem.lastChildIndex = insertIndex;
    126133        if (parentItemIndex == -1) this.lastItemIndex = insertIndex;
    127134      }
     
    135142  }
    136143
     144  this.addLazyChildItem = function(parentItemIndex, iconName, text, onclick, tooltip, externalId, lazyInit)
     145  {
     146    this.addChildItem(parentItemIndex, iconName, text, onclick, tooltip, externalId, false, lazyInit);
     147  }
     148 
    137149  /**
    138150    Adds a child item to another menu item. The new item is inserted last
     
    146158    @return The index of the new item
    147159  */
    148   this.addChildItem = function(parentItemIndex, iconName, text, onclick, tooltip, externalId, isOpen)
     160  this.addChildItem = function(parentItemIndex, iconName, text, onclick, tooltip, externalId, isOpen, lazyInit)
    149161  {
    150162    var parentItem = this.menuItems[parentItemIndex];
    151163    if (!parentItem)
    152164    {
    153       return this.addMenuItem(-1, iconName, text, onclick, tooltip, externalId, isOpen);
     165      return this.addMenuItem(-1, iconName, text, onclick, tooltip, externalId, isOpen, lazyInit);
    154166    }
    155167    var afterItem = this.menuItems[parentItem.lastChildIndex];
    156168    if (afterItem)
    157169    {
    158       parentItem.lastChildIndex = this.addMenuItem(parentItem.lastChildIndex, iconName, text, onclick, tooltip, externalId, isOpen);
     170      parentItem.lastChildIndex = this.addMenuItem(parentItem.lastChildIndex, iconName, text, onclick, tooltip, externalId, isOpen, lazyInit);
    159171      return parentItem.lastChildIndex;
    160172    }
    161173    var insertIndex = this.menuItems.length;
    162     var menuItem = new MenuItem(this, insertIndex, iconName, text, onclick, tooltip, -1, -1, parentItemIndex, externalId, isOpen);
     174    var menuItem = new MenuItem(this, insertIndex, iconName, text, onclick, tooltip, -1, -1, parentItemIndex, externalId, isOpen, lazyInit);
    163175    this.menuItems[insertIndex] = menuItem;
    164176    if (!this.menuItems[externalId]) this.menuItems[externalId] = menuItem;
     
    177189    if (!menuItem) return;
    178190    // Switch the open/closed status and hide or show the children
     191    if (menuItem.lazyInit)
     192    {
     193      var result = eval(menuItem.lazyInit);
     194      menuItem.lazyInit = null;
     195      if (result)
     196      {
     197        var html = this.drawMenuItems(menuItem.firstChildIndex, menuItem.childIndentation);
     198        var div = document.getElementById('children'+menuItemIndex);
     199        div.innerHTML = html;
     200      }
     201    }
    179202    menuItem.isOpen = !menuItem.isOpen;
    180203    if (menuItem.isOpen)
     
    197220    var menuItem = this.menuItems[menuItemIndex];
    198221    if (!menuItem || (menuItem.isOpen && noParents)) return;
    199     menuItem.isOpen = true;
    200     Main.show('children'+menuItem.index);
    201     this.updateIconsAndText(menuItemIndex);
     222    if (!menuItem.lazyInit)
     223    {
     224      menuItem.isOpen = true;
     225      Main.show('children'+menuItem.index);
     226      this.updateIconsAndText(menuItemIndex);
     227    }
    202228    if (!noParents && menuItem.parentItemIndex != -1) this.open(menuItem.parentItemIndex, false);
    203229  }
     
    320346  @param previousItemIndex The index of the previous menu item on the same level, or -1 if this is the first item
    321347  @param parentItemIndex The index of the parent menu item, or -1 if this is on the root level
     348  @param isOpen A flag indicating if the menu item should be open or closed to begin with
     349  @param lazyInit A string containing a JavaScript statement that is evaluation the first time the user opens the menu item
    322350*/
    323 function MenuItem(menu, index, iconName, text, onclick, tooltip, nextItemIndex, previousItemIndex, parentItemIndex, externalId, isOpen)
     351function MenuItem(menu, index, iconName, text, onclick, tooltip, nextItemIndex, previousItemIndex, parentItemIndex, externalId, isOpen, lazyInit)
    324352{
    325353  this.menu = menu;
     
    333361  this.parentItemIndex = parentItemIndex;
    334362  this.externalId = externalId;
    335   this.isOpen = isOpen;
     363  this.isOpen = isOpen && !lazyInit;
     364  this.lazyInit = lazyInit;
    336365  this.isSelected = false;
    337366  this.firstChildIndex = -1;
     
    346375    if (this.noOutlineIcon == true) return null;
    347376    var name = 'icon';
    348     if (this.firstChildIndex != -1)
     377    if (this.lazyInit)
     378    {
     379      name += 'Lazy';
     380    }
     381    else if (this.firstChildIndex != -1)
    349382    {
    350383      name += this.isOpen ? 'Minus' : 'Plus';
     
    356389    if (this.nextItemIndex == -1)
    357390    {
    358 //      name += this.index == this.menu.firstItemIndex || this.parentItemIndex == -1 ? 'Only' : 'Bottom';
    359391      name += this.index == this.menu.firstItemIndex ? 'Only' : 'Bottom';
    360392    }
     
    398430    html += '<table border="0" cellspacing="0" cellpadding="0"><tr><td width="10%">';
    399431    html += indentString;
    400     if (this.firstChildIndex != -1)
     432    if (this.firstChildIndex != -1 || this.lazyInit)
    401433    {
    402434      html += '<a href="javascript:JoustMenu.toggle('+this.index+')" onclick="event.cancelBubble=true">'+outlineTag+docTag+'</a>';
     
    440472    this.addIcon('iconMinusBottom', path + 'minusbottom.gif', width, height);
    441473    this.addIcon('iconMinusOnly', path + 'minusonly.gif', width, height);
     474    this.addIcon('iconLazyTop', path + 'lazytop.gif', width, height);
     475    this.addIcon('iconLazy', path + 'lazy.gif', width, height);
     476    this.addIcon('iconLazyBottom', path + 'lazybottom.gif', width, height);
     477    this.addIcon('iconLazyOnly', path + 'lazyonly.gif', width, height);
    442478    this.addIcon('iconLine', path + 'line.gif', width, height);
    443479    this.addIcon('iconBlank', path + 'blank.gif', width, height);
Note: See TracChangeset for help on using the changeset viewer.