From db636ab96523a7bb62e412e0c89a18d0d2c44c0e Mon Sep 17 00:00:00 2001 From: Da1N0Hand Date: Tue, 31 Jul 2018 05:11:53 +0200 Subject: [PATCH] bugfixes --- server/public/index.html | 12 +++++--- server/public/js/client.js | 60 +++++++++++++++++++++++------------- server/server.js | 63 ++++++++++++++++++++++---------------- 3 files changed, 82 insertions(+), 53 deletions(-) diff --git a/server/public/index.html b/server/public/index.html index 04a565e..ee6dece 100644 --- a/server/public/index.html +++ b/server/public/index.html @@ -59,19 +59,21 @@
+
- +
-

Wand 1

-

Wand 2

-

Wand 3

-

Wand 4

+ +
+
+
+
diff --git a/server/public/js/client.js b/server/public/js/client.js index c3e41b2..7c8bf88 100644 --- a/server/public/js/client.js +++ b/server/public/js/client.js @@ -30,11 +30,12 @@ function Start() { case 'status': lights_on = msg.on led_color = '#' + msg.color - wall_data = msg.walls_active - console.log(walls) + color = msg.color + wall_data = msg.wall_data + $('div.colorreference').css({'background-color': color}) Lamp(lights_on) - UpdateColors() + UpdateWalls() $('#br').attr('max', msg.max) @@ -55,10 +56,12 @@ $('.button.rainbow').on('click', function () { $('.button.amount').on('click', function () { let bright = $('#br').val() let amount = $(this).attr('data-amount') - ledAmount(bright, color, amount, walls) + SetLed(bright, amount) }) -$('div.col.animate.infinite.wobble.wall').on('click', function () { + +// On Wall button click +$('div.wall').on('click', function () { // Set Background color of clicked element var col_reference = $('div.colorreference') var index = $(this).attr('data-wall') - 1 @@ -73,10 +76,12 @@ $('div.col.animate.infinite.wobble.wall').on('click', function () { } if ($(this).attr('data-active') == 1) { - walls[index][0] = 1 - walls[index][1] = color + wall_data[index][0] = true + wall_data[index][1] = color + } else { + wall_data[index][0] = false } - + console.log(wall_data) }) // Longpress to show colorpicker @@ -103,7 +108,7 @@ $('div.color.animate.infinite.wobble').on('contextmenu', function (e) { $('#onOff').click(function () { var bright = $('#br').val() if (!lights_on) - ledAmount(bright, color, 5, 0) + SetLed(bright, 5) OnOnOffClick() }); @@ -111,15 +116,13 @@ $('input.button.colpicker').on('change', function (e) { color = $(this).val().slice(1,7) }) -function UpdateColors() { - $('body').css({color: led_color}) - $('input.button.colpicker').val(led_color) +function UpdateWalls() { + for (let i = 0; i < wall_data.length; i++) { + var wall = $('div.wall').eq(i) - for (let i = 0; i < walls.length; i++) { - var wall = $('div.col.animate.infinite.wobble.wall').eq((i+1)) - if ((wall != null) && (walls[i] != null)) { - if (walls[i][0] == 1) { - wall.css({'background-color': walls[i][1] }) + if ((wall != null) && (wall_data[i] != null)) { + if (wall_data[i][0] == 1) { + wall.css({'background-color': wall_data[i][1] }) wall.attr('data-active', 1) } else { wall.css({'background-color': '#212121'}) @@ -131,6 +134,9 @@ function UpdateColors() { // Set BG Color of the color buttons, based on what the server sent function setBg(colors) { + $('body').css({color: led_color}) + $('input.button.colpicker').val(led_color) + // Get the amount of color buttons that we have let amount = 0 $('div.color.animate.infinite.wobble').each(() => { amount++ }) @@ -162,7 +168,7 @@ function Lamp(on = true) { } function OnOnOffClick() { - if (lights_on) ledOff(); + if (lights_on) SendOff(); } // End Button handlers @@ -171,12 +177,22 @@ function OnOnOffClick() { // ---------------------------------------------------------------------- // Begin LED functions -function ledAmount(bright, color = '0000ff', amount = 2) { - send({type: 'amount', bright: bright, color: color, amount: amount, walls: walls}) +function SetLed(bright, amount, _on = true) { + if (!_on) { + for (let i = 0; i < wall_data; i++) { + wall_data[i][0] = _on + } + } else { + // wall_data: [ bool on, string color, int amount] + for (let i = 0; i < wall_data.length; i++) { + wall_data[i][2] = amount + } + } + send({type: 'led', bright: bright, wall_data: wall_data}) } -function ledOff() { - send({type: 'off', walls: walls}) +function SendOff() { + send({type: 'off'}) } function ledRainbow(bright) { diff --git a/server/server.js b/server/server.js index 4cb29f3..33b3452 100644 --- a/server/server.js +++ b/server/server.js @@ -64,7 +64,7 @@ strip.setBrightness(config.led.brightness) // On ready, show (green) lights // Set all walls to on -SetStrip([[1, 'ff0000', 1], [1, '00ff00', 1], [1, '0000ff', 1], [1, 'b6cc18', 1]]) +SetStrip(0, config.led.ready_color, 5) RenderLedData() on = true @@ -74,7 +74,7 @@ on = true // If the server gets a connection wss.on('connection', function(ws, req) { - // SendToEveryone({type: 'status', on: on, max: config.led.max_brightness, favorites: favorites, color: , wall_data: strip_wall_data }) + SendToEveryone({type: 'status', on: on, max: config.led.max_brightness, favorites: favorites, color: color, wall_data: strip_wall_data }) ws.on('message', (msg) => { try { @@ -89,24 +89,21 @@ wss.on('connection', function(ws, req) { ws.terminate(); } - change() - switch (msg.type) { case 'off': - ledOff() + SetStrip(0, 0, 0, false) + RenderLedData() break; - case 'amount': - console.log(msg.walls) - SetStrip(msg.walls) - ledAmount(msg.bright, msg.amount) + case 'led': + SetStrip(msg.wall_data) + RenderLedData() break; case 'special': clearInterval(loop) ledSpecial(msg.bright, msg.mode, msg.arg) break; } - - // SendToEveryone({type: 'status', on: on, max: config.led.max_brightness, favorites: favorites, walls_active: strip_walls_active }) + SendToEveryone({type: 'status', on: on, max: config.led.max_brightness, favorites: favorites, color: color, wall_data: strip_wall_data }) }); }); @@ -127,21 +124,34 @@ function RenderLedData() { strip.render(pixelData) } -function SetLedData(_led, _on = 1, _color) { - if (_on == 0) _color = strip_led_data[_led][1] +function SetLedData(_led, _on = true, _color) { + if (!_on) _color = strip_led_data[_led][1] strip_led_data[_led] = [ _on, _color] } -// Format: SetStrip( array _walls, string _color, int _amount) -// Format: array _walls = wall [ bool on, string color, int amount ] -function SetStrip(_walls = 0, _color = 'ff0000', _amount = 1) { +// Format: SetStrip( array _walls, string _color, int _amount, bool _on) +// Format: array _walls = wall [ bool on, string color, int amount] +function SetStrip(_walls = false, _color = 'ff0000', _amount = 1, _on = true) { // If nothing or 0 was passed as the first arg - // Set the whole strip to red / _color - if (_walls == 0) { + // Set the whole strip to _color + if (!_walls) { + if (!_on) { + for (var i = 0; i < NUM_LEDS; i++) { + SetLedData(i, false) + } + on = false + return + } + + for (var i = 0; i < strip_walls.length; i++) { + strip_wall_data[i] = [ true, _color, _amount ] + } + for (var i = 0; i < NUM_LEDS; i+=parseInt(_amount)) { - color = _color - SetLedData(i, 1, _color) + SetLedData(i, true, _color) } + + color = _color } else { var led = 0 var led2 = 0 @@ -149,22 +159,23 @@ function SetStrip(_walls = 0, _color = 'ff0000', _amount = 1) { for (var i = 0; i < strip_walls.length; i++) { // Foreach LED / wall // First black out all LEDs - for (var led = strip_walls[i]; led < strip_walls[i]; led++) { - SetLedData(led, 0) + for (led; led < strip_walls[i]; led++) { + SetLedData(led, false) } - - let amount = (_walls[i][2] < 1) ? 1 : _walls[i][2] + var amount = (_walls[i][2] < 1) ? 1 : _walls[i][2] + // If the wall is disabled // Then show only used LEDs for (led2; led2 < strip_walls[i]; led2+=parseInt(amount)) { - // If a wall is disabled, - if (_walls[i][0] == 0) { + if (!_walls[i][0]) { SetLedData(led2, false, _walls[i][1]) } else { SetLedData(led2, true, _walls[i][1]) } } } + on = true color = _walls[0][1] + strip_wall_data = _walls } }