16mm
/
mcopy
1
0
Fork 0
Code Issues 14 Pull Requests Projects 2 Releases 13 Wiki Activity

Lighting GUI complete 

Able to store swatches of colors in active memory and apply to steps in
the sequencer
This commit is contained in:
Matt 2016-04-17 17:55:23 -04:00
parent d7414d9b7f
commit 3006e2e706
9 changed files with 1747 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

176
app/css/app.css
View File

@ -39,6 +39,11 @@ footer {
#light-status { #light-status {
width: 388px; width: 388px;
float: right; float: right;
margin-top: -25px;
}
#light-status h3 {
font-size: 20px;
text-align: center;
} }
#light-status > div { #light-status > div {
position: relative; position: relative;
@ -60,9 +65,84 @@ footer {
} }
#light-status form input[type=text] { #light-status form input[type=text] {
width: 40px; width: 40px;
background: rgba(255, 255, 255, 0.05);
color: #fff;
border: 1px solid #fff;
} }
#preview { #light-swatches {
margin-top: 40px; width: 100%;
}
#light-swatches .swatch {
cursor: pointer;
width: 50px;
height: 50px;
display: inline-block;
margin: 3px;
box-sizing: border-box;
border: 1px solid #fff;
}
#light-swatches .swatch.default {
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
#light-swatches #new-swatch {
cursor: pointer;
display: inline-block;
border: 1px solid #ffffff;
width: 50px;
height: 50px;
margin: 3px;
box-sizing: border-box;
line-height: 88px;
text-align: center;
font-size: 22px;
position: relative;
opacity: 0.25;
}
#light-swatches #new-swatch:hover {
opacity: 0.5;
}
#light-swatches #new-swatch:active {
opacity: 1;
}
#light-swatches #new-swatch i {
display: block;
position: absolute;
top: 14px;
left: 16px;
color: #fff;
}
#w2ui-popup .swatch {
cursor: pointer;
width: 50px;
height: 50px;
display: inline-block;
margin: 3px;
box-sizing: border-box;
border: 1px solid #fff;
}
#w2ui-popup .swatch.default {
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
#w2ui-popup #new-swatch {
display: none;
}
#preview-wrap {
margin-top: 140px;
}
#preview-wrap h4 {
display: inline-block;
margin: 0;
margin-left: 123px;
margin-right: 10px;
width: 81px;
height: 30px;
}
#preview-wrap h4 span {
display: block;
margin-top: 6px;
position: absolute;
} }
#rgb { #rgb {
border: 0; border: 0;
@ -120,32 +200,53 @@ footer {
#seq_scroll > div > div > div input { #seq_scroll > div > div > div input {
float: none; float: none;
} }
#seq_scroll > div > div > div > div { #numbers div {
font-size: 8px; font-size: 10px;
text-align: center; text-align: center;
color: #dcdcdc; color: #dcdcdc;
} }
#actions { #actions {
padding: 20px 0 0 55px; padding: 8px 0 0 55px;
}
#actions input[type=number] {
background: rgba(255, 255, 255, 0.05);
border: 2px solid #fff;
color: #fff;
padding: 6px;
border-radius: 5px;
float: right;
width: 90px;
margin-right: 60px;
} }
#seq_stats { #seq_stats {
width: 40%; width: 50%;
float: right; float: right;
padding: 20px; padding: 0 20px;
margin-top: 57px; }
#seq_stats h3 {
font-size: 20px;
margin: 12px 0 3px;
} }
#seq_stats span { #seq_stats span {
font-weight: 600; font-weight: 600;
float: right; float: right;
} }
#seq_loop { #seq_loop {
width: 40%;
float: left;
padding: 0 28px; padding: 0 28px;
} }
#seq_loop h3 {
font-size: 20px;
margin: 12px 0 3px;
}
#seq_loop input { #seq_loop input {
font-family: monospace; font-family: monospace;
font-size: 23px; background: rgba(255, 255, 255, 0.05);
color: #fff;
font-size: 21px;
width: 121px; width: 121px;
padding: 12px; padding: 6px 12px;
} }
button { button {
display: block; display: block;
@ -177,9 +278,8 @@ button:focus {
} }
#sequence { #sequence {
width: 970px; width: 970px;
padding-bottom: 25px; padding-bottom: 21px;
padding-left: 70px; padding-left: 70px;
height: 230px;
} }
#sequence #cam_forward, #sequence #cam_forward,
#sequence #proj_forward, #sequence #proj_forward,
@ -190,7 +290,6 @@ button:focus {
#sequence #proj_forward input[type=checkbox], #sequence #proj_forward input[type=checkbox],
#sequence #black_forward input[type=checkbox] { #sequence #black_forward input[type=checkbox] {
border: 1px solid #00C4A0; border: 1px solid #00C4A0;
margin-right: 3px;
} }
#sequence #cam_forward input[type=checkbox]:checked, #sequence #cam_forward input[type=checkbox]:checked,
#sequence #proj_forward input[type=checkbox]:checked, #sequence #proj_forward input[type=checkbox]:checked,
@ -211,7 +310,6 @@ button:focus {
#sequence #proj_backward input[type=checkbox], #sequence #proj_backward input[type=checkbox],
#sequence #black_backward input[type=checkbox] { #sequence #black_backward input[type=checkbox] {
border: 1px solid #AB1A25; border: 1px solid #AB1A25;
margin-right: 3px;
} }
#sequence #cam_backward input[type=checkbox]:checked, #sequence #cam_backward input[type=checkbox]:checked,
#sequence #proj_backward input[type=checkbox]:checked, #sequence #proj_backward input[type=checkbox]:checked,
@ -223,23 +321,36 @@ button:focus {
#sequence #black_backward > div { #sequence #black_backward > div {
color: #AB1A25; color: #AB1A25;
} }
#sequence #cam_backward {
margin-top: 15px;
}
#sequence input[type=checkbox] { #sequence input[type=checkbox] {
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
background: transparent; background: transparent;
outline: none; outline: none;
display: block;
width: 35px; width: 35px;
height: 35px; height: 35px;
border-radius: 5px; border-radius: 5px;
margin: 0; margin: 0;
margin-bottom: 3px; margin-bottom: 3px;
float: left; margin-right: 3px;
display: inline-block;
box-sizing: border-box; box-sizing: border-box;
cursor: pointer;
}
#sequence .L {
display: inline-block;
width: 35px;
height: 35px;
border-radius: 35px;
margin: 0;
margin-bottom: 3px;
margin-right: 3px;
border: 1px solid #fff;
opacity: 0.5;
cursor: pointer;
}
#sequence .L.a {
opacity: 1;
} }
#sequence input.h { #sequence input.h {
border-color: #DAE035 !important; border-color: #DAE035 !important;
@ -255,10 +366,35 @@ button:focus {
color: #fff; color: #fff;
font-family: monospace; font-family: monospace;
float: left; float: left;
margin: 3px; margin-right: 3px;
text-align: center; text-align: center;
opacity: 0.5; opacity: 0.5;
} }
#sequence #numbers > div.h {
color: #DAE035;
opacity: 1;
}
#seq_labels {
font-family: monospace;
background-color: #272b30;
position: absolute;
top: 128px;
padding-top: 2px;
padding-bottom: 15px;
width: 54px;
}
#seq_labels div {
height: 43px;
line-height: 35px;
}
#seq_labels span {
text-indent: 7px;
display: inline-block;
margin-right: 5px;
}
.spacer {
margin-top: 15px;
}
.cp-app { .cp-app {
position: relative !important; position: relative !important;
border-radius: 0px !important; border-radius: 0px !important;

192
app/css/app.less
View File

@ -8,6 +8,8 @@
@SEQ: #3C3636; @SEQ: #3C3636;
@SCRIPT: rgb(39, 40, 34); @SCRIPT: rgb(39, 40, 34);
@INPUT_BG : rgba(255, 255, 255, 0.05);
.monospace () { .monospace () {
font-family: monospace; font-family: monospace;
} }
@ -85,6 +87,11 @@ footer{
#light-status{ #light-status{
width: 388px; width: 388px;
float: right; float: right;
margin-top: -25px;
h3{
font-size: 20px;
text-align: center;
}
>div{ >div{
position: relative; position: relative;
clear: both; clear: both;
@ -104,11 +111,91 @@ footer{
} }
input[type=text]{ input[type=text]{
width: 40px; width: 40px;
background: @INPUT_BG;
color: @COMMON;
border: 1px solid @COMMON;
}
}
}
#light-swatches{
width: 100%;
.swatch{
cursor: pointer;
width: 50px;
height: 50px;
display: inline-block;
margin: 3px;
box-sizing: border-box;
border: 1px solid #fff;
&.default{
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
}
#new-swatch{
cursor: pointer;
display: inline-block;
border: 1px solid rgb(255, 255, 255);
width: 50px;
height: 50px;
margin: 3px;
box-sizing: border-box;
line-height: 88px;
text-align: center;
font-size: 22px;
position: relative;
opacity: 0.25;
&:hover{
opacity: 0.5;
}
&:active{
opacity: 1;
}
i{
display: block;
position: absolute;
top: 14px;
left: 16px;
color: #fff;
}
}
}
#w2ui-popup{
.swatch{
cursor: pointer;
width: 50px;
height: 50px;
display: inline-block;
margin: 3px;
box-sizing: border-box;
border: 1px solid #fff;
&.default{
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
}
#new-swatch{
display: none;
}
}
#preview-wrap{
margin-top: 140px;
h4{
display: inline-block;
margin: 0;
margin-left: 123px;
margin-right: 10px;
width: 81px;
height: 30px;
span{
display: block;
margin-top: 6px;
position: absolute;
} }
} }
} }
#preview{ #preview{
margin-top: 40px; //margin-top: 40px;
} }
#rgb{ #rgb{
border: 0; border: 0;
@ -135,7 +222,7 @@ footer{
display: block; display: block;
} }
input{ input{
background: rgba(255, 255, 255, 0.05); background: @INPUT_BG;
color: @COMMON; color: @COMMON;
padding: 6px 12px; padding: 6px 12px;
font-size: 21px; font-size: 21px;
@ -163,22 +250,36 @@ footer{
input{ input{
float: none; float: none;
} }
>div{ }
font-size: 8px; }
text-align: center; #numbers{
div{
color: rgb(220, 220, 220); font-size: 10px;
} text-align: center;
color: rgb(220, 220, 220);
} }
} }
#actions{ #actions{
padding: 20px 0 0 55px; padding: 8px 0 0 55px;
input[type=number] {
background: @INPUT_BG;
border: 2px solid @COMMON;
color: @COMMON;
padding: 6px;
border-radius: 5px;
float: right;
width: 90px;
margin-right: 60px;
}
} }
#seq_stats{ #seq_stats{
width: 40%; width: 50%;
float: right; float: right;
padding: 20px; padding: 0 20px;
margin-top: 57px; h3{
font-size: 20px;
margin: 12px 0 3px;
}
span{ span{
font-weight: 600; font-weight: 600;
float: right; float: right;
@ -187,12 +288,20 @@ footer{
} }
} }
#seq_loop{ #seq_loop{
width: 40%;
float: left;
padding: 0 28px; padding: 0 28px;
h3{
font-size: 20px;
margin: 12px 0 3px;
}
input{ input{
.monospace(); .monospace();
font-size: 23px; background: @INPUT_BG;
color: @COMMON;
font-size: 21px;
width: 121px; width: 121px;
padding: 12px; padding: 6px 12px;
} }
} }
button{ button{
@ -207,16 +316,14 @@ button{
} }
#sequence{ #sequence{
width: 970px; width: 970px;
padding-bottom: 25px; padding-bottom: 21px;
padding-left: 70px; padding-left: 70px;
height: 230px;
#cam_forward, #cam_forward,
#proj_forward, #proj_forward,
#black_forward{ #black_forward{
clear: both; clear: both;
input[type=checkbox]{ input[type=checkbox]{
border: 1px solid @FORWARD; border: 1px solid @FORWARD;
margin-right: 3px;
&:checked{ &:checked{
background: @FORWARD; background: @FORWARD;
//background: radial-gradient(circle at 25px 25px, #00C4A0, #343434); //background: radial-gradient(circle at 25px 25px, #00C4A0, #343434);
@ -232,7 +339,6 @@ button{
clear: both; clear: both;
input[type=checkbox]{ input[type=checkbox]{
border: 1px solid @BACKWARD; border: 1px solid @BACKWARD;
margin-right: 3px;
&:checked{ &:checked{
background: @BACKWARD; background: @BACKWARD;
//background: radial-gradient(circle at 25px 25px, #AB1A25, #343434); //background: radial-gradient(circle at 25px 25px, #AB1A25, #343434);
@ -242,23 +348,36 @@ button{
color: @BACKWARD; color: @BACKWARD;
} }
} }
#cam_backward{
margin-top: 15px;
}
input[type=checkbox]{ input[type=checkbox]{
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
background: transparent; background: transparent;
outline: none; outline: none;
display: block;
width: 35px; width: 35px;
height: 35px; height: 35px;
border-radius: 5px; border-radius: 5px;
margin: 0; margin: 0;
margin-bottom: 3px; margin-bottom: 3px;
float: left; margin-right: 3px;
display: inline-block;
box-sizing: border-box; box-sizing: border-box;
cursor: pointer;
}
.L{
display: inline-block;
width: 35px;
height: 35px;
border-radius: 35px;
margin: 0;
margin-bottom: 3px;
margin-right: 3px;
border: 1px solid @COMMON;
opacity: 0.5;
cursor: pointer;
&.a{
opacity: 1;
}
} }
input.h{ input.h{
//background: @SELECTED !important; //background: @SELECTED !important;
@ -274,12 +393,37 @@ button{
color: @COMMON; color: @COMMON;
font-family: monospace; font-family: monospace;
float: left; float: left;
margin: 3px; margin-right: 3px;
text-align: center; text-align: center;
opacity: 0.5; opacity: 0.5;
&.h{
color: @SELECTED;
opacity: 1;
}
} }
} }
} }
#seq_labels{
.monospace();
background-color: #272b30;
position: absolute;
top: 128px;
padding-top: 2px;
padding-bottom: 15px;
width: 54px;
div{
height: 43px;
line-height: 35px;
}
span{
text-indent: 7px;
display: inline-block;
margin-right: 5px;
}
}
.spacer{
margin-top: 15px;
}
.cp-app{ .cp-app{
position: relative !important; position: relative !important;

1
app/gulpfile.js
View File

@ -5,6 +5,7 @@ var gulp = require('gulp'),
var scripts = [ var scripts = [
'./src/jquery-1.11.3.min.js', './src/jquery-1.11.3.min.js',
'./src/jquery-electron-fix.js', './src/jquery-electron-fix.js',
'./src/jquery.contextMenu.min.js',
'./src/w2ui-1.4.3.min.js', './src/w2ui-1.4.3.min.js',
'./src/moment.min.js', './src/moment.min.js',
'./src/colors.js', './src/colors.js',

54
app/index.html
View File

@ -16,22 +16,39 @@
<div id="counters"> <div id="counters">
<div class="cam"> <div class="cam">
<label>CAMERA</label> <label>CAMERA</label>
<input type="number" id="seq_cam_count" class="count" value="00000" onchange="mcopy.gui.trad.counterFormat(this, mcopy.state.camera.pos);" onblur="mcopy.gui.trad.updateCam(this);" /> <input type="number" id="seq_cam_count" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.camera.pos);" onblur="gui.updateCam(this);" />
</div> </div>
<div class="proj"> <div class="proj">
<label>PROJECTOR</label> <label>PROJECTOR</label>
<input type="number" id="seq_proj_count" class="count" value="00000" onchange="mcopy.gui.trad.counterFormat(this, mcopy.state.projector.pos);" onblur="mcopy.gui.trad.updateProj(this);" /> <input type="number" id="seq_proj_count" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.projector.pos);" onblur="gui.updateProj(this);" />
</div> </div>
</div> </div>
<div id="seq_scroll"> <div id="seq_scroll">
<div id="sequence"> <div id="sequence">
<div id="cam_forward" class="row" y="0"></div> <div id="cam_forward" class="row" y="0"></div>
<div id="proj_forward" class="row" y="1"></div> <div id="proj_forward" class="row" y="1"></div>
<div id="black_forward" class="row" y="2"></div> <div id="cam_backward" class="row spacer" y="0"></div>
<div id="cam_backward" class="row" y="0"></div>
<div id="proj_backward" class="row" y="1"></div> <div id="proj_backward" class="row" y="1"></div>
<div id="black_backward" class="row" y="2"></div> <div id="light_set" class="row spacer"></div>
<div id="numbers" class="row"></div>
</div> </div>
<div id="seq_labels">
<div><span>CAM </span><i class="fa fa-plus"></i></div>
<div><span>PRO </span><i class="fa fa-plus"></i></div>
<div class="spacer"><span>CAM </span><i class="fa fa-minus"></i></div>
<div><span>PRO </span><i class="fa fa-minus"></i></div>
<div class="spacer"><span>LIGHT</span></div>
</div>
</div>
<div id="actions">
<button id="seq_run" onclick="seq.init();">RUN</button>
<button id="seq_stop" onclick="seq.stop(true);">STOP</button>
<button id="seq_clear" onclick="gui.grid.clear();">CLEAR</button>
<button id="seq_plus24" onclick="gui.grid.plus_24();">+ 24</button>
<button id="seq_mscript" onclick="gui.mscript.generate(mcopy.state.sequence.arr);">TO SCRIPT</button>
<input id="seq_scroll_state" type="number" min="0" value="00000" />
</div> </div>
<div id="seq_stats"> <div id="seq_stats">
<h3>STATS</h3> <h3>STATS</h3>
@ -40,16 +57,9 @@
<div class="cam_end">Camera end position: <span>00000</span></div> <div class="cam_end">Camera end position: <span>00000</span></div>
<div class="proj_end">Projector end position: <span>00000</span></div> <div class="proj_end">Projector end position: <span>00000</span></div>
</div> </div>
<div id="actions">
<button id="seq_run" onclick="mcopy.seq.init();">RUN</button>
<button id="seq_stop" onclick="mcopy.seq.stop(true);">STOP</button>
<button id="seq_clear" onclick="mcopy.gui.grid.clear();">CLEAR</button>
<button id="seq_plus24" onclick="mcopy.gui.grid.plus_24();">+ 24</button>
<button id="seq_mscript" onclick="mcopy.gui.mscript.generate(mcopy.state.sequence.arr);">TO SCRIPT</button>
</div>
<div id="seq_loop"> <div id="seq_loop">
<h3>LOOPS</h3> <h3>LOOPS</h3>
<input type="number" min="1" id="seq_loop" value="00001" onchange="this.value = mcopy.fmtZero(this.value, 6); mcopy.gui.grid.loopChange(this);"/> <input type="number" min="1" id="seq_loop" value="00001" onchange="this.value = gui.fmtZero(this.value, 6); gui.grid.loopChange(this);"/>
</div> </div>
</div> </div>
<div id="script" class="screen"></div> <div id="script" class="screen"></div>
@ -66,17 +76,25 @@
</div> </div>
</div> </div>
<div id="light-status"> <div id="light-status">
<h3>LIGHT STATUS</h3>
<div> <div>
<form> <form>
<span>R</span><input type="text" value="0"/><br /> <span>R</span><input type="text" value="0" readonly /><br />
<span>G</span><input type="text" value="0"/><br /> <span>G</span><input type="text" value="0" readonly /><br />
<span>B</span><input type="text" value="0"/> <span>B</span><input type="text" value="0" readonly />
</form> </form>
<div id="color"></div> <div id="color"></div>
</div> </div>
Preview <div id="preview-wrap">
<input type="checkbox" name="preview" id="preview" class="effeckt-ckbox-ios7" /> <h4><span>PREVIEW</span></h4>
<input type="checkbox" name="preview" id="preview" class="effeckt-ckbox-ios7" />
</div>
</div> </div>
<footer id="light-swatches">
<div id="new-swatch">
<i class="fa fa-plus"></i>
</div>
</footer>
</div> </div>
</div> </div>
<script src="./js/app.js"></script> <script src="./js/app.js"></script>

668
app/js/app.js
View File

File diff suppressed because one or more lines are too long

173
app/main.js
View File

@ -1,6 +1,8 @@
var electron = require('electron'), var electron = require('electron'),
fs = require('fs'), fs = require('fs'),
Menu = require('menu'), Menu = require('menu'),
MenuItem = require('menu-item'),
notifier = require('node-notifier'),
ipcMain = require('electron').ipcMain, ipcMain = require('electron').ipcMain,
app = electron.app, app = electron.app,
BrowserWindow = electron.BrowserWindow, BrowserWindow = electron.BrowserWindow,
@ -32,7 +34,9 @@ var init = function () {
'use strict'; 'use strict';
mcopy.cfgInit(); mcopy.cfgInit();
createWindow(); createWindow();
//createMenu();
log.init(); log.init();
light.init();
arduino = require('./lib/mcopy-arduino.js')(mcopy.cfg); arduino = require('./lib/mcopy-arduino.js')(mcopy.cfg);
setTimeout(function () { setTimeout(function () {
arduino.init(function (err, device) { arduino.init(function (err, device) {
@ -52,14 +56,144 @@ var init = function () {
}; };
var createMenu = function () { var createMenu = function () {
var template = [
{
label: 'mcopy',
submenu: [
{
label: 'About mcopy',
selector: 'orderFrontStandardAboutPanel:'
},
{
type: 'separator'
},
{
label: 'Services',
submenu: []
},
{
type: 'separator'
},
{
label: 'Hide mcopy',
accelerator: 'Command+H',
selector: 'hide:'
},
{
label: 'Hide Others',
accelerator: 'Command+Shift+H',
selector: 'hideOtherApplications:'
},
{
label: 'Show All',
selector: 'unhideAllApplications:'
},
{
type: 'separator'
},
{
label: 'Quit',
accelerator: 'Command+Q',
selector: 'terminate:'
},
]
},
{
label: 'Edit',
submenu: [
{
label: 'Undo',
accelerator: 'Command+Z',
selector: 'undo:'
},
{
label: 'Redo',
accelerator: 'Shift+Command+Z',
selector: 'redo:'
},
{
type: 'separator'
},
{
label: 'Cut',
accelerator: 'Command+X',
selector: 'cut:'
},
{
label: 'Copy',
accelerator: 'Command+C',
selector: 'copy:'
},
{
label: 'Paste',
accelerator: 'Command+V',
selector: 'paste:'
},
{
label: 'Select All',
accelerator: 'Command+A',
selector: 'selectAll:'
}
]
},
{
label: 'View',
submenu: [
{
label: 'Reload',
accelerator: 'Command+R',
click: function() { getCurrentWindow().reload(); }
},
{
label: 'Toggle DevTools',
accelerator: 'Alt+Command+I',
click: function() { getCurrentWindow().toggleDevTools(); }
},
]
},
{
label: 'Window',
submenu: [
{
label: 'Minimize',
accelerator: 'Command+M',
selector: 'performMiniaturize:'
},
{
label: 'Close',
accelerator: 'Command+W',
selector: 'performClose:'
},
{
type: 'separator'
},
{
label: 'Bring All to Front',
selector: 'arrangeInFront:'
}
]
},
{
label: 'Help',
submenu: []
}
];
menu = Menu.buildFromTemplate(template);
Menu.setApplicationMenu(menu);
}; };
var createWindow = function () { var createWindow = function () {
'use strict'; 'use strict';
mainWindow = new BrowserWindow({width: 800, height: 600}); mainWindow = new BrowserWindow({
width: 800,
height: 600,
minWidth : 800,
minHeight : 600
});
mainWindow.loadURL('file://' + __dirname + '/index.html'); mainWindow.loadURL('file://' + __dirname + '/index.html');
//mainWindow.webContents.openDevTools(); mainWindow.webContents.openDevTools();
mainWindow.on('closed', function() { mainWindow.on('closed', function() {
mainWindow = null; mainWindow = null;
}); });
@ -68,9 +202,9 @@ var createWindow = function () {
app.on('ready', init); app.on('ready', init);
app.on('window-all-closed', function () { app.on('window-all-closed', function () {
if (process.platform !== 'darwin') { //if (process.platform !== 'darwin') {
app.quit(); app.quit();
} //}
}); });
app.on('activate', function () { app.on('activate', function () {
@ -79,23 +213,30 @@ app.on('activate', function () {
} }
}); });
ipcMain.on('light', function(event, arg) {
light.set(arg);
event.returnValue = true;
});
var light = {}; var light = {};
light.init = function () {
light.set = function (rgb) {
'use strict'; 'use strict';
var str = rgb.join(','), light.listen();
deferred = Q.defer(); };
light.listen = function () {
'use strict';
ipcMain.on('light', function(event, arg) {
light.set(arg.rgb, arg.id);
event.returnValue = true;
});
};
light.set = function (rgb, id) {
'use strict';
var str = rgb.join(',');
arduino.send(mcopy.cfg.arduino.cmd.light, function () { arduino.send(mcopy.cfg.arduino.cmd.light, function () {
log.info('Light set to ' + str, 'LIGHT', true, true); light.end(rgb, id);
return deferred.resolve(mcopy.cfg.arduino.cmd.light);
}); });
arduino.string(str); arduino.string(str);
return deferred.promise; };
light.end = function (rgb, id) {
'use strict';
log.info('Light set to ' + rgb.join(','), 'LIGHT', true, true);
mainWindow.webContents.send('light', {rgb: rgb, id : id});
}; };
var log = {}; var log = {};

3
app/package.json
View File

@ -4,7 +4,7 @@
"description": "16mm optical printer", "description": "16mm optical printer",
"main": "main.js", "main": "main.js",
"scripts": { "scripts": {
"start": "electron main.js" "start": "gulp && electron main.js"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
@ -31,6 +31,7 @@
"gulp-less": "^3.0.5" "gulp-less": "^3.0.5"
}, },
"dependencies": { "dependencies": {
"humanize-duration": "^3.7.0",
"moment": "^2.12.0", "moment": "^2.12.0",
"node-notifier": "^4.5.0", "node-notifier": "^4.5.0",
"node-uuid": "^1.4.7", "node-uuid": "^1.4.7",

649
app/src/index.js
View File

@ -1,10 +1,14 @@
var remote = require('remote'), var remote = require('remote'),
dialog = require('electron').remote.dialog,
fs = require('fs'), fs = require('fs'),
uuid = require('node-uuid'), uuid = require('node-uuid'),
moment = require('moment'),
humanizeDuration = require('humanize-duration')
ipcRenderer = require('electron').ipcRenderer, ipcRenderer = require('electron').ipcRenderer,
mcopy = {}, mcopy = {},
light = {}, light = {},
nav = {}, nav = {},
seq = {},
gui = {}, gui = {},
log = {}; log = {};
//console.log(ipcRenderer.sendSync('light', { 'fuck' : true }) ); //console.log(ipcRenderer.sendSync('light', { 'fuck' : true }) );
@ -15,7 +19,7 @@ mcopy.cfg = JSON.parse(fs.readFileSync('./data/cfg.json'), 'utf8');
State shared by ALL interfaces State shared by ALL interfaces
*******/ *******/
mcopy.state = { mcopy.state = {
version : 'alpha', //use for file compatibility check version : '2.0.0', //use for file compatibility check
camera : { camera : {
pos : 0, pos : 0,
direction: true direction: true
@ -27,6 +31,7 @@ mcopy.state = {
sequence : { sequence : {
size : 24, size : 24,
arr : ['CF', 'PF'], arr : ['CF', 'PF'],
light : ['255,255,255', ''],
cmd : { cmd : {
camera: mcopy.cfg.arduino.cmd.camera, camera: mcopy.cfg.arduino.cmd.camera,
projector: mcopy.cfg.arduino.cmd.projector, projector: mcopy.cfg.arduino.cmd.projector,
@ -40,7 +45,9 @@ mcopy.state = {
cam_backward: 'CB', cam_backward: 'CB',
proj_backward : 'PB', proj_backward : 'PB',
black_backward : 'BB' black_backward : 'BB',
light_set : 'L'
} }
} }
}; };
@ -101,38 +108,336 @@ log.info = function (action, service, status, time) {
console.log(obj); console.log(obj);
}; };
/******
Sequence Object
*******/
seq.i = 0;
mcopy.loop = 1;
mcopy.loopCount = 0;
mcopy.seq_time = 0;
seq.stopState = false;
seq.run = function () {
var cmd = mcopy.state.sequence.arr[seq.i],
action = function () {
setTimeout(function () {
seq.i++;
seq.run();
}, mcopy.cfg.arduino.sequenceDelay);
},
timeEnd = 0;
if (seq.stop()) {
$('.row input').removeClass('h');
console.log('Sequence stepped');
return false;
}
if (seq.i <= mcopy.state.sequence.arr.length && cmd !== undefined) {
console.log('Sequence step ' + seq.i + ' command ' + cmd + '...');
//gui action
$('.row input').removeClass('h');
$('.row input[x=' + seq.i + ']').addClass('h');
$('#numbers div[x=' + seq.i + ']').addClass('h');
/*if (cmd === 'CF'){
mcopy.cmd.cam_forward(action);
} else if (cmd === 'CB') {
mcopy.cmd.cam_backward(action);
} else if (cmd === 'PF') {
mcopy.cmd.proj_forward(action);
} else if (cmd === 'PB') {
mcopy.cmd.proj_backward(action);
} else if (cmd === 'BF') {
mcopy.cmd.black_forward(action);
} else if (cmd === 'BB') {
mcopy.cmd.black_backward(action);
}*/
} else {
mcopy.loopCount++;
if (mcopy.loopCount < mcopy.loop) {
console.log('Loop ' + mcopy.loopCount + ' completed!');
$('.row input').removeClass('h');
seq.i = 0;
seq.run();
} else {
console.log('Sequence completed!');
timeEnd = +new Date();
timeEnd = timeEnd - mcopy.seq_time;
setTimeout(function () {
if (timeEnd < 2000) {
console.log('Sequence took ' + timeEnd + 'ms');
} else {
console.log('Sequence took ' + humanizeDuration(timeEnd));
}
}, 500);
//clear gui
$('.row input').removeClass('h');
$('#numbers div').removeClass('h');
seq.stats();
}
}
};
seq.stop = function (state) {
if (typeof state === 'undefined') {
return seq.stopState;
} else {
seq.stopState = state;
}
};
seq.init = function (start) {
if (typeof start === 'undefined') {
start = 0;
mcopy.loopCount = 0;
mcopy.seq_time = +new Date();
}
seq.stop(false);
seq.i = start;
seq.run();
};
seq.stats = function () {
var ms = 0,
cmd = '',
cam_total = 0,
proj_total = 0,
real_total = mcopy.state.sequence.arr.filter(function (elem) {
if (elem === undefined) {
return false;
}
return true;
});
//timing
for (var i = 0; i < mcopy.state.sequence.arr.length; i++) {
cmd = mcopy.state.sequence.arr[i];
if (cmd === 'CF' || cmd === 'CB'){
ms += mcopy.cfg.arduino.cam.time;
ms += mcopy.cfg.arduino.cam.delay;
ms += mcopy.cfg.arduino.serialDelay;
}
if (cmd === 'PF' || cmd === 'PB'){
ms += mcopy.cfg.arduino.proj.time;
ms += mcopy.cfg.arduino.proj.delay;
ms += mcopy.cfg.arduino.serialDelay;
}
if (cmd === 'BF' || cmd === 'BB'){
ms += mcopy.cfg.arduino.black.before;
ms += mcopy.cfg.arduino.black.after;
ms += mcopy.cfg.arduino.cam.time;
ms += mcopy.cfg.arduino.cam.delay;
ms += mcopy.cfg.arduino.serialDelay;
}
ms += mcopy.cfg.arduino.sequenceDelay;
if (cmd === 'CF' || cmd === 'BF') {
cam_total++;
}
if (cmd === 'CB' || cmd === 'BB') {
cam_total--;
}
if (cmd === 'PF') {
proj_total++;
}
if (cmd === 'PB') {
proj_total--;
}
}
//timing
ms = ms * mcopy.loop;
if (ms < 2000) {
$('#seq_stats .timing span').text(ms + 'ms');
} else {
$('#seq_stats .timing span').text(humanizeDuration(ms));
}
//ending frames
cam_total = cam_total * mcopy.loop;
proj_total = proj_total * mcopy.loop;
$('#seq_stats .cam_end span').text(gui.fmtZero(mcopy.state.camera.pos + cam_total, 6));
$('#seq_stats .proj_end span').text(gui.fmtZero(mcopy.state.projector.pos + proj_total, 6));
//count
$('#seq_stats .seq_count span').text(real_total.length * mcopy.loop);
return ms;
};
seq.clear = function () {
mcopy.state.sequence.size = 24;
mcopy.state.sequence.arr = [];
};
//GUI
gui.fmtZero = function (val, len) {
var raw = val,
str = val + '',
output = ''
if (raw < 0) {
output = '-' + Array(len - (str.length - 1)).join('0') + str.replace('-', '');
} else {
if (str.length < len) {
output = Array(len - str.length).join('0') + str;
} else if (str.length >= len) {
str = parseInt(str) + '';
output = Array(len - str.length).join('0') + str;
}
}
return output;
};
gui.counterFormat = function (t, normal, prevent) {
var raw = t.value;
t.value = gui.fmtZero(raw, 6);
if (typeof normal !== 'undefined' && parseInt(raw) !== normal) {
$(t).addClass('changed');
} else {
$(t).removeClass('changed');
}
if (typeof prevent === 'undefined') { prevent = false; }
if (!prevent) {
gui.shootGoto(t);
}
};
gui.shootGoto = function (t) {
var elem = $(t),
id = elem.attr('id').split('_'),
val = 0,
comp = 0,
other = {};
if (id[1] === 'cam') {
comp = mcopy.state.camera.pos;
} else if (id[1] === 'proj') {
comp = mcopy.state.projector.pos;
}
if (id[0] === 'shoot') {
other = $('#goto_' + id[1]);
val = parseInt(elem.val()) + comp;
other.val(val);
gui.counterFormat(other[0], comp, true);
//other.trigger('change');
} else if (id[0] === 'goto'){
other = $('#shoot_' + id[1]);
val = parseInt(elem.val()) - comp;
other.val(val);
gui.counterFormat(other[0], undefined, true);
} else {
//ALLOW TO EXECUTE WITH NO RESULTS
//console.log('You screwed up the markup.');
}
};
gui.updateCam = function (t) {
var val = t.value,
change;
if (parseInt(val) === mcopy.state.camera.pos) { return false; }
change = confirm('Are you sure you want to set camera counter to ' + val + '?');
if (change) {
mcopy.state.camera.pos = parseInt(val);
gui.updateState();
} else {
t.value = mcopy.state.camera.pos;
gui.counterFormat(t);
}
};
gui.updateProj = function (t) {
var val = t.value,
change;
if (parseInt(val) === mcopy.state.projector.pos) { return false; }
change = confirm('Are you sure you want to set projector counter to ' + val + '?');
if (change) {
mcopy.state.projector.pos = parseInt(val);
gui.updateState();
} else {
t.value = mcopy.state.projector.pos;
gui.counterFormat(t);
}
};
gui.updateState = function () {
var cpos = mcopy.state.camera.pos,
ppos = mcopy.state.projector.pos;
$('#trad_cam_count').val(cpos).change();
$('#trad_proj_count').val(ppos).change();
$('#seq_cam_count').val(cpos).change();
$('#seq_proj_count').val(ppos).change();
$('#goto_cam').val(cpos).change();
$('#goto_proj').val(ppos).change();
};
gui.info = function (title, message) {
'use strict';
var config = {
type : 'info',
buttons : ['Ok'],
title: 'Sometitle',
message : 'some message'
};
dialog.showMessageBox(config);
/*
type String - Can be "none", "info", "error", "question" or "warning". On Windows, "question" displays the same icon as "info", unless you set an icon using the "icon" option.
buttons Array - Array of texts for buttons.
defaultId Integer - Index of the button in the buttons array which will be selected by default when the message box opens.
title String - Title of the message box, some platforms will not show it.
message String - Content of the message box.
detail String - Extra information of the message.
icon NativeImage
cancelId Integer - The value will be returned when user cancels the dialog instead of clicking the buttons of the dialog. By default it is the index of the buttons that have "cancel" or "no" as label, or 0 if there is no such buttons. On OS X and Windows the index of "Cancel" button will always be used as cancelId, not matter whether it is already specified.
noLink Boolean - On Windows Electron will try to figure out which one of the buttons are common buttons (like "Cancel" or "Yes"), and show the others as command links in the dialog. This can make the dialog appear in the style of modern Windows apps. If you don't like this behavior, you can set noLink to true.
*/
};
gui.confirm = function () {};
gui.error = function () {};
/****** /******
Sequencer grid Sequencer grid
*******/ *******/
gui.grid = {}; gui.grid = {};
gui.grid.layout = function () { gui.grid.swatchesElem = {};
gui.grid.init = function () {
'use strict'; 'use strict';
gui.grid.refresh(); gui.grid.refresh();
//mcopy.seq.stats(); seq.stats();
gui.grid.events();
}; };
gui.grid.state = function (i) { gui.grid.state = function (i) {
'use strict'; 'use strict';
if (mcopy.state.sequence.arr[i] !== undefined) { var elem = $('input[x=' + i + ']'),
$('input[x=' + i + ']').prop('checked', false); lightElem = $('.L' + '[x=' + i + ']');
if (typeof mcopy.state.sequence.arr[i] !== 'undefined') {
elem.prop('checked', false);
$('.' + mcopy.state.sequence.arr[i] + '[x=' + i + ']').prop('checked', true); $('.' + mcopy.state.sequence.arr[i] + '[x=' + i + ']').prop('checked', true);
if (mcopy.state.sequence.arr[i] === 'CF'
|| mcopy.state.sequence.arr[i] === 'CB') {
lightElem.css('background', 'rgb(' + mcopy.state.sequence.light[i] + ')')
.addClass('a')
.prop('title', 'rgb(' + mcopy.state.sequence.light[i] + ')');
} else {
lightElem.css('background', 'transparent')
.removeClass('a')
.prop('title', '');
}
} else {
lightElem.css('background', 'transparent')
.removeClass('a')
.prop('title', '');
} }
}; };
gui.grid.refresh = function () { gui.grid.refresh = function () {
'use strict'; 'use strict';
var cmds = ['cam_forward', 'proj_forward', 'black_forward', 'cam_backward', 'proj_backward', 'black_backward'], var cmds = ['cam_forward', 'proj_forward', 'cam_backward', 'proj_backward', 'light_set', 'numbers'],
check = '', check = '<input type="checkbox" x="xxxx" />',
width = 970 + ((940 / 24) * Math.abs(24 - mcopy.state.sequence.size)); div = '<div x="xxxx"></div>',
elem,
width = 970 - 34 + ((940 / 24) * Math.abs(24 - mcopy.state.sequence.size));
$('#sequence').width(width + 'px'); $('#sequence').width(width + 'px');
for (var i = 0; i < cmds.length; i++) { for (var i = 0; i < cmds.length; i++) {
$('#' + cmds[i]).empty(); $('#' + cmds[i]).empty();
for (var x = 0; x < mcopy.state.sequence.size; x++) { for (var x = 0; x < mcopy.state.sequence.size; x++) {
check = '<input type="checkbox" x="xxxx" />'.replace('xxxx', x);
if (i === cmds.length - 1) { if (i === cmds.length - 1) {
$('#' + cmds[i]).append($('<div>').append($(check).addClass(mcopy.state.sequence.pads[cmds[i]])).append($('<div>').text(x))); elem = div.replace('xxxx', x);
$('#' + cmds[i]).append($(elem).text(x));
} else if (i === cmds.length - 2) {
elem = div.replace('xxxx', x);
$('#' + cmds[i]).append($(elem).addClass(mcopy.state.sequence.pads[cmds[i]]));
} else { } else {
$('#' + cmds[i]).append($(check).addClass(mcopy.state.sequence.pads[cmds[i]])); elem = check.replace('xxxx', x);
$('#' + cmds[i]).append($(elem).addClass(mcopy.state.sequence.pads[cmds[i]]));
} }
gui.grid.state(x); gui.grid.state(x);
} }
@ -140,66 +445,221 @@ gui.grid.refresh = function () {
}; };
gui.grid.click = function (t) { gui.grid.click = function (t) {
'use strict'; 'use strict';
var i = parseInt($(t).attr('x')); var i = parseInt($(t).attr('x')),
cmd;
if ($(t).prop('checked')) { if ($(t).prop('checked')) {
mcopy.log( $(t).attr('class').replace('.', '')); cmd = $(t).attr('class').replace('.', '');
mcopy.state.sequence.arr[i] = $(t).attr('class').replace('.', ''); mcopy.state.sequence.arr[i] = cmd;
gui.grid.state(i); if (cmd === 'CF'
|| cmd === 'CB') {
mcopy.state.sequence.light[i] = light.color.join(',');
} else {
mcopy.state.sequence.light[i] = '';
}
} else { } else {
mcopy.state.sequence.arr[i] = undefined; mcopy.state.sequence.arr[i] = undefined;
delete mcopy.state.sequence.arr[i]; delete mcopy.state.sequence.arr[i];
} }
mcopy.seq.stats(); gui.grid.state(i);
seq.stats();
}; };
gui.grid.clear = function () { gui.grid.clear = function () {
'use strict'; 'use strict';
var doit = confirm('Are you sure you want to clear this sequence?'); var doit = confirm('Are you sure you want to clear this sequence?');
if (doit) { if (doit) {
mcopy.seq.clear(); seq.clear();
gui.grid.refresh(); gui.grid.refresh();
mcopy.seq.stats(); seq.stats();
mcopy.log('Sequencer cleared'); console.log('Sequencer cleared');
} }
}; };
gui.grid.loopChange = function (t) { gui.grid.loopChange = function (t) {
'use strict'; 'use strict';
count = parseInt(t.value); var count = parseInt(t.value);
mcopy.loop = count; mcopy.loop = count;
mcopy.log('Loop count set to ' + mcopy.loop); console.log('Loop count set to ' + mcopy.loop);
mcopy.seq.stats(); seq.stats();
}; };
gui.grid.plus_24 = function () { gui.grid.plus_24 = function () {
'use strict'; 'use strict';
mcopy.state.sequence.size += 24; mcopy.state.sequence.size += 24;
gui.grid.refresh(); gui.grid.refresh();
mcopy.log('Sequencer expanded to ' + mcopy.state.sequence.size + ' steps'); console.log('Sequencer expanded to ' + mcopy.state.sequence.size + ' steps');
};
gui.grid.setLight = function (x, rgb) {
'use strict';
mcopy.state.sequence.light[x] = rgb.join(',');
gui.grid.state(x);
};
gui.grid.blackout = function (t) {
var elem = $(t),
i = elem.attr('x');
if (typeof mcopy.state.sequence.light[i] === 'undefined') {
return false;
}
if (mcopy.state.sequence.light[i] === '0,0,0') {
gui.grid.setLight(i, light.color);
} else {
gui.grid.setLight(i, [0, 0, 0]);
}
};
gui.grid.changeAll = function () {
'use strict';
var rgb = $('.w2ui-msg-body .default').attr('color').split(','),
i;
for (i = 0; i < mcopy.state.sequence.arr.length; i++) {
if (mcopy.state.sequence.arr[i] === 'CF'
|| mcopy.state.sequence.arr[i] === 'CB') {
gui.grid.setLight(i, rgb);
}
}
};
gui.grid.swatches = function (x) {
'use strict';
var current = mcopy.state.sequence.light[x];
gui.grid.swatchesElem = w2popup.open({
title : 'Select Color',
body : $('#light-swatches').html(),
buttons : '<button id="sequencer-ok" class="btn btn-default">Ok</button> <button id="sequencer-changeall" class="btn btn-warning">Change All</button> <button id="sequencer-cancel" class="btn btn-default">Cancel</button>',
onClose : function () {
//
}
});
$('.w2ui-msg-body .swatch').removeClass('default set');
$('.w2ui-msg-body .swatch[color="' + current + '"').eq(0).addClass('default set');
$('#sequencer-cancel').on('click', function () {
gui.grid.swatchesElem.close();
});
$('#sequencer-changeall').on('click', function () {
var doit = confirm('You sure you want to change all light settings?');
if (doit) {
gui.grid.changeAll();
gui.grid.swatchesElem.close();
}
});
$('#sequencer-ok').on('click', function () {
var rgb = $('.w2ui-msg-body .default').attr('color').split(',');
gui.grid.setLight(x, rgb);
light.color = rgb;
gui.grid.swatchesElem.close();
});
};
gui.grid.scrollTo = function (i) {
'use strict';
var w = 35 + 3; //width of pad + margin
$('#seq_scroll').scrollLeft(i * w);
}; };
gui.grid.events = function () { gui.grid.events = function () {
'use strict'; 'use strict';
$(document.body).on('click', 'input[type=checkbox]', function () { $(document.body).on('click', '#sequencer input[type=checkbox]', function () {
gui.grid.click(this); gui.grid.click(this);
}); });
//$(document.body).on('click', '.L', function () {
//alert('click');
//console.log('please dont happen');
//});
$(document.body).on('dblclick', '.L', function () {
gui.grid.blackout(this);
});
$(document.body).on('contextmenu', '.L', function (e) {
var x = e.target.attributes.x.value;
setTimeout(function () {
gui.grid.swatches(x);
}, 300);
e.preventDefault();
return false;
});
$('#seq_scroll').on('scroll', function () {
var i = Math.ceil($('#seq_scroll').scrollLeft() / (35 + 3));
$('#seq_scroll_state').val(gui.fmtZero(i, 6));
});
$('#seq_scroll_state').on('change', function () {
var i = parseInt($(this).val());
$(this).val(gui.fmtZero(i, 6));
gui.grid.scrollTo(i);
});
$(document.body).on('click', '.w2ui-msg-body .swatch', function () {
var color = $(this).attr('color'),
title = $(this).attr('title');
if (typeof color !== 'undefined') {
color = color.split(',');
$('.w2ui-msg-body .swatch').removeClass('default set');
$('#light-swatches .swatch').removeClass('default set');
$(this).addClass('default set');
$('#light-swatches .swatch[title="' + title + '"]').eq(0).addClass('default set');
light.color = color;
}
});
}; };
//LIGHT //LIGHT
light.preview = false; light.preview_state = false; //light is on/off for preview viewing
light.color = [0, 0, 0]; //preview status light.color = [255, 255, 255]; //default color
light.current = [0, 0, 0]; //last sent light.current = [0, 0, 0]; //last sent
light.rgb_on = false;
light.icon = {}; light.icon = {};
light.swatches = [
{
rgb : [0, 0, 0],
name : 'off'
},
{
rgb : [255, 255, 255],
name : 'white (LED)'
},
{
rgb : chroma.kelvin(2500).rgb(),
name : '2500 kelvin'
},
{
rgb : chroma.kelvin(5600).rgb(),
name : '5600 kelvin'
},
{
rgb : light.color,
set : true,
default : true
}
];
light.queue = {};
light.lock = false;
light.init = function () { light.init = function () {
'use strict'; 'use strict';
light.listen();
//create dynamic style for displaying light across screens
light.icon = document.createElement('style'); light.icon = document.createElement('style');
light.icon.innerHTML = 'span.mcopy-light{background-color: #000;}'; light.icon.innerHTML = 'span.mcopy-light{background-color: #000;}';
document.body.appendChild(light.icon); document.body.appendChild(light.icon);
light.colorPickers();
light.swatch.init();
light.display(light.current);
$('#preview').on('change', function () {
light.preview_state = $(this).prop('checked');
if (light.preview_state) {
light.display(light.color);
light.set(light.color);
} else {
light.display([0,0,0]);
light.set([0,0,0]);
}
});
};
light.colorPickers = function () {
'use strict';
$('#colors-tabs').w2tabs({ $('#colors-tabs').w2tabs({
name: 'colors', name: 'colors',
active: 'rgb', active: 'rgb',
tabs: [ tabs: [
{ id: 'rgb', caption: 'RGB' }, { id: 'kelvin', caption: 'Kelvin'},
{ id: 'cmy', caption: 'CMY'}, { id: 'cmy', caption: 'CMY'},
{ id: 'kelvin', caption: 'Kelvin'} { id: 'rgb', caption: 'RGB' }
], ],
onClick: function (event) { onClick: function (event) {
//$('#colors-content').html('Tab: ' + event.target); //$('#colors-content').html('Tab: ' + event.target);
@ -256,33 +716,63 @@ light.init = function () {
//console.dir(type); //console.dir(type);
var a = colors.RND.rgb, var a = colors.RND.rgb,
rgb = [a.r, a.g, a.b]; rgb = [a.r, a.g, a.b];
light.color = rgb; light.preview(rgb);
if (light.preview) {
light.display(rgb);
light.set(rgb);
}
} }
}); });
light.display([0, 0, 0]); };
$('#preview').on('change', function () { light.set = function (rgb, callback) { //rgb = [0,0,0]
light.preview = $(this).prop('checked'); 'use strict';
if (light.preview) { var obj;
light.display(light.color);
light.set(light.color); if (light.lock) {
} else { //potential for logging overlapping commands
light.display([0,0,0]); return false;
light.set([0,0,0]); }
obj = {
rgb : rgb,
id : uuid.v4()
};
ipcRenderer.sendSync('light', obj);
if (typeof callback !== 'undefined') {
obj.callback = callback;
}
light.queue[obj.id] = obj;
light.current = rgb;
light.lock = true;
};
light.end = function (id) {
'use strict';
if (typeof light.queue[id] !== 'undefined') {
if (typeof light.queue[id].callback !== 'undefined') {
light.queue[id].callback();
} }
delete light.queue[id];
light.lock = false;
}
}
light.listen = function () {
'use strict';
ipcRenderer.on('light', function (event, arg) {
light.end(arg.id);
return event.returnValue = true;
}); });
}; };
//rgb = [0,0,0] light.preview = function (rgb) {
light.set = function (rgb) {
'use strict'; 'use strict';
light.current = rgb; var rgbStr = 'rgb(' + rgb.join(',') + ')';
return ipcRenderer.sendSync('light', rgb); light.color = rgb;
$('#light-swatches .swatch.set').css('background', rgbStr)
.attr('color', rgb.join(','))
.prop('title', rgbStr);
if (light.preview_state) {
light.display(rgb);
light.set(rgb);
}
}; };
light.display = function (rgb) { light.display = function (rgb) { //display light active state
'use strict'; 'use strict';
var str, var str,
i; i;
@ -296,14 +786,65 @@ light.display = function (rgb) {
light.icon.deleteRule(0); light.icon.deleteRule(0);
light.icon.insertRule('span.mcopy-light{background-color: ' + str + ';}', 0) light.icon.insertRule('span.mcopy-light{background-color: ' + str + ';}', 0)
}; };
light.color_on = false;
light.color_init = function () { light.color_init = function () {
'use strict'; 'use strict';
if (!light.color_on) { if (!light.rgb_on) {
$('#rgb').focus(); $('#rgb').focus();
light.color_on = true; light.rgb_on = true;
} }
}; };
light.swatch = {};
light.swatch.init = function () {
'use strict';
var number = 12,
add,
elem,
rgb,
i,
x;
for (i = 0; i < light.swatches.length; i++) {
for (x = 0; x < 3; x++) {
light.swatches[i].rgb[x] = Math.floor(light.swatches[i].rgb[x]);
}
rgb = 'rgb(' + light.swatches[i].rgb.join(',') + ')';
elem = $('<div class="swatch"></div>');
elem.css('background', rgb);
elem.attr('color', light.swatches[i].rgb.join(','));
if (typeof light.swatches[i].name !== 'undefined') {
elem.prop('title', light.swatches[i].name);
} else {
elem.prop('title', rgb);
}
if (light.swatches[i].default) {
elem.addClass('default');
}
if (light.swatches[i].set) {
elem.addClass('set');
}
$('#new-swatch').before(elem);
}
$('#new-swatch').on('click', light.swatch.add);
$(document.body).on('click', '#light-swatches .swatch', function () {
var rgb = $(this).attr('color');
if (typeof color !== 'undefined') {
rgb = rgb.split(',');
$('#light-swatches .swatch').removeClass('default set');
$(this).addClass('default set');
light.preview(rgb);
}
});
$(document.body).on('dblclick', '.swatch', function () {
});
};
light.swatch.add = function () {
'use strict';
var swatch = $('<div class="swatch default set"></div>');
$('#light-swatches .swatch').removeClass('default set');
$('#new-swatch').before(swatch);
light.preview(light.color);
};
nav.init = function () { nav.init = function () {
'use strict'; 'use strict';
@ -336,7 +877,7 @@ nav.change = function (id) {
var init = function () { var init = function () {
'use strict'; 'use strict';
nav.init(); nav.init();
gui.grid.layout();
log.init(); log.init();
gui.grid.init();
light.init(); light.init();
}; };

18
app/src/jquery.contextMenu.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long