~costales/ubuntu-phone-webapps/trunk

« back to all changes in this revision

Viewing changes to xbmc/xbmc/remote.html

  • Committer: costales
  • Date: 2016-06-22 17:16:59 UTC
  • Revision ID: costales.marcos@gmail.com-20160622171659-bsi1ec8j5hma7vsp
Updated xbmc

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
<!doctype html>
 
2
<html manifest="offline.appcache">
 
3
        <head>
 
4
                <title>Kassi - Kodi/XBMC Remote Control</title>
 
5
 
 
6
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
 
7
        <meta name="viewport" content="width=320, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
 
8
        <meta name="mobile-web-app-capable" content="yes">
 
9
        <meta name="description" content="Kodi/XBMC Remote Control using Web Sockets.">
 
10
 
 
11
        <!-- Startup configuration -->
 
12
        <link rel="manifest" href="manifest.json">
 
13
 
 
14
        <meta name="theme-color" content="#3f880a">
 
15
        <link rel="icon" sizes="196x196" href="icons/196.png">
 
16
        <link rel="icon" sizes="128x128" href="icons/128.png">
 
17
 
 
18
        <!-- apple iOS stuff //-->
 
19
        <link rel="apple-touch-icon" href="icons/64.png" />
 
20
        <link rel="apple-touch-icon-precomposed" href="icons/64.png" />
 
21
        <meta name="apple-mobile-web-app-capable" content="yes">
 
22
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
 
23
 
 
24
        <!-- meta ends //------------------------->
 
25
 
 
26
        <link rel="stylesheet" href="css/fonts.css" type="text/css" />
 
27
        <link rel="stylesheet" href="css/remote.css" type="text/css" />
 
28
 
 
29
        <!-- Smartphones (portrait and landscape) //-->
 
30
        <link rel="stylesheet" media="screen and (min-device-width : 320px) and (max-device-width : 480px)" rel="stylesheet" href="css/nohover.css">
 
31
        <!-- iPhone 4 ----------- //-->
 
32
        <link rel="stylesheet" media="screen and (-webkit-min-device-pixel-ratio : 1.5), screen and (min-device-pixel-ratio : 1.5)" rel="stylesheet" href="css/nohover.css">
 
33
        <!-- iPads (portrait and landscape) //-->
 
34
        <link rel="stylesheet" media="screen and (min-device-width : 768px) and (max-device-width : 1024px)" rel="stylesheet" href="css/nohover.css">
 
35
 
 
36
 
 
37
        <script src="js/jquery-1.9.1.min.js"></script>
 
38
        <script src="js/enum.js"></script>
 
39
        <script src="js/utils.js"></script>
 
40
        <script src="js/local_data.js"></script>
 
41
                <script src="js/xbmc_socket.js"></script>
 
42
                <script src="js/remote.js"></script>
 
43
            
 
44
        </head>
 
45
        <body>
 
46
        <div id="content">
 
47
            <div id="send_pwd_panel">
 
48
                <div class="prompt">
 
49
                    <div class="header_title">Send Password</div>
 
50
                    <div class="hr"></div>
 
51
                    <div>
 
52
                        <div class="holo_field">
 
53
                            <div class="holo-field-bracket"></div>
 
54
                            <input type="password" id="sendPasswordInput" width="200px" class="pwd_text" />
 
55
                        </div>
 
56
                    </div>
 
57
 
 
58
                    <div class="clear"></div>
 
59
 
 
60
                </div>
 
61
                <div class="button_holder">
 
62
                    <div class="action_button">
 
63
                        <button class="holo-button" id="sendPasswordDataButton">Send</button>
 
64
                    </div>
 
65
                    <div class="action_button">
 
66
                        <button class="holo-button" id="backPasswordDataButton">Back</button>
 
67
                    </div>
 
68
                </div>
 
69
            </div>
 
70
            <div id="send_text_panel">
 
71
                <div class="prompt">
 
72
                    <div class="header_title">Send Text</div>
 
73
                    <div class="hr"></div>
 
74
                    <div class="holo_field">
 
75
                        <div class="holo-field-bracket"></div>
 
76
                        <input type="text" id="sendTeatArea" width="200px" class="pwd_text" />
 
77
                    </div>
 
78
 
 
79
                    <div class="clear"></div>
 
80
 
 
81
                </div>
 
82
                <div class="button_holder">
 
83
                    <div class="action_button">
 
84
                        <button class="holo-button" id="sendTextDataButton">Send</button>
 
85
                    </div>
 
86
                    <div class="action_button">
 
87
                        <button class="holo-button" id="backDataButton">Back</button>
 
88
                    </div>
 
89
                </div>
 
90
            </div>
 
91
            <div id="main">
 
92
                <div class="control_0">
 
93
                    <div id="power" class="power_off" title="Shutdown System">
 
94
                        <div class="power_icon"></div>
 
95
                    </div>
 
96
 
 
97
 
 
98
                    <div id="settings_new" title="Settings">
 
99
                        <div class="settings_new_icon"></div>
 
100
                    </div>
 
101
 
 
102
                    <div class="xbmc_logo">
 
103
 
 
104
                    </div>
 
105
 
 
106
 
 
107
                </div>
 
108
                <div class="control_1">
 
109
                    <div id="backward" title="[Ctrl + Left Arrow] keys">
 
110
                        <div class="backward_icon"></div>
 
111
                    </div>
 
112
                    <div class="gap"></div>
 
113
                    <div id="play" title="[P] Key">
 
114
                        <div class="play_icon"></div>
 
115
                    </div>
 
116
                    <div class="gap"></div>
 
117
                    <div id="forward" title="[Ctrl + Right Arrow] keys">
 
118
                        <div class="forward_icon"></div>
 
119
                    </div>
 
120
                </div>
 
121
 
 
122
                <div class="control_1_1">
 
123
                    <div id="prevTrack">
 
124
                        <div class="prevTrack_icon"></div>
 
125
                    </div>
 
126
                    <div class="gap"></div>
 
127
                    <div id="stop" title="[X] Key">
 
128
                        <div class="stop_icon"></div>
 
129
                    </div>
 
130
                    <div class="gap"></div>
 
131
                    <div id="pause" title="Spacebar">
 
132
                        <div class="pause_icon"></div>
 
133
                    </div>
 
134
                    <div class="gap"></div>
 
135
                    <div id="nextTrack">
 
136
                        <div class="nextTrack_icon"></div>
 
137
                    </div>
 
138
                </div>
 
139
 
 
140
                <div class="control_2">
 
141
                    <div class="sub_control_1">
 
142
                        <div class="sub_whole">
 
143
                            <div class="sub_title">Player</div>
 
144
                            <div id="osd" class="sub_circle" title="[Z] Key"></div>
 
145
 
 
146
                        </div>
 
147
                        <div class="gap_sub"></div>
 
148
                        <div id="upArrow" class="up_arrow" title="Up Arrow Key">
 
149
                            <div class="upArrow_icon"></div>
 
150
                        </div>
 
151
                        <div class="gap_sub"></div>
 
152
                        <div class="sub_whole">
 
153
                            <div class="sub_title">Info</div>
 
154
                            <div id="info" class="sub_circle" title="[I] Key"></div>
 
155
                        </div>
 
156
                    </div>
 
157
 
 
158
                    <div class="sub_control_2">
 
159
                        <div id="leftArrow" class="left_arrow" title="Left Arrow Key">
 
160
                            <div class="leftArrow_icon"></div>
 
161
                        </div>
 
162
                        <div class="gap_sub_2"></div>
 
163
                        <div id="selectButton" class="select" title="Enter Key">
 
164
                            <div class="select_icon"></div>
 
165
                        </div>
 
166
                        <div class="gap_sub_2"></div>
 
167
                        <div id="rightArrow" class="right_arrow" title="Right Arrow Key">
 
168
                            <div class="rightArrow_icon"></div>
 
169
                        </div>
 
170
                    </div>
 
171
 
 
172
                    <div class="sub_control_1">
 
173
                        <div class="sub_whole">
 
174
                            <div class="sub_top_gap"></div>
 
175
                            <div id="menu" class="sub_circle" title="[H] Key"></div>
 
176
                            <div class="sub_top_gap"></div>
 
177
                            <div class="sub_title">Menu</div>
 
178
                        </div>
 
179
                        <div class="gap_sub"></div>
 
180
                        <div id="downArrow" class="down_arrow" title="Down Arrow Key">
 
181
                            <div class="downArrow_icon"></div>
 
182
                        </div>
 
183
                        <div class="gap_sub"></div>
 
184
                        <div class="sub_whole">
 
185
                            <div class="sub_top_gap"></div>
 
186
                            <div id="back" class="sub_circle" title="Backspace"></div>
 
187
                            <div class="sub_top_gap"></div>
 
188
                            <div class="sub_title">Back</div>
 
189
                        </div>
 
190
                    </div>
 
191
 
 
192
                </div>
 
193
 
 
194
                <div class="control_1_2">
 
195
                    <div class="sub_whole">
 
196
                        <div class="sub_top_gap"></div>
 
197
                        <div id="sendTextButton" class="sub_circle"></div>
 
198
                        <div class="sub_top_gap"></div>
 
199
                        <div class="sub_title_2">Send Text</div>
 
200
                    </div>
 
201
 
 
202
                    <div class="gap_2"></div>
 
203
 
 
204
                    <div class="sub_whole">
 
205
                        <div class="sub_top_gap"></div>
 
206
                        <div id="update_library" class="sub_circle"></div>
 
207
                        <div class="sub_top_gap"></div>
 
208
                        <div class="sub_title_2">Update Library</div>
 
209
                    </div>
 
210
 
 
211
                    <div class="gap_2"></div>
 
212
 
 
213
                    <div class="sub_whole">
 
214
                        <div class="sub_top_gap"></div>
 
215
                        <div id="mute" class="sub_circle" title="[M] Key (To control volume use 'Ctrl + Up' and 'Ctrl + Down')"></div>
 
216
                        <div class="sub_top_gap"></div>
 
217
                        <div class="sub_title_2">Mute</div>
 
218
                    </div>
 
219
 
 
220
                    <div class="gap_2"></div>
 
221
 
 
222
                    <div class="sub_whole">
 
223
                        <div class="sub_top_gap"></div>
 
224
                        <div id="context_menu" class="sub_circle" title="[Ctrl + O] keys"></div>
 
225
                        <div class="sub_top_gap"></div>
 
226
                        <div class="sub_title_2">Context Menu</div>
 
227
                    </div>
 
228
 
 
229
 
 
230
 
 
231
                </div>
 
232
 
 
233
                <div class="clear"></div>
 
234
 
 
235
            </div>
 
236
 
 
237
            <div id="footer">
 
238
                <div class="footer_left">
 
239
                    <a id="popOut">Pop-out</a>
 
240
                </div>
 
241
                <!-- <div class="footer_right">
 
242
                    <a id="settings">Settings</a>
 
243
                </div> //-->
 
244
                <div class="clear"></div>
 
245
            </div>
 
246
 
 
247
        </div>
 
248
        </body>
 
249
</html>