added HTML/JS/CSS for config page (but not the integration into the watchface yet)

master
Alina Marquardt 2015-11-14 19:28:49 +01:00
parent 99b0cdeee6
commit 99e43e6502
6 changed files with 106 additions and 0 deletions

1
config/css/slate.min.css vendored Executable file

File diff suppressed because one or more lines are too long

Binary file not shown.

BIN
config/fonts/ptsans-regular.woff Executable file

Binary file not shown.

40
config/index.html Normal file
View File

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Super Simple Settings</title>
<link rel="stylesheet" href="css/slate.min.css">
<body>
<div class="item-container">
<div class="item-container-header">Color settings</div>
<div class="item-container-content">
<div class="item">
Background
<input id="color-bg" type="text" class="item-color item-color-normal" name="color-bg" value="#000000">
</div>
<div class="item">
Minute Hand
<input id="color-m" type="text" class="item-color item-color-normal" name="color-m" value="#ffffff">
</div>
<div class="item">
Hour Hand
<input id="color-h" type="text" class="item-color item-color-normal" name="color-h" value="#ff0000">
</div>
<div class="item">
Center Peg
<input id="color-p" type="text" class="item-color item-color-normal" name="color-p" value="#cccccc">
</div>
</div>
</div>
<div class="item-container">
<div class="button-container">
<input id="send" type="button" class="item-button" value="SEND">
</div>
</div>
<script src="js/slate.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>

63
config/js/main.js Normal file
View File

@ -0,0 +1,63 @@
(function() {
loadOptions();
submitHandler();
})();
function submitHandler() {
var $submitButton = $('#send');
$submitButton.on('click', function() {
console.log('Submit');
var return_to = getQueryParam('return_to', 'pebblejs://close#');
document.location = return_to + encodeURIComponent(JSON.stringify(getAndStoreConfigData()));
});
}
function loadOptions() {
var $colorbg = $('#color-bg');
var $colorm = $('#color-m');
var $colorh = $('#color-h');
var $colorp = $('#color-p');
if (localStorage.colorbg) {
$colorbg[0].value = localStorage.colorbg;
$colorm[0].value = localStorage.colorm;
$colorh[0].value = localStorage.colorh;
$colorp[0].value = localStorage.colorp;
}
}
function getAndStoreConfigData() {
var $colorbg = $('#color-bg');
var $colorm = $('#color-m');
var $colorh = $('#color-h');
var $colorp = $('#color-p');
var options = {
colorbg: $colorbg.val(),
colorm: $colorm.val(),
colorh: $colorh.val(),
colorp: $colorp.val(),
};
localStorage.colorbg = options.colorbg;
localStorage.colorm = options.colorm;
localStorage.colorh = options.colorh;
localStorage.colorp = options.colorp;
console.log('Got options: ' + JSON.stringify(options));
return options;
}
function getQueryParam(variable, defaultValue) {
var query = location.search.substring(1);
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
if (pair[0] === variable) {
return decodeURIComponent(pair[1]);
}
}
return defaultValue || false;
}

2
config/js/slate.min.js vendored Executable file

File diff suppressed because one or more lines are too long