You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@brooklyn.apache.org by he...@apache.org on 2016/02/01 18:51:44 UTC
[11/50] [abbrv] brooklyn-ui git commit: applied general jsgui
prettiness from krome and others noticed
applied general jsgui prettiness from krome and others noticed
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo
Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/7e6c5243
Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/7e6c5243
Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/7e6c5243
Branch: refs/heads/0.5.0
Commit: 7e6c524366a2ecf519b01843b9b6f74b153e23d8
Parents: 381bff4
Author: Alex Heneveld <al...@cloudsoftcorp.com>
Authored: Mon Nov 26 15:04:53 2012 +0000
Committer: Alex Heneveld <al...@cloudsoftcorp.com>
Committed: Tue Nov 27 15:50:07 2012 -0800
----------------------------------------------------------------------
.../src/main/webapp/assets/css/prettybrook.css | 407 +++++++++++++++++--
.../assets/images/addApplication-plus-hover.png | Bin 0 -> 1620 bytes
.../assets/images/addApplication-plus.png | Bin 0 -> 1680 bytes
.../images/application-icon-add-hover.png | Bin 0 -> 1402 bytes
.../assets/images/application-icon-add.png | Bin 0 -> 1291 bytes
.../images/application-icon-refresh-hover.png | Bin 0 -> 1263 bytes
.../assets/images/application-icon-refresh.png | Bin 0 -> 1225 bytes
.../images/brooklyn-header-background.png | Bin 0 -> 2162 bytes
.../main/webapp/assets/images/brooklyn-logo.png | Bin 0 -> 7055 bytes
.../assets/images/main-menu-tab-active.png | Bin 0 -> 974 bytes
.../assets/images/main-menu-tab-hover.png | Bin 0 -> 985 bytes
.../main/webapp/assets/images/main-menu-tab.png | Bin 0 -> 985 bytes
.../assets/images/nav-tabs-background.png | Bin 0 -> 985 bytes
.../assets/images/roundedSummary-background.png | Bin 0 -> 998 bytes
.../webapp/assets/js/view/application-tree.js | 14 +-
.../src/main/webapp/assets/js/view/catalog.js | 30 +-
.../src/main/webapp/assets/js/view/home.js | 8 +-
.../main/webapp/assets/tpl/apps/details.html | 18 +-
.../main/webapp/assets/tpl/apps/summary.html | 2 +-
.../main/webapp/assets/tpl/catalog/page.html | 8 +-
.../webapp/assets/tpl/home/applications.html | 17 +-
.../main/webapp/assets/tpl/home/summaries.html | 6 +-
usage/jsgui/src/main/webapp/index.html | 4 +-
.../src/test/javascript/specs/home-spec.js | 5 +-
24 files changed, 439 insertions(+), 80 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/css/prettybrook.css
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/css/prettybrook.css b/usage/jsgui/src/main/webapp/assets/css/prettybrook.css
index edcc7dd..d9aae39 100644
--- a/usage/jsgui/src/main/webapp/assets/css/prettybrook.css
+++ b/usage/jsgui/src/main/webapp/assets/css/prettybrook.css
@@ -54,6 +54,10 @@ ul.dropdown-menu {
text-align: left;
}
+.navbar .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
+ background-color: #58AA33; /* that seems necessary to result in the color we want, viz ~ 77AA3E; */
+}
+
/* tabs eg catalog page */
.nav-tabs>li,.nav-pills>li {
float: left;
@@ -77,25 +81,28 @@ ul.dropdown-menu {
/* bootstrap overrides */
a {
- color: #075;
+ color: #382;
+}
+a:hover {
+ color: #65AA34;
}
code {
color: #273;
}
/* buttons (override bootstrap) */
.btn-info {
- background-color: #49cdaf;
- *background-color: #2fb496;
- background-image: -ms-linear-gradient(top, #5bdec0, #2fb496);
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bdec0), to(#2fb496));
- background-image: -webkit-linear-gradient(top, #5bdec0, #2fb496);
- background-image: -o-linear-gradient(top, #5bdec0, #2fb496);
- background-image: -moz-linear-gradient(top, #5bdec0, #2fb496);
- background-image: linear-gradient(top, #5bdec0, #2fb496);
+ background-color: #90C858;
+ *background-color: #609040;
+ background-image: -ms-linear-gradient(top, #90C858, #609040);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#90C858), to(#609040));
+ background-image: -webkit-linear-gradient(top, #90C858, #609040);
+ background-image: -o-linear-gradient(top, #90C858, #609040);
+ background-image: -moz-linear-gradient(top, #90C858, #609040);
+ background-image: linear-gradient(top, #90C858, #609040);
background-repeat: repeat-x;
- border-color: #2fb496 #2fb496 #1f7763;
+ border-color: #609040 #609040 #609040;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#5bdec0', endColorstr='#2fb496', GradientType=0);
+ filter: progid:dximagetransform.microsoft.gradient(startColorstr='#90C858', endColorstr='#609040', GradientType=0);
filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
@@ -104,13 +111,13 @@ code {
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled] {
- background-color: #2fb496;
- *background-color: #2aa085;
+ background-color: #609040;
+ *background-color: #508030;
}
.btn-info:active,
.btn-info.active {
- background-color: #248c74 \9;
+ background-color: #508030 \9;
}
/* unchanged from bootstrap
@@ -147,49 +154,106 @@ code {
/* home page squares */
+
+/* HOME BODY */
+#application-content {
+ background-color: #e8e8e8 !important;
+ padding-top: 30px !important;
+}
+
+.home-first-row {
+ padding: 0px;
+}
+
.home-summaries-row {
- text-align: center;
- margin: 0px 0px 30px 0px;
+ text-align: center;
+ margin: 0px 0px 30px 0px;
}
.roundedSummary {
- -webkit-border-radius: 15px;
- -moz-border-radius: 15px;
- border-radius: 15px;
- background-color: #f7f6e8;
- padding: 20px 20px;
- margin: 20px 40px;
- width: 240px;
- height: 160px;
- line-height: 1.2;
- font-size: 140%;
- display: inline-block;
- text-align: left;
+ float: left;
+ border: 1px solid #d4d4d4;
+ -webkit-border-radius: 15px;
+ -moz-border-radius: 15px;
+ border-radius: 15px;
+ background-color: #f7f6e8;
+ margin: 10px 15px 0px 0px;
+ padding: 20px 20px;
+ width: 264px;
+ height: 160px;
+ line-height: 1.2;
+ font-size: 140%;
+ display: inline-block;
+ text-align: left;
+ background: #f9f9f9 url(../images/roundedSummary-background.png) top
+ repeat-x !important;
+}
+
+.roundedSummary:last-child {
+ margin-right: 0px;
}
.roundedSummary:before { /* makes the summary vertically centered */
- content: '';
- display: inline-block;
- height: 100%;
- vertical-align: middle;
- margin-right: -0.25em; /* adjusts for horiz spacing */
+ content: '';
+ display: inline-block;
+ height: 100%;
+ vertical-align: middle;
+ margin-right: 0px !important;
+ /*
+ margin-right: -0.25em;
+ adjusts for horiz spacing */
}
.roundedSummaryText {
- display: inline-block;
- vertical-align: middle;
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.addApplication {
+ border: 1px solid #a1cb8c !important;
+ color: #505050 !important;
+ background: url(../images/addApplication-plus.png) no-repeat !important;
+ padding: 10px 0px 0px 74px !important;
+ width: 298px !important;
+ height: 201px !important;
+}
+
+.addApplication:hover {
+ border: 1px solid #58a82e !important;
+ color: #58a82e !important;
+ background: url(../images/addApplication-plus-hover.png) no-repeat
+ !important;
+}
+
+.home-summaries-row {
+ padding: 0px 0px 0px 0px !important;
+ margin: 0px !important;
}
.big {
font-size: 180%;
}
+.home-second-row {
+ background-color: #dddddd !important;
+ padding: 24px 0px 30px 0px !important;
+ border-top: 1px solid #efefef;
+ margin: 30px 0px 0px 0px;
+}
+
.home-widgets-row {
text-align: center;
}
.map-container {
- width: 45%;
+ -webkit-border-radius: 13px 13px 13px 13px;
+ -moz-border-radius: 13px 13px 13px 13px;
+ border-radius: 13px 13px 13px 13px;
+ background-color: #f7f7f7;
+ border: 1px solid #d4d4d4;
+ padding: 13px !important;
+ width: 440px;
+ margin: 10px 0px 0px 13px !important;
display: inline-block;
text-align: left;
vertical-align: top;
@@ -221,11 +285,14 @@ code {
color: inherit;
}
.apps-summary-container {
- width: 45%;
+ width: 440px;
display: inline-block;
text-align: left;
vertical-align: top;
- margin: 0px 20px;
+ display: inline-block;
+ margin: 10px -6px 0px 24px;
+ text-align: left;
+ vertical-align: top;
}
#new-application-resource {
text-align: right;
@@ -345,7 +412,9 @@ line-height: 18px;
}
.cssninja ol.tree {
padding: 0;
+ width: auto;
}
+
/* effector modal dialog */
#params td {
vertical-align: middle;
@@ -521,10 +590,13 @@ div.for-empty-table {
margin-top: 8px;
}
.help-logo-right {
+ padding-left: 1.5em;
+ padding-top: 1.5em;
float: right;
}
.help-logo-right img {
- border: 3px solid #333030;
+ border: 3px solid #6C6C6C;
+ border-radius: 2px;
}
.control-group {
margin-top: 6px;
@@ -532,6 +604,16 @@ div.for-empty-table {
}
+#application-explorer div#summary {
+ padding-right: 16px;
+ padding-left: 24px;
+ margin-left: -16px;
+}
+#application-explorer div#summary textarea {
+ width: 100%;
+ cursor: auto;
+}
+
/* catalog */
.accordion-head {
-webkit-border-radius: 5px;
@@ -551,16 +633,23 @@ div.for-empty-table {
overflow-x: scroll;
overflow-y: scroll;
background-color: white;
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
}
.accordion-head:hover {
background-color: #E0E4E0;
cursor: hand; cursor: pointer;
}
+.catalog-accordion-wrapper {
+ margin-bottom: 6px;
+ background-color: #F0F0F0;
+ border-radius: 5px;
+}
.accordion-item {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
- margin: 9px -4px;
+ margin-top: -1px;
border: 1px solid lightgray;
}
.accordion-nav-row:hover {
@@ -570,9 +659,25 @@ div.for-empty-table {
.accordion-nav-row.active {
font-weight: bold;
}
+.catalog-details-generic {
+ padding-left: 16px;
+ padding-right: 25px;
+ padding-top: 8px;
+ padding-bottom: 8px;
+}
.catalog-details h3 {
- margin-bottom: 8px;
+ margin-bottom: 8px;
}
+.catalog-details-generic textarea {
+ width: 100%;
+ cursor: auto;
+}
+.catalog-details#details-empty {
+ padding-top: 60px;
+ padding-bottom: 180px;
+ text-align: center;
+}
+
.float-right {
float: right;
}
@@ -674,3 +779,223 @@ input[type="file"] {
width: 300px;
}
+
+
+
+
+/* KROME STYLES */
+BODY {
+ background-color: #e8e8e8 !important;
+ color: #505050 !important;
+}
+
+textarea {
+ white-space: pre;
+ word-wrap: normal;
+ overflow-x: scroll;
+}
+
+/* HEADER */
+.logo {
+ height: 44px !important;
+ width: 195px !important;
+ background: url(../images/brooklyn-logo.png) no-repeat;
+ margin-top: 50px;
+}
+
+.navbar-inner {
+ min-height: 105px !important;
+ border-bottom: 2px solid #a9a9a9;
+ background: #383737 url(../images/brooklyn-header-background.png)
+ repeat-x top;
+}
+
+.menubar-top {
+ padding-right: 0px !important
+}
+
+.navbar .nav {
+ margin-right: 0px !important;
+}
+
+.navbar .nav>li {
+ margin: 35px 0px 0px 3px !important;
+}
+
+.navbar .nav>li>a {
+ border: 1px solid #151515;
+ padding: 8px 11px !important;
+ font-size: 15px !important;
+ background: url(../images/main-menu-tab.png) top !important;
+}
+
+.navbar .nav>li>a.active {
+ background: url(../images/main-menu-tab-active.png) top !important;
+ margin-top: 3px !important
+}
+
+.navbar .nav>li>a:hover {
+ color: #FFF !important;
+ background: url(../images/main-menu-tab-hover.png) top !important;
+}
+
+.table-bordered thead:first-child tr:first-child th:first-child,.table-bordered tbody:first-child tr:first-child td:first-child
+ {
+ -webkit-border-top-left-radius: 13px !important;
+ -moz-border-top-left-radius: 13px !important;
+ border-top-left-radius: 13px !important;
+ background-color: #f7f7f7 !important;
+}
+
+.table-bordered thead:first-child tr:first-child th:last-child,.table-bordered tbody:first-child tr:first-child td:last-child
+ {
+ -webkit-border-top-right-radius: 13px !important;
+ -moz-border-top-right-radius: 13px !important;
+ border-top-right-radius: 13px !important;
+ background-color: #f7f7f7 !important;
+}
+
+.table-condensed th {
+ background-color: #f7f7f7 !important;
+ padding: 8px;
+}
+
+.table-bordered tr td {
+ background-color: #f7f7f7 !important;
+ padding: 8px;
+}
+
+.table-bordered thead:last-child tr:last-child th:first-child,.table-bordered tbody:last-child tr:last-child td:first-child
+ {
+ -webkit-border-top-right-radius: 0 0 0 13px !important;
+ -moz-border-top-right-radius: 0 0 0 13px !important;
+ border-bottom-right-radius: 13px;
+}
+
+.table-bordered thead:last-child tr:last-child th:last-child,.table-bordered tbody:last-child tr:last-child td:last-child
+ {
+ -webkit-border-top-right-radius: 0 0 13px 0 !important;
+ -moz-border-top-right-radius: 0 0 13px 0 !important;
+ border-bottom-left-radius: 13px;
+}
+/*HOME BODY */
+
+/*APP PAGE*/
+.row-fluid .span4 {
+ width: 300px !important;
+ margin-left: 34px !important;
+ float: left !important;
+ margin-top: 10px !important
+}
+
+.row-fluid .span8 {
+ width: 607px !important;
+ margin-right: -26px !important;
+ float: left !important;
+ margin-top: 10px !important
+}
+
+.navbar_top {
+ background-color: #f0f0f0 !important;
+ -webkit-border-radius: 13px 13px 0 0 !important;
+ -moz-border-radius: 13px 13px 0 0 !important;
+ border-radius: 13px 13px 0 0 !important;
+ border: 1px solid #d3d3d3;
+ border-bottom: none;
+}
+
+.navbar_top h3 {
+ line-height: 24px !important;
+}
+
+.navbar_main_wrapper {
+ background-color: #ffffff !important;
+ -webkit-border-radius: 0 0 13px 13px !important;
+ -moz-border-radius: 0 0 13px 13px !important;
+ border-radius: 0 0 13px 13px !important;
+ border: 1px solid #d3d3d3;
+ border-top: 4px solid #e2e2e2;
+}
+
+.apps-tree-toolbar {
+ float: right;
+ margin: 0px !important;
+ margin-top: -18px !important;
+}
+
+.icon-plus-sign {
+ background: url(../images/application-icon-add.png) top left !important;
+ width: 15px !important;
+ height: 15px !important;
+}
+
+.icon-plus-sign:hover {
+ background: url(../images/application-icon-add-hover.png) top left
+ !important;
+}
+
+.icon-refresh {
+ background: url(../images/application-icon-refresh.png) top left
+ !important;
+ width: 15px !important;
+ height: 15px !important;
+}
+
+.icon-refresh:hover {
+ background: url(../images/application-icon-refresh-hover.png) top left
+ !important;
+}
+
+#details {
+ background-color: #f0f0f0 !important;
+ -webkit-border-radius: 13px 13px 13px 13px !important;
+ -moz-border-radius: 13px 13px 13px 13px !important;
+ border-radius: 13px 13px 13px 13px !important;
+ border: 1px solid #d3d3d3;
+ padding-top: 9px;
+}
+
+.tab-content {
+ background-color: #ffffff !important;
+ border: none !important;
+ -webkit-border-radius: 0 0 13px 13px !important;
+ -moz-border-radius: 0 0 13px 13px !important;
+ border-radius: 0 0 13px 13px !important;
+}
+
+.nav-tabs {
+ border-bottom: 4px solid #e2e2e2 !important;
+}
+
+.nav-tabs>.active>a,.nav-tabs>.active {
+ color: #549e2b !important;
+}
+
+.nav-tabs>.active>a,.nav-tabs>.active a {
+ background: #ffffff !important;
+}
+
+.nav-tabs>li>a {
+ color: #444444 !important;
+ border: 1px solid #dddddd !important;
+ background: #ffffff url(../images/nav-tabs-background.png) top
+ !important;
+ padding-bottom: 7px !important;
+ padding-top: 9px !important;
+}
+
+.nav-tabs>li>a:hover {
+ color: #549e2b !important;
+ background: #ffffff none !important;
+}
+
+#effectors-table th {
+ background: #ffffff !important
+}
+/*APP PAGE*/
+
+/* END KROME STYLES */
+
+
+
+
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/addApplication-plus-hover.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/addApplication-plus-hover.png b/usage/jsgui/src/main/webapp/assets/images/addApplication-plus-hover.png
new file mode 100755
index 0000000..7137d51
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/addApplication-plus-hover.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/addApplication-plus.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/addApplication-plus.png b/usage/jsgui/src/main/webapp/assets/images/addApplication-plus.png
new file mode 100755
index 0000000..c4ff5e6
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/addApplication-plus.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/application-icon-add-hover.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/application-icon-add-hover.png b/usage/jsgui/src/main/webapp/assets/images/application-icon-add-hover.png
new file mode 100755
index 0000000..95c9bc8
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/application-icon-add-hover.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/application-icon-add.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/application-icon-add.png b/usage/jsgui/src/main/webapp/assets/images/application-icon-add.png
new file mode 100755
index 0000000..b795bc5
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/application-icon-add.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh-hover.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh-hover.png b/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh-hover.png
new file mode 100755
index 0000000..6d23b8f
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh-hover.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh.png b/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh.png
new file mode 100755
index 0000000..4f13df4
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/application-icon-refresh.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/brooklyn-header-background.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/brooklyn-header-background.png b/usage/jsgui/src/main/webapp/assets/images/brooklyn-header-background.png
new file mode 100755
index 0000000..3399da7
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/brooklyn-header-background.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/brooklyn-logo.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/brooklyn-logo.png b/usage/jsgui/src/main/webapp/assets/images/brooklyn-logo.png
new file mode 100755
index 0000000..27b2e5a
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/brooklyn-logo.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-active.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-active.png b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-active.png
new file mode 100755
index 0000000..50e905b
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-active.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-hover.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-hover.png b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-hover.png
new file mode 100755
index 0000000..cb8a106
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab-hover.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/main-menu-tab.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/main-menu-tab.png b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab.png
new file mode 100755
index 0000000..ae62fd5
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/main-menu-tab.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/nav-tabs-background.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/nav-tabs-background.png b/usage/jsgui/src/main/webapp/assets/images/nav-tabs-background.png
new file mode 100755
index 0000000..043df7c
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/nav-tabs-background.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/images/roundedSummary-background.png
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/images/roundedSummary-background.png b/usage/jsgui/src/main/webapp/assets/images/roundedSummary-background.png
new file mode 100755
index 0000000..4e6f579
Binary files /dev/null and b/usage/jsgui/src/main/webapp/assets/images/roundedSummary-background.png differ
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/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 b9fd28e..e5dd18e 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
@@ -4,8 +4,8 @@
*/
define([
"underscore", "jquery", "backbone", "model/app-tree", "./entity-details", "model/entity-summary",
- "model/application", "text!tpl/apps/tree-item.html"
-], function (_, $, Backbone, AppTree, EntityDetailsView, EntitySummary, Application, TreeItemHtml) {
+ "model/application", "text!tpl/apps/tree-item.html", "text!tpl/apps/details.html"
+], function (_, $, Backbone, AppTree, EntityDetailsView, EntitySummary, Application, TreeItemHtml, EntityDetailsEmptyHtml) {
var ApplicationTreeView = Backbone.View.extend({
tagName:"ol",
@@ -28,6 +28,9 @@ define([
this.collection.each(function (app) {
that.$el.append(that.buildTree(app))
})
+ if (this.collection.size()==0) {
+ that.$el.append("<li><i>No applications</i></li>")
+ }
this.highlightEntity();
if (this.detailsView) {
this.detailsView.render()
@@ -39,6 +42,11 @@ define([
if (!that.selectedEntityId)
that.displayEntityId(app0, app0)
});
+ } else {
+ _.defer(function() {
+ $("div#details").html( _.template(EntityDetailsEmptyHtml, {}) )
+ $("div#details").find("a[href=\"#"+"summary"+"\"]").tab('show')
+ })
}
}
return this
@@ -115,6 +123,8 @@ define([
model:entitySummary,
application:app
})
+ console.log("loading")
+ console.log(that.detailsView.render().el)
$("div#details").html(that.detailsView.render().el)
// preserve the tab selected before
$("div#details").find("a[href=\"#"+whichTab+"\"]").tab('show')
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/js/view/catalog.js
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/js/view/catalog.js b/usage/jsgui/src/main/webapp/assets/js/view/catalog.js
index e9f9ef0..a31044f 100644
--- a/usage/jsgui/src/main/webapp/assets/js/view/catalog.js
+++ b/usage/jsgui/src/main/webapp/assets/js/view/catalog.js
@@ -39,6 +39,13 @@ define([
this.activeItem = null
this.genericTabs = ['applications','entities','policies']
_.bindAll(this, "renderLocationsAccordion");
+
+ var that = this;
+ _.defer(function() {
+ console.log($("#applications div.accordion-head"))
+ that.toggleAccordionDiv($("#applications div.accordion-head"), false)
+ $("#details-empty").show()
+ })
},
render:function (eventName) {
this.$el.html(_.template(CatalogPageHtml, {}))
@@ -78,13 +85,24 @@ define([
accordion.find("div[id='"+this.activeItem+"']").addClass('active')
},
toggleAccordion: function(event) {
- var hidden = $(event.currentTarget).next()[0].style.display!='block'
- $(event.currentTarget).parent().parent().find('.accordion-head').removeClass('active')
- $(event.currentTarget).parent().parent().find('.accordion-body').hide('fast')
+ this.toggleAccordionDiv($(event.currentTarget), true)
+ },
+ toggleAccordionDiv: function(elt, animation) {
+ var hidden = elt.next()[0].style.display!='block'
+ elt.parent().parent().find('.accordion-head').removeClass('active')
+ if (animation)
+ elt.parent().parent().find('.accordion-body').hide('fast')
+ else
+ elt.parent().parent().find('.accordion-body').hide()
+
if (hidden) {
- $(event.currentTarget).addClass('active')
- $(event.currentTarget).next().show('fast')
- this.activeAccordion = $(event.currentTarget).parent().attr('id')
+ elt.addClass('active')
+ if (animation)
+ elt.next().show('fast')
+ else
+ elt.next().show()
+
+ this.activeAccordion = elt.parent().attr('id')
} else {
this.activeAccordion = null
}
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/js/view/home.js
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/js/view/home.js b/usage/jsgui/src/main/webapp/assets/js/view/home.js
index 67b246a..e73e58d 100644
--- a/usage/jsgui/src/main/webapp/assets/js/view/home.js
+++ b/usage/jsgui/src/main/webapp/assets/js/view/home.js
@@ -10,9 +10,9 @@ define([
var HomeView = Backbone.View.extend({
tagName:"div",
- className:"container container-fluid",
events:{
'click #add-new-application':'createApplication',
+ 'click .addApplication':'createApplication',
'click .delete':'deleteApplication'
},
@@ -57,7 +57,7 @@ define([
}
this.callPeriodically(function() {
- that.refresh(that);
+ //that.refresh(that);
}, 5000)
this.refresh(this)
},
@@ -96,9 +96,9 @@ define([
renderCollection:function () {
var $tableBody = this.$('#applications-table-body').empty()
if (this.collection==null)
- $tableBody.append("<td colspan='3'><i>No data available</i></td>");
+ $tableBody.append("<tr><td colspan='3'><i>No data available</i></td></tr>");
else if (this.collection.isEmpty())
- $tableBody.append("<td colspan='3'><i>No applications deployed</i></td>");
+ $tableBody.append("<tr><td colspan='3'><i>No applications deployed</i></td></tr>");
else this.collection.each(function (app) {
var appView = new HomeView.AppEntryView({model:app})
if (this._appViews[app.cid]) {
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/tpl/apps/details.html
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/tpl/apps/details.html b/usage/jsgui/src/main/webapp/assets/tpl/apps/details.html
index 88a471e..e6b7f06 100644
--- a/usage/jsgui/src/main/webapp/assets/tpl/apps/details.html
+++ b/usage/jsgui/src/main/webapp/assets/tpl/apps/details.html
@@ -1,9 +1,3 @@
-<!--
-<div id="details-header">
- <h3>Details</h3>
- <dl class="dl-horizontal"/>
-</div>
- -->
<div class="tabbable">
<ul class="nav nav-tabs entity-tabs">
<li><a href="#summary" data-toggle="tab">Summary</a></li>
@@ -14,11 +8,11 @@
<li><a href="#activities" data-toggle="tab">Activity</a></li>
</ul>
<div class="tab-content">
- <div class="tab-pane" id="summary">Please select an application/entity from the left.</div>
- <div class="tab-pane" id="config">Please select an application/entity from the left.</div>
- <div class="tab-pane" id="sensors">Please select an application/entity from the left.</div>
- <div class="tab-pane" id="effectors">Please select an application/entity from the left.</div>
- <div class="tab-pane" id="policies">Please select an application/entity from the left.</div>
- <div class="tab-pane" id="activities">Please select an application/entity from the left.</div>
+ <div class="tab-pane" id="summary"><i>Nothing selected</i></div>
+ <div class="tab-pane" id="config"><i>Nothing selected</i></div>
+ <div class="tab-pane" id="sensors"><i>Nothing selected</i></div>
+ <div class="tab-pane" id="effectors"><i>Nothing selected</i></div>
+ <div class="tab-pane" id="policies"><i>Nothing selected</i></div>
+ <div class="tab-pane" id="activities"><i>Nothing selected</i></div>
</div>
</div>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/tpl/apps/summary.html
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/tpl/apps/summary.html b/usage/jsgui/src/main/webapp/assets/tpl/apps/summary.html
index f35171c..baf8863 100644
--- a/usage/jsgui/src/main/webapp/assets/tpl/apps/summary.html
+++ b/usage/jsgui/src/main/webapp/assets/tpl/apps/summary.html
@@ -1 +1 @@
-<textarea readonly="readonly" rows="25" style="width:90%;"><%= entity %></textarea>
+<textarea readonly="readonly" rows="25"><%= entity %></textarea>
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/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 ec893d3..18497b7 100644
--- a/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html
+++ b/usage/jsgui/src/main/webapp/assets/tpl/catalog/page.html
@@ -18,6 +18,8 @@
Select the category of the item type you wish to add.
</div>
+<div class="catalog-accordion-wrapper">
+
<div id="applications" class="accordion-item">
<div class="accordion-head">
Applications
@@ -42,11 +44,15 @@
</div>
<div class="accordion-body hide"></div>
</div>
-
+
+</div>
</div>
</div>
<div class="span8" id="details">
+ <div id="details-empty" class="catalog-details hide">
+ <i>Nothing selected</i>
+ </div>
<div id="details-applications" class="catalog-details hide"/>
<div id="details-entities" class="catalog-details hide"/>
<div id="details-policies" class="catalog-details hide"/>
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/tpl/home/applications.html
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/tpl/home/applications.html b/usage/jsgui/src/main/webapp/assets/tpl/home/applications.html
index 467b00d..cad411c 100644
--- a/usage/jsgui/src/main/webapp/assets/tpl/home/applications.html
+++ b/usage/jsgui/src/main/webapp/assets/tpl/home/applications.html
@@ -1,10 +1,14 @@
<!-- Applications page template -->
-<div class="row" id="application-resource">
+<div class="home-first-row container container-fluid">
-<div class="home-summaries-row"></div>
-<br/>
+ <div class="row home-summaries-row"><!-- inserted by JS (templated by summaries.html) --></div>
-<div class="home-widgets-row">
+</div>
+
+<div class="home-second-row"><div class="container container-fluid">
+
+ <div class="row home-widgets-row">
+
<div class="map-container">
<div id="circles-map" class="circles-map">
<div id="circles-map-message" class="circles-map-message">(map loading)</div>
@@ -28,7 +32,8 @@
Add Application</button>
</div>
</div>
-</div>
+
+ </div>
+</div></div>
-</div>
<div id="modal-container"></div>
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/assets/tpl/home/summaries.html
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/assets/tpl/home/summaries.html b/usage/jsgui/src/main/webapp/assets/tpl/home/summaries.html
index 37f0cc3..2e9dc68 100644
--- a/usage/jsgui/src/main/webapp/assets/tpl/home/summaries.html
+++ b/usage/jsgui/src/main/webapp/assets/tpl/home/summaries.html
@@ -10,7 +10,9 @@
templates available
</div></div>
-->
- <span><div class="roundedSummary"><div class="roundedSummaryText">
+ <div class="roundedSummary"><div class="roundedSummaryText">
<span class="big"><%- locations.size() %></span> location<%- locations.size()==1 ? "" : "s" %> configured<br/>
<!-- with <span class="big">14</span> active machines -->
- </div></div></span>
+ </div></div>
+
+ <button class="roundedSummary addApplication" type="button">add application</button>
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/main/webapp/index.html
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/main/webapp/index.html b/usage/jsgui/src/main/webapp/index.html
index c12acb0..74fb404 100644
--- a/usage/jsgui/src/main/webapp/index.html
+++ b/usage/jsgui/src/main/webapp/index.html
@@ -41,9 +41,7 @@
</a>
<a class="brand" href="#"></a>
- <div class="logo">
- <img src="/assets/img/brooklyn.png" height="60"/>
- </div>
+ <div class="logo"><!-- added via CSS --></div>
<div class="nav-collapse menubar-top">
<ul class="nav">
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/7e6c5243/usage/jsgui/src/test/javascript/specs/home-spec.js
----------------------------------------------------------------------
diff --git a/usage/jsgui/src/test/javascript/specs/home-spec.js b/usage/jsgui/src/test/javascript/specs/home-spec.js
index 3e2da1f..d720675 100644
--- a/usage/jsgui/src/test/javascript/specs/home-spec.js
+++ b/usage/jsgui/src/test/javascript/specs/home-spec.js
@@ -41,8 +41,9 @@ define([
view.close()
})
- it('should be a div#application-resource', function () {
- expect(view.$('div#application-resource').length).toEqual(1)
+ it('should have a div#home-first-row and div#home-second-row', function () {
+ expect(view.$('div.home-first-row').length).toEqual(1)
+ expect(view.$('div.home-second-row').length).toEqual(1)
})
it('should contain an apps table and a new button', function () {