UNPKG

obniz-cli

Version:

[日本語はこちら](./README-ja.md)

95 lines (85 loc) 2.91 kB
<html> <head> <link rel="stylesheet" href="bootstrap/4.0.0/css/bootstrap.min.css"> </head> <body> <div class="container-fluid"> <div class="row"> <div class="col-6"> <button id="flash" class="btn btn-primary" style="width:100%;height:80px;font-size:40px;" disabled>NO USB</button> </div> <div class="col-3"> <form class="form" id="versions_form" style="height:40px;"> <select class="form-control" id="versions" name="versions" style="height:40px;"> </select> <input id="license" type="checkbox" name="license" value="1" style="margin-top:10px">License </form> </div> <div class="col-3"> <button id="exit" class="btn btn-danger" style="width:100%;height:80px;font-size:20px;">EXIT</button> </div> </div> <div id="print" class="form-control" style="width:100%;height:50%;overflow-y: scroll;"></div> </div> </body> <script src="/socket.io/socket.io.js"></script> <script src="jquery-3.2.1.min.js"></script> <script> var socket = io.connect(); var version = null; socket.on("print", function(data){ const text = data.text; const options = data.options; let current = $('#print').html() || ''; if (options && options.clear) { current = ''; } if (options && options.type === 'error') { current += '<span style="color:red">'+text+'<span>'; }else if (options && options.type === 'success') { current += '<span style="color:green">'+text+'<span>'; } else { current += text; } $('#print').html(current); const pdom = document.getElementById('print'); pdom.scrollTop = pdom.scrollHeight; }); socket.on("version", function(v){ version = v; }) socket.on("devices", function(devices){ console.log(devices) const versionsSelection = $('#versions'); versionsSelection.html(); let html = `<option value="none">Device</option>` for (const device of devices) { html += `<option value="${device}">${device}(${version})</option>` } versionsSelection.html(html); }) socket.on("state_to", function(state){ if (state === 'normal') { $('#flash').text("Flash"); $('#flash').prop( "disabled", false ); } }) $("#flash").click(async ()=>{ $('#flash').text("Flashing...."); $('#flash').prop( "disabled", true ); const version = $("#versions option:selected").val(); if (version == 'none') { alert('Select a os'); return; } var license = $('#license').is(':checked'); socket.emit("flash", { version, license: license ? true :false }); }) $("#exit").click(async ()=>{ socket.emit("exit", {}); }) </script> </html>