Added pebble client.
This commit is contained in:
Tobias Blum
parent
c1c82222b5
commit
91a3c69414
14 changed files with 1491 additions and 0 deletions
BIN
clients/pebble/McLighting.pbw
Normal file
BIN
clients/pebble/McLighting.pbw
Normal file
Binary file not shown.
5
clients/pebble/configuration_page/.firebaserc
Normal file
5
clients/pebble/configuration_page/.firebaserc
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"projects": {
|
||||||
|
"default": "mclighting-pebble-config"
|
||||||
|
}
|
||||||
|
}
|
||||||
4
clients/pebble/configuration_page/database.rules.json
Normal file
4
clients/pebble/configuration_page/database.rules.json
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
".read": true,
|
||||||
|
".write": true
|
||||||
|
}
|
||||||
8
clients/pebble/configuration_page/firebase.json
Normal file
8
clients/pebble/configuration_page/firebase.json
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
{
|
||||||
|
"database": {
|
||||||
|
"rules": "database.rules.json"
|
||||||
|
},
|
||||||
|
"hosting": {
|
||||||
|
"public": "public"
|
||||||
|
}
|
||||||
|
}
|
||||||
81
clients/pebble/configuration_page/public/404.html
Normal file
81
clients/pebble/configuration_page/public/404.html
Normal file
|
|
@ -0,0 +1,81 @@
|
||||||
|
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Page Not Found</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 1em;
|
||||||
|
font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
|
||||||
|
font-size: 1.1em;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 40em) {
|
||||||
|
body {
|
||||||
|
width: 40em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
h1, h2, h3 {
|
||||||
|
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
margin: 1em 0;
|
||||||
|
padding: 0 0 0.25em 0;
|
||||||
|
border-bottom: 1px dotted #ccc;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 3em;
|
||||||
|
line-height: 1.1em;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
margin: 1em 0 0.45em 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 1.8em;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 0 0 0.5em 0;
|
||||||
|
line-height: 1.8em;
|
||||||
|
}
|
||||||
|
ol {
|
||||||
|
|
||||||
|
}
|
||||||
|
ol li {
|
||||||
|
margin: 0 0 0.5em 0;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1.8em;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
color: #50B1FF;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
code {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.1em;
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
border: 1px solid #DDD;
|
||||||
|
border-radius: 3px;
|
||||||
|
font-family: Consolas,"Liberation Mono",Courier,monospace;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
display: block;
|
||||||
|
margin: 3em 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Page Not Found</h1>
|
||||||
|
<p>This specified file was not found on this website. Please check the URL for mistakes and try again.</p>
|
||||||
|
<h2>Why am I seeing this?</h2>
|
||||||
|
<p>This page was generated by the Firebase Command-Line Interface. To modify it, edit the <code>404.html</code> file in your project's configured public directory.</p>
|
||||||
|
<a class="logo" href="//www.firebase.com">
|
||||||
|
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJQAAAAaCAYAAABRhnV8AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyNWM4MWUxOS0zYWJmLTQyYWYtOTVhMi01MDBiZWU5NzAyMTgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkNCQkJBMDlCNkRGMTFFM0JDMTdBQTgyNEFEQURCQTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkNCQkJBMDhCNkRGMTFFM0JDMTdBQTgyNEFEQURCQTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ZWFkZWM0M2YtMmFjMy00NTEyLTljNzQtYjVmMDJjMWNhNTkxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjI1YzgxZTE5LTNhYmYtNDJhZi05NWEyLTUwMGJlZTk3MDIxOCIvPiA8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" />
|
||||||
|
</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
475
clients/pebble/configuration_page/public/css/slate.css
Normal file
475
clients/pebble/configuration_page/public/css/slate.css
Normal file
|
|
@ -0,0 +1,475 @@
|
||||||
|
@import url(../fonts/pfdindisplaypro-regular.woff);
|
||||||
|
@import url(../fonts/ptsans-regular.woff);
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0; }
|
||||||
|
|
||||||
|
*:focus {
|
||||||
|
outline-width: 0; }
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #FF4700;
|
||||||
|
text-decoration: none; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: #EAEAEA;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-size: 1.2em;
|
||||||
|
line-height: 1.4em;
|
||||||
|
-webkit-user-select: none !important;
|
||||||
|
-moz-user-select: none !important;
|
||||||
|
-ms-user-select: none !important;
|
||||||
|
user-select: none !important; }
|
||||||
|
|
||||||
|
body, select, input[type=text], input[type=time], input[type=date] {
|
||||||
|
font-family: 'PF DinDisplay Pro', sans-serif;
|
||||||
|
font-weight: 300; }
|
||||||
|
|
||||||
|
select, input[type=time], input[type=date] {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
-ms-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
border: none;
|
||||||
|
position: absolute;
|
||||||
|
top: 13px;
|
||||||
|
color: #A8A8A8;
|
||||||
|
font-size: 1em;
|
||||||
|
line-height: 1em;
|
||||||
|
background-color: #F7F7F7; }
|
||||||
|
|
||||||
|
input[type=date] {
|
||||||
|
direction: rtl; }
|
||||||
|
|
||||||
|
select {
|
||||||
|
right: 30px;
|
||||||
|
top: 14px; }
|
||||||
|
|
||||||
|
input[type=time] {
|
||||||
|
right: 10px !important; }
|
||||||
|
|
||||||
|
input[type=date] {
|
||||||
|
right: 10px !important; }
|
||||||
|
|
||||||
|
.select-triangle {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 20px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 7px solid transparent;
|
||||||
|
border-right: 7px solid transparent;
|
||||||
|
border-top: 7px solid #FF4700; }
|
||||||
|
|
||||||
|
.item-container {
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 15px; }
|
||||||
|
|
||||||
|
.item-container-header {
|
||||||
|
padding: 3px 10px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-family: 'PT Sans', sans-serif;
|
||||||
|
font-size: .8em;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #A8A8A8; }
|
||||||
|
|
||||||
|
.item-container-content {
|
||||||
|
background-color: #F7F7F7;
|
||||||
|
border-top: 1px solid #DEDEDE;
|
||||||
|
border-bottom: 1px solid #DEDEDE; }
|
||||||
|
|
||||||
|
.item-container-footer {
|
||||||
|
padding: 3px 10px;
|
||||||
|
font-size: .7em;
|
||||||
|
line-height: 1.4em;
|
||||||
|
color: #A8A8A8; }
|
||||||
|
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
padding: 10px;
|
||||||
|
display: block;
|
||||||
|
overflow: hidden; }
|
||||||
|
|
||||||
|
.item:not(:first-child) {
|
||||||
|
border-top: 1px solid #DEDEDE; }
|
||||||
|
|
||||||
|
.item-subtitle-wrapper {
|
||||||
|
font-size: 1em; }
|
||||||
|
|
||||||
|
.item-subtitle-wrapper .item-styled-toggle-wrapper {
|
||||||
|
top: 16px; }
|
||||||
|
|
||||||
|
.item-subtitle-wrapper .item-styled-checkbox {
|
||||||
|
top: 18px; }
|
||||||
|
|
||||||
|
.item-subtitle-wrapper .item-styled-radio {
|
||||||
|
top: 16px; }
|
||||||
|
|
||||||
|
.item-subtitle-wrapper .item-draggable-handle {
|
||||||
|
top: 18px; }
|
||||||
|
|
||||||
|
.item-subtitle {
|
||||||
|
font-size: .7em;
|
||||||
|
line-height: .7em;
|
||||||
|
padding: .3em 0; }
|
||||||
|
|
||||||
|
.item-styled-toggle-wrapper {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 8px;
|
||||||
|
width: 56px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 5px;
|
||||||
|
transition-timing-function: ease-in-out;
|
||||||
|
transition-duration: 0.3s;
|
||||||
|
transition-property: background-color; }
|
||||||
|
|
||||||
|
.item-styled-toggle {
|
||||||
|
position: relative;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 5px;
|
||||||
|
top: 1px;
|
||||||
|
transition-timing-function: ease-in-out;
|
||||||
|
transition-duration: 0.3s;
|
||||||
|
transition-property: left; }
|
||||||
|
|
||||||
|
.item-toggle {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.item-toggle + .item-styled-toggle-wrapper {
|
||||||
|
background-color: #A8A8A8; }
|
||||||
|
|
||||||
|
.item-toggle:checked + .item-styled-toggle-wrapper {
|
||||||
|
background-color: #FF4700; }
|
||||||
|
|
||||||
|
.item-toggle + .item-styled-toggle-wrapper .item-styled-toggle {
|
||||||
|
left: 1px; }
|
||||||
|
|
||||||
|
.item-toggle:checked + .item-styled-toggle-wrapper .item-styled-toggle {
|
||||||
|
left: 27px; }
|
||||||
|
|
||||||
|
.item-styled-toggle-bar {
|
||||||
|
width: 3px;
|
||||||
|
height: 15px;
|
||||||
|
margin-left: 3px;
|
||||||
|
background-color: #EAEAEA;
|
||||||
|
float: left;
|
||||||
|
position: relative;
|
||||||
|
left: 4px;
|
||||||
|
top: 7px; }
|
||||||
|
|
||||||
|
.item-styled-checkbox {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
width: 21px;
|
||||||
|
height: 21px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid; }
|
||||||
|
|
||||||
|
.item-checkbox {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.item-checkbox + .item-styled-checkbox {
|
||||||
|
border-color: #DEDEDE; }
|
||||||
|
|
||||||
|
.item-checkbox:checked + .item-styled-checkbox {
|
||||||
|
border-color: #FF4700;
|
||||||
|
background-color: #FF4700; }
|
||||||
|
|
||||||
|
.item-checkbox:checked + .item-styled-checkbox:before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
left: 7px;
|
||||||
|
width: 6px;
|
||||||
|
height: 14px;
|
||||||
|
border-color: #F7F7F7;
|
||||||
|
border-width: 0 2px 2px 0;
|
||||||
|
border-style: solid;
|
||||||
|
-webkit-transform: rotate(45deg);
|
||||||
|
-moz-transform: rotate(45deg);
|
||||||
|
-ms-transform: rotate(45deg);
|
||||||
|
-o-transform: rotate(45deg);
|
||||||
|
transform: rotate(45deg); }
|
||||||
|
|
||||||
|
.item-styled-radio {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
width: 21px;
|
||||||
|
height: 21px;
|
||||||
|
border-radius: 12px;
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid; }
|
||||||
|
|
||||||
|
.item-radio {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.item-radio + .item-styled-radio {
|
||||||
|
border-color: #DEDEDE; }
|
||||||
|
|
||||||
|
.item-radio:checked + .item-styled-radio {
|
||||||
|
border-color: #FF4700;
|
||||||
|
background-color: #FF4700; }
|
||||||
|
|
||||||
|
.item-radio:checked + .item-styled-radio:before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
top: 1px;
|
||||||
|
left: 6px;
|
||||||
|
width: 6px;
|
||||||
|
height: 14px;
|
||||||
|
border-color: #F7F7F7;
|
||||||
|
border-width: 0 2px 2px 0;
|
||||||
|
border-style: solid;
|
||||||
|
-webkit-transform: rotate(45deg);
|
||||||
|
-moz-transform: rotate(45deg);
|
||||||
|
-ms-transform: rotate(45deg);
|
||||||
|
-o-transform: rotate(45deg);
|
||||||
|
transform: rotate(45deg); }
|
||||||
|
|
||||||
|
.item-color {
|
||||||
|
display: none; }
|
||||||
|
|
||||||
|
.item-styled-color {
|
||||||
|
background: #F7F7F7; }
|
||||||
|
.item-styled-color .value {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
width: 56px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border-color: #A8A8A8;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid; }
|
||||||
|
.item-styled-color .color-box-wrap {
|
||||||
|
display: none;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
height: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 0 100% 0;
|
||||||
|
margin: 0.6em 0 0em; }
|
||||||
|
.item-styled-color .color-box-wrap.show {
|
||||||
|
display: block; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container {
|
||||||
|
position: absolute;
|
||||||
|
height: 99.97%;
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
top: 0; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container .color-box {
|
||||||
|
float: left;
|
||||||
|
cursor: pointer; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container .color-box.rounded-tl {
|
||||||
|
border-top-left-radius: 5px; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container .color-box.rounded-tr {
|
||||||
|
border-top-right-radius: 5px; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container .color-box.rounded-bl {
|
||||||
|
border-bottom-left-radius: 5px; }
|
||||||
|
.item-styled-color .color-box-wrap .color-box-container .color-box.rounded-br {
|
||||||
|
border-bottom-right-radius: 5px; }
|
||||||
|
|
||||||
|
.item-date, .item-time {
|
||||||
|
position: absolute;
|
||||||
|
color: #F7F7F7 !important; }
|
||||||
|
|
||||||
|
.item-styled-date, .item-styled-time {
|
||||||
|
position: absolute;
|
||||||
|
top: 13px;
|
||||||
|
right: 10px;
|
||||||
|
color: #A8A8A8;
|
||||||
|
font-size: 1em;
|
||||||
|
line-height: 1em;
|
||||||
|
background-color: #F7F7F7; }
|
||||||
|
|
||||||
|
.item-input-wrapper {
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 2px solid #DEDEDE; }
|
||||||
|
|
||||||
|
.item-input-wrapper-button {
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 77%; }
|
||||||
|
|
||||||
|
.item-input {
|
||||||
|
border: 0;
|
||||||
|
background-color: transparent;
|
||||||
|
padding: 0 10px 7px 10px;
|
||||||
|
font-size: 13px;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box; }
|
||||||
|
|
||||||
|
.button-container {
|
||||||
|
text-align: center; }
|
||||||
|
|
||||||
|
.item-button {
|
||||||
|
width: 60%;
|
||||||
|
height: 35px;
|
||||||
|
background-color: #FF4700;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: white;
|
||||||
|
font-size: 0.8em;
|
||||||
|
border: none;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
-ms-appearance: none;
|
||||||
|
appearance: none; }
|
||||||
|
|
||||||
|
.item-input-button {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 9px;
|
||||||
|
width: 20%; }
|
||||||
|
|
||||||
|
.tab-buttons {
|
||||||
|
display: table;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
table-layout: fixed; }
|
||||||
|
|
||||||
|
.tab-button {
|
||||||
|
display: table-cell;
|
||||||
|
position: relative;
|
||||||
|
color: #FF4700;
|
||||||
|
border: 1px solid #FF4700;
|
||||||
|
border-right-width: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
padding: 5px 0;
|
||||||
|
text-align: center;
|
||||||
|
right: -1px; }
|
||||||
|
|
||||||
|
.tab-button:first-child {
|
||||||
|
border-top-left-radius: 5px;
|
||||||
|
border-bottom-left-radius: 5px;
|
||||||
|
border-right-width: 0; }
|
||||||
|
|
||||||
|
.tab-button:last-child {
|
||||||
|
border-top-right-radius: 5px;
|
||||||
|
border-bottom-right-radius: 5px;
|
||||||
|
border-right-width: 1px; }
|
||||||
|
|
||||||
|
.tab-button.active {
|
||||||
|
background-color: #FF4700;
|
||||||
|
color: #F7F7F7; }
|
||||||
|
|
||||||
|
.item-slider {
|
||||||
|
position: relative;
|
||||||
|
top: 8px;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
-ms-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
height: 30px;
|
||||||
|
width: 79%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: transparent;
|
||||||
|
margin-top: -10px; }
|
||||||
|
|
||||||
|
.item-slider::-webkit-slider-thumb:before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 11px;
|
||||||
|
left: -1001px;
|
||||||
|
height: 2px;
|
||||||
|
width: 1000px;
|
||||||
|
background: #FF4700; }
|
||||||
|
|
||||||
|
.item-slider::-webkit-slider-thumb {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
-ms-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
position: relative;
|
||||||
|
top: -13px;
|
||||||
|
height: 28px;
|
||||||
|
width: 28px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 2px solid #EAEAEA; }
|
||||||
|
|
||||||
|
.item-slider::-webkit-slider-runnable-track {
|
||||||
|
height: 2px;
|
||||||
|
background-color: #DEDEDE; }
|
||||||
|
|
||||||
|
.item-slider::-webkit-slider-thumb:after {
|
||||||
|
content: "lll";
|
||||||
|
position: absolute;
|
||||||
|
left: 5px;
|
||||||
|
top: 3px;
|
||||||
|
height: 12px;
|
||||||
|
width: 10px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
color: #DEDEDE;
|
||||||
|
font-size: 16px;
|
||||||
|
letter-spacing: 1px; }
|
||||||
|
|
||||||
|
.item-slider-text {
|
||||||
|
position: absolute;
|
||||||
|
top: 6px;
|
||||||
|
right: 10px;
|
||||||
|
width: 16%; }
|
||||||
|
|
||||||
|
.item-slider-text .item-input {
|
||||||
|
text-align: center; }
|
||||||
|
|
||||||
|
.delete-item {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
right: 5px;
|
||||||
|
top: 5px;
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 6px; }
|
||||||
|
|
||||||
|
.delete-item:before, .delete-item:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 24px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #A8A8A8;
|
||||||
|
border-radius: 2px;
|
||||||
|
top: 16px; }
|
||||||
|
|
||||||
|
.delete-item:before {
|
||||||
|
-webkit-transform: rotate(45deg);
|
||||||
|
-moz-transform: rotate(45deg);
|
||||||
|
-ms-transform: rotate(45deg);
|
||||||
|
-o-transform: rotate(45deg);
|
||||||
|
transform: rotate(45deg);
|
||||||
|
left: 3px; }
|
||||||
|
|
||||||
|
.delete-item:after {
|
||||||
|
-webkit-transform: rotate(-45deg);
|
||||||
|
-moz-transform: rotate(-45deg);
|
||||||
|
-ms-transform: rotate(-45deg);
|
||||||
|
-o-transform: rotate(-45deg);
|
||||||
|
transform: rotate(-45deg);
|
||||||
|
right: 3px; }
|
||||||
|
|
||||||
|
.add-item {
|
||||||
|
color: #FF4700; }
|
||||||
|
|
||||||
|
.item-draggable-handle {
|
||||||
|
position: absolute;
|
||||||
|
right: 5px;
|
||||||
|
top: 10px;
|
||||||
|
height: 28px;
|
||||||
|
width: 28px; }
|
||||||
|
|
||||||
|
.item-draggable-handle-bar {
|
||||||
|
margin-top: 5px;
|
||||||
|
height: 2px;
|
||||||
|
width: 20px;
|
||||||
|
background-color: #A8A8A8;
|
||||||
|
text-align: center; }
|
||||||
|
|
||||||
|
[draggable=true] {
|
||||||
|
background-color: #F7F7F7;
|
||||||
|
border: 2px solid #EAEAEA;
|
||||||
|
border-radius: 2px; }
|
||||||
1
clients/pebble/configuration_page/public/css/slate.min.css
vendored
Normal file
1
clients/pebble/configuration_page/public/css/slate.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
130
clients/pebble/configuration_page/public/index.html
Normal file
130
clients/pebble/configuration_page/public/index.html
Normal file
|
|
@ -0,0 +1,130 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>McLighting Pebble Configuration</title>
|
||||||
|
<link rel='stylesheet' type='text/css' href='css/slate.min.css'>
|
||||||
|
<script src='js/slate.min.js'></script>
|
||||||
|
<style>
|
||||||
|
.title {
|
||||||
|
padding: 15px 10px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-family: 'PT Sans', sans-serif;
|
||||||
|
font-size: 1.2em;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #888888;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<h1 class='title'>McLighting Pebble Configuration</h1>
|
||||||
|
|
||||||
|
<div class='item-container'>
|
||||||
|
<div class='item-container-content'>
|
||||||
|
<div class='item'>
|
||||||
|
Use this configuration page to set the URL of your McLighting smart light.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="item-container">
|
||||||
|
<div class="item-container-header">McLighting URL</div>
|
||||||
|
<div class="item-container-content">
|
||||||
|
<label class="item">
|
||||||
|
<div class="item-input-wrapper">
|
||||||
|
<input type="text" class="item-input" name="esp_url" id="esp_url" placeholder="ws://esp8266_01.local:81" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- div class='item-container'>
|
||||||
|
<div class='item-container-header'>Customizability</div>
|
||||||
|
<div class='item-container-content'>
|
||||||
|
<label class='item'>
|
||||||
|
Background Color
|
||||||
|
<input id='background_color_picker' type='text' class='item-color item-color-sunny' value='#000000'>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class='item-container-footer'>
|
||||||
|
Choose the app's background color. Used if High Contrast Mode is not selected. Note: Only available on Basalt watches that support many colors.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class='item-container'>
|
||||||
|
<div class='item-container-header'>Accessibility</div>
|
||||||
|
<div class='item-container-content'>
|
||||||
|
<label class='item'>
|
||||||
|
High Contrast Mode
|
||||||
|
<input id='high_contrast_checkbox' type='checkbox' class='item-toggle'>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class='item-container-footer'>
|
||||||
|
This switches the app colors to a higher contrast set that promotes readability in low light.
|
||||||
|
</div>
|
||||||
|
</div -->
|
||||||
|
|
||||||
|
<div class='item-container'>
|
||||||
|
<div class='button-container'>
|
||||||
|
<input id='submit_button' type='button' class='item-button' value='SAVE'>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function getConfigData() {
|
||||||
|
//var backgroundColorPicker = document.getElementById('background_color_picker');
|
||||||
|
//var highContrastCheckbox = document.getElementById('high_contrast_checkbox');
|
||||||
|
var urlTextfield = document.getElementById('esp_url');
|
||||||
|
|
||||||
|
var options = {
|
||||||
|
// 'background_color': backgroundColorPicker.value,
|
||||||
|
// 'high_contrast': highContrastCheckbox.checked
|
||||||
|
'esp_url': urlTextfield.value
|
||||||
|
};
|
||||||
|
|
||||||
|
// Save for next launch
|
||||||
|
//localStorage['background_color'] = options['background_color'];
|
||||||
|
//localStorage['high_contrast'] = options['high_contrast'];
|
||||||
|
localStorage['esp_url'] = options['esp_url'];
|
||||||
|
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
var submitButton = document.getElementById('submit_button');
|
||||||
|
submitButton.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() {
|
||||||
|
//var backgroundColorPicker = document.getElementById('background_color_picker');
|
||||||
|
//var highContrastCheckbox = document.getElementById('high_contrast_checkbox');
|
||||||
|
var urlTextfield = document.getElementById('esp_url');
|
||||||
|
|
||||||
|
// Load any previously saved configuration, if available
|
||||||
|
if(localStorage['esp_url']) {
|
||||||
|
//highContrastCheckbox.checked = JSON.parse(localStorage['high_contrast']);
|
||||||
|
//backgroundColorPicker.value = localStorage['background_color'];
|
||||||
|
urlTextfield.value = localStorage['esp_url'];
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
346
clients/pebble/configuration_page/public/js/slate.js
Normal file
346
clients/pebble/configuration_page/public/js/slate.js
Normal file
File diff suppressed because one or more lines are too long
2
clients/pebble/configuration_page/public/js/slate.min.js
vendored
Normal file
2
clients/pebble/configuration_page/public/js/slate.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
46
clients/pebble/watchapp/appinfo.json
Normal file
46
clients/pebble/watchapp/appinfo.json
Normal file
|
|
@ -0,0 +1,46 @@
|
||||||
|
{
|
||||||
|
"appKeys": {},
|
||||||
|
"capabilities": [
|
||||||
|
"configurable"
|
||||||
|
],
|
||||||
|
"companyName": "pebble@tobiasblum.de",
|
||||||
|
"longName": "McLighting",
|
||||||
|
"projectType": "pebblejs",
|
||||||
|
"resources": {
|
||||||
|
"media": [
|
||||||
|
{
|
||||||
|
"file": "images/menu_icon.png",
|
||||||
|
"menuIcon": true,
|
||||||
|
"name": "IMAGE_MENU_ICON",
|
||||||
|
"type": "bitmap"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"file": "images/logo_splash.png",
|
||||||
|
"name": "IMAGE_LOGO_SPLASH",
|
||||||
|
"type": "bitmap"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"file": "images/tile_splash.png",
|
||||||
|
"name": "IMAGE_TILE_SPLASH",
|
||||||
|
"type": "bitmap"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"file": "fonts/UbuntuMono-Regular.ttf",
|
||||||
|
"name": "MONO_FONT_14",
|
||||||
|
"type": "font"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"sdkVersion": "3",
|
||||||
|
"shortName": "McLighting",
|
||||||
|
"targetPlatforms": [
|
||||||
|
"aplite"
|
||||||
|
],
|
||||||
|
"uuid": "11c1a793-0ddf-4045-8a40-4b4d059763ea",
|
||||||
|
"versionCode": 1,
|
||||||
|
"versionLabel": "1.0",
|
||||||
|
"watchapp": {
|
||||||
|
"hiddenApp": false,
|
||||||
|
"watchface": false
|
||||||
|
}
|
||||||
|
}
|
||||||
393
clients/pebble/watchapp/src/app.js
Normal file
393
clients/pebble/watchapp/src/app.js
Normal file
|
|
@ -0,0 +1,393 @@
|
||||||
|
/**
|
||||||
|
* Welcome to Pebble.js!
|
||||||
|
*
|
||||||
|
* This is where you write your app.
|
||||||
|
*/
|
||||||
|
|
||||||
|
var UI = require('ui');
|
||||||
|
var Settings = require('settings');
|
||||||
|
//var ajax = require('ajax');
|
||||||
|
|
||||||
|
|
||||||
|
var wsUri = "ws://esp8266_01.local:81/";
|
||||||
|
|
||||||
|
var websocket;
|
||||||
|
|
||||||
|
var main = new UI.Card({
|
||||||
|
title: 'Mc Lighting',
|
||||||
|
icon: 'images/menu_icon.png',
|
||||||
|
//subtitle: 'Hello World!',
|
||||||
|
body: 'Loading ...'
|
||||||
|
});
|
||||||
|
|
||||||
|
var colors = [
|
||||||
|
["White", "ffffff"],
|
||||||
|
["Red", "ff0000"],
|
||||||
|
["Blue", "0000ff"],
|
||||||
|
["Green", "00ff00"],
|
||||||
|
["Yellow", "ffff00"],
|
||||||
|
["White", "ffffff"],
|
||||||
|
["Pink", "ff1493"],
|
||||||
|
["Maroon", "800000"],
|
||||||
|
["Forest", "228b22"],
|
||||||
|
["Orange", "ff4500"],
|
||||||
|
["Cyan", "00ffff"]
|
||||||
|
];
|
||||||
|
|
||||||
|
var modes = ["Hold", "Off", "All", "Wipe", "Rainbow", "Rainbow Cycle", "Theater Chase", "Theater Chase Rainbow", "TV"];
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Init app
|
||||||
|
// **********************************
|
||||||
|
function init() {
|
||||||
|
console.log("init()");
|
||||||
|
|
||||||
|
//var options = Settings.option();
|
||||||
|
//console.log("Settings: ", JSON.stringify(options));
|
||||||
|
|
||||||
|
var esp_url = Settings.option('esp_url');
|
||||||
|
|
||||||
|
if (esp_url === "") {
|
||||||
|
//main.body('NO');
|
||||||
|
esp_url = wsUri;
|
||||||
|
} else {
|
||||||
|
//main.body('YES'+esp_url);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Connect Websocket
|
||||||
|
websocket = new WebSocket(esp_url);
|
||||||
|
websocket.onopen = function(evt) {
|
||||||
|
main.body('WebSocket connected!');
|
||||||
|
console.log("init() CONN");
|
||||||
|
|
||||||
|
websocket.send("$");
|
||||||
|
};
|
||||||
|
websocket.onclose = function(evt) {
|
||||||
|
console.log("init() CLOSE", JSON.stringify(evt));
|
||||||
|
errorMessage("WebSocket connection closed");
|
||||||
|
};
|
||||||
|
websocket.onmessage = function(evt) {
|
||||||
|
//console.log("WS received: ");
|
||||||
|
updateStatus(evt.data);
|
||||||
|
};
|
||||||
|
websocket.onerror = function(evt) {
|
||||||
|
console.log("init() ERROR", JSON.stringify(evt));
|
||||||
|
errorMessage("WebSocket error");
|
||||||
|
};
|
||||||
|
|
||||||
|
main.show();
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateStatus(msg) {
|
||||||
|
console.log("updateStatus: ", msg);
|
||||||
|
if (msg != "OK" && msg != "Connected") {
|
||||||
|
try {
|
||||||
|
var json = JSON.parse(msg);
|
||||||
|
var str_status = '';
|
||||||
|
if (json.mode !== undefined) {
|
||||||
|
console.log("JSON mode: ", json.mode);
|
||||||
|
|
||||||
|
str_status += 'Mode: ' + modes[json.mode] + "\n";
|
||||||
|
str_status += 'Brightness: ' + Math.round(json.brightness / 2.55) + "%\n";
|
||||||
|
str_status += 'Delay: ' + json.delay_ms + " ms\n";
|
||||||
|
str_status += 'Color: #' + decimalToHex(json.color[0], 2) + decimalToHex(json.color[1], 2) + decimalToHex(json.color[2], 2) + "\n";
|
||||||
|
|
||||||
|
main.body(str_status);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
catch(evt) {
|
||||||
|
console.log("JSON parse error: ", JSON.stringify(evt));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function decimalToHex(decimal, chars) {
|
||||||
|
return (decimal + Math.pow(16, chars)).toString(16).slice(-chars).toUpperCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
function errorMessage(message) {
|
||||||
|
var error_card = new UI.Card({
|
||||||
|
title: 'Error occurred',
|
||||||
|
icon: 'images/menu_icon.png',
|
||||||
|
subtitle: 'Press any button.',
|
||||||
|
body: message,
|
||||||
|
});
|
||||||
|
error_card.show();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Main Menu
|
||||||
|
// **********************************
|
||||||
|
main.on('click', 'select', function(e) {
|
||||||
|
var menu = new UI.Menu({
|
||||||
|
sections: [{
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
title: 'Mode',
|
||||||
|
//icon: 'images/menu_icon.png',
|
||||||
|
subtitle: 'Choose working mode'
|
||||||
|
}, {
|
||||||
|
title: 'Brightness',
|
||||||
|
subtitle: 'Let it shine'
|
||||||
|
}, {
|
||||||
|
title: 'Color',
|
||||||
|
subtitle: 'Bring color to the world'
|
||||||
|
}, {
|
||||||
|
title: 'Delay',
|
||||||
|
subtitle: 'Forever faster'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Main Menu Selected
|
||||||
|
// **********************************
|
||||||
|
menu.on('select', function(e) {
|
||||||
|
console.log('Selected item #' + e.itemIndex + ' of section #' + e.sectionIndex);
|
||||||
|
console.log('The item is titled "' + e.item.title + '"');
|
||||||
|
|
||||||
|
// Mode selection
|
||||||
|
var mode_menu;
|
||||||
|
if (e.itemIndex === 0) {
|
||||||
|
|
||||||
|
mode_menu = new UI.Menu({
|
||||||
|
sections: [{
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
title: 'Off',
|
||||||
|
subtitle: 'Turn it off'
|
||||||
|
}, {
|
||||||
|
title: 'All',
|
||||||
|
subtitle: 'All LEDs on'
|
||||||
|
}, {
|
||||||
|
title: 'Wipe',
|
||||||
|
subtitle: 'Wipe it bright'
|
||||||
|
}, {
|
||||||
|
title: 'Rainbow',
|
||||||
|
subtitle: 'Bring color to the world'
|
||||||
|
}, {
|
||||||
|
title: 'Rainbow Cycle',
|
||||||
|
subtitle: 'Like a unicorn'
|
||||||
|
},{
|
||||||
|
title: 'Theater Chase',
|
||||||
|
subtitle: 'Disco'
|
||||||
|
},{
|
||||||
|
title: 'Theater Chase Rainbow',
|
||||||
|
subtitle: 'Unicorn disco'
|
||||||
|
}, {
|
||||||
|
title: 'TV',
|
||||||
|
subtitle: 'Video killed the radio star'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
mode_menu.show();
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Mode Selected
|
||||||
|
// **********************************
|
||||||
|
mode_menu.on('select', function(e) {
|
||||||
|
// Select mode
|
||||||
|
console.log('Selected mode #' + e.itemIndex + ' of section #' + e.sectionIndex);
|
||||||
|
|
||||||
|
setMode(e.itemIndex);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Brightness selection
|
||||||
|
var brightness_menu;
|
||||||
|
if (e.itemIndex === 1) {
|
||||||
|
var brightness_items = [];
|
||||||
|
|
||||||
|
for (var i = 0; i<=10; i++) {
|
||||||
|
var brightness_item = {
|
||||||
|
title: (i*10) + " %",
|
||||||
|
};
|
||||||
|
brightness_items.push(brightness_item);
|
||||||
|
}
|
||||||
|
|
||||||
|
brightness_menu = new UI.Menu({
|
||||||
|
sections: [{
|
||||||
|
items: brightness_items
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
brightness_menu.show();
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Brightness Selected
|
||||||
|
// **********************************
|
||||||
|
brightness_menu.on('select', function(e) {
|
||||||
|
// Select mode
|
||||||
|
console.log('Selected mode #' + e.itemIndex + ' of section #' + e.sectionIndex);
|
||||||
|
|
||||||
|
setBrightness(e.itemIndex);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Color selection
|
||||||
|
var color_menu;
|
||||||
|
if (e.itemIndex === 2) {
|
||||||
|
var color_items = [];
|
||||||
|
|
||||||
|
for (var k = 0; k < colors.length; k++) {
|
||||||
|
var color_item = {
|
||||||
|
title: colors[k][0]
|
||||||
|
};
|
||||||
|
color_items.push(color_item);
|
||||||
|
}
|
||||||
|
|
||||||
|
color_menu = new UI.Menu({
|
||||||
|
sections: [{
|
||||||
|
items: color_items
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
color_menu.show();
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Brightness Selected
|
||||||
|
// **********************************
|
||||||
|
color_menu.on('select', function(e) {
|
||||||
|
// Select mode
|
||||||
|
console.log('Selected mode #' + e.itemIndex + ' of section #' + e.sectionIndex);
|
||||||
|
|
||||||
|
setColor(e.itemIndex);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Delay selection
|
||||||
|
var delay_menu;
|
||||||
|
if (e.itemIndex === 3) {
|
||||||
|
var delay_items = [];
|
||||||
|
|
||||||
|
for (var j = 0; j<=15; j++) {
|
||||||
|
var delay_item = {
|
||||||
|
title: Math.round(j*10) + " ms",
|
||||||
|
};
|
||||||
|
delay_items.push(delay_item);
|
||||||
|
}
|
||||||
|
|
||||||
|
delay_menu = new UI.Menu({
|
||||||
|
sections: [{
|
||||||
|
items: delay_items
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
delay_menu.show();
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Brightness Selected
|
||||||
|
// **********************************
|
||||||
|
delay_menu.on('select', function(e) {
|
||||||
|
// Select mode
|
||||||
|
console.log('Selected mode #' + e.itemIndex + ' of section #' + e.sectionIndex);
|
||||||
|
|
||||||
|
setDelay(e.itemIndex);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
menu.show();
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Requests
|
||||||
|
// **********************************
|
||||||
|
function setMode(mode) {
|
||||||
|
if (mode === 0) {
|
||||||
|
performRequest("=off");
|
||||||
|
}
|
||||||
|
if (mode === 1) {
|
||||||
|
performRequest("=all");
|
||||||
|
}
|
||||||
|
if (mode === 2) {
|
||||||
|
performRequest("=wipe");
|
||||||
|
}
|
||||||
|
if (mode === 3) {
|
||||||
|
performRequest("=rainbow");
|
||||||
|
}
|
||||||
|
if (mode === 4) {
|
||||||
|
performRequest("=rainbowCycle");
|
||||||
|
}
|
||||||
|
if (mode === 5) {
|
||||||
|
performRequest("=theaterchase");
|
||||||
|
}
|
||||||
|
if (mode === 6) {
|
||||||
|
performRequest("=theaterchaseRainbow");
|
||||||
|
}
|
||||||
|
if (mode === 7) {
|
||||||
|
performRequest("=tv");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function setBrightness(index) {
|
||||||
|
var value = Math.round(index * 25.5);
|
||||||
|
performRequest("%"+value);
|
||||||
|
}
|
||||||
|
|
||||||
|
function setColor(index) {
|
||||||
|
var value = colors[index][1];
|
||||||
|
performRequest("*"+value);
|
||||||
|
}
|
||||||
|
|
||||||
|
function setDelay(index) {
|
||||||
|
var value = Math.round(index * 10);
|
||||||
|
performRequest("?"+value);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function performRequest(message) {
|
||||||
|
websocket.send(message);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
main.on('click', 'up', function(e) {
|
||||||
|
// Restart websocket connection
|
||||||
|
//websocket.send("$");
|
||||||
|
websocket.close();
|
||||||
|
init();
|
||||||
|
});
|
||||||
|
|
||||||
|
main.on('click', 'down', function(e) {
|
||||||
|
// Update status
|
||||||
|
websocket.send("$");
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// **********************************
|
||||||
|
// Settings
|
||||||
|
// **********************************
|
||||||
|
// https://pebble.github.io/pebblejs/#settings
|
||||||
|
// https://github.com/pebble/slate
|
||||||
|
// Set a configurable with just the close callback
|
||||||
|
Settings.config(
|
||||||
|
{ url: 'https://mclighting-pebble-config.firebaseapp.com' },
|
||||||
|
function(e) {
|
||||||
|
console.log('closed configurable');
|
||||||
|
|
||||||
|
// Show the parsed response
|
||||||
|
console.log(JSON.stringify(e.options));
|
||||||
|
init();
|
||||||
|
|
||||||
|
// Show the raw response if parsing failed
|
||||||
|
if (e.failed) {
|
||||||
|
console.log(e.response);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
init();
|
||||||
Loading…
Reference in a new issue