[Mediacontent]update Mediacontent(tizen_2.1)
[samples/web/Mediacontent.git] / 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="tizen-web-ui-fw/latest/js/jquery.min.js"></script>
9         <script src="tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
10         <script src="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="true" 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
38                 <div data-role="footer" data-position="fixed">
39                 </div>
40         </div>
41
42         <div data-role="page" data-add-back-btn="true" id="items">
43                 <div data-role="header" data-position="fixed">
44                         <h1 id="items-title"></h1>
45                 </div>
46
47                 <div data-role="content">
48                         <ul data-role="listview" id="items-list">
49                                 <li data-role="list-divider">Item type</li>
50                                 <li class="ui-li-has-radio">
51                                         All
52                                         <input type="radio" name="item-type" id="item-type-all" value="ALL" checked="checked"/>
53                                 </li>
54                                 <li class="ui-li-has-radio">
55                                         IMAGE
56                                         <input type="radio" name="item-type" id="item-type-image" value="IMAGE"/>
57                                 </li>
58                                 <li class="ui-li-has-radio">
59                                         VIDEO
60                                         <input type="radio" name="item-type" id="item-type-video" value="VIDEO"/>
61                                 </li>
62                                 <li class="ui-li-has-radio">
63                                         AUDIO
64                                         <input type="radio" name="item-type" id="item-type-audio" value="AUDIO"/>
65                                 </li>
66                                 <li data-role="list-divider">Items</li>
67                         </ul>
68                 </div>
69
70                 <div data-role="footer" data-position="fixed">
71                 </div>
72         </div>
73
74         <div data-role="page" data-add-back-btn="true" id="detail">
75                 <div data-role="header" data-position="fixed">
76                         <h1>DETAILS</h1>
77                 </div>
78
79                 <div data-role="content">
80                         <ul data-role="listview" id="media-details">
81                         </ul>
82                 </div>
83
84                 <div data-role="footer" data-position="fixed">
85                 </div>
86         </div>
87 </body>
88 </html>