Most base libraries now loaded from googleapis. Changes to the way LiveGridForms...
[infodrom/rico3] / examples / html / menu.html
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">\r
2 <html>\r
3 <head>\r
4 <title>Rico 3.0</title>\r
5 <meta http-equiv="Content-Type" content="text/html;charset=utf-8">\r
6 <base target="content">\r
7 \r
8 <script src="../../ricoClient/js/baselibs/prototype-1.6.js" type="text/javascript"></script>\r
9 <script src="../../ricoClient/js/rico.js" type="text/javascript"></script>\r
10 <script src="../../ricoClient/js/rico2pro.js" type="text/javascript"></script>\r
11 <script src="../../ricoClient/js/ricoUI.js" type="text/javascript"></script>\r
12 <link href="../../ricoClient/css/rico.css" type="text/css" rel="stylesheet" />\r
13 \r
14 <script src="../menu.js" type="text/javascript"></script>\r
15 <link href="../menu.css" type="text/css" rel="stylesheet">\r
16 \r
17 <!--[if lt IE 7]>\r
18   <style type="text/css">\r
19 ul li {
20    height: 1%;\r
21 }
22  </style>\r
23 <![endif]-->\r
24 </head>\r
25 \r
26 \r
27 <body>\r
28 \r
29 <div id="menuheader">
30 <p>Rico <span id='RicoVersion'></span> <span id='RicoDir'></span> Demo</p>\r
31 </div>
32 \r
33 <div class='top'>\r
34 <form action='' method='get' id='form1'>\r
35 <ul>\r
36 <li id='demolist'>Example: <span id='demospan'></span>\r
37 <li>Theme: <span id='themespan'></span><input type='hidden' name='theme' id='theme' value=''>\r
38 <li>Base Lib: <span id='libspan'></span><input type='hidden' name='lib' id='lib' value=''>\r
39 <li><input type='checkbox' name='log'>&nbsp; Enable logging\r
40 </ul>\r
41 </form>\r
42 </div>\r
43 \r
44 \r
45 <div id="accordion1">\r
46 \r
47 <div>\r
48   <div>Choose the Example</div>\r
49   <div>\r
50 \r
51 <p>Accordions &amp; Tabs\r
52 <ul>\r
53 <li><a id="demo_accordion0.html">Basic Accordion</a>\r
54 <li><a id="demo_accordion3.html">Nested accordions</a>\r
55 <li><a id="demo_accordion4.html">Accordion with memory</a>\r
56 <li><a id="demo_panel1.html">Tabbed panel - fixed height</a>\r
57 <li><a id="demo_panel2.html">Tabbed panel - variable height</a>\r
58 </ul>\r
59 \r
60 <p>Drag and Drop\r
61 <ul>\r
62 <li><a id="demo_drag-and-drop-simple.html">Drag &amp; Drop-Simple</a>\r
63 <li><a id="demo_drag-and-drop-dyn.html">Drag &amp; Drop-dynamically created drop zones</a>\r
64 <li><a id="demo_drag-and-drop-log.html">Drag &amp; Drop-log from/to elements</a>\r
65 <li><a id="demo_drag-and-drop-zones.html">Drag &amp; Drop-multiple zones</a>\r
66 <li><a id="demo_drag-and-drop-grid.html">Drag &amp; Drop between LiveGrids</a>\r
67 </ul>\r
68 \r
69 <p>Grids\r
70 <ul>\r
71 <li><a id="demo_gridFromJSarray.html">LiveGrid populated from a javascript array</a>\r
72 <li><a id="demo_gridFromTable.html">LiveGrid populated from an HTML table</a>\r
73 <li><a id="demo_gridFromTableResize.html">LiveGrid that can be resized by the user</a>\r
74 <li><a id="demo_gridJSbuffer.html">LiveGrid with AjaxXML buffer and javascript callback</a>\r
75 <li><a id="demo_gridJSbuffer2.html">LiveGrid with AjaxSQL buffer and javascript callback</a>\r
76 <li><a id="demo_accordion-grid.html">LiveGrids in an accordion</a>\r
77 </ul>\r
78 \r
79 <p>Animation\r
80 <ul>\r
81 <li><a id="demo_animation-effects.html">Basic Animation</a>\r
82 <li><a id="demo_animate-rico.html">Animated Logo</a>\r
83 <li><a id="demo_pull-down.html">Animated Pull-down</a>\r
84 </ul>\r
85 \r
86 <p>Unit Tests\r
87 <ul>\r
88 <li><a id="demo_classTest.html">Classes and dimensions</a>\r
89 <li><a id="demo_events.html">Events</a>\r
90 <li><a id="demo_cssSelect.html">CSS selection</a>\r
91 <li><a id="demo_corners.html">Corners</a>\r
92 <li><a id="demo_corners2.html">Corners using color names</a>\r
93 <li><a id="demo_shadow.html">Shadows</a>\r
94 <li><a id="demo_controls.html">Calendar, Color-picker, and popup window controls</a>\r
95 <li><a id="demo_popups.html">Auto-sizing popup windows</a>\r
96 </ul>\r
97 \r
98   </div>\r
99 </div>\r
100 \r
101 <div>\r
102   <div>Choose the Theme</div>\r
103   <div>\r
104   <table border='0'>\r
105   <tr>\r
106   <td>Themeroller<br>Themes</td><td>Rico<br>Themes</td>\r
107   </tr>\r
108   <tr valign='top'>\r
109   <td>\r
110 \r
111     <ul>\r
112 <li><a id="theme_j-ui-lightness"><img src="../images/themeroller/theme_30_ui_light.png" alt="UI Lightness" title="UI Lightness" />\r
113 <br><span class="themeName">UI lightness</span></a></li>\r
114 \r
115 <li><a id="theme_j-ui-darkness"><img src="../images/themeroller/theme_30_ui_dark.png" alt="UI Darkness" title="UI Darkness" />\r
116 <br><span class="themeName">UI darkness</span></a></li>\r
117 \r
118 <li><a id="theme_j-smoothness"><img src="../images/themeroller/theme_30_smoothness.png" alt="Smoothness" title="Smoothness" />\r
119 <br><span class="themeName">Smoothness</span></a></li>\r
120 \r
121 <li><a id="theme_j-start"><img src="../images/themeroller/theme_30_start_menu.png" alt="Start" title="Start" />\r
122 <br><span class="themeName">Start</span></a></li>\r
123 \r
124 <li><a id="theme_j-redmond"><img src="../images/themeroller/theme_30_windoze.png" alt="Redmond" title="Redmond" />\r
125 <br><span class="themeName">Redmond</span></a></li>\r
126 \r
127 <li><a id="theme_j-sunny"><img src="../images/themeroller/theme_30_sunny.png" alt="Sunny" title="Sunny" />\r
128 <br><span class="themeName">Sunny</span></a></li>\r
129 \r
130 <li><a  id="theme_j-overcast"><img src="../images/themeroller/theme_30_overcast.png" alt="Overcast" title="Overcast" />\r
131 <br><span class="themeName">Overcast</span></a></li>\r
132 \r
133 <li><a  id="theme_j-le-frog"><img src="../images/themeroller/theme_30_le_frog.png" alt="Le Frog" title="Le Frog" />\r
134 <br><span class="themeName">Le Frog</span></a></li>\r
135 \r
136 <li><a  id="theme_j-flick"><img src="../images/themeroller/theme_30_flick.png" alt="Flick" title="Flick" />\r
137 <br><span class="themeName">Flick</span></a></li>\r
138 \r
139 <li><a  id="theme_j-pepper-grinder"><img src="../images/themeroller/theme_30_pepper_grinder.png" alt="Pepper Grinder" title="Pepper Grinder" />\r
140 <br><span class="themeName">Pepper Grinder</span></a></li>\r
141 \r
142 <li><a  id="theme_j-eggplant"><img src="../images/themeroller/theme_30_eggplant.png" alt="Eggplant" title="Eggplant" />\r
143 <br><span class="themeName">Eggplant</span></a></li>\r
144 \r
145 <li><a  id="theme_j-dark-hive"><img src="../images/themeroller/theme_30_dark_hive.png" alt="Dark Hive" title="Dark Hive" />\r
146 <br><span class="themeName">Dark Hive</span></a></li>\r
147 \r
148 <li><a  id="theme_j-cupertino"><img src="../images/themeroller/theme_30_cupertino.png" alt="Cupertino" title="Cupertino" />\r
149 <br><span class="themeName">Cupertino</span></a></li>\r
150 \r
151 <li><a  id="theme_j-south-street"><img src="../images/themeroller/theme_30_south_street.png" alt="South St" title="South St" />\r
152 <br><span class="themeName">South Street</span></a></li>\r
153 \r
154 <li><a  id="theme_j-blitzer"><img src="../images/themeroller/theme_30_blitzer.png" alt="Blitzer" title="Blitzer" />\r
155 <br><span class="themeName">Blitzer</span></a></li>     \r
156 \r
157 <li><a  id="theme_j-humanity"><img src="../images/themeroller/theme_30_humanity.png" alt="Humanity" title="Humanity" />\r
158 <br><span class="themeName">Humanity</span></a></li>\r
159 \r
160 <li><a  id="theme_j-hot-sneaks"><img src="../images/themeroller/theme_30_hot_sneaks.png" alt="Hot Sneaks" title="Hot Sneaks" />\r
161 <br><span class="themeName">Hot sneaks</span></a></li>\r
162 \r
163 <li><a  id="theme_j-excite-bike"><img src="../images/themeroller/theme_30_excite_bike.png" alt="Excite Bike" title="Excite Bike" />\r
164 <br><span class="themeName">Excite Bike</span></a></li>\r
165 \r
166 <li><a  id="theme_j-vader"><img src="../images/themeroller/theme_30_black_matte.png" alt="Vader" title="Vader" />\r
167 <br><span class="themeName">Vader</span></a></li>\r
168 \r
169 <li><a  id="theme_j-dot-luv"><img src="../images/themeroller/theme_30_dot_luv.png" alt="Dot Luv" title="Dot Luv" />\r
170 <br><span class="themeName">Dot Luv</span></a></li>\r
171 \r
172 <li><a  id="theme_j-mint-choc"><img src="../images/themeroller/theme_30_mint_choco.png" alt="Mint Choc" title="Mint Choc" />\r
173 <br><span class="themeName">Mint Choc</span></a></li>\r
174 \r
175 <li><a  id="theme_j-black-tie"><img src="../images/themeroller/theme_30_black_tie.png" alt="Black Tie" title="Black Tie" />\r
176 <br><span class="themeName">Black Tie</span></a></li>\r
177 \r
178 <li><a  id="theme_j-trontastic"><img src="../images/themeroller/theme_30_trontastic.png" alt="Trontastic" title="Trontastic" />\r
179 <br><span class="themeName">Trontastic</span></a></li>\r
180 \r
181 <li><a  id="theme_j-swanky-purse"><img src="../images/themeroller/theme_30_swanky_purse.png" alt="Swanky Purse" title="Swanky Purse" />\r
182 <br><span class="themeName">Swanky Purse</span></a></li>\r
183     </ul>\r
184 \r
185     </td><td>\r
186 \r
187     <ul>\r
188   <li><a id='theme_r-greenHdg'>Green Heading</a></li>\r
189   <li><a id='theme_r-warmfall'>Warm Fall</a></li>\r
190   <li><a id='theme_r-seaglass'>Sea Glass</a></li>\r
191   <li><a id='theme_r-coffee-with-milk'>Coffee with milk</a></li>\r
192   <li><a id='theme_r-grayedout'>Grayed out</a></li>\r
193     </ul>\r
194 \r
195   </td>\r
196   </tr>\r
197   </table>\r
198 \r
199 \r
200   </div>\r
201 </div>\r
202 \r
203 <div>\r
204   <div>Choose the Base Library</div>\r
205   <div>\r
206 <ul>\r
207 <li><a id='lib_prototype-1.6'>Prototype 1.6</a>\r
208 <li><a id='lib_prototype/1.7/prototype.js'>Prototype 1.7</a>\r
209 <li><a id='lib_jquery/1.3/jquery.min.js'>jQuery 1.3</a>\r
210 <li><a id='lib_jquery/1.4/jquery.min.js'>jQuery 1.4</a>\r
211 <li><a id='lib_jquery/1.5/jquery.min.js'>jQuery 1.5</a>\r
212 <li><a id='lib_mootools/1.2/mootools-yui-compressed.js'>MooTools 1.2</a>\r
213 <li><a id='lib_mootools/1.3/mootools-yui-compressed.js'>MooTools 1.3</a>\r
214 <li><a id='lib_dojo/1.4/dojo/dojo.xd.js'>dojo 1.4</a>\r
215 <li><a id='lib_dojo/1.5/dojo/dojo.xd.js'>dojo 1.5</a>\r
216 <li><a id='lib_ext-core/3.0/ext-core.js'>Ext 3.0</a>\r
217 <li><a id='lib_ext-core/3.1/ext-core.js'>Ext 3.1</a>\r
218 <li><a id='lib_glow.core-1.7'>Glow 1.7</a>\r
219 </ul>\r
220   </div>\r
221 </div>\r
222 \r
223 </div>\r
224 </body></html>\r