diff options
| -rw-r--r-- | src/index.js | 3 | ||||
| -rw-r--r-- | src/js/app.js | 3 | ||||
| -rw-r--r-- | src/js/wifi.js | 51 | ||||
| -rw-r--r-- | src/templates/main.template.html | 2 | ||||
| -rw-r--r-- | src/templates/wifi.template.html | 35 |
5 files changed, 74 insertions, 20 deletions
diff --git a/src/index.js b/src/index.js index 00da226..879e10e 100644 --- a/src/index.js +++ b/src/index.js @@ -18,9 +18,12 @@ import { init } from './js/app'; import { api } from 'agl-js-api'; import * as bluetooth from './js/bluetooth'; +import * as wifi from './js/wifi'; /* CSS */ import './styles/app.scss'; +window.bluetooth = bluetooth; +window.wifi = wifi; api.init(); init(); diff --git a/src/js/app.js b/src/js/app.js index 458a5d4..fb7f77f 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -1,5 +1,5 @@ import * as bluetooth from './bluetooth'; -import { init as init_wifi } from './wifi'; +import * as wifi from './wifi'; import { load as load_template } from './templates'; import Mustache from 'mustache'; @@ -20,6 +20,7 @@ export function init() { Mustache.parse(template); show(); bluetooth.init(); + wifi.init(); }, function(error) { console.error('ERRROR loading main template', error); }); diff --git a/src/js/wifi.js b/src/js/wifi.js index 35e7235..d9f91d0 100644 --- a/src/js/wifi.js +++ b/src/js/wifi.js @@ -1,34 +1,49 @@ import { network } from 'agl-js-api'; import Mustache from 'mustache'; +import { load as load_template } from './templates'; +import * as app from './app'; var template; +var page = { + devices: [] +} +function render(){ + document.body.innerHTML = Mustache.render(template, page); +} function update_devices(devices) { - console.log('update_devices', devices); - var deviceList = document.getElementById('WifiContainer'); - deviceList.innerHTML = ''; - + page.devices = []; devices.forEach(function(device) { if( device.properties.type === 'wifi' ) { - deviceList.innerHTML += Mustache.render(template, device); + page.devices.push(device); } }); + + console.log(page); + + render(); +} + +function refresh_devices() { + network.services().then(function(result) { + update_devices(result.values); + }); } export function init() { - template = document.getElementById('wifi-device-template').innerHTML; - Mustache.parse(template); - - setInterval(function() { - network.services().then(function(result) { - update_devices(result.values); - }) - }, 10000); - - network.on_global_state(function(result) { - console.log('on_global_state', result); - }).then(function(){ - console.log('SUBSCRIBED', 'on_global_state'); + load_template('wifi.template.html').then(function(result) { + template = result; + Mustache.parse(template); + }, function(error) { + console.error('ERROR Loading bluetooth template', error); }); +} + +export function show() { + refresh_devices(); +} + +export function hide() { + app.show(); }
\ No newline at end of file diff --git a/src/templates/main.template.html b/src/templates/main.template.html index 6965b5a..e37c935 100644 --- a/src/templates/main.template.html +++ b/src/templates/main.template.html @@ -33,7 +33,7 @@ <div class="col-1"> <i class="fas fa-wifi"></i> </div> - <div class="col-9"> + <div class="col-9" onclick="window.wifi.show()"> Wifi </div> <div class="col-2 text-right"> diff --git a/src/templates/wifi.template.html b/src/templates/wifi.template.html new file mode 100644 index 0000000..a2203c3 --- /dev/null +++ b/src/templates/wifi.template.html @@ -0,0 +1,35 @@ +<div class="container"> + <h2 class="my-5"> + <div class="row"> + <div class="col-1" onclick="wifi.hide()"> + <i class="fas fa-chevron-left"></i> + </div> + <div class="col-10"> + Wifi + </div> + <div class="col-1" onclick="wifi.show()"> + <i class="fas fa-sync"></i> + </div> + </div> + </h2> + <div class="list-group scrollable"> + {{ #devices }} + <div class="row border-bottom py-3 list-group-action"> + <div class="col-1"> + <i class="fas fa-wifi"></i> + </div> + <div class="col-9"> + <div> + {{ properties.name }} + </div> + <div class="badge badge-secondary"> + {{ properties.ethernet.address}} + </div> + </div> + <div class="col-2 text-right"> + {{ properties.strength }}% + </div> + </div> + {{ /devices }} + </div> + </div>
\ No newline at end of file |