libs/js/jquery-mobile-1.1.0/tests/unit/kitchensink/index.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3 <head>
   4         <meta charset="UTF-8" />
   5         <title>jQuery Mobile Kitchen Sink Test Suite</title>
   6         <!-- meta viewport left out on purpose for test append -->
   7         <script src="../../../external/requirejs/require.js"></script>
   8         <script src="../../../js/jquery.tag.inserter.js"></script>
   9         <script src="../../../external/qunit.js"></script>
  10         <script src="../../../js/jquery.js"></script>
  11         <script src="../jquery.setNameSpace.js"></script>
  12         <script src="../../jquery.testHelper.js"></script>
  13         <script src="../../../js/"></script>
  14
  15         <script>
  16                 $.testHelper.asyncLoad([
  17                         [ "jquery.mobile.init" ],
  18                         [ "kitchensink_core.js" ]
  19                 ]);
  20         </script>
  21
  22         <link rel="stylesheet"  href="../../../css/themes/default/jquery.mobile.css" />
  23         <link rel="stylesheet" href="../../../external/qunit.css"/>
  24
  25         <script src="../swarminject.js"></script>
  26 </head>
  27 <body>
  28
  29 <h1 id="qunit-header">jQuery Mobile Kitchen Sink Test Suite</h1>
  30 <h2 id="qunit-banner"></h2>
  31 <h2 id="qunit-userAgent"></h2>
  32 <ol id="qunit-tests">
  33 </ol>
  34
  35 <div data-nstest-role="page" id="default">
  36         <div data-nstest-role="header" data-nstest-position="fixed" data-nstest-theme="a">
  37                 <h1>Fixed toolbars</h1>
  38                 <a href="../../" data-nstest-icon="home" data-nstest-iconpos="notext" data-nstest-direction="reverse">Home</a>
  39                 <a href="../nav.html" data-nstest-icon="search" data-nstest-iconpos="notext" data-nstest-rel="dialog" data-nstest-transition="fade">Search</a>
  40         </div>
  41
  42   <div data-nstest-role="content" id="control-group-content">
  43
  44          <h2>Form Elements in Fieldcontains</h2>
  45         <div data-nstest-role="fieldcontain">
  46      <label for="name">Text Input:</label>
  47      <input type="text" name="name" id="name" value=""  />
  48         </div>
  49
  50         <div data-nstest-role="fieldcontain">
  51         <label for="textarea">Textarea:</label>
  52         <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
  53         </div>
  54
  55         <div data-nstest-role="fieldcontain">
  56      <label for="search">Search Input:</label>
  57      <input type="search" name="password" id="search" value=""  />
  58         </div>
  59
  60         <div data-nstest-role="fieldcontain">
  61                 <label for="slider2">Flip switch:</label>
  62                 <select name="slider2" id="slider2" data-nstest-role="slider">
  63                         <option value="off">Off</option>
  64                         <option value="on">On</option>
  65                 </select>
  66         </div>
  67
  68         <div data-nstest-role="fieldcontain">
  69                 <label for="slider">Slider:</label>
  70                 <input type="range" name="slider" id="slider" value="50" min="0" max="100" data-nstest-highlight="true"  />
  71         </div>
  72
  73         <div data-nstest-role="fieldcontain">
  74         <fieldset data-nstest-role="controlgroup">
  75                 <legend>Choose as many snacks as you'd like:</legend>
  76                 <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
  77                 <label for="checkbox-1a">Cheetos</label>
  78
  79                 <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
  80                 <label for="checkbox-2a">Doritos</label>
  81
  82                 <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
  83                 <label for="checkbox-3a">Fritos</label>
  84
  85                 <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
  86                 <label for="checkbox-4a">Sun Chips</label>
  87     </fieldset>
  88         </div>
  89
  90         <div data-nstest-role="fieldcontain">
  91         <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
  92         <legend>Font styling:</legend>
  93         <input type="checkbox" name="checkbox-6" id="checkbox-6" class="custom" />
  94                 <label for="checkbox-6">b</label>
  95
  96                 <input type="checkbox" name="checkbox-7" id="checkbox-7" class="custom" />
  97                 <label for="checkbox-7"><em>i</em></label>
  98
  99                 <input type="checkbox" name="checkbox-8" id="checkbox-8" class="custom" />
 100                 <label for="checkbox-8">u</label>
 101     </fieldset>
 102         </div>
 103
 104         <div data-nstest-role="fieldcontain">
 105             <fieldset data-nstest-role="controlgroup" data-nstest-theme="c">
 106                 <legend>Choose a pet:</legend>
 107                         <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
 108                         <label for="radio-choice-1">Cat</label>
 109
 110                         <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2"  />
 111                         <label for="radio-choice-2">Dog</label>
 112
 113                         <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3"  />
 114                         <label for="radio-choice-3">Hamster</label>
 115
 116                         <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4"  />
 117                         <label for="radio-choice-4">Lizard</label>
 118             </fieldset>
 119         </div>
 120
 121         <div data-nstest-role="fieldcontain">
 122             <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
 123                 <legend>Layout view:</legend>
 124                         <input type="radio" name="radio-choice-b" id="radio-choice-c" value="on" checked="checked" />
 125                         <label for="radio-choice-c">List</label>
 126                         <input type="radio" name="radio-choice-b" id="radio-choice-d" value="off" />
 127                         <label for="radio-choice-d">Grid</label>
 128                         <input type="radio" name="radio-choice-b" id="radio-choice-e" value="other" />
 129                         <label for="radio-choice-e">Gallery</label>
 130             </fieldset>
 131         </div>
 132
 133         <div data-nstest-role="fieldcontain">
 134                 <label for="select-choice-1" class="select">Choose shipping method:</label>
 135                 <select name="select-choice-1" id="select-choice-1">
 136                         <option value="standard">Standard: 7 day</option>
 137                         <option value="rush">Rush: 3 days</option>
 138                         <option value="express">Express: next day</option>
 139                         <option value="overnight">Overnight</option>
 140                 </select>
 141         </div>
 142
 143         <div data-nstest-role="fieldcontain">
 144                 <label for="select-choice-3" class="select">Your state:</label>
 145                 <select name="select-choice-3" id="select-choice-3">
 146                         <option value="AL">Alabama</option>
 147                         <option value="AK">Alaska</option>
 148                         <option value="AZ">Arizona</option>
 149                         <option value="AR">Arkansas</option>
 150                         <option value="CA">California</option>
 151                 </select>
 152         </div>
 153
 154         <div data-nstest-role="fieldcontain">
 155                 <label for="select-choice-a" class="select">Choose shipping method:</label>
 156                 <select name="select-choice-a" id="select-choice-a" data-nstest-native-menu="false">
 157                         <option>Custom menu example</option>
 158                         <option value="standard">Standard: 7 day</option>
 159                         <option value="rush">Rush: 3 days</option>
 160                         <option value="express">Express: next day</option>
 161                         <option value="overnight">Overnight</option>
 162                 </select>
 163         </div>
 164
 165   </div>
 166         <div data-nstest-role="footer" id="control-group-footer" class="ui-bar" data-nstest-position="inline">
 167                 <div data-nstest-role="controlgroup" data-nstest-type="horizontal">
 168                         <a href="index.html" data-nstest-icon="delete">Remove</a>
 169                         <a href="index.html" data-nstest-icon="plus">Add</a>
 170                         <a href="index.html" data-nstest-icon="arrow-u">Up</a>
 171                         <a href="index.html" data-nstest-icon="arrow-d">Down</a>
 172                 </div>
 173         </div>
 174
 175  <h2>Mini Form Elements</h2>
 176
 177     <label for="name">Text Input:</label>
 178     <input type="text" name="name" id="name" value="" data-nstest-mini="true" />
 179
 180         <label for="textarea">Textarea:</label>
 181         <textarea cols="40" rows="8" name="textarea" id="textarea" data-nstest-mini="true"></textarea>
 182
 183     <label for="search">Search Input:</label>
 184     <input type="search" name="password" id="search" value="" data-nstest-mini="true" />
 185
 186         <label for="slider2">Flip switch:</label>
 187         <select name="slider2" id="slider2" data-nstest-role="slider" data-nstest-mini="true">
 188                 <option value="off">Off</option>
 189                 <option value="on">On</option>
 190         </select>
 191
 192         <div data-nstest-role="fieldcontain">
 193                 <label for="slider">Slider:</label>
 194                 <input type="range" name="slider" id="slider" value="50" min="0" max="100" data-nstest-highlight="true" data-nstest-mini="true" />
 195         </div>
 196
 197         <div data-nstest-role="fieldcontain">
 198         <fieldset data-nstest-role="controlgroup" data-nstest-mini="true">
 199                 <!-- Mini set on controlgroup -->
 200
 201                 <legend>Choose as many snacks as you'd like:</legend>
 202                 <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
 203                 <label for="checkbox-1a">Cheetos</label>
 204
 205                 <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
 206                 <label for="checkbox-2a">Doritos</label>
 207
 208                 <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
 209                 <label for="checkbox-3a">Fritos</label>
 210
 211                 <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
 212                 <label for="checkbox-4a">Sun Chips</label>
 213       </fieldset>
 214         </div>
 215
 216         <div data-nstest-role="fieldcontain">
 217         <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal" data-nstest-mini="true">
 218
 219         <legend>Font styling:</legend>
 220         <input type="checkbox" name="checkbox-6" id="checkbox-6" class="custom" />
 221                 <label for="checkbox-6">b</label>
 222
 223                 <input type="checkbox" name="checkbox-7" id="checkbox-7" class="custom" />
 224                 <label for="checkbox-7"><em>i</em></label>
 225
 226                 <input type="checkbox" name="checkbox-8" id="checkbox-8" class="custom" />
 227                 <label for="checkbox-8">u</label>
 228       </fieldset>
 229         </div>
 230
 231         <div data-nstest-role="fieldcontain">
 232                 <input type="checkbox" name="radio-gaga" id="radio-gaga" value="choice-1" data-nstest-mini="true" data-nstest-mini="true" />
 233             <label for="radio-gaga">Unchecked by Default</label>
 234
 235                 <input type="checkbox" name="radio-googoo" id="radio-googoo" value="choice-1" data-nstest-mini="true" checked="checked" data-nstest-mini="true" />
 236             <label for="radio-googoo">Checked by Default</label>
 237         </div>
 238
 239         <div data-nstest-role="fieldcontain">
 240             <fieldset data-nstest-role="controlgroup" data-nstest-theme="c" >
 241                         <!-- Mini set on individual elements. -->
 242
 243                 <legend>Choose a pet:</legend>
 244                         <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
 245                         <label for="radio-choice-1">Cat</label>
 246
 247                         <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" data-nstest-mini="true"/>
 248                         <label for="radio-choice-2">Dog</label>
 249
 250                         <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
 251                         <label for="radio-choice-3">Hamster</label>
 252
 253                         <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
 254                         <label for="radio-choice-4">Lizard</label>
 255             </fieldset>
 256         </div>
 257
 258         <div data-nstest-role="fieldcontain">
 259             <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
 260                 <legend>Layout view:</legend>
 261                         <input type="radio" name="radio-choice-b" id="radio-choice-c" value="on" checked="checked" />
 262                         <label for="radio-choice-c">List</label>
 263                         <input type="radio" name="radio-choice-b" id="radio-choice-d" value="off" />
 264                         <label for="radio-choice-d">Grid</label>
 265                         <input type="radio" name="radio-choice-b" id="radio-choice-e" value="other" />
 266                         <label for="radio-choice-e">Gallery</label>
 267             </fieldset>
 268         </div>
 269
 270         <div data-nstest-role="fieldcontain">
 271                 <label for="select-choice-1" class="select">Choose shipping method:</label>
 272                 <select name="select-choice-1" id="select-choice-1">
 273                         <option value="standard">Standard: 7 day</option>
 274                         <option value="rush">Rush: 3 days</option>
 275                         <option value="express">Express: next day</option>
 276                         <option value="overnight">Overnight</option>
 277                 </select>
 278         </div>
 279
 280         <div data-nstest-role="fieldcontain">
 281                 <label for="select-choice-3" class="select">Your state:</label>
 282                 <select name="select-choice-3" id="select-choice-3">
 283                         <option value="AL">Alabama</option>
 284                         <option value="AK">Alaska</option>
 285                         <option value="AZ">Arizona</option>
 286                         <option value="AR">Arkansas</option>
 287                         <option value="CA">California</option>
 288                 </select>
 289         </div>
 290
 291         <div data-nstest-role="fieldcontain">
 292                 <label for="select-choice-a" class="select">Choose shipping method:</label>
 293                 <select name="select-choice-a" id="select-choice-a" data-nstest-native-menu="false">
 294                         <option>Custom menu example</option>
 295                         <option value="standard">Standard: 7 day</option>
 296                         <option value="rush">Rush: 3 days</option>
 297                         <option value="express">Express: next day</option>
 298                         <option value="overnight">Overnight</option>
 299                 </select>
 300         </div>
 301
 302         <div data-nstest-role="footer" id="control-group-footer" class="ui-bar" data-nstest-position="inline">
 303                 <div data-nstest-role="controlgroup" data-nstest-type="horizontal">
 304                         <a href="index.html" data-nstest-icon="delete">Remove</a>
 305                         <a href="index.html" data-nstest-icon="plus">Add</a>
 306                         <a href="index.html" data-nstest-icon="arrow-u">Up</a>
 307                         <a href="index.html" data-nstest-icon="arrow-d">Down</a>
 308                 </div>
 309         </div>
 310
 311
 312                 <h2>Simple list</h2>
 313
 314                 <ul data-nstest-role="listview">
 315                         <li><a href="index.html">Acura</a></li>
 316                         <li><a href="index.html">Audi</a></li>
 317                         <li><a href="index.html">BMW</a></li>
 318                 </ul>
 319
 320                 <h2>Mini list</h2>
 321                 <ul data-nstest-role="listview" data-nstest-mini="true">
 322                         <li><a href="index.html">Cooper</a></li>
 323                         <li><a href="index.html">Cooper S</a></li>
 324                         <li><a href="index.html">Clubman</a></li>
 325                 </ul>
 326
 327                 <h2>Individual mini item</h2>
 328                 <ul data-nstest-role="listview">
 329                         <li><a href="index.html">Cooper</a></li>
 330                         <li data-nstest-mini="true"><a href="index.html">Cooper S</a></li>
 331                         <li><a href="index.html">Clubman</a></li>
 332                 </ul>
 333
 334
 335
 336
 337         <h2>Count bubbles</h2>
 338         <ul data-nstest-role="listview">
 339                 <li><a href="index.html">Inbox <span class="ui-li-count">12</span></a></li>
 340                         <li><a href="index.html">Outbox <span class="ui-li-count">0</span></a></li>
 341                         <li><a href="index.html">Drafts <span class="ui-li-count">4</span></a></li>
 342                         <li><a href="index.html">Sent <span class="ui-li-count">328</span></a></li>
 343                         <li><a href="index.html">Trash <span class="ui-li-count">62</span></a></li>
 344         </ul>
 345
 346         <h2>Numbered list</h2>
 347                 <ol data-nstest-role="listview">
 348                         <li><a href="index.html">The Godfather</a></li>
 349                         <li><a href="index.html">Inception</a></li>
 350                         <li><a href="index.html">The Good, the Bad and the Ugly </a></li>
 351                         <li><a href="index.html">Pulp Fiction</a></li>
 352                         <li><a href="index.html">Schindler's List</a></li>
 353                 </ol>
 354
 355         <h2>Divided, formatted content</h2>
 356         <ul data-nstest-role="listview">
 357                 <li><a href="index.html">
 358                         <h3>Stephen Weber</h3>
 359                         <p><strong>You've been invited to a meeting at Filament Group in Boston, MA</strong></p>
 360                         <p>Hey Stephen, if you're available at 10am tomorrow, we've got a meeting with the jQuery team.</p>
 361                         <p class="ui-li-aside"><strong>6:24</strong>PM</p>
 362                 </a></li>
 363                 <li><a href="index.html">
 364                         <h3>jQuery Team</h3>
 365                         <p><strong>Boston Conference Planning</strong></p>
 366                         <p>In preparation for the upcoming conference in Boston, we need to start gathering a list of sponsors and speakers.</p>
 367                         <p class="ui-li-aside"><strong>9:18</strong>AM</p>
 368                 </a></li>
 369         </ul>
 370
 371
 372
 373         <h2>Icon list</h2>
 374         <ul data-nstest-role="listview" data-nstest-theme="a">
 375                 <li><a href="index.html"><img src="../../../docs/lists/../../../docs/lists/images/gf.png" alt="France" class="ui-li-icon">France <span class="ui-li-count">4</span></a></li>
 376                 <li><a href="index.html"><img src="../../../docs/lists/images/de.png" alt="Germany" class="ui-li-icon">Germany <span class="ui-li-count">4</span></a></li>
 377                 <li data-nstest-theme="b"><a href="index.html"><img src="../../../docs/lists/images/gb.png" alt="Great Britain" class="ui-li-icon">Great Britain <span class="ui-li-count">0</span></a></li>
 378                 <li><a href="index.html"><img src="../../../docs/lists/images/fi.png" alt="Finland" class="ui-li-icon">Finland <span class="ui-li-count">12</span></a></li>
 379                 <li><a href="index.html"><img src="../../../docs/lists/images/sj.png" alt="Norway" class="ui-li-icon">Norway <span class="ui-li-count">328</span></a></li>
 380                 <li><a href="index.html"><img src="../../../docs/lists/images/us.png" alt="United States" class="ui-li-icon">United States <span class="ui-li-count">62</span></a></li>
 381         </ul>
 382
 383         <h2>Thumbnail, split button list</h2>
 384
 385                 <ul data-nstest-role="listview">
 386                         <li><a href="index.html">
 387                         <img src="../../../docs/lists/images/album-bb.jpg" />
 388                         <h3>Broken Bells</h3>
 389                         <p>Broken Bells</p>
 390                         </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
 391                 </a></li>
 392                 <li><a href="index.html">
 393                         <img src="../../../docs/lists/images/album-hc.jpg" />
 394                         <h3>Warning</h3>
 395                         <p>Hot Chip</p>
 396                 </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
 397                 </a></li>
 398                 <li><a href="index.html">
 399                         <img src="../../../docs/lists/images/album-p.jpg" />
 400                         <h3>Wolfgang Amadeus Phoenix</h3>
 401                         <p>Phoenix</p>
 402                         </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
 403                 </a></li>
 404                 </ul>
 405
 406         <h2>Divided, filterable list</h2>
 407                 <ul data-nstest-role="listview" data-nstest-filter="true">
 408                         <li data-nstest-role="list-divider">A</li>
 409                         <li><a href="index.html">Adam Kinkaid</a></li>
 410                         <li><a href="index.html">Alex Wickerham</a></li>
 411                         <li><a href="index.html">Avery Johnson</a></li>
 412                         <li data-nstest-role="list-divider">B</li>
 413                         <li><a href="index.html">Bob Cabot</a></li>
 414                         <li data-nstest-role="list-divider">C</li>
 415                         <li><a href="index.html">Caleb Booth</a></li>
 416                         <li><a href="index.html">Christopher Adams</a></li>
 417                 </ul>
 418
 419 </div>
 420 </body>
 421 </html>