index.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4         <meta charset="utf-8" />
   5         <meta name="description" content="Mediacontent API Tutorial"/>
   6
   7         <title>Mediacontent</title>
   8         <script src="/usr/share/tizen-web-ui-fw/latest/js/jquery.min.js"></script>
   9         <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
  10         <script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js" data-framework-viewport-scale="false"></script>
  11         <script type="text/javascript" src="./js/main.js"></script>
  12         <link rel="stylesheet" type="text/css" href="./css/style.css"/>
  13 </head>
  14
  15 <body>
  16
  17         <div data-role="page" data-add-back-btn="header" id="main">
  18                 <div data-role="header" data-position="fixed">
  19                         <h1>Media content</h1>
  20                 </div>
  21
  22                 <div data-role="content">
  23                         <ul data-role="listview" id="folder-list">
  24                                 <li data-role="list-divider">Storage type</li>
  25                                 <li id="folder-type-all">
  26                                         ALL
  27                                 </li>
  28                                 <li id="folder-type-internal">
  29                                         INTERNAL
  30                                 </li>
  31                                 <li id="folder-type-external">
  32                                         EXTERNAL
  33                                 </li>
  34                                 <li data-role="list-divider" id="folder-text">Folders</li>
  35                         </ul>
  36                 </div>
  37         </div>
  38
  39         <div data-role="page" data-add-back-btn="header" id="items">
  40                 <div data-role="header" data-position="fixed">
  41                         <h1 id="items-title"></h1>
  42                 </div>
  43
  44                 <div data-role="content">
  45                         <ul data-role="listview" id="items-list">
  46                                 <li data-role="list-divider">Item type</li>
  47                                 <li class="ui-li-has-radio">
  48                                         ALL
  49                                         <input type="radio" name="item-type" id="item-type-all" value="ALL" checked="checked"/>
  50                                 </li>
  51                                 <li class="ui-li-has-radio">
  52                                         IMAGE
  53                                         <input type="radio" name="item-type" id="item-type-image" value="IMAGE"/>
  54                                 </li>
  55                                 <li class="ui-li-has-radio">
  56                                         VIDEO
  57                                         <input type="radio" name="item-type" id="item-type-video" value="VIDEO"/>
  58                                 </li>
  59                                 <li class="ui-li-has-radio">
  60                                         AUDIO
  61                                         <input type="radio" name="item-type" id="item-type-audio" value="AUDIO"/>
  62                                 </li>
  63                                 <li data-role="list-divider">Items</li>
  64                         </ul>
  65                 </div>
  66         </div>
  67
  68         <div data-role="page" data-add-back-btn="header" id="detail">
  69                 <div data-role="header" data-position="fixed">
  70                         <h1>Details</h1>
  71                 </div>
  72
  73                 <div data-role="content">
  74                         <ul data-role="listview" id="media-details">
  75                         </ul>
  76                 </div>
  77
  78                 <div data-role="footer" data-position="fixed">
  79                 </div>
  80         </div>
  81 </body>
  82 </html>