Skip to content

Instantly share code, notes, and snippets.

@yoshimov
Last active October 2, 2015 09:09
Show Gist options
  • Select an option

  • Save yoshimov/93b4e31c5df00e48f7b8 to your computer and use it in GitHub Desktop.

Select an option

Save yoshimov/93b4e31c5df00e48f7b8 to your computer and use it in GitHub Desktop.
config for v1.1
<html>
<head>
<link rel="stylesheet" href="https://rawgit.com/pebble/slate/master/dist/css/slate.min.css" />
</head>
<body>
<h1 class="title">BigDate configuration</h1>
<div class='item-container'>
<div class='item-container-content'>
<label class='item'>
Second hand style
<select id="second" class="item-select">
<option value="0">None</option>
<option value="1" selected>Ball</option>
<option value="2">Line</option>
</select>
</label>
</div>
</div>
<div class='item-container'>
<div class='item-container-content'>
<label class='item'>
Second hand color
<input id='second_color' type='text' class='item-color item-color-normal' value='0xff0000'>
</label>
</div>
</div>
<div class='item-container'>
<div class='item-container-content'>
<label class='item'>
Date color
<input id='date_color' type='text' class='item-color item-color-normal' value='0x55ff55'>
</label>
</div>
</div>
<div class='item-container'>
<div class='button-container'>
<input id='submit_button' type='button' class='item-button' value='SUBMIT'>
</div>
</div>
<script type="text/javascript">
function getConfigData() {
var sobj = document.getElementById("second");
var scolorobj = document.getElementById("second_color");
var dcolorobj = document.getElementById("date_color");
localStorage['second'] = sobj.value;
localStorage['second_color'] = scolorobj.value;
localStorage['date_color'] = dcolorobj.value;
var conf = {"second": sobj.value, "second_color": scolorobj.value, "date_color": dcolorobj.value};
return conf;
}
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;
}
var submitobj = document.getElementById("submit_button");
submitobj.addEventListener('click', function(){
console.log('Submit');
// Set the return URL depending on the runtime environment
var return_to = getQueryParam('return_to', 'pebblejs://close#');
document.location = return_to + encodeURIComponent(JSON.stringify(getConfigData()));
});
(function() {
// load settings
if (localStorage['second']) {
var obj = document.getElementById('second');
obj.value = localStorage['second'];
}
if (localStorage['second_color']) {
var obj = document.getElementById('second_color');
obj.value = localStorage['second_color'];
}
if (localStorage['date_color']) {
var obj = document.getElementById('date_color');
obj.value = localStorage['date_color'];
}
})();
</script>
<script src="https://rawgit.com/pebble/slate/master/dist/js/slate.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment