mirror of
https://github.com/Bubberstation/Bubberstation.git
synced 2026-08-26 14:39:58 +01:00
Fix some rendering bugs on IE8, fix fancy chrome vis
Also reorganize some NanoUI files
This commit is contained in:
Bjorn Neergaard
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -30,8 +30,8 @@ class @Window
|
||||
nanoui.winset "titlebar", 0
|
||||
nanoui.winset "can-resize", 0
|
||||
fancy = @fragment.queryAll ".fancy"
|
||||
fancy.forEach (element) ->
|
||||
element.style.display = 'inherit'
|
||||
fancy.forEach (chrome) ->
|
||||
chrome.classList.remove "fancy"
|
||||
|
||||
calcOffset: =>
|
||||
@xOriginal = window.screenLeft
|
||||
@@ -83,8 +83,8 @@ class @Window
|
||||
@xResize = event.screenX unless @xResize?
|
||||
@yResize = event.screenY unless @yResize?
|
||||
|
||||
x = Math.max(150, (event.screenX - @xResize) + window.innerWidth)
|
||||
y = Math.max(150, (event.screenY - @yResize) + window.innerHeight)
|
||||
x = Math.max(250, (event.screenX - @xResize) + window.innerWidth)
|
||||
y = Math.max(250, (event.screenY - @yResize) + window.innerHeight)
|
||||
@setSize x, y
|
||||
|
||||
@xResize = event.screenX
|
||||
|
||||
@@ -1,20 +1,6 @@
|
||||
@import "_config";
|
||||
|
||||
@import "_document";
|
||||
@import "_util";
|
||||
|
||||
@import "_interface";
|
||||
@import "_link";
|
||||
@import "_bar";
|
||||
|
||||
@import "_generic";
|
||||
@import "_nanotrasen";
|
||||
|
||||
|
||||
.fancy {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
div.loading {
|
||||
.noticeStripes;
|
||||
@@ -89,3 +75,7 @@ div.resize {
|
||||
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
|
||||
.fancy {
|
||||
.hidden;
|
||||
}
|
||||
+39
-36
@@ -1,36 +1,39 @@
|
||||
@import "_config";
|
||||
@import "_util";
|
||||
|
||||
|
||||
html {
|
||||
min-height: 100%;
|
||||
|
||||
cursor: default; // Reset the cursor.
|
||||
}
|
||||
|
||||
body {
|
||||
min-height: 100%;
|
||||
|
||||
font-family: @font;
|
||||
font-size: @fontsize;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: @fontsize + 6px;
|
||||
margin: 0;
|
||||
padding: 6px 0;
|
||||
}
|
||||
h2 {
|
||||
&:extend(h1);
|
||||
font-size: @fontsize + 4px;
|
||||
}
|
||||
h3 {
|
||||
&:extend(h1);
|
||||
font-size: @fontsize + 2px;
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: @rule;
|
||||
border: none;
|
||||
}
|
||||
@import "_config";
|
||||
@import "_util";
|
||||
|
||||
|
||||
html {
|
||||
min-height: 100%;
|
||||
|
||||
cursor: default; // Reset the cursor.
|
||||
}
|
||||
|
||||
body {
|
||||
min-height: 100%;
|
||||
height: 100%;
|
||||
|
||||
background-color: @background-end; // Fallback for old browsers.
|
||||
|
||||
font-family: @font;
|
||||
font-size: @fontsize;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: @fontsize + 6px;
|
||||
margin: 0;
|
||||
padding: 6px 0;
|
||||
}
|
||||
h2 {
|
||||
&:extend(h1);
|
||||
font-size: @fontsize + 4px;
|
||||
}
|
||||
h3 {
|
||||
&:extend(h1);
|
||||
font-size: @fontsize + 2px;
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: @rule;
|
||||
border: none;
|
||||
}
|
||||
|
||||
+57
-57
@@ -1,57 +1,57 @@
|
||||
@import "_config";
|
||||
|
||||
|
||||
// Colors
|
||||
.color(@color) { // Explort a given color as a class.
|
||||
&.@{color} {
|
||||
color: @@color;
|
||||
}
|
||||
}
|
||||
|
||||
.color(normal);
|
||||
.color(good);
|
||||
.color(average);
|
||||
.color(bad);
|
||||
.color(label);
|
||||
.color(highlight);
|
||||
.color(dark);
|
||||
|
||||
// Text Styles
|
||||
.bold { font-weight: bold; }
|
||||
.italic { font-style: italic; }
|
||||
.fontReset {
|
||||
color: @text;
|
||||
font-size: @fontsize;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// Fancy "Notice Me" Stripes
|
||||
.noticeStripes {
|
||||
background-color: @notice1; // Fallback for old browers.
|
||||
background-image: repeating-linear-gradient(
|
||||
-45deg,
|
||||
@notice1,
|
||||
@notice1 10px,
|
||||
@notice2 10px,
|
||||
@notice2 20px
|
||||
);
|
||||
}
|
||||
|
||||
// General Helpers
|
||||
.hidden { display: none; }
|
||||
|
||||
.clearBoth { clear: both; }
|
||||
.clearLeft { clear: left; }
|
||||
.clearRight { clear: right; }
|
||||
|
||||
.floatNone { float: none; }
|
||||
.floatLeft { float: left; }
|
||||
.floatRight { float: right; }
|
||||
|
||||
.alignTop { vertical-align: top; }
|
||||
.alignBottom { vertical-align: bottom; }
|
||||
.alignLeft { text-align: left; }
|
||||
.alignCenter { text-align: center; }
|
||||
.alignRight { text-align: right; }
|
||||
@import "_config";
|
||||
|
||||
|
||||
// Colors
|
||||
.color(@color) { // Explort a given color as a class.
|
||||
&.@{color} {
|
||||
color: @@color;
|
||||
}
|
||||
}
|
||||
|
||||
.color(normal);
|
||||
.color(good);
|
||||
.color(average);
|
||||
.color(bad);
|
||||
.color(label);
|
||||
.color(highlight);
|
||||
.color(dark);
|
||||
|
||||
// Text Styles
|
||||
.bold { font-weight: bold; }
|
||||
.italic { font-style: italic; }
|
||||
.fontReset {
|
||||
color: @text;
|
||||
font-size: @fontsize;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// Fancy "Notice Me" Stripes
|
||||
.noticeStripes {
|
||||
background-color: @notice1; // Fallback for old browers.
|
||||
background-image: repeating-linear-gradient(
|
||||
-45deg,
|
||||
@notice1,
|
||||
@notice1 10px,
|
||||
@notice2 10px,
|
||||
@notice2 20px
|
||||
);
|
||||
}
|
||||
|
||||
// General Helpers
|
||||
.hidden { display: none !important; }
|
||||
|
||||
.clearBoth { clear: both; }
|
||||
.clearLeft { clear: left; }
|
||||
.clearRight { clear: right; }
|
||||
|
||||
.floatNone { float: none; }
|
||||
.floatLeft { float: left; }
|
||||
.floatRight { float: right; }
|
||||
|
||||
.alignTop { vertical-align: top; }
|
||||
.alignBottom { vertical-align: bottom; }
|
||||
.alignLeft { text-align: left; }
|
||||
.alignCenter { text-align: center; }
|
||||
.alignRight { text-align: right; }
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
@import "_config";
|
||||
|
||||
@import "_document";
|
||||
@import "_util";
|
||||
|
||||
@import "_chrome";
|
||||
@import "_section";
|
||||
@import "_link";
|
||||
@import "_bar";
|
||||
|
||||
@import "_generic";
|
||||
@import "_nanotrasen";
|
||||
@@ -1,14 +1,14 @@
|
||||
<div id='container' class='container'>
|
||||
<header id='titlebar' class='titlebar' unselectable='on'>
|
||||
<i class='statusicon fa fa-eye fa-2x' unselectable='on'></i>
|
||||
<span class='title' unselectable='on'>{{=config.title}}</span>
|
||||
<i class='minimize fancy fa fa-minus fa-2x' unselectable='on'></i>
|
||||
<i class='close fancy fa fa-close fa-2x' unselectable='on'></i>
|
||||
</header>
|
||||
|
||||
<div id='content' class='content titlebared resizeable' unselectable='on'>
|
||||
<div class='loading'>Initiating...</div>
|
||||
</div>
|
||||
|
||||
<div id='resize' class='resize fancy' unselectable='on'></div>
|
||||
</div>
|
||||
<div id='container' class='container'>
|
||||
<header id='titlebar' class='titlebar' unselectable='on'>
|
||||
<i class='statusicon fa fa-eye fa-2x' unselectable='on'></i>
|
||||
<span class='title' unselectable='on'>{{=config.title}}</span>
|
||||
<i class='minimize fa fa-minus fa-2x fancy' unselectable='on'></i>
|
||||
<i class='close fa fa-close fa-2x fancy' unselectable='on'></i>
|
||||
</header>
|
||||
|
||||
<div id='content' class='content titlebared resizeable' unselectable='on'>
|
||||
<div class='loading'>Initiating...</div>
|
||||
</div>
|
||||
|
||||
<div id='resize' class='resize fancy' unselectable='on'></div>
|
||||
</div>
|
||||
|
||||
+233
-233
@@ -1,233 +1,233 @@
|
||||
<article class="notice">
|
||||
{{? data.siliconUser}}
|
||||
<section>
|
||||
<span class="label">Interface Lock:</span>
|
||||
<div class="content">
|
||||
{{=helper.link('Engaged', 'lock', 'toggleaccess', null, data.locked ? 'selected' : null)}}
|
||||
{{=helper.link('Disengaged', 'unlock', 'toggleaccess', null, data.locked ? null : 'selected')}}
|
||||
</div>
|
||||
</section>
|
||||
{{??}}
|
||||
{{? data.locked}}
|
||||
<span>Swipe an ID card to unlock this interface.</span>
|
||||
{{??}}
|
||||
<span>Swipe an ID card to lock this interface.</span>
|
||||
{{?}}
|
||||
{{?}}
|
||||
</article>
|
||||
<article class="display">
|
||||
<header><h2>Air Status</h2></header>
|
||||
{{? data.environment_data}}
|
||||
{{~ data.environment_data:info:i}}
|
||||
<section>
|
||||
<span class="label">{{=info.name}}:</span>
|
||||
<div class="content">
|
||||
{{? info.danger_level == 2}}
|
||||
<span class="bad">
|
||||
{{?? info.danger_level == 1}}
|
||||
<span class="average">
|
||||
{{??}}
|
||||
<span class="good">
|
||||
{{?}}
|
||||
{{=helper.fixed(info.value, 2)}}{{=info.unit}}</span>
|
||||
</div>
|
||||
</section>
|
||||
{{~}}
|
||||
<section>
|
||||
<span class="label">Local Status:</span>
|
||||
<div class="content">
|
||||
{{? data.danger_level == 2}}
|
||||
<span class="bad bold">Danger (Internals Required)</span>
|
||||
{{?? data.danger_level == 1}}
|
||||
<span class="average bold">Caution</span>
|
||||
{{??}}
|
||||
<span class="good">Optimal</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Area Status:</span>
|
||||
<div class="content">
|
||||
{{? data.atmos_alarm}}
|
||||
<span class="bad bold">Atmosphere Alarm</span>
|
||||
{{?? data.fire_alarm}}
|
||||
<span class="bad bold">Fire Alarm</span>
|
||||
{{??}}
|
||||
<span class="good">Nominal</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
{{??}}
|
||||
<section>
|
||||
<span class="bad bold">Warning: Cannot obtain air sample for analysis.</span>
|
||||
</section>
|
||||
{{?}}
|
||||
{{? data.dangerous}}
|
||||
<hr />
|
||||
<section>
|
||||
<span class="bad bold">Warning: Safety measures offline. Device may exhibit abnormal behavior.</span>
|
||||
</section>
|
||||
{{?}}
|
||||
</article>
|
||||
{{? (!data.locked || data.siliconUser)}}
|
||||
{{? data.screen != 1}}
|
||||
{{=helper.link('Back', 'arrow-left', 'screen', {'screen': 1})}}
|
||||
{{?}}
|
||||
{{? data.screen == 1}}
|
||||
<article class="display">
|
||||
<header><h2>Air Controls</h2></header>
|
||||
<section class="button">
|
||||
{{? !data.atmos_alarm}}
|
||||
{{=helper.link('Area Atmospheric Alarm', 'hand-stop-o', 'alarm')}}
|
||||
{{??}}
|
||||
{{=helper.link('Area Atmospheric Alarm', 'close', 'reset', null, null, 'caution')}}
|
||||
{{?}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{? data.mode != 3}}
|
||||
{{=helper.link('Panic Siphon', 'exclamation', 'mode', {'mode': 3})}}
|
||||
{{??}}
|
||||
{{=helper.link('Panic Siphon', 'close', 'mode', {'mode': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Vent Controls', 'sign-out', 'screen', {'screen': 2})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Scrubber Controls', 'filter', 'screen', {'screen': 3})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Set Environmental Mode', 'cog', 'screen', {'screen': 4})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Set Alarm Threshold', 'bar-chart', 'screen', {'screen': 5})}}
|
||||
</section>
|
||||
</article>
|
||||
{{?? data.screen == 2}}
|
||||
{{~ data.vents:vent:i}}
|
||||
<article class="display">
|
||||
<header><h3>{{=vent.long_name}}</h3></header>
|
||||
<section>
|
||||
<span class="label">Power:</span>
|
||||
<div class="content">
|
||||
{{? vent.power}}
|
||||
{{=helper.link('On', 'power-off', 'adjust', {'id_tag': vent.id_tag, 'command': 'power', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Off', 'close', 'adjust', {'id_tag': vent.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Mode:</span>
|
||||
<div class="content">
|
||||
{{? vent.direction == "release"}}
|
||||
<span class="good">Pressurizing</span>
|
||||
{{??}}
|
||||
<span class="bad">Siphoning</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Pressure Checks:</span>
|
||||
<div class="content">
|
||||
{{=helper.link('Internal', 'sign-in', 'adjust', {'id_tag': vent.id_tag, 'command': 'incheck', 'val': vent.checks}, null, vent.incheck ? 'selected' : null)}}
|
||||
{{=helper.link('External', 'sign-out', 'adjust', {'id_tag': vent.id_tag, 'command': 'excheck', 'val': vent.checks}, null, vent.excheck ? 'selected' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Set Pressure:</span>
|
||||
<div class="content">
|
||||
{{=helper.link(helper.fixed(vent.external), 'pencil', 'adjust', {'id_tag': vent.id_tag, 'command': 'set_external_pressure'})}}
|
||||
{{=helper.link('Reset', 'refresh', 'adjust', {'id_tag': vent.id_tag, 'command': 'reset_external_pressure'}, vent.extdefault ? 'disabled' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
{{~}}
|
||||
{{? !data.vents.length}}
|
||||
<span class="bad">No vents connected.</span>
|
||||
{{?}}
|
||||
{{?? data.screen == 3}}
|
||||
{{~ data.scrubbers:scrubber:i}}
|
||||
<article class="display">
|
||||
<header><h3>{{=scrubber.long_name}}</h3></header>
|
||||
<section>
|
||||
<span class="label">Power:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.power}}
|
||||
{{=helper.link('On', 'power-off', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Off', 'close', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Mode:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.scrubbing}}
|
||||
{{=helper.link('Scrubbing', 'filter', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Siphoning', 'sign-in', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Range:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.widenet}}
|
||||
{{=helper.link('Extended', 'expand', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 0}, null, 'caution')}}
|
||||
{{??}}
|
||||
{{=helper.link('Normal', 'compress', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 1}, null, null)}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Filters:</span>
|
||||
<div class="content">
|
||||
{{=helper.link("CO2", scrubber.filter_co2 ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "co2_scrub", 'val': scrubber.filter_co2 ? 0 : 1}, null, scrubber.filter_co2 ? 'selected' : null)}}
|
||||
{{=helper.link("N2O", scrubber.filter_n2o ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "n2o_scrub", 'val': scrubber.filter_n2o ? 0 : 1}, null, scrubber.filter_n2o ? 'selected' : null)}}
|
||||
{{=helper.link("Plasma", scrubber.filter_toxins ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "tox_scrub", 'val': scrubber.filter_toxins ? 0 : 1}, null, scrubber.filter_toxins ? 'selected' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
{{~}}
|
||||
{{? !data.scrubbers.length}}
|
||||
<span class="bad">No scrubbers connected.</span>
|
||||
{{?}}
|
||||
{{?? data.screen == 4}}
|
||||
<article class="display">
|
||||
<header><h2>Environmental Modes</h2></header>
|
||||
{{~ data.modes:mode:i}}
|
||||
<section class="button">
|
||||
{{=helper.link(mode.name, mode.selected ? 'check-square-o' : 'square-o', 'mode', {'mode': mode.mode}, null, mode.selected ? (mode.danger ? 'danger' : 'selected') : null)}}
|
||||
</section>
|
||||
{{~}}
|
||||
</display>
|
||||
{{?? data.screen == 5}}
|
||||
<article class="display">
|
||||
<header><h2>Alarm Thresholds</h2></header>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th><span class="bad">min2</span></th>
|
||||
<th><span class="average">min1</span></th>
|
||||
<th><span class="average">max1</span></th>
|
||||
<th><span class="bad">max2</span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{~ data.thresholds:threshold:i}}
|
||||
<tr>
|
||||
<th>{{=threshold.name}}</th>
|
||||
{{~ threshold.settings:setting:j}}
|
||||
<td>
|
||||
{{=helper.link(setting.selected >= 0 ? helper.round(setting.selected*100)/100 : "Off", null, 'adjust', {'command': 'set_threshold', 'env': setting.env, 'var': setting.val})}}
|
||||
</td>
|
||||
{{~}}
|
||||
</tr>
|
||||
{{~}}
|
||||
</tbody>
|
||||
<table>
|
||||
</article>
|
||||
{{?}}
|
||||
{{?}}
|
||||
<article class="notice">
|
||||
{{? data.siliconUser}}
|
||||
<section>
|
||||
<span class="label">Interface Lock:</span>
|
||||
<div class="content">
|
||||
{{=helper.link('Engaged', 'lock', 'toggleaccess', null, data.locked ? 'selected' : null)}}
|
||||
{{=helper.link('Disengaged', 'unlock', 'toggleaccess', null, data.locked ? null : 'selected')}}
|
||||
</div>
|
||||
</section>
|
||||
{{??}}
|
||||
{{? data.locked}}
|
||||
<span>Swipe an ID card to unlock this interface.</span>
|
||||
{{??}}
|
||||
<span>Swipe an ID card to lock this interface.</span>
|
||||
{{?}}
|
||||
{{?}}
|
||||
</article>
|
||||
<article class="display">
|
||||
<header><h2>Air Status</h2></header>
|
||||
{{? data.environment_data}}
|
||||
{{~ data.environment_data:info:i}}
|
||||
<section>
|
||||
<span class="label">{{=info.name}}:</span>
|
||||
<div class="content">
|
||||
{{? info.danger_level == 2}}
|
||||
<span class="bad">
|
||||
{{?? info.danger_level == 1}}
|
||||
<span class="average">
|
||||
{{??}}
|
||||
<span class="good">
|
||||
{{?}}
|
||||
{{=helper.fixed(info.value, 2)}}{{=info.unit}}</span>
|
||||
</div>
|
||||
</section>
|
||||
{{~}}
|
||||
<section>
|
||||
<span class="label">Local Status:</span>
|
||||
<div class="content">
|
||||
{{? data.danger_level == 2}}
|
||||
<span class="bad bold">Danger (Internals Required)</span>
|
||||
{{?? data.danger_level == 1}}
|
||||
<span class="average bold">Caution</span>
|
||||
{{??}}
|
||||
<span class="good">Optimal</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Area Status:</span>
|
||||
<div class="content">
|
||||
{{? data.atmos_alarm}}
|
||||
<span class="bad bold">Atmosphere Alarm</span>
|
||||
{{?? data.fire_alarm}}
|
||||
<span class="bad bold">Fire Alarm</span>
|
||||
{{??}}
|
||||
<span class="good">Nominal</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
{{??}}
|
||||
<section>
|
||||
<span class="bad bold">Warning: Cannot obtain air sample for analysis.</span>
|
||||
</section>
|
||||
{{?}}
|
||||
{{? data.dangerous}}
|
||||
<hr />
|
||||
<section>
|
||||
<span class="bad bold">Warning: Safety measures offline. Device may exhibit abnormal behavior.</span>
|
||||
</section>
|
||||
{{?}}
|
||||
</article>
|
||||
{{? (!data.locked || data.siliconUser)}}
|
||||
{{? data.screen != 1}}
|
||||
{{=helper.link('Back', 'arrow-left', 'screen', {'screen': 1})}}
|
||||
{{?}}
|
||||
{{? data.screen == 1}}
|
||||
<article class="display">
|
||||
<header><h2>Air Controls</h2></header>
|
||||
<section class="button">
|
||||
{{? !data.atmos_alarm}}
|
||||
{{=helper.link('Area Atmospheric Alarm', 'hand-stop-o', 'alarm')}}
|
||||
{{??}}
|
||||
{{=helper.link('Area Atmospheric Alarm', 'close', 'reset', null, null, 'caution')}}
|
||||
{{?}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{? data.mode != 3}}
|
||||
{{=helper.link('Panic Siphon', 'exclamation', 'mode', {'mode': 3})}}
|
||||
{{??}}
|
||||
{{=helper.link('Panic Siphon', 'close', 'mode', {'mode': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Vent Controls', 'sign-out', 'screen', {'screen': 2})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Scrubber Controls', 'filter', 'screen', {'screen': 3})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Set Environmental Mode', 'cog', 'screen', {'screen': 4})}}
|
||||
</section>
|
||||
<section class="button">
|
||||
{{=helper.link('Set Alarm Threshold', 'bar-chart', 'screen', {'screen': 5})}}
|
||||
</section>
|
||||
</article>
|
||||
{{?? data.screen == 2}}
|
||||
{{~ data.vents:vent:i}}
|
||||
<article class="display">
|
||||
<header><h3>{{=vent.long_name}}</h3></header>
|
||||
<section>
|
||||
<span class="label">Power:</span>
|
||||
<div class="content">
|
||||
{{? vent.power}}
|
||||
{{=helper.link('On', 'power-off', 'adjust', {'id_tag': vent.id_tag, 'command': 'power', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Off', 'close', 'adjust', {'id_tag': vent.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Mode:</span>
|
||||
<div class="content">
|
||||
{{? vent.direction == "release"}}
|
||||
<span class="good">Pressurizing</span>
|
||||
{{??}}
|
||||
<span class="bad">Siphoning</span>
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Pressure Checks:</span>
|
||||
<div class="content">
|
||||
{{=helper.link('Internal', 'sign-in', 'adjust', {'id_tag': vent.id_tag, 'command': 'incheck', 'val': vent.checks}, null, vent.incheck ? 'selected' : null)}}
|
||||
{{=helper.link('External', 'sign-out', 'adjust', {'id_tag': vent.id_tag, 'command': 'excheck', 'val': vent.checks}, null, vent.excheck ? 'selected' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Set Pressure:</span>
|
||||
<div class="content">
|
||||
{{=helper.link(helper.fixed(vent.external), 'pencil', 'adjust', {'id_tag': vent.id_tag, 'command': 'set_external_pressure'})}}
|
||||
{{=helper.link('Reset', 'refresh', 'adjust', {'id_tag': vent.id_tag, 'command': 'reset_external_pressure'}, vent.extdefault ? 'disabled' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
{{~}}
|
||||
{{? !data.vents.length}}
|
||||
<span class="bad">No vents connected.</span>
|
||||
{{?}}
|
||||
{{?? data.screen == 3}}
|
||||
{{~ data.scrubbers:scrubber:i}}
|
||||
<article class="display">
|
||||
<header><h3>{{=scrubber.long_name}}</h3></header>
|
||||
<section>
|
||||
<span class="label">Power:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.power}}
|
||||
{{=helper.link('On', 'power-off', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Off', 'close', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Mode:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.scrubbing}}
|
||||
{{=helper.link('Scrubbing', 'filter', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 0}, null, null)}}
|
||||
{{??}}
|
||||
{{=helper.link('Siphoning', 'sign-in', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 1}, null, 'danger')}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Range:</span>
|
||||
<div class="content">
|
||||
{{? scrubber.widenet}}
|
||||
{{=helper.link('Extended', 'expand', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 0}, null, 'caution')}}
|
||||
{{??}}
|
||||
{{=helper.link('Normal', 'compress', 'adjust', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 1}, null, null)}}
|
||||
{{?}}
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<span class="label">Filters:</span>
|
||||
<div class="content">
|
||||
{{=helper.link("CO2", scrubber.filter_co2 ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "co2_scrub", 'val': scrubber.filter_co2 ? 0 : 1}, null, scrubber.filter_co2 ? 'selected' : null)}}
|
||||
{{=helper.link("N2O", scrubber.filter_n2o ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "n2o_scrub", 'val': scrubber.filter_n2o ? 0 : 1}, null, scrubber.filter_n2o ? 'selected' : null)}}
|
||||
{{=helper.link("Plasma", scrubber.filter_toxins ? 'check-square-o' : 'square-o', 'adjust', {'id_tag': scrubber.id_tag, 'command': "tox_scrub", 'val': scrubber.filter_toxins ? 0 : 1}, null, scrubber.filter_toxins ? 'selected' : null)}}
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
{{~}}
|
||||
{{? !data.scrubbers.length}}
|
||||
<span class="bad">No scrubbers connected.</span>
|
||||
{{?}}
|
||||
{{?? data.screen == 4}}
|
||||
<article class="display">
|
||||
<header><h2>Environmental Modes</h2></header>
|
||||
{{~ data.modes:mode:i}}
|
||||
<section class="button">
|
||||
{{=helper.link(mode.name, mode.selected ? 'check-square-o' : 'square-o', 'mode', {'mode': mode.mode}, null, mode.selected ? (mode.danger ? 'danger' : 'selected') : null)}}
|
||||
</section>
|
||||
{{~}}
|
||||
</article>
|
||||
{{?? data.screen == 5}}
|
||||
<article class="display">
|
||||
<header><h2>Alarm Thresholds</h2></header>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th><span class="bad">min2</span></th>
|
||||
<th><span class="average">min1</span></th>
|
||||
<th><span class="average">max1</span></th>
|
||||
<th><span class="bad">max2</span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{~ data.thresholds:threshold:i}}
|
||||
<tr>
|
||||
<th>{{=threshold.name}}</th>
|
||||
{{~ threshold.settings:setting:j}}
|
||||
<td>
|
||||
{{=helper.link(setting.selected >= 0 ? helper.round(setting.selected*100)/100 : "Off", null, 'adjust', {'command': 'set_threshold', 'env': setting.env, 'var': setting.val})}}
|
||||
</td>
|
||||
{{~}}
|
||||
</tr>
|
||||
{{~}}
|
||||
</tbody>
|
||||
<table>
|
||||
</article>
|
||||
{{?}}
|
||||
{{?}}
|
||||
|
||||
Reference in New Issue
Block a user