From 17aafd91e488df1ddf04d6b3e26fa760de905c76 Mon Sep 17 00:00:00 2001 From: Mark Aherne Date: Tue, 15 Jul 2014 01:08:06 +0100 Subject: [PATCH] Layout update for NanoUI. The layout HTML (which was mainly used for the title bar) is no longer hard coded in nanoui.dm. Layouts are now dynamic and each consists of a template and stylesheet (CSS) file. Multiple layouts can exist, they can be switched to using the set_layout_key proc. See the proc comments for more info. Added "default" and "basic" layouts, "basic" has no title bar. Moved image source assets (GIMP and Flash files) into a separate source folder so that they are not sent to the client. Conflicts: code/modules/nano/nanoui.dm --- code/modules/nano/nanoui.dm | 120 +++--- nano/css/layout_basic.css | 21 + nano/css/layout_default.css | 64 ++++ nano/css/shared.css | 361 +++++++++--------- nano/{ => images/source}/NTLogoRevised.fla | Bin nano/images/{ => source}/icon-eye.xcf | Bin .../{ => source}/uiBackground-Syndicate.xcf | Bin nano/{ => images/source}/uiBackground.fla | Bin nano/images/{ => source}/uiBackground.xcf | Bin nano/images/source/uiBasicBackground.xcf | Bin 0 -> 28347 bytes nano/images/{ => source}/uiIcons24.xcf | Bin .../{ => source}/uiNoticeBackground.xcf | Bin .../images/{ => source}/uiTitleBackground.xcf | Bin nano/images/uiBasicBackground.png | Bin 0 -> 5865 bytes nano/js/nano_state.js | 3 +- nano/js/nano_state_manager.js | 3 - nano/js/nano_template.js | 117 +++--- nano/templates/layout_basic.tmpl | 3 + nano/templates/layout_default.tmpl | 4 + 19 files changed, 372 insertions(+), 324 deletions(-) create mode 100644 nano/css/layout_basic.css create mode 100644 nano/css/layout_default.css rename nano/{ => images/source}/NTLogoRevised.fla (100%) rename nano/images/{ => source}/icon-eye.xcf (100%) rename nano/images/{ => source}/uiBackground-Syndicate.xcf (100%) rename nano/{ => images/source}/uiBackground.fla (100%) rename nano/images/{ => source}/uiBackground.xcf (100%) create mode 100644 nano/images/source/uiBasicBackground.xcf rename nano/images/{ => source}/uiIcons24.xcf (100%) rename nano/images/{ => source}/uiNoticeBackground.xcf (100%) rename nano/images/{ => source}/uiTitleBackground.xcf (100%) create mode 100644 nano/images/uiBasicBackground.png create mode 100644 nano/templates/layout_basic.tmpl create mode 100644 nano/templates/layout_default.tmpl diff --git a/code/modules/nano/nanoui.dm b/code/modules/nano/nanoui.dm index efcf80a28ac..75817c1175e 100644 --- a/code/modules/nano/nanoui.dm +++ b/code/modules/nano/nanoui.dm @@ -38,12 +38,11 @@ nanoui is used to open and update nano browser uis var/list/stylesheets = list() // the list of javascript scripts to use for this ui var/list/scripts = list() - // the list of templates to use with this ui (usually just one) + // a list of templates which can be used with this ui var/templates[0] - // the body content for this ui, do not change unless you know what you're doing - // the #mainTemplate div will contain the compiled "main" template html - var/content = "
" - // the title of this ui + // the layout key for this ui (this is used on the frontend, leave it as "default" unless you know what you're doing) + var/layout_key = "default" + // the default state to use for this ui (this is used on the frontend, leave it as "default" unless you know what you're doing) var/state_key = "default" // initial data, containing the full data structure, must be sent to the ui (the data structure cannot be extended later on) var/list/initial_data[0] @@ -61,7 +60,7 @@ nanoui is used to open and update nano browser uis * @param nuser /mob The mob who has opened/owns this ui * @param nsrc_object /obj|/mob The obj or mob which this ui belongs to * @param nui_key string A string key to use for this ui. Allows for multiple unique uis on one src_oject - * @param ntemplate string The name of the template file from /nano/templates (e.g. "my_template.tmpl") + * @param ntemplate string The filename of the template file from /nano/templates (e.g. "my_template.tmpl") * @param ntitle string The title of this ui * @param nwidth int the width of the ui window * @param nheight int the height of the ui window @@ -69,14 +68,14 @@ nanoui is used to open and update nano browser uis * * @return /nanoui new nanoui object */ -/datum/nanoui/New(nuser, nsrc_object, nui_key, ntemplate, ntitle = 0, nwidth = 0, nheight = 0, var/atom/nref = null) +/datum/nanoui/New(nuser, nsrc_object, nui_key, ntemplate_filename, ntitle = 0, nwidth = 0, nheight = 0, var/atom/nref = null) user = nuser src_object = nsrc_object ui_key = nui_key window_id = "[ui_key]\ref[src_object]" - // Add the passed template as the 'main' template, this is required - add_template("main", ntemplate) + // add the passed template filename as the "main" template, this is required + add_template("main", ntemplate_filename) if (ntitle) title = ntitle @@ -101,8 +100,8 @@ nanoui is used to open and update nano browser uis add_script("nano_state_manager.js") // The NanoStateManager JS, it handles updates from the server and passes data to the current state add_script("nano_state.js") // The NanoState JS, this is the base state which all states must inherit from add_script("nano_state_default.js") // The NanoStateDefault JS, this is the "default" state (used by all UIs by default), which inherits from NanoState - add_script("nano_base_callbacks.js") // The NanoBaseCallbacks JS, this is used to set up (before and after update) callbacks which are common to all templates - add_script("nano_base_helpers.js") // The NanoBaseHelpers JS, this is used to set up template helpers which are common to all templates + add_script("nano_base_callbacks.js") // The NanoBaseCallbacks JS, this is used to set up (before and after update) callbacks which are common to all UIs + add_script("nano_base_helpers.js") // The NanoBaseHelpers JS, this is used to set up template helpers which are common to all UIs add_stylesheet("shared.css") // this CSS sheet is common to all UIs add_stylesheet("icons.css") // this CSS sheet is common to all UIs @@ -228,6 +227,7 @@ nanoui is used to open and update nano browser uis /** * Add a CSS stylesheet to this UI + * These must be added before the UI has been opened, adding after that will have no effect * * @param file string The name of the CSS file from /nano/css (e.g. "my_style.css") * @@ -238,6 +238,7 @@ nanoui is used to open and update nano browser uis /** * Add a JavsScript script to this UI + * These must be added before the UI has been opened, adding after that will have no effect * * @param file string The name of the JavaScript file from /nano/js (e.g. "my_script.js") * @@ -247,35 +248,36 @@ nanoui is used to open and update nano browser uis scripts.Add(file) /** - * Add a template to this UI + * Add a template for this UI * Templates are combined with the data sent to the UI to create the rendered view - * Each template needs a div in ui.content to contain the rendered content. - * The div format is '
' where is replaced with the templater's key. - * All UIs are set up by default to use a 'main' template, so only use this proc if you want to add advanced functionality. + * These must be added before the UI has been opened, adding after that will have no effect * - * @param key string The key name for this template, used to identify the div to render this template into ('
') - * @param file string The name of the template file from /nano/templates (e.g. "my_template.tmpl") + * @param key string The key which is used to reference this template in the frontend + * @param filename string The name of the template file from /nano/templates (e.g. "my_template.tmpl") * * @return nothing */ -/datum/nanoui/proc/add_template(key, file) - templates[key] = file +/datum/nanoui/proc/add_template(key, filename) + templates[key] = filename /** - * Set the HTML content of the UI - * This should only really be used to add more template divs (see the add_template() proc) + * Set the layout key for use in the frontend Javascript + * The layout key is the basic layout key for the page + * Two files are loaded on the client based on the layout key varable: + * -> a template in /nano/templates with the filename "layout_.tmpl + * -> a CSS stylesheet in /nano/css with the filename "layout_.css * - * @param ncontent string The new HTML content for this UI + * @param nlayout string The layout key to use * * @return nothing */ -/datum/nanoui/proc/set_content(ncontent) - content = ncontent +/datum/nanoui/proc/set_layout_key(nlayout_key) + layout_key = lowertext(nlayout_key) /** * Set the state key for use in the frontend Javascript * - * @param nstate_key string The new HTML content for this UI + * @param nstate_key string The key of the state to use * * @return nothing */ @@ -293,11 +295,16 @@ nanoui is used to open and update nano browser uis on_close_logic = state /** - * Return the HTML header content for this UI + * Return the HTML for this UI * - * @return string HTML header content + * @return string HTML for the UI */ -/datum/nanoui/proc/get_header() +/datum/nanoui/proc/get_html() + + // before the UI opens, add the layout files based on the layout key + add_stylesheet("layout_[layout_key].css") + add_template("layout", "layout_[layout_key].tmpl") + var/head_content = "" for (var/filename in scripts) @@ -306,20 +313,17 @@ nanoui is used to open and update nano browser uis for (var/filename in stylesheets) head_content += " " - var/templatel_data[0] - for (var/key in templates) - templatel_data[key] = templates[key]; - var/template_data_json = "{}" // An empty JSON object - if (templatel_data.len > 0) - template_data_json = list2json(templatel_data) + if (templates.len > 0) + template_data_json = list2json(templates) var/list/send_data = get_send_data(initial_data) var/initial_data_json = list2json(send_data) var/url_parameters_json = list2json(list("src" = "\ref[src]")) - return {" + return {" + @@ -336,43 +340,18 @@ nanoui is used to open and update nano browser uis [head_content] - -
- [title ? "
[title]
" : ""] -
-
Initiating...
- - "} - - /** - * Return the HTML footer content for this UI - * - * @return string HTML footer content - */ -/datum/nanoui/proc/get_footer() - - return {" -
+ +
+ -"} - - /** - * Return the HTML for this UI - * - * @return string HTML for the UI - */ -/datum/nanoui/proc/get_html() - return {" - [get_header()] - [content] - [get_footer()] + "} /** @@ -381,6 +360,7 @@ nanoui is used to open and update nano browser uis * @return nothing */ /datum/nanoui/proc/open() + var/window_size = "" if (width && height) window_size = "size=[width]x[height];" diff --git a/nano/css/layout_basic.css b/nano/css/layout_basic.css new file mode 100644 index 00000000000..30a75490f39 --- /dev/null +++ b/nano/css/layout_basic.css @@ -0,0 +1,21 @@ +body { + background: #272727 url(uiBasicBackground.png) 50% 0 repeat-x; +} + +#uiContent { + clear: both; + padding: 8px; +} + +#uiLoadingNotice { + position: relative; + background: url(uiNoticeBackground.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/css/layout_default.css b/nano/css/layout_default.css new file mode 100644 index 00000000000..df5ce06e77c --- /dev/null +++ b/nano/css/layout_default.css @@ -0,0 +1,64 @@ +body { + background: #272727 url(uiBackground.png) 50% 0 repeat-x; +} + +#uiWrapper { + width: 100%; + height: 100%; +} + +#uiTitleWrapper { + position: relative; + height: 30px; +} + +#uiTitle { + position: absolute; + top: 6px; + left: 44px; + width: 66%; + overflow: hidden; + color: #E9C183; + font-size: 16px; +} + +#uiTitle.icon { + padding: 6px 8px 6px 42px; + background-position: 2px 50%; + background-repeat: no-repeat; +} + +#uiTitleFluff { + position: absolute; + top: 4px; + right: 12px; + width: 42px; + height: 24px; + background: url(uiTitleFluff.png) 50% 50% no-repeat; +} + +#uiStatusIcon { + position: absolute; + top: 4px; + left: 12px; + width: 24px; + height: 24px; +} + +#uiContent { + clear: both; + padding: 8px; +} + +#uiLoadingNotice { + position: relative; + background: url(uiNoticeBackground.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/css/shared.css b/nano/css/shared.css index 3dbe05bc1f0..ec9ff3f93d0 100644 --- a/nano/css/shared.css +++ b/nano/css/shared.css @@ -5,24 +5,43 @@ body { color: #ffffff; line-height: 170%; font-family: Verdana, Geneva, sans-serif; - background: #272727 url(uiBackground.png) 50% 0 repeat-x; + background: #272727; } + +#uiNoScript { + position: fixed; + top: 50%; + left: 50%; + margin: -60px 0 0 -150px; + width: 280px; + height: 120px; + background: #ffffff; + border: 2px solid #ff0000; + color: #000000; + font-size: 10px; + font-weight: bold; + z-index: 9999; + padding: 0px 10px; + text-align: center; +} + hr { background-color: #40628a; height: 1px; } + .link, .linkOn, .linkOff, .selected, .disabled { - float: left; + float: left; min-width: 15px; height: 16px; - text-align: center; + 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; + cursor: default; white-space: nowrap; } @@ -33,10 +52,12 @@ hr { a: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; @@ -44,25 +65,30 @@ a.white, a.white:link, a.white:visited, a.white:active { border: 1px solid #161616; padding: 1px 4px 1px 4px; margin: 0 2px 0 0; - cursor:default; + cursor: default; } + a.white:hover { color: #ffffff; background: #40628a; } + .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; @@ -70,11 +96,13 @@ a.icon img, .linkOn.icon img, .linkOff.icon img, .selected.icon img, .disabled.i 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; } @@ -84,97 +112,37 @@ ul { margin: 0; list-style-type: none; } + li { padding: 0 0 2px 0; } + img, a img { - border-style:none; + border-style: none; } + h1, h2, h3, h4, h5, h6 { margin: 0; padding: 12px 0 6px 0; color: #517087; clear: both; } + h1 { font-size: 18px; } + h2 { font-size: 16px; } + h3 { font-size: 14px; } + h4 { font-size: 12px; } -#uiWrapper { - width: 100%; - height: 100%; -} -#uiTitleWrapper { - position: relative; - height: 30px; -} -#uiTitle { - position: absolute; - top: 6px; - left: 44px; - width: 66%; - overflow: hidden; - color: #E9C183; - font-size: 16px; -} -#uiTitle.icon { - padding: 6px 8px 6px 42px; - background-position: 2px 50%; - background-repeat: no-repeat; -} -#uiTitleFluff { - position: absolute; - top: 4px; - right: 12px; - width: 42px; - height: 24px; - background: url(uiTitleFluff.png) 50% 50% no-repeat; -} -#uiStatusIcon { - position: absolute; - top: 4px; - left: 12px; - width: 24px; - height: 24px; -} -#uiContent { - clear: both; - padding: 8px; -} -#uiLoadingNotice { - position: relative; - background: url(uiNoticeBackground.jpg) 50% 50%; - color: #000000; - font-size: 14px; - font-style: italic; - font-weight: bold; - padding: 3px 4px 3px 4px; - margin: 4px 0 4px 0; -} -#uiNoScript { - position: fixed; - top: 50%; - left: 50%; - margin: -60px 0 0 -150px; - width: 280px; - height: 120px; - background: #ffffff; - border: 2px solid #ff0000; - color: #000000; - font-size: 10px; - font-weight: bold; - z-index: 9999; - padding: 0px 10px; - text-align: center; -} .white { color: white; @@ -185,10 +153,12 @@ h4 { color: #4f7529; font-weight: bold; } + .average { color: #cd6500; font-weight: bold; } + .bad { color: #ee0000; font-weight: bold; @@ -200,17 +170,21 @@ h4 { } .redBackground { - background: #ea0000; + background: #ea0000; } + .yellowBackground { - background: #cacc00; + background: #cacc00; } + .highlight { color: #8BA5C4; } + .dark { color: #272727; } + .noticePlaceholder { position: relative; font-size: 12px; @@ -219,6 +193,7 @@ h4 { padding: 3px 4px 3px 4px; margin: 4px 0 4px 0; } + .notice { position: relative; background: url(uiNoticeBackground.jpg) 50% 50%; @@ -229,9 +204,11 @@ h4 { padding: 3px 4px 3px 4px; margin: 4px 0 4px 0; } + .notice.icon { padding: 2px 4px 0 20px; } + .notice img { position: absolute; top: 0; @@ -240,37 +217,40 @@ h4 { height: 16px; } - div.notice { clear: both; } + .itemGroup { border: 1px solid #e9c183; - background: #2c2c2c; - padding: 4px; - clear: both; -} -.item { - width: 100%; - margin: 4px 0 0 0; + background: #2c2c2c; + padding: 4px; clear: both; } +.item { + width: 100%; + margin: 4px 0 0 0; + clear: both; +} .itemLabel { float: left; width: 30%; color: #e9c183; } + .itemContent { float: left; width: 69%; } + .itemLabelNarrow { float: left; width: 20%; color: #e9c183; } + .itemLabelWide { float: left; width: 45%; @@ -281,10 +261,12 @@ div.notice { float: left; width: 79%; } + .itemContentSmall { float: left; width: 33%; } + .itemContentMedium { float: left; width: 55%; @@ -297,6 +279,7 @@ div.notice { padding: 4px; margin: 3px 0; } + .statusDisplayRecords { background: #000000; color: #ffffff; @@ -307,25 +290,28 @@ div.notice { overflow-y: auto; } - .statusLabel { width: 138px; float: left; overflow: hidden; color: #98B0C3; } + .statusValue { float: left; } + .block { padding: 8px; margin: 10px 4px 4px 4px; border: 1px solid #40628a; background-color: #202020; } + .block h3 { padding: 0; } + .displayBar { position: relative; width: 236px; @@ -336,6 +322,7 @@ div.notice { overflow: hidden; background: #000000; } + .displayBarText { position: absolute; top: -2px; @@ -345,6 +332,7 @@ div.notice { color: #ffffff; font-weight: normal; } + .displayBarFill { width: 0%; height: 100%; @@ -352,58 +340,70 @@ div.notice { 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; } + .clearLeft { clear: left; } + .clearRight { clear: right; } + .line { width: 100%; clear: both; } -.inactive, , a.inactive:link, a.inactive:visited, a.inactive:active, a.inactive:hover { + +.inactive, a.inactive:link, a.inactive:visited, a.inactive:active, a.inactive:hover { color: #ffffff; background: #999999; border-color: #666666; } + .fixedLeft { width: 110px; float: left; } + .fixedLeftWide { width: 165px; float: left; } -.fixedLeftWider{ +.fixedLeftWider { width: 220px; float: left; } -.fixedLeftWidest{ +.fixedLeftWidest { width: 250px; float: left; } @@ -414,150 +414,131 @@ div.notice { /* Used in PDA */ - -.wholeScreen -{ - position: absolute - color: #517087; - font-size: 16px; - font-weight: bold; - text-align:center; +.wholeScreen { + position: absolute; + color: #517087; + font-size: 16px; + font-weight: bold; + text-align: center; } -.pdalink -{ +.pdalink { float: left; - white-space:nowrap; + white-space: nowrap; } /* DNA Modifier UI (dna_modifier.tmpl) */ -.dnaBlock -{ +.dnaBlock { float: left; width: 90px; - padding: 0 0 5px 0; + padding: 0 0 5px 0; } -.dnaBlockNumber -{ - font-family: Fixed, monospace; - float: left; - color: #ffffff; - background: #363636; - min-width: 20px; +.dnaBlockNumber { + font-family: Fixed, monospace; + float: left; + color: #ffffff; + background: #363636; + min-width: 20px; height: 20px; - padding: 0; - text-align: center; + padding: 0; + text-align: center; } -.dnaSubBlock -{ - font-family: Fixed, monospace; - float: left; +.dnaSubBlock { + font-family: Fixed, monospace; + float: left; padding: 0; min-width: 16px; height: 20px; text-align: center; } -.mask -{ - position: fixed; - left: 0; - top: 0; - width: 100%; - height: 100%; - background: url(uiMaskBackground.png); +.mask { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: url(uiMaskBackground.png); } -.maskContent -{ - width: 100%; - height: 200px; - margin: 200px 0; - text-align: center; +.maskContent { + width: 100%; + height: 200px; + margin: 200px 0; + text-align: center; } /* Table stuffs for power monitor */ -table.pmon -{ -border:2px solid RoyalBlue; +table.pmon { + border: 2px solid RoyalBlue; } -table.pmon td, table.pmon th -{ -border-bottom:1px dotted black; -padding:0px 5px 0px 5px; +table.pmon td, table.pmon th { + border-bottom: 1px dotted black; + padding: 0px 5px 0px 5px; } - - /* Table Stuffs for manifest*/ -th.command -{ - background: #3333FF; - font-weight: bold; - color: #ffffff; +th.command { + background: #3333FF; + font-weight: bold; + color: #ffffff; } -th.sec -{ - background: #8e0000; - font-weight: bold; - color: #ffffff; -} -th.med -{ - background: #006600; - font-weight: bold; - color: #ffffff; -} -th.eng -{ - background: #b27300; - font-weight: bold; - color: #ffffff; -} -th.sci -{ - background: #a65ba6; - font-weight: bold; - color: #ffffff; -} -th.civ -{ - background: #a32800; - font-weight: bold; - color: #ffffff; -} -th.misc -{ - background: #666666; - font-weight: bold; - color: #ffffff; +th.sec { + background: #8e0000; + font-weight: bold; + color: #ffffff; } +th.med { + background: #006600; + font-weight: bold; + color: #ffffff; +} + +th.eng { + background: #b27300; + font-weight: bold; + color: #ffffff; +} + +th.sci { + background: #a65ba6; + font-weight: bold; + color: #ffffff; +} + +th.civ { + background: #a32800; + font-weight: bold; + color: #ffffff; +} + +th.misc { + background: #666666; + font-weight: bold; + color: #ffffff; +} /* Damage colors for crew monitoring computer */ -.burn -{ - color: orange; +.burn { + color: orange; } -.brute -{ - color: red; +.brute { + color: red; } -.toxin -{ - color: green; +.toxin { + color: green; } -.oxyloss -{ - color: blue; -} +.oxyloss { + color: blue; +} \ No newline at end of file diff --git a/nano/NTLogoRevised.fla b/nano/images/source/NTLogoRevised.fla similarity index 100% rename from nano/NTLogoRevised.fla rename to nano/images/source/NTLogoRevised.fla diff --git a/nano/images/icon-eye.xcf b/nano/images/source/icon-eye.xcf similarity index 100% rename from nano/images/icon-eye.xcf rename to nano/images/source/icon-eye.xcf diff --git a/nano/images/uiBackground-Syndicate.xcf b/nano/images/source/uiBackground-Syndicate.xcf similarity index 100% rename from nano/images/uiBackground-Syndicate.xcf rename to nano/images/source/uiBackground-Syndicate.xcf diff --git a/nano/uiBackground.fla b/nano/images/source/uiBackground.fla similarity index 100% rename from nano/uiBackground.fla rename to nano/images/source/uiBackground.fla diff --git a/nano/images/uiBackground.xcf b/nano/images/source/uiBackground.xcf similarity index 100% rename from nano/images/uiBackground.xcf rename to nano/images/source/uiBackground.xcf diff --git a/nano/images/source/uiBasicBackground.xcf b/nano/images/source/uiBasicBackground.xcf new file mode 100644 index 0000000000000000000000000000000000000000..56a31d7b2fc335d7776441f08011c054647ec0fc GIT binary patch literal 28347 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 literal 0 HcmV?d00001 diff --git a/nano/images/uiIcons24.xcf b/nano/images/source/uiIcons24.xcf similarity index 100% rename from nano/images/uiIcons24.xcf rename to nano/images/source/uiIcons24.xcf diff --git a/nano/images/uiNoticeBackground.xcf b/nano/images/source/uiNoticeBackground.xcf similarity index 100% rename from nano/images/uiNoticeBackground.xcf rename to nano/images/source/uiNoticeBackground.xcf diff --git a/nano/images/uiTitleBackground.xcf b/nano/images/source/uiTitleBackground.xcf similarity index 100% rename from nano/images/uiTitleBackground.xcf rename to nano/images/source/uiTitleBackground.xcf diff --git a/nano/images/uiBasicBackground.png b/nano/images/uiBasicBackground.png new file mode 100644 index 0000000000000000000000000000000000000000..03131d1e94cdf5863b93a36aefc5d1b0c0ba12ce GIT binary patch literal 5865 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 literal 0 HcmV?d00001 diff --git a/nano/js/nano_state.js b/nano/js/nano_state.js index 7a3dcfdf03e..bca2abd6ac9 100644 --- a/nano/js/nano_state.js +++ b/nano/js/nano_state.js @@ -45,7 +45,8 @@ NanoStateClass.prototype.onUpdate = function (data) { try { - $("#mainTemplate").html(NanoTemplate.parse('main', data)); // render the 'mail' template to the #mainTemplate div + $("#uiLayout").html(NanoTemplate.parse('layout', data)); // render the 'mail' template to the #mainTemplate div + $("#uiContent").html(NanoTemplate.parse('main', data)); // render the 'mail' template to the #mainTemplate div } catch(error) { diff --git a/nano/js/nano_state_manager.js b/nano/js/nano_state_manager.js index 0cbdb2e48aa..69699765a48 100644 --- a/nano/js/nano_state_manager.js +++ b/nano/js/nano_state_manager.js @@ -25,8 +25,6 @@ NanoStateManager = function () // this function sets up the templates and base functionality var init = function () { - $('#uiLoadingNotice').html('Loading...'); - // We store initialData and templateData in the body tag, it's as good a place as any _data = $('body').data('initialData'); @@ -47,7 +45,6 @@ NanoStateManager = function () doUpdate(_data); _isInitialised = true; - $('#uiLoadingNotice').hide(); }); }; diff --git a/nano/js/nano_template.js b/nano/js/nano_template.js index 23e2ac08370..7847c6f9dd2 100644 --- a/nano/js/nano_template.js +++ b/nano/js/nano_template.js @@ -1,77 +1,74 @@ var NanoTemplate = function () { + var _templateData = {}; + var _templates = {}; var _compiledTemplates = {}; var _helpers = {}; var init = function () { - // We store initialData and templateData in the body tag, it's as good a place as any - var templateData = $('body').data('templateData'); - - if (templateData == null) + // We store templateData in the body tag, it's as good a place as any + _templateData = $('body').data('templateData'); + + if (_templateData == null) { alert('Error: Template data did not load correctly.'); - } - - // we count the number of templates for this ui so that we know when they've all been rendered - var templateCount = 0; - for (var key in templateData) - { - if (templateData.hasOwnProperty(key)) - { - templateCount++; - } } - - if (!templateCount) - { - alert('ERROR: No templates listed!'); - } - - // load markup for each template and register it - for (var key in templateData) - { - if (!templateData.hasOwnProperty(key)) - { - continue; - } - - $.when($.ajax({ - url: templateData[key], - cache: false, - dataType: 'text' - })) - .done(function(templateMarkup) { - - //templateMarkup = templateMarkup.replace(/ +\) *\}\}/g, ')}}'); - - templateMarkup += '
'; - - try - { - NanoTemplate.addTemplate(key, templateMarkup) - - templateCount--; - - if (templateCount <= 0) - { - $(document).trigger('templatesLoaded'); - } - } - catch(error) - { - alert('ERROR: An error occurred while loading the UI: ' + error.message); - return; - } - }) - .fail(function () { - alert('ERROR: Loading template ' + key + '(' + templateData[key] + ') failed!'); - });; - } + + loadNextTemplate(); }; + var loadNextTemplate = function () { + // we count the number of templates for this ui so that we know when they've all been rendered + var templateCount = Object.size(_templateData); + + if (!templateCount) + { + $(document).trigger('templatesLoaded'); + return; + } + + // load markup for each template and register it + for (var key in _templateData) + { + if (!_templateData.hasOwnProperty(key)) + { + continue; + } + + $.when($.ajax({ + url: _templateData[key], + cache: false, + dataType: 'text' + })) + .done(function(templateMarkup) { + + templateMarkup += '
'; + + try + { + NanoTemplate.addTemplate(key, templateMarkup); + } + catch(error) + { + alert('ERROR: An error occurred while loading the UI: ' + error.message); + return; + } + + delete _templateData[key]; + + loadNextTemplate(); + }) + .fail(function () { + alert('ERROR: Loading template ' + key + '(' + _templateData[key] + ') failed!'); + }); + + return; + } + } + var compileTemplates = function () { for (var key in _templates) { diff --git a/nano/templates/layout_basic.tmpl b/nano/templates/layout_basic.tmpl new file mode 100644 index 00000000000..67fcd51f805 --- /dev/null +++ b/nano/templates/layout_basic.tmpl @@ -0,0 +1,3 @@ +
+
Initiating...
+
\ No newline at end of file diff --git a/nano/templates/layout_default.tmpl b/nano/templates/layout_default.tmpl new file mode 100644 index 00000000000..fed78460879 --- /dev/null +++ b/nano/templates/layout_default.tmpl @@ -0,0 +1,4 @@ +
{{:config.title}}
+
+
Initiating...
+
\ No newline at end of file