mirror of
https://github.com/bckelley/cgm-remote-monitor.git
synced 2026-08-24 03:14:12 -05:00
ireneusz-ptakandGitHub
3d6f488eda
* Configurable clock views * Configurable clock views * Configurable clock views * Configurable clock views * Configurable clock views * Configurable clock views * Update README.md * Update README.md * Configurable clock views
65 lines
3.7 KiB
HTML
65 lines
3.7 KiB
HTML
<div id="config-form">
|
|
<h2>Clock view configurator</h2>
|
|
<form action="#">
|
|
<p>
|
|
<label for="bgcolor">Background type</label>
|
|
<select name="bgcolor" id="bgcolor">
|
|
<option value="c" selected="selected">Color</option>
|
|
<option value="b">Black</option>
|
|
</select>
|
|
</p>
|
|
<p>
|
|
<label for="sgage">Show SGV age</label>
|
|
<select name="sgage" id="sgage">
|
|
<option value="y" selected="selected">Always</option>
|
|
<option value="n">Only after threshold</option>
|
|
</select>
|
|
</p>
|
|
<p>SGV age threshold: <input type="number" class="threshold" id="threshold" name="threshold" min="1" max="99" value="10"> minutes</p>
|
|
<p><input type="button" class="elmt" id="cfg_nl" name="nl" value="Add line break"></p>
|
|
<p><input type="button" class="elmt" id="cfg_sg" name="sg" value="Add SGV"> Size: <input type="number" class="size" id="cfg_sg_size" name="cfg_sg_size" min="1" max="99" value="40"></p>
|
|
<p><input type="button" class="elmt" id="cfg_ag" name="ag" value="Add SGV age"> Size: <input type="number" class="size" id="cfg_ag_size" name="cfg_ag_size" min="1" max="99" value="6"></p>
|
|
<p><input type="button" class="elmt" id="cfg_dt" name="dt" value="Add SGV delta"> Size: <input type="number" class="size" id="cfg_dt_size" name="cfg_dt_size" min="1" max="99" value="14"></p>
|
|
<p><input type="button" class="elmt" id="cfg_ar" name="ar" value="Add trend arrow"> Size: <input type="number" class="size" id="cfg_ar_size" name="cfg_ar_size" min="1" max="99" value="30"></p>
|
|
<p><input type="button" class="elmt" id="cfg_tm" name="tm" value="Add time"> Size: <input type="number" class="size" id="cfg_tm_size" name="cfg_tm_size" min="1" max="99" value="10"></p>
|
|
<p><input type="button" class="undo" id="cfg_undo" name="undo" value="Remove last element"></p>
|
|
<a id="clocklink" target=”_blank” href="/clock/cy10">Open my clock view!</a>
|
|
<div id="facename">cy10</div>
|
|
</form>
|
|
</div>
|
|
<script type="text/javascript">
|
|
$( function() {
|
|
$( "input.elmt" ).click( function() {
|
|
let size = $("input#" + this.id + "_size").val();
|
|
let append = '-' + this.name + (size ? size : '');
|
|
let $facename = $( "#facename" );
|
|
$facename.text($facename.text() + append);
|
|
$facename.change();
|
|
} );
|
|
$( "select#sgage" ).change( function() {
|
|
let $facename = $( "#facename" );
|
|
$facename.text($facename.text().substring(0, 1) + this.value + $facename.text().substring(2));
|
|
$facename.change();
|
|
} );
|
|
$( "input#threshold" ).change( function() {
|
|
let $facename = $( "#facename" );
|
|
$facename.text($facename.text().substring(0, 2) + (((this.value < 10) ? '0' : '') + this.value) + $facename.text().substring(4));
|
|
$facename.change();
|
|
} );
|
|
$( "select#bgcolor" ).change( function() {
|
|
let $facename = $( "#facename" );
|
|
$facename.text(this.value + $facename.text().substring(1));
|
|
$facename.change();
|
|
} );
|
|
$( "input.undo" ).click( function() {
|
|
let $facename = $( "#facename" );
|
|
$facename.text($facename.text().substring(0, $facename.text().lastIndexOf('-') < 0 ? $facename.text().length: $facename.text().lastIndexOf('-')));
|
|
$facename.change();
|
|
} );
|
|
$( "#facename" ).change(function() {
|
|
$( "#inner" ).attr('data-face-config', $(this).text());
|
|
$( "#clocklink" ).attr('href', ('/clock/' + $(this).text()));
|
|
window.Nightscout.client.query();
|
|
} );
|
|
} );
|
|
</script> |