minor code tidies based on code review from sam
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/c895f774 Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/c895f774 Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/c895f774 Branch: refs/heads/0.6.0 Commit: c895f7742f2ae12ef9eb76c4138e7782d2834966 Parents: 4bf162e Author: Alex Heneveld <[email protected]> Authored: Thu Sep 19 23:10:34 2013 +0100 Committer: Alex Heneveld <[email protected]> Committed: Thu Sep 19 23:11:05 2013 +0100 ---------------------------------------------------------------------- usage/jsgui/src/main/webapp/assets/css/base.css | 3 - .../webapp/assets/css/bootstrap-responsive.css | 815 ------------------- .../main/webapp/assets/css/cssninja-tree.css | 77 -- .../jsgui/src/main/webapp/assets/css/styles.css | 1 - .../webapp/assets/img/icon-loading-radii.gif | Bin 88779 -> 0 bytes .../webapp/assets/js/view/application-tree.js | 50 +- .../webapp/assets/js/view/entity-activities.js | 3 +- .../main/webapp/assets/js/view/entity-config.js | 32 +- .../webapp/assets/js/view/entity-policies.js | 9 +- .../webapp/assets/js/view/entity-sensors.js | 18 +- .../webapp/assets/js/view/entity-summary.js | 6 +- .../main/webapp/assets/tpl/catalog/page.html | 2 +- .../src/main/webapp/assets/tpl/labs/page.html | 2 +- 13 files changed, 68 insertions(+), 950 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/css/base.css ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/css/base.css b/usage/jsgui/src/main/webapp/assets/css/base.css index 287c0e7..ccc0716 100644 --- a/usage/jsgui/src/main/webapp/assets/css/base.css +++ b/usage/jsgui/src/main/webapp/assets/css/base.css @@ -28,9 +28,6 @@ add-app .tab-content-scroller { overflow: auto !important; } -#application-content div#application-explorer { - /* padding-left: 52px; */ -} #application-content div#details { margin-left: 8px !important; } http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/css/bootstrap-responsive.css ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/css/bootstrap-responsive.css b/usage/jsgui/src/main/webapp/assets/css/bootstrap-responsive.css deleted file mode 100644 index 47b717c..0000000 --- a/usage/jsgui/src/main/webapp/assets/css/bootstrap-responsive.css +++ /dev/null @@ -1,815 +0,0 @@ -/*! - * Bootstrap Responsive v2.0.4 - * - * Copyright 2012 Twitter, Inc - * Licensed under the Apache License v2.0 - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Designed and built with all the love in the world @twitter by @mdo and @fat. - */ - -.clearfix { - *zoom: 1; -} - -.clearfix:before, -.clearfix:after { - display: table; - content: ""; -} - -.clearfix:after { - clear: both; -} - -.hide-text { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; -} - -.input-block-level { - display: block; - width: 100%; - min-height: 28px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; -} - -.hidden { - display: none; - visibility: hidden; -} - -.visible-phone { - display: none !important; -} - -.visible-tablet { - display: none !important; -} - -.hidden-desktop { - display: none !important; -} - -@media (max-width: 767px) { - .visible-phone { - display: inherit !important; - } - .hidden-phone { - display: none !important; - } - .hidden-desktop { - display: inherit !important; - } - .visible-desktop { - display: none !important; - } -} - -@media (min-width: 768px) and (max-width: 979px) { - .visible-tablet { - display: inherit !important; - } - .hidden-tablet { - display: none !important; - } - .hidden-desktop { - display: inherit !important; - } - .visible-desktop { - display: none !important ; - } -} - -@media (max-width: 480px) { - .nav-collapse { - -webkit-transform: translate3d(0, 0, 0); - } - .page-header h1 small { - display: block; - line-height: 18px; - } - input[type="checkbox"], - input[type="radio"] { - border: 1px solid #ccc; - } - .form-horizontal .control-group > label { - float: none; - width: auto; - padding-top: 0; - text-align: left; - } - .form-horizontal .controls { - margin-left: 0; - } - .form-horizontal .control-list { - padding-top: 0; - } - .form-horizontal .form-actions { - padding-right: 10px; - padding-left: 10px; - } - .modal { - position: absolute; - top: 10px; - right: 10px; - left: 10px; - width: auto; - margin: 0; - } - .modal.fade.in { - top: auto; - } - .modal-header .close { - padding: 10px; - margin: -10px; - } - .carousel-caption { - position: static; - } -} - -@media (max-width: 767px) { - body { - padding-right: 20px; - padding-left: 20px; - } - .navbar-fixed-top, - .navbar-fixed-bottom { - margin-right: -20px; - margin-left: -20px; - } - .container-fluid { - padding: 0; - } - .dl-horizontal dt { - float: none; - width: auto; - clear: none; - text-align: left; - } - .dl-horizontal dd { - margin-left: 0; - } - .container { - width: auto; - } - .row-fluid { - width: 100%; - } - .row, - .thumbnails { - margin-left: 0; - } - [class*="span"], - .row-fluid [class*="span"] { - display: block; - float: none; - width: auto; - margin-left: 0; - } - .input-large, - .input-xlarge, - .input-xxlarge, - input[class*="span"], - select[class*="span"], - textarea[class*="span"], - .uneditable-input { - display: block; - width: 100%; - min-height: 28px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - } - .input-prepend input, - .input-append input, - .input-prepend input[class*="span"], - .input-append input[class*="span"] { - display: inline-block; - width: auto; - } -} - -@media (min-width: 768px) and (max-width: 979px) { - .row { - margin-left: -20px; - *zoom: 1; - } - .row:before, - .row:after { - display: table; - content: ""; - } - .row:after { - clear: both; - } - [class*="span"] { - float: left; - margin-left: 20px; - } - .container, - .navbar-fixed-top .container, - .navbar-fixed-bottom .container { - width: 724px; - } - .span12 { - width: 724px; - } - .span11 { - width: 662px; - } - .span10 { - width: 600px; - } - .span9 { - width: 538px; - } - .span8 { - width: 476px; - } - .span7 { - width: 414px; - } - .span6 { - width: 352px; - } - .span5 { - width: 290px; - } - .span4 { - width: 228px; - } - .span3 { - width: 166px; - } - .span2 { - width: 104px; - } - .span1 { - width: 42px; - } - .offset12 { - margin-left: 764px; - } - .offset11 { - margin-left: 702px; - } - .offset10 { - margin-left: 640px; - } - .offset9 { - margin-left: 578px; - } - .offset8 { - margin-left: 516px; - } - .offset7 { - margin-left: 454px; - } - .offset6 { - margin-left: 392px; - } - .offset5 { - margin-left: 330px; - } - .offset4 { - margin-left: 268px; - } - .offset3 { - margin-left: 206px; - } - .offset2 { - margin-left: 144px; - } - .offset1 { - margin-left: 82px; - } - .row-fluid { - width: 100%; - *zoom: 1; - } - .row-fluid:before, - .row-fluid:after { - display: table; - content: ""; - } - .row-fluid:after { - clear: both; - } - .row-fluid [class*="span"] { - display: block; - float: left; - width: 100%; - min-height: 28px; - margin-left: 2.762430939%; - *margin-left: 2.709239449638298%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - } - .row-fluid [class*="span"]:first-child { - margin-left: 0; - } - .row-fluid .span12 { - width: 99.999999993%; - *width: 99.9468085036383%; - } - .row-fluid .span11 { - width: 91.436464082%; - *width: 91.38327259263829%; - } - .row-fluid .span10 { - width: 82.87292817100001%; - *width: 82.8197366816383%; - } - .row-fluid .span9 { - width: 74.30939226%; - *width: 74.25620077063829%; - } - .row-fluid .span8 { - width: 65.74585634900001%; - *width: 65.6926648596383%; - } - .row-fluid .span7 { - width: 57.182320438000005%; - *width: 57.129128948638304%; - } - .row-fluid .span6 { - width: 48.618784527%; - *width: 48.5655930376383%; - } - .row-fluid .span5 { - width: 40.055248616%; - *width: 40.0020571266383%; - } - .row-fluid .span4 { - width: 31.491712705%; - *width: 31.4385212156383%; - } - .row-fluid .span3 { - width: 22.928176794%; - *width: 22.874985304638297%; - } - .row-fluid .span2 { - width: 14.364640883%; - *width: 14.311449393638298%; - } - .row-fluid .span1 { - width: 5.801104972%; - *width: 5.747913482638298%; - } - input, - textarea, - .uneditable-input { - margin-left: 0; - } - input.span12, - textarea.span12, - .uneditable-input.span12 { - width: 714px; - } - input.span11, - textarea.span11, - .uneditable-input.span11 { - width: 652px; - } - input.span10, - textarea.span10, - .uneditable-input.span10 { - width: 590px; - } - input.span9, - textarea.span9, - .uneditable-input.span9 { - width: 528px; - } - input.span8, - textarea.span8, - .uneditable-input.span8 { - width: 466px; - } - input.span7, - textarea.span7, - .uneditable-input.span7 { - width: 404px; - } - input.span6, - textarea.span6, - .uneditable-input.span6 { - width: 342px; - } - input.span5, - textarea.span5, - .uneditable-input.span5 { - width: 280px; - } - input.span4, - textarea.span4, - .uneditable-input.span4 { - width: 218px; - } - input.span3, - textarea.span3, - .uneditable-input.span3 { - width: 156px; - } - input.span2, - textarea.span2, - .uneditable-input.span2 { - width: 94px; - } - input.span1, - textarea.span1, - .uneditable-input.span1 { - width: 32px; - } -} - -@media (min-width: 1200px) { - .row { - margin-left: -30px; - *zoom: 1; - } - .row:before, - .row:after { - display: table; - content: ""; - } - .row:after { - clear: both; - } - [class*="span"] { - float: left; - margin-left: 30px; - } - .container, - .navbar-fixed-top .container, - .navbar-fixed-bottom .container { -/* width: 1170px; */ - } - .span12 { - width: 1170px; - } - .span11 { - width: 1070px; - } - .span10 { - width: 970px; - } - .span9 { - width: 870px; - } - .span8 { - width: 770px; - } - .span7 { - width: 670px; - } - .span6 { - width: 570px; - } - .span5 { - width: 470px; - } - .span4 { - width: 370px; - } - .span3 { - width: 270px; - } - .span2 { - width: 170px; - } - .span1 { - width: 70px; - } - .offset12 { - margin-left: 1230px; - } - .offset11 { - margin-left: 1130px; - } - .offset10 { - margin-left: 1030px; - } - .offset9 { - margin-left: 930px; - } - .offset8 { - margin-left: 830px; - } - .offset7 { - margin-left: 730px; - } - .offset6 { - margin-left: 630px; - } - .offset5 { - margin-left: 530px; - } - .offset4 { - margin-left: 430px; - } - .offset3 { - margin-left: 330px; - } - .offset2 { - margin-left: 230px; - } - .offset1 { - margin-left: 130px; - } - .row-fluid { - width: 100%; - *zoom: 1; - } - .row-fluid:before, - .row-fluid:after { - display: table; - content: ""; - } - .row-fluid:after { - clear: both; - } - .row-fluid [class*="span"] { - display: block; - float: left; - width: 100%; - min-height: 28px; - margin-left: 2.564102564%; - *margin-left: 2.510911074638298%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - } - .row-fluid [class*="span"]:first-child { - margin-left: 0; - } - .row-fluid .span12 { - width: 100%; - *width: 99.94680851063829%; - } - .row-fluid .span11 { - width: 91.45299145300001%; - *width: 91.3997999636383%; - } - .row-fluid .span10 { - width: 82.905982906%; - *width: 82.8527914166383%; - } - .row-fluid .span9 { - width: 74.358974359%; - *width: 74.30578286963829%; - } - .row-fluid .span8 { - width: 65.81196581200001%; - *width: 65.7587743226383%; - } - .row-fluid .span7 { - width: 57.264957265%; - *width: 57.2117657756383%; - } - .row-fluid .span6 { - width: 48.717948718%; - *width: 48.6647572286383%; - } - .row-fluid .span5 { - width: 40.170940171000005%; - *width: 40.117748681638304%; - } - .row-fluid .span4 { - width: 31.623931624%; - *width: 31.5707401346383%; - } - .row-fluid .span3 { - width: 23.076923077%; - *width: 23.0237315876383%; - } - .row-fluid .span2 { - width: 14.529914530000001%; - *width: 14.4767230406383%; - } - .row-fluid .span1 { - width: 5.982905983%; - *width: 5.929714493638298%; - } - input, - textarea, - .uneditable-input { - margin-left: 0; - } - input.span12, - textarea.span12, - .uneditable-input.span12 { - width: 1160px; - } - input.span11, - textarea.span11, - .uneditable-input.span11 { - width: 1060px; - } - input.span10, - textarea.span10, - .uneditable-input.span10 { - width: 960px; - } - input.span9, - textarea.span9, - .uneditable-input.span9 { - width: 860px; - } - input.span8, - textarea.span8, - .uneditable-input.span8 { - width: 760px; - } - input.span7, - textarea.span7, - .uneditable-input.span7 { - width: 660px; - } - input.span6, - textarea.span6, - .uneditable-input.span6 { - width: 560px; - } - input.span5, - textarea.span5, - .uneditable-input.span5 { - width: 460px; - } - input.span4, - textarea.span4, - .uneditable-input.span4 { - width: 360px; - } - input.span3, - textarea.span3, - .uneditable-input.span3 { - width: 260px; - } - input.span2, - textarea.span2, - .uneditable-input.span2 { - width: 160px; - } - input.span1, - textarea.span1, - .uneditable-input.span1 { - width: 60px; - } - .thumbnails { - margin-left: -30px; - } - .thumbnails > li { - margin-left: 30px; - } - .row-fluid .thumbnails { - margin-left: 0; - } -} - -@media (max-width: 979px) { - body { - padding-top: 0; - } - .navbar-fixed-top, - .navbar-fixed-bottom { - position: static; - } - .navbar-fixed-top { - margin-bottom: 18px; - } - .navbar-fixed-bottom { - margin-top: 18px; - } - .navbar-fixed-top .navbar-inner, - .navbar-fixed-bottom .navbar-inner { - padding: 5px; - } - .navbar .container { - width: auto; - padding: 0; - } - .navbar .brand { - padding-right: 10px; - padding-left: 10px; - margin: 0 0 0 -5px; - } - .nav-collapse { - clear: both; - } - .nav-collapse .nav { - float: none; - margin: 0 0 9px; - } - .nav-collapse .nav > li { - float: none; - } - .nav-collapse .nav > li > a { - margin-bottom: 2px; - } - .nav-collapse .nav > .divider-vertical { - display: none; - } - .nav-collapse .nav .nav-header { - color: #999999; - text-shadow: none; - } - .nav-collapse .nav > li > a, - .nav-collapse .dropdown-menu a { - padding: 6px 15px; - font-weight: bold; - color: #999999; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - } - .nav-collapse .btn { - padding: 4px 10px 4px; - font-weight: normal; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - } - .nav-collapse .dropdown-menu li + li a { - margin-bottom: 2px; - } - .nav-collapse .nav > li > a:hover, - .nav-collapse .dropdown-menu a:hover { - background-color: #222222; - } - .nav-collapse.in .btn-group { - padding: 0; - margin-top: 5px; - } - .nav-collapse .dropdown-menu { - position: static; - top: auto; - left: auto; - display: block; - float: none; - max-width: none; - padding: 0; - margin: 0 15px; - background-color: transparent; - border: none; - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - } - .nav-collapse .dropdown-menu:before, - .nav-collapse .dropdown-menu:after { - display: none; - } - .nav-collapse .dropdown-menu .divider { - display: none; - } - .nav-collapse .navbar-form, - .nav-collapse .navbar-search { - float: none; - padding: 9px 15px; - margin: 9px 0; - border-top: 1px solid #222222; - border-bottom: 1px solid #222222; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - } - .navbar .nav-collapse .nav.pull-right { - float: none; - margin-left: 0; - } - .nav-collapse, - .nav-collapse.collapse { - height: 0; - overflow: hidden; - } - .navbar .btn-navbar { - display: block; - } - .navbar-static .navbar-inner { - padding-right: 10px; - padding-left: 10px; - } -} - -@media (min-width: 980px) { - .nav-collapse.collapse { - height: auto !important; - overflow: visible !important; - } -} http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/css/cssninja-tree.css ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/css/cssninja-tree.css b/usage/jsgui/src/main/webapp/assets/css/cssninja-tree.css deleted file mode 100644 index f9bc975..0000000 --- a/usage/jsgui/src/main/webapp/assets/css/cssninja-tree.css +++ /dev/null @@ -1,77 +0,0 @@ -/** - * Based on CSS Tree menu styles from CSS Ninja: view-source:http://www.thecssninja.com/css/css-tree-menu - */ - -.cssninja ol.tree { - padding: 0 0 0 30px; - width: 300px; -} - -.cssninja li { - position: relative; - margin-left: -15px; - list-style: none; -} - -.cssninja li.file { - margin-left: -1px !important; -} - -.cssninja li.file a { - /*background: url(../img/document.png) 0 0 no-repeat;*/ - /*color: #fff;*/ - padding-left: 21px; - text-decoration: none; - display: block; -} - -.cssninja li input { - position: absolute; - left: 0; - margin-left: 0; - opacity: 0; - z-index: 2; - cursor: pointer; - height: 1em; - width: 1em; - top: 0; -} - -.cssninja li input + ol { - background: url(../img/toggle-small-expand.png) 40px 0 no-repeat; - /* original value - does not render fine with bootstrap. - margin: -1.938em 0 0 -44px; *//* 15px */ - margin: -1.6em 0 0 -44px; - height: 1em; -} - -.cssninja li input + ol > li { - display: none; - margin-left: -14px !important; - padding-left: 1px; -} - -.cssninja li label { - background: url(../img/folder-horizontal.png) 15px 1px no-repeat; - /*cursor: pointer;*/ - display: block; - padding-left: 37px; -} - -.cssninja li input:checked + ol { - background: url(../img/toggle-small.png) 40px 5px no-repeat; - /* original value - does not work with bootstrap - margin: -1.25em 0 0 -44px; *//* 20px */ - margin: -1.963em 0 0 -44px; - padding: 1.563em 0 0 80px; - height: auto; -} - -.cssninja li input:checked + ol > li { - display: block; - margin: 0 0 0.125em; /* 2px */ -} - -.cssninja li input:checked + ol > li:last-child { - margin: 0 0 0.063em; /* 1px */ -} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/css/styles.css ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/css/styles.css b/usage/jsgui/src/main/webapp/assets/css/styles.css index 0643cf8..a148d85 100644 --- a/usage/jsgui/src/main/webapp/assets/css/styles.css +++ b/usage/jsgui/src/main/webapp/assets/css/styles.css @@ -1,4 +1,3 @@ @import url('bootstrap.css'); @import url('jquery.dataTables.css'); -@import url('cssninja-tree.css'); @import url('base.css'); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/img/icon-loading-radii.gif ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/img/icon-loading-radii.gif b/usage/jsgui/src/main/webapp/assets/img/icon-loading-radii.gif deleted file mode 100644 index 01024e2..0000000 Binary files a/usage/jsgui/src/main/webapp/assets/img/icon-loading-radii.gif and /dev/null differ http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js b/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js index 511e128..99eebcd 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js @@ -68,23 +68,25 @@ define([ removeNode: function(id) { $('#'+id, this.$el).parent().remove() + if (this.collection.isEmpty()) + this.renderFull(); }, updateNode: function(id, parentId, isApp) { // log("updating node "+id) var that = this; var nModel = that.collection.get(id); - var nEl = $('#'+id, that.$el) + var node = $('#'+id, that.$el) if (!isApp) { // autodiscover whether this is an app, looking at the model and the tree // (at least one should be available -- probably always the former, but...) if (nModel) { isApp = (id == nModel.get('applicationId')); } - else if (!isApp && nEl && nEl.parent().data('depth')==0) isApp = true; + else if (!isApp && node && node.parent().data('depth')==0) isApp = true; } if (!isApp && !parentId && nModel) parentId = nModel.get('parentId'); - if (!isApp && !parentId && nEl) parentId = nEl.closest("entity_tree_node_wrapper").data('parentId'); + if (!isApp && !parentId && node) parentId = node.closest("entity_tree_node_wrapper").data('parentId'); if (!isApp && !parentId) { log("no parentId yet available for "+id+"; skipping;") return false; @@ -92,36 +94,36 @@ define([ var statusIconUrl = nModel ? ViewUtils.computeStatusIcon(nModel.get("serviceUp"),nModel.get("serviceState")) : null; - var nEl2 = this.template({ + var newNode = this.template({ id:id, parentId:parentId, model:nModel, statusIconUrl:statusIconUrl }) - if (!nEl.length) { + if (!node.length) { // node does not exist, so add it - var pElC, depth; + var parentsChildren, depth; if (isApp) { - pElC = $('.lozenge-app-tree-wrapper', that.$el); - if (!pElC.length) { + parentsChildren = $('.lozenge-app-tree-wrapper', that.$el); + if (!parentsChildren.length) { // entire view must be created that.$el.html( '<div class="navbar_main_wrapper treeloz">'+ '<div id="tree-list" class="navbar_main treeloz">'+ '<div class="lozenge-app-tree-wrapper">'+ '</div></div></div>'); - pElC = $('.lozenge-app-tree-wrapper', that.$el); + parentsChildren = $('.lozenge-app-tree-wrapper', that.$el); } depth = 0; } else { - var pEl = $('#'+parentId, that.$el) - if (!pEl.length) { + var parent = $('#'+parentId, that.$el) + if (!parent.length) { // see if we can load the parent if (this.updateNode(parentId)) { - pEl = $('#'+parentId, that.$el); - if (!pEl.length) { + parent = $('#'+parentId, that.$el); + if (!parent.length) { log("no parent element yet available for "+id+" ("+parentId+") after parent load; skipping") return false; } @@ -130,12 +132,12 @@ define([ return false; } } - pElC = pEl.parent().children('.node-children') - depth = pEl.parent().data("depth")+1 + parentsChildren = parent.parent().children('.node-children') + depth = parent.parent().data("depth")+1 } // add it, with surrounding html, in parent's node-children child - var nEl3 = $( + var newNodeWrapper = $( '<div class="toggler-group tree-box '+ (depth==0 ? "outer" : "inner "+(depth%2==1 ? "depth-odd" : "depth-even")+ (depth==1 ? " depth-first" : "")) + '" data-depth="'+depth+'">'+ @@ -143,19 +145,19 @@ define([ '<div class="toggler-target hide node-children"></div>'+ '</div>') - $('#'+id, nEl3).html(nEl2); - $(pElC).append(nEl3); - this.addEventsToNode($(pElC)) + $('#'+id, newNodeWrapper).html(newNode); + $(parentsChildren).append(newNodeWrapper); + this.addEventsToNode($(parentsChildren)) } else { // updating - var $nEl = $(nEl), $nEl2 = $(nEl2); + var $node = $(node), $newNode = $(newNode); // preserve old display status (just chevron direction at present) - if ($nEl.find('.tree-node-state').hasClass('icon-chevron-down')) - $nEl2.find('.tree-node-state').removeClass('icon-chevron-right').addClass('icon-chevron-down') + if ($node.find('.tree-node-state').hasClass('icon-chevron-down')) + $newNode.find('.tree-node-state').removeClass('icon-chevron-right').addClass('icon-chevron-down') - $(nEl).html($nEl2) - this.addEventsToNode($(nEl)) + $(node).html($newNode) + this.addEventsToNode($(node)) } return true }, http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/entity-activities.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-activities.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-activities.js index 7106b3c..5c72b56 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-activities.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-activities.js @@ -26,6 +26,7 @@ define([ 'click #activities-root .toggleFullDetail':'toggleFullDetail' }, initialize:function () { + _.bindAll(this) this.$el.html(this.template({ })); this.$('#activities-root').html(_.template(ActivityTableHtml)) var that = this, @@ -61,7 +62,7 @@ define([ this.collection.fetch({reset: true}); }, render:function () { - this.updateActivitiesNow(this); + this.updateActivitiesNow(); return this; }, beforeClose:function () { http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/entity-config.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-config.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-config.js index 7ec7399..18e1025 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-config.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-config.js @@ -19,6 +19,7 @@ define([ 'click .toggleAutoRefresh':'toggleAutoRefresh' }, initialize:function () { + _.bindAll(this) this.$el.html(this.template({ })); var that = this, $table = this.$('#config-table'); @@ -73,12 +74,12 @@ define([ ViewUtils.addFilterEmptyButton(that.table); ViewUtils.addAutoRefreshButton(that.table); ViewUtils.addRefreshButton(that.table); - that.loadConfigMetadata(that); - that.updateConfigPeriodically(that); + that.loadConfigMetadata(); + that.updateConfigPeriodically(); that.toggleFilterEmpty(); }, render:function () { - this.updateConfigNow(this); + this.updateConfigNow(); return this; }, toggleFilterEmpty:function () { @@ -91,17 +92,21 @@ define([ this.refreshActive = isEnabled }, refreshNow:function () { - this.updateConfigNow(this); + this.updateConfigNow(); }, - updateConfigNow:function (that) { - ViewUtils.get(that, that.model.getConfigUpdateUrl(), function(data) { that.updateWithData(that, data) }, - { enablement: function() { return that.refreshActive } }); + isRefreshActive: function() { return this.refreshActive; }, + updateConfigNow:function () { + var that = this + ViewUtils.get(that, that.model.getConfigUpdateUrl(), function(data) { that.updateWithData(data) }, + { enablement: that.isRefreshActive }); }, - updateConfigPeriodically:function (that) { - ViewUtils.getRepeatedlyWithDelay(that, that.model.getConfigUpdateUrl(), function(data) { that.updateWithData(that, data) }, - { enablement: function() { return that.refreshActive } }); + updateConfigPeriodically:function () { + var that = this + ViewUtils.getRepeatedlyWithDelay(that, that.model.getConfigUpdateUrl(), function(data) { that.updateWithData(data) }, + { enablement: that.isRefreshActive }); }, - updateWithData: function (that, data) { + updateWithData: function (data) { + var that = this $table = that.$('#config-table'); ViewUtils.updateMyDataTable($table, data, function(value, name) { var metadata = that.configMetadata[name] @@ -119,7 +124,8 @@ define([ }); ViewUtils.processTooltips($table) }, - loadConfigMetadata: function(that) { + loadConfigMetadata: function() { + var that = this var url = that.model.getLinkByName('config'); $.get(url, function (data) { for (d in data) { @@ -131,7 +137,7 @@ define([ type:config["type"] } } - that.updateConfigNow(that); + that.updateConfigNow(); that.table.find('*[rel="tooltip"]').tooltip(); }).fail(that.onConfigMetadataFailure); }, http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/entity-policies.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-policies.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-policies.js index c09c395..4b8d880 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-policies.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-policies.js @@ -23,6 +23,7 @@ define([ "click .show-policy-config-modal":"showPolicyConfigModal" }, initialize:function () { + _.bindAll(this) this.$el.html(this.template({ })); var that = this; // fetch the list of policies and create a row for each one @@ -63,7 +64,7 @@ define([ if (that.activePolicy) { that.$("#policies-table tr[id='"+that.activePolicy+"']").addClass("selected"); that.showPolicyConfig(that.activePolicy); - that.refreshPolicyConfig(that); + that.refreshPolicyConfig(); } else { that.$("#policy-config").hide(); that.$("#policy-config-none-selected").show(); @@ -78,7 +79,7 @@ define([ }, refreshPolicyConfigNow:function () { - this.refreshPolicyConfig(this); + this.refreshPolicyConfig(); }, rowClick:function(evt) { @@ -148,10 +149,10 @@ define([ $table.dataTable().fnAdjustColumnSizing(); } } - that.refreshPolicyConfig(that); + that.refreshPolicyConfig(); }, - refreshPolicyConfig:function (that) { + refreshPolicyConfig:function() { if (that.viewIsClosed) return; var $table = that.$('#policy-config-table').dataTable(), $rows = that.$("tr.policy-config-row"); http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/entity-sensors.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-sensors.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-sensors.js index c564dff..919056c 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-sensors.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-sensors.js @@ -25,8 +25,8 @@ define([ }, initialize:function () { - this.$el.html(this.template()); _.bindAll(this); + this.$el.html(this.template()); var $table = this.$('#sensors-table'), that = this; @@ -70,8 +70,8 @@ define([ ViewUtils.addFilterEmptyButton(this.table); ViewUtils.addAutoRefreshButton(this.table); ViewUtils.addRefreshButton(this.table); - this.loadSensorMetadata() - this.updateSensorsPeriodically() + this.loadSensorMetadata(); + this.updateSensorsPeriodically(); this.toggleFilterEmpty(); return this; }, @@ -108,17 +108,19 @@ define([ /** * Loads current values for all sensors on an entity and updates sensors table. */ + isRefreshActive: function() { return this.refreshActive; }, updateSensorsNow:function () { var that = this - ViewUtils.get(that, that.model.getSensorUpdateUrl(), function(data) { that.updateWithData(that, data) }, - { enablement: function() { return that.refreshActive } }); + ViewUtils.get(that, that.model.getSensorUpdateUrl(), function(data) { that.updateWithData(data) }, + { enablement: that.isRefreshActive }); }, updateSensorsPeriodically:function () { var that = this - ViewUtils.getRepeatedlyWithDelay(that, that.model.getSensorUpdateUrl(), function(data) { that.updateWithData(that, data) }, - { enablement: function() { return that.refreshActive } }); + ViewUtils.getRepeatedlyWithDelay(that, that.model.getSensorUpdateUrl(), function(data) { that.updateWithData(data) }, + { enablement: that.isRefreshActive }); }, - updateWithData: function (that, data) { + updateWithData: function (data) { + var that = this $table = that.$('#sensors-table'); ViewUtils.updateMyDataTable($table, data, function(value, name) { var metadata = that.sensorMetadata[name] http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/js/view/entity-summary.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-summary.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-summary.js index 9c5e648..d0dbe8c 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-summary.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-summary.js @@ -10,6 +10,7 @@ define([ var EntitySummaryView = Backbone.View.extend({ template:_.template(SummaryHtml), initialize: function() { + _.bindAll(this) var that = this var ej = FormatJSON(this.model.toJSON()); this.$el.html(this.template({ @@ -25,7 +26,7 @@ define([ // (currently we just take the URL from that view) - and do the same for active tasks; if (this.options.sensors) { ViewUtils.getRepeatedlyWithDelay(this, this.options.sensors.getSensorUpdateUrl(), - function(data) { that.updateWithData(that, data) }); + function(data) { that.updateWithData(data) }); } else { // e.g. in tests log("no sensors available to EntitySummaryView") @@ -68,7 +69,8 @@ define([ }}) } }, - updateWithData: function (that, data) { + updateWithData: function (data) { + var that = this that.revealIfHasValue("service.isUp", that.$(".serviceUp"), null, data) that.revealIfHasValue("service.state", that.$(".status"), null, data) http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html b/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html index dd6f100..868b836 100644 --- a/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html +++ b/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html @@ -10,7 +10,7 @@ <i class="icon-br-refresh refresh handy" /> </div> </div> - <div class="navbar_main_wrapper cssninja"> + <div class="navbar_main_wrapper"> <div id="accordion-empty-to-create-info-message" class="label-message hide"> <div class="label-important full-width">ERROR</div> http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/c895f774/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html b/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html index 59632da..4dfb3b1 100644 --- a/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html +++ b/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html @@ -31,7 +31,7 @@ var swatch = function(bg, fg, bo) { } $(document).ready(function() { - // display stadard colours + // display standard color themese we use for easy reference var colors = [ // border colors //'#EEE', '#CCC', '#793',
