|
|
@@ -1,441 +0,0 @@
|
|
|
-<!doctype html>
|
|
|
-
|
|
|
-<html lang="en">
|
|
|
-<head>
|
|
|
- <meta charset="utf-8">
|
|
|
-
|
|
|
- <title>MiLight Hub</title>
|
|
|
- <meta name="description" content="The HTML5 Herald">
|
|
|
- <meta name="author" content="SitePoint">
|
|
|
-
|
|
|
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
|
|
|
- <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet"/>
|
|
|
- <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.0/css/bootstrap-slider.min.css" rel="stylesheet"/>
|
|
|
- <link href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.4/css/selectize.bootstrap3.min.css" rel="stylesheet"/>
|
|
|
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
- <!--[if lt IE 9]>
|
|
|
- <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
|
|
|
- <![endif]-->
|
|
|
-</head>
|
|
|
-
|
|
|
-<body>
|
|
|
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
|
|
- <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
|
|
|
- <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
|
|
|
- <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.0/bootstrap-slider.min.js"></script>
|
|
|
- <script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.4/js/standalone/selectize.min.js"></script>
|
|
|
-
|
|
|
- <link rel="stylesheet" href="style.css" />
|
|
|
- <script src="bundle.js"></script>
|
|
|
-
|
|
|
- <div id="update-firmware-modal" class="modal fade" role="dialog">
|
|
|
- <div class="modal-dialog">
|
|
|
- <!-- Modal content-->
|
|
|
- <div class="modal-content">
|
|
|
- <div class="modal-header">
|
|
|
- <button type="button" class="close" data-dismiss="modal">×</button>
|
|
|
- <h2 class="modal-title">Update Firmware</h2>
|
|
|
- </div>
|
|
|
- <div class="modal-body">
|
|
|
- <div class="alert alert-warning">
|
|
|
- <p>
|
|
|
- Download firmware binaries from the
|
|
|
- <a href="https://github.com/sidoh/esp8266_milight_hub/releases">GitHub releases page</a>.
|
|
|
- Check for a new version by clicking on the "Check for Updates" button.
|
|
|
- </p>
|
|
|
-
|
|
|
- <p>
|
|
|
- <b>Make sure the binary you're uploading was compiled for your board!</b>
|
|
|
- Firmware with incompatible settings could prevent boots. If this happens,
|
|
|
- reflash the board with USB.
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <form action="/firmware" method="post" enctype="multipart/form-data">
|
|
|
- <input type="file" name="file"/>
|
|
|
- <p> </p>
|
|
|
- <input type="submit" name="submit" class="btn btn-success"/>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- <div class="modal-footer">
|
|
|
- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div id="updates-modal" class="modal fade" role="dialog">
|
|
|
- <div class="modal-dialog">
|
|
|
- <!-- Modal content-->
|
|
|
- <div class="modal-content">
|
|
|
- <div class="modal-header">
|
|
|
- <button type="button" class="close" data-dismiss="modal">×</button>
|
|
|
- <h2 class="modal-title">Update</h2>
|
|
|
- </div>
|
|
|
- <div class="modal-body">
|
|
|
- <div id="version-summary"></div>
|
|
|
-
|
|
|
- <hr />
|
|
|
-
|
|
|
- <h4>Current Version</h4>
|
|
|
- <div id="current-version"></div>
|
|
|
-
|
|
|
- <div id="latest-version">
|
|
|
- <h4>Latest Version</h4>
|
|
|
- <div class="status"></div>
|
|
|
- <div id="latest-version-info">
|
|
|
- <label>Version</label>
|
|
|
- <div class="info-key" data-key="tag_name"></div>
|
|
|
-
|
|
|
- <label>Release Date</label>
|
|
|
- <div class="info-key" data-key="published_at"></div>
|
|
|
-
|
|
|
- <label>Release Notes</label>
|
|
|
- <pre class="info-key" data-key="body"></pre>
|
|
|
-
|
|
|
- <div>
|
|
|
- <a class="info-key" data-prop="href" data-key="html_url">View on GitHub</a>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div>
|
|
|
- <a class="info-key" id="firmware-link">Download Firmware</a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="modal-footer">
|
|
|
- <a href="/download_update/web" class="btn btn-primary">Update Web UI</a>
|
|
|
- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div id="restore-settings-modal" class="modal fade" role="dialog">
|
|
|
- <div class="modal-dialog">
|
|
|
- <!-- Modal content-->
|
|
|
- <div class="modal-content">
|
|
|
- <div class="modal-header">
|
|
|
- <button type="button" class="close" data-dismiss="modal">×</button>
|
|
|
- <h2 class="modal-title">Restore Settings</h2>
|
|
|
- </div>
|
|
|
- <div class="modal-body">
|
|
|
- <form action="/settings" method="post" enctype="multipart/form-data">
|
|
|
- <input type="file" name="file"/>
|
|
|
- <p> </p>
|
|
|
- <input type="submit" name="submit" class="btn btn-success"/>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- <div class="modal-footer">
|
|
|
- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="container">
|
|
|
- <div class="row header-row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h1>
|
|
|
- Control Lights
|
|
|
- </h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-4">
|
|
|
- <label for="deviceId" id="device-id-label">
|
|
|
- Device Id
|
|
|
- <span class="error-info"></span>
|
|
|
- </label>
|
|
|
- <select id="deviceId" placeholder="Enter hub ID">
|
|
|
- </select>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="col-sm-3">
|
|
|
- <div class="mode-option" id="group-option" data-for="cct,rgbw,rgb_cct">
|
|
|
- <label for="groupId">Group</label>
|
|
|
-
|
|
|
- <div class="btn-group" id="groupId" data-toggle="buttons">
|
|
|
- <label class="btn btn-secondary active">
|
|
|
- <input type="radio" name="options" autocomplete="off" data-value="1" checked> 1
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="options" autocomplete="off" data-value="2"> 2
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="options" autocomplete="off" data-value="3"> 3
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="options" autocomplete="off" data-value="4"> 4
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="options" autocomplete="off" data-value="0"> All
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="col-sm-4">
|
|
|
- <label for="groupId">Mode</label>
|
|
|
-
|
|
|
- <div class="btn-group" id="mode" data-toggle="buttons">
|
|
|
- <label class="btn btn-secondary active">
|
|
|
- <input type="radio" name="mode" autocomplete="off" data-value="rgbw" checked> RGBW
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="mode" autocomplete="off" data-value="cct"> CCT
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="mode" autocomplete="off" data-value="rgb_cct"> RGB+CCT
|
|
|
- </label>
|
|
|
- <label class="btn btn-secondary">
|
|
|
- <input type="radio" name="mode" autocomplete="off" data-value="rgb"> RGB
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row"><div class="col-sm-12">
|
|
|
- <div class="mode-option" data-for="rgbw,rgb_cct,rgb">
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h5>Hue</h5>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-6">
|
|
|
- <span class="hue-picker">
|
|
|
- <span class="hue-picker-inner"></span>
|
|
|
- <span class="hue-value-display"></span>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div></div>
|
|
|
-
|
|
|
- <div class="mode-option" data-for="rgb_cct">
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h5>Saturation</h5>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-6">
|
|
|
- <input class="slider raw-update" name="saturation"
|
|
|
- data-slider-min="0"
|
|
|
- data-slider-max="100"
|
|
|
- data-slider-value="100"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="mode-option" data-for="cct,rgb_cct">
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h5>Color Temperature</h5>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-6">
|
|
|
- <div class="white-temp-picker">
|
|
|
- <input class="slider raw-update" name="temperature"
|
|
|
- data-slider-min="0"
|
|
|
- data-slider-max="100"
|
|
|
- data-slider-value="100"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h5>Brightness</h5>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <input class="slider raw-update" name="level"
|
|
|
- data-slider-min="0"
|
|
|
- data-slider-max="100"
|
|
|
- data-slider-value="100"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h5>Commands</h5>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <ul class="command-buttons">
|
|
|
- <li>
|
|
|
- <input type="checkbox" name="status" class="raw-update" data-toggle="toggle" checked/>
|
|
|
- </li>
|
|
|
- <div class="mode-option inline" data-for="rgbw,rgb_cct">
|
|
|
- <li>
|
|
|
- <button type="button" class="btn btn-secondary command-btn" data-command="set_white">White</button>
|
|
|
- </li>
|
|
|
- </div>
|
|
|
- <li>
|
|
|
- <button type="button" class="btn btn-success command-btn" data-command="pair">
|
|
|
- <i class="glyphicon glyphicon-plus"></i>
|
|
|
- Pair
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <button type="button" class="btn btn-danger command-btn" data-command="unpair">
|
|
|
- <i class="glyphicon glyphicon-remove"></i>
|
|
|
- Unpair
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <p></p>
|
|
|
- <ul class="command-buttons">
|
|
|
- <div class="mode-option inline" data-for="rgb,rgbw,rgb_cct">
|
|
|
- <li>
|
|
|
- <div class="plus-minus-group">
|
|
|
- <button type="button" class="btn btn-default btn-number command-btn" data-command="previous_mode">
|
|
|
- <span class="glyphicon glyphicon-minus"></span>
|
|
|
- </button>
|
|
|
- <span class="title">Mode</span>
|
|
|
- <button type="button" class="btn btn-default btn-number command-btn clearfix" data-command="next_mode">
|
|
|
- <span class="glyphicon glyphicon-plus"></span>
|
|
|
- </button>
|
|
|
- <div class="clearfix"></div>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </div>
|
|
|
- <div class="mode-option inline" data-for="rgb,rgbw,rgb_cct">
|
|
|
- <li>
|
|
|
- <div class="plus-minus-group">
|
|
|
- <button type="button" class="btn btn-default btn-number command-btn" data-command="mode_speed_down">
|
|
|
- <span class="glyphicon glyphicon-minus"></span>
|
|
|
- </button>
|
|
|
- <span class="title">Speed</span>
|
|
|
- <button type="button" class="btn btn-default btn-number command-btn" data-command="mode_speed_up">
|
|
|
- <span class="glyphicon glyphicon-plus"></span>
|
|
|
- </button>
|
|
|
- <div class="clearfix"></div>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </div>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row header-row">
|
|
|
- <div class="col col-sm-10">
|
|
|
- <h1>Gateway Servers</h1>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="col col-sm-2">
|
|
|
- <button class="btn btn-success header-btn" id="add-server-btn">
|
|
|
- <i class="glyphicon glyphicon-plus"></i>
|
|
|
- Add Server
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col col-sm-12">
|
|
|
- <form id="gateway-server-form">
|
|
|
- <table class="table">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th>Device ID</th>
|
|
|
- <th>UDP Port</th>
|
|
|
- <th>Protocol Version</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody id="gateway-server-configs">
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- <input type="submit" class="btn btn-success" value="Save" />
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div class="row header-row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h1>Settings</h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <form action="#" id="settings">
|
|
|
- <input type="submit" class="btn btn-success" value="Submit" />
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row header-row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h1>Sniff Traffic</h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <button type="button" id="sniff" class="btn btn-primary">Start Sniffing</button>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div id="sniffed-traffic"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="row header-row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <h1>Admin</h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div> </div>
|
|
|
-
|
|
|
- <div class="row">
|
|
|
- <div class="col-sm-12">
|
|
|
- <button type="button" class="btn btn-danger system-btn" data-command="restart">
|
|
|
- Restart
|
|
|
- </button>
|
|
|
-
|
|
|
- <button type="button" class="btn btn-danger system-btn" data-command="clear_wifi_config">
|
|
|
- Clear Wifi Config
|
|
|
- </button>
|
|
|
-
|
|
|
- <button type="button" id="updates-btn" class="btn btn-primary">
|
|
|
- Check for Updates
|
|
|
- </button>
|
|
|
-
|
|
|
- <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#update-firmware-modal">
|
|
|
- Update Firmware
|
|
|
- </button>
|
|
|
-
|
|
|
- <a href="/settings" download="settings.json" class="btn btn-primary">Backup Settings</a>
|
|
|
-
|
|
|
- <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#restore-settings-modal">
|
|
|
- Restore Settings
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</body>
|
|
|
-</html>
|
Chris Mullins