diff --git a/tabs/led_strip.css b/tabs/led_strip.css index c9f763e9..87312228 100644 --- a/tabs/led_strip.css +++ b/tabs/led_strip.css @@ -1,291 +1,291 @@ - -.tab-led-strip .help { - padding: 10px; - background-color: #ffcb18; - margin-bottom: 10px; -} - -.tab-led-strip .section { - color: #565656; - margin: 20px 0 0 0; - border-bottom: 1px solid silver; -} - -.tab-led-strip .mainGrid { - width: calc((30px + 8px) * 16); - height: calc((30px + 8px) * 16); - float: left; - margin-right: 10px; -} - -.tab-led-strip .mainGrid .gPoint { - float: left; - border: solid 2px #000; - width: 28px; - height: 28px; - margin: 3px; - border-radius: 7px; - background: rgba(0,0,0,.3); - cursor: pointer; -} - -.tab-led-strip .gPoint.mode-w { /* warning */ - background: red; - box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); - border-color: red; -} - -.tab-led-strip .gPoint.mode-f { /* flight mode & orientation */ - background: rgb(50, 205, 50); - box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); - border-color: rgb(50, 205, 50); -} - -.tab-led-strip .gPoint.mode-w.mode-f { - background: linear-gradient(to bottom, #42c949 0%,#d2ff52 52%,#d2ff52 52%,#ff5454 52%,#ba3535 100%); -} - -.tab-led-strip .gPoint.mode-i { /* indicator */ - background: yellow; - box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); - border-color: yellow; -} - -.tab-led-strip .gPoint.mode-a { /* Armed Mode */ - background: blue; - box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); - border-color: blue; -} - -.tab-led-strip .gPoint.mode-t { /* Armed Mode */ - background: orange; - box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); - border-color: orange; -} - -.tab-led-strip .gPoint select { - background: #000; - width: 13px; - height: 13px; -} - -.tab-led-strip .alertMsg { - background: rgba(100,0,0,.5); - text-align: center; - position: absolute; - top: 50%; - left: 0; - width: 100%; - color: #FFF; - padding: 30px; - font-family: sans-serif; -} - -.tab-led-strip .wire { - color: rgba(255,255,255,.5); - text-align: center; - font-size: 25px; - text-shadow: 1px 1px rgba(0,0,0,.4); - padding-top: 0px; - display: block; - font-family: monospace; - position: absolute; - margin-top: -32px; - width: 28px; -} - -.gridWire .wire { - color: rgba(255,255,255,1); -} - -.gridWire .gPoint { - background: #333 !important; -} - -/*function buttons*/ - -.tab-led-strip button { - text-align: center; - font-weight: bold; - - border: 1px solid silver; - background-color: #ececec; - - padding: 7px 7px; - margin: 3px 0; -} - -.tab-led-strip button:hover { - background-color: #acacac; -} - -.tab-led-strip .funcWire.btnOn { - background: rgb(15, 171, 22); -} - - -.tab-led-strip button.w100 { - width: 100%; -} - -.tab-led-strip button.w50 { - width: 49%; -} - -.tab-led-strip button.w33 { - width: 32%; -} - -.tab-led-strip .modeW.btnOn {background: red;} -.tab-led-strip .modeF.btnOn {background: rgb(50, 205, 50);} -.tab-led-strip .modeI.btnOn {background: yellow; color: #333;} -.tab-led-strip .modeA.btnOn {background: blue;} -.tab-led-strip .modeT.btnOn {background: orange;} - -.tab-led-strip .dirN.btnOn {background: #FFF; color: #000;} -.tab-led-strip .dirE.btnOn {background: #FFF; color: #000;} -.tab-led-strip .dirS.btnOn {background: #FFF; color: #000;} -.tab-led-strip .dirW.btnOn {background: #FFF; color: #000;} -.tab-led-strip .dirU.btnOn {background: #FFF; color: #000;} -.tab-led-strip .dirD.btnOn {background: #FFF; color: #000;} - -.tab-led-strip .indicators { - position: relative; - height: 30px -} - -.tab-led-strip .indicators span { - width: 0; - height: 0; - position: absolute; - display: none; - font-size: 10px; - font-weight: bold; -} - -.tab-led-strip .indicators .north { - top: -4px; - left: 7px; - border-left: 7px solid transparent; - border-right: 7px solid transparent; - border-bottom: 7px solid rgba(0,0,0,.8); -} - -.tab-led-strip .indicators .south { - bottom: -2px; - left: 7px; - border-left: 7px solid transparent; - border-right: 7px solid transparent; - border-top: 7px solid rgba(0,0,0,.8); -} - -.tab-led-strip .indicators .east { - bottom: 8px; - right: -5px; - border-top: 7px solid transparent; - border-bottom: 7px solid transparent; - border-left: 7px solid rgba(0,0,0,.8); -} - -.tab-led-strip .indicators .west { - bottom: 8px; - left: -5px; - border-top: 7px solid transparent; - border-bottom: 7px solid transparent; - border-right: 7px solid rgba(0,0,0,.8); -} - -.tab-led-strip .indicators .up { - top: 0px; - left: 2px; -} - -.tab-led-strip .indicators .down { - bottom: 17px; - right: 10px; -} - - -.tab-led-strip .dir-n .north {display: inline;} -.tab-led-strip .dir-s .south {display: inline;} -.tab-led-strip .dir-e .east {display: inline;} -.tab-led-strip .dir-w .west {display: inline;} -.tab-led-strip .dir-u .up {display: inline;} -.tab-led-strip .dir-d .down {display: inline;} - -.tab-led-strip .controls { - position: relative; - float: left; - width: 290px; - height: calc((30px + 8px) * 16); -} - -.tab-led-strip .output { - bottom: 0px; - position: absolute; - width: 100%; - height: 160px; -} -.tab-led-strip .tempOutput { - color: #fff; - background: rgba(0,0,0,.2); - width: 100%; - height: 100%; - outline: none; -} - -.tab-led-strip .orientation { - width: 130px; - height: 100px; - position: relative; -} - -.tab-led-strip .orientation button { - position: absolute; - width: 30px; - height: 30px; -} - -.tab-led-strip .orientation .dirN {top: 0; left: 32px;} -.tab-led-strip .orientation .dirS {bottom: 0; left: 32px;} -.tab-led-strip .orientation .dirE {left: 64px; top: 32px;} -.tab-led-strip .orientation .dirW {left: 0; top: 32px;} -.tab-led-strip .orientation .dirU {right: 0; top: 15px;} -.tab-led-strip .orientation .dirD {right: 0; bottom: 15px;} - -.tab-led-strip .wires-remaining { - float: right; - text-align: center; - font-size: 14px; - -} - -.tab-led-strip .wires-remaining div { - font-size: 40px; - color: #7AAE2D; - font-family: monospace; -} - -.tab-led-strip .wires-remaining.error div { - color: #FF5700; -} - - - -/*******JQUERYUI**********/ - -.tab-led-strip .ui-selected { - box-shadow: inset 0 0 30px rgba(255, 255, 255, 1) !important; -} - -.tab-led-strip .ui-selecting { - box-shadow: inset 0 0 30px rgba(255, 255, 255, .7) !important; - border: solid 2px #c0c0c0 !important; -} - -.tab-led-strip .ui-selectable-helper { - background: rgba(0,0,0,.4); - position: absolute; - z-index: 100; - border: 1px dotted white; + +.tab-led-strip .help { + padding: 10px; + background-color: #ffcb18; + margin-bottom: 10px; +} + +.tab-led-strip .section { + color: #565656; + margin: 20px 0 0 0; + border-bottom: 1px solid silver; +} + +.tab-led-strip .mainGrid { + width: calc((30px + 8px) * 16); + height: calc((30px + 8px) * 16); + float: left; + margin-right: 10px; +} + +.tab-led-strip .mainGrid .gPoint { + float: left; + border: solid 1px #ADADAD; + width: 30px; + height: 30px; + margin: 3px; + border-radius: 3px; + background: #ececec; + cursor: pointer; +} + +.tab-led-strip .gPoint.mode-w { /* warning */ + background: red; + box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); + border-color: red; +} + +.tab-led-strip .gPoint.mode-f { /* flight mode & orientation */ + background: rgb(50, 205, 50); + box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); + border-color: rgb(50, 205, 50); +} + +.tab-led-strip .gPoint.mode-w.mode-f { + background: linear-gradient(to bottom, #42c949 0%,#d2ff52 52%,#d2ff52 52%,#ff5454 52%,#ba3535 100%); +} + +.tab-led-strip .gPoint.mode-i { /* indicator */ + background: yellow; + box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); + border-color: yellow; +} + +.tab-led-strip .gPoint.mode-a { /* Armed Mode */ + background: rgb(52, 155, 255); + box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); + border-color: rgb(52, 155, 255); +} + +.tab-led-strip .gPoint.mode-t { /* Armed Mode */ + background: orange; + box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); + border-color: orange; +} + +.tab-led-strip .gPoint select { + background: #000; + width: 13px; + height: 13px; +} + +.tab-led-strip .alertMsg { + background: rgba(100,0,0,.5); + text-align: center; + position: absolute; + top: 50%; + left: 0; + width: 100%; + color: #FFF; + padding: 30px; + font-family: sans-serif; +} + +.tab-led-strip .wire { + color: rgba(255,255,255,.5); + text-align: center; + font-size: 23px; + text-shadow: 1px 1px rgba(0,0,0,.4); + padding-top: 0px; + display: block; + font-family: monospace; + position: absolute; + margin-top: -29px; + width: 28px; +} + +.gridWire .wire { + color: rgba(255,255,255,1); +} + +.gridWire .gPoint { + background: #CAFFCD !important; +} + +/*function buttons*/ + +.tab-led-strip button { + text-align: center; + font-weight: bold; + + border: 1px solid silver; + background-color: #ececec; + + padding: 7px 7px; + margin: 3px 0; +} + +.tab-led-strip button:hover { + background-color: #acacac; +} + +.tab-led-strip .funcWire.btnOn { + background: rgb(15, 171, 22); +} + + +.tab-led-strip button.w100 { + width: 100%; +} + +.tab-led-strip button.w50 { + width: 49%; +} + +.tab-led-strip button.w33 { + width: 32%; +} + +.tab-led-strip .modeW.btnOn {background: red;} +.tab-led-strip .modeF.btnOn {background: rgb(50, 205, 50);} +.tab-led-strip .modeI.btnOn {background: yellow; color: #333;} +.tab-led-strip .modeA.btnOn {background: blue;} +.tab-led-strip .modeT.btnOn {background: orange;} + +.tab-led-strip .dirN.btnOn {background: #FFF; color: #000;} +.tab-led-strip .dirE.btnOn {background: #FFF; color: #000;} +.tab-led-strip .dirS.btnOn {background: #FFF; color: #000;} +.tab-led-strip .dirW.btnOn {background: #FFF; color: #000;} +.tab-led-strip .dirU.btnOn {background: #FFF; color: #000;} +.tab-led-strip .dirD.btnOn {background: #FFF; color: #000;} + +.tab-led-strip .indicators { + position: relative; + height: 30px +} + +.tab-led-strip .indicators span { + width: 0; + height: 0; + position: absolute; + display: none; + font-size: 10px; + font-weight: bold; +} + +.tab-led-strip .indicators .north { + top: -5px; + left: 10px; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-bottom: 5px solid rgba(0,0,0,.8); +} + +.tab-led-strip .indicators .south { + bottom: -5px; + left: 10px; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-top: 5px solid rgba(0,0,0,.8); +} + +.tab-led-strip .indicators .east { + bottom: 10px; + right: -5px; + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; + border-left: 5px solid rgba(0,0,0,.8); +} + +.tab-led-strip .indicators .west { + bottom: 10px; + left: -5px; + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; + border-right: 5px solid rgba(0,0,0,.8); +} + +.tab-led-strip .indicators .up { + top: -1px; + left: 1px; +} + +.tab-led-strip .indicators .down { + bottom: 13px; + right: 9px; +} + +.tab-led-strip .dir-n .north {display: inline;} +.tab-led-strip .dir-s .south {display: inline;} +.tab-led-strip .dir-e .east {display: inline;} +.tab-led-strip .dir-w .west {display: inline;} +.tab-led-strip .dir-u .up {display: inline;} +.tab-led-strip .dir-d .down {display: inline;} + +.tab-led-strip .controls { + position: relative; + float: left; + width: 290px; + height: calc((30px + 8px) * 16); +} + +.tab-led-strip .output { + bottom: 0px; + position: absolute; + width: 100%; + height: 160px; +} + +.tab-led-strip .tempOutput { + color: #fff; + background: rgba(0,0,0,.2); + width: 100%; + height: 100%; + outline: none; +} + +.tab-led-strip .orientation { + width: 130px; + height: 100px; + position: relative; +} + +.tab-led-strip .orientation button { + position: absolute; + width: 30px; + height: 30px; +} + +.tab-led-strip .orientation .dirN {top: 0; left: 32px;} +.tab-led-strip .orientation .dirS {bottom: 0; left: 32px;} +.tab-led-strip .orientation .dirE {left: 64px; top: 32px;} +.tab-led-strip .orientation .dirW {left: 0; top: 32px;} +.tab-led-strip .orientation .dirU {right: 0; top: 15px;} +.tab-led-strip .orientation .dirD {right: 0; bottom: 15px;} + +.tab-led-strip .wires-remaining { + float: right; + text-align: center; + font-size: 14px; +} + +.tab-led-strip .wires-remaining div { + font-size: 40px; + color: #7AAE2D; + font-family: monospace; +} + +.tab-led-strip .wires-remaining.error div { + color: #FF5700; +} + + + +/*******JQUERYUI**********/ + +.tab-led-strip .ui-selected { + box-shadow: inset 0 0 40px rgba(255, 255, 255, 1) !important; + border: solid 1px #000 !important; +} + +.tab-led-strip .ui-selecting { + box-shadow: inset 0 0 40px rgba(255, 255, 255, 1) !important; + border: solid 1px #000 !important; +} + +.tab-led-strip .ui-selectable-helper { + background: rgba(0,0,0,.4); + position: absolute; + z-index: 100; + border: 1px dotted white; } \ No newline at end of file diff --git a/tabs/led_strip.html b/tabs/led_strip.html index 4c2b242c..cd04064e 100644 --- a/tabs/led_strip.html +++ b/tabs/led_strip.html @@ -1,46 +1,46 @@ -
-
-

-
-
- -
-
Remaining
- - -
LED Modes
-
- -
- - - -
- -
LED Orientation
-
- - - - - - -
- - -
LED Strip Wiring
-
- -
-
- - -
-

Wiring order must be set before code will be generated

- -
- -
- -
+
+
+

+
+
+ +
+
Remaining
+ + +
LED Modes
+
+ +
+ + + +
+ +
LED Orientation
+
+ + + + + + +
+ + +
LED Strip Wiring
+
+ +
+
+ + +
+

Wiring order must be set before code will be generated

+ +
+ +
+ +
\ No newline at end of file diff --git a/tabs/led_strip.js b/tabs/led_strip.js index 6511ad11..e2ff19cc 100644 --- a/tabs/led_strip.js +++ b/tabs/led_strip.js @@ -1,211 +1,211 @@ -'use strict'; - -TABS.led_strip = { - totalLights: 0, - currentWire: 0, - wireMode: false, - flightModes: ['w', 'f', 'i', 'a', 't'], - ledOrientations: ['n', 'e', 's', 'w', 'u', 'd'], -}; - -TABS.led_strip.initialize = function (callback, scrollPosition) { - var self = this; - - if (GUI.active_tab != 'led_strip') { - GUI.active_tab = 'led_strip'; - googleAnalytics.sendAppView('LED Strip'); - } - - function load_led_config() { - MSP.send_message(MSP_codes.MSP_LED_STRIP_CONFIG, false, false, load_html); - } - - function load_html() { - $('#content').load("./tabs/led_strip.html", process_html); - } - - load_led_config(); - - - function process_html() { - - localize(); - - // Build Grid - var theHTML = []; - var theHTMLlength = 0; - for (i=0; i<256; i++) { - theHTML[theHTMLlength++] = ('
UD
'); - } - $('.mainGrid').html(theHTML.join('')); - - $('.tempOutput').click(function() { - $(this).select(); - }); - - // Clear Button - $('.funcClear').click(function() { - $('.gPoint').each(function() { - if ($(this).is('.ui-selected')) { - $(this).removeClass(function(index, theClass) { - theClass = theClass.replace(/(^|\s)+gPoint\s+/, ''); - return theClass; - }); - $(this).addClass('ui-selected'); - updateBulkCmd(); - } - }); - - $('.controls button').removeClass('btnOn'); - }); - - - // Directional Buttons - $('.orientation').on('click', 'button', function() { - var that = this; - if ($('.ui-selected').length > 0) { - TABS.led_strip.ledOrientations.forEach(function(letter) { - if ($(that).is('.dir' + letter.toUpperCase())) { - $(that).toggleClass('btnOn'); - $('.ui-selected').toggleClass('dir-' + letter); - } - }); - - updateBulkCmd(); - } - }); - - - // Mode Buttons - $('.modes').on('click', 'button', function() { - var that = this; - if ($('.ui-selected').length > 0) { - TABS.led_strip.flightModes.forEach(function(letter) { - if ($(that).is('.mode' + letter.toUpperCase())) { - $(that).toggleClass('btnOn'); - $('.ui-selected').toggleClass('mode-' + letter); - } - }); - - updateBulkCmd(); - } - }); - - $('.funcWire').click(function() { - (TABS.led_strip.wireMode) ? TABS.led_strip.wireMode=false : TABS.led_strip.wireMode=true; - $(this).toggleClass('btnOn'); - $('.mainGrid').toggleClass('gridWire'); - }); - - $('.funcWireClearSelect').click(function() { - $('.ui-selected').each(function() { - var thisWire = $(this).find('.wire'); - if (thisWire.html() != '') { - thisWire.html(''); - TABS.led_strip.currentWire--; - } - updateBulkCmd(); - }); - }); - - $('.funcWireClear').click(function() { - TABS.led_strip.currentWire = 0; - $('.gPoint .wire').html(''); - updateBulkCmd(); - }); - - - $('.mainGrid').selectable({ - filter: ' > div', - stop: function() { - $('.ui-selected').each(function() { - if (TABS.led_strip.wireMode) { - if ($(this).find('.wire').html() == '' && TABS.led_strip.currentWire < LED_STRIP.length) { - $(this).find('.wire').html(TABS.led_strip.currentWire); - TABS.led_strip.currentWire++; - } - } - - var that = this; - - TABS.led_strip.ledOrientations.forEach(function(letter) { - if ($(that).is('.dir-' + letter)) { - $('.dir' + letter.toUpperCase()).addClass('btnOn'); - } else { - $('.dir' + letter.toUpperCase()).removeClass('btnOn'); - } - }); - - TABS.led_strip.flightModes.forEach(function(letter) { - if ($(that).is('.mode-' + letter)) { - $('.mode' + letter.toUpperCase()).addClass('btnOn'); - } else { - $('.mode' + letter.toUpperCase()).removeClass('btnOn'); - } - }); - - updateBulkCmd(); - }); - } - }); - - $('.mainGrid').disableSelection(); - - updateBulkCmd(); - - if (callback) callback(); - } - - function updateBulkCmd() { - $('.tempOutput').empty(); - $('.tempOutput').html('# Copy and paste commands below into the CLI' + "\n\n"); - var counter = 0; - - $('.gPoint').each(function(){ - if ($(this).is('[class*="mode"]')) { - var gridNumber = ($(this).index() + 1); - var row = Math.ceil(gridNumber / 16) - 1; - var col = gridNumber/16 % 1 * 16 - 1; - if (col < 0) {col = 15;} - - var wireNumber = $(this).find('.wire').html(); - var ledModes = ''; - var directions = ''; - var that = this; - - TABS.led_strip.flightModes.forEach(function(letter){ - if ($(that).is('.mode-' + letter)) { - ledModes += letter.toUpperCase(); - } - }); - - TABS.led_strip.ledOrientations.forEach(function(letter){ - if ($(that).is('.dir-' + letter)) { - directions += letter.toUpperCase(); - } - }); - - if (wireNumber != '') { - $('.tempOutput').append('led ' + wireNumber + ' ' + col + ',' + row + ':' + directions + ':' + ledModes + "\n"); - } - counter++; - } - }); - - TABS.led_strip.totalLights = counter; - - var remaining = LED_STRIP.length - TABS.led_strip.totalLights; - if (remaining <= 0) { - remaining = 0; - $('.wires-remaining').addClass('error'); - } else { - $('.wires-remaining').removeClass('error'); - } - $('.wires-remaining div').html(remaining); - } - -}; - -TABS.led_strip.cleanup = function (callback) { - if (callback) callback(); -}; +'use strict'; + +TABS.led_strip = { + totalLights: 0, + currentWire: 0, + wireMode: false, + flightModes: ['w', 'f', 'i', 'a', 't'], + ledOrientations: ['n', 'e', 's', 'w', 'u', 'd'], +}; + +TABS.led_strip.initialize = function (callback, scrollPosition) { + var self = this; + + if (GUI.active_tab != 'led_strip') { + GUI.active_tab = 'led_strip'; + googleAnalytics.sendAppView('LED Strip'); + } + + function load_led_config() { + MSP.send_message(MSP_codes.MSP_LED_STRIP_CONFIG, false, false, load_html); + } + + function load_html() { + $('#content').load("./tabs/led_strip.html", process_html); + } + + load_led_config(); + + + function process_html() { + + localize(); + + // Build Grid + var theHTML = []; + var theHTMLlength = 0; + for (i=0; i<256; i++) { + theHTML[theHTMLlength++] = ('
UD
'); + } + $('.mainGrid').html(theHTML.join('')); + + $('.tempOutput').click(function() { + $(this).select(); + }); + + // Clear Button + $('.funcClear').click(function() { + $('.gPoint').each(function() { + if ($(this).is('.ui-selected')) { + $(this).removeClass(function(index, theClass) { + theClass = theClass.replace(/(^|\s)+gPoint\s+/, ''); + return theClass; + }); + $(this).addClass('ui-selected'); + updateBulkCmd(); + } + }); + + $('.controls button').removeClass('btnOn'); + }); + + + // Directional Buttons + $('.orientation').on('click', 'button', function() { + var that = this; + if ($('.ui-selected').length > 0) { + TABS.led_strip.ledOrientations.forEach(function(letter) { + if ($(that).is('.dir' + letter.toUpperCase())) { + $(that).toggleClass('btnOn'); + $('.ui-selected').toggleClass('dir-' + letter); + } + }); + + updateBulkCmd(); + } + }); + + + // Mode Buttons + $('.modes').on('click', 'button', function() { + var that = this; + if ($('.ui-selected').length > 0) { + TABS.led_strip.flightModes.forEach(function(letter) { + if ($(that).is('.mode' + letter.toUpperCase())) { + $(that).toggleClass('btnOn'); + $('.ui-selected').toggleClass('mode-' + letter); + } + }); + + updateBulkCmd(); + } + }); + + $('.funcWire').click(function() { + (TABS.led_strip.wireMode) ? TABS.led_strip.wireMode=false : TABS.led_strip.wireMode=true; + $(this).toggleClass('btnOn'); + $('.mainGrid').toggleClass('gridWire'); + }); + + $('.funcWireClearSelect').click(function() { + $('.ui-selected').each(function() { + var thisWire = $(this).find('.wire'); + if (thisWire.html() != '') { + thisWire.html(''); + TABS.led_strip.currentWire--; + } + updateBulkCmd(); + }); + }); + + $('.funcWireClear').click(function() { + TABS.led_strip.currentWire = 0; + $('.gPoint .wire').html(''); + updateBulkCmd(); + }); + + + $('.mainGrid').selectable({ + filter: ' > div', + stop: function() { + $('.ui-selected').each(function() { + if (TABS.led_strip.wireMode) { + if ($(this).find('.wire').html() == '' && TABS.led_strip.currentWire < LED_STRIP.length) { + $(this).find('.wire').html(TABS.led_strip.currentWire); + TABS.led_strip.currentWire++; + } + } + + var that = this; + + TABS.led_strip.ledOrientations.forEach(function(letter) { + if ($(that).is('.dir-' + letter)) { + $('.dir' + letter.toUpperCase()).addClass('btnOn'); + } else { + $('.dir' + letter.toUpperCase()).removeClass('btnOn'); + } + }); + + TABS.led_strip.flightModes.forEach(function(letter) { + if ($(that).is('.mode-' + letter)) { + $('.mode' + letter.toUpperCase()).addClass('btnOn'); + } else { + $('.mode' + letter.toUpperCase()).removeClass('btnOn'); + } + }); + + updateBulkCmd(); + }); + } + }); + + $('.mainGrid').disableSelection(); + + updateBulkCmd(); + + if (callback) callback(); + } + + function updateBulkCmd() { + $('.tempOutput').empty(); + $('.tempOutput').html('# Copy and paste commands below into the CLI' + "\n\n"); + var counter = 0; + + $('.gPoint').each(function(){ + if ($(this).is('[class*="mode"]')) { + var gridNumber = ($(this).index() + 1); + var row = Math.ceil(gridNumber / 16) - 1; + var col = gridNumber/16 % 1 * 16 - 1; + if (col < 0) {col = 15;} + + var wireNumber = $(this).find('.wire').html(); + var ledModes = ''; + var directions = ''; + var that = this; + + TABS.led_strip.flightModes.forEach(function(letter){ + if ($(that).is('.mode-' + letter)) { + ledModes += letter.toUpperCase(); + } + }); + + TABS.led_strip.ledOrientations.forEach(function(letter){ + if ($(that).is('.dir-' + letter)) { + directions += letter.toUpperCase(); + } + }); + + if (wireNumber != '') { + $('.tempOutput').append('led ' + wireNumber + ' ' + col + ',' + row + ':' + directions + ':' + ledModes + "\n"); + } + counter++; + } + }); + + TABS.led_strip.totalLights = counter; + + var remaining = LED_STRIP.length - TABS.led_strip.totalLights; + if (remaining <= 0) { + remaining = 0; + $('.wires-remaining').addClass('error'); + } else { + $('.wires-remaining').removeClass('error'); + } + $('.wires-remaining div').html(remaining); + } + +}; + +TABS.led_strip.cleanup = function (callback) { + if (callback) callback(); +};