Merge blazoncek (Aircoookie#4)

* Add missing palettes * A build file and README for the QuinLED-Dig-Quad Preassembled (Aircoookie#1643) * runs w/ multi and temp on my preasmbld QL-DQuad * working build file * runs w/ multi and temp on my preasmbld QL-DQuad * working build file * Remove custom info * Added README, found the UI update wasn't necessary * Rebase the precompiled HTML file * Spellcheck Co-authored-by: cheffpj2 <[email protected]> * Add expiration to cached palette data * Remove extra console.log * Generate ui .h files Co-authored-by: cheffpj2 <[email protected]> Co-authored-by: cheffpj2 <[email protected]>
Moustachauve · Jan 13, 2021 · 49f1c43 · 49f1c43
1 parent 7f601a3
commit 49f1c43
Show file tree

Hide file tree

Showing 9 changed files with 1,023 additions and 790 deletions.
diff --git a/.gitignore b/.gitignore
@@ -7,9 +7,10 @@
 /wled00/Release
 /wled00/extLibs
 /platformio_override.ini
-/wled00/my_config.h 
+/wled00/my_config.h
 /build_output
 .DS_Store
 .gitignore
 .clang-format
 node_modules
+.idea
diff --git a/usermods/quinled_digquad_preassembled_unofficial_v0.1/README.md b/usermods/quinled_digquad_preassembled_unofficial_v0.1/README.md
@@ -0,0 +1,37 @@
+# QuinLED-Dig-Quad Preassembled Unofficial Build
+
+This usermod targets the [Preassembled QuinLED-Dig-Quad](https://quinled.info/pre-assembled-quinled-dig-quad/). Tested on board revision v1r6b,
+and includes the following features:
+
+ * **Multi-channel Support** - enabling use of LED1, LED2, LED3, LED4 pins to work using segments
+ * **Temperature Sensor Support** - pulls readings from the built-in temperature sensor and adds the reading to the *Info* page in the UI
+
+## Background
+
+As a starting point, you should check out this awesome video from Quindor: [How to compile WLED yourself](https://quinled.info/2020/12/22/livestream-wled-compile/). The usermod you are reading now just provides some shortcuts for parts of what were covered in that video.
+
+## Build Firmware with Multi-channel and Temp Support
+
+1. Copy the `platformio_override.ini` file to the project's root directory
+1. If using VS Code with the PlatformIO plugin like in the video, you will now see this new project task listed in the PLATFORMIO panel at the bottom as `env:QL-DigQuad-Pre-v0.1` (you probably need to hit the refresh button) 
+
+   <img src="images/pio-screenshot.png" width="400px"/>
+
+1. Edit this file from the root directory as needed:
+
+   <img src="images/params.png" width="400px"/>
+
+   * `PIXEL_COUNTS` may need to be adjusted for your set-up. E.g. I have lots of LEDs in Channel 1, but that's probably unusual for most
+   * `DATA_PINS` may need to be changed to "16,3,1,26" instead of "16,1,3,26" apparently depending on the board revision or some such
+
+1. Build the mod (e.g. click `Build` from the project task circled above) and update your firmware using the `QL-DigQuad-Pre-v0.1` file, e.g. using _Manual OTA_ from the Config menu. Based on the video and my own experience, you might need to build twice 🤷‍♂️.
+
+## Observing Temperature
+
+Hopefully you can now see the Temperature listed in the Info page. If not, use Chrome Developer Tools to find the current temperature
+
+1. Open the Developer Tools Console
+2. Enter `lastinfo.u.Temperature` to view the Temperature array
+
+   <img src="images/json-temp.png" width="300px"/>
+
diff --git a/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/json-temp.png b/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/json-temp.png
diff --git a/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/params.png b/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/params.png
diff --git a/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/pio-screenshot.png b/usermods/quinled_digquad_preassembled_unofficial_v0.1/images/pio-screenshot.png
diff --git a/usermods/quinled_digquad_preassembled_unofficial_v0.1/platformio_override.ini b/usermods/quinled_digquad_preassembled_unofficial_v0.1/platformio_override.ini
@@ -0,0 +1,16 @@
+; QuinLED-Dig-Quad Preassembled Unofficial
+
+[env:QL-DigQuad-Pre-v0.1]
+extends = env:esp32dev
+build_flags = ${common.build_flags_esp32} 
+    -D ESP32_MULTISTRIP 
+    -D NUM_STRIPS=4 
+    -D PIXEL_COUNTS="600, 300, 300, 300" 
+    -D DATA_PINS="16,1,3,26" 
+    -D RLYPIN=19 
+    -D BTNPIN=17
+    -D USERMOD_DALLASTEMPERATURE
+    -D USERMOD_DALLASTEMPERATURE_MEASUREMENT_INTERVAL=10000
+lib_deps = ${env.lib_deps}
+    milesburton/DallasTemperature@^3.9.0
+    OneWire@~2.3.5
diff --git a/wled00/data/index.js b/wled00/data/index.js
@@ -3,6 +3,7 @@ var loc = false, locip;
 var noNewSegs = false;
 var isOn = false, nlA = false, isLv = false, isInfo = false, syncSend = false, syncTglRecv = true, isRgbw = false;
 var whites = [0,0,0];
+var selColors;
 var expanded = [false];
 var powered = [true];
 var nlDur = 60, nlTar = 0;
@@ -666,20 +667,10 @@ function populatePalettes()
 		"id": 0,
 		"name": "Default",
 	});
+
 	var paletteHtml = `<input type="text" class="search" placeholder="Search" oninput="search(this)" />`;
 	for (let i = 0; i < palettes.length; i++) {
-		var paletteData = palettesData[palettes[i].id];
-		var previewCss = "";
-		if (paletteData) {
-			var gradient = [];
-			paletteData.forEach(element => {
-				gradient.push(`rgb(${element[1]},${element[2]},${element[3]}) ${element[0]/255*100}%`);
-			});
-
-			previewCss = `background: linear-gradient(to right,${gradient.join()});`;
-		} else {
-			previewCss = 'display: none';
-		}
+		let previewCss = genPalPrevCss();
 		paletteHtml += generateListItemHtml(
 			'palette',
 		    palettes[i].id,
@@ -692,6 +683,72 @@ function populatePalettes()
 	d.getElementById('selectPalette').innerHTML=paletteHtml;
 }
 
+function redrawPalPrev()
+{
+	let palettes = d.querySelectorAll('#selectPalette .lstI');
+	for (let i = 0; i < palettes.length; i++) {
+		let id = palettes[i].dataset.id;
+		let lstPrev = palettes[i].querySelector('.lstIprev');
+		if (lstPrev) {
+			lstPrev.style = genPalPrevCss(id);
+		}
+	}
+}
+
+function genPalPrevCss(id)
+{
+	if (!palettesData) {
+		return;
+	}
+	var paletteData = palettesData[id];
+	var previewCss = "";
+
+	if (!paletteData) {
+		return 'display: none';
+	}
+
+	// We need at least two colors for a gradient
+	if (paletteData.length == 1) {
+		paletteData[1] = paletteData[0];
+		if (Array.isArray(paletteData[1])) {
+			paletteData[1][0] = 255;
+		}
+	}
+
+	var gradient = [];
+	for (let j = 0; j < paletteData.length; j++) {
+		const element = paletteData[j];
+		let r;
+		let g;
+		let b;
+		let index = false;
+		if (Array.isArray(element)) {
+			index = element[0]/255*100;
+			r = element[1];
+			g = element[2];
+			b = element[3];
+		} else if (element == 'r') {
+			r = Math.random() * 255;
+			g = Math.random() * 255;
+			b = Math.random() * 255;
+		} else {
+			if (selColors) {
+				let pos = element[1] - 1;
+				r = selColors[pos][0];
+				g = selColors[pos][1];
+				b = selColors[pos][2];
+			}
+		}
+		if (index === false) {
+			index = j / paletteData.length * 100;
+		}
+
+		gradient.push(`rgb(${r},${g},${b}) ${index}%`);
+	}
+
+	return `background: linear-gradient(to right,${gradient.join()});`;
+}
+
 function generateListItemHtml(listName, id, name, clickAction, extraHtml = '')
 {
     return `<div class="lstI" data-id="${id}" onClick="${clickAction}(${id})">
@@ -873,6 +930,7 @@ function requestJson(command, rinfo = true, verbose = true) {
 			return;
 		}
 		var s = json;
+
 		if (!command || rinfo) {
 			if (!rinfo) {
 				pmt = json.info.fs.pmt;
@@ -944,6 +1002,8 @@ function requestJson(command, rinfo = true, verbose = true) {
 			updateUI(false);
 			return;
 		}
+
+		selColors = i.col;
 		var cd = d.getElementById('csl').children;
 		for (let e = 2; e >= 0; e--)
 		{
@@ -1362,6 +1422,7 @@ function selectSlot(b) {
 	updateTrail(d.getElementById('sliderW'));
 	updateHex();
 	updateRgb();
+	redrawPalPrev();
 }
 
 var lasth = 0;
@@ -1497,16 +1558,21 @@ function loadPalettesData()
 	var palettesDataJson = localStorage.getItem(lsKey);
 	if (palettesDataJson) {
 		try {
-			palettesData = JSON.parse(palettesDataJson);
-			if (palettesData) {
+			palettesDataJson = JSON.parse(palettesDataJson);
+			var d = new Date();
+			if (palettesDataJson && palettesDataJson.expiration && palettesDataJson.expiration > d.getTime()) {
+				palettesData = palettesDataJson.p;
 				return;
 			}
 		} catch (e) {}
 	}
+	var dateExpiration = new Date();
 	palettesData = {};
 	getPalettesData(1, function() {
-		console.log("done palettes X");
-		localStorage.setItem(lsKey, JSON.stringify(palettesData));
+		localStorage.setItem(lsKey, JSON.stringify({
+			p: palettesData,
+			expiration: dateExpiration.getTime() + 86400
+		}));
 		requestJson(null, false);
 	});
 }
@@ -1531,7 +1597,6 @@ function getPalettesData(page, callback)
 		return res.json();
 	})
 	.then(json => {
-		console.log(json);
 		palettesData = Object.assign({}, palettesData, json.p);
 		if (page < json.m) {
 			getPalettesData(page + 1, callback);