[Kimchi-devel] [PATCH 5/9] Adding new-ui to Gingerbase (Host tab)

From: samhenri <samuel.guimaraes(a)eldorado.org.br&gt; Signed-off-by: samhenri <samuel.guimaraes(a)eldorado.org.br&gt; --- src/wok/plugins/gingerbase/.gitignore | 2 +- src/wok/plugins/gingerbase/configure.ac | 1 - src/wok/plugins/gingerbase/ui/config/tab-ext.xml | 2 +- src/wok/plugins/gingerbase/ui/css/Makefile.am | 11 +- .../plugins/gingerbase/ui/css/src/gingerbase.scss | 29 + .../gingerbase/ui/css/src/modules/_host.scss | 172 ++++++ .../gingerbase/ui/css/theme-default/host.css | 289 ---------- .../gingerbase/ui/css/theme-default/report-add.css | 39 -- .../ui/css/theme-default/report-rename.css | 41 -- .../ui/css/theme-default/repository-add.css | 44 -- .../ui/css/theme-default/repository-edit.css | 90 --- src/wok/plugins/gingerbase/ui/images/Makefile.am | 2 - src/wok/plugins/gingerbase/ui/images/logo.ico | Bin 1214 -> 15086 bytes .../gingerbase/ui/images/theme-default/Makefile.am | 20 - .../ui/images/theme-default/host-icon-sprite.png | Bin 1034 -> 0 bytes .../images/theme-default/kimchi-loading15x15.gif | Bin 1653 -> 0 bytes .../gingerbase/ui/js/src/gingerbase.host.js | 642 +++++++++++---------- src/wok/plugins/gingerbase/ui/pages/host.html.tmpl | 211 +++---- .../gingerbase/ui/pages/report-add.html.tmpl | 46 +- .../gingerbase/ui/pages/report-rename.html.tmpl | 42 +- .../gingerbase/ui/pages/repository-add.html.tmpl | 124 ++-- .../gingerbase/ui/pages/repository-edit.html.tmpl | 138 ++--- 22 files changed, 759 insertions(+), 1186 deletions(-) create mode 100644 src/wok/plugins/gingerbase/ui/css/src/gingerbase.scss create mode 100644 src/wok/plugins/gingerbase/ui/css/src/modules/_host.scss delete mode 100644 src/wok/plugins/gingerbase/ui/css/theme-default/host.css delete mode 100644 src/wok/plugins/gingerbase/ui/css/theme-default/report-add.css delete mode 100644 src/wok/plugins/gingerbase/ui/css/theme-default/report-rename.css delete mode 100644 src/wok/plugins/gingerbase/ui/css/theme-default/repository-add.css delete mode 100644 src/wok/plugins/gingerbase/ui/css/theme-default/repository-edit.css delete mode 100644 src/wok/plugins/gingerbase/ui/images/theme-default/Makefile.am delete mode 100644 src/wok/plugins/gingerbase/ui/images/theme-default/host-icon-sprite.png delete mode 100644 src/wok/plugins/gingerbase/ui/images/theme-default/kimchi-loading15x15.gif diff --git a/src/wok/plugins/gingerbase/.gitignore b/src/wok/plugins/gingerbase/.gitignore index 96e8ab4..fd46e05 100644 --- a/src/wok/plugins/gingerbase/.gitignore +++ b/src/wok/plugins/gingerbase/.gitignore @@ -22,7 +22,6 @@ contrib/DEBIAN/control contrib/gingerbase.spec.fedora contrib/gingerbase.spec.suse contrib/make-deb.sh -*.min.css *.min.js *.gmo stamp-po @@ -35,3 +34,4 @@ po/gen-pot *.rej *.pem ui/pages/help/*/*.html +ui/css/gingerbase.css \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/configure.ac b/src/wok/plugins/gingerbase/configure.ac index 00aba89..055c8f8 100644 --- a/src/wok/plugins/gingerbase/configure.ac +++ b/src/wok/plugins/gingerbase/configure.ac @@ -75,7 +75,6 @@ AC_CONFIG_FILES([ ui/config/Makefile ui/css/Makefile ui/images/Makefile - ui/images/theme-default/Makefile ui/js/Makefile ui/pages/Makefile ui/pages/help/Makefile diff --git a/src/wok/plugins/gingerbase/ui/config/tab-ext.xml b/src/wok/plugins/gingerbase/ui/config/tab-ext.xml index 2d2d9bd..8366f1f 100644 --- a/src/wok/plugins/gingerbase/ui/config/tab-ext.xml +++ b/src/wok/plugins/gingerbase/ui/config/tab-ext.xml @@ -3,7 +3,7 @@ <tab> <access role="admin" mode="admin"/> <access role="user" mode="none"/> - + <class>host</class> <title>Host</title> <path>plugins/gingerbase/host.html</path> </tab> diff --git a/src/wok/plugins/gingerbase/ui/css/Makefile.am b/src/wok/plugins/gingerbase/ui/css/Makefile.am index 3e19c65..dd0676f 100644 --- a/src/wok/plugins/gingerbase/ui/css/Makefile.am +++ b/src/wok/plugins/gingerbase/ui/css/Makefile.am @@ -15,12 +15,9 @@ # See the License for the specific language governing permissions and # limitations under the License. -EXTRA_DIST = theme-default - cssdir = $(datadir)/wok/plugins/gingerbase/ui/css -dist_css_DATA = theme-default.min.css - -theme-default.min.css: theme-default/*.css - cat $^ > $@ +dist_css_DATA = gingerbase.css -CLEANFILES = theme-default.min.css +gingerbase.css: src/gingerbase.scss + echo "Compiling .scss file $<" + sassc -s expanded $< $(@:.scss=.css) diff --git a/src/wok/plugins/gingerbase/ui/css/src/gingerbase.scss b/src/wok/plugins/gingerbase/ui/css/src/gingerbase.scss new file mode 100644 index 0000000..d279a8b --- /dev/null +++ b/src/wok/plugins/gingerbase/ui/css/src/gingerbase.scss @@ -0,0 +1,29 @@ +/* + * Ginger Base + * + * Copyright IBM, Corp. 2015 + * + * Code derived from Project Kimchi + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +// Core variables +@import "../../../../../../../ui/css/src/modules/wok-variables"; + +// Compass Mixins +@import "../../../../../../../ui/css/src/vendor/compass-mixins/lib/compass"; + +// Hosts + +@import "modules/host" \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/ui/css/src/modules/_host.scss b/src/wok/plugins/gingerbase/ui/css/src/modules/_host.scss new file mode 100644 index 0000000..b986278 --- /dev/null +++ b/src/wok/plugins/gingerbase/ui/css/src/modules/_host.scss @@ -0,0 +1,172 @@ +// +// Project Wok +// +// Copyright IBM, Corp. 2015 +// +// Code derived from Project Kimchi +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +/* Main Host Dashboard section */ + +.host-dashboard { + padding-top: 40px; + padding-bottom: 50px; + background: #eee; + .container { + padding-left: 83px !important; // Overriding container padding to align according to mockups + padding-right: 73px !important; + } + h3 { + font-family: $font-family-light; + font-size: 21pt; + margin: 0 0 13px 0; + } +} + +.host-dashboard .col-md-3 { + padding: 0 14px; + > div { + background: #fff; + padding: 13px 20px 20px; + } +} + + +/* End of Host Dashboard */ + + +/* Line chart objects related to Hosts page */ + +#container-chart-cpu, +#container-chart-memory, +#container-chart-disk-io, +#container-chart-network-io { + border-top: 1px solid #eeeeee; + border-bottom: 2px solid #3a393b; + padding: 2px 0; + height: 99px; + width: 310px; +} + + +/* End of Line chart objects */ + + +/* Host Panels Container and Panels */ + +#host-info-container { + padding-top: 53px; + margin: 0 -8px; +} + +#host-info-container .col-md-4 { + width: 486px; + padding-left: 26px; + padding-right: 26px; +} + +#software-update-section { + margin-top: 24px; + border-top: 1px solid #b0b0b0; + padding-top: 24px; +} + +// TEMPORARY FIX TO LAYOUT UNTIL WOK.LIST WIDGET IS DONE +#repositories-grid, +#available-reports-grid { + .wok-list-content { + height: 517px; + overflow-x: hidden; + overflow-y: auto; + } + .dropdown.menu-flat { + float: right; + margin-right: 1px; + } +} + +// END OF TEMPORARY FIX + +/* Basic Information */ + +#host-info-container { + padding-top: 10px; + .basic-information-list { + height: 517px; + overflow-x: hidden; + overflow-y: auto; + margin: 0; + @extend .row; // Extending bootstrap .row clearfix util + .basic-information-list dt { + font-weight: 600; + font-size: 14.5pt; + line-height: 12px; + } + .basic-information-list dd { + font-size: 12.5pt; + font-weight: 400; + margin-bottom: 12px; + } + } +} + + +/* End of Basic Information */ + + +/* Debug Report */ + +#available-reports-grid .wok-list-cell { + padding-left: 10px; +} + + +/* End of Debug Report */ + + +/* Software Updates */ + + +/* Colgroups for low resolution screens */ + +.software-update-name, +.software-update-repos { + min-width: 224px; +} + +.software-update-version, +.software-update-arch { + min-width: 200px; +} + + +/* End of Colgroups */ + + +/* Software Update Accordion */ + +.host-panel #software-updates-progress-textarea { + border: 1px solid #ddd; + box-sizing: border-box; + height: 100px; + padding: .2em .5em; + resize: vertical; +} + + +/* End of Software Update Accordion */ + + +/* End of Software Updates */ diff --git a/src/wok/plugins/gingerbase/ui/css/theme-default/host.css b/src/wok/plugins/gingerbase/ui/css/theme-default/host.css deleted file mode 100644 index 59c0595..0000000 --- a/src/wok/plugins/gingerbase/ui/css/theme-default/host.css +++ /dev/null @@ -1,289 +0,0 @@ -/* - * Project Ginger Base - * - * Copyright IBM, Corp. 2013-2015 - * - * Code derived from Project Kimchi - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -.host-panel { - font-size: 12px; - margin-bottom: 100px; -} - -.host-panel .logo-container, .host-panel .info-container, -.host-panel .section-label, .host-panel .section-value { - display: inline-block; - vertical-align: top; -} - -.host-panel .section-label { - display: inline-block; - margin-right: 1em; - vertical-align: top; -} - -.host-panel .logo { - background: url("plugins/gingerbase/images/icon-vm.png") no-repeat left top; - height: 128px; - width: 128px; -} - -.host-panel .hostname { - text-decoration: underline; -} - -.host-panel .action-panel { - margin-top: 2em; - padding-left: 10px; -} - -.host-panel .button-icon { - background: url("../images/theme-default/host-icon-sprite.png") no-repeat - left top; - display: inline-block; - height: 12px; - width: 12px; -} - -.host-panel .action-icon-stop { - background-position: -14px 0; -} - -.host-panel .action-icon-restart { - background-position: -28px 0; -} - -.host-panel .action-icon-download { - background-position: -42px 0; -} - -.host-panel .action-icon-connect { - background-position: -56px 0; -} - -.host-panel .action-icon-add { - background-position: -70px 0; -} - -.host-panel .action-icon-edit { - background-position: -84px 0; -} - -.host-panel .action-icon-remove { - background-position: -98px 0; -} - -.host-panel button:disabled .action-icon-start { - background-position: 0 -14px; -} - -.host-panel button:disabled .action-icon-stop { - background-position: -14px -14px; -} - -.host-panel button:disabled .action-icon-restart { - background-position: -28px -14px; -} - -.host-panel button:disabled .action-icon-download { - background-position: -42px -14px; -} - -.host-panel button:disabled .action-icon-connect { - background-position: -56px -14px; -} - -.host-panel button:disabled .action-icon-add { - background-position: -70px -14px; -} - -.host-panel button:disabled .action-icon-edit { - background-position: -84px -14px; -} - -.host-panel button:disabled .action-icon-remove { - background-position: -98px -14px; -} - -.host-panel .info-container { - padding-top: 16px; - width: 890px; -} - -.host-panel .section-header { - background: #EEE; - border-radius: 5px; - cursor: pointer; - line-height: 2em; - margin: 1em 0 1em; - padding-left: 6px; -} - -.host-panel .section-header:hover { - background: #06f; - color: white; -} - -.host-panel .section-content { - padding-left: 1em; -} - -.host-panel .section-header .arrow { - border-color: transparent; - border-style: solid; - display: inline-block; - margin-right: 6px; - width: 0; -} - -.host-panel .section-header[aria-expanded="true"] .arrow { - border-top-color: black; - border-width: 8px 4px 0; - border-bottom: none; -} - -.host-panel .section-header[aria-expanded="true"]:hover .arrow { - border-top-color: white; -} - -.host-panel .section-header[aria-expanded="false"] .arrow { - border-left-color: black; - border-right: none; - border-width: 4px 0 4px 8px; -} - -.host-panel .section-header[aria-expanded="false"]:hover .arrow { - border-left-color: white; -} - -.host-panel .section-row { - line-height: 1.6em; - margin-bottom: 1em; -} - -.host-panel .section-label { - width: 100px; -} - -#frequency-textbox { - width: 20px; -} - -#container-chart-cpu, -#container-chart-memory, -#container-chart-disk-io, -#container-chart-network-io { - border: 1px solid white; - box-shadow: 2px 2px 2px gray, 2px -2px 2px gray, -2px -2px 2px gray, -2px - 2px 2px gray; - height: 100px; - width: 500px; -} - -#container-chart-disk-io .disk-write, -#container-chart-network-io .network-sent { - stroke: #f80; -} - -/* Debug Report */ -.cell-text-wrapper { - margin-left: 10px; -} - -.host-panel #available-reports-grid { - border-color: #ddd; - height: 400px; - width: 850px; -} - -.host-panel select#available-reports-list { - width: 300px; -} - -.host-panel select#available-reports-list option { - margin: .2em 1em; -} - -.debug-report-name, -.debug-report-time { - width: 424px; -} - -#id-debug-img { - background: url(../images/theme-default/kimchi-loading15x15.gif) 12px - center no-repeat; - padding-left: 23px; -} - -/* End of Debug Report */ - -/* Software Updates */ -.host-panel #software-updates-grid { - border-color: #ddd; - height: 300px; - width: 850px; -} - -.software-update-name, -.software-update-repos { - width: 224px; -} - -.software-update-version, -.software-update-arch { - width: 200px; -} - -.host-panel #software-updates-progress-textarea { - border: 1px solid #ddd; - box-sizing: border-box; - height: 100px; - padding: .2em .5em; - resize: vertical; - width: 852px; -} -/* End of Software Updates */ - -/* Repository */ -.host-panel #repositories-grid { - border-color: #ddd; - height: 200px; - width: 850px; -} - -.host-panel #repositories-grid .repository-id { - width: 120px; -} - -.host-panel #repositories-grid .repository-name { - width: 640px; -} - -.host-panel #repositories-grid .repository-enabled { - width: 88px; -} - -.host-panel #repositories-grid .repository-baseurl.deb { - width: 400px; -} - -.host-panel #repositories-grid .repository-enabled.deb { - width: 100px; -} - -.host-panel #repositories-grid .repository-gpgcheck.deb { - width: 150px; -} -/* End of Repository */ diff --git a/src/wok/plugins/gingerbase/ui/css/theme-default/report-add.css b/src/wok/plugins/gingerbase/ui/css/theme-default/report-add.css deleted file mode 100644 index 124a53c..0000000 --- a/src/wok/plugins/gingerbase/ui/css/theme-default/report-add.css +++ /dev/null @@ -1,39 +0,0 @@ -/* - * Project Ginger Base - * - * Copyright IBM, Corp. 2013-2015 - * - * Code derived from Project Kimchi - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -#report-add-window { - height: 300px; - width: 400px; -} - -#report-add-window .field { - font-size: 12px; -} - -#report-name-textbox { - margin: 0; - width: 100%; -} - -.info-add-debug-report { - font-size: 12px; - color: #999999; - font-weight: lighter; - font-family: 'Helvetica Neue', Helvetica, Arial; -} diff --git a/src/wok/plugins/gingerbase/ui/css/theme-default/report-rename.css b/src/wok/plugins/gingerbase/ui/css/theme-default/report-rename.css deleted file mode 100644 index e2b3813..0000000 --- a/src/wok/plugins/gingerbase/ui/css/theme-default/report-rename.css +++ /dev/null @@ -1,41 +0,0 @@ -/* - * Project Ginger Base - * - * Copyright IBM, Corp. 2014-2015 - * - * Code derived from Project Kimchi - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -#report-rename-window { - height: 300px; - width: 400px; -} - -#report-rename-window .field { - font-size: 12px; -} - -#report-name-textbox { - -moz-box-sizing: border-box; - box-sizing: border-box; - margin: 0; - width: 100%; -} - -.info-debug-report-rename { - font-size: 12px; - color: #999999; - font-weight: lighter; - font-family: 'Helvetica Neue', Helvetica, Arial; -} diff --git a/src/wok/plugins/gingerbase/ui/css/theme-default/repository-add.css b/src/wok/plugins/gingerbase/ui/css/theme-default/repository-add.css deleted file mode 100644 index acf50e2..0000000 --- a/src/wok/plugins/gingerbase/ui/css/theme-default/repository-add.css +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Project Ginger Base - * - * Copyright IBM, Corp. 2014-2015 - * - * Code derived from Project Kimchi - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -#repository-add-window { - height: 500px; - width: 1000px; -} - -#repository-add-window span.required { - color: red; - padding-left: 5px; - vertical-align: top; -} - -#repository-add-window .textbox-wrapper input[type="text"] { - box-sizing: border-box; - width: 100%; -} - -#repository-add-window .textbox-wrapper label { - vertical-align: middle; -} - -#isMirrorLabel { - font-size: 14px; - font-weight: lighter; - font-family: 'Helvetica Neue', Helvetica, Arial; -} diff --git a/src/wok/plugins/gingerbase/ui/css/theme-default/repository-edit.css b/src/wok/plugins/gingerbase/ui/css/theme-default/repository-edit.css deleted file mode 100644 index 2a3425d..0000000 --- a/src/wok/plugins/gingerbase/ui/css/theme-default/repository-edit.css +++ /dev/null @@ -1,90 +0,0 @@ -/* - * Project Ginger Base - * - * Copyright IBM, Corp. 2014-2015 - * - * Code derived from Project Kimchi - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -.yum div#repository-edit-window { - height: 680px; - width: 1000px; -} - -.deb div#repository-edit-window { - height: 480px; - width: 1000px; -} - - -.repository-edit-fieldset { - float: left; - padding: 0 30px; - width: 95%; -} - -.repository-edit-wrapper-label, .repository-edit-wrapper-controls { - display: inline-block; - height: 30px; - line-height: 30px; - font-size: 14px; - vertical-align: top; -} - -.repository-edit-wrapper-label { - margin-top: 10px; - width: 150px; -} - -.repository-edit-wrapper-controls label { - vertical-align: middle; -} - -.repository-edit-wrapper-controls { - width: 100%; -} - -.repository-edit-wrapper-controls input[type="text"] { - font-size: 16px; - height: 30px; - line-height: 30px; - padding: 0 10px; - width: 100%; - -moz-box-sizing: border-box; - box-sizing: border-box; - border: 1px solid #CCCCCC; -} - - -.repository-edit-wrapper-controls input[type="text"][readonly] { - color: #bbb; - background-color: #fafafa; -} - - -.repository-edit-wrapper-controls input[type="text"][disabled] { - color: #bbb; - background-color: #fafafa; - cursor: not-allowed; -} - - -.deb .yum{ - display: none; -} - - -.yum .deb{ - display: none; -} diff --git a/src/wok/plugins/gingerbase/ui/images/Makefile.am b/src/wok/plugins/gingerbase/ui/images/Makefile.am index 34109bd..7243188 100644 --- a/src/wok/plugins/gingerbase/ui/images/Makefile.am +++ b/src/wok/plugins/gingerbase/ui/images/Makefile.am @@ -15,8 +15,6 @@ # See the License for the specific language governing permissions and # limitations under the License. -SUBDIRS = theme-default - imagedir = $(datadir)/wok/plugins/gingerbase/ui/images dist_image_DATA = *.png *.ico diff --git a/src/wok/plugins/gingerbase/ui/images/logo.ico b/src/wok/plugins/gingerbase/ui/images/logo.ico index 446143f066a60f479b2cb8f8d04ab3c97ff60e56..1d998c2543576a16c72e49630317afb8e1373b38 100644 GIT binary patch literal 15086 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 bLvKw_5T{H{Hi%=kc3}MAXJ2X`9G>?-JFBHw literal 1214 zcma)*3rLeu6vyu=X_;nPV)$&PPF)r(wTQ|dTGOUtnOdf0mZ=cR#99xbub1{BqnD9^ z^Z>PV6h)fUny6#CN{3di2P{*h2ek@Oq0a4o*=I}2Iv?krbAR`oKi_vQA0faVCr83o zF{!X2#Dx$Nz}$(sm^sgR<Jj30yCMGpMl1z837jm3H1$<DU4IV>Tbdw<FM-;Hi<#et z=I}n~iB^qh8{XzCNyvT<I;$&znmT~?eFXZgAE@Om?1h(6Iq+2e1-ca!zOAO7n3*}; zXq6n?2kF<!f%cez;-Fgx4$e+xo{WR;oqhc_OW;#nF!Zm|JK}m8gi6aC+##`QA5PmJ zfeZ(o(}%&&1P5#*1vVbnssk~XhN5bNz=T)>5^+BS=V54SJ|^z)5I7%kU;>-skiq*{ z5B^=eF<T)pK9+)bV;9UCK>t-HOi+bkR-wK1xpfXL;S<?ho1pQ5gYzxiHR~=e+XHS( zYe7QMZb3IjWV72H-JpD~6z(tbgwn1o$D2s!YteWNJS!i9l%iW?+34Lvr*KL(6{_X| zobEjAb{lD|4qsmYvGF;~r0Aunc#>=c)0W4s|D{#(q9~vaX{rGms=((Wn*~LeWqIu} zkGvlzwaxjL25hey2bVweu<xK*t+@Oa_)UKTK^x4IwmKMOjm@oL`l)}_NGPy}tdb}w zHa>H`ji2N7m}Xsj#j7-`#=Dv}`)h&)9th^&^dR%>WH_MB8KcIXVf8p&s1xD|_k)R- zrk$Z0-|Gf}&4Au$KhU$k?3YR5by~D9M&-q$=ocNz4!IY&p7%OxuJf&+Ei-G(23hU; zHTLhMtjFR9ExVbPQVLzBFlROcIZ|#jmX6fm_hsVa3XP<aKAeAt8dqp&oBW=V^+d>Q zkcNnm%Ds?ggd^Rv2~9_o82cv;p6LSBD_g_s-n1uZ8#<EeLwTm~LE9J!Zdo@M&*jFU zoM+Z%F5)(8$8y`Wz~%Pd;Nlx@aH{<lk}}CcRMRXZMD&%Uhz3Ze$jpg#uec1IlFMPW MDQ4iZEk#_;cNAJoqyPW_ diff --git a/src/wok/plugins/gingerbase/ui/images/theme-default/Makefile.am b/src/wok/plugins/gingerbase/ui/images/theme-default/Makefile.am deleted file mode 100644 index 1fc98a3..0000000 --- a/src/wok/plugins/gingerbase/ui/images/theme-default/Makefile.am +++ /dev/null @@ -1,20 +0,0 @@ -# -# Ginger Base -# -# Copyright IBM, Corp. 2015 -# -# Licensed under the Apache License, Version 2.0 (the "License"); -# you may not use this file except in compliance with the License. -# You may obtain a copy of the License at -# -# http://www.apache.org/licenses/LICENSE-2.0 -# -# Unless required by applicable law or agreed to in writing, software -# distributed under the License is distributed on an "AS IS" BASIS, -# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -# See the License for the specific language governing permissions and -# limitations under the License. - -imagedir = $(datadir)/wok/plugins/gingerbase/ui/images/theme-default - -dist_image_DATA = *.png *.gif diff --git a/src/wok/plugins/gingerbase/ui/images/theme-default/host-icon-sprite.png b/src/wok/plugins/gingerbase/ui/images/theme-default/host-icon-sprite.png deleted file mode 100644 index da1cd3f2562a5905a526446bcc8fc18bea06c734..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1034 zcmV+l1oiugP)<h;3K|Lk000e1NJLTq003?P000^Y1^@s6R_JLg00006VoOIv0RI60 z0RN!9r;`8x010qNS#tmY3ljhU3ljkVnw%H_000McNliru-3t>283nlSO%wnC03B&m zSad^gZEa<4bN~PV002XBWnpw>WFU8GbZ8()Nlj2>E@cM*00VAGL_t(&-tAexPZU8E z{`PW&1_K4^OH?eZvAftnL5(5A#KOeLoryLc6xvbn7idfrLqY*-qLqe%L|Ypgg$i36 z(dbjkBSwPpvl)`j+}`fa-u^(2muzw~^LF01^X{8@Zysm_jzUN2Fh`A~Pjc5hKFL~I z+Z}W#NVXC{Y>}KuY7;pNNspw5tO0f7IFeP8D-r4|QCJ)u*CII!fKd<0S(2@?9Y=DD z<R_9!@=PZG-V7bLl9r_@9LG4P1)Rq+9Y?Z{<af)|`7qr|9MBxV)c`acbbCfT&pQC{ z%j$mX<hUFic+YA-2XN6mak_;`9K$+|XK?mUTkTPj&CIsEF5cU<hDHKoBi7iJvbM^i z*Tus8!czN9a>$8s1<N-8RRC8_`$GnE?vb2Jz_2+0dq-p)ngI3#?S24@sTh|bQ+;d5 zH%uEL`5>TIAzA4bYua?6Ovagcnjz|Ai5Da5sM6$aQ8E^l$E3xZb^24#IlFC{{Sv!X zdPZ`HoHhZhMyRZj95%WP!xe@3m<5`5?4yL_;89M%??>JmIN;83>nfaa#_lVU`y{Vr z67H9I<>i9?7&xxqKI>29L{6meTNYI%0Emdw!G8E&QVE-1Rcq#UWYToK0q{&jHq+Sd zU}FNnI)H(=d=J2sh`dW;({;UEMO8gxC-hsZHn6+_8Cz8V%OQ7`GXQ2(brnD(BP{Cx z=6&CP5~WnH*XNDysWO?Qs#^et%pdJCfS-x(Dpi%PY)T=^F&E8^3~dd>ISl}e&Opgd z>jQ8Oz$E}@0sK%^x9UJ%4m8_i!$G%aL_`u-2dYWWvJAJ-u<F2q`TaRWw_eh}pDyEv z>yyFRKMi0z&>mIQrid&iVqA_4oV3~tBC;bQJ7_QMEcIHnC?X#LytKL>s%r052kP~D zY<0ls{5RDBFDZ*`N~hftRMj`pW7t-CT|^!ky^4A7udB@<*0kwB7vI-)nq=l_0(fe5 zkBi7gBF9Bcoc6<NF-#g4k&RAyOj^9%=3_<YamMC0fYCtLR}r}oxmAjYmj^hLTt`+1 zRCTyh@)?Dxh{Y^e+NuMpIv5&N7WDCVBl5M=0B!+z9Oa;-3`iRt9+5!hy{f(jFa_X- zh^)1x14RNBkv{-#tLjpkD=*u5$B=13xe4GPc-8~JKL<=Y@!??g0{{R307*qoM6N<$ Ef;%S0RsaA1 diff --git a/src/wok/plugins/gingerbase/ui/images/theme-default/kimchi-loading15x15.gif b/src/wok/plugins/gingerbase/ui/images/theme-default/kimchi-loading15x15.gif deleted file mode 100644 index aaa4f85a0560dcb59d4bb70154a9144417aae926..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1653 zcmZ?wbhEHb6krfwcz&0`fx$V3fzy*s(30KRoyj+pP0*a%B9B4Xkl)0X$H9|dJd8D} zo<ZDBSSFF7*jZT0OhTc9Q7nTgk3rREDud*7MxI>8&Ju=(ISf+93MQOdag7Y~1hic{ z8T#{u6)cohTNtM^7+W$J#50+i$>`cj=^O84k`pyFn#{1$Ur8%a&i6QjtgEuCfQhw> zh77A6gQ$gokA@_-E$2dp^>Sv?oMy2Rvbjr`S1FsTIOwZtnQE_R*m$2oUC1KhF@wT7 z#vS5TPBXdYi#jqhIC*|#&}Xr)`pY25?86wZk@$x}Azj<#4}*rAu{Vcnu(UhJUj}_& zGsWW!mvn9Irz#jqI|d0m<_4Kq$D4?%x#%8bJFV#KwS(tqvz9fdTmMyIV-~+CKU<>^ zTODbStQ;$e9OEp8kfaJrQB(IojUXN?PfLA&1ruKlE$<Ybz{O>Dnh|c+IZj3l84L_z z+ZiGkGQ_8gg)Ec{ZB|VbVu;;p8Ir+}TJcZ8St};J)7e)ugI_wAy~kUSA^Gq;v#nzB zo6<uZ9TN=&l6EuXHCx41&a>X&p6tkweNrgxtWY&KLrITauKX0wDL;*ZSPITdWuHCl z7S2#|o1wN-skGcGd-j}YNrw7v?ff;HUH7htly%83WoVk=SR=P3TA8QnVNZtdt|Td^ z4tBRT;l<gOCKJSuq^f)gOk<w3o@>%d>z1S5joVY2V;E+x4Cszxn7#dGQiZ}|@k{wq ze5<)H#@>~ixp+mvx~nC^*GqKvReGJxyd=J8Z|Hp0)LG8{Q?7j|(|J;(^S(;?X-VtX z{Ej0{$vo>WNUb@RHtpd12Emt&YTJ7ve>HRaY*WxWB$BmO<7<oVrMfE&d+u577yI7H zdv${AuTG6`J!)PD74G*(XRN&WpI$)mKewN2NU*bGfUA+70W%{51B2pE7EU3C{|q`n zHZYS2Ffee)GW_S1@z}87U^9oXR?LYF3lFyoD0|KE*tqCuBO@a=9coY=j!k!j<aB0i zc<9u4hfS*nq@!EHIP1=djf>s;v1`@Ep>^V-!(BqkNq@`*laF`Fn|H~0Zd!7(0h{Hf zM42F;^~FLc<zy?bzucZ38xtI`nPf?{Nk)rZI#dI#a%KcAJ>AR3%!JJ}Tb!mjcL>V+ z&Dl|qe5_B>QtnB`#6;Il`9QBD85<TlO;@&EX5(p~fXzf_h=~b~c^s@tPtrczcWUF8 zl$)Y)G4W`lxU|rj6$Xj!z4E$EBA!9O@K)2-%Q<1V)NzW4rQ4Q{qQ@s^Df6<iU^CYa zVJ@$f%ZvcUgKd2BZZRt+Jap&~-N|`mN5EtIK6cxtnin4*pO_@<TefG1V5)aFPwc)q zGcP6L3rdhvk&Uz{R5;QluAbJjV`8#<o~Uk<jm4+?Cwh5=mxY`NNH{%#3wux+Vs{|2 sX~(-16pJpOC{Q`pufUDnn>s|9;tWh`McC5^G?`;~3OSj#0+YEl0GD)I?EnA( diff --git a/src/wok/plugins/gingerbase/ui/js/src/gingerbase.host.js b/src/wok/plugins/gingerbase/ui/js/src/gingerbase.host.js index 0d52b92..641a806 100644 --- a/src/wok/plugins/gingerbase/ui/js/src/gingerbase.host.js +++ b/src/wok/plugins/gingerbase/ui/js/src/gingerbase.host.js @@ -3,8 +3,6 @@ * * Copyright IBM, Corp. 2013-2015 * - * Code derived from Project Kimchi - * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at @@ -17,87 +15,92 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -kimchi.host={}; +kimchi.host = {}; kimchi.host_main = function() { - var expand = function(header, toExpand) { - var controlledNode = $(header).attr('aria-controls'); - $('#' + controlledNode)[toExpand ? 'removeClass' : 'addClass']('hidden'); - $(header).attr('aria-expanded', toExpand ? 'true' : 'false'); - }; - + "use strict"; var repositoriesGrid = null; var initRepositoriesGrid = function(repo_type) { - var gridFields=[]; - if (repo_type == "yum") { - gridFields=[{ - name: 'repo_id', - label: i18n['GGBREPO6004M'], - 'class': 'repository-id' - }, { - name: 'config[repo_name]', - label: i18n['GGBREPO6005M'], - 'class': 'repository-name' - }, { - name: 'enabled', - label: i18n['GGBREPO6009M'], - 'class': 'repository-enabled' - }]; - } - else if (repo_type == "deb") { - gridFields=[{ - name: 'baseurl', - label: i18n['GGBREPO6006M'], - makeTitle: true, - 'class': 'repository-baseurl deb' - }, { - name: 'enabled', - label: i18n['GGBREPO6009M'], - 'class': 'repository-enabled deb' - }, { - name: 'config[dist]', - label: "dist", - 'class': 'repository-gpgcheck deb' - }, { - name: 'config[comps]', - label: "comps", - 'class': 'repository-gpgcheck deb' - }]; - } - else { - gridFields=[{ + var gridFields = []; + if (repo_type === "yum") { + gridFields = [{ name: 'repo_id', label: i18n['GGBREPO6004M'], - 'class': 'repository-id' - }, { - name: 'enabled', - label: i18n['GGBREPO6009M'], - 'class': 'repository-enabled' - }, { - name: 'baseurl', - label: i18n['GGBREPO6006M'], - makeTitle: true, - 'class': 'repository-baseurl' - }]; + 'class': 'repository-id', + type: 'name' + }, { + name: 'config[display_repo_name]', + label: i18n['GGBREPO6005M'], + 'class': 'repository-name', + type: 'description' + }, { + name: 'enabled', + label: i18n['GGBREPO6009M'], + 'class': 'repository-enabled', + type: 'status' + }]; + } else if (repo_type === "deb") { + gridFields = [{ + name: 'baseurl', + label: i18n['GGBREPO6006M'], + makeTitle: true, + 'class': 'repository-baseurl deb', + type: 'description' + }, { + name: 'enabled', + label: i18n['GGBREPO6009M'], + 'class': 'repository-enabled deb', + type: 'status' + }, { + name: 'config[dist]', + label: "dist", + 'class': 'repository-gpgcheck deb' + }, { + name: 'config[comps]', + label: "comps", + 'class': 'repository-gpgcheck deb' + }]; + } else { + gridFields = [{ + name: 'repo_id', + label: i18n['GGBREPO6004M'], + 'class': 'repository-id', + type: 'name' + }, { + name: 'enabled', + label: i18n['GGBREPO6009M'], + 'class': 'repository-enabled', + type: 'status' + }, { + name: 'baseurl', + label: i18n['GGBREPO6006M'], + makeTitle: true, + 'class': 'repository-baseurl', + type: 'description' + }]; } - repositoriesGrid = new wok.widget.Grid({ - container: 'repositories-grid-container', + repositoriesGrid = new wok.widget.List({ + container: 'repositories-section', id: 'repositories-grid', title: i18n['GGBREPO6003M'], toolbarButtons: [{ id: 'repositories-grid-add-button', label: i18n['GGBREPO6012M'], + class: 'fa fa-plus-circle', onClick: function(event) { - wok.window.open({url:'plugins/gingerbase/repository-add.html', - class: repo_type}); + wok.window.open({ + url: 'plugins/gingerbase/repository-add.html', + class: repo_type + }); } }, { id: 'repositories-grid-enable-button', label: i18n['GGBREPO6016M'], + class: 'fa fa-play-circle-o', disabled: true, onClick: function(event) { var repository = repositoriesGrid.getSelected(); - if(!repository) { + if (!repository) { return; } var name = repository['repo_id']; @@ -110,31 +113,36 @@ kimchi.host_main = function() { }, { id: 'repositories-grid-edit-button', label: i18n['GGBREPO6013M'], + class: 'fa fa-pencil', disabled: true, onClick: function(event) { var repository = repositoriesGrid.getSelected(); - if(!repository) { + if (!repository) { return; } kimchi.selectedRepository = repository['repo_id']; - wok.window.open({url:'plugins/gingerbase/repository-edit.html', - class: repo_type}); + wok.window.open({ + url: 'plugins/gingerbase/repository-edit.html', + class: repo_type + }); } }, { id: 'repositories-grid-remove-button', label: i18n['GGBREPO6014M'], + class: 'fa fa-minus-circle', + critical: true, disabled: true, onClick: function(event) { var repository = repositoriesGrid.getSelected(); - if(!repository) { + if (!repository) { return; } var settings = { - title : i18n['GGBREPO6001M'], - content : i18n['GGBREPO6002M'], - confirm : i18n['GGBAPI6004M'], - cancel : i18n['GGBAPI6003M'] + title: i18n['GGBREPO6001M'], + content: i18n['GGBREPO6002M'], + confirm: i18n['GGBAPI6004M'], + cancel: i18n['GGBAPI6003M'] }; wok.confirm(settings, function() { @@ -142,15 +150,15 @@ kimchi.host_main = function() { repository['repo_id'], function(result) { wok.topic('kimchi/repositoryDeleted').publish(result); - }, function(error) { - } + }, + function(error) {} ); }); } }], onRowSelected: function(row) { var repository = repositoriesGrid.getSelected(); - if(!repository) { + if (!repository) { return; } $('#repositories-grid-remove-button').prop('disabled', false); @@ -168,28 +176,26 @@ kimchi.host_main = function() { var listRepositories = function(gridCallback) { kimchi.listRepositories(function(repositories) { - if($.isFunction(gridCallback)) { - gridCallback(repositories); - } - else { - if(repositoriesGrid) { - repositoriesGrid.setData(repositories); - } - else { - initRepositoriesGrid(); - repositoriesGrid.setData(repositories); + if ($.isFunction(gridCallback)) { + gridCallback(repositories); + } else { + if (repositoriesGrid) { + repositoriesGrid.setData(repositories); + } else { + initRepositoriesGrid(); + repositoriesGrid.setData(repositories); + } } - } - }, - function(error) { - var message = error && error['responseJSON'] && error['responseJSON']['reason']; + }, + function(error) { + var message = error && error['responseJSON'] && error['responseJSON']['reason']; - if($.isFunction(gridCallback)) { - gridCallback([]); - } - repositoriesGrid && - repositoriesGrid.showMessage(message || i18n['GGBUPD6008M']); - }); + if ($.isFunction(gridCallback)) { + gridCallback([]); + } + repositoriesGrid && + repositoriesGrid.showMessage(message || i18n['GGBUPD6008M']); + }); $('#repositories-grid-remove-button').prop('disabled', true); $('#repositories-grid-edit-button').prop('disabled', true); @@ -272,22 +278,20 @@ kimchi.host_main = function() { wok.topic('kimchi/softwareUpdated').publish({ result: result }); - wok.message.warn(i18n['KCHUPD6010M']); + wok.message.warn(i18n['GGBUPD6010M']); }, function(error) { - wok.message.error(i18n['KCHUPD6011M']); + wok.message.error(i18n['GGBUPD6011M']); }, reloadProgressArea); }; var listSoftwareUpdates = function(gridCallback) { kimchi.listSoftwareUpdates(function(softwareUpdates) { - if($.isFunction(gridCallback)) { + if ($.isFunction(gridCallback)) { gridCallback(softwareUpdates); - } - else { - if(softwareUpdatesGrid) { + } else { + if (softwareUpdatesGrid) { softwareUpdatesGrid.setData(softwareUpdates); - } - else { + } else { initSoftwareUpdatesGrid(softwareUpdates); } } @@ -301,13 +305,13 @@ kimchi.host_main = function() { // package manager instance running, so follow that instance updates if (message.indexOf("GGBPKGUPD0005E") !== -1) { startSoftwareUpdateProgress(); - if($.isFunction(gridCallback)) { + if ($.isFunction(gridCallback)) { gridCallback([]); } return; } - if($.isFunction(gridCallback)) { + if ($.isFunction(gridCallback)) { gridCallback([]); } softwareUpdatesGrid && @@ -327,23 +331,25 @@ kimchi.host_main = function() { }); }; var initReportGrid = function(reports) { - reportGrid = new wok.widget.Grid({ - container: 'available-reports-grid-container', + reportGrid = new wok.widget.List({ + container: 'debug-report-section', id: reportGridID, title: i18n['GGBDR6002M'], toolbarButtons: [{ id: reportGridID + '-generate-button', + class: 'fa fa-plus-circle', label: i18n['GGBDR6006M'], onClick: function(event) { wok.window.open('plugins/gingerbase/report-add.html'); } }, { id: reportGridID + '-rename-button', + class: 'fa fa-pencil', label: i18n['GGBDR6008M'], disabled: true, onClick: function(event) { var report = reportGrid.getSelected(); - if(!report) { + if (!report) { return; } @@ -351,20 +357,37 @@ kimchi.host_main = function() { wok.window.open('plugins/gingerbase/report-rename.html'); } }, { + id: reportGridID + '-download-button', + label: i18n['GGBDR6010M'], + class: 'fa fa-download', + disabled: true, + onClick: function(event) { + var report = reportGrid.getSelected(); + if (!report) { + return; + } + + kimchi.downloadReport({ + file: report['uri'] + }); + } + }, { id: reportGridID + '-remove-button', + class: 'fa fa-minus-circle', label: i18n['GGBDR6009M'], + critical: true, disabled: true, onClick: function(event) { var report = reportGrid.getSelected(); - if(!report) { + if (!report) { return; } var settings = { - title : i18n['GGBAPI6004M'], - content : i18n['GGBDR6001M'], - confirm : i18n['GGBAPI6002M'], - cancel : i18n['GGBAPI6003M'] + title: i18n['GGBAPI6004M'], + content: i18n['GGBDR6001M'], + confirm: i18n['GGBAPI6002M'], + cancel: i18n['GGBAPI6003M'] }; wok.confirm(settings, function() { @@ -373,36 +396,21 @@ kimchi.host_main = function() { }, function(result) { listDebugReports(); }, function(error) { - wok.message.error(error.responseJSON.reason); + wok.message.error(error.responseJSON.reason); }); }); } - }, { - id: reportGridID + '-download-button', - label: i18n['GGBDR6010M'], - disabled: true, - onClick: function(event) { - var report = reportGrid.getSelected(); - if(!report) { - return; - } - - kimchi.downloadReport({ - file: report['uri'] - }); - } }], onRowSelected: function(row) { var report = reportGrid.getSelected(); // Only enable report buttons if the selected line is not a // pending report - if (report['time'] == i18n['GGBDR6007M']) { - var gridElement = $('#'+ reportGridID); + if (report['time'] === i18n['GGBDR6007M']) { + var gridElement = $('#' + reportGridID); var row = $('tr:contains(' + report['name'] + ')', gridElement); enableReportButtons(false); row.attr('class', ''); - } - else { + } else { enableReportButtons(true); } }, @@ -410,26 +418,31 @@ kimchi.host_main = function() { fields: [{ name: 'name', label: i18n['GGBDR6003M'], - 'class': 'debug-report-name' + 'class': 'debug-report-name', + type: 'name' }, { name: 'time', label: i18n['GGBDR6005M'], - 'class': 'debug-report-time' + 'class': 'debug-report-time', + type: 'description' }], data: reports }); }; var getPendingReports = function() { - var reports = [] - var filter = 'status=running&target_uri=' + encodeURIComponent('^/plugins/gingerbase/debugreports/*') + var reports = []; + var filter = 'status=running&target_uri=' + encodeURIComponent('^/plugins/gingerbase/debugreports/*'); kimchi.getTasksByFilter(filter, function(tasks) { - for(var i = 0; i < tasks.length; i++) { - reportName = tasks[i].target_uri.replace(/^\/plugins\/gingerbase\/debugreports\//, '') || i18n['GGBDR6012M']; - reports.push({'name': reportName, 'time': i18n['GGBDR6007M']}) + for (var i = 0; i < tasks.length; i++) { + var reportName = tasks[i].target_uri.replace(/^\/plugins\/kimchi\/debugreports\//, '') || i18n['GGBDR6012M']; + reports.push({ + 'name': reportName, + 'time': i18n['GGBDR6007M'] + }); - if(kimchi.trackingTasks.indexOf(tasks[i].id) >= 0) { + if (kimchi.trackingTasks.indexOf(tasks[i].id) >= 0) { continue; } @@ -455,33 +468,64 @@ kimchi.host_main = function() { var listDebugReports = function() { kimchi.listReports(function(reports) { - pendingReports = getPendingReports(); - allReports = pendingReports.concat(reports); + var pendingReports = getPendingReports(); + var allReports = pendingReports.concat(reports); $('#debug-report-section').removeClass('hidden'); + if ((kimchi.capabilities['repo_mngt_tool']) && (kimchi.capabilities['repo_mngt_tool'] !== "None")) { + $('#debug-report-section, #repositories-section').removeClass('col-md-8'); + $('#debug-report-section, #repositories-section').addClass('col-md-4'); + }else { + $('#content-sys-info').removeClass('col-md-12'); + $('#content-sys-info').addClass('col-md-4'); + } + // Row selection will be cleared so disable buttons here enableReportButtons(false); - if(reportGrid) { + if (reportGrid) { reportGrid.setData(allReports); - } - else { + } else { initReportGrid(allReports); } + if (!allReports.length) { + $('#available-reports-grid-btn-group').removeClass('hidden'); + } else { + $('#available-reports-grid-btn-group').addClass('hidden'); + } + // Set id-debug-img to pending reports // It will display a loading icon var gridElement = $('#' + reportGridID); - $.each($('td:contains(' + i18n['GGBDR6007M'] + ')', gridElement), function(index, row) { - $(row).parent().addClass('no-hover'); - $(row).attr('id', 'id-debug-img'); + // "Generating..." + $.each($('td:contains(' + i18n['GGBDR6007M'] + ')', gridElement), function(index, row) { + console.log(row); + $(row).parent().addClass('generating'); + $(row).parent().find('.dropdown-toggle').addClass('disabled'); + //$(row).attr('id', 'id-debug-img'); }); }, function(error) { - if(error['status'] == 403) { + if (error['status'] === 403) { $('#debug-report-section').addClass('hidden'); + // Check Repositories and resize column + if ((kimchi.capabilities['repo_mngt_tool']) && (kimchi.capabilities['repo_mngt_tool'] !== "None")) { + $('#repositories-section').removeClass('col-md-4'); + $('#repositories-section').addClass('col-md-8'); + }else { + $('#content-sys-info').removeClass('col-md-4'); + $('#content-sys-info').addClass('col-md-12'); + } return; } $('#debug-report-section').removeClass('hidden'); + if ((kimchi.capabilities['repo_mngt_tool']) && (kimchi.capabilities['repo_mngt_tool'] !== "None")) { + $('#debug-report-section, #repositories-section').removeClass('col-md-8'); + $('#debug-report-section, #repositories-section').addClass('col-md-4'); + }else { + $('#content-sys-info').removeClass('col-md-12'); + $('#content-sys-info').addClass('col-md-4'); + } }); }; @@ -489,10 +533,9 @@ kimchi.host_main = function() { var restartButtonID = '#host-button-restart'; var shutdownHost = function(params) { var settings = { - title : i18n['GGBAPI6004M'], - content : i18n['GGBHOST6008M'], - confirm : i18n['GGBAPI6002M'], - cancel : i18n['GGBAPI6003M'] + content: i18n['GGBHOST6008M'], + confirm: i18n['GGBAPI6002M'], + cancel: i18n['GGBAPI6003M'] }; wok.confirm(settings, function() { @@ -500,53 +543,45 @@ kimchi.host_main = function() { $(shutdownButtonID).prop('disabled', true); $(restartButtonID).prop('disabled', true); // Check if there is any VM is running. - // FIXME : Find alternative way to figure out if any vms running - // kimchi.listVMs(function(vms) { - // for(var i = 0; i < vms.length; i++) { - // if(vms[i]['state'] === 'running') { - // wok.message.error.code('GGBHOST6001E'); - // $(shutdownButtonID).prop('disabled', false); - // $(restartButtonID).prop('disabled', false); - // return; - // } - // } - // - // }); - }, function() { - }); + kimchi.listVMs(function(vms) { + for (var i = 0; i < vms.length; i++) { + if (vms[i]['state'] === 'running') { + wok.message.error.code('GGBHOST6001E'); + $(shutdownButtonID).prop('disabled', false); + $(restartButtonID).prop('disabled', false); + return; + } + } + + }); + }, function() {}); }; var initPage = function() { - $('#host-info-container .section-header').each(function(i, header) { - $('<span class="arrow"></span>').prependTo(header); - var toExpand = $(header).attr('aria-expanded') !== 'false'; - expand(header, toExpand); - }); - - $('#host-info-container').on('click', '.section-header', function(event) { - var toExpand = $(this).attr('aria-expanded') === 'false'; - expand(this, toExpand); - }); $('#host-button-shutdown').on('click', function(event) { + event.preventDefault(); shutdownHost(null); }); $('#host-button-restart').on('click', function(event) { + event.preventDefault(); shutdownHost({ reboot: true }); }); var setupUI = function() { - if (kimchi.capabilities == undefined) { + if (kimchi.capabilities === undefined) { setTimeout(setupUI, 2000); return; } - if((kimchi.capabilities['repo_mngt_tool']) && (kimchi.capabilities['repo_mngt_tool']!="None")) { + if ((kimchi.capabilities['repo_mngt_tool']) && (kimchi.capabilities['repo_mngt_tool'] !== "None")) { initRepositoriesGrid(kimchi.capabilities['repo_mngt_tool']); $('#repositories-section').switchClass('hidden', kimchi.capabilities['repo_mngt_tool']); + $('#content-sys-info').removeClass('col-md-12', kimchi.capabilities['repo_mngt_tool']); + $('#content-sys-info').addClass('col-md-4', kimchi.capabilities['repo_mngt_tool']); wok.topic('kimchi/repositoryAdded') .subscribe(listRepositories); wok.topic('kimchi/repositoryUpdated') @@ -555,7 +590,7 @@ kimchi.host_main = function() { .subscribe(listRepositories); } - if(kimchi.capabilities['update_tool']) { + if (kimchi.capabilities['update_tool']) { $('#software-update-section').removeClass('hidden'); initSoftwareUpdatesGrid(); wok.topic('kimchi/softwareUpdated') @@ -565,7 +600,7 @@ kimchi.host_main = function() { }); } - if(kimchi.capabilities['system_report_tool']) { + if (kimchi.capabilities['system_report_tool']) { listDebugReports(); wok.topic('kimchi/debugReportAdded') .subscribe(listDebugReports); @@ -608,40 +643,40 @@ kimchi.host_main = function() { } }, diskIO: { - r: { + w: { type: 'value', base: 2, fixed: 2, unit: 'B/s', - legend: i18n['GGBHOST6004M'], + legend: i18n['GGBHOST6005M'], + 'class': 'disk-write', points: [] }, - w: { + r: { type: 'value', base: 2, fixed: 2, unit: 'B/s', - legend: i18n['GGBHOST6005M'], - 'class': 'disk-write', + legend: i18n['GGBHOST6004M'], points: [] } }, networkIO: { - r: { + s: { type: 'value', base: 2, fixed: 2, unit: 'B/s', - legend: i18n['GGBHOST6006M'], + legend: i18n['GGBHOST6007M'], + 'class': 'network-sent', points: [] }, - s: { + r: { type: 'value', base: 2, fixed: 2, unit: 'B/s', - legend: i18n['GGBHOST6007M'], - 'class': 'network-sent', + legend: i18n['GGBHOST6006M'], points: [] } } @@ -650,38 +685,36 @@ kimchi.host_main = function() { var cursor = SIZE; var add = function(stats) { - for(var key in stats) { + for (var key in stats) { var item = stats[key]; - for(var metrics in item) { + for (var metrics in item) { var value = item[metrics]['v']; var max = item[metrics]['max']; var unifiedMetrics = statsArray[key][metrics]; var ps = unifiedMetrics['points']; - if(!Array.isArray(value)){ + if (!Array.isArray(value)) { ps.push(value); - if(ps.length > SIZE + 1) { + if (ps.length > SIZE + 1) { ps.shift(); } + } else { + ps = ps.concat(value); + ps.splice(0, ps.length - SIZE - 1); + unifiedMetrics['points'] = ps; } - else{ - ps=ps.concat(value); - ps.splice(0, ps.length-SIZE-1); - unifiedMetrics['points']=ps; - } - if(max !== undefined) { + if (max !== undefined) { unifiedMetrics['max'] = max; - } - else { - if(unifiedMetrics['type'] !== 'value') { + } else { + if (unifiedMetrics['type'] !== 'value') { continue; } max = -Infinity; $.each(ps, function(i, value) { - if(value > max) { + if (value > max) { max = value; } }); - if(max === 0) { + if (max === 0) { ++max; } max *= 1.1; @@ -695,7 +728,7 @@ kimchi.host_main = function() { var get = function(which) { var stats = statsArray[which]; var lines = []; - for(var k in stats) { + for (var k in stats) { var obj = stats[k]; var line = { type: obj['type'], @@ -704,10 +737,10 @@ kimchi.host_main = function() { fixed: obj['fixed'], legend: obj['legend'] }; - if(obj['max']) { + if (obj['max']) { line['max'] = obj['max']; } - if(obj['class']) { + if (obj['class']) { line['class'] = obj['class']; } var ps = obj['points']; @@ -732,104 +765,102 @@ kimchi.host_main = function() { }; var Tracker = function(charts) { - var charts = charts; - var timer = null; - var statsPool = new StatsMgr(); - var setCharts = function(newCharts) { - charts = newCharts; - for(var key in charts) { - var chart = charts[key]; - chart.updateUI(statsPool.get(key)); - } - }; - - var self = this; - - var UnifyStats = function(stats) { - var result= { - cpu: { - u: { - v: stats['cpu_utilization'] - } - }, - memory: { - u: { - } - }, - diskIO: { - r: { - v: stats['disk_read_rate'] - }, - w: { - v: stats['disk_write_rate'] - } - }, - networkIO: { - r: { - v: stats['net_recv_rate'] - }, - s: { - v: stats['net_sent_rate'] - } - } - }; - if(Array.isArray(stats['memory'])){ - result.memory.u['v']=[]; - result.memory.u['max']=-Infinity; - for(var i=0;i<stats['memory'].length;i++){ - result.memory.u['v'].push(stats['memory'][i]['avail']); - result.memory.u['max']=Math.max(result.memory.u['max'],stats['memory'][i]['total']); - } - } - else { - result.memory.u['v']=stats['memory']['avail'], - result.memory.u['max']=stats['memory']['total'] - } - return(result); - }; - - - var statsCallback = function(stats) { - var unifiedStats = UnifyStats(stats); - statsPool.add(unifiedStats); - for(var key in charts) { - var chart = charts[key]; - chart.updateUI(statsPool.get(key)); - } - timer = setTimeout(function() { - continueTrack(); - }, 1000); - }; - - var track = function() { - kimchi.getHostStatsHistory(statsCallback, - function() { - continueTrack(); - }); - }; + var charts = charts; + var timer = null; + var statsPool = new StatsMgr(); + var setCharts = function(newCharts) { + charts = newCharts; + for (var key in charts) { + var chart = charts[key]; + chart.updateUI(statsPool.get(key)); + } + }; - var continueTrack = function() { - kimchi.getHostStats(statsCallback, - function() { + var self = this; + + var UnifyStats = function(stats) { + var result = { + cpu: { + u: { + v: stats['cpu_utilization'] + } + }, + memory: { + u: {} + }, + diskIO: { + w: { + v: stats['disk_write_rate'] + }, + r: { + v: stats['disk_read_rate'] + } + }, + networkIO: { + s: { + v: stats['net_sent_rate'] + }, + r: { + v: stats['net_recv_rate'] + } + } + }; + if (Array.isArray(stats['memory'])) { + result.memory.u['v'] = []; + result.memory.u['max'] = -Infinity; + for (var i = 0; i < stats['memory'].length; i++) { + result.memory.u['v'].push(stats['memory'][i]['avail']); + result.memory.u['max'] = Math.max(result.memory.u['max'], stats['memory'][i]['total']); + } + } else { + result.memory.u['v'] = stats['memory']['avail'], + result.memory.u['max'] = stats['memory']['total'] + } + return (result); + }; + + + var statsCallback = function(stats) { + var unifiedStats = UnifyStats(stats); + statsPool.add(unifiedStats); + for (var key in charts) { + var chart = charts[key]; + chart.updateUI(statsPool.get(key)); + } + timer = setTimeout(function() { continueTrack(); - }); - }; - - var destroy = function() { - timer && clearTimeout(timer); - timer = null; - }; - - return { - setCharts: setCharts, - start: track, - stop: destroy - }; + }, 1000); + }; + + var track = function() { + kimchi.getHostStatsHistory(statsCallback, + function() { + continueTrack(); + }); + }; + + var continueTrack = function() { + kimchi.getHostStats(statsCallback, + function() { + continueTrack(); + }); + }; + + var destroy = function() { + timer && clearTimeout(timer); + timer = null; + }; + + return { + setCharts: setCharts, + start: track, + stop: destroy + }; }; var initTracker = function() { // TODO: Extend tabs with onUnload event to unregister timers. - if(kimchi.hostTimer) { + if (kimchi.hostTimer) { kimchi.hostTimer.stop(); delete kimchi.hostTimer; } @@ -857,20 +888,19 @@ kimchi.host_main = function() { }) }; - if(kimchi.hostTimer) { + if (kimchi.hostTimer) { kimchi.hostTimer.setCharts(trackedCharts); - } - else { + } else { kimchi.hostTimer = new Tracker(trackedCharts); kimchi.hostTimer.start(); } }; $('#host-root-container').on('remove', function() { - if(kimchi.hostTimer) { + if (kimchi.hostTimer) { kimchi.hostTimer.stop(); delete kimchi.hostTimer; - } + } repositoriesGrid && repositoriesGrid.destroy(); wok.topic('kimchi/repositoryAdded') @@ -887,4 +917,4 @@ kimchi.host_main = function() { wok.topic('kimchi/debugReportAdded').unsubscribe(listDebugReports); wok.topic('kimchi/debugReportRenamed').unsubscribe(listDebugReports); }); -}; +}; \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/ui/pages/host.html.tmpl b/src/wok/plugins/gingerbase/ui/pages/host.html.tmpl index 0afb639..6259f1b 100644 --- a/src/wok/plugins/gingerbase/ui/pages/host.html.tmpl +++ b/src/wok/plugins/gingerbase/ui/pages/host.html.tmpl @@ -25,153 +25,124 @@ #silent _ = t.gettext #silent _t = t.gettext <!DOCTYPE html> -<html> +<html> <head> -<link rel="stylesheet" href="plugins/gingerbase/css/theme-default.min.css"> +<link rel="stylesheet" href="plugins/gingerbase/css/gingerbase.css"> <script src="plugins/gingerbase/js/gingerbase.min.js"></script> </head> <body> <div id="host-root-container"> - <div class="toolbar"> - <div class="tools"> - </div> +<nav class="navbar navbar-default toolbar"> + <div class="container"> + <!-- Brand and toggle get grouped for better mobile display --> + <div class="navbar-header"> + <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#toolbar" aria-expanded="false"> + <span class="sr-only">Toggle navigation</span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + </button> + </div> + + <!-- Collect the nav links, forms, and other content for toggling --> + <div class="collapse navbar-collapse" id="toolbar"> + <ul class="nav navbar-nav navbar-right tools"> + <li><a id="host-button-restart" href="javascript:void(0);"><i class="fa fa-undo"></i><span>$_("Restart")</span></a></li> + <li><a id="host-button-shutdown" href="javascript:void(0);"><i class="fa fa-ban"></i><span>$_("Shut down")</span></a></li> + <!-- <li><a href="javascript:void(0);"><i class="fa fa-desktop"></i><span>$_("Connect")</span></a></li> --> + </ul> </div> + </div> +</nav> <div id="host-content-container" class="empty-when-logged-off"></div> </div> -<script id="host-tmpl" type="gingerbase/template"> - <div class="host-panel"> - <div class="logo-container"> - <div class="logo" style="background-image: url({logo});"></div> - </div> - <div id="host-info-container" class="info-container"> - <h2 class="hostname">{hostname}</h2> - <div class="action-panel"> - <button id="host-button-shutdown" class="btn-normal-1 stop"> - <div class="button-icon action-icon-stop"></div> - $_("Shut down") - </button> - <button id="host-button-restart" class="btn-normal-1 restart"> - <div class="button-icon action-icon-restart"></div> - $_("Restart") - </button> - <button class="btn-normal-1 connect" disabled="disabled"> - <div class="button-icon action-icon-connect"></div> - $_("Connect") - </button> - </div> - <div class="host-section"> - <h3 class="section-header" - aria-expanded="false" - aria-controls="content-sys-info"> - $_("Basic Information") - </h3> - <div id="content-sys-info" class="section-content"> - <div class="section-row"> - <div class="section-label">$_("OS Distro")</div> - <div class="section-value">{os_distro}</div> - </div> - <div class="section-row"> - <div class="section-label">$_("OS Version")</div> - <div class="section-value">{os_version}</div> - </div> - <div class="section-row"> - <div class="section-label">$_("OS Code Name")</div> - <div class="section-value">{os_codename}</div> - </div> - <div class="section-row"> - <div class="section-label">$_("Processor")</div> - <div class="section-value">{cpu_model}</div> - </div> - <div class="section-row"> - <div class="section-label">$_("CPU(s)")</div> - <div class="section-value">{cpus}</div> - </div> - <div class="section-row"> - <div class="section-label">$_("Memory")</div> - <div class="section-value">{memory}</div> +<script id="host-tmpl" type="kimchi/template"> +<div class="host-dashboard"> + <div class="container"> + <div id="alert-container"></div> + <div id="content-sys-statistics" class="row"> + <div class="col-md-3"> + <div id="cpu-dashboard"> + <h3 class="section-label">$_("CPU")</h3> + <div class="section-value"> + <div id="container-chart-cpu" class="inline-block"></div> </div> </div> </div> - <div class="host-section"> - <h3 class="section-header" - aria-controls="content-sys-statistics"> - $_("System Statistics") - </h3> - <div id="content-sys-statistics" class="section-content"> - <div class="section-row"> - <div class="section-label">$_("CPU")</div> - <div class="section-value"> - <div id="container-chart-cpu" class="inline-block"></div> - </div> - </div> - <div class="section-row"> - <div class="section-label">$_("Memory")</div> - <div class="section-value"> - <div id="container-chart-memory" class="inline-block"></div> - </div> - </div> - <div class="section-row"> - <div class="section-label">$_("Disk I/O")</div> - <div class="section-value"> - <div id="container-chart-disk-io" class="inline-block"></div> - </div> - </div> - <div class="section-row"> - <div class="section-label">$_("Network I/O")</div> - <div class="section-value"> - <div id="container-chart-network-io" class="inline-block"></div> - </div> + <div class="col-md-3"> + <div id="memory-dashboard"> + <h3 class="section-label">$_("Memory")</h3> + <div class="section-value"> + <div id="container-chart-memory" class="inline-block"></div> </div> </div> </div> - <div id="software-update-section" class="host-section hidden"> - <h3 class="section-header" - aria-controls="content-software-update"> - $_("Software Updates") - </h3> - <div id="content-software-update" class="section-content"> - <div class="section-row"> - <div class="section-value"> - <div id="software-updates-grid-container"></div> - <div id="software-updates-progress-container" class="hidden"> - <label for="software-updates-progress-textarea">$_("Update Progress")</label> - <textarea id="software-updates-progress-textarea" readonly></textarea> - </div> - </div> + <div class="col-md-3"> + <div id="disk-dashboard"> + <h3 class="section-label">$_("Disk I/O")</h3> + <div class="section-value"> + <div id="container-chart-disk-io" class="inline-block"></div> </div> </div> </div> - <div id="repositories-section" class="host-section hidden"> - <h3 class="section-header" - aria-controls="content-repositories"> - $_("Repositories") - </h3> - <div id="content-repositories" class="section-content"> - <div class="section-row"> - <div class="section-value"> - <div id="repositories-grid-container"></div> - </div> + <div class="col-md-3"> + <div id="network-dashboard"> + <h3 class="section-label">$_("Network I/O")</h3> + <div class="section-value"> + <div id="container-chart-network-io" class="inline-block"></div> </div> </div> </div> - <div id="debug-report-section" class="host-section hidden"> - <h3 class="section-header" - aria-controls="content-sys-reports"> - $_("Debug Reports") - </h3> - <div id="content-sys-reports" class="section-content"> - <div class="section-row"> - <div class="section-value"> - <div id="available-reports-grid-container"></div> - </div> + </div> + </div> +</div> +<div class="host-panel"> + <div class="container"> + <div id="host-info-container" class="row"> + <div id="content-sys-info" class="panel panel-default col-md-12"> + <div class="panel-heading"> + <h3 class="panel-title">$_("Basic Information")</h3> + </div> + <div class="panel-body"> + <dl class="basic-information-list"> + <dt>{os_distro}</dt> + <dd>$_("OS Distro")</dd> + <dt>{os_version}</dt> + <dd>$_("OS Version")</dd> + <dt>{os_codename}</dt> + <dd>$_("OS Code Name")</dd> + <dt>{cpu_model}</dt> + <dd>$_("Processor")</dd> + <dt>{cpus}</dt> + <dd>$_("CPU(s)")</dd> + <dt>{memory}</dt> + <dd>$_("Memory")</dd> + </dl> + </div> + </div> + <div id="repositories-section" class="col-md-8 hidden"></div> + <div id="debug-report-section" class="col-md-8 hidden"></div> + </div> + <div class="row"> + <div id="software-update-section" class="panel panel-default col-md-12 hidden"> + <div class="panel-heading"> + <h3 class="panel-title">$_("Software Updates")</h3> + </div> + <div id="content-software-update" class="panel panel-default"> + <div id="software-updates-grid-container"></div> + <div id="software-updates-progress-container" class="hidden"> + <label for="software-updates-progress-textarea">$_("Update Progress")</label> + <textarea id="software-updates-progress-textarea" readonly></textarea> </div> </div> </div> </div> </div> +</div> </script> - +<div id="modalWindow" class="modal fade host-modal" tabindex="-1" role="dialog" aria-labelledby="hostsModalLabel" aria-hidden="true"> +</div> <script type="text/javascript"> kimchi.host_main(); </script> diff --git a/src/wok/plugins/gingerbase/ui/pages/report-add.html.tmpl b/src/wok/plugins/gingerbase/ui/pages/report-add.html.tmpl index 78b085d..94f4ed6 100644 --- a/src/wok/plugins/gingerbase/ui/pages/report-add.html.tmpl +++ b/src/wok/plugins/gingerbase/ui/pages/report-add.html.tmpl @@ -24,35 +24,25 @@ #silent _ = t.gettext #silent _t = t.gettext <!DOCTYPE html> -<div id="report-add-window" class="window"> - <header> - <h1 class="title h1 grey">$_("Generate a New Debug Report")</h1> - </header> - <div class="content"> - <form id="form-report-add"> - <section class="form-section"> - <h2> - <label for="report-name-textbox">$_("Report Name")</label> - </h2> - <div class="field"> - <input type="text" class="text" id="report-name-textbox" name="name" /> - <span class="icon-info-circled light-grey c1"></span> - <span class="info-add-debug-report"> - $_("The name used to identify the report. If omitted, a name will be chosen based on current time. Name can contain: letters, digits, underscore (\"_\") and hyphen (\"-\").") - </span> - </div> - </section> - </form> - </div> - <footer> - <div class="btn-group"> - <button id="button-report-add" class="btn-normal"><span class="text">$_("Generate")</span></button> - <button id="button-report-cancel" class="btn-normal close" type="button"> - <span calss="text">$_("Cancel")</span> - </button> +<div class="modal-content"> + <div class="modal-header"> + <h4 class="modal-title">$_("Generate a New Debug Report")</h4> + </div> + <div class="modal-body"> + <form id="form-report-add"> + <div class="form-group"> + <label for="report-name-textbox">$_("Report Name")</label> + <input type="text" class="form-control" id="report-name-textbox" name="name" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("The name used to identify the report. If omitted, a name will be chosen based on current time. Name can contain: letters, digits, underscore (\"_\") and hyphen (\"-\").") + </p> </div> - </footer> + </form> + </div> + <div class="modal-footer"> + <button type="button" id="button-report-add" class="btn btn-default" data-dismiss="modal">$_("Generate")</button> + <button type="button" id="button-report-cancel" class="btn btn-default" data-dismiss="modal">$_("Cancel")</button> + </div> </div> <script> kimchi.report_add_main(); -</script> +</script> \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/ui/pages/report-rename.html.tmpl b/src/wok/plugins/gingerbase/ui/pages/report-rename.html.tmpl index b069aad..e5b9401 100644 --- a/src/wok/plugins/gingerbase/ui/pages/report-rename.html.tmpl +++ b/src/wok/plugins/gingerbase/ui/pages/report-rename.html.tmpl @@ -24,35 +24,27 @@ #silent _ = t.gettext #silent _t = t.gettext <!DOCTYPE html> -<div id="report-rename-window" class="window"> - <header> - <h1 class="title h1 grey">$_("Rename a Debug Report")</h1> - </header> - <div class="content"> +<div class="modal-content"> + <div class="modal-header"> + <h4 class="modal-title">$_("Rename a Debug Report")</h4> + </div> + <div class="modal-body"> <form id="form-report-rename"> - <section class="form-section"> - <h2> - <label for="report-name-textbox">$_("Report Name")</label> - </h2> - <div class="field"> - <input type="text" class="text" id="report-name-textbox" name="name" /> - <span class="icon-info-circled light-grey c1"></span> - <span class="info-debug-report-rename"> - $_("The name used to identify the report. Name can contain: letters, digits and hyphen (\"-\").") - </span> - </div> - </section> + <div class="form-group"> + <label for="report-name-textbox">$_("Report Name")</label> + <input type="text" class="form-control" id="report-name-textbox" name="name" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("The name used to identify the report. Name can contain: letters, digits and hyphen (\"-\").") + </p> + </div> </form> </div> - <footer> - <div class="btn-group"> - <button id="button-report-rename" class="btn-normal"><span class="text">$_("Submit")</span></button> - <button id-"button-report-rename-cancel" class="btn-normal close" type="button"> - <span class="text">$_("Cancel")</span> - </button> - </div> - </footer> + <div class="modal-footer"> + <button type="button" id="button-report-rename" class="btn btn-default" data-dismiss="modal">$_("Submit")</button> + <button type="button" id- "button-report-rename-cancel" class="btn btn-default" type="button" data-dismiss="modal">$_("Cancel") + </button> + </div> </div> <script> kimchi.report_rename_main(); </script> + \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/ui/pages/repository-add.html.tmpl b/src/wok/plugins/gingerbase/ui/pages/repository-add.html.tmpl index 6dd9d3e..3bf0856 100644 --- a/src/wok/plugins/gingerbase/ui/pages/repository-add.html.tmpl +++ b/src/wok/plugins/gingerbase/ui/pages/repository-add.html.tmpl @@ -23,93 +23,51 @@ #silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) #silent _ = t.gettext #silent _t = t.gettext -<div id="repository-add-window" class="window"> - <form id="form-repository-add"> - <header class="window-header"> - <h1 class="title h1 grey">$_("Add a Repository")</h1> - </header> - <section> - <div class="content"> - <div class="form-section yum"> - <h2>$_("Identifier")</h2> - <div class="field"> - <div class="textbox-wrapper"> - <input type="text" class="text" name="repo_id" /> - </div> - <div class="icon-info-circled light-grey c1 help-inline"></div> - <p class="text-help help-inline"> - $_("Single word, unique identifier for the repository.") +<div class="modal-content"> + <div class="modal-header"> + <h4 class="modal-title">$_("Add a Repository")</h4> + </div> + <div class="modal-body"> + <form id="form-repository-add"> + <div class="form-group yum"> + <label for="repo_id">$_("Identifier")</label> + <input type="text" class="form-control" name="repo_id" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("Single word, unique identifier for the repository.") </p> - </div> </div> - <section class="form-section yum"> - <h2>$_("Name")</h2> - <div class="field"> - <div class="textbox-wrapper"> - <input type="text" class="text" name="config[repo_name]" /> - </div> - <div class="icon-info-circled light-grey c1 help-inline"></div> - <p class="text-help help-inline"> - $_("Textual name for the repository.") + <div class="form-group yum"> + <label for="repo_name">$_("Name")</label> + <input type="text" class="form-control" id="repo_name" name="config[repo_name]" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("Textual name for the repository.") </p> - </div> - </section> - <section class="form-section"> - <h2>$_("URL")<span class="required" role="presentation" title='$_("Required Field")'>*</span></h2> - <div class="field"> - <div class="textbox-wrapper"> - <input type="text" class="text required" name="baseurl" /> - </div> - <div class="icon-info-circled light-grey c1 help-inline"></div> - <p class="text-help help-inline"> - $_("URL to the repository. Supported protocols are http, ftp, and file.") - </p> - </div> - <div class="field yum"> - <p class="yum"> - <input type="checkbox" name="isMirror" value="true" id="isMirror" /> - <label id="isMirrorLabel" for="isMirror">$_("Repository is a mirror")</label> - </p> - </div> - </section> - <section class="form-section repository-dist deb"> - <h2>$_("Distribution")</h2> - <div class="field"> - <div class="textbox-wrapper"> - <input type="text" class="text" name="config[dist]" /> - </div> - <div class="icon-info-circled light-grey c1 help-inline"></div> - <p class="text-help help-inline"> - $_("Distribution of the DEB repository.") - </p> - </div> - </section> - <section class="form-section repository-comps deb"> - <h2>$_("Components")</h2> - <div class="field"> - <div class="textbox-wrapper"> - <input type="text" class="text" name="config[comps]" /> - </div> - <div class="icon-info-circled light-grey c1 help-inline"></div> - <p class="text-help help-inline"> - $_("List of components in DEB repository.") - </p> - </div> - </section> - </div> - </section> - <footer> - <div class="btn-group"> - <button type="submit" id="button-repository-add" class="btn-normal" disabled="disabled"> - <span class="text">$_("Add")</span> - </button> - <button type="button" id="button-repository-close" class="btn-normal close"> - <span class="text">$("Cancel")</span> - </button> - </div> - </footer> - </form> + </div> + <div class="form-group"> + <label for="baseurl">$_("URL")<span class="required" role="presentation" title='$_("Required Field")'>*</span></label> + <input type="text" class="form-control required" id="baseurl" name="baseurl" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("URL to the repository. Supported protocols are http, ftp, and file.")</p> + </div> + <div class="checkbox yum"> + <label id="isMirrorLabel" for="isMirror"> + <input type="checkbox" name="isMirror" value="true" id="isMirror" /> $_("Repository is a mirror")</label> + </div> + <div class="form-group repository-dist deb"> + <label>$_("Distribution")</label> + <input type="text" class="form-control" name="config[dist]" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("Distribution of the DEB repository.")</p> + </div> + <div class="form-group repository-comps deb"> + <label>$_("Components")</label> + <input type="text" class="form-control" name="config[comps]" /> + <p class="help-block"><i class="fa fa-info-circle"></i> $_("List of components in DEB repository.")</p> + </div> + </form> + </div> + <div class="modal-footer"> + <button type="submit" id="button-repository-add" class="btn btn-default" disabled="disabled">$_("Add")</button> + <button type="button" id="button-repository-close" data-dismiss="modal" class="btn btn-default">$("Cancel")</button> + </div> </div> <script> kimchi.repository_add_main(); </script> + \ No newline at end of file diff --git a/src/wok/plugins/gingerbase/ui/pages/repository-edit.html.tmpl b/src/wok/plugins/gingerbase/ui/pages/repository-edit.html.tmpl index 67edecb..9e1c54f 100644 --- a/src/wok/plugins/gingerbase/ui/pages/repository-edit.html.tmpl +++ b/src/wok/plugins/gingerbase/ui/pages/repository-edit.html.tmpl @@ -23,97 +23,57 @@ #silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) #silent _ = t.gettext #silent _t = t.gettext - -<div id="repository-edit-window" class="window"> - <form id="form-repository-edit"> - <header> - <h1 class="title h1 grey">$_("Edit Repository")</h1> - </header> - <div class="content"> - <section id="form-repository-edit"> - <fieldset class="repository-edit-fieldset"> - <div class="repository-id yum"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-id-textbox">$_("ID")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-id-textbox" name="repo_id" type="text" disabled="disabled" readonly="readonly"/> - </div> - </div> - <div class="repository-name yum"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-name-textbox">$_("Name")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-name-textbox" class="yum" name="config[repo_name]" type="text" /> - </div> - </div> - <div class="repository-url"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-baseurl-textbox">$_("URL")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-baseurl-textbox" name="baseurl" type="text" /> - </div> - </div> - <div class="repository-dist deb"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-urlargs-textbox">$_("Distribution")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-urlargs-textbox" class="deb" name="config[dist]" type="text" /> - </div> - </div> - <div class="repository-mirrorlist yum"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-urlargs-textbox">$_("Mirror List URL")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-urlargs-textbox" class="yum" name="config[mirrorlist]" type="text" /> - </div> - </div> - <div class="repository-comps deb"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-urlargs-textbox">$_("Components")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-urlargs-textbox" class="deb" name="config[comps]" type="text" /> - </div> - </div> - <div class="repository-gpgkey yum"> - <div class="repository-edit-wrapper-label"> - <label for="repository-edit-gpgkey-textbox">$_("GPG Key")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-gpgkey-textbox" class="yum" name="config[gpgkey]" type="text" /> - </div> - </div> - <div class="repository-gpgcheck yum"> - <div class="repository-edit-wrapper-label"> - <label>$_("GPG Check")</label> - </div> - <div class="repository-edit-wrapper-controls"> - <input id="repository-edit-gpgcheck-radio-true" class="yum" name="config[gpgcheck]" type="radio" value="true" /> - <label for="repository-edit-gpgcheck-radio-true">$_("Yes")</label> - <input id="repository-edit-gpgcheck-radio-false" class="yum" name="config[gpgcheck]" type="radio" value="false" /> - <label for="repository-edit-gpgcheck-radio-false">$_("No")</label> - </div> - </div> - </fieldset> - </section> - </div> - <footer> - <div class="btn-group"> - <button type="submit" id="repository-edit-button-save" class="btn-normal"> - <span class="text">$_("Save")</span> - </button> - <button type="button" id="repository-edit-button-cancel" class="close btn-normal"> - <span class="text">$_("Cancel")</span> - </button> +<div class="modal-content"> + <div class="modal-header"> + <h4 class="modal-title">$_("Edit Repository")</h4> + </div> + <div class="modal-body"> + <form id="form-repository-edit"> + <div class="form-group repository-id yum"> + <label for="repository-edit-id-textbox">$_("ID")</label> + <input id="repository-edit-id-textbox" class="form-control" name="repo_id" type="text" disabled="disabled" readonly="readonly" /> </div> - </footer> - </form> + <div class="form-group repository-name yum"> + <label for="repository-edit-name-textbox">$_("Name")</label> + <input id="repository-edit-name-textbox" class="form-control yum" name="config[repo_name]" type="text" /> + </div> + <div class="form-group repository-url"> + <label for="repository-edit-baseurl-textbox">$_("URL")</label> + <input id="repository-edit-baseurl-textbox" class="form-control" name="baseurl" type="text" /> + </div> + <div class="form-group repository-dist deb"> + <label for="repository-edit-urlargs-textbox">$_("Distribution")</label> + <input id="repository-edit-urlargs-textbox" class="form-control deb" name="config[dist]" type="text" /> + </div> + <div class="form-group repository-mirrorlist yum"> + <label for="repository-edit-urlargs-textbox">$_("Mirror List URL")</label> + <input id="repository-edit-urlargs-textbox" class="form-control yum" name="config[mirrorlist]" type="text" /> + </div> + <div class="form-group repository-comps deb"> + <label for="repository-edit-urlargs-textbox">$_("Components")</label> + <input id="repository-edit-urlargs-textbox" class="form-control deb" name="config[comps]" type="text" /> + </div> + <div class="form-group repository-gpgkey yum"> + <label for="repository-edit-gpgkey-textbox">$_("GPG Key")</label> + <input id="repository-edit-gpgkey-textbox" class="form-control yum" name="config[gpgkey]" type="text" /> + </div> + <div class="form-group repository-gpgcheck yum"> + <label>$_("GPG Check")</label> + <label for="repository-edit-gpgcheck-radio-true" class="radio inline control-label"> + <input id="repository-edit-gpgcheck-radio-true" class="yum" name="config[gpgcheck]" type="radio" value="true" /> $_("Yes") + </label> + <label for="repository-edit-gpgcheck-radio-false" class="radio inline control-label"> + <input id="repository-edit-gpgcheck-radio-false" class="yum" name="config[gpgcheck]" type="radio" value="false" /> $_("No") + </label> + </div> + </form> + </div> + <div class="modal-footer"> + <button type="submit" id="repository-edit-button-save" class="btn btn-default">$_("Save")</button> + <button type="button" id="repository-edit-button-cancel" class="btn btn-default">$_("Cancel")</button> + </div> </div> <script type="text/javascript"> kimchi.repository_edit_main(); </script> + \ No newline at end of file -- 1.9.3