templateThemeTest.html 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  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>Test Widget Templates in Multiple Themes</title>
  6. <script type="text/javascript" src="../../dojo/dojo.js"
  7. djConfig="parseOnLoad: true, isDebug: true"></script>
  8. <script type="text/javascript" src="../tests/_testCommon.js"></script>
  9. <script type="text/javascript">
  10. dojo.require("dijit.Menu");
  11. dojo.require("dijit.form.Button");
  12. dojo.require("dijit.form.ComboBox");
  13. dojo.require("dijit.form.NumberSpinner");
  14. dojo.require("dojo.parser");
  15. logMessage = console.debug;
  16. </script>
  17. <style type="text/css">
  18. @import "../../dojo/resources/dojo.css";
  19. @import "noir/noir.css";
  20. @import "tundra/tundra.css";
  21. @import "soria/soria.css";
  22. @import "../tests/css/dijitTests.css";
  23. /* group multiple buttons in a row */
  24. body {
  25. margin:10px;
  26. }
  27. .box {
  28. display: block;
  29. }
  30. .box .dijitButton {
  31. margin-right: 10px;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <h2>Tundra</h2>
  37. <div id='tundra' class="box tundra">
  38. <button id='foo' dojoType="dijit.form.Button" onClick='logMessage("clicked simple")'>
  39. Button
  40. </button>
  41. <button dojoType="dijit.form.Button" iconClass="noteIcon" onClick='logMessage("clicked simple")'>
  42. Button w/image
  43. </button>
  44. <button dojoType="dijit.form.Button" onClick='logMessage("clicked simple")' disabled='true'>
  45. Disabled Button
  46. </button>
  47. <br><br>
  48. <button dojoType="dijit.form.DropDownButton">
  49. <span>Drop Down Button</span>
  50. <div dojoType="dijit.Menu" id="editMenu" style="display: none;">
  51. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCut"
  52. onClick="logMessage('not actually cutting anything, just a test!')">Cut</div>
  53. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCopy"
  54. onClick="logMessage('not actually copying anything, just a test!')">Copy</div>
  55. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconPaste"
  56. onClick="logMessage('not actually pasting anything, just a test!')">Paste</div>
  57. </div>
  58. </button>
  59. <button dojoType="dijit.form.DropDownButton" iconClass="noteIcon">
  60. <span>Button w/image</span>
  61. <div dojoType="dijit.Menu" id="editMenu2" style="display: none;">
  62. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCut"
  63. onClick="logMessage('not actually cutting anything, just a test!')">Cut</div>
  64. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCopy"
  65. onClick="logMessage('not actually copying anything, just a test!')">Copy</div>
  66. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconPaste"
  67. onClick="logMessage('not actually pasting anything, just a test!')">Paste</div>
  68. </div>
  69. </button>
  70. <button dojoType="dijit.form.DropDownButton" disabled='true'>
  71. <span>Drop Down Disabled</span>
  72. <div dojoType="dijit.Menu" id="editMenu3" style="display: none;">
  73. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCut"
  74. onClick="logMessage('not actually cutting anything, just a test!')">Cut</div>
  75. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconCopy"
  76. onClick="logMessage('not actually copying anything, just a test!')">Copy</div>
  77. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconPaste"
  78. onClick="logMessage('not actually pasting anything, just a test!')">Paste</div>
  79. </div>
  80. </button>
  81. <br><br>
  82. <button dojoType="dijit.form.ComboButton" onClick='logMessage("clicked combo save")'>
  83. <span>Combo Button</span>
  84. <div dojoType="dijit.Menu" id="saveMenu" style="display: none;">
  85. <div dojoType="dijit.MenuItem" iconSrc="../../templates/buttons/save.gif"
  86. onClick="logMessage('not actually saving anything, just a test!')">Save</div>
  87. <div dojoType="dijit.MenuItem" iconSrc="../../templates/buttons/save.gif"
  88. onClick="logMessage('not actually saving anything, just a test!')">Save As</div>
  89. </div>
  90. </button>
  91. <button dojoType="dijit.form.ComboButton" iconClass="noteIcon" onClick='logMessage("clicked combo save")'>
  92. <span>Combo w/image</span>
  93. <div dojoType="dijit.Menu" id="saveMenu" style="display: none;">
  94. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconSave"
  95. onClick="logMessage('not actually saving anything, just a test!')">Save</div>
  96. <div dojoType="dijit.MenuItem"
  97. onClick="logMessage('not actually saving anything, just a test!')">Save As</div>
  98. </div>
  99. </button>
  100. <button dojoType="dijit.form.ComboButton" onClick='logMessage("clicked combo save")' disabled='true'>
  101. <span>Combo Disabled</span>
  102. <div dojoType="dijit.Menu" id="saveMenu" style="display: none;">
  103. <div dojoType="dijit.MenuItem" iconClass="dijitEditorIconSave"
  104. onClick="logMessage('not actually saving anything, just a test!')">Save</div>
  105. <div dojoType="dijit.MenuItem"
  106. onClick="logMessage('not actually saving anything, just a test!')">Save As</div>
  107. </div>
  108. </button>
  109. <br><br>
  110. <input dojoType="dijit.form.ComboBox"
  111. value="California"
  112. class="medium"
  113. url="../tests/form/states.json"
  114. searchAttr="name"
  115. labelField="label"
  116. labelType="html"
  117. style="width: 300px;"
  118. name="state2"
  119. promptMessage="Please enter a state"
  120. id="datatest"
  121. >
  122. <input dojoType="dijit.form.ComboBox"
  123. value="California"
  124. class="medium"
  125. url="../tests/form/states.json"
  126. searchAttr="name"
  127. labelField="label"
  128. labelType="html"
  129. style="width: 300px;"
  130. name="state2"
  131. promptMessage="Please enter a state"
  132. id="datatest"
  133. disabled="true"
  134. >
  135. <br><br>
  136. <input dojoType="dijit.form.NumberSpinner"
  137. onChange="console.debug('onChange fired for widget id = ' + this.id + ' with value = ' + arguments[0]);"
  138. value="900"
  139. constraints={max:1550,places:0}
  140. maxLength="10"
  141. id="integerspinner1">
  142. <input dojoType="dijit.form.NumberSpinner"
  143. onChange="console.debug('onChange fired for widget id = ' + this.id + ' with value = ' + arguments[0]);"
  144. value="900"
  145. disabled='true'
  146. constraints={max:1550,places:0}
  147. maxLength="10"
  148. id="integerspinner1">
  149. </div>
  150. <br clear=both>
  151. <h2>Noir</h2>
  152. <div id='noir' class="box noir">
  153. </div>
  154. <br clear=both>
  155. <h2>Soria</h2>
  156. <div id='soria' class="box soria">
  157. </div>
  158. <br clear=both>
  159. <h2>a11y mode</h2>
  160. <div id='a11y' class="box dijit_a11y">
  161. </div>
  162. <br clear=both>
  163. <script language='javascript'>
  164. var html = dojo.byId("tundra").innerHTML;
  165. dojo.byId("noir").innerHTML = html;
  166. dojo.byId("a11y").innerHTML = html;
  167. dojo.byId("soria").innerHTML = html;
  168. </script>
  169. </body>
  170. </html>