diff options
Diffstat (limited to 'src/index.html')
| -rw-r--r-- | src/index.html | 96 |
1 files changed, 65 insertions, 31 deletions
diff --git a/src/index.html b/src/index.html index 6f16a23..6ec2e60 100644 --- a/src/index.html +++ b/src/index.html @@ -28,46 +28,50 @@ <div class="container"> <a href="#" class="entry" onclick="window.show('datetime');"> <div class="icon"> - <span class="icon-time"></span> + <i class="fa fa-clock"></i> </div> <div class="label"> Date & Time </div> + <div class="control"> + </div> </a> <a href="#" class="entry"> <div class="icon"> - <span class="icon-bluetooth"></span> + <i class="fab fa-bluetooth-b"></i> </div> <div class="label" onclick="window.show('bluetooth');"> Bluetooth </div> <div id="BluetoothControl" class="control enabled" onclick="window.toggle_bluetooth();"> - <span class="icon-toggle_on"></span> - <span class="icon-toggle_off"></span> + <span class="fa fa-toggle-on on"></span> + <span class="fa fa-toggle-off off"></span> </div> </a> <a href="#" class="entry" onclick="window.show('wifi');"> <div class="icon"> - <span class="icon-wifi"></span> + <i class="fas fa-wifi"></i> </div> <div class="label"> Wifi </div> <div class="control"> - <span class="icon-toggle_off"></span> + <!-- <span class="fa fa-toggle-on on"></span> --> + <span class="fa fa-toggle-off off"></span> </div> </a> <a href="#" class="entry" onclick="window.show('wired');"> <div class="icon"> - <span class="icon-ethernet"></span> + <i class="fas fa-network-wired"></i> </div> <div class="label"> Wired </div> </a> <a href="#" class="entry" onclick="window.show('version');"> + <div class="icon"></div> <div class="icon"> - <span class="icon-speed"></span> + <i class="fas fa-tachometer-alt"></i> </div> <div class="label"> Version info @@ -78,7 +82,10 @@ <div class="secondary page hide" id="datetime"> <h1 class="header"> - Date & Time + <a href="#" class="backButton" onclick="window.hide('datetime')"> + <i class="fas fa-chevron-left"></i> + </a> + Date & Time </h1> <div class="entry"> <h2> @@ -90,59 +97,86 @@ Time </h2> </div> - <a href="#" class="confirm button" onclick="window.hide('datetime')"> - Confirm - </a> </div> <div class="secondary page hide" id="bluetooth"> <h1 class="header"> + <a href="#" class="backButton" onclick="window.hide('bluetooth')"> + <i class="fas fa-chevron-left"></i> + </a> Bluetooth </h1> <div id="BluetoothContainer" class="container"></div> + <div class="footer"> + <a href="#" filter="available" class="button active" onclick="window.setFilter_bluetooth(this)"> + Available + </a> + <a href="#" filter="paired" class="button" onclick="window.setFilter_bluetooth(this)"> + Paired + </a> + <a href="#" filter="connected" class="button" onclick="window.setFilter_bluetooth(this)"> + Connected + </a> + </div> <script id="bluetooth-device-template" type="x-tmpl-mustache"> - <a href="#" class="entry"> + <div class="entry" deviceId="{{device}}"> <div class="icon"> - <span class="icon-{{ properties.icon }}"></span> + <span class="fab fa-bluetooth"></span> </div> - <div class="label"> - {{ properties.name }} + <div class="label" onclick="window.manage_bluetooth('{{device}}', {{properties.paired}}, {{ properties.connected }})"> + <div class="title"> + {{ properties.name }} + </div> + <div class="subtitle"> + {{ properties.address }} + </div> </div> - <div class="control"> - <span class="icon-clear"></span> + <div class="control" onclick="window.remove_device_bluetooth('{{device}}')"> + <span class="fa fa-trash"></span> </div> - </a> + </div> </script> - <a href="#" class="confirm button" onclick="window.hide('bluetooth')"> - Confirm - </a> </div> <div class="secondary page hide" id="wifi"> <h1 class="header"> + <a href="#" class="backButton" onclick="window.hide('wifi')"> + <i class="fas fa-chevron-left"></i> + </a> Wifi </h1> - <a href="#" class="confirm button" onclick="window.hide('wifi')"> - Confirm - </a> + <div id="WifiContainer" class="container"></div> + <script id="wifi-device-template" type="x-tmpl-mustache"> + <a href="#" class="entry"> + <div class="icon"> + <span class="icon-wifi"></span> + </div> + <div class="label"> + {{ properties.name }} + </div> + <div class="control"> + <span class="icon-clear"></span> + </div> + </a> + </script> </div> <div class="secondary page hide" id="wired"> <h1 class="header"> + <a href="#" class="backButton" onclick="window.hide('wired')"> + <i class="fas fa-chevron-left"></i> + </a> Wired </h1> - <a href="#" class="confirm button" onclick="window.hide('wired')"> - Confirm - </a> </div> <div class="secondary page hide" id="version"> <h1 class="header"> + <a href="#" class="backButton" onclick="window.hide('version')"> + <i class="fas fa-chevron-left"></i> + </a> Version info </h1> - <a href="#" class="confirm button" onclick="window.hide('version')"> - Confirm - </a> </div> <div class="log" id="log"> |