├── .editorconfig ├── .gitignore ├── .jshintrc ├── LICENSE ├── README.md ├── app.js ├── auth.js ├── package-lock.json ├── package.json └── public ├── css └── style.css ├── images └── quby.svg ├── index.html └── js ├── APIManager.js ├── jquery.js ├── script.js └── utils.js /.editorconfig: -------------------------------------------------------------------------------- 1 | # For more information about the configurations used 2 | # in this file, please see the EditorConfig documentation: 3 | # http://editorconfig.org 4 | 5 | root = true 6 | 7 | [*] 8 | charset = utf-8 9 | indent_size = 4 10 | indent_style = space 11 | insert_final_newline = true 12 | trim_trailing_whitespace = true 13 | 14 | [*.scss] 15 | indent_size = 2 16 | 17 | [*.md] 18 | trim_trailing_whitespace = false 19 | 20 | [{package.json}] 21 | indent_size = 2 22 | indent_style = space 23 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by https://www.gitignore.io/api/node 2 | # Edit at https://www.gitignore.io/?templates=node 3 | 4 | ### Node ### 5 | # Logs 6 | logs 7 | *.log 8 | npm-debug.log* 9 | yarn-debug.log* 10 | yarn-error.log* 11 | lerna-debug.log* 12 | 13 | # Diagnostic reports (https://nodejs.org/api/report.html) 14 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 15 | 16 | # Runtime data 17 | pids 18 | *.pid 19 | *.seed 20 | *.pid.lock 21 | 22 | # Directory for instrumented libs generated by jscoverage/JSCover 23 | lib-cov 24 | 25 | # Coverage directory used by tools like istanbul 26 | coverage 27 | *.lcov 28 | 29 | # nyc test coverage 30 | .nyc_output 31 | 32 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 33 | .grunt 34 | 35 | # Bower dependency directory (https://bower.io/) 36 | bower_components 37 | 38 | # node-waf configuration 39 | .lock-wscript 40 | 41 | # Compiled binary addons (https://nodejs.org/api/addons.html) 42 | build/Release 43 | 44 | # Dependency directories 45 | node_modules/ 46 | jspm_packages/ 47 | 48 | # TypeScript v1 declaration files 49 | typings/ 50 | 51 | # TypeScript cache 52 | *.tsbuildinfo 53 | 54 | # Optional npm cache directory 55 | .npm 56 | 57 | # Optional eslint cache 58 | .eslintcache 59 | 60 | # Optional REPL history 61 | .node_repl_history 62 | 63 | # Output of 'npm pack' 64 | *.tgz 65 | 66 | # Yarn Integrity file 67 | .yarn-integrity 68 | 69 | # dotenv environment variables file 70 | .env 71 | .env.test 72 | 73 | # parcel-bundler cache (https://parceljs.org/) 74 | .cache 75 | 76 | # next.js build output 77 | .next 78 | 79 | # nuxt.js build output 80 | .nuxt 81 | 82 | # react / gatsby 83 | public/ 84 | 85 | # vuepress build output 86 | .vuepress/dist 87 | 88 | # Serverless directories 89 | .serverless/ 90 | 91 | # FuseBox cache 92 | .fusebox/ 93 | 94 | # DynamoDB Local files 95 | .dynamodb/ 96 | 97 | # End of https://www.gitignore.io/api/node -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "esversion": 6 3 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2015 Quby 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Toon Open Api example Application 2 | 3 | The new Toon API is now open for all kinds of products, services and other applications. Get connected and start developing today for the smart homes of tomorrow. In just a few easy steps you can start developing your first Toon solution. 4 | 5 | ## How to start 6 | - Go to https://developer.toon.eu/ and register for the developer-program. 7 | - Go to https://nodejs.org/ and download and install Node.js. 8 | - Clone or download this repository. 9 | - Run `npm install` in the folder where you downloaded this repository. 10 | - Create an access token for your toon based on the the credentials you have received from signup in auth.js. 11 | - Run `npm start` in the same folder. 12 | - Open http://localhost:8080 in your browser. 13 | - Read the documentation on https://developer.toon.eu to get a better undestanding of the features. 14 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | var express = require('express'), 2 | bodyParser = require('body-parser'), 3 | methodOverride = require('method-override'), 4 | querystring = require('querystring'), 5 | url = require('url'), 6 | app = express(), 7 | api = express(), 8 | http = require('http'), 9 | https = require('https'), 10 | auth = new require('./auth'); 11 | 12 | const SERVERPORT = 3001; 13 | const WEBPORT = 8080; 14 | 15 | if (!auth.personal_access_token) { 16 | console.error('You haven\'t supplied the application with the needed personal_access_token'); 17 | process.exit(1); 18 | } 19 | 20 | api.use(bodyParser.json()); 21 | api.use(bodyParser.urlencoded({extended: false})); 22 | api.use(methodOverride()); 23 | 24 | api.all('/*', function (req, res, next) { 25 | res.header("Access-Control-Allow-Origin", "*"); 26 | res.header("Access-Control-Allow-Headers", "X-Requested-With"); 27 | next(); 28 | }); 29 | 30 | process.env.NODE_TLS_REJECT_UNAUTHORIZED = '0'; 31 | 32 | api.get('/login', function (req, res) { 33 | 34 | console.log('Received a request for a new token!'); 35 | res.json(JSON.stringify({ "access_token" : auth.personal_access_token})); 36 | 37 | }); 38 | 39 | api.listen(SERVERPORT); 40 | console.log('Api started on *:' + SERVERPORT); 41 | 42 | app.use(express.static(__dirname + '/public')); 43 | app.listen(WEBPORT); 44 | console.log('Webserver started on *:' + WEBPORT); 45 | -------------------------------------------------------------------------------- /auth.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Fill here your personal access token, generate it from where client_id comes from your developer account. 3 | * api.toon.eu/toonapi-accesstoken?tenant_id=(tenant_id for example eneco)&client_id=(client_id) 4 | */ 5 | 6 | module.exports = { 7 | personal_access_token : "xx" 8 | }; 9 | 10 | 11 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Toon-API-example", 3 | "version": "2.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "accepts": { 8 | "version": "1.3.7", 9 | "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz", 10 | "integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==", 11 | "requires": { 12 | "mime-types": "~2.1.24", 13 | "negotiator": "0.6.2" 14 | } 15 | }, 16 | "array-flatten": { 17 | "version": "1.1.1", 18 | "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz", 19 | "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=" 20 | }, 21 | "balanced-match": { 22 | "version": "1.0.0", 23 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", 24 | "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", 25 | "dev": true 26 | }, 27 | "body-parser": { 28 | "version": "1.19.0", 29 | "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz", 30 | "integrity": "sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==", 31 | "requires": { 32 | "bytes": "3.1.0", 33 | "content-type": "~1.0.4", 34 | "debug": "2.6.9", 35 | "depd": "~1.1.2", 36 | "http-errors": "1.7.2", 37 | "iconv-lite": "0.4.24", 38 | "on-finished": "~2.3.0", 39 | "qs": "6.7.0", 40 | "raw-body": "2.4.0", 41 | "type-is": "~1.6.17" 42 | } 43 | }, 44 | "brace-expansion": { 45 | "version": "1.1.11", 46 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 47 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 48 | "dev": true, 49 | "requires": { 50 | "balanced-match": "^1.0.0", 51 | "concat-map": "0.0.1" 52 | } 53 | }, 54 | "bytes": { 55 | "version": "3.1.0", 56 | "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz", 57 | "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==" 58 | }, 59 | "cli": { 60 | "version": "1.0.1", 61 | "resolved": "https://registry.npmjs.org/cli/-/cli-1.0.1.tgz", 62 | "integrity": "sha1-IoF1NPJL+klQw01TLUjsvGIbjBQ=", 63 | "dev": true, 64 | "requires": { 65 | "exit": "0.1.2", 66 | "glob": "^7.1.1" 67 | } 68 | }, 69 | "concat-map": { 70 | "version": "0.0.1", 71 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 72 | "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", 73 | "dev": true 74 | }, 75 | "console-browserify": { 76 | "version": "1.1.0", 77 | "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz", 78 | "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA=", 79 | "dev": true, 80 | "requires": { 81 | "date-now": "^0.1.4" 82 | } 83 | }, 84 | "content-disposition": { 85 | "version": "0.5.3", 86 | "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz", 87 | "integrity": "sha512-ExO0774ikEObIAEV9kDo50o+79VCUdEB6n6lzKgGwupcVeRlhrj3qGAfwq8G6uBJjkqLrhT0qEYFcWng8z1z0g==", 88 | "requires": { 89 | "safe-buffer": "5.1.2" 90 | } 91 | }, 92 | "content-type": { 93 | "version": "1.0.4", 94 | "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz", 95 | "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==" 96 | }, 97 | "cookie": { 98 | "version": "0.4.0", 99 | "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz", 100 | "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==" 101 | }, 102 | "cookie-signature": { 103 | "version": "1.0.6", 104 | "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz", 105 | "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=" 106 | }, 107 | "core-util-is": { 108 | "version": "1.0.2", 109 | "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", 110 | "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=", 111 | "dev": true 112 | }, 113 | "date-now": { 114 | "version": "0.1.4", 115 | "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz", 116 | "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs=", 117 | "dev": true 118 | }, 119 | "debug": { 120 | "version": "2.6.9", 121 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", 122 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", 123 | "requires": { 124 | "ms": "2.0.0" 125 | } 126 | }, 127 | "depd": { 128 | "version": "1.1.2", 129 | "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz", 130 | "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=" 131 | }, 132 | "destroy": { 133 | "version": "1.0.4", 134 | "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz", 135 | "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=" 136 | }, 137 | "dom-serializer": { 138 | "version": "0.2.1", 139 | "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.1.tgz", 140 | "integrity": "sha512-sK3ujri04WyjwQXVoK4PU3y8ula1stq10GJZpqHIUgoGZdsGzAGu65BnU3d08aTVSvO7mGPZUc0wTEDL+qGE0Q==", 141 | "dev": true, 142 | "requires": { 143 | "domelementtype": "^2.0.1", 144 | "entities": "^2.0.0" 145 | }, 146 | "dependencies": { 147 | "domelementtype": { 148 | "version": "2.0.1", 149 | "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.0.1.tgz", 150 | "integrity": "sha512-5HOHUDsYZWV8FGWN0Njbr/Rn7f/eWSQi1v7+HsUVwXgn8nWWlL64zKDkS0n8ZmQ3mlWOMuXOnR+7Nx/5tMO5AQ==", 151 | "dev": true 152 | }, 153 | "entities": { 154 | "version": "2.0.0", 155 | "resolved": "https://registry.npmjs.org/entities/-/entities-2.0.0.tgz", 156 | "integrity": "sha512-D9f7V0JSRwIxlRI2mjMqufDrRDnx8p+eEOz7aUM9SuvF8gsBzra0/6tbjl1m8eQHrZlYj6PxqE00hZ1SAIKPLw==", 157 | "dev": true 158 | } 159 | } 160 | }, 161 | "domelementtype": { 162 | "version": "1.3.1", 163 | "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.1.tgz", 164 | "integrity": "sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==", 165 | "dev": true 166 | }, 167 | "domhandler": { 168 | "version": "2.3.0", 169 | "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.3.0.tgz", 170 | "integrity": "sha1-LeWaCCLVAn+r/28DLCsloqir5zg=", 171 | "dev": true, 172 | "requires": { 173 | "domelementtype": "1" 174 | } 175 | }, 176 | "domutils": { 177 | "version": "1.5.1", 178 | "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz", 179 | "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=", 180 | "dev": true, 181 | "requires": { 182 | "dom-serializer": "0", 183 | "domelementtype": "1" 184 | } 185 | }, 186 | "ee-first": { 187 | "version": "1.1.1", 188 | "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", 189 | "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=" 190 | }, 191 | "encodeurl": { 192 | "version": "1.0.2", 193 | "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", 194 | "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=" 195 | }, 196 | "entities": { 197 | "version": "1.0.0", 198 | "resolved": "https://registry.npmjs.org/entities/-/entities-1.0.0.tgz", 199 | "integrity": "sha1-sph6o4ITR/zeZCsk/fyeT7cSvyY=", 200 | "dev": true 201 | }, 202 | "escape-html": { 203 | "version": "1.0.3", 204 | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", 205 | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" 206 | }, 207 | "etag": { 208 | "version": "1.8.1", 209 | "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz", 210 | "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=" 211 | }, 212 | "exit": { 213 | "version": "0.1.2", 214 | "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz", 215 | "integrity": "sha1-BjJjj42HfMghB9MKD/8aF8uhzQw=", 216 | "dev": true 217 | }, 218 | "express": { 219 | "version": "4.17.1", 220 | "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz", 221 | "integrity": "sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g==", 222 | "requires": { 223 | "accepts": "~1.3.7", 224 | "array-flatten": "1.1.1", 225 | "body-parser": "1.19.0", 226 | "content-disposition": "0.5.3", 227 | "content-type": "~1.0.4", 228 | "cookie": "0.4.0", 229 | "cookie-signature": "1.0.6", 230 | "debug": "2.6.9", 231 | "depd": "~1.1.2", 232 | "encodeurl": "~1.0.2", 233 | "escape-html": "~1.0.3", 234 | "etag": "~1.8.1", 235 | "finalhandler": "~1.1.2", 236 | "fresh": "0.5.2", 237 | "merge-descriptors": "1.0.1", 238 | "methods": "~1.1.2", 239 | "on-finished": "~2.3.0", 240 | "parseurl": "~1.3.3", 241 | "path-to-regexp": "0.1.7", 242 | "proxy-addr": "~2.0.5", 243 | "qs": "6.7.0", 244 | "range-parser": "~1.2.1", 245 | "safe-buffer": "5.1.2", 246 | "send": "0.17.1", 247 | "serve-static": "1.14.1", 248 | "setprototypeof": "1.1.1", 249 | "statuses": "~1.5.0", 250 | "type-is": "~1.6.18", 251 | "utils-merge": "1.0.1", 252 | "vary": "~1.1.2" 253 | } 254 | }, 255 | "finalhandler": { 256 | "version": "1.1.2", 257 | "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz", 258 | "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==", 259 | "requires": { 260 | "debug": "2.6.9", 261 | "encodeurl": "~1.0.2", 262 | "escape-html": "~1.0.3", 263 | "on-finished": "~2.3.0", 264 | "parseurl": "~1.3.3", 265 | "statuses": "~1.5.0", 266 | "unpipe": "~1.0.0" 267 | } 268 | }, 269 | "forwarded": { 270 | "version": "0.1.2", 271 | "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz", 272 | "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=" 273 | }, 274 | "fresh": { 275 | "version": "0.5.2", 276 | "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz", 277 | "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=" 278 | }, 279 | "fs.realpath": { 280 | "version": "1.0.0", 281 | "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", 282 | "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", 283 | "dev": true 284 | }, 285 | "glob": { 286 | "version": "7.1.4", 287 | "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.4.tgz", 288 | "integrity": "sha512-hkLPepehmnKk41pUGm3sYxoFs/umurYfYJCerbXEyFIWcAzvpipAgVkBqqT9RBKMGjnq6kMuyYwha6csxbiM1A==", 289 | "dev": true, 290 | "requires": { 291 | "fs.realpath": "^1.0.0", 292 | "inflight": "^1.0.4", 293 | "inherits": "2", 294 | "minimatch": "^3.0.4", 295 | "once": "^1.3.0", 296 | "path-is-absolute": "^1.0.0" 297 | } 298 | }, 299 | "htmlparser2": { 300 | "version": "3.8.3", 301 | "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.8.3.tgz", 302 | "integrity": "sha1-mWwosZFRaovoZQGn15dX5ccMEGg=", 303 | "dev": true, 304 | "requires": { 305 | "domelementtype": "1", 306 | "domhandler": "2.3", 307 | "domutils": "1.5", 308 | "entities": "1.0", 309 | "readable-stream": "1.1" 310 | } 311 | }, 312 | "http-errors": { 313 | "version": "1.7.2", 314 | "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz", 315 | "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==", 316 | "requires": { 317 | "depd": "~1.1.2", 318 | "inherits": "2.0.3", 319 | "setprototypeof": "1.1.1", 320 | "statuses": ">= 1.5.0 < 2", 321 | "toidentifier": "1.0.0" 322 | } 323 | }, 324 | "iconv-lite": { 325 | "version": "0.4.24", 326 | "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", 327 | "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", 328 | "requires": { 329 | "safer-buffer": ">= 2.1.2 < 3" 330 | } 331 | }, 332 | "inflight": { 333 | "version": "1.0.6", 334 | "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", 335 | "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", 336 | "dev": true, 337 | "requires": { 338 | "once": "^1.3.0", 339 | "wrappy": "1" 340 | } 341 | }, 342 | "inherits": { 343 | "version": "2.0.3", 344 | "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", 345 | "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=" 346 | }, 347 | "ipaddr.js": { 348 | "version": "1.9.0", 349 | "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.0.tgz", 350 | "integrity": "sha512-M4Sjn6N/+O6/IXSJseKqHoFc+5FdGJ22sXqnjTpdZweHK64MzEPAyQZyEU3R/KRv2GLoa7nNtg/C2Ev6m7z+eA==" 351 | }, 352 | "isarray": { 353 | "version": "0.0.1", 354 | "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", 355 | "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=", 356 | "dev": true 357 | }, 358 | "jshint": { 359 | "version": "2.10.2", 360 | "resolved": "https://registry.npmjs.org/jshint/-/jshint-2.10.2.tgz", 361 | "integrity": "sha512-e7KZgCSXMJxznE/4WULzybCMNXNAd/bf5TSrvVEq78Q/K8ZwFpmBqQeDtNiHc3l49nV4E/+YeHU/JZjSUIrLAA==", 362 | "dev": true, 363 | "requires": { 364 | "cli": "~1.0.0", 365 | "console-browserify": "1.1.x", 366 | "exit": "0.1.x", 367 | "htmlparser2": "3.8.x", 368 | "lodash": "~4.17.11", 369 | "minimatch": "~3.0.2", 370 | "shelljs": "0.3.x", 371 | "strip-json-comments": "1.0.x" 372 | } 373 | }, 374 | "lodash": { 375 | "version": "4.17.15", 376 | "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz", 377 | "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==", 378 | "dev": true 379 | }, 380 | "media-typer": { 381 | "version": "0.3.0", 382 | "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", 383 | "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=" 384 | }, 385 | "merge-descriptors": { 386 | "version": "1.0.1", 387 | "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz", 388 | "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E=" 389 | }, 390 | "method-override": { 391 | "version": "2.3.10", 392 | "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.10.tgz", 393 | "integrity": "sha1-49r41d7hDdLc59SuiNYrvud0drQ=", 394 | "requires": { 395 | "debug": "2.6.9", 396 | "methods": "~1.1.2", 397 | "parseurl": "~1.3.2", 398 | "vary": "~1.1.2" 399 | } 400 | }, 401 | "methods": { 402 | "version": "1.1.2", 403 | "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", 404 | "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=" 405 | }, 406 | "mime": { 407 | "version": "1.6.0", 408 | "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", 409 | "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==" 410 | }, 411 | "mime-db": { 412 | "version": "1.40.0", 413 | "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.40.0.tgz", 414 | "integrity": "sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA==" 415 | }, 416 | "mime-types": { 417 | "version": "2.1.24", 418 | "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.24.tgz", 419 | "integrity": "sha512-WaFHS3MCl5fapm3oLxU4eYDw77IQM2ACcxQ9RIxfaC3ooc6PFuBMGZZsYpvoXS5D5QTWPieo1jjLdAm3TBP3cQ==", 420 | "requires": { 421 | "mime-db": "1.40.0" 422 | } 423 | }, 424 | "minimatch": { 425 | "version": "3.0.4", 426 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", 427 | "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", 428 | "dev": true, 429 | "requires": { 430 | "brace-expansion": "^1.1.7" 431 | } 432 | }, 433 | "ms": { 434 | "version": "2.0.0", 435 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", 436 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" 437 | }, 438 | "negotiator": { 439 | "version": "0.6.2", 440 | "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz", 441 | "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==" 442 | }, 443 | "on-finished": { 444 | "version": "2.3.0", 445 | "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", 446 | "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=", 447 | "requires": { 448 | "ee-first": "1.1.1" 449 | } 450 | }, 451 | "once": { 452 | "version": "1.4.0", 453 | "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", 454 | "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", 455 | "dev": true, 456 | "requires": { 457 | "wrappy": "1" 458 | } 459 | }, 460 | "parseurl": { 461 | "version": "1.3.3", 462 | "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz", 463 | "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==" 464 | }, 465 | "path-is-absolute": { 466 | "version": "1.0.1", 467 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 468 | "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", 469 | "dev": true 470 | }, 471 | "path-to-regexp": { 472 | "version": "0.1.7", 473 | "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz", 474 | "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w=" 475 | }, 476 | "proxy-addr": { 477 | "version": "2.0.5", 478 | "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.5.tgz", 479 | "integrity": "sha512-t/7RxHXPH6cJtP0pRG6smSr9QJidhB+3kXu0KgXnbGYMgzEnUxRQ4/LDdfOwZEMyIh3/xHb8PX3t+lfL9z+YVQ==", 480 | "requires": { 481 | "forwarded": "~0.1.2", 482 | "ipaddr.js": "1.9.0" 483 | } 484 | }, 485 | "qs": { 486 | "version": "6.7.0", 487 | "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz", 488 | "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==" 489 | }, 490 | "range-parser": { 491 | "version": "1.2.1", 492 | "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz", 493 | "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==" 494 | }, 495 | "raw-body": { 496 | "version": "2.4.0", 497 | "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.0.tgz", 498 | "integrity": "sha512-4Oz8DUIwdvoa5qMJelxipzi/iJIi40O5cGV1wNYp5hvZP8ZN0T+jiNkL0QepXs+EsQ9XJ8ipEDoiH70ySUJP3Q==", 499 | "requires": { 500 | "bytes": "3.1.0", 501 | "http-errors": "1.7.2", 502 | "iconv-lite": "0.4.24", 503 | "unpipe": "1.0.0" 504 | } 505 | }, 506 | "readable-stream": { 507 | "version": "1.1.14", 508 | "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz", 509 | "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=", 510 | "dev": true, 511 | "requires": { 512 | "core-util-is": "~1.0.0", 513 | "inherits": "~2.0.1", 514 | "isarray": "0.0.1", 515 | "string_decoder": "~0.10.x" 516 | } 517 | }, 518 | "safe-buffer": { 519 | "version": "5.1.2", 520 | "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", 521 | "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==" 522 | }, 523 | "safer-buffer": { 524 | "version": "2.1.2", 525 | "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", 526 | "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" 527 | }, 528 | "send": { 529 | "version": "0.17.1", 530 | "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz", 531 | "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==", 532 | "requires": { 533 | "debug": "2.6.9", 534 | "depd": "~1.1.2", 535 | "destroy": "~1.0.4", 536 | "encodeurl": "~1.0.2", 537 | "escape-html": "~1.0.3", 538 | "etag": "~1.8.1", 539 | "fresh": "0.5.2", 540 | "http-errors": "~1.7.2", 541 | "mime": "1.6.0", 542 | "ms": "2.1.1", 543 | "on-finished": "~2.3.0", 544 | "range-parser": "~1.2.1", 545 | "statuses": "~1.5.0" 546 | }, 547 | "dependencies": { 548 | "ms": { 549 | "version": "2.1.1", 550 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", 551 | "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==" 552 | } 553 | } 554 | }, 555 | "serve-static": { 556 | "version": "1.14.1", 557 | "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.14.1.tgz", 558 | "integrity": "sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==", 559 | "requires": { 560 | "encodeurl": "~1.0.2", 561 | "escape-html": "~1.0.3", 562 | "parseurl": "~1.3.3", 563 | "send": "0.17.1" 564 | } 565 | }, 566 | "setprototypeof": { 567 | "version": "1.1.1", 568 | "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz", 569 | "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw==" 570 | }, 571 | "shelljs": { 572 | "version": "0.3.0", 573 | "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.3.0.tgz", 574 | "integrity": "sha1-NZbmMHp4FUT1kfN9phg2DzHbV7E=", 575 | "dev": true 576 | }, 577 | "statuses": { 578 | "version": "1.5.0", 579 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", 580 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=" 581 | }, 582 | "string_decoder": { 583 | "version": "0.10.31", 584 | "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", 585 | "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=", 586 | "dev": true 587 | }, 588 | "strip-json-comments": { 589 | "version": "1.0.4", 590 | "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-1.0.4.tgz", 591 | "integrity": "sha1-HhX7ysl9Pumb8tc7TGVrCCu6+5E=", 592 | "dev": true 593 | }, 594 | "toidentifier": { 595 | "version": "1.0.0", 596 | "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", 597 | "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==" 598 | }, 599 | "type-is": { 600 | "version": "1.6.18", 601 | "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz", 602 | "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==", 603 | "requires": { 604 | "media-typer": "0.3.0", 605 | "mime-types": "~2.1.24" 606 | } 607 | }, 608 | "unpipe": { 609 | "version": "1.0.0", 610 | "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", 611 | "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw=" 612 | }, 613 | "utils-merge": { 614 | "version": "1.0.1", 615 | "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz", 616 | "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=" 617 | }, 618 | "vary": { 619 | "version": "1.1.2", 620 | "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", 621 | "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=" 622 | }, 623 | "wrappy": { 624 | "version": "1.0.2", 625 | "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", 626 | "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", 627 | "dev": true 628 | } 629 | } 630 | } 631 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Toon-API-example", 3 | "version": "2.0.0", 4 | "description": "Basic Project to get acquainted with ToonAPI", 5 | "repository": "https://github.com/developer-quby/ToonDemoApplication.git", 6 | "main": "app.js", 7 | "scripts": { 8 | "test": "echo \"Error: no test specified\" && exit 1", 9 | "start": "jshint *.js public/js/APIManager.js public/js/script.js public/js/utils.js && node app.js" 10 | }, 11 | "author": "Quby BV", 12 | "license": "ISC", 13 | "dependencies": { 14 | "body-parser": "^1.10.2", 15 | "express": "^4.11.1", 16 | "method-override": "^2.3.1" 17 | }, 18 | "devDependencies": { 19 | "jshint": "^2.10.2" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /public/css/style.css: -------------------------------------------------------------------------------- 1 | html { 2 | height: 100%; 3 | margin: 0; 4 | } 5 | 6 | body { 7 | background-color: #ececec; 8 | font-family: Arial; 9 | font-size: 1em; 10 | font-weight: 300; 11 | height: 100%; 12 | margin: 0; 13 | overflow:hidden; 14 | white-space: nowrap; 15 | width: 100%; 16 | } 17 | button { 18 | cursor:pointer; 19 | outline:none; 20 | } 21 | 22 | a { 23 | text-decoration: none; 24 | color: inherit; 25 | } 26 | .left { 27 | float: left; 28 | } 29 | 30 | .right { 31 | float: right; 32 | } 33 | 34 | .clear { 35 | clear: both; 36 | } 37 | 38 | .page-header { 39 | border-bottom: 1px #c1c1c1 solid; 40 | font-weight: bold; 41 | height: 32px; 42 | line-height: 32px; 43 | position: relative; 44 | text-align:center; 45 | width: 100%; 46 | } 47 | .page-header::after { 48 | background-color: #fff; 49 | content: ""; 50 | height: 1px; 51 | width: 100%; 52 | display: block; 53 | position: relative; 54 | bottom: -1px; 55 | } 56 | 57 | .page-header .logo { 58 | background: url(../images/quby.svg) center no-repeat; 59 | background-size: 100% auto; 60 | height: 32px; 61 | overflow:hidden; 62 | text-indent:-9999em; 63 | width: 32px; 64 | } 65 | 66 | .menu-item { 67 | display:inline-block; 68 | padding:0 1.5em; 69 | } 70 | .menu-item:focus, 71 | .menu-item:hover { 72 | background: #cccccc; 73 | } 74 | 75 | aside.actions { 76 | align-items: center; 77 | display:flex; 78 | height:400px; 79 | justify-content: center; 80 | margin:0 auto; 81 | width:400px; 82 | } 83 | .actions .login { 84 | animation-name: pulse; 85 | animation-duration: 2s; 86 | animation-iteration-count: infinite; 87 | animation-play-state: start; 88 | border-style:none; 89 | border-radius:5px; 90 | font-size:3em; 91 | height:200px; 92 | width:200px; 93 | } 94 | 95 | @-webkit-keyframes pulse { 96 | from { background-color: #eeeeee; box-shadow: 0 0 9px #333; } 97 | 50% { background-color: #cccccc; box-shadow: 0 0 9px #333; } 98 | to { background-color: #eeeeee; box-shadow: 0 0 9px #333; } 99 | } 100 | 101 | .content { 102 | margin:0 auto; 103 | padding:1em; 104 | width: 400px; 105 | } 106 | 107 | .thermostat-state { 108 | float: left; 109 | height:216px; 110 | margin-right:1em; 111 | width: 284px; 112 | background: #fbfbfb; 113 | border-top-left-radius: 6px; 114 | } 115 | 116 | .thermostat-state .temperature { 117 | color: #414141; 118 | font-size: 90px; 119 | margin-left: 10%; 120 | } 121 | 122 | .thermostat-state .heating-icon { 123 | height: 25%; 124 | width: 100%; 125 | } 126 | 127 | .button { 128 | align-items: center; 129 | background: #fff; 130 | border-width: 0; 131 | color: #898989; 132 | cursor:pointer; 133 | box-shadow: 1px 1px 1px #d4d4d4; 134 | display:flex; 135 | float:right; 136 | font-size: 3em; 137 | height:100px; 138 | justify-content: center; 139 | margin-bottom: 16px; 140 | width:100px; 141 | } 142 | 143 | .thermostat-plus { 144 | border-top-right-radius: 6px; 145 | } 146 | 147 | .state-button:active, 148 | .button:active{ 149 | background: #eeeeee; 150 | color: #d21242; 151 | } 152 | 153 | .row { 154 | display:flex; 155 | flex-direction: row 156 | } 157 | .row-item { 158 | width:50%; 159 | } 160 | 161 | .value { 162 | text-align:right; 163 | } 164 | 165 | .switch { 166 | background: #cbd5e2; 167 | border-radius: 5px; 168 | border-style: none; 169 | box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.27); 170 | height: 32px; 171 | position:relative; 172 | width: 64px; 173 | } 174 | 175 | .switch::after { 176 | background: #ffffff; 177 | border-radius: 5px; 178 | border-style:none; 179 | content: ""; 180 | left:2px; 181 | height: 26px; 182 | margin: 1px; 183 | position:absolute; 184 | top:2px; 185 | width: 26px; 186 | } 187 | 188 | .switch.active::after { 189 | left:auto; 190 | right:2px; 191 | } 192 | 193 | .switch.active { 194 | background: #74b72e; 195 | } 196 | 197 | .thermostat-program { 198 | background: #fbfbfb; 199 | border-bottom-left-radius: 6px; 200 | border-bottom-right-radius: 6px; 201 | box-sizing:border-box; 202 | clear:both; 203 | font-size: 25px; 204 | padding:16px; 205 | width: 100%; 206 | } 207 | .thermostat-program .row { 208 | margin-bottom:8px; 209 | } 210 | 211 | .state-buttons { 212 | display:flex; 213 | flex-flow: row wrap; 214 | justify-content: space-between; 215 | } 216 | 217 | .state-button { 218 | background: #fff; 219 | border-style:none; 220 | box-sizing:border-box; 221 | box-shadow: 1px 1px 1px #d4d4d4; 222 | color: #898989; 223 | height: 168px; 224 | margin-top:16px; 225 | padding:16px; 226 | text-align: center; 227 | vertical-align: middle; 228 | width: 168px; 229 | } 230 | 231 | .state-button .scenario { 232 | display:block; 233 | text-align: center; 234 | margin-top: 5%; 235 | font-size: 30px; 236 | } 237 | 238 | .state-button .temp { 239 | display:block; 240 | font-size: 35px; 241 | font-weight: 600; 242 | text-align: center; 243 | margin-top: 8%; 244 | } 245 | 246 | .state-button.selected { 247 | font-weight: 700; 248 | } 249 | 250 | .page-footer { 251 | background: #00adef; /* Old browsers */ 252 | background: linear-gradient(to right, #00adef 0%, #fcfcfc 100%); /* W3C */ 253 | bottom: 0; 254 | height: 5px; 255 | position: absolute; 256 | width: 100%; 257 | } -------------------------------------------------------------------------------- /public/images/quby.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | image/svg+xml -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Thermostat API Demo 6 | 7 | 8 | 9 |
10 | Thermostat API Demo 11 | 12 | 15 |
16 | 19 |
20 |
21 |
22 |
--
23 |
24 |
25 | 26 | 27 | 28 |
29 |
30 |
Program
31 |
32 | 33 |
34 |
35 |
36 | 40 | 44 | 48 | 52 |
53 |
54 | 55 |
56 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /public/js/APIManager.js: -------------------------------------------------------------------------------- 1 | var APIManager = function () { 2 | var token, 3 | baseUrl = "//" + window.location.hostname, 4 | apiUrl = "https://api.toon.eu/toon/v3", 5 | self = this; 6 | 7 | self.loggedIn = false; 8 | self.agreements = null; 9 | 10 | self.login = (callback) => { 11 | $.getJSON(baseUrl + ":3001/login", (data) => { 12 | var obj = JSON.parse(data); 13 | if (obj.access_token !== null) { 14 | self.token = obj.access_token; 15 | 16 | //subsequent calls will be done with this authentication-token. 17 | $.ajaxSetup({ 18 | headers: {'Authorization': 'Bearer ' + self.token} 19 | }); 20 | self.loggedIn = true; 21 | } else { 22 | console.error("No access token, data : " + data); 23 | self.loggedIn = false; 24 | } 25 | if (callback) { 26 | callback(); 27 | } 28 | }); 29 | }; 30 | 31 | 32 | self.getAgreements = (cb) => { 33 | if (!self.loggedIn) { 34 | console.warn('You need to have a user-token to use this, try logging in first!'); 35 | return; 36 | } 37 | if (self.agreements) { 38 | cb(self.agreements); 39 | return; 40 | } 41 | 42 | $.ajax({ 43 | url: apiUrl + '/agreements', 44 | type: 'GET', 45 | dataType: 'json', 46 | success: (data) => { 47 | self.agreements = data; 48 | cb(data); 49 | }, 50 | error: (data) => { 51 | cb(null, data.responseText); 52 | } 53 | }); 54 | 55 | }; 56 | 57 | self.getStatus = (agremeentId, success, error) => { 58 | if (!self.loggedIn) { 59 | console.warn('You need to have a user-token to use this, try logging in first!'); 60 | return; 61 | } 62 | 63 | $.ajax({ 64 | url: apiUrl + '/' + agremeentId + '/status', 65 | type: 'GET', 66 | dataType: 'json', 67 | success: success, 68 | error: error 69 | }); 70 | 71 | }; 72 | 73 | self.getThermostat = (agreementId, success, error) => { 74 | if (!self.loggedIn) { 75 | console.warn('You need to have a user-token to use this, try logging in first!'); 76 | return; 77 | } 78 | 79 | $.ajax({ 80 | url: apiUrl + '/' + agreementId+ '/thermostat', 81 | type: 'GET', 82 | dataType: 'json', 83 | success: success, 84 | error: error 85 | }); 86 | }; 87 | 88 | self.setTemperature = (agreementId, setpoint) => { 89 | if (!self.loggedIn) { 90 | console.warn('You need to have a user-token to use this, try logging in first!'); 91 | return; 92 | } 93 | console.log('Setting Temperature to: ' + setpoint); 94 | 95 | self.getThermostat(agreementId, (currentState) => { 96 | currentState.currentSetpoint = setpoint; 97 | 98 | $.ajax({ 99 | url: apiUrl + '/' + agreementId + '/thermostat', 100 | type: 'PUT', 101 | dataType: 'text', 102 | contentType: 'application/json', 103 | data: JSON.stringify( 104 | currentState 105 | ), 106 | success: () => { 107 | console.log("New setpoint accepted by API"); 108 | }, 109 | error: (e) => { 110 | console.log("Error while updating setpoint : " + JSON.stringify(e, null, 4)); 111 | } 112 | }); 113 | }, (error) => { 114 | console.log(error); 115 | }); 116 | }; 117 | 118 | self.setProgram = (agreementId, enabled) => { 119 | if (enabled) { 120 | self.setDisplayToState(agreementId, -1, 1/*Program on*/); 121 | } else { 122 | self.setDisplayToState(agreementId, -1, 0/*Program off*/); 123 | } 124 | }; 125 | 126 | self.setDisplayToState = (agreementId, activeState, programState) => { 127 | console.log("setDisplayToState activeState: " + activeState + " programState: " + programState); 128 | if (!self.loggedIn) { 129 | console.warn('You need to have a user-token to use this, try logging in first!'); 130 | return; 131 | } 132 | 133 | self.getThermostat(agreementId, (currentState) => { 134 | currentState.activeState = activeState; 135 | currentState.programState = programState; 136 | 137 | $.ajax({ 138 | url: apiUrl + '/' + agreementId + '/thermostat', 139 | type: 'PUT', 140 | dataType: 'text', 141 | contentType: 'application/json', 142 | data: JSON.stringify(currentState), 143 | success: () => { 144 | console.log("New schemeState accepted by API"); 145 | }, 146 | error: (e) => { 147 | console.log("Error while updating scheme State : " + JSON.stringify(e, null, 4)); 148 | } 149 | }); 150 | }); 151 | }; 152 | }; 153 | -------------------------------------------------------------------------------- /public/js/script.js: -------------------------------------------------------------------------------- 1 | var api = new APIManager(); 2 | var temperatureInfo = null; 3 | var updater = null; 4 | var selectedAgreementId = null; 5 | 6 | if (!api.loggedIn) { 7 | $('.content').hide(); 8 | $('aside.actions').show(); 9 | } else { 10 | $('.content').show(); 11 | $('aside.actions').hide(); 12 | } 13 | 14 | $("[data-action=login]").on('click', login); 15 | $("[data-action=state]").on('click', 'button', changeState); 16 | $("[data-action=toggleProgram]").on('click', toggleProgram); 17 | $("[data-action=temperature]").on('click', temperatureChange); 18 | 19 | function login(event) { 20 | event.preventDefault(); 21 | api.login(() => { 22 | // It is possible to have more than one display per customer, if that is the case, we are showing the agreements 23 | // and the user has to pick one. (If not, just select the first one) 24 | api.getAgreements((agreements, error) => { 25 | if (error) { 26 | console.log(error); 27 | } else { 28 | console.log(agreements); 29 | switch (agreements.length) { 30 | case 0: 31 | console.error('There are no agreements registered for this user. Contact support'); 32 | break; 33 | case 1: 34 | selectAgreement(agreements[0].agreementId); 35 | break; 36 | default: 37 | showAgreements(agreements); 38 | } 39 | } 40 | }); 41 | 42 | }); 43 | } 44 | 45 | function showAgreements(agreements) { 46 | //This should display the agreements, and the user does the selection. 47 | console.log(agreements); 48 | } 49 | 50 | function selectAgreement(agreementId) { 51 | $('.content').show(); 52 | $('aside.actions').hide(); 53 | 54 | selectedAgreementId = agreementId; 55 | 56 | //Enable the interval-update! 57 | updater = new StatusUpdater(agreementId, statusParser); 58 | } 59 | 60 | function changeState(event) { 61 | event.preventDefault(); 62 | 63 | var button = $(event.currentTarget); 64 | var buttons = button.parent().find("button"); 65 | 66 | buttons.removeClass("selected"); 67 | button.addClass('selected'); 68 | 69 | updater.pause(() => { 70 | //send the call to the api 71 | api.setDisplayToState(selectedAgreementId, button.index(), 0); 72 | }); 73 | } 74 | 75 | function toggleProgram(event) { 76 | event.preventDefault(); 77 | 78 | var button = $(event.currentTarget); 79 | var state = button.hasClass('active'); 80 | 81 | $('.thermostat-program .switch').toggleClass('active'); 82 | 83 | updater.pause(() => { 84 | //send the call to the api 85 | api.setProgram(selectedAgreementId, !state); 86 | }); 87 | } 88 | 89 | function temperatureChange(event) { 90 | if ($(event.currentTarget).data('type') == "up") { 91 | temperatureInfo.currentSetpoint += 50; 92 | } else { 93 | temperatureInfo.currentSetpoint -= 50; 94 | } 95 | 96 | $('.temperature').html(formatTemperature(temperatureInfo.currentSetpoint)); 97 | 98 | updater.pause(() => { 99 | //send the call to the api 100 | api.setTemperature(selectedAgreementId, temperatureInfo.currentSetpoint); 101 | }); 102 | } 103 | 104 | function statusParser(update) { 105 | if (!update) { 106 | //nothing changed! 107 | return; 108 | } 109 | if (update.thermostatInfo) { 110 | temperatureEvent(update.thermostatInfo); 111 | } 112 | if (update.thermostatStates) { 113 | programEvent(update.thermostatStates); 114 | } 115 | } 116 | 117 | function temperatureEvent(info) { 118 | 119 | //Update the global variable, so we can use that when changing the temperature 120 | temperatureInfo = info; 121 | 122 | if (info.programState !== null && info.programState == "0" || info.programState == "8") { 123 | $('.thermostat-program .switch').removeClass('active'); 124 | } else { 125 | $('.thermostat-program .switch').addClass('active'); 126 | } 127 | 128 | var temp = formatTemperature(parseFloat(info.currentDisplayTemp)); 129 | var setpoint = formatTemperature(parseFloat(info.currentSetpoint)); 130 | 131 | if (info.currentDisplayTemp != info.currentSetpoint) { 132 | $('.set-temperature').html(formatTemperature(setpoint)); 133 | } 134 | if (info.activeState != -1) { 135 | $('.state-buttons .state-button:nth(' + info.activeState + ')').addClass('selected'); 136 | } else { 137 | $('.state-buttons .state-button:nth(' + info.activeState + ')').removeClass('selected'); 138 | } 139 | 140 | $('.temperature').html(temp); 141 | } 142 | 143 | function programEvent(states) { 144 | var programButtons = $('.state-buttons .state-button'); 145 | 146 | for (var i = 0; i < states.length; i++) { 147 | var tempString = formatTemperature(parseFloat(states[i].tempValue)); 148 | 149 | $(programButtons[i]).find('.temp').html(tempString); 150 | } 151 | } 152 | -------------------------------------------------------------------------------- /public/js/utils.js: -------------------------------------------------------------------------------- 1 | var api = new APIManager(); 2 | 3 | /** 4 | * The statusUpdater handles the logistics of doing continuous updates. 5 | * The display can get updates from other sources besides your app, for this we have a statuscall that needs to be called regularly. 6 | * When you do an update with the api, the response will be empty and you can see the result when it comes in with the updater 7 | * @param success 8 | * @constructor 9 | */ 10 | function StatusUpdater(agreementId, success) { 11 | this.updateInterval = 2000; 12 | this.pauseInterval = 1000; 13 | this.success = success; 14 | this.agreementId = agreementId; 15 | 16 | this.start(); 17 | } 18 | StatusUpdater.prototype = { 19 | start: () => { 20 | console.log('Started the status updater'); 21 | 22 | var self = this; 23 | 24 | this.updateTimer = setInterval(() => { 25 | api.getStatus(self.agreementId, self.success, self.statusError); 26 | }, this.updateInterval); 27 | }, 28 | stop: () => { 29 | console.log('Stopped the status updater'); 30 | clearInterval(this.updateTimer); 31 | }, 32 | pause: (pauseAction) => { 33 | var self = this; 34 | this.stop(); 35 | 36 | clearTimeout(this.pauseTimer); 37 | this.pauseTimer = setTimeout(() => { 38 | 39 | pauseAction(); 40 | 41 | //start the updater 42 | self.start(); 43 | }, this.pauseInterval); 44 | }, 45 | statusError: (error) => { 46 | if(error.status != 200) { 47 | console.error(error); 48 | } 49 | } 50 | }; 51 | 52 | function formatTemperature(temp) { 53 | if (temp / 100 > 1) { 54 | temp = temp / 100; 55 | } 56 | var tempStr = ""; 57 | if (temp % 1 == 0) 58 | tempStr += temp + ",0"; 59 | else 60 | tempStr += temp; 61 | tempStr = tempStr.replace(".", ","); 62 | tempStr += "°"; 63 | return tempStr; 64 | } 65 | --------------------------------------------------------------------------------