Push dev work to master #2
|
@ -9,7 +9,7 @@
|
||||||
<link rel="stylesheet" href="static/css/monokai.css" />-->
|
<link rel="stylesheet" href="static/css/monokai.css" />-->
|
||||||
<link rel="stylesheet" href="static/css/index.css" />
|
<link rel="stylesheet" href="static/css/index.css" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body class="mobile">
|
||||||
<div id="overlay">
|
<div id="overlay">
|
||||||
<div id="spinner"></div>
|
<div id="spinner"></div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -57,17 +57,23 @@
|
||||||
</div>
|
</div>
|
||||||
<div id="settings" class="page">
|
<div id="settings" class="page">
|
||||||
<h2>SETTINGS</h2>
|
<h2>SETTINGS</h2>
|
||||||
<div class="label">ISO</div>
|
<div class="clearfix">
|
||||||
<input type="number" class="iso" placeholder="100" value="100">
|
<div class="setting">
|
||||||
<div class="label">F-stop</div>
|
<div class="label">ISO</div>
|
||||||
<input type="number" class="fstop" placeholder="5.6" value="5.6">
|
<input type="number" class="iso" placeholder="100" value="100">
|
||||||
<div>
|
</div>
|
||||||
<div class="label">Rex-o-fader</div>
|
<div class="setting">
|
||||||
<select id="angle">
|
<div class="label">F-stop</div>
|
||||||
<option value="133" selected>0 (Normal)</option>
|
<input type="number" class="fstop" placeholder="5.6" value="5.6">
|
||||||
<option value="66">1 Stop</option>
|
</div>
|
||||||
<option value="33">2 Stop</option>
|
<div class="setting">
|
||||||
</select>
|
<div class="label">Rex-o-fader</div>
|
||||||
|
<select class="angle">
|
||||||
|
<option value="133" selected>0 (Normal)</option>
|
||||||
|
<option value="66">1 Stop</option>
|
||||||
|
<option value="33">2 Stop</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="ble">
|
<div class="ble">
|
||||||
<h2>BLUETOOTH</h2>
|
<h2>BLUETOOTH</h2>
|
||||||
|
@ -102,11 +108,25 @@
|
||||||
</div>-->
|
</div>-->
|
||||||
<div id="camera" class="page">
|
<div id="camera" class="page">
|
||||||
<h2>CAMERA EXPOSURE</h2>
|
<h2>CAMERA EXPOSURE</h2>
|
||||||
<div class="label">ISO</div>
|
<div class="clearfix">
|
||||||
<input type="number" class="iso" placeholder="100" value="100">
|
<div class="setting">
|
||||||
<div class="label">F-stop</div>
|
<div class="label">ISO</div>
|
||||||
<input type="number" class="fstop" placeholder="5.6" value="5.6">
|
<input type="number" class="iso" placeholder="100" value="100">
|
||||||
<button onclick="mobile.getCamera();"><i class="cameraIcon"></i></button>
|
</div>
|
||||||
|
<div class="setting">
|
||||||
|
<div class="label">F-stop</div>
|
||||||
|
<input type="number" class="fstop" placeholder="5.6" value="5.6">
|
||||||
|
</div>
|
||||||
|
<div class="setting">
|
||||||
|
<div class="label">Rex-o-fader</div>
|
||||||
|
<select class="angle">
|
||||||
|
<option value="133" selected>0 (Normal)</option>
|
||||||
|
<option value="66">1 Stop</option>
|
||||||
|
<option value="33">2 Stop</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button id="camera" onclick="mobile.getCamera();"><i class="cameraIcon"></i></button>
|
||||||
</div>
|
</div>
|
||||||
<footer>
|
<footer>
|
||||||
<div id="settingsIcon" onclick="settingsPage();" class="icon">
|
<div id="settingsIcon" onclick="settingsPage();" class="icon">
|
||||||
|
|
|
@ -36,6 +36,13 @@ html,body,button,h2,label,input{
|
||||||
font-family: 'Arial Neue', Helvetical, Arial, sans-serif;
|
font-family: 'Arial Neue', Helvetical, Arial, sans-serif;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.clearfix::after {
|
||||||
|
content: "";
|
||||||
|
clear: both;
|
||||||
|
display: table;
|
||||||
|
}
|
||||||
|
|
||||||
body.mobile{
|
body.mobile{
|
||||||
padding-top: 35px;
|
padding-top: 35px;
|
||||||
}
|
}
|
||||||
|
@ -336,7 +343,6 @@ footer > div.selected{
|
||||||
#wifi.active{
|
#wifi.active{
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.indicator {
|
.indicator {
|
||||||
color: red;
|
color: red;
|
||||||
width: 0;
|
width: 0;
|
||||||
|
@ -345,4 +351,15 @@ footer > div.selected{
|
||||||
border-right: 5px solid transparent;
|
border-right: 5px solid transparent;
|
||||||
|
|
||||||
border-bottom: 5px solid black;
|
border-bottom: 5px solid black;
|
||||||
|
}
|
||||||
|
.setting{
|
||||||
|
width: 50%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.setting input,
|
||||||
|
.setting select{
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
#camera{
|
||||||
|
margin-top: 20px;
|
||||||
}
|
}
|
|
@ -23,6 +23,7 @@ var app = {
|
||||||
document.addEventListener('resume', this.onDeviceResume.bind(this), false);
|
document.addEventListener('resume', this.onDeviceResume.bind(this), false);
|
||||||
document.addEventListener('DOMContentLoaded', event => {
|
document.addEventListener('DOMContentLoaded', event => {
|
||||||
if (typeof cordova === 'undefined') {
|
if (typeof cordova === 'undefined') {
|
||||||
|
init();
|
||||||
web.init();
|
web.init();
|
||||||
getState();
|
getState();
|
||||||
}
|
}
|
||||||
|
@ -34,6 +35,7 @@ var app = {
|
||||||
// Bind any cordova events here. Common events are:
|
// Bind any cordova events here. Common events are:
|
||||||
// 'pause', 'resume', etc.
|
// 'pause', 'resume', etc.
|
||||||
onDeviceReady: function() {
|
onDeviceReady: function() {
|
||||||
|
init();
|
||||||
mobile.init();
|
mobile.init();
|
||||||
},
|
},
|
||||||
onDeviceResume : function () {
|
onDeviceResume : function () {
|
||||||
|
|
|
@ -2,6 +2,8 @@
|
||||||
const BOLEX = {
|
const BOLEX = {
|
||||||
angle : 133,
|
angle : 133,
|
||||||
prism : 0.8,
|
prism : 0.8,
|
||||||
|
iso : 100,
|
||||||
|
fstop : 5.6,
|
||||||
expected : 630
|
expected : 630
|
||||||
};
|
};
|
||||||
const STATE = {
|
const STATE = {
|
||||||
|
@ -201,6 +203,23 @@ var seqState = function (state) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var syncInputs = function (selector, cb) {
|
||||||
|
const elems = document.querySelectorAll(selector);
|
||||||
|
[].forEach.call(elems, function (input) {
|
||||||
|
input.oninput = function () {
|
||||||
|
setInputs(selector, this.value)
|
||||||
|
cb(this.value)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
var setInputs = function (selector, value) {
|
||||||
|
const elems = document.querySelectorAll(selector);
|
||||||
|
[].forEach.call(elems, function (input) {
|
||||||
|
input.value = value;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
var appPage = function () {
|
var appPage = function () {
|
||||||
unsetPages();
|
unsetPages();
|
||||||
document.getElementById('app').classList.add('selected');
|
document.getElementById('app').classList.add('selected');
|
||||||
|
@ -262,4 +281,16 @@ var spinnerHide = function () {
|
||||||
}
|
}
|
||||||
var isNumeric = function (n) {
|
var isNumeric = function (n) {
|
||||||
return !isNaN(parseFloat(n)) && isFinite(n);
|
return !isNaN(parseFloat(n)) && isFinite(n);
|
||||||
|
};
|
||||||
|
|
||||||
|
var init = function () {
|
||||||
|
syncInputs('.angle', (val) => {
|
||||||
|
BOLEX.angle = parseInt(val);
|
||||||
|
});
|
||||||
|
syncInputs('.iso', (val) => {
|
||||||
|
BOLEX.iso = parseInt(val);
|
||||||
|
});
|
||||||
|
syncInputs('.fstop', (val) => {
|
||||||
|
BOLEX.fstop = parseFloat(val);
|
||||||
|
});
|
||||||
};
|
};
|
Loading…
Reference in New Issue