view release on metacpan or  search on metacpan

MANIFEST  view on Meta::CPAN

test/functional/examples.pl
test/functional/form/effects.js
test/functional/form/form.gvascript.css
test/functional/form/form.gvascript.html
test/functional/form/validation.js
test/functional/grid/simplegrid.html
test/functional/index.html
test/functional/keyMap/basic.html
test/functional/toc.html
test/functional/treeNavigator/basic.html
test/functional/treeNavigator/dropdownMenu.html
test/functional/treeNavigator/dynamic_content.html
test/functional/treeNavigator/dynamic_content/content1.html
test/functional/treeNavigator/dynamic_content/content2.html
test/functional/treeNavigator/dynamic_content/content3.html
test/functional/treeNavigator/form.html
test/functional/treeNavigator/special_icons/navclose.gif
test/functional/treeNavigator/special_icons/navopen.gif
test/images/add.png
test/images/ajax_loaded.png
test/images/ajax_loading.gif

test/functional/toc.html  view on Meta::CPAN

<h2>grid.js</h2>
<ul>
  <li><a href="http://localhost:8085/test/functional/grid/simplegrid.html" target="example">Paginated Grid</a> <sup>*</sup></li>
</ul>

<h2>treeNavigator.js</h2>
<ul>
  <li><a href="treeNavigator/basic.html" target="example">Basic Tree Navigator</a></li>
  <li><a href="treeNavigator/form.html" target="example">Form Tree Navigator</a></li>
  <li><a href="treeNavigator/dynamic_content.html" target="example">Lazy Tree Navigator</a></li>
  <li><a href="treeNavigator/dropdownMenu.html" target="example">DropDown Menu Tree Navigator</a></li>
</ul>

<h2>form.js</h2>
<ul>
  <li><a href="form/form.gvascript.html" target="example">Form</a></li>
</ul>

<div class="footnote">* <em>Start server with <tt>perl examples.pl</tt> in test/functional directory before running the example.</em></div>

</body>

test/functional/treeNavigator/dropdownMenu.html  view on Meta::CPAN

      .TN_leaf .TN_label {
         background-image: none;
      }
    </style>
    <script>
      var treeNav;       // GvaScript.TreeNavigator associated with the menu
      var treeNav_rules; // keymap rules of that object
      var textboxKeymap; // keymap associated with the input textbox
      var menuVisible = false;

      function showMenu(event) {
         if (menuVisible) return;
         menuVisible = true;
         
         // make the menu visible under the textbox
         var textbox = $('textbox');
         var coords = textbox.cumulativeOffset();
         var dim = Element.getDimensions(textbox);
         with ($('menu').style) {
           display = 'block';
           left    = coords[0] + 'px';
           top     = coords[1] + dim.height + 'px';
         };
         if (!treeNav) { // if first time here, instantiate GvaScript.TreeNavigator
           treeNav = new GvaScript.TreeNavigator('menu', {
             treeTabIndex  : -1,
             tabIndex      : -1,           // no tabbing 
             createButtons : false,        // no +/- buttons
             keymap        : textboxKeymap // reuse keymap from textbox
            });
         }
         else            // else reuse rules popped from last hideMenu()
           textboxKeymap.rules.push(treeNav_rules);  
         textbox.style.backgroundImage = "url(special_icons/navopen.gif)";

         if (event) Event.stop(event);
      }

      function hideMenu(event) {
        if (!menuVisible) return;
        menuVisible = false;

        $('menu').style.display = "none";
        treeNav_rules = textboxKeymap.rules.pop();
        $('textbox').style.backgroundImage = "url(special_icons/navclose.gif)";

        if (event) Event.stop(event);
      }

      function selectEntry(event) {
        var node = Event.element(event);
        if (treeNav.isLeaf(node)) {
          $('textbox').value = node.getAttribute("value");
          hideMenu();
        }
        else {
          var method = treeNav.isClosed(node) ? treeNav.open : treeNav.close;
          method.call(treeNav, node);
        }
      }

      function maybeToggleMenu(event) { // when clicking on the textbox
        // only handle clicks in the area right 20px of the textbox
        var x = event.offsetX || event.layerX; // MSIE || FIREFOX
        if (x > Element.getDimensions('textbox').width - 20) {
          var handler = menuVisible ? hideMenu : showMenu;
          handler(event);
        }
      }

      function maybeBackFocus(event) { // when leaving the textbox
        // if leaving the textbox because of a click in menu, we must
        // bring back focus to the textbox
        var x = Event.pointerX(event);
        var y = Event.pointerY(event);
        if (Position.within($('menu'), x, y))
          $('textbox').focus();
        else 
          hideMenu();
      }

      function setup() {  
         var textbox = $('textbox');

         // bind event handlers to the textbox
         textboxKeymap = new GvaScript.KeyMap({DOWN:showMenu,
                                            ESCAPE: hideMenu});
         textboxKeymap.observe('keydown', textbox,  {preventDefault:false,
                                              stopPropagation:false});
         Event.observe(textbox, "click", maybeToggleMenu);
         Event.observe(textbox, "blur",  maybeBackFocus);
        
         with (textbox.style) {
          backgroundImage    = "url(special_icons/navclose.gif)";
          backgroundRepeat   = "no-repeat";
          backgroundPosition = "center right";
        }

        textbox.focus();
      }