-
Notifications
You must be signed in to change notification settings - Fork 0
/
freebox-rc.html
283 lines (273 loc) · 9.29 KB
/
freebox-rc.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel="icon" type="image/png" href="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABHNCSVQICAgIfAhkiAAAAc9JREFU
aIHtmlFOwkAQhj9RQw9gQuIJ1GMYHwS9gAmSeB15Vg8gxhfjDfQa+owISDyAMSg+tJihdmm7zLYQ
90sayu7235ns7HRKAc/qUQXawACYKB2DSLNahANtRcPjx3kRDgwdOjDMa8yahQOTBa9X1awoGVAa
K+/AhiPdADgAdqLvT8AD8OFovlzITZdEA+jxd4P2gLqlpirzJmsAY8xZZkyyE0vhQAC8ir434BK4
YPam9xKNzaLpBNNkx6J9CNRE3xazTjQyaqaimYX2xPkd4QpMeQfuDWMXQtOBtJuRbCskVEyYlvtI
tI+AbdFXI1wR9RCyYd4mlulzBFwRbmRZP3VZ0k0MYYpMS6OHOTXVSZusTpgq48Z3STY+i6YRV9Vo
AOwDu9H4Z+ARcylhXY36crpsvANlo/k8UAGa0XkH+M7ZXximlNcS7a2E6+b1L0UxVwqaIdSJPifA
jUW/Ff4+UDYustA0ROJZZh04BT6BW0p8JsiShZrxi4Az0X+SUTMVVyGUpPslzje1JvJZSMkOn4U0
8LVQgmYqPoQEPgvZaK58CP1LB+SrUNMvcHmPKYO8xtg40EkfYs21Q+1fqoRv1PvorUA/0izkrwYe
TX4AAKAxir1ygY0AAAAASUVORK5CYII=" />
<title>Télécommande Freebox V5</title>
<style>
/* Use all available space */
body {
width: 100%;
margin: 0;
padding: 0;
}
table {
width: 100%;
margin: 0;
padding: 0;
border-collapse: collapse;
}
/* Ensure a miminum and constant line height that allows to display correctly all butonns */
tr {
height: 8em;
}
/* Tab cells are the remote control buttons */
td {
touch-action: manipulation; /* Prevent double tap zoom on touch device */
user-select: none; /* Prevent text selection on double click/tap */
font-family: 'verdana';
font-size: 5em;
text-align: center;
color: white;
background-color: #b3b6b7;
width: 33.33%; /* 3 buttons per line */
}
td[onclick]:active {
background-color: #c3c6c7;
}
/* Red remote control button */
td.red {
background: #a93226;
}
td.red:active {
background-color: #b94236;
}
/* Green remote control button */
td.green {
background: #229954;
}
td.green:active {
background: #32a964;
}
/* Yellow remote control button */
td.yellow {
background: #d4ac0d;
}
td.yellow:active {
background: #e4bc1d;
}
/* Blue remote control button */
td.blue {
background: #2e86c1;
}
td.blue:active {
background: #3e96d1;
}
/* "Home" remote control button */
td.home {
color: #a93226;
}
/* Remote control button with full text caption */
td.caption {
font-size: 3em;
}
/* Power control button */
td.power {
color: #a93226;
}
</style>
<script>
// Documentation of the virtual remote control HTTP API for freebox V5 is available on this dev ticket:
// - https://dev.freebox.fr/bugs/task/4327
// Note: this API is deprecated
// URL of freebox multimedia devise (HD1)
var freebox_hd_rc_url="http://hd1.freebox.fr/pub/remote_control"; // HTTPS not available on Freebox V5
// Duration of vibration feedback on key pressed on mobile device
var vibration_duration = 10; // in ms
// Configuration of the remote control security code
// The security code is stored as is (in clear) in browser local cache (localStorage)
function configureCode() {
var localStorage = window.localStorage;
var oldCode = localStorage.getItem("code");
if (oldCode == null) {
oldCode = "";
}
var newCode = prompt("Entrer le code télécommande (8 chiffres)", oldCode);
if (newCode != null)
localStorage.setItem("code", newCode);
}
// Retrieval of configured remote controle security code
function getCode() {
var localStorage = window.localStorage;
var code = localStorage.getItem("code");
while (code == null) {
configureCode();
code = localStorage.getItem("code");
}
return code;
}
// Send a single virtual key to multimedia device
// Parameter:
// - key code
function sendKey(key) {
if (window.navigator.vibrate) {
window.navigator.vibrate(vibration_duration); // haptic feedback
}
sendRequest(key, false);
}
// Unique token to bypass image caching by the broser in hack for Mixed-Content requests (see sendRequest() below)
var uniqueRequestToken = new Date().getTime();
// Send a virtual key to the mutimedia device using a HTTP request
// Parameters
// - key code
// - flag for long press (optionel)
function sendRequest(key, long) {
// Retrieve configured security code
var securityCode = getCode();
// Build URL to call with key code and long-press flag
var url = freebox_hd_rc_url + "?code=" + securityCode + "&key=" + key;
if (long)
url += "&long=true";
if (window.location.protocol == "https:") {
// Need to send a HTTP request (Freebox V5 API does not support HTTPS) from a HTTPS site, which is bad
// and blocked by the brower. A hackish workaround is to send a GET request using image loading. This
// prevents Mixed-Content request from being blocked by the browser.
// This hack does not work anymore with Chrome 81+
// Note: a timestamp is added to bypass browser cache.
new Image().src = url + "&t=" + uniqueRequestToken;
uniqueRequestToken++;
} else {
var xmlHttp = new XMLHttpRequest();
xmlHttp.open( "GET", url, true ); // true for asynchronous request
xmlHttp.send( null ); // Fire and forget (no callback). Might be good to handle errors at some point
}
}
// Buffer for storage of multiple numeric keys pressed rapidely (ex: channel 14)
var rapidKeyPressBuffer = "";
// Maximum inverval between two rapid key press (in ms). After this delay all stored key pressed are sent to multimedia device.
// 500 ms is rather small, user needs to be quite fast.
var rapidKeyPressInterval = 1000;
// Timeout for sending stored keys
var rapidKeyPressTimeout;
// Send a numeric key to the multimedia device
// If several keys are pressed rapidely, they are stored in a buffer before being sent to the multimedia device
function sendNumericKey(key) {
if (window.navigator.vibrate) {
window.navigator.vibrate(vibration_duration); // haptic feedback
}
// Storage of the key in the buffer
rapidKeyPressBuffer = rapidKeyPressBuffer + key;
// Cancellation of previous timeout
window.clearTimeout(rapidKeyPressTimeout);
// New timeout to send buffered keys after the delay is reached
rapidKeyPressTimeout = window.setTimeout(sendrapidKeyPressBuffer, rapidKeyPressInterval);
}
// Send the buffer of stored numeric keys to the multimedia device
function sendrapidKeyPressBuffer() {
// Sending first keys in long press mode
while (rapidKeyPressBuffer.length > 1) {
key = rapidKeyPressBuffer.substring(0, 1);
sendRequest(key, true); // long mode for first keys
rapidKeyPressBuffer = rapidKeyPressBuffer.substring(1);
}
// Sending last key in normal mode
sendRequest(rapidKeyPressBuffer, false);
// Reset buffer
rapidKeyPressBuffer = "";
}
</script>
</head>
<body>
<!--
Non-implemented virtual keys (rarely used):
- tv: switch peritel
- back: yellow backward/delete
- mail: voice mail
- pip: video incrustation - what use on V5?
- media: what use on V5?
- help
-->
<table>
<tr>
<td onclick="javascript:configureCode()">≡</td>
<td></td>
<td onclick="javascript:sendKey('power');" class="power">◯</td>
</tr>
<tr>
<td onclick="javascript:sendKey('red');" class="red"> </td>
<td onclick="javascript:sendKey('up');">▲</td>
<td onclick="javascript:sendKey('green');" class="green"></td>
</tr>
<tr>
<td onclick="javascript:sendKey('left');">◀</td>
<td onclick="javascript:sendKey('ok');">OK</td>
<td onclick="javascript:sendKey('right');">▶</td>
</tr>
<tr>
<td onclick="javascript:sendKey('yellow');" class="yellow"> </td>
<td onclick="javascript:sendKey('down');">▼</td>
<td onclick="javascript:sendKey('blue');" class="blue"> </td>
</tr>
<tr>
<td onclick="javascript:sendKey('info');" class="caption">info</td>
<td onclick="javascript:sendKey('home');" class="home">Free</td>
<td onclick="javascript:sendKey('options');" class="caption">options</td>
</tr>
<tr>
<td onclick="javascript:sendKey('list');" class="caption">liste</td>
<td onclick="javascript:sendKey('epg');" class="caption">guide</td>
<td onclick="javascript:sendKey('swap');" class="caption">⇄</td>
</tr>
<tr>
<td onclick="javascript:sendKey('prev');">⏮</td>
<td onclick="javascript:sendKey('play');">⏯</td>
<td onclick="javascript:sendKey('next');">⏭</td>
</tr>
<tr>
<td onclick="javascript:sendKey('bwd');">⏪</td>
<td onclick="javascript:sendKey('stop');">⏹</td>
<td onclick="javascript:sendKey('fwd');">⏩</td>
</tr>
<tr>
<td></td>
<td onclick="javascript:sendKey('rec');">⏺</td>
<td></td>
</tr>
<tr>
<td onclick="javascript:sendKey('vol_dec');">🔉</td>
<td onclick="javascript:sendKey('mute');">🔇</td>
<td onclick="javascript:sendKey('vol_inc');">🔊</td>
</tr>
<tr>
<td onclick="javascript:sendNumericKey('1');">1</td>
<td onclick="javascript:sendNumericKey('2');">2</td>
<td onclick="javascript:sendNumericKey('3');">3</td>
</tr>
<tr>
<td onclick="javascript:sendNumericKey('4');">4</td>
<td onclick="javascript:sendNumericKey('5');">5</td>
<td onclick="javascript:sendNumericKey('6');">6</td>
</tr>
<tr>
<td onclick="javascript:sendNumericKey('7');">7</td>
<td onclick="javascript:sendNumericKey('8');">8</td>
<td onclick="javascript:sendNumericKey('9');">9</td>
</tr>
<tr>
<td onclick="javascript:sendKey('prgm_dec');">-</td>
<td onclick="javascript:sendNumericKey('0');">0</td>
<td onclick="javascript:sendKey('prgm_inc');">+</td>
</tr>
</table>
</body>
</html>