diff --git a/code/ATMOSPHERICS/components/binary_devices/passive_gate.dm b/code/ATMOSPHERICS/components/binary_devices/passive_gate.dm index 86fe16ca1cf..1e155b5a554 100644 --- a/code/ATMOSPHERICS/components/binary_devices/passive_gate.dm +++ b/code/ATMOSPHERICS/components/binary_devices/passive_gate.dm @@ -100,7 +100,7 @@ Passive gate is similar to the regular pump except: /obj/machinery/atmospherics/components/binary/passive_gate/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "atmos_pump.dot", name, 400, 100) + ui = new(user, src, ui_key, "atmos_pump", name, 400, 100) ui.open() /obj/machinery/atmospherics/components/binary/passive_gate/get_ui_data() diff --git a/code/ATMOSPHERICS/components/binary_devices/pump.dm b/code/ATMOSPHERICS/components/binary_devices/pump.dm index 7032618d919..a2a31e3c7d2 100644 --- a/code/ATMOSPHERICS/components/binary_devices/pump.dm +++ b/code/ATMOSPHERICS/components/binary_devices/pump.dm @@ -108,7 +108,7 @@ Thus, the two variables affect pump operation are set in New(): /obj/machinery/atmospherics/components/binary/pump/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "atmos_pump.dot", name, 400, 100) + ui = new(user, src, ui_key, "atmos_pump", name, 400, 100) ui.open() /obj/machinery/atmospherics/components/binary/pump/get_ui_data() diff --git a/code/ATMOSPHERICS/components/binary_devices/volume_pump.dm b/code/ATMOSPHERICS/components/binary_devices/volume_pump.dm index a9b11200d58..0730b014472 100644 --- a/code/ATMOSPHERICS/components/binary_devices/volume_pump.dm +++ b/code/ATMOSPHERICS/components/binary_devices/volume_pump.dm @@ -105,7 +105,7 @@ Thus, the two variables affect pump operation are set in New(): /obj/machinery/atmospherics/components/binary/volume_pump/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "atmos_pump.dot", name, 400, 100) + ui = new(user, src, ui_key, "atmos_pump", name, 400, 100) ui.open() /obj/machinery/atmospherics/components/binary/volume_pump/get_ui_data() diff --git a/code/ATMOSPHERICS/components/trinary_devices/filter.dm b/code/ATMOSPHERICS/components/trinary_devices/filter.dm index 591ca7c7931..94fe581e844 100644 --- a/code/ATMOSPHERICS/components/trinary_devices/filter.dm +++ b/code/ATMOSPHERICS/components/trinary_devices/filter.dm @@ -172,7 +172,7 @@ Filter types: /obj/machinery/atmospherics/components/trinary/filter/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "atmos_filter.dot", name, 400, 120) + ui = new(user, src, ui_key, "atmos_filter", name, 400, 120) ui.open() /obj/machinery/atmospherics/components/trinary/filter/get_ui_data() diff --git a/code/ATMOSPHERICS/components/trinary_devices/mixer.dm b/code/ATMOSPHERICS/components/trinary_devices/mixer.dm index 28cadf48539..6e6bd0beb42 100644 --- a/code/ATMOSPHERICS/components/trinary_devices/mixer.dm +++ b/code/ATMOSPHERICS/components/trinary_devices/mixer.dm @@ -135,7 +135,7 @@ /obj/machinery/atmospherics/components/trinary/mixer/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "atmos_mixer.dot", name, 400, 145) + ui = new(user, src, ui_key, "atmos_mixer", name, 400, 145) ui.open() /obj/machinery/atmospherics/components/trinary/mixer/get_ui_data() diff --git a/code/ATMOSPHERICS/components/unary_devices/cryo.dm b/code/ATMOSPHERICS/components/unary_devices/cryo.dm index 9414f305397..0f84ae77e69 100644 --- a/code/ATMOSPHERICS/components/unary_devices/cryo.dm +++ b/code/ATMOSPHERICS/components/unary_devices/cryo.dm @@ -113,7 +113,7 @@ /obj/machinery/atmospherics/components/unary/cryo_cell/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "cryo.dot", name, 520, 560, state = notcontained_state) + ui = new(user, src, ui_key, "cryo", name, 520, 560, state = notcontained_state) ui.open() /obj/machinery/atmospherics/components/unary/cryo_cell/get_ui_data() diff --git a/code/controllers/subsystem/minimap.dm b/code/controllers/subsystem/minimap.dm index eb087f9d63f..daacc696c62 100644 --- a/code/controllers/subsystem/minimap.dm +++ b/code/controllers/subsystem/minimap.dm @@ -170,7 +170,7 @@ var/datum/subsystem/minimap/SSminimap text2file(hash, hash_path) /datum/subsystem/minimap/proc/getMinimapFile(zlevel) - return "data/minimaps/map_[zlevel]" + return "data/minimaps/[MAP_NAME]_[zlevel]" /datum/subsystem/minimap/proc/sendMinimaps(client/client) for (var/z = 1 to world.maxz) diff --git a/code/game/machinery/alarm.dm b/code/game/machinery/alarm.dm index 7ff29041ad9..bd128dc08a8 100644 --- a/code/game/machinery/alarm.dm +++ b/code/game/machinery/alarm.dm @@ -187,7 +187,7 @@ /obj/machinery/alarm/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "air_alarm.dot", name, 480, 625) + ui = new(user, src, ui_key, "air_alarm", name, 480, 625) ui.open() /obj/machinery/alarm/get_ui_data(mob/user) @@ -311,7 +311,8 @@ "excheck" = info["checks"]&1, "incheck" = info["checks"]&2, "direction" = info["direction"], - "external" = info["external"] + "external" = info["external"], + "default" = (info["external"] == ONE_ATMOSPHERE) )) if(AALARM_SCREEN_SCRUB) data["scrubbers"] = list() diff --git a/code/game/machinery/atmoalter/canister.dm b/code/game/machinery/atmoalter/canister.dm index 8b506bc1ef9..63b8ae8999d 100644 --- a/code/game/machinery/atmoalter/canister.dm +++ b/code/game/machinery/atmoalter/canister.dm @@ -277,7 +277,7 @@ update_flag /obj/machinery/portable_atmospherics/canister/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "canister.dot", name, 470, 400, state = physical_state) + ui = new(user, src, ui_key, "canister", name, 470, 400, state = physical_state) ui.open() /obj/machinery/portable_atmospherics/canister/get_ui_data() diff --git a/code/game/machinery/doors/airlock_electronics.dm b/code/game/machinery/doors/airlock_electronics.dm index c53f3e9fde7..15438ca24cf 100644 --- a/code/game/machinery/doors/airlock_electronics.dm +++ b/code/game/machinery/doors/airlock_electronics.dm @@ -16,7 +16,7 @@ /obj/item/weapon/electronics/airlock/ui_interact(mob/user, ui_key = "main", var/datum/nanoui/ui = null, force_open = 0) SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "airlock_electronics.dot", name, 975, 415, state = hands_state) + ui = new(user, src, ui_key, "airlock_electronics", name, 975, 415, state = hands_state) ui.open() /obj/item/weapon/electronics/airlock/get_ui_data() diff --git a/code/game/machinery/spaceheater.dm b/code/game/machinery/spaceheater.dm index ee2a8ae7ca0..9b55a6e3a66 100644 --- a/code/game/machinery/spaceheater.dm +++ b/code/game/machinery/spaceheater.dm @@ -159,7 +159,7 @@ /obj/machinery/space_heater/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "space_heater.dot", name, 490, 350, state = physical_state) + ui = new(user, src, ui_key, "space_heater", name, 490, 350, state = physical_state) ui.open() /obj/machinery/space_heater/Topic(href, href_list) diff --git a/code/game/objects/items/weapons/tanks/tanks.dm b/code/game/objects/items/weapons/tanks/tanks.dm index 279d6fcde71..3d2c97b2880 100644 --- a/code/game/objects/items/weapons/tanks/tanks.dm +++ b/code/game/objects/items/weapons/tanks/tanks.dm @@ -122,7 +122,7 @@ /obj/item/weapon/tank/ui_interact(mob/user, ui_key = "main", var/datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "tanks.dot", name, 525, 175, state = inventory_state) + ui = new(user, src, ui_key, "tanks", name, 525, 175, state = inventory_state) ui.open() /obj/item/weapon/tank/get_ui_data() diff --git a/code/modules/admin/verbs/debug.dm b/code/modules/admin/verbs/debug.dm index e6dd19001ae..1c5fe8a5c16 100644 --- a/code/modules/admin/verbs/debug.dm +++ b/code/modules/admin/verbs/debug.dm @@ -791,3 +791,6 @@ var/global/list/g_fancy_list_of_types = null // Clear the user's cache so they get resent. usr.client.cache = list() + + // Send the assets. + assets.send(usr.client) diff --git a/code/modules/client/asset_cache.dm b/code/modules/client/asset_cache.dm index 2ce122f85fd..81feb3a2954 100644 --- a/code/modules/client/asset_cache.dm +++ b/code/modules/client/asset_cache.dm @@ -227,6 +227,7 @@ You can set verify to TRUE if you want send() to sleep until the client has the /datum/asset/nanoui var/list/common = list() + var/list/uncommon = list() var/list/common_dirs = list( "nano/styles/", @@ -252,9 +253,12 @@ You can set verify to TRUE if you want send() to sleep until the client has the for(var/filename in filenames) if(copytext(filename, length(filename)) != "/") // Ignore directories. if(fexists(path + filename)) - register_asset(filename, fcopy_rsc(path + filename)) + uncommon[filename] = fcopy_rsc(path + filename) + register_asset(filename, uncommon[filename]) /datum/asset/nanoui/send(client, uncommon) + if(isnull(uncommon)) + uncommon = src.uncommon if(!islist(uncommon)) uncommon = list(uncommon) diff --git a/code/modules/nano/nanoui.dm b/code/modules/nano/nanoui.dm index b09bc9c21a1..04c350434bd 100644 --- a/code/modules/nano/nanoui.dm +++ b/code/modules/nano/nanoui.dm @@ -9,6 +9,10 @@ * modified by neersighted **/ +// Debug Things +#define USE_MIN 0 +#define USE_LESS 0 + /** * NanoUI datum: * @@ -93,13 +97,13 @@ * Add the assets required by all NanoUIs. **/ /datum/nanoui/proc/add_common_assets() - add_script("nanoui.js") - add_script("nanoui.util.js") - add_script("nanoui.template.js") - add_script("nanoui.helpers.js") - add_script("nanoui.handlers.js") + add_script("nanoui") + add_script("nanoui.util") + add_script("nanoui.template") + add_script("nanoui.helpers") + add_script("nanoui.handlers") - add_stylesheet("nanoui.css") + add_stylesheet("nanoui") /** * private @@ -209,13 +213,14 @@ /** * public * - * Add a stylesheet to the NanoUI. + * Add a template to the NanoUI. * This must be called before the NanoUI is opened. * - * required file string The path of the stylesheet file to add. + * required key string The key used to reference this file in the frontend. + * required file string The path of the template file to add. **/ -/datum/nanoui/proc/add_stylesheet(file) - stylesheets.Add(file) +/datum/nanoui/proc/add_template(key, file) + templates[key] = "[file].dot" /** * public @@ -226,25 +231,27 @@ * required file string The path of the script file to add. **/ /datum/nanoui/proc/add_script(file) - scripts.Add(file) + scripts.Add("[file].js") /** * public * - * Add a template to the NanoUI. + * Add a stylesheet to the NanoUI. * This must be called before the NanoUI is opened. * - * required key string The key used to reference this file in the frontend. - * required file string The path of the template file to add. + * required file string The path of the stylesheet file to add. **/ -/datum/nanoui/proc/add_template(key, filename) - templates[key] = filename +/datum/nanoui/proc/add_stylesheet(file) + if(USE_LESS) + stylesheets.Add("[file].less") + else + stylesheets.Add("[file].css") /** * public * * Set the layout for this NanoUI. - * This loads two files during get_html(): 'layout_[layout].dot' and 'layout_[layout].css'. + * This loads custom layout styles and templates for this NanoUI. * * required layout_key string The new layout key. **/ @@ -290,8 +297,18 @@ **/ /datum/nanoui/proc/get_html() // Add files based on the layout key. - add_template("layout", "layout_[layout].dot") - add_stylesheet("layout_[layout].css") + add_template("layout", "layout_[layout]") + add_stylesheet("layout_[layout]") + + // Some string hacks for .less/.min.js. + var/less = "" + var/less_html = "" + var/min = "" + if(USE_LESS) + less = "/less" + less_html = "" + if(USE_MIN) + min = "min." // Generate " var/stylesheet_html = "" for (var/stylesheet in stylesheets) - stylesheet_html += "" + stylesheet_html += "" // Generate template JSON. var/template_data_json = "{}" @@ -326,20 +343,21 @@ } }; + + + [stylesheet_html] - - - + + - - + + + [less_html] [script_html] - - - [stylesheet_html]
diff --git a/code/modules/power/apc.dm b/code/modules/power/apc.dm index bcb4b558dcd..46ecd8a01eb 100644 --- a/code/modules/power/apc.dm +++ b/code/modules/power/apc.dm @@ -631,7 +631,7 @@ /obj/machinery/power/apc/ui_interact(mob/user, ui_key = "main", var/datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "apc.dot", name, 550, 550) + ui = new(user, src, ui_key, "apc", name, 550, 550) ui.open() /obj/machinery/power/apc/get_ui_data(mob/user) diff --git a/code/modules/power/smes.dm b/code/modules/power/smes.dm index d3581a61e86..3aede467ab4 100644 --- a/code/modules/power/smes.dm +++ b/code/modules/power/smes.dm @@ -327,7 +327,7 @@ /obj/machinery/power/smes/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "smes.dot", name, 500, 400) + ui = new(user, src, ui_key, "smes", name, 500, 400) ui.open() /obj/machinery/power/smes/get_ui_data() diff --git a/code/modules/power/solar.dm b/code/modules/power/solar.dm index 3dac31c9d63..3b6da37e45b 100644 --- a/code/modules/power/solar.dm +++ b/code/modules/power/solar.dm @@ -372,7 +372,7 @@ /obj/machinery/power/solar_control/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "solar_control.dot", name, 490, 395) + ui = new(user, src, ui_key, "solar_control", name, 490, 395) ui.open() /obj/machinery/power/solar_control/get_ui_data() diff --git a/code/modules/reagents/chemistry/machinery/chem_dispenser.dm b/code/modules/reagents/chemistry/machinery/chem_dispenser.dm index 39dc2e8141b..d7fdbdb7130 100644 --- a/code/modules/reagents/chemistry/machinery/chem_dispenser.dm +++ b/code/modules/reagents/chemistry/machinery/chem_dispenser.dm @@ -87,7 +87,7 @@ /obj/machinery/chem_dispenser/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "chem_dispenser.dot", name, 500, 650) + ui = new(user, src, ui_key, "chem_dispenser", name, 500, 650) ui.open() /obj/machinery/chem_dispenser/get_ui_data() diff --git a/code/modules/reagents/chemistry/machinery/chem_heater.dm b/code/modules/reagents/chemistry/machinery/chem_heater.dm index acd35611055..111e7cfbab5 100644 --- a/code/modules/reagents/chemistry/machinery/chem_heater.dm +++ b/code/modules/reagents/chemistry/machinery/chem_heater.dm @@ -106,7 +106,7 @@ /obj/machinery/chem_heater/ui_interact(mob/user, ui_key = "main", datum/nanoui/ui = null, force_open = 0) ui = SSnano.try_update_ui(user, src, ui_key, ui, force_open = force_open) if (!ui) - ui = new(user, src, ui_key, "chem_heater.dot", name, 350, 400) + ui = new(user, src, ui_key, "chem_heater", name, 350, 400) ui.open() /obj/machinery/chem_heater/get_ui_data() diff --git a/nano/interfaces/air_alarm.dot b/nano/interfaces/air_alarm.dot index ed8edfaebe9..bdd2a8ceeef 100644 --- a/nano/interfaces/air_alarm.dot +++ b/nano/interfaces/air_alarm.dot @@ -1,248 +1,248 @@ -
- {{? data.siliconUser}} -
- Interface Lock: -
-
- {{:helper.link('Engaged', 'locked', {'toggleaccess': 1}, data.locked ? 'selected' : null)}} - {{:helper.link('Disengaged', 'unlocked', {'toggleaccess': 1}, data.locked ? null : 'selected')}} -
-
- {{??}} - {{? data.locked}} - Swipe an ID card to unlock this interface. - {{??}} - Swipe an ID card to lock this interface. - {{?}} - {{?}} -
-

Air Status

-
- {{? data.environment_data}} - {{~ data.environment_data :info:i}} -
-
- {{:info.name}}: -
-
- {{? info.danger_level == 2}} - - {{?? info.danger_level == 1}} - - {{??}} - - {{?}} - {{:helper.round(info.value*100)/100}}{{:info.unit}} -
-
- {{~}} -
-
- Local Status: -
-
- {{? data.danger_level == 2}} - Danger (Internals Required) - {{?? data.danger_level == 1}} - Caution - {{??}} - Optimal - {{?}} -
-
-
-
- Area Status: -
-
- {{? data.atmos_alarm}} - Atmosphere Alarm - {{?? data.fire_alarm}} - Fire Alarm - {{??}} - Nominal - {{?}} -
-
- {{??}} -
Warning: Cannot obtain air sample for analysis.
- {{?}} - {{? data.dangerous}} -
-
Warning: Safety measures offline. Device may exhibit abnormal behavior.
- {{?}} -
-{{? (!data.locked || data.siliconUser)}} - {{? data.screen != 1}} -
{{:helper.link('Back', 'triangle-1-w', {'screen': 1})}}
- {{?}} - {{? data.screen == 1}} -

Air Controls

-
-
- {{? !data.atmos_alarm}} - {{:helper.link('Area Atmospheric Alarm', 'power', {'atmos_alarm': 1}, null, null)}} - {{??}} - {{:helper.link('Area Atmospheric Alarm', 'close', {'atmos_reset': 1}, null, 'yellowButton')}} - {{?}} -
-
- {{? data.mode == 3}} - {{:helper.link('Panic Siphon', 'close', {'mode': 1}, null, 'redButton')}} - {{??}} - {{:helper.link('Panic Siphon', 'power', {'mode': 3}, null, null)}} - {{?}} -
-
-
- {{:helper.link('Vent Controls', 'wrench', {'screen': 2})}} -
-
- {{:helper.link('Scrubber Controls', 'wrench', {'screen': 3})}} -
-
-
- {{:helper.link('Set Environmental Mode', 'pencil', {'screen': 4})}} -
-
- {{:helper.link('Set Alarm Threshold', 'pencil', {'screen': 5})}} -
-
- {{?? data.screen == 2}} -

Vent Controls

- {{~ data.vents :vent:i}} -

{{:vent.long_name}}

-
-
-
- Power: -
-
- {{? vent.power}} - {{:helper.link('On', 'power', {'id_tag': vent.id_tag, 'command': 'power', 'val': 0}, null, null)}} - {{??}} - {{:helper.link('Off', 'close', {'id_tag': vent.id_tag, 'command': 'power', 'val': 1}, null, 'redButton')}} - {{?}} -
-
-
-
- Mode: -
-
- {{? vent.direction == "sipho"}} - Siphoning - {{??}} - Pressurizing - {{?}} -
-
-
-
- Pressure Checks: -
-
- {{:helper.link('External', 'arrow-1-n', {'id_tag': vent.id_tag, 'command': 'excheck', 'val': vent.checks}, null, vent.excheck ? 'selected' : null)}} - {{:helper.link('Internal', 'arrow-1-s', {'id_tag': vent.id_tag, 'command': 'incheck', 'val': vent.checks}, null, vent.incheck ? 'selected' : null)}} -
-
-
-
- Set Pressure: -
-
- {{:helper.link(helper.round(vent.external*100)/100, 'pencil', {'id_tag': vent.id_tag, 'command': 'set_external_pressure'})}} - {{:helper.link('Reset', 'refresh', { 'id_tag': vent.id_tag, 'command': 'reset_external_pressure'})}} -
-
-
- {{~}} - {{? !data.vents.length}} - No vents connected. - {{?}} - {{?? data.screen == 3}} -

Scrubber Controls

- {{~ data.scrubbers :scrubber:i}} -

{{:scrubber.long_name}}

-
-
-
- Power: -
-
- {{? scrubber.power}} - {{:helper.link('On', 'power', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 0}, null, null)}} - {{??}} - {{:helper.link('Off', 'close', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 1}, null, 'redButton')}} - {{?}} -
-
-
-
- Mode: -
-
- {{? scrubber.scrubbing}} - {{:helper.link('Scrubbing', 'refresh', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 0}, null, null)}} - {{??}} - {{:helper.link('Siphoning', 'circle-close', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 1}, null, 'redButton')}} - {{?}} -
-
-
-
- Range: -
-
- {{? scrubber.widenet}} - {{:helper.link('Extended', 'zoomout', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 0}, null, 'yellowButton')}} - {{??}} - {{:helper.link('Normal', 'zoomin', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 1}, null, null)}} - {{?}} -
-
-
-
- Filters: -
-
- {{:helper.link("CO2", scrubber.filter_co2 ? 'check' : 'close', {'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' : 'close', {'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' : 'close', {'id_tag': scrubber.id_tag, 'command': "tox_scrub", 'val': scrubber.filter_toxins ? 0 : 1}, null, scrubber.filter_toxins ? 'selected' : null)}} -
-
-
- {{~}} - {{? !data.scrubbers.length}} - No scrubbers connected. - {{?}} - {{?? data.screen == 4}} -

Environmental Modes

-
- {{~ data.modes :mode:i}} -
- {{:helper.link(mode.name, mode.selected? 'check' : 'close', {'mode': mode.mode}, null, mode.selected ? (mode.danger ? 'redButton' : 'selected') : (mode.danger ? 'yellowButton' : null))}} -
- {{~}} -
- {{?? data.screen == 5}} -

Alarm Thresholds

-
- - - - - {{~ data.thresholds :threshold:i}} - - - {{~ threshold.settings :setting:j}} - - {{~}} - - {{~}} -
min2min1max1max2
{{:threshold.name}} - {{:helper.link(setting.selected >= 0 ? helper.round(setting.selected*100)/100 : "Off", null, {'command': 'set_threshold', 'env': setting.env, 'var': setting.val})}} -
- - {{?}} -{{?}} \ No newline at end of file +
+ {{? data.siliconUser}} +
+ Interface Lock: +
+
+ {{:helper.link('Engaged', 'locked', {'toggleaccess': 1}, data.locked ? 'selected' : null)}} + {{:helper.link('Disengaged', 'unlocked', {'toggleaccess': 1}, data.locked ? null : 'selected')}} +
+
+ {{??}} + {{? data.locked}} + Swipe an ID card to unlock this interface. + {{??}} + Swipe an ID card to lock this interface. + {{?}} + {{?}} +
+

Air Status

+
+ {{? data.environment_data}} + {{~ data.environment_data:info:i}} +
+
+ {{:info.name}}: +
+
+ {{? info.danger_level == 2}} + + {{?? info.danger_level == 1}} + + {{??}} + + {{?}} + {{:helper.fixed(info.value, 2)}}{{:info.unit}} +
+
+ {{~}} +
+
+ Local Status: +
+
+ {{? data.danger_level == 2}} + Danger (Internals Required) + {{?? data.danger_level == 1}} + Caution + {{??}} + Optimal + {{?}} +
+
+
+
+ Area Status: +
+
+ {{? data.atmos_alarm}} + Atmosphere Alarm + {{?? data.fire_alarm}} + Fire Alarm + {{??}} + Nominal + {{?}} +
+
+ {{??}} +
Warning: Cannot obtain air sample for analysis.
+ {{?}} + {{? data.dangerous}} +
+
Warning: Safety measures offline. Device may exhibit abnormal behavior.
+ {{?}} +
+{{? (!data.locked || data.siliconUser)}} + {{? data.screen != 1}} +
{{:helper.link('Back', 'arrow-left', {'screen': 1})}}
+ {{?}} + {{? data.screen == 1}} +

Air Controls

+
+
+ {{? !data.atmos_alarm}} + {{:helper.link('Area Atmospheric Alarm', 'hand-stop-o', {'atmos_alarm': 1})}} + {{??}} + {{:helper.link('Area Atmospheric Alarm', 'close', {'atmos_reset': 1}, null, 'caution')}} + {{?}} +
+
+ {{? data.mode != 3}} + {{:helper.link('Panic Siphon', 'exclamation', {'mode': 3})}} + {{??}} + {{:helper.link('Panic Siphon', 'close', {'mode': 1}, null, 'danger')}} + {{?}} +
+
+
+ {{:helper.link('Vent Controls', 'sign-out', {'screen': 2})}} +
+
+ {{:helper.link('Scrubber Controls', 'filter', {'screen': 3})}} +
+
+
+ {{:helper.link('Set Environmental Mode', 'cog', {'screen': 4})}} +
+
+ {{:helper.link('Set Alarm Threshold', 'bar-chart', {'screen': 5})}} +
+
+ {{?? data.screen == 2}} +

Vent Controls

+ {{~ data.vents:vent:i}} +

{{:vent.long_name}}

+
+
+
+ Power: +
+
+ {{? vent.power}} + {{:helper.link('On', 'power-off', {'id_tag': vent.id_tag, 'command': 'power', 'val': 0}, null, null)}} + {{??}} + {{:helper.link('Off', 'close', {'id_tag': vent.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}} + {{?}} +
+
+
+
+ Mode: +
+
+ {{? vent.direction == "sipho"}} + Siphoning + {{??}} + Pressurizing + {{?}} +
+
+
+
+ Pressure Checks: +
+
+ {{:helper.link('Internal', 'sign-in', {'id_tag': vent.id_tag, 'command': 'incheck', 'val': vent.checks}, null, vent.incheck ? 'selected' : null)}} + {{:helper.link('External', 'sign-out', {'id_tag': vent.id_tag, 'command': 'excheck', 'val': vent.checks}, null, vent.excheck ? 'selected' : null)}} +
+
+
+
+ Set Pressure: +
+
+ {{:helper.link(helper.fixed(vent.external), 'pencil', {'id_tag': vent.id_tag, 'command': 'set_external_pressure'})}} + {{:helper.link('Reset', 'refresh', { 'id_tag': vent.id_tag, 'command': 'reset_external_pressure'}, vent.default ? 'disabled' : null)}} +
+
+
+ {{~}} + {{? !data.vents.length}} + No vents connected. + {{?}} + {{?? data.screen == 3}} +

Scrubber Controls

+ {{~ data.scrubbers:scrubber:i}} +

{{:scrubber.long_name}}

+
+
+
+ Power: +
+
+ {{? scrubber.power}} + {{:helper.link('On', 'power-off', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 0}, null, null)}} + {{??}} + {{:helper.link('Off', 'close', {'id_tag': scrubber.id_tag, 'command': 'power', 'val': 1}, null, 'danger')}} + {{?}} +
+
+
+
+ Mode: +
+
+ {{? scrubber.scrubbing}} + {{:helper.link('Scrubbing', 'filter', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 0}, null, null)}} + {{??}} + {{:helper.link('Siphoning', 'sign-in', {'id_tag': scrubber.id_tag, 'command': 'scrubbing', 'val': 1}, null, 'danger')}} + {{?}} +
+
+
+
+ Range: +
+
+ {{? scrubber.widenet}} + {{:helper.link('Extended', 'expand', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 0}, null, 'caution')}} + {{??}} + {{:helper.link('Normal', 'compress', {'id_tag': scrubber.id_tag, 'command': 'widenet', 'val': 1}, null, null)}} + {{?}} +
+
+
+
+ Filters: +
+
+ {{:helper.link("CO2", scrubber.filter_co2 ? 'check-square-o' : 'square-o', {'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', {'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', {'id_tag': scrubber.id_tag, 'command': "tox_scrub", 'val': scrubber.filter_toxins ? 0 : 1}, null, scrubber.filter_toxins ? 'selected' : null)}} +
+
+
+ {{~}} + {{? !data.scrubbers.length}} + No scrubbers connected. + {{?}} + {{?? data.screen == 4}} +

Environmental Modes

+
+ {{~ data.modes:mode:i}} +
+ {{:helper.link(mode.name, mode.selected ? 'check-square-o' : 'square-o', {'mode': mode.mode}, null, mode.selected ? (mode.danger ? 'danger' : 'selected') : null)}} +
+ {{~}} +
+ {{?? data.screen == 5}} +

Alarm Thresholds

+
+
+ + + + {{~ data.thresholds:threshold:i}} + + + {{~ threshold.settings:setting:j}} + + {{~}} + + {{~}} +
min2min1max1max2
{{:threshold.name}} + {{:helper.link(setting.selected >= 0 ? helper.round(setting.selected*100)/100 : "Off", null, {'command': 'set_threshold', 'env': setting.env, 'var': setting.val})}} +
+ + {{?}} +{{?}} diff --git a/nano/interfaces/apc.dot b/nano/interfaces/apc.dot index 9fb4fb1fd52..55b587e9b63 100644 --- a/nano/interfaces/apc.dot +++ b/nano/interfaces/apc.dot @@ -54,10 +54,10 @@ Power Cell: {{? data.powerCellStatus != null}} -
+ {{:helper.bar(data.powerCellStatus, 0, 100, data.powerCellStatus >= 50 ? 'good' : data.powerCellStatus >= 25 ? 'average' : 'bad')}} +
{{:helper.round(data.powerCellStatus*10)/10}}% -
- {{:helper.displayBar(data.powerCellStatus, 0, 100, data.powerCellStatus >= 50 ? 'good' : data.powerCellStatus >= 25 ? 'average' : 'bad')}} +
{{??}}
Power cell removed. @@ -72,21 +72,21 @@
{{? data.locked && !data.siliconUser}} {{? data.chargeMode}} - Auto + Auto {{??}} - Off - {{?}} + Off + {{?}} {{??}} {{:helper.link('Auto', 'refresh', {'cmode' : 1}, data.chargeMode ? 'selected' : null)}} {{:helper.link('Off', 'close', {'cmode' : 1}, data.chargeMode ? null : 'selected')}} {{?}}   {{? data.chargingStatus > 1}} - [Fully Charged] + [Fully Charged] {{?? data.chargingStatus == 1}} - [Charging] + [Charging] {{??}} - [Not Charging] + [Not Charging] {{?}}
@@ -104,9 +104,9 @@
{{? channel.status <= 1}} - Off + Off {{?? channel.status >= 2}} - On + On {{?}}   {{? channel.status == 1 || channel.status == 3}} @@ -171,4 +171,4 @@ {{?}}
- \ No newline at end of file + diff --git a/nano/interfaces/canister.dot b/nano/interfaces/canister.dot index 03f79fa2e29..e35784bc508 100644 --- a/nano/interfaces/canister.dot +++ b/nano/interfaces/canister.dot @@ -2,7 +2,7 @@
The regulator is connected to a tank.
{{??}}
The regulator is not connected to a tank.
-{{?}} +{{?}}

Canister

{{:helper.link('Relabel', 'pencil', {'relabel' : 1}, data.canLabel ? null : 'disabled')}} @@ -33,7 +33,7 @@ Release Pressure:
- {{:helper.displayBar(data.releasePressure, data.minReleasePressure, data.maxReleasePressure)}} + {{:helper.bar(data.releasePressure, data.minReleasePressure, data.maxReleasePressure)}} {{:data.releasePressure}} kPa
@@ -47,8 +47,8 @@ {{:helper.link('Set', 'pencil', {'release_p': 'custom'}, null)}} {{:helper.link('Max', 'plus', {'release_p': 'max'}, (data.releasePressure < data.maxReleasePressure) ? null : 'disabled')}}
- {{:helper.link('Open', 'unlocked', {'toggle' : 1}, data.valveOpen ? 'selected' : null)}} - {{:helper.link('Close', 'locked', {'toggle' : 1}, data.valveOpen ? null : 'selected')}} + {{:helper.link('Open', 'unlock', {'toggle' : 1}, data.valveOpen ? 'selected' : null)}} + {{:helper.link('Close', 'lock', {'toggle' : 1}, data.valveOpen ? null : 'selected')}}

Holding Tank

diff --git a/nano/interfaces/chem_dispenser.dot b/nano/interfaces/chem_dispenser.dot index 0aac80cbe8e..c6ca42ea4f0 100644 --- a/nano/interfaces/chem_dispenser.dot +++ b/nano/interfaces/chem_dispenser.dot @@ -5,7 +5,7 @@ Energy:
- {{:helper.displayBar(data.energy, 0, data.maxEnergy, 'good')}} + {{:helper.bar(data.energy, 0, data.maxEnergy, 'good')}} {{:data.energy}} Units
@@ -61,4 +61,4 @@ {{?}} - \ No newline at end of file + diff --git a/nano/interfaces/cryo.dot b/nano/interfaces/cryo.dot index 3c0be8026b7..c817f536045 100644 --- a/nano/interfaces/cryo.dot +++ b/nano/interfaces/cryo.dot @@ -43,9 +43,9 @@
{{? data.occupant.health >= 0}} - {{:helper.displayBar(data.occupant.health, 0, data.occupant.maxHealth, 'good')}} + {{:helper.bar(data.occupant.health, 0, data.occupant.maxHealth, 'good')}} {{??}} - {{:helper.displayBar(data.occupant.health, 0, data.occupant.minHealth, 'average')}} + {{:helper.bar(data.occupant.health, 0, data.occupant.minHealth, 'average')}} {{?}} {{:helper.round(data.occupant.health)}}
@@ -55,7 +55,7 @@ Brute:
- {{:helper.displayBar(data.occupant.bruteLoss, 0, data.occupant.maxHealth, 'bad')}} + {{:helper.bar(data.occupant.bruteLoss, 0, data.occupant.maxHealth, 'bad')}} {{:helper.round(data.occupant.bruteLoss)}}
@@ -64,7 +64,7 @@ Respiratory:
- {{:helper.displayBar(data.occupant.oxyLoss, 0, data.occupant.maxHealth, 'bad')}} + {{:helper.bar(data.occupant.oxyLoss, 0, data.occupant.maxHealth, 'bad')}} {{:helper.round(data.occupant.oxyLoss)}}
@@ -73,7 +73,7 @@ Toxin:
- {{:helper.displayBar(data.occupant.toxLoss, 0, data.occupant.maxHealth, 'bad')}} + {{:helper.bar(data.occupant.toxLoss, 0, data.occupant.maxHealth, 'bad')}} {{:helper.round(data.occupant.toxLoss)}}
@@ -82,7 +82,7 @@ Burn:
- {{:helper.displayBar(data.occupant.fireLoss, 0, data.occupant.maxHealth, 'bad')}} + {{:helper.bar(data.occupant.fireLoss, 0, data.occupant.maxHealth, 'bad')}} {{:helper.round(data.occupant.fireLoss)}}
@@ -138,7 +138,7 @@ Contents:
- {{? data.isBeakerLoaded}} + {{? data.isBeakerLoaded}} {{? data.beakerContents.length}} {{~ data.beakerContents :reagent:i}} {{:reagent.volume}} units of {{:reagent.name}}
@@ -151,4 +151,4 @@ {{?}}
- \ No newline at end of file + diff --git a/nano/interfaces/smes.dot b/nano/interfaces/smes.dot index 83fc6bbe961..d2282d92ed7 100644 --- a/nano/interfaces/smes.dot +++ b/nano/interfaces/smes.dot @@ -5,7 +5,7 @@ Stored Energy:
- {{:helper.displayBar(data.capacityPercent, 0, 100, data.capacityPercent >= 50 ? 'good' : data.capacityPercent >= 15 ? 'average' : 'bad')}} + {{:helper.bar(data.capacityPercent, 0, 100, data.capacityPercent >= 50 ? 'good' : data.capacityPercent >= 15 ? 'average' : 'bad')}}
{{:helper.round(data.capacityPercent)}}%
@@ -36,14 +36,14 @@ Input Setting:
- {{:helper.displayBar(data.inputLevel, 0, data.inputLevelMax)}} + {{:helper.bar(data.inputLevel, 0, data.inputLevelMax)}}  {{:data.inputLevel}} W
- {{:helper.link('', 'seek-start', {'set_input_level': '0'}, data.inputLevel ? null : 'selected')}} - {{:helper.link('', 'triangle-1-w', {'set_input_level': 'minus'}, data.inputLevel ? null : 'disabled')}} + {{:helper.link('', 'fast-backward', {'set_input_level': '0'}, data.inputLevel ? null : 'selected')}} + {{:helper.link('', 'backward', {'set_input_level': 'minus'}, data.inputLevel ? null : 'disabled')}} {{:helper.link('Set', 'pencil', {'set_input_level': 'custom'}, null)}} - {{:helper.link('', 'triangle-1-e', {'set_input_level': 'plus'}, data.inputLevel == data.inputLevelMax ? 'disabled' : null)}} - {{:helper.link('', 'seek-end', {'set_input_level': 'max'}, data.inputLevel == data.inputLevelMax ? 'selected' : null)}} + {{:helper.link('', 'forward', {'set_input_level': 'plus'}, data.inputLevel == data.inputLevelMax ? 'disabled' : null)}} + {{:helper.link('', 'fast-forward', {'set_input_level': 'max'}, data.inputLevel == data.inputLevelMax ? 'selected' : null)}}
@@ -62,7 +62,7 @@ Charge Mode:
- {{:helper.link('On', 'power', {'output_attempt': 1}, data.outputAttempt ? 'selected' : null)}} + {{:helper.link('On', 'power-off', {'output_attempt': 1}, data.outputAttempt ? 'selected' : null)}} {{:helper.link('Off', 'close', {'output_attempt': 0}, data.outputAttempt ? null : 'selected')}}   {{? data.outputting}} @@ -79,14 +79,14 @@ Output Setting:
- {{:helper.displayBar(data.outputLevel, 0, data.outputLevelMax)}} + {{:helper.bar(data.outputLevel, 0, data.outputLevelMax)}}  {{:data.outputLevel}} W
- {{:helper.link('', 'seek-start', {'set_output_level': '0'}, data.outputLevel ? null : 'selected')}} - {{:helper.link('', 'triangle-1-w', {'set_output_level': 'minus'}, data.outputLevel ? null : 'disabled')}} + {{:helper.link('', 'fast-backward', {'set_output_level': '0'}, data.outputLevel ? null : 'selected')}} + {{:helper.link('', 'backward', {'set_output_level': 'minus'}, data.outputLevel ? null : 'disabled')}} {{:helper.link('Set', 'pencil', {'set_output_level': 'custom'}, null)}} - {{:helper.link('', 'triangle-1-e', {'set_output_level': 'plus'}, data.outputLevel == data.outputLevelMax ? 'disabled' : null)}} - {{:helper.link('', 'seek-end', {'set_output_level': 'max'}, data.outputLevel == data.outputLevelMax ? 'selected' : null)}} + {{:helper.link('', 'forward', {'set_output_level': 'plus'}, data.outputLevel == data.outputLevelMax ? 'disabled' : null)}} + {{:helper.link('', 'fast-forward', {'set_output_level': 'max'}, data.outputLevel == data.outputLevelMax ? 'selected' : null)}}
@@ -97,4 +97,4 @@ {{:data.outputUsed}} W
- \ No newline at end of file + diff --git a/nano/interfaces/space_heater.dot b/nano/interfaces/space_heater.dot index d2bfc7db60c..75472762c0c 100644 --- a/nano/interfaces/space_heater.dot +++ b/nano/interfaces/space_heater.dot @@ -15,7 +15,7 @@
{{? data.hasPowercell}} - {{:helper.displayBar(data.powerLevel, 0, 100, 'good')}} {{:data.powerLevel}}% + {{:helper.bar(data.powerLevel, 0, 100, 'good')}} {{:data.powerLevel}}% {{? data.open}}
{{:helper.link('Eject', 'eject', {'cellremove' : 1}, null)}} @@ -73,4 +73,4 @@ {{?}}
- \ No newline at end of file + diff --git a/nano/interfaces/tanks.dot b/nano/interfaces/tanks.dot index 3b9fb420e18..015cf0f43d0 100644 --- a/nano/interfaces/tanks.dot +++ b/nano/interfaces/tanks.dot @@ -2,13 +2,13 @@
The regulator is connected to a mask.
{{??}}
The regulator is not connected to a mask.
-{{?}} +{{?}}
Tank Pressure:
- {{:helper.displayBar(data.tankPressure, 0, 1013, (data.tankPressure > 200) ? 'good' : ((data.tankPressure > 100) ? 'average' : 'bad'))}} + {{:helper.bar(data.tankPressure, 0, 1013, (data.tankPressure > 200) ? 'good' : ((data.tankPressure > 100) ? 'average' : 'bad'))}} {{:data.tankPressure}} kPa
@@ -17,7 +17,7 @@ Release Pressure:
- {{:helper.displayBar(data.releasePressure, data.minReleasePressure, data.maxReleasePressure)}} + {{:helper.bar(data.releasePressure, data.minReleasePressure, data.maxReleasePressure)}} {{:data.releasePressure}} kPa
diff --git a/nano/layouts/layout_basic.css b/nano/layouts/layout_basic.css deleted file mode 100644 index 38184864ca2..00000000000 --- a/nano/layouts/layout_basic.css +++ /dev/null @@ -1,21 +0,0 @@ -body { - background: #272727 url(background.png) 50% 0 repeat-x; -} - -#content { - clear: both; - padding: 8px; -} - -#loading { - position: relative; - background: url(background_notice.jpg) 50% 50%; - color: #000000; - font-size: 14px; - font-style: italic; - font-weight: bold; - padding: 3px 4px 3px 4px; - margin: 4px 0 4px 0; -} - - diff --git a/nano/layouts/layout_basic.tmpl b/nano/layouts/layout_basic.dot similarity index 100% rename from nano/layouts/layout_basic.tmpl rename to nano/layouts/layout_basic.dot diff --git a/nano/layouts/layout_default.dot b/nano/layouts/layout_default.dot new file mode 100644 index 00000000000..484c9476d6b --- /dev/null +++ b/nano/layouts/layout_default.dot @@ -0,0 +1,9 @@ +
+
+
{{:config.title}}
+ +
+ +
+
Initiating...
+
diff --git a/nano/layouts/layout_default.tmpl b/nano/layouts/layout_default.tmpl deleted file mode 100644 index 43bb33a8d55..00000000000 --- a/nano/layouts/layout_default.tmpl +++ /dev/null @@ -1,9 +0,0 @@ -
-
-
{{:config.title}}
- -
- -
-
Initiating...
-
\ No newline at end of file diff --git a/nano/scripts/nanoui.handlers.js b/nano/scripts/nanoui.handlers.js index e8471e9565f..6cb2f8e5486 100644 --- a/nano/scripts/nanoui.handlers.js +++ b/nano/scripts/nanoui.handlers.js @@ -1,6 +1,3 @@ -/*jslint browser devel this*/ -/*global nanoui*/ - nanoui.handlers = (function (nanoui) { "use strict"; @@ -24,26 +21,19 @@ nanoui.handlers = (function (nanoui) { }; var updateLinks = function (data) { - var activeLinks = document.queryAll('.linkActive'); - var pendingLinks = document.queryAll('.linkPending'); + var links = document.queryAll('.link'); + var pendingLinks = document.queryAll('.link.pending'); - switch (data.config.status) { - case 2: - activeLinks.forEach(function (element) { - element.classList.remove('inactive'); + if (data.config.status === 2) { + links.forEach(function (element) { + element.removeAttribute('disabled'); }); pendingLinks.forEach(function (element) { - element.classList.remove('linkPending'); + element.classList.remove('pending'); }); - break; - case 1: - activeLinks.forEach(function (element) { - element.classList.add('inactive'); - }); - break; - default: - activeLinks.forEach(function (element) { - element.classList.add('inactive'); + } else { + links.forEach(function (element) { + element.setAttribute('disabled', 'true'); }); } }; @@ -55,14 +45,15 @@ nanoui.handlers = (function (nanoui) { var href = this.data('href'); if (href !== null) { if (data.config.status === 2) { - this.classList.add('linkPending'); + this.classList.remove('active'); + this.classList.add('pending'); } location.href = href; } }; - document.queryAll('.linkActive').forEach(function (element) { + document.queryAll('.link.active').forEach(function (element) { element.on('click', onClick); }); }; @@ -81,4 +72,4 @@ nanoui.handlers = (function (nanoui) { nanoui.on('error', error); return {}; -}(nanoui)); \ No newline at end of file +}(nanoui)); diff --git a/nano/scripts/nanoui.helpers.js b/nano/scripts/nanoui.helpers.js index 2100891ba6a..5bcb363be4b 100644 --- a/nano/scripts/nanoui.helpers.js +++ b/nano/scripts/nanoui.helpers.js @@ -1,32 +1,32 @@ -/*jslint browser devel this*/ -/*global nanoui*/ - nanoui.helpers = (function (nanoui) { "use strict"; var helpers = {}; helpers.link = function (text, icon, parameters, status, elementClass, elementId) { - var iconHtml = ""; - var iconClass = "noIcon"; - if (icon !== "undefined" && icon) { - iconHtml = ''; - iconClass = "hasIcon"; + var context = {}; + + context.text = text || ""; + context.icon = ""; + context.parameters = nanoui.util.href(parameters); + context.status = status || ""; + context.elementClass = elementClass || "normal"; + context.elementId = elementId || ""; + + if (nanoui.util.yes(icon)) { + context.icon = nanoui.util.format("", {icon: icon}); + context.elementClass += ' iconed'; } - if (elementClass === "undefined" || !elementClass) { - elementClass = "link"; + + if (nanoui.util.yes(status)) { + return nanoui.util.format("", context); } - var elementIdHtml = ""; - if (elementId !== "undefined" && elementId) { - elementIdHtml = 'id="' + elementId + '"'; - } - if (status !== "undefined" && status) { - return '
' + iconHtml + text + '
'; - } - return '
' + iconHtml + text + '
'; + return nanoui.util.format("", context); }; - helpers.displayBar = function (value, rangeMin, rangeMax, styleClass, showText) { + helpers.bar = function (value, rangeMin, rangeMax, styleClass, barText) { + var context = {}; + if (rangeMin < rangeMax) { if (value < rangeMin) { value = rangeMin; @@ -40,22 +40,21 @@ nanoui.helpers = (function (nanoui) { value = rangeMax; } } - if (styleClass === "undefined" || !styleClass) { - styleClass = ""; - } - if (showText === "undefined" || !showText) { - showText = ""; - } - var percentage = Math.round((value - rangeMin) / (rangeMax - rangeMin) * 100); - return '
' + showText + '
'; + + context.styleClass = styleClass || ""; + context.barText = barText || ""; + context.percentage = Math.round((value - rangeMin) / (rangeMax - rangeMin) * 100); + + return nanoui.util.format("
#{barText}
", context); }; helpers.round = function (number) { return Math.round(number); }; - helpers.fixed = function (number) { - return Math.round(number * 10) / 10; + helpers.fixed = function (number, decimals) { + if (nanoui.util.no(decimals)) { decimals = 1; } + return Number(Math.round(number + 'e'+decimals) + 'e-'+decimals); }; helpers.floor = function (number) { @@ -68,4 +67,4 @@ nanoui.helpers = (function (nanoui) { return helpers; -}(nanoui)); \ No newline at end of file +}(nanoui)); diff --git a/nano/scripts/nanoui.js b/nano/scripts/nanoui.js index 4ddfbf63218..50eee84ac8f 100644 --- a/nano/scripts/nanoui.js +++ b/nano/scripts/nanoui.js @@ -1,6 +1,3 @@ -/*jslint browser devel this*/ -/*global nanoui*/ - var nanoui = (function () { "use strict"; var nanoui = {}; @@ -18,7 +15,7 @@ var nanoui = (function () { if (!_initialized) { data = _initialData; } - + nanoui.emit('beforeRender', data); try { if (!_layoutRendered || data.config.autoUpdateLayout) { @@ -56,7 +53,7 @@ var nanoui = (function () { if (_initialized) { nanoui.emit('render', _data); } - + nanoui.emit('updateReceived'); }; @@ -94,4 +91,4 @@ var nanoui = (function () { nanoui.on('update', update); return nanoui; -}()); \ No newline at end of file +}()); diff --git a/nano/scripts/nanoui.template.js b/nano/scripts/nanoui.template.js index e04d2074b0a..1c98cda4389 100644 --- a/nano/scripts/nanoui.template.js +++ b/nano/scripts/nanoui.template.js @@ -1,6 +1,3 @@ -/*jslint browser devel this*/ -/*global nanoui*/ - nanoui.template = (function (nanoui, doT) { "use strict"; var template = {}; @@ -105,4 +102,4 @@ nanoui.template = (function (nanoui, doT) { nanoui.on('loaded', compile); return template; -}(nanoui, doT)); \ No newline at end of file +}(nanoui, doT)); diff --git a/nano/scripts/nanoui.util.js b/nano/scripts/nanoui.util.js index 3c921630748..85319e8012f 100644 --- a/nano/scripts/nanoui.util.js +++ b/nano/scripts/nanoui.util.js @@ -1,6 +1,3 @@ -/*jslint browser devel this*/ -/*global nanoui*/ - nanoui.util = (function (nanoui) { "use strict"; var util = {}; @@ -13,7 +10,7 @@ nanoui.util = (function (nanoui) { _urlParameters = JSON.parse(document.query('body').data('url-parameters')); if (_urlParameters === null) { nanoui.emit('error', "URL parameters did not load correctly."); - return; + return; } }; @@ -31,15 +28,29 @@ nanoui.util = (function (nanoui) { return first; }; - util.isFunction = function (func) { - return !!(func && func.call && func.apply); + util.format = function (str, obj) { + if (!obj) { + return str; + } + function getValue(str, context) { + var ix = str.lastIndexOf('()'); + if (ix > 0 && ix + '()'.length === str.length) { + return context[str.substring(0, ix)](); + } + return context[str]; + } + return str.replace(/#\{(.+?)\}/g, function (ignore, $1) { + var split = $1.split('.'), + tmp = getValue(split[0], obj), + i, + l; + for (i = 1, l = split.length; i < l; i++) { + tmp = getValue(split[i], tmp); + } + return tmp; + }); }; - util.hasKey = function (obj, key) { - return obj.hasOwnProperty(key); - } - - util.href = function (parameters) { var url = new Url("byond://"); @@ -48,8 +59,24 @@ nanoui.util = (function (nanoui) { return url; }; + util.isFunction = function (func) { + return !!(func && func.call && func.apply); + }; + + util.hasKey = function (obj, key) { + return obj.hasOwnProperty(key); + }; + + util.yes = function (arg) { + return !(arg === 'undefined' || !arg); + }; + + util.no = function (arg) { + return arg === 'undefined' || !arg; + }; + nanoui.on('earlyInit', init); return util; -}(nanoui)); \ No newline at end of file +}(nanoui)); diff --git a/nano/styles/layout_basic.css b/nano/styles/layout_basic.css new file mode 100644 index 00000000000..13a1bbdd54d --- /dev/null +++ b/nano/styles/layout_basic.css @@ -0,0 +1,7 @@ +body { + background: #272727 url(background.png) 50% 0 repeat-x; +} +#content { + clear: both; + padding: 8px; +} diff --git a/nano/styles/layout_basic.less b/nano/styles/layout_basic.less new file mode 100644 index 00000000000..59d97fdcb79 --- /dev/null +++ b/nano/styles/layout_basic.less @@ -0,0 +1,16 @@ +// out: layout_basic.css + +@import "nanoui.config.less"; + +body { + background: @background url(background.png) 50% 0 repeat-x; +} + +#content { + clear: both; + padding: 8px; +} + +#loading { + &:extend(.notice); +} diff --git a/nano/styles/layout_default.css b/nano/styles/layout_default.css new file mode 100644 index 00000000000..b2983ac8eef --- /dev/null +++ b/nano/styles/layout_default.css @@ -0,0 +1,32 @@ +body { + background: #272727 url(background_nanotrasen.png) 50% 0 repeat-x; +} +#title { + position: relative; + height: 30px; +} +#statusicon { + position: absolute; + top: 4px; + left: 12px; +} +#titletext { + position: absolute; + top: 6px; + left: 44px; + width: 66%; + overflow: hidden; + color: #E9C183; + font-size: 16px; +} +#titlelogo { + position: absolute; + top: 4px; + right: 12px; + width: 42px; + height: 24px; + background: url(logo_nanotrasen.png) 50% 50% no-repeat; +} +#content { + padding: 8px; +} diff --git a/nano/layouts/layout_default.css b/nano/styles/layout_default.less similarity index 50% rename from nano/layouts/layout_default.css rename to nano/styles/layout_default.less index a7633c3b942..23a16893433 100644 --- a/nano/layouts/layout_default.css +++ b/nano/styles/layout_default.less @@ -1,5 +1,9 @@ +// out: layout_default.css + +@import "nanoui.config.less"; + body { - background: #272727 url(background_nanotrasen.png) 50% 0 repeat-x; + background: @background url(background_nanotrasen.png) 50% 0 repeat-x; } #title { @@ -7,6 +11,12 @@ body { height: 30px; } +#statusicon { + position: absolute; + top: 4px; + left: 12px; +} + #titletext { position: absolute; top: 6px; @@ -17,43 +27,21 @@ body { font-size: 16px; } -#title.icon { - padding: 6px 8px 6px 42px; - background-position: 2px 50%; - background-repeat: no-repeat; -} - -#titleicon { +#titlelogo { position: absolute; top: 4px; right: 12px; + width: 42px; height: 24px; background: url(logo_nanotrasen.png) 50% 50% no-repeat; } -#statusicon { - position: absolute; - top: 4px; - left: 12px; - width: 24px; - height: 24px; -} - #content { - clear: both; padding: 8px; + &:extend(.clearBoth); } #loading { - position: relative; - background: url(background_notice.jpg) 50% 50%; - color: #000000; - font-size: 14px; - font-style: italic; - font-weight: bold; - padding: 3px 4px 3px 4px; - margin: 4px 0 4px 0; + &:extend(.notice); } - - diff --git a/nano/styles/nanoui.bar.less b/nano/styles/nanoui.bar.less new file mode 100644 index 00000000000..5700f362ac8 --- /dev/null +++ b/nano/styles/nanoui.bar.less @@ -0,0 +1,42 @@ +// main: nanoui.less + +@import "nanoui.config.less"; + +.bar { + position: relative; + width: 236px; + height: 16px; + border: 1px solid #666666; + float: left; + margin: 0 5px 0 0; + overflow: hidden; + background: black; + .barText { + position: absolute; + top: -2px; + left: 5px; + width: 100%; + height: 100%; + color: white; + font-weight: normal; + } + .barFill { + width: 0%; + height: 100%; + background: #40628a; + overflow: hidden; + float: left; + &.good { + background: #4f7529; + } + &.average { + background: #cd6500; + } + &.bad { + background: #ea0000; + } + &.highlight { + background: #8BA5C4; + } + } +} diff --git a/nano/styles/nanoui.base.less b/nano/styles/nanoui.base.less new file mode 100644 index 00000000000..37c6da1dd8a --- /dev/null +++ b/nano/styles/nanoui.base.less @@ -0,0 +1,52 @@ +// main: nanoui.less + +@import "nanoui.config.less"; + +body { + padding: 0; + margin: 0; + + font-family: @font; + font-size: @font-size; + line-height: 170%; + color: @text; + + background: @background; +} + +h1, h2, h3 { + margin: 0; + padding: 6px 0 6px 0; + clear: both; +} +h1 { font-size: @font-size + 6px; } +h2 { font-size: @font-size + 4px; } +h3 { font-size: @font-size + 2px; } + +hr { + background-color: @normal; + height: 1px; + border: none; +} + +ul { + padding: 4px 0 0 10px; + margin: 0; + list-style-type: none; + + li { + padding: 0 0 2px 0; + } +} + +noscript { + margin: 33% auto; + width: 50%; + height: 33%; + + background: #ffffff; + border: 2px solid #ff0000; + z-index: 9999; + padding: 0px 10px; + text-align: center; +} diff --git a/nano/styles/nanoui.components.less b/nano/styles/nanoui.components.less new file mode 100644 index 00000000000..f6bf48a346c --- /dev/null +++ b/nano/styles/nanoui.components.less @@ -0,0 +1,36 @@ +// main: nanoui.less + +@import "nanoui.config.less"; + +.notice { + padding: 2px 4px; + margin: 4px 0; + + color: @text-inverse; + background: url(background_notice.jpg) 50% 50%; + + &:extend(.bold); + &:extend(.italic); +} + +.noticePlaceholder { + &:extend(.notice); + color: @text; + background: none; +} + +.notice.icon { + padding: 2px 4px 0 20px; +} + +.notice img { + position: absolute; + top: 0; + left: 0; + width: 16px; + height: 16px; +} + +div.notice { + clear: both; +} diff --git a/nano/styles/nanoui.config.less b/nano/styles/nanoui.config.less new file mode 100644 index 00000000000..b08e4e32e2b --- /dev/null +++ b/nano/styles/nanoui.config.less @@ -0,0 +1,35 @@ +// main: nanoui.less + +// Fonts +@font: Verdana, Geneva, sans-serif; +@font-size: 12px; + +// Global Colors +@normal: #40628a; +@good: #4f7529; +@average: #cd6500; +@bad: #ee0000; +@label: #e9C183; +@highlight: #8ba5c4; +@dark: #272727; + +// Body Colors +@title: @label; +@text: white; +@text-inverse: black; +@background: @dark; + +// Component Colors +@border: @normal; + +// Link Colors +@selected: #2f943c; +@caution: #adaf00; +@danger: #ea0000; +@disabled: #999999; + +@link-border: #111010; +@link-border-dark: darken(@link-border, 10%); + +@hover: 10%; +@pending: 10%; diff --git a/nano/styles/nanoui.css b/nano/styles/nanoui.css index dd8a607a310..b2ca2892670 100644 --- a/nano/styles/nanoui.css +++ b/nano/styles/nanoui.css @@ -1,492 +1,397 @@ -.fa { - float: left; - width: 16px; - height: 16px; - margin: 4px 2px 0 2px; -} - -.pendingIcon { - display: none; -} - -.linkPending .fa { - display: none; -} - -.linkPending .pendingIcon { - display: block; -} - - -#statusicon { - width: 24px; - height: 24px; - background-image: url(statusicon.png); - background-repeat: no-repeat; -} - -#statusicon.good -{ - background-position: 0 0; -} - -#statusicon.average -{ - background-position: 0 -24px; -} - -#statusicon.bad -{ - background-position: 0 -48px; -} - - body { - padding: 0; - margin: 0; - font-size: 12px; - color: #ffffff; - line-height: 170%; - font-family: Verdana, Geneva, sans-serif; - background: #272727; + padding: 0; + margin: 0; + font-family: Verdana, Geneva, sans-serif; + font-size: 12px; + line-height: 170%; + color: white; + background: #272727; } - -#noscript { - margin: 33% auto; - width: 50%; - height: 33%; - background: #ffffff; - border: 2px solid #ff0000; - color: #000000; - font-size: 10px; - font-weight: bold; - z-index: 9999; - padding: 0px 10px; - text-align: center; -} - -#noscript h1 { - color: #000000; -} - -hr { - background-color: #40628a; - height: 1px; - border: none; -} - -.link, .linkOn, .linkOff, .selected, .disabled, .yellowButton, .redButton { - float: left; - min-width: 15px; - height: 16px; - text-align: center; - color: #ffffff; - text-decoration: none; - background: #40628a; - border: 1px solid #161616; - padding: 0px 4px 4px 4px; - margin: 0 2px 2px 0; - cursor: default; - white-space: nowrap; - display: inline-block; -} - -.hasIcon { - padding: 0px 4px 4px 0px; -} - -a:hover, .zoomLink:hover, .linkActive:hover { - background: #507aac; -} - -.linkPending, .linkPending:hover { - color: #ffffff; - background: #507aac; -} - -a.white, a.white:link, a.white:visited, a.white:active { - color: #40628a; - text-decoration: none; - background: #ffffff; - border: 1px solid #161616; - padding: 1px 4px 1px 4px; - margin: 0 2px 0 0; - cursor: default; -} - -a.white:hover { - color: #ffffff; - background: #40628a; -} - -.hidden { - display: none; -} - -.linkOn, a.linkOn:link, a.linkOn:visited, a.linkOn:active, a.linkOn:hover, .selected, a.selected:link, a.selected:visited, a.selected:active, a.selected:hover { - color: #ffffff; - background: #2f943c; -} - -.linkOff, a.linkOff:link, a.linkOff:visited, a.linkOff:active, a.linkOff:hover, .disabled, a.disabled:link, a.disabled:visited, a.disabled:active, a.disabled:hover { - color: #ffffff; - background: #999999; - border-color: #666666; -} - -a.icon, .linkOn.icon, .linkOff.icon, .selected.icon, .disabled.icon { - position: relative; - padding: 1px 4px 2px 20px; -} - -a.icon img, .linkOn.icon img, .linkOff.icon img, .selected.icon img, .disabled.icon img { - position: absolute; - top: 0; - left: 0; - width: 18px; - height: 18px; -} - -.linkDanger, a.linkDanger:link, a.linkDanger:visited, a.linkDanger:active { - color: #ffffff; - background-color: #ff0000; - border-color: #aa0000; -} - -.linkDanger:hover { - background-color: #ff6666; -} - -ul { - padding: 4px 0 0 10px; - margin: 0; - list-style-type: none; -} - -li { - padding: 0 0 2px 0; -} - -img, a img { - border-style: none; -} - -h1, h2, h3, h4, h5, h6 { - margin: 0; - padding: 6px 0 6px 0; - color: #FFFFFF; - clear: both; -} - -h1 { - font-size: 18px; -} - -h2 { - font-size: 16px; -} - +h1, +h2, h3 { - font-size: 14px; + margin: 0; + padding: 6px 0 6px 0; + clear: both; } - -h4 { - font-size: 12px; +h1 { + font-size: 18px; } - -.white { - color: white; - font-weight: bold; +h2 { + font-size: 16px; } - -.good { - color: #4f7529; - font-weight: bold; +h3 { + font-size: 14px; } - -.average { - color: #cd6500; - font-weight: bold; +hr { + background-color: #40628a; + height: 1px; + border: none; } - -.bad { - color: #ee0000; - font-weight: bold; +ul { + padding: 4px 0 0 10px; + margin: 0; + list-style-type: none; } - -.idle { - color: #272727; - font-weight: bold; +ul li { + padding: 0 0 2px 0; } - -.redButton { - background: #ea0000; +noscript { + margin: 33% auto; + width: 50%; + height: 33%; + background: #ffffff; + border: 2px solid #ff0000; + z-index: 9999; + padding: 0px 10px; + text-align: center; } - -.yellowButton { - background: #cacc00; +span.normal { + color: #40628a; } - -.highlight { - color: #8BA5C4; +span.good { + color: #4f7529; } - -.dark { - color: #272727; +span.average { + color: #cd6500; } - -.caption { - font-size: 10px; - font-weight: bold; - padding: 5px; +span.bad { + color: #ee0000; } - -.footer { - font-size: 10px; +span.label { + color: #e9C183; } - +span.highlight { + color: #8ba5c4; +} +span.dark { + color: #272727; +} +.bold, +.notice, .noticePlaceholder { - position: relative; - font-size: 12px; - font-style: italic; - font-weight: bold; - padding: 3px 4px 3px 4px; - margin: 4px 0; + font-weight: bold; } - -.notice { - position: relative; - background: url(background_notice.jpg) 50% 50%; - color: #000000; - font-size: 12px; - font-style: italic; - font-weight: bold; - padding: 3px 4px 3px 4px; - margin: 4px 0; +.italic, +.notice, +.noticePlaceholder { + font-style: italic; } - -.notice.icon { - padding: 2px 4px 0 20px; +.fontReset, +.link { + color: white; + font-size: 12px; + font-weight: normal; + font-style: normal; + text-decoration: none; } - -.notice img { - position: absolute; - top: 0; - left: 0; - width: 16px; - height: 16px; +.hidden { + display: none; } - -div.notice { - clear: both; -} - -.itemGroup { - border: 1px solid #e9c183; - background: #2c2c2c; - padding: 4px; - clear: both; -} - -.item { - display: inline-block; - width: 100%; - clear: both; -} - -.itemContentNarrow, .itemContent { - float: left; -} - -.itemContentNarrow { - width: 30%; -} - -.itemContent { - width: 69%; -} - -.itemLabelNarrow, .itemLabel, .itemLabelWide, .itemLabelWider, .itemLabelWidest { - float: left; - color: #e9c183; -} - -.itemLabelNarrow { - width: 20%; -} - -.itemLabel { - width: 30%; -} - -.itemLabelWide { - width: 45%; -} - -.itemLabelWider { - width: 69%; -} - -.itemLabelWidest { - width: 100%; -} - -.itemContentWide { - float: left; - width: 79%; -} - -.itemContentSmall { - float: left; - width: 33%; -} - -.itemContentMedium { - float: left; - width: 55%; -} - -.statusDisplay { - display: block; - position: relative; - background: #000000; - color: #ffffff; - border: 1px solid #40628a; - padding: 4px; - margin: 4px 0; -} - -.statusDisplay .itemLabelNarrow, .statusDisplay .itemLabel, .statusDisplay .itemLabelWide, .statusDisplay .itemLabelWider, .statusDisplay .itemLabelWidest { - color: #98B0C3; -} - -.statusDisplayRecords { - background: #000000; - color: #ffffff; - border: 1px solid #40628a; - padding: 4px; - margin: 3px 0; - overflow-x: hidden; - overflow-y: auto; -} - -.block { - padding: 8px; - margin: 10px 4px 4px 4px; - border: 1px solid #40628a; - background-color: #202020; -} - -.block h3 { - padding: 0; -} - -.displayBar { - position: relative; - width: 236px; - height: 16px; - border: 1px solid #666666; - float: left; - margin: 0 5px 0 0; - overflow: hidden; - background: #000000; -} - -.displayBarText { - position: absolute; - top: -2px; - left: 5px; - width: 100%; - height: 100%; - color: #ffffff; - font-weight: normal; -} - -.displayBarFill { - width: 0%; - height: 100%; - background: #40628a; - overflow: hidden; - float: left; -} - -.displayBarFill.alignRight { - float: right; -} - -.displayBarFill.good { - color: #ffffff; - background: #4f7529; -} - -.displayBarFill.average { - color: #ffffff; - background: #cd6500; -} - -.displayBarFill.bad { - color: #ffffff; - background: #ee0000; -} - -.displayBarFill.highlight { - color: #ffffff; - background: #8BA5C4; -} - .clearBoth { - clear: both; + clear: both; } - .clearLeft { - clear: left; + clear: left; } - .clearRight { - clear: right; + clear: right; } - -.line { - width: 100%; - clear: both; +.floatNone { + float: none; } - -.inactive, a.inactive:link, a.inactive:visited, a.inactive:active, a.inactive:hover { - color: #ffffff; - background: #999999; - border-color: #666666; +.floatLeft { + float: left; } - -.fixedLeft { - width: 110px; - float: left; -} - -.fixedLeftWide { - width: 165px; - float: left; -} - -.fixedLeftWider { - width: 220px; - float: left; -} - -.fixedLeftWidest { - width: 250px; - float: left; -} - -.fixedLeftWiderRed { - width: 220px; - float: left; - background: #ee0000; -} - .floatRight { - float: right; + float: right; } - .alignTop { - vertical-align: top; + vertical-align: top; +} +.alignBottom { + vertical-align: bottom; +} +.alignLeft { + text-align: left; +} +.alignCenter { + text-align: center; +} +.alignRight { + text-align: right; +} +.notice, +.noticePlaceholder { + padding: 2px 4px; + margin: 4px 0; + color: black; + background: url(background_notice.jpg) 50% 50%; +} +.noticePlaceholder { + color: white; + background: none; +} +.notice.icon { + padding: 2px 4px 0 20px; +} +.notice img { + position: absolute; + top: 0; + left: 0; + width: 16px; + height: 16px; +} +div.notice { + clear: both; +} +.link { + height: 16px; + min-width: 16px; + display: inline-block; + margin: 2px; + padding: 0 4px; + border: 1px solid #111010; + cursor: default; +} +.link.iconed { + padding: 0px 4px 4px 0px; +} +.link i { + margin: 4px 2px 0 2px; +} +.link i.main { + display: inline-block; +} +.link i.pending { + display: none; +} +.link.pending i.main { + display: none; +} +.link.pending i.pending { + display: inline-block; +} +.link.normal.active { + background: #40628a; +} +.link.normal.active:hover { + background: #507bad; +} +.link.normal.inactive { + background: #40628a; +} +.link.normal.pending { + background: #304967; +} +.link.selected.active { + background: #2f943c; +} +.link.selected.active:hover { + background: #3bbb4c; +} +.link.selected.inactive { + background: #2f943c; +} +.link.selected.pending { + background: #236d2c; +} +.link.caution.active { + background: #adaf00; +} +.link.caution.active:hover { + background: #dfe200; +} +.link.caution.inactive { + background: #adaf00; +} +.link.caution.pending { + background: #7b7c00; +} +.link.danger.active { + background: #ea0000; +} +.link.danger.active:hover { + background: #ff1e1e; +} +.link.danger.inactive { + background: #ea0000; +} +.link.danger.pending { + background: #b70000; +} +.link.disabled.active { + background: #999999; +} +.link.disabled.active:hover { + background: #b3b3b3; +} +.link.disabled.inactive { + background: #999999; +} +.link.disabled.pending { + background: #808080; +} +.link[disabled] { + pointer-events: none; + background-color: #999999 !important; + border-color: #000000 !important; +} +.bar { + position: relative; + width: 236px; + height: 16px; + border: 1px solid #666666; + float: left; + margin: 0 5px 0 0; + overflow: hidden; + background: black; +} +.bar .barText { + position: absolute; + top: -2px; + left: 5px; + width: 100%; + height: 100%; + color: white; + font-weight: normal; +} +.bar .barFill { + width: 0%; + height: 100%; + background: #40628a; + overflow: hidden; + float: left; +} +.bar .barFill.good { + background: #4f7529; +} +.bar .barFill.average { + background: #cd6500; +} +.bar .barFill.bad { + background: #ea0000; +} +.bar .barFill.highlight { + background: #8BA5C4; +} +#statusicon { + width: 24px; + height: 24px; + background: url(statusicon.png) no-repeat; +} +#statusicon.good { + background-position: 0 0; +} +#statusicon.average { + background-position: 0 -24px; +} +#statusicon.bad { + background-position: 0 -48px; +} +.itemGroup { + border: 1px solid #e9c183; + background: #2c2c2c; + padding: 4px; + clear: both; +} +.item { + display: inline-block; + width: 100%; + clear: both; +} +.itemContentNarrow, +.itemContent { + float: left; +} +.itemContentNarrow { + width: 30%; +} +.itemContent { + width: 69%; +} +.itemLabelNarrow, +.itemLabel, +.itemLabelWide, +.itemLabelWider, +.itemLabelWidest { + float: left; + color: #e9c183; +} +.itemLabelNarrow { + width: 20%; +} +.itemLabel { + width: 30%; +} +.itemLabelWide { + width: 45%; +} +.itemLabelWider { + width: 69%; +} +.itemLabelWidest { + width: 100%; +} +.itemContentWide { + float: left; + width: 79%; +} +.itemContentSmall { + float: left; + width: 33%; +} +.itemContentMedium { + float: left; + width: 55%; +} +.statusDisplay { + display: block; + position: relative; + background: #000000; + color: #ffffff; + border: 1px solid #40628a; + padding: 4px; + margin: 4px 0; +} +.statusDisplay .itemLabelNarrow, +.statusDisplay .itemLabel, +.statusDisplay .itemLabelWide, +.statusDisplay .itemLabelWider, +.statusDisplay .itemLabelWidest { + color: #98B0C3; +} +.block { + padding: 8px; + margin: 10px 4px 4px 4px; + border: 1px solid #40628a; + background-color: #202020; +} +.block h3 { + padding: 0; +} +.line { + width: 100%; + clear: both; +} +.fixedLeft { + width: 110px; + float: left; +} +.fixedLeftWide { + width: 165px; + float: left; +} +.fixedLeftWider { + width: 220px; + float: left; +} +.fixedLeftWidest { + width: 250px; + float: left; +} +.fixedLeftWiderRed { + width: 220px; + float: left; + background: #ee0000; } diff --git a/nano/styles/nanoui.icons.less b/nano/styles/nanoui.icons.less new file mode 100644 index 00000000000..b508c3f44c6 --- /dev/null +++ b/nano/styles/nanoui.icons.less @@ -0,0 +1,10 @@ +// main: nanoui.less + +#statusicon { + width: 24px; + height: 24px; + background: url(statusicon.png) no-repeat; + &.good { background-position: 0 0; } + &.average { background-position: 0 -24px; } + &.bad { background-position: 0 -48px; } +} diff --git a/nano/styles/nanoui.less b/nano/styles/nanoui.less new file mode 100644 index 00000000000..c8be6b1ad07 --- /dev/null +++ b/nano/styles/nanoui.less @@ -0,0 +1,134 @@ +// out: nanoui.css + +@import "nanoui.base.less"; +@import "nanoui.util.less"; +@import "nanoui.components.less"; +@import "nanoui.links.less"; +@import "nanoui.bar.less"; +@import "nanoui.icons.less"; + + +.itemGroup { + border: 1px solid #e9c183; + background: #2c2c2c; + padding: 4px; + clear: both; +} + +.item { + display: inline-block; + width: 100%; + clear: both; +} + +.itemContentNarrow, .itemContent { + float: left; +} + +.itemContentNarrow { + width: 30%; +} + +.itemContent { + width: 69%; +} + +.itemLabelNarrow, .itemLabel, .itemLabelWide, .itemLabelWider, .itemLabelWidest { + float: left; + color: #e9c183; +} + +.itemLabelNarrow { + width: 20%; +} + +.itemLabel { + width: 30%; +} + +.itemLabelWide { + width: 45%; +} + +.itemLabelWider { + width: 69%; +} + +.itemLabelWidest { + width: 100%; +} + +.itemContentWide { + float: left; + width: 79%; +} + +.itemContentSmall { + float: left; + width: 33%; +} + +.itemContentMedium { + float: left; + width: 55%; +} + +.statusDisplay { + display: block; + position: relative; + background: #000000; + color: #ffffff; + border: 1px solid #40628a; + padding: 4px; + margin: 4px 0; +} + +.statusDisplay .itemLabelNarrow, .statusDisplay .itemLabel, .statusDisplay .itemLabelWide, .statusDisplay .itemLabelWider, .statusDisplay .itemLabelWidest { + color: #98B0C3; +} + +.block { + padding: 8px; + margin: 10px 4px 4px 4px; + border: 1px solid #40628a; + background-color: #202020; +} + +.block h3 { + padding: 0; +} + + + + + +.line { + width: 100%; + clear: both; +} + +.fixedLeft { + width: 110px; + float: left; +} + +.fixedLeftWide { + width: 165px; + float: left; +} + +.fixedLeftWider { + width: 220px; + float: left; +} + +.fixedLeftWidest { + width: 250px; + float: left; +} + +.fixedLeftWiderRed { + width: 220px; + float: left; + background: #ee0000; +} diff --git a/nano/styles/nanoui.links.less b/nano/styles/nanoui.links.less new file mode 100644 index 00000000000..3d8d155d77b --- /dev/null +++ b/nano/styles/nanoui.links.less @@ -0,0 +1,43 @@ +// main: nanoui.less + +@import "nanoui.config.less"; +@import "nanoui.util.less"; + + +// Basic Link (Button) Element +.link { + height: 16px; + min-width: 16px; // So buttons are square at the smallest size. + display: inline-block; + + // Reset font settings. + &:extend(.fontReset); + + margin: 2px; + padding: 0 4px; + border: 1px solid @link-border; + + cursor: default; + + &.iconed { padding: 0px 4px 4px 0px; } + i { margin: 4px 2px 0 2px; } + i.main { display: inline-block; } + i.pending { display: none; } + &.pending { + i.main { display: none; } + i.pending { display: inline-block; } + } + + // Genearte link states. + &.normal { .link(@normal); } + &.selected { .link(@selected); } + &.caution { .link(@caution); } + &.danger { .link(@danger); } + &.disabled { .link(@disabled); } + + &[disabled] { + pointer-events: none; + background-color: @disabled !important; + border-color: @link-border-dark !important; + } +} diff --git a/nano/styles/nanoui.util.less b/nano/styles/nanoui.util.less new file mode 100644 index 00000000000..04eabcf4d6c --- /dev/null +++ b/nano/styles/nanoui.util.less @@ -0,0 +1,67 @@ +// main: nanoui.less + +@import "nanoui.config.less"; + +// Links (and their various states.) +.link(@color) { + &.active { .linkState(@color, @h: true); } // Links that are active have a hover highlight. + &.inactive { .linkState(@color); } // Links that are not clickable do not have a hover highlight. + &.pending { .linkState(@color, @p: true) } // Links that are pending darken. +} +.linkState(@color, @h: false, @p: false) { + &:hover when (@h = true) { + background: lighten(@color, @hover); + } +} +.linkState(@color, @h: false, @p: false) when (@p = true) { + background: darken(@color, @pending); +} +.linkState(@color, @h: false, @p: false) when (@p = false) { + background: @color; +} + +// Colored Elements +.color(@color) { // Explort a given color as a class. + &.@{color} { + color: @@color; + } +} + +span { + .color(normal); + .color(good); + .color(average); + .color(bad); + .color(label); + .color(highlight); + .color(dark); +} + + +// Styled Elements +.bold { font-weight: bold; } +.italic { font-style: italic; } +.fontReset { + color: @text; + font-size: @font-size; + font-weight: normal; + font-style: normal; + text-decoration: none; +} + +// 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; }