git.pond.sub.org Git - eow/blob - static/dojo-release-1.1.1/dijit/tests/test_Declaration.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   2         "http://www.w3.org/TR/html4/strict.dtd">
   3 <html>
   4 <head>
   5         <title>Dojo Toolkit - Declaration test</title>
   6         <style type="text/css">
   7                 @import "../../dojo/resources/dojo.css";
   8                 @import "../themes/tundra/tundra.css";
   9                 @import "css/dijitTests.css";
  10         </style>
  11         <script type="text/javascript" src="../../dojo/dojo.js"
  12                 djConfig="parseOnLoad: true, isDebug: true"></script>
  13         <script type="text/javascript">
  14                 dojo.require("dijit.Declaration");
  15                 dojo.require("dijit.ProgressBar");
  16                 dojo.require("dojo.parser");    // scan page for widgets and instantiate them
  17         </script>
  18 </head>
  19 <body class="tundra">
  20         <h3>Simple macro:</h3>
  21         <p>(Check to make sure that links contain employee number)
  22         <div dojoType="dijit.Declaration" widgetClass="Employee" defaults="{ empid: 123, name: '' }">
  23                 <span>${name}</span>
  24                 <a href="update.php?id=${empid}">update</a>
  25                 <a href="delete.php?id=${empid}">delete</a>
  26         </div>
  27         <div dojoType="Employee" empid="100" name="Alan Allen"></div>
  28         <div dojoType="Employee" empid="101" name="Bob Brown"></div>
  29         <div dojoType="Employee" empid="102" name="Cathy Cameron"></div>
  30
  31         <h3>Using dojoAttachEvent, dojoAttachPoint</h3>
  32         <div dojoType="dijit.Declaration" widgetClass="HideButton">
  33                 XXX<button dojoAttachEvent="onclick" dojoAttachPoint="containerNode"></button>XXX
  34                 <script type='dojo/method' event='onclick'>
  35                         this.domNode.style.display="none";
  36                 </script>
  37         </div>
  38         <button dojoType="HideButton">Click to hide</button>
  39         <button dojoType="HideButton">Click to hide #2</button>
  40
  41         <h3>Extending another widget</h3>
  42         <p>HideButton2 extends HideButton (above) and changes the template (but keeps the onclick handler).</p>
  43         <span dojoType="dijit.Declaration" widgetClass="HideButton2" mixins="HideButton">
  44                 YYY<button dojoAttachEvent="onclick" dojoAttachPoint="containerNode"></button>YYY
  45         </span>
  46         <button dojoType="HideButton2">Hide me extended</button>
  47         <button dojoType="HideButton2">Hide me extended #2</button>
  48
  49         <h3>Something more complicated:</h3>
  50         <div dojoType="dijit.Declaration" widgetClass="foo" defaults="{ foo: 'thud', progress: 10 }">
  51                 <script type='dojo/connect' event='startup'>
  52                         this.baz.innerHTML += " (modified by dojo/connect event=startup) ";
  53                 </script>
  54
  55                 <p>thinger blah stuff ${foo}</p>
  56
  57                 <div style="width:400px" annotate="true" maximum="200"
  58                         progress="${progress}" dojoType="dijit.ProgressBar"></div>
  59                 <p dojoAttachPoint='baz'>baz thud</p>
  60         </div>
  61
  62         <div dojoType="foo" foo="blah" progress="50"></div>
  63         <div dojoType="foo" foo="thinger" progress="73"></div>
  64
  65 </body>
  66 </html>