2
<html manifest="offline.appcache">
4
<title>Kassi - Kodi/XBMC Remote Control</title>
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.">
11
<!-- Startup configuration -->
12
<link rel="manifest" href="manifest.json">
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">
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">
24
<!-- meta ends //------------------------->
26
<link rel="stylesheet" href="css/fonts.css" type="text/css" />
27
<link rel="stylesheet" href="css/remote.css" type="text/css" />
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">
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>
47
<div id="send_pwd_panel">
49
<div class="header_title">Send Password</div>
50
<div class="hr"></div>
52
<div class="holo_field">
53
<div class="holo-field-bracket"></div>
54
<input type="password" id="sendPasswordInput" width="200px" class="pwd_text" />
58
<div class="clear"></div>
61
<div class="button_holder">
62
<div class="action_button">
63
<button class="holo-button" id="sendPasswordDataButton">Send</button>
65
<div class="action_button">
66
<button class="holo-button" id="backPasswordDataButton">Back</button>
70
<div id="send_text_panel">
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" />
79
<div class="clear"></div>
82
<div class="button_holder">
83
<div class="action_button">
84
<button class="holo-button" id="sendTextDataButton">Send</button>
86
<div class="action_button">
87
<button class="holo-button" id="backDataButton">Back</button>
92
<div class="control_0">
93
<div id="power" class="power_off" title="Shutdown System">
94
<div class="power_icon"></div>
98
<div id="settings_new" title="Settings">
99
<div class="settings_new_icon"></div>
102
<div class="xbmc_logo">
108
<div class="control_1">
109
<div id="backward" title="[Ctrl + Left Arrow] keys">
110
<div class="backward_icon"></div>
112
<div class="gap"></div>
113
<div id="play" title="[P] Key">
114
<div class="play_icon"></div>
116
<div class="gap"></div>
117
<div id="forward" title="[Ctrl + Right Arrow] keys">
118
<div class="forward_icon"></div>
122
<div class="control_1_1">
124
<div class="prevTrack_icon"></div>
126
<div class="gap"></div>
127
<div id="stop" title="[X] Key">
128
<div class="stop_icon"></div>
130
<div class="gap"></div>
131
<div id="pause" title="Spacebar">
132
<div class="pause_icon"></div>
134
<div class="gap"></div>
136
<div class="nextTrack_icon"></div>
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>
147
<div class="gap_sub"></div>
148
<div id="upArrow" class="up_arrow" title="Up Arrow Key">
149
<div class="upArrow_icon"></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>
158
<div class="sub_control_2">
159
<div id="leftArrow" class="left_arrow" title="Left Arrow Key">
160
<div class="leftArrow_icon"></div>
162
<div class="gap_sub_2"></div>
163
<div id="selectButton" class="select" title="Enter Key">
164
<div class="select_icon"></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>
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>
179
<div class="gap_sub"></div>
180
<div id="downArrow" class="down_arrow" title="Down Arrow Key">
181
<div class="downArrow_icon"></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>
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>
202
<div class="gap_2"></div>
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>
211
<div class="gap_2"></div>
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>
220
<div class="gap_2"></div>
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>
233
<div class="clear"></div>
238
<div class="footer_left">
239
<a id="popOut">Pop-out</a>
241
<!-- <div class="footer_right">
242
<a id="settings">Settings</a>
244
<div class="clear"></div>