mirror of
https://github.com/alinanorakari/Pebble-Time-Watchface-Super-Simple.git
synced 2025-08-30 08:29:11 +02:00
added HTML/JS/CSS for config page (but not the integration into the watchface yet)
This commit is contained in:
parent
99b0cdeee6
commit
99e43e6502
1
config/css/slate.min.css
vendored
Executable file
1
config/css/slate.min.css
vendored
Executable file
File diff suppressed because one or more lines are too long
BIN
config/fonts/PFDinDisplayPro-Light.woff
Executable file
BIN
config/fonts/PFDinDisplayPro-Light.woff
Executable file
Binary file not shown.
BIN
config/fonts/ptsans-regular.woff
Executable file
BIN
config/fonts/ptsans-regular.woff
Executable file
Binary file not shown.
40
config/index.html
Normal file
40
config/index.html
Normal 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
63
config/js/main.js
Normal 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
2
config/js/slate.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user