Refactored the repository and gruntified all the things
This commit is contained in:
112
websrc/config/app.js
Normal file
112
websrc/config/app.js
Normal file
@@ -0,0 +1,112 @@
|
||||
document.addEventListener( "DOMContentLoaded", function() {
|
||||
document.removeEventListener( "DOMContentLoaded", arguments.callee, false );
|
||||
new form();
|
||||
}, false );
|
||||
|
||||
var form = function() {
|
||||
this.el = {
|
||||
"bgcolour":document.getElementById("bgcolour"),
|
||||
"notify":document.getElementById("notify"),
|
||||
"flick":document.getElementById("flick"),
|
||||
"update":document.getElementById("update"),
|
||||
"submit":document.getElementById("submit"),
|
||||
"apikey":document.getElementById("apikey"),
|
||||
"save":document.getElementById("save")
|
||||
};
|
||||
this.config = this.getConfig();
|
||||
this.updateForm();
|
||||
this.showVersion(this.config.pblversion,this.config.jsversion);
|
||||
this.attach();
|
||||
}
|
||||
form.prototype.getConfig = function() {
|
||||
var getParameterByName = function(name) {
|
||||
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
|
||||
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
|
||||
results = regex.exec(location.search);
|
||||
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
|
||||
}
|
||||
var config = {};
|
||||
config.jsversion = getParameterByName("jsversion");
|
||||
config.pblversion = getParameterByName("pblversion");
|
||||
config.apikey = getParameterByName("apikey");
|
||||
config.update = getParameterByName("update");
|
||||
config.dark = (getParameterByName("dark") == "true")?true:false;
|
||||
config.notify = (getParameterByName("notify") == "true")?true:false;
|
||||
config.flick = (getParameterByName("flick") == "true")?true:false;
|
||||
return config;
|
||||
}
|
||||
form.prototype.updateForm = function() {
|
||||
if(this.config.apikey.length>0) this.el.apikey.value = this.config.apikey;
|
||||
if(this.config.update.length>0) this.el.update.value = this.config.update;
|
||||
|
||||
if(this.config.dark) {
|
||||
this.el.bgcolour.className = "black";
|
||||
this.el.bgcolour.children[0].innerHTML = "BLACK";
|
||||
} else {
|
||||
this.el.bgcolour.className = "white";
|
||||
this.el.bgcolour.children[0].innerHTML = "WHITE";
|
||||
}
|
||||
if(this.config.notify) {
|
||||
this.el.notify.className = "on";
|
||||
this.el.notify.children[0].innerHTML = "ON";
|
||||
} else {
|
||||
this.el.notify.className = "off";
|
||||
this.el.notify.children[0].innerHTML = "OFF";
|
||||
}
|
||||
if(this.config.flick) {
|
||||
this.el.flick.className = "on";
|
||||
this.el.flick.children[0].innerHTML = "ON";
|
||||
} else {
|
||||
this.el.flick.className = "off";
|
||||
this.el.flick.children[0].innerHTML = "OFF";
|
||||
}
|
||||
}
|
||||
form.prototype.showVersion = function(pbl,js) {
|
||||
var version = (pbl)?pbl:js;
|
||||
var listItems = document.getElementsByClassName("app-version");
|
||||
for (var i=0;i<listItems.length;i++) {
|
||||
if(listItems[i].getAttribute("data-version") == version) {
|
||||
var h3 = listItems[i].getElementsByTagName("h3")[0];
|
||||
h3.innerHTML = h3.innerHTML + " – <span>INSTALLED</span>";
|
||||
}
|
||||
}
|
||||
if(pbl && js) {
|
||||
document.getElementById("appversioninfo").innerHTML = pbl;
|
||||
document.getElementById("jsversioninfo").innerHTML = js;
|
||||
document.getElementById("versioninfo").style.display = "inline";
|
||||
}
|
||||
}
|
||||
form.prototype.attach = function() {
|
||||
var that = this;
|
||||
this.el.bgcolour.addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
that.config.dark = !that.config.dark
|
||||
that.updateForm();
|
||||
});
|
||||
this.el.notify.addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
that.config.notify = !that.config.notify;
|
||||
that.updateForm();
|
||||
});
|
||||
this.el.flick.addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
that.config.flick = !that.config.flick;
|
||||
that.updateForm();
|
||||
});
|
||||
this.el.update.addEventListener("change", function() {
|
||||
that.config.update = this.value;
|
||||
});
|
||||
this.el.apikey.addEventListener("change", function() {
|
||||
that.config.apikey = this.value;
|
||||
})
|
||||
this.el.save.addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
var str = "pebblejs://close#" + encodeURIComponent(JSON.stringify(that.config));
|
||||
window.location.href = str;
|
||||
});
|
||||
/*
|
||||
document.getElementById("reset").addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
window.location.href = "pebblejs://close#" + encodeURIComponent(JSON.stringify({"reset":true}));
|
||||
})*/
|
||||
}
|
||||
60
websrc/config/index.html
Normal file
60
websrc/config/index.html
Normal file
@@ -0,0 +1,60 @@
|
||||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>MineWatch</title>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no">
|
||||
<style type="text/css">
|
||||
<!-- build:section css -->
|
||||
<!-- /build -->
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
<!-- build:section js -->
|
||||
<!-- /build -->
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>MineWatch</h1>
|
||||
<h2>Settings</h2>
|
||||
<ul class="form">
|
||||
<li>
|
||||
<p>Background colour</p>
|
||||
<a class="white" id="bgcolour" href="#"><span>WHITE</span></a>
|
||||
</li>
|
||||
<li>
|
||||
<p>Enable vibes</p>
|
||||
<a class="off" id="notify" href="#"><span>OFF</span></a>
|
||||
<div class="info">Pebble will vibrate when a worker goes offline.</div>
|
||||
</li>
|
||||
<li>
|
||||
<p>Flick to update</p>
|
||||
<a class="off" id="flick" href="#"><span>OFF</span></a>
|
||||
<div class="info">Flick Pebble to force update (limit to once per min)</div>
|
||||
</li>
|
||||
<li><p>Update rate (mins)</p><input type="number" min="1" max="60" step="1" value="15" id="update"/></li>
|
||||
<li><p>API Key</p><input type="text" id="apikey" maxlength="64"/></li>
|
||||
</ul>
|
||||
<a id="save" href="#">SAVE</a>
|
||||
<h2>Updates</h2>
|
||||
<ul class="updates">
|
||||
<li class="app-version" data-version="1.0.2">
|
||||
<h3>v1.0.2 (15<sup>th</sup> May 2014)</h3>
|
||||
<ul>
|
||||
<li>Increase timeout from 10 to 30 seconds</li>
|
||||
<li>Update settings to show installed version</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="app-version" data-version="1.0.1">
|
||||
<h3>v1.0.1 (8<sup>th</sup> May 2014)</h3>
|
||||
<ul>
|
||||
<li>Initial release</li>
|
||||
<li>Support for Slush's pool</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Contact</h2>
|
||||
<p>Please report any bugs and submit feature requests to <em>me@danielhead.com</em>.</p>
|
||||
<p>Support for other mining pools can be accomodated upon request.</p>
|
||||
<p>Like this watchface? Bitcoin donations, no matter how small are appreciated. My bitcoin address is: <em>1CCsuAXhEbLiL2a43x1yxuhk5F6hEt1EBQ</em></p>
|
||||
<p>For further support and feedback, please visit <em>danielhead.com/minewatch</em></p>
|
||||
<p id="versioninfo">App version: <span id="appversioninfo"></span> / JS version: <span id="jsversioninfo"></span></p>
|
||||
</body>
|
||||
</html>
|
||||
128
websrc/config/styles.scss
Normal file
128
websrc/config/styles.scss
Normal file
@@ -0,0 +1,128 @@
|
||||
$darkgrey: #8e8e8e;
|
||||
$lightgrey: #c8c8c8;
|
||||
$blue:blue;
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "Verdana";
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f3f3f3), color-stop(51%,#ededed), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: linear-gradient(to bottom, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* W3C */
|
||||
}
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding: 10px 5px;
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: linear-gradient(to bottom, #45484d 0%,#000000 100%); /* W3C */
|
||||
color: white;
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
h2 {
|
||||
font-size: 0.9em;
|
||||
margin: 20px 10px 0 10px;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 2px solid $darkgrey;
|
||||
}
|
||||
h3 {
|
||||
margin: 5px 0;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
p {
|
||||
font-size: 0.8em;
|
||||
margin: 1em 10px;
|
||||
}
|
||||
ul.form {
|
||||
margin:0;
|
||||
padding:0;
|
||||
list-style:none;
|
||||
li {
|
||||
margin:0 10px;
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid $darkgrey;
|
||||
p {
|
||||
display:inline-block;
|
||||
margin:0;
|
||||
line-height: 2em;
|
||||
}
|
||||
input {
|
||||
float:right;
|
||||
width:116px;
|
||||
height:25px;
|
||||
}
|
||||
a {
|
||||
display:inline-block;
|
||||
float:right;
|
||||
width: 120px;
|
||||
height: 30px;
|
||||
position: relative;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
background-color: $lightgrey;
|
||||
span {
|
||||
display:block;
|
||||
position:absolute;
|
||||
top: 0;
|
||||
width:60px;
|
||||
height:16px;
|
||||
padding:7px 0;
|
||||
background-color: $darkgrey;
|
||||
color:black;
|
||||
text-align: center;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
&.white span {
|
||||
background-color: white;
|
||||
color: black;
|
||||
right: 0;
|
||||
}
|
||||
&.black span {
|
||||
background-color: black;
|
||||
color: white;
|
||||
}
|
||||
&.on span {
|
||||
background-color: $blue;
|
||||
color: white;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
div.info {
|
||||
font-size:0.5em;
|
||||
margin-top:15px;
|
||||
}
|
||||
}
|
||||
ul.updates {
|
||||
list-style: none;
|
||||
margin:0;
|
||||
padding:0;
|
||||
> li {
|
||||
margin: 10px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid $darkgrey;
|
||||
li {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
}
|
||||
h3 > span {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
a#save {
|
||||
display:block;
|
||||
width:60px;
|
||||
height:16px;
|
||||
padding:7px 0;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
margin: 10px;
|
||||
background-color: $blue;
|
||||
color: white;
|
||||
}
|
||||
p#versioninfo {
|
||||
display: none;
|
||||
font-size:0.6em;
|
||||
}
|
||||
Reference in New Issue
Block a user