Skip to content

Commit 6c877b6

Browse files
blazoncekblazoncek
authored
Merge pull request #3597 from WoodyLetsCode/inline
Inline iro.js and rangetouch.js
2 parents 42dba31 + 86d2998 commit 6c877b6

File tree

5 files changed

+24
-72
lines changed

5 files changed

+24
-72
lines changed

‎tools/cdata.js‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -380,16 +380,6 @@ const char PAGE_dmxmap[] PROGMEM = R"=====()=====";
380380
file: "favicon.ico",
381381
name: "favicon",
382382
method: "binary",
383-
},
384-
{
385-
file: "iro.js",
386-
name: "iroJs",
387-
method: "gzip"
388-
},
389-
{
390-
file: "rangetouch.js",
391-
name: "rangetouchJs",
392-
method: "gzip"
393383
}
394384
],
395385
"wled00/html_other.h"

‎wled00/data/index.htm‎

Lines changed: 8 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -7,52 +7,9 @@
77
<meta content="yes" name="apple-mobile-web-app-capable">
88
<link rel="shortcut icon" href="data:image/x-icon;base64,AAABAAEAEBAAAAEAGACGAAAAFgAAAIlQTkcNChoKAAAADUlIRFIAAAAQAAAAEAgGAAAAH/P/YQAAAE1JREFUOI1j/P//PwOxgNGeAUMxE9G6cQCKDWAhpADZ2f8PMjBS3QW08QK20KaZC2gfC9hCnqouoNgARgY7zMxAyNlUdQHlXiAlO2MDAD63EVqNHAe0AAAAAElFTkSuQmCC"/>
99
<title>WLED</title>
10-
<script>
11-
function feedback(){}
12-
// instead of including [script src="iro.js"][/script] and [script src="rangetouch.js"][/script]
13-
// (which would be inlined by nodeJS inliner during minimization and compression) we need to load them dynamically
14-
// the following is needed to load iro.js and rangetouch.js as consecutive requests to allow ESP8266
15-
// to keep up with requests (if requests happent too fast some may not get processed)
16-
// it will also call onLoad() after last is loaded (it was removed from [body onload="onLoad()"]).
17-
var h = document.getElementsByTagName('head')[0];
18-
var l = document.createElement('script');
19-
l.type = 'application/javascript';
20-
l.src = 'iro.js';
21-
l.addEventListener('load', (e) => {
22-
// after iro is loaded initialize global variable
23-
cpick = new iro.ColorPicker("#picker", {
24-
width: 260,
25-
wheelLightness: false,
26-
wheelAngle: 270,
27-
wheelDirection: "clockwise",
28-
layout: [{
29-
component: iro.ui.Wheel,
30-
options: {}
31-
}]
32-
});
33-
cpick.on("input:end", () => {setColor(1);});
34-
cpick.on("color:change", () => {updatePSliders()});
35-
var l = document.createElement('script');
36-
l.type = 'application/javascript';
37-
l.src = 'rangetouch.js';
38-
l.addEventListener('load', (e) => {
39-
// after rangetouch is loaded initialize global variable
40-
ranges = RangeTouch.setup('input[type="range"]', {});
41-
let stateCheck = setInterval(() => {
42-
if (document.readyState === 'complete') {
43-
clearInterval(stateCheck);
44-
// document ready, start processing UI
45-
onLoad();
46-
}
47-
}, 100);
48-
});
49-
setTimeout(()=>{h.appendChild(l)},100);
50-
});
51-
setTimeout(()=>{h.appendChild(l)},200);
52-
</script>
5310
<link rel="stylesheet" href="index.css">
5411
</head>
55-
<body>
12+
<body onload="onLoad()">
5613

5714
<div id="cv" class="overlay">Loading WLED UI...</div>
5815
<noscript><div class="overlay" style="opacity:1;">Sorry, WLED UI needs JavaScript!</div></noscript>
@@ -378,6 +335,13 @@
378335
</div>
379336

380337
<i id="roverstar" class="icons huge" onclick="setLor(0)">&#xe410;</i><br>
338+
339+
<!--
340+
If you want to load iro.js and rangetouch.js as consecutive requests, you can do it like it was done in 0.14.0:
341+
https://github.com/Aircoookie/WLED/blob/v0.14.0/wled00/data/index.htm
342+
-->
343+
<script src="iro.js"></script>
344+
<script src="rangetouch.js"></script>
381345
<script src="index.js"></script>
382346
</body>
383347
</html>

‎wled00/data/index.js‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ var pcMode = false, pcModeA = false, lastw = 0, wW;
1515
var simplifiedUI = false;
1616
var tr = 7;
1717
var d = document;
18+
const ranges = RangeTouch.setup('input[type="range"]', {});
1819
var palettesData;
1920
var fxdata = [];
2021
var pJson = {}, eJson = {}, lJson = {};
@@ -23,7 +24,7 @@ var pN = "", pI = 0, pNum = 0;
2324
var pmt = 1, pmtLS = 0, pmtLast = 0;
2425
var lastinfo = {};
2526
var isM = false, mw = 0, mh=0;
26-
var ws, cpick, ranges, wsRpt=0;
27+
var ws, wsRpt=0;
2728
var cfg = {
2829
theme:{base:"dark", bg:{url:"", rnd: false, rndGrayscale: false, rndBlur: false}, alpha:{bg:0.6,tab:0.8}, color:{bg:""}},
2930
comp :{colors:{picker: true, rgb: false, quick: true, hex: false},
@@ -39,6 +40,17 @@ var hol = [
3940
[0,0,1,1,"https://images.alphacoders.com/119/1198800.jpg"] // new year
4041
];
4142

43+
var cpick = new iro.ColorPicker("#picker", {
44+
width: 260,
45+
wheelLightness: false,
46+
wheelAngle: 270,
47+
wheelDirection: "clockwise",
48+
layout: [{
49+
component: iro.ui.Wheel,
50+
options: {}
51+
}]
52+
});
53+
4254
function handleVisibilityChange() {if (!d.hidden && new Date () - lastUpdate > 3000) requestJson();}
4355
function sCol(na, col) {d.documentElement.style.setProperty(na, col);}
4456
function gId(c) {return d.getElementById(c);}
@@ -260,6 +272,8 @@ function onLoad()
260272

261273
selectSlot(0);
262274
updateTablinks(0);
275+
cpick.on("input:end", () => {setColor(1);});
276+
cpick.on("color:change", () => {updatePSliders()});
263277
pmtLS = localStorage.getItem('wledPmt');
264278

265279
// Load initial data

‎wled00/wled.h‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
*/
99

1010
// version code in format yymmddb (b = daily build)
11-
#define VERSION 2312160
11+
#define VERSION 2312190
1212

1313
//uncomment this if you have a "my_config.h" file you'd like to use
1414
//#define WLED_USE_MY_CONFIG

‎wled00/wled_server.cpp‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -254,22 +254,6 @@ void initServer()
254254
size_t len, bool final) {handleUpload(request, filename, index, data, len, final);}
255255
);
256256

257-
server.on("/iro.js", HTTP_GET, [](AsyncWebServerRequest *request){
258-
if (handleIfNoneMatchCacheHeader(request)) return;
259-
AsyncWebServerResponse *response = request->beginResponse_P(200, "application/javascript", iroJs, iroJs_length);
260-
response->addHeader(FPSTR(s_content_enc),"gzip");
261-
setStaticContentCacheHeaders(response);
262-
request->send(response);
263-
});
264-
265-
server.on("/rangetouch.js", HTTP_GET, [](AsyncWebServerRequest *request){
266-
if (handleIfNoneMatchCacheHeader(request)) return;
267-
AsyncWebServerResponse *response = request->beginResponse_P(200, "application/javascript", rangetouchJs, rangetouchJs_length);
268-
response->addHeader(FPSTR(s_content_enc),"gzip");
269-
setStaticContentCacheHeaders(response);
270-
request->send(response);
271-
});
272-
273257
createEditHandler(correctPIN);
274258

275259
#ifndef WLED_DISABLE_OTA

0 commit comments

Comments
 (0)