Add support for LED strip 'color' mode.

10.3.x-maintenance
Dominic Clifton 2015-01-25 16:22:43 +01:00
parent c5fb803e29
commit 994b04b0aa
4 changed files with 18 additions and 9 deletions

View File

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

View File

@ -29,19 +29,19 @@
cursor: pointer;
}
.tab-led-strip .gPoint.function-w { /* warning */
.tab-led-strip .gPoint.function-w { /* Warning */
background: red;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
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);
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: rgb(50, 205, 50);
}
.tab-led-strip .gPoint.function-i { /* indicator */
.tab-led-strip .gPoint.function-i { /* Indicator */
background: yellow;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: yellow;
@ -53,13 +53,19 @@
border-color: rgb(52, 155, 255);
}
.tab-led-strip .gPoint.function-t { /* Armed Mode */
.tab-led-strip .gPoint.function-t { /* Thrust Mode */
background: orange;
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
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%);
box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
border-color: black;
@ -161,7 +167,9 @@
.tab-led-strip .functions .function-a.btnOn {background: blue;}
.tab-led-strip .functions .function-t.btnOn {background: orange;}
.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 .directions .btnOn {background: #FFF; color: #000;}

View File

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

View File

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