Mirror/betaflight-configurator
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight-configurator.git synced 2025-07-21 23:35:22 +03:00
Code Issues Wiki Activity

Add support for LED strip 'color' mode.

Browse source
This commit is contained in:
Dominic Clifton 2015-01-25 16:22:43 +01:00
parent c5fb803e29
commit 994b04b0aa
4 changed files with 18 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

4
js/msp.js
View file

@ -93,8 +93,8 @@ var MSP = {
callbacks: [], callbacks: [],
packet_error: 0, packet_error: 0,
ledDirectionLetters: ['n', 'e', 's', 'w', 'u', 'd'], // in LSB bit order ledDirectionLetters: ['n', 'e', 's', 'w', 'u', 'd'], // in LSB bit order
ledFunctionLetters: ['i', 'w', 'f', 'a', 't', 'r'], // in LSB bit order ledFunctionLetters: ['i', 'w', 'f', 'a', 't', 'r', 'c'], // in LSB bit order
read: function (readInfo) { read: function (readInfo) {
var data = new Uint8Array(readInfo.data); var data = new Uint8Array(readInfo.data);

20
tabs/led_strip.css
View file

@ -29,19 +29,19 @@
cursor: pointer; cursor: pointer;
} }
.tab-led-strip .gPoint.function-w { /* warning */ .tab-led-strip .gPoint.function-w { /* Warning */
background: red; background: red;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: red; border-color: red;
} }
.tab-led-strip .gPoint.function-f { /* flight mode & orientation */ .tab-led-strip .gPoint.function-f { /* Flight mode & orientation */
background: rgb(50, 205, 50); background: rgb(50, 205, 50);
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: rgb(50, 205, 50); border-color: rgb(50, 205, 50);
} }
.tab-led-strip .gPoint.function-i { /* indicator */ .tab-led-strip .gPoint.function-i { /* Indicator */
background: yellow; background: yellow;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: yellow; border-color: yellow;
@ -53,13 +53,19 @@
border-color: rgb(52, 155, 255); border-color: rgb(52, 155, 255);
} }
.tab-led-strip .gPoint.function-t { /* Armed Mode */ .tab-led-strip .gPoint.function-t { /* Thrust Mode */
background: orange; background: orange;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: orange; border-color: orange;
} }
.tab-led-strip .gPoint.function-r { /* ring */ .tab-led-strip .gPoint.function-c { /* Color */
background: linear-gradient( to bottom right, rgba(255, 0, 0, .5) 0%, rgba(255, 255, 0, 0.5) 15%, rgba(0, 255, 0, .5) 30%, rgba(0, 255, 255, .5) 50%, rgba(0, 0, 255, .5) 65%, rgba(255, 0, 255, .5) 80%, rgba(255, 0, 0, .5) 100%);
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: grey;
}
.tab-led-strip .gPoint.function-r { /* Ring */
background: radial-gradient(ellipse at center, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 60%, white 60%,white 70%,black 70%, black 100%); background: radial-gradient(ellipse at center, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 60%, white 60%,white 70%,black 70%, black 100%);
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7); box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: black; border-color: black;
@ -161,7 +167,9 @@
.tab-led-strip .functions .function-a.btnOn {background: blue;} .tab-led-strip .functions .function-a.btnOn {background: blue;}
.tab-led-strip .functions .function-t.btnOn {background: orange;} .tab-led-strip .functions .function-t.btnOn {background: orange;}
.tab-led-strip .functions .function-r.btnOn {background: #acacac;} .tab-led-strip .functions .function-r.btnOn {background: #acacac;}
.tab-led-strip .functions .function-c.btnOn {
background: linear-gradient( to bottom right, rgba(255, 0, 0, .5) 0%, rgba(255, 255, 0, 0.5) 15%, rgba(0, 255, 0, .5) 30%, rgba(0, 255, 255, .5) 50%, rgba(0, 0, 255, .5) 65%, rgba(255, 0, 255, .5) 80%, rgba(255, 0, 0, .5) 100%);
}
.tab-led-strip .colors .btnOn, .tab-led-strip .colors .btnOn,
.tab-led-strip .directions .btnOn {background: #FFF; color: #000;} .tab-led-strip .directions .btnOn {background: #FFF; color: #000;}

1
tabs/led_strip.html
View file

@ -35,6 +35,7 @@
<button class="function-a w50">Arm State</button> <button class="function-a w50">Arm State</button>
<button class="function-t w50">Throttle</button> <button class="function-t w50">Throttle</button>
<button class="function-r w50">Ring</button> <button class="function-r w50">Ring</button>
<button class="function-c w50">Color</button>
</div> </div>
<div class="section">LED Orientation and Color</div> <div class="section">LED Orientation and Color</div>

2
tabs/led_strip.js
View file

@ -2,7 +2,7 @@
TABS.led_strip = { TABS.led_strip = {
wireMode: false, wireMode: false,
functions: ['w', 'f', 'i', 'a', 't', 'r'], functions: ['w', 'f', 'i', 'a', 't', 'r', 'c'],
directions: ['n', 'e', 's', 'w', 'u', 'd'], directions: ['n', 'e', 's', 'w', 'u', 'd'],
}; };