summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorseshukm <seshu.kumar.m@huawei.com>2017-01-24 10:44:53 +0530
committerseshukm <seshu.kumar.m@huawei.com>2017-01-24 10:44:53 +0530
commit8827dc07a3c14b4d89753b75af5cf4ea553fe747 (patch)
treea542d4d7b7d86ac213b26b73a55847c0346552ea
parent3145d375d7a8789503fa5579c187d8df77f6e05b (diff)
Client unified styling
CSS for the unified look and feel of the OPEN-O GUI pages Issue-Id : CLIENT-11 Change-Id: Ifb2ac768022f3b921d5f5b067a51e928e46fb5cc Signed-off-by: seshukm <seshu.kumar.m@huawei.com>
Diffstat
-rw-r--r--portal-common/src/main/webapp/framework/browser/css/open-ostyle.css873
-rw-r--r--portal-common/src/main/webapp/framework/browser/js/DataService.js137
-rw-r--r--portal-common/src/main/webapp/framework/browser/js/app.js1312
3 files changed, 2322 insertions, 0 deletions
diff --git a/portal-common/src/main/webapp/framework/browser/css/open-ostyle.css b/portal-common/src/main/webapp/framework/browser/css/open-ostyle.css
new file mode 100644
index 00000000..789dbd1c
--- /dev/null
+++ b/portal-common/src/main/webapp/framework/browser/css/open-ostyle.css
@@ -0,0 +1,873 @@
+/*
+
+ Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+ 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.
+
+*/
+
+body {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ height: 100%;
+ font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
+}
+
+.container{
+ background: #fafafa;
+}
+
+.accordion_parent {
+ position: relative;
+ width: 220px;
+ background-color: #f5f5f5;
+}
+
+.openo-accordion-resizable-handle {
+ z-index: 1 !important;
+ cursor: e-resize;
+ width: 7px;
+ right: -5px;
+ top: 0;
+ height: 100%;
+ position: absolute;
+ font-size: .1px;
+ display: block;
+}
+
+.openoAccordian_accordionmenu {
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ line-height: 17px;
+}
+
+.openoAccordian_accordionmenu li {
+ min-width: 75px;
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ color: #000;
+ clear: both;
+}
+
+.openo_accordion_ui-icon-collapse, .openo_accordion_ui-icon-expand {
+ display: block;
+ float: left;
+ margin-bottom: -1px;
+ border-bottom: 1px solid #e5e5e5;
+ cursor: pointer;
+ width: 13px;
+ padding-top: 26px;
+}
+
+.openo_accordion_ui-icon-expand {
+ background: url(/images/collapse_arrow.png) right 20px no-repeat;
+ margin-top: 8px;
+}
+
+.openo_accordion_ui-icon-expand.current {
+ background: url(../images/expand_arrow.png) right 20px no-repeat;
+}
+
+.openoAccordian_showHideArrow_hide, .openoAccordian_showHideArrow_show {
+ display: block;
+ position: absolute;
+ right: 0;
+ top: 4px;
+ width: 18px;
+ height: 41px;
+ cursor: pointer;
+ background-color: #f5f5f5;
+}
+
+.openoAccordian_showHideArrow_hide {
+ background-image: url(../images/openo.png);
+ background-position: -7px 0 !important;
+ border-collapse: separate;
+ /*box-shadow: inset -1px 0 0 #e5e5e5;*/
+}
+
+a.header.opened, a.header.closed {
+ font-size: 16px;
+ padding-top: 24px;
+ padding-bottom: 25px;
+ color: #999999;
+}
+
+.openoAccordian_accordionmenu .closed, .openoAccordian_accordionmenu .opened {
+ padding-right: 10px;
+ background-position: 98% 50%;
+ background-repeat: no-repeat;
+}
+
+
+.openoAccordian_accordionmenu li a {
+ padding: 11px 10px 12px;
+ color: #333333;
+ margin-top: -1px;
+ text-align: left !important;
+ font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
+ font-size: 14px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ border-top: 1px solid #e5e5e5;
+ border-bottom: 1px solid #e5e5e5;
+ /*height: 19px;*/
+}
+
+.openoAccordian_accordionmenu ul {
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+}
+
+.openoAccordian_accordionmenu a {
+ display: block;
+ text-decoration: none;
+}
+
+a {
+ color: #428bca;
+ text-decoration: none;
+ background: 0 0;
+}
+
+.bar {
+ height: 834px;
+ width: 18px;
+ background: #f8f8f8;
+ display: none;
+}
+
+.bar span {
+ width: 13px;
+ height: 34px;
+ background-image: url(../images/openo.png);
+ background-position: -39px 0 !important;
+ display: block;
+ /*margin-top: -430px;*/
+}
+
+li {
+ cursor: pointer;
+}
+
+#puer_base_openo {
+ border: 1px solid #ddd;
+}
+
+.openo_accordion_selected {
+ margin-left: 0;
+ margin-right: 0;
+ background: #fafafa;
+ border-left: 3px solid #4ac9ff !important;
+ box-shadow: none;
+ position: relative;
+}
+
+a:hover {
+ color: #4ac9ff;
+}
+
+.openoAccordian_accordionmenu li.openo_accordion_selected a {
+ position: relative;
+ left: -3px;
+ color: #009ae7;
+}
+
+.openo-accordion-resizable-handle {
+ z-index: 1 !important;
+ cursor: e-resize;
+ width: 7px;
+ right: -5px;
+ top: 0;
+ height: 100%;
+ position: absolute;
+ font-size: .1px;
+ display: block;
+}
+
+#iframeContainer iframe {
+ width: 100%;
+ height: 100%;
+ border: 0;
+}
+
+#accordionContent, #iframeContainer {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.openoAccordian_showHideArrow_show {
+ background-image: url(../images/openo.png);
+ background-position: -39px 0 !important;
+ box-shadow: inset 1px 0 0 #e5e5e5, inset -1px 0 0 #e5e5e5;
+}
+
+.homecontent {
+ text-align: center;
+ letter-spacing: 1.4px;
+}
+
+.homecontent h3, .homecontent h4, .homecontent h5{
+ font-size: 24px;
+ color: #333;
+ text-transform: capitalize;
+ border-top: 2px solid #f1f1f1;
+ border-bottom: 2px solid #f1f1f1;
+ padding: 15px 5px;
+ display: inline-block;
+ letter-spacing: 5px;
+ -webkit-animation: textScroll 500ms linear;
+ animation: textScroll 500ms linear;
+}
+.homecontent h4 {
+ font-size: 28px;
+ font-weight: bold;
+}
+.homecontent h5 {
+ font-size: 16px;
+ text-align: left;
+ border: none;
+}
+@-webkit-keyframes textScroll {
+ from {opacity: 0;}
+ to {opacity: 1;}
+ }
+
+@keyframes textScroll {
+ from {opacity: 0;}
+ to {opacity: 1;}
+}
+
+.modal-body span {
+ font-size: 18px;
+ color: #00f;
+}
+
+#msgModal .modal-body .container {
+ width: 100%;
+}
+#msgModal .modal-body .icon {
+ /*color: red;*/
+ font-size: 37px;
+}
+#msgModal .modal-body .icon_error {
+ color: red;
+}
+#msgModal .modal-body .icon_info {
+ color: green;
+}
+#msgModal .modal-body .icon_warning{
+ color: orange;
+}
+#msgModal .modal-body .icon_confirm {
+ color: blue;
+}
+#msgModal .modal-body .msg {
+ color: #333;
+ padding-left: 30px;
+}
+/*#msgModal .modal-body .container .row {
+}*/
+#msgModal .modal-body .row {
+ height: 100%;
+ white-space: nowrap;
+}
+#msgModal .modal-body .row:before{
+ content: "";
+ display: inline-block;
+ vertical-align: middle;
+ width: 0;
+ /* adjust for white space between pseudo element and next sibling */
+ margin-right: -.25em;
+ /* stretch line height */
+ height: 100%;
+}
+
+#msgModal .modal-body .row .msg {
+ /*display: inline-block;
+ vertical-align: middle;
+ white-space: normal;*/
+ /* vertical-align: middle; */
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
+ padding-left: 70px;
+ white-space: normal;
+}
+
+/* Functional */
+
+#funModal .modal-content .modal-header{
+ padding-bottom: 4px;
+ border-radius: 5px 5px 0 0;
+}
+
+
+/* Buttons */
+.btnDefault {
+ border-radius: 6px;
+ /*height: 24px;*/
+ font-size: 12px;
+ font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
+ line-height: 24px;
+ color: #000;
+ border: 1px solid #d3d3d3;
+ text-align: center;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
+ -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
+ background: linear-gradient(to bottom, #fff, #fafafa);
+ padding: 0 19px;
+}
+.btnDefault:hover {
+ border-color: #4ac9ff;
+ color: #009ae7;
+}
+#iconBtn {
+ padding: 0 15px;
+}
+#iconBtn span {
+ font-size: 12px;
+ margin-top: 4px;
+ width: 16px;
+ height: 16px;
+}
+#iconBtn span.pull-left {
+ margin-right: 5px;
+}
+#iconBtn span.pull-right {
+ margin-left: 5px;
+}
+
+#buttonArea {
+ text-align: left;
+}
+#buttonArea div {
+ margin: 10px 0 20px;
+}
+
+#buttonArea div .btn-block{
+ margin: 10px 0;
+}
+
+/* Dropdown*/
+
+#dropdown {
+ text-align: left;
+}
+
+#dropdown div {
+ margin: 10px 0 20px;
+}
+
+#dropdown .dropup .dropdown-menu {
+ top: auto;
+ bottom: 45% !important;
+ margin-bottom: 1px;
+}
+#dropdown .dropdown-menu {
+ top: auto;
+ left: auto;
+ margin-bottom: 1px;
+}
+
+#plainDropDown > .dropdownplain {
+ position: relative;
+ clear: both;
+ float: left;
+ width: 100%;
+}
+#plainDropDown > .dropdownplain > ul > li {
+ border: 1px solid #c3c3c3;
+ border-radius: 4px;
+ min-width: 200px;
+}
+#plainDropDown ul li a {
+ padding: 5px 10px;
+ color: #333;
+}
+#plainDropDown > .dropdownplain > ul > li > a > span {
+ top: 4px;
+}
+#plainDropDown ul li a:hover {
+ color: #333;
+}
+#plainDropDown .dropdown-menu {
+ width: 100%;
+}
+
+
+
+/* Credit to bootsnipp.com for the css for the color graph */
+.colorgraph {
+ height: 5px;
+ border-top: 0;
+ background: #c4e17f;
+ border-radius: 5px;
+ background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
+ background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
+ background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
+ background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
+}
+
+/* Radio and CheckBoxes------------*/
+
+
+.funkyradio div {
+ clear: both;
+ overflow: hidden;
+}
+
+.funkyradio label {
+ width: 100%;
+ border-radius: 3px;
+ border: 1px solid #D1D3D4;
+ font-weight: normal;
+}
+
+.funkyradio input[type="radio"]:empty,
+.funkyradio input[type="checkbox"]:empty {
+ display: none;
+}
+
+.funkyradio input[type="radio"]:empty ~ label,
+.funkyradio input[type="checkbox"]:empty ~ label {
+ position: relative;
+ line-height: 2.5em;
+ text-indent: 3.25em;
+ margin-top: 2em;
+ cursor: pointer;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.funkyradio input[type="radio"]:empty ~ label:before,
+.funkyradio input[type="checkbox"]:empty ~ label:before {
+ position: absolute;
+ display: block;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ content: '';
+ width: 2.5em;
+ background: #D1D3D4;
+ border-radius: 3px 0 0 3px;
+}
+
+.funkyradio input[type="radio"]:hover:not(:checked) ~ label,
+.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
+ color: #888;
+}
+
+.funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
+.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
+ content: '\2714';
+ text-indent: .9em;
+ color: #C2C2C2;
+}
+
+.funkyradio input[type="radio"]:checked ~ label,
+.funkyradio input[type="checkbox"]:checked ~ label {
+ color: #777;
+}
+
+.funkyradio input[type="radio"]:checked ~ label:before,
+.funkyradio input[type="checkbox"]:checked ~ label:before {
+ content: '\2714';
+ text-indent: .9em;
+ color: #333;
+ background-color: #ccc;
+}
+
+.funkyradio input[type="radio"]:focus ~ label:before,
+.funkyradio input[type="checkbox"]:focus ~ label:before {
+ box-shadow: 0 0 0 3px #999;
+}
+
+.funkyradio-default input[type="radio"]:checked ~ label:before,
+.funkyradio-default input[type="checkbox"]:checked ~ label:before {
+ color: #333;
+ background-color: #ccc;
+}
+
+.funkyradio-primary input[type="radio"]:checked ~ label:before,
+.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
+ color: #fff;
+ background-color: #337ab7;
+}
+
+.funkyradio-success input[type="radio"]:checked ~ label:before,
+.funkyradio-success input[type="checkbox"]:checked ~ label:before {
+ color: #fff;
+ background-color: #5cb85c;
+}
+
+.funkyradio-danger input[type="radio"]:checked ~ label:before,
+.funkyradio-danger input[type="checkbox"]:checked ~ label:before {
+ color: #fff;
+ background-color: #d9534f;
+}
+
+.funkyradio-warning input[type="radio"]:checked ~ label:before,
+.funkyradio-warning input[type="checkbox"]:checked ~ label:before {
+ color: #fff;
+ background-color: #f0ad4e;
+}
+
+.funkyradio-info input[type="radio"]:checked ~ label:before,
+.funkyradio-info input[type="checkbox"]:checked ~ label:before {
+ color: #fff;
+ background-color: #5bc0de;
+}
+
+.btn-primary {
+ color: #fff;
+ background-color: #428bca;
+ border-color: #357ebd;
+ min-width:70px
+}
+
+.btn.outline {
+ background: none;
+
+}
+.btn-primary.outline {
+ border: 2px solid #0099cc;
+ color: #0099cc;
+}
+.modal-header {
+ /*background-color: #cccccc;*/
+ background: linear-gradient(to bottom, #fbfbfb 0, #f6f6f6 70%, #f0f0f0 100%);
+}
+
+/* Tree */
+
+#tree1 ul li {
+ list-style: none;
+ text-align: left;
+ margin-top: 7px;
+}
+
+/* Accordian Area */
+#accordionArea .panel-group .panel-title a:before {
+ font-family: "Glyphicons Halflings";
+ content:"\e259";/*\e094*/
+ /*position: absolute;
+ right: 20px;*/
+ font-size: 20px;
+ margin-right: 20px;
+ text-decoration: none !important;
+}
+#accordionArea .panel-group .panel-title a.collapsed:before {
+ content:"\e258";/*\e092*/
+}
+
+#accordionArea h3 {
+ width: 100%;
+ text-align: left;
+ background-color: #eaeaea;
+ border: none;
+ padding: 8px;
+ font-size: 20px;
+}
+#accordionArea h3 a {
+ text-decoration: none;
+}
+#accordionArea .panel-group .panel {
+ border: none;
+ box-shadow: none;
+ -webkit-box-shadow: none;
+}
+ div.panel-body {
+ text-align: justify;
+}
+
+/* Tab */
+#tabArea .tab-content div p {
+ text-align: justify;
+}
+
+/*Table*/
+#tableArea h3 {
+ text-align: left;
+ border: none;
+ padding-top: 5px;
+}
+
+#tableArea h3 span {
+ font-size: 12px;
+}
+
+/* Vertical Tab */
+.nav-stacked {
+ margin-top: 20px;
+ text-align: left;
+ border:none;
+}
+
+.nav-tabs>li.active>a {
+ border-top: 3px solid #4ac9ff;
+}
+.nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
+ border-top: 3px solid #4ac9ff;
+}
+.nav-tabs>li>a:hover {
+ border-color: transparent;
+ background-color: transparent;
+}
+.nav-stacked>li.active>a {
+ background-color: #ccc;
+ border: none;
+ border-radius: 4px;
+}
+
+#vtabArea .tab-content .tab-pane {
+ text-align: left;
+}
+#vtabArea .tab-content .tab-pane p {
+ text-align: justify;
+}
+
+.link_active {
+ /*background-color: lightslategrey;*/
+ font-style: italic;
+ color: #4ac9ff !important;
+ background:#fafafa;
+ border-left: 3px solid #4ac9ff;
+
+
+}
+
+/*input.ng-invalid {
+ background-color:yellow;
+}*/
+
+/* Functional & Notification*/
+
+#msgModal .modal-header, #funModal .modal-header {
+ padding: 9px 15px;
+ border-radius: 5px 5px 0 0;
+ color: #666;
+}
+
+#msgModal .modal-content {
+ width: 70%;
+ position: absolute;
+ left: 15%;
+ box-shadow: 0 6px 10px rgba(0,0,0,.3);
+ -webkit-box-shadow: 0 6px 10px rgba(0,0,0,.3);
+}
+#msgModal .modal-footer, #funModal .modal-footer {
+ border: none;
+ margin: 0 auto;
+ width: 100%;
+ text-align: center;
+}
+
+
+#myInput {
+ background-image: url('../images/searchicon.png'); /* Add a search icon to input */
+ background-position: 10px 9px; /* Position the search icon */
+ background-repeat: no-repeat; /* Do not repeat the icon image */
+ width: 100%; /* Full-width */
+ font-size: 16px; /* Increase font-size */
+ padding: 5px 20px 5px 40px; /* Add some padding */
+ border: 1px solid #ddd; /* Add a grey border */
+ margin-bottom: 12px; /* Add some space below the input */
+}
+
+#myTable_search {
+ border-collapse: collapse; /* Collapse borders */
+ width: 100%; /* Full-width */
+ border: 1px solid #ddd; /* Add a grey border */
+ font-size: 18px; /* Increase font-size */
+}
+
+#myTable_search th, #myTable td {
+ text-align: left; /* Left-align text */
+ padding: 12px; /* Add padding */
+}
+
+#myTable_search tr {
+ /* Add a bottom border to all table rows */
+ border-bottom: 1px solid #ddd;
+}
+
+#myTable_search tr.header, #myTable tr:hover {
+ /* Add a grey background color to the table header and on hover */
+ background-color: #f1f1f1;
+}
+
+/* List */
+#listArea {
+ margin-top: 25px;
+}
+#listArea .list {
+ /*border: 1px solid #333;*/
+ padding: 5px;
+}
+#listArea .list div {
+ margin: 5px 0;
+}
+
+#menu_accordion {
+ margin-top: 20px;
+}
+
+#menu_accordion li a{
+ padding-left: 42px;
+}
+#menu_accordion li a:hover {
+ color: #4ac9ff;
+}
+
+#rightContainer {
+ margin-top:20px;
+}
+
+#panel1 li:first-child{
+ margin-top:1px;
+}
+
+#menu_accordion #container, #menu_accordion #widgets, #menu_accordion #notifications, #menu_accordion #functional{
+ margin-bottom : 0px;
+ text-align : left;
+ background-color: #F5F5F5;
+}
+
+#menu_accordion h5{
+ margin-bottom : 0px;
+ text-align : left;
+ padding-left : 10px;
+ cursor: pointer;
+ letter-spacing: 3px;
+ width:100%;
+}
+
+.tableAlign{
+ text-align:left;
+}
+
+.chkboxAlign{
+ text-align:center;
+}
+
+#provinceTable th {
+ background-color: #e3e3e3;
+}
+
+#provinceTable.table-striped>tbody>tr:nth-child(even)>td {
+ background-color:#fafafa;
+}
+
+#provinceTable.table-striped>tbody>tr:nth-child(odd)>td {
+ background-color:#f7f7f7
+}
+#provinceTable.table-striped>tbody>tr:hover {
+ background-color: red;
+}
+
+.prvdel{
+ margin-left:20px;
+}
+
+.shortnoteHeader{
+ margin-top:50px;
+ text-align:left;
+ font-weight: bold;
+}
+.shortnoteText{
+ margin-top:20px;
+ text-align:left;
+}
+
+.ztree *{
+ font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
+}
+
+.noChild_link_active {
+ /*background-color: lightslategrey;*/
+ font-style: italic;
+ color: #4ac9ff !important;
+ background:#fafafa;
+}
+
+.rmpadding{
+ padding-left:0px !important;
+ padding-right:0px !important;
+}
+
+#menu_accordion .collapsed span {
+ background: url(../images/expand_arrow.png) 1px 3px no-repeat;
+ display: block;
+ float: left;
+ margin-bottom: -1px;
+ cursor: pointer;
+ width: 100%;
+ padding-left: 20px;
+}
+#menu_accordion span {
+ background: url(../images/collapse_arrow.png) 1px 3px no-repeat;
+ display: block;
+ float: left;
+ margin-bottom: -1px;
+ cursor: pointer;
+ width: 100%;
+ padding-left: 20px;
+}
+
+.magic-radio + label{
+ font-size:14px;
+}
+
+.panelbr{
+ border-left:0px;
+ border-right:0px;
+}
+
+.popover-title {
+ margin: 0;
+ padding: 8px 14px;
+ font-size: 14px;
+ font-weight: normal;
+ line-height: 18px;}
+
+.customPopover{
+ padding:10px 20px;
+}
+
+
+.css-form input.ng-invalid.ng-touched, textarea.ng-invalid.ng-touched {
+ background-color: #FA787E;
+}
+
+.css-form input.ng-valid.ng-touched, textarea.ng-valid.ng-touched {
+ background-color: white;
+}
+
+.errMsg{
+
+ color:red;
+}
diff --git a/portal-common/src/main/webapp/framework/browser/js/DataService.js b/portal-common/src/main/webapp/framework/browser/js/DataService.js
new file mode 100644
index 00000000..c7da841a
--- /dev/null
+++ b/portal-common/src/main/webapp/framework/browser/js/DataService.js
@@ -0,0 +1,137 @@
+/*
+
+ Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+ 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.
+
+*/
+
+app.factory("DataService", function($http, $log){
+ return {
+ getAllData: function (value) {
+ //var value = $scope.param;
+ return $http({
+ url: 'http://localhost:8080/POC_NodeToServletPorting_Server/?widgetType=' + value,
+ headers: {'Content-Type': 'application/json'},
+ method: 'GET'
+ }).then(function (response) {
+ $log.info(response.data);
+ return response.data;
+ })
+ },
+
+ getAllProvinceData : function() {
+ return $http({
+ url: 'http://localhost:3000/api/getAllProvinceData',
+ method: 'GET',
+ headers: {'Content-Type': 'application/json'}
+ }).then(function(response){
+ //$log.info(response);
+ return response.data;
+ });
+ },
+ addProvinceData : function(provinceDetail) {
+ return $http({
+ url: 'http://localhost:3000/api/addProvinceData',
+ method: 'POST',
+ data: provinceDetail,
+ headers: {'Content-Type': 'application/json '}
+ }).then(function(response){
+ console.log("Response : ");
+ $log.info(response.data);
+ return response.data;
+ });
+ },
+ deleteProvinceData : function(idList) {
+ return $http({
+ url: 'http://localhost:3000/api/deleteProvinceData',
+ method: 'POST',
+ data: {'idList':idList},
+ headers: {'Content-Type': 'application/json'}
+ }).then(function(response){
+ console.log("Successfully Deleted..");
+ $log.info(response);
+ return response.data;
+ });
+ },
+ editProvinceData : function(provinceDetail) {
+ return $http({
+ url: 'http://localhost:3000/api/editProvinceData',
+ method: 'POST',
+ data: provinceDetail,
+ headers: {'Content-Type': 'application/json'}
+ }).then(function(response){
+ console.log("Successfully Edited...");
+ $log.info(response);
+ return response.data;
+ });
+ }
+ }
+});
+
+app.factory('LoginService', function($http, $log) {
+ var admin = 'admin';
+ var pass = 'pass';
+ var isAuthenticated = false;
+
+ return {
+ login : function(user) {
+ console.log(user);
+ return $http({
+ url: 'http://localhost:8081/api/signin',//http://192.168.4.161:3000/api/login
+ method: 'POST',
+ data: {'name':user.username, 'pswd':user.password},
+ headers: {'Content-Type': 'application/json'}
+ }).then(function(response){
+ $log.info(response);
+ if(response.status == 200) {
+ console.log("Success");
+ //Success
+ isAuthenticated = true;
+ }
+ else {
+ console.log("Fail");
+ isAuthenticated = false;
+ }
+ console.log("isAuthenticated: " + isAuthenticated);
+ return isAuthenticated;
+ }, function(reason){
+ $log.info(reason);
+ console.log("Fail");
+ isAuthenticated = false;
+ return reason;
+ });
+ /*isAuthenticated = user.username === admin && user.password === pass;
+ return isAuthenticated;*/
+ },
+ isAuthenticated : function() {
+ return isAuthenticated;
+ },
+ registerUser: function(user){
+ console.log("New Registration: " + JSON.stringify(user));
+ return $http({
+ url: 'http://localhost:8081/api/signup',//http://192.168.4.161:3000/api/login
+ method: 'POST',
+ data: {'name':user.username, 'pswd':user.password, 'email':user.email},
+ headers: {'Content-Type': 'application/json'}
+ }).then(function(response){
+ $log.info(response);
+ },function(reason){
+ $log.info(reason);
+ });
+
+
+ }
+ };
+
+}); \ No newline at end of file
diff --git a/portal-common/src/main/webapp/framework/browser/js/app.js b/portal-common/src/main/webapp/framework/browser/js/app.js
new file mode 100644
index 00000000..4ffe2c87
--- /dev/null
+++ b/portal-common/src/main/webapp/framework/browser/js/app.js
@@ -0,0 +1,1312 @@
+/*
+
+ Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+ 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.
+
+*/
+
+var app = angular.module("POCApp", ["ui.router", "ngTable"])
+
+ /*.run(function($rootScope, $location, $state, LoginService) {
+ $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams){
+ if (toState.authenticate && !LoginService.isAuthenticated()){
+ // User isn’t authenticated
+ $state.transitionTo("login");
+ event.preventDefault();
+ }
+ });
+ })*/
+ .config(function($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider){
+ //$routeProvider.caseInsensitiveMatch = true;
+ $urlMatcherFactoryProvider.caseInsensitive(true);
+ $urlRouterProvider.otherwise('/login');
+ //$locationProvider.html5Mode(true).hashPrefix('!');
+ $stateProvider
+ .state('login', {
+ url : '/login',
+ templateUrl : 'templates/login.html',
+ controller : 'LoginController',
+ authenticate: false
+ })
+ .state('register', {
+ url : '/register',
+ templateUrl : 'templates/register.html',
+ controller : 'registerController',
+ authenticate: false
+ })
+ .state("home", {
+ url: "/home",
+ templateUrl : "templates/home.html",
+ controller : "homeCtrl",
+ authenticate: true
+ })
+ .state("home.tree", {
+ url: "/tree",
+ templateUrl : "templates/tree.html",
+ controller : "treeCtrl",
+ authenticate: true
+ })
+ .state("home.accordion", {
+ url: "/accordion",
+ templateUrl : "templates/accordion.html",
+ controller : "accordionCtrl",
+ authenticate: true
+ })
+ .state("home.tabs", {
+ url: "/tabs",
+ templateUrl : "templates/tabs.html",
+ controller : "tabsCtrl",
+ authenticate: true
+ })
+ .state("home.vtabs", {
+ url: "/vtabs",
+ templateUrl : "templates/verticalTab.html",
+ controller : "vTabCtrl",
+ authenticate: true
+ })
+ .state("home.table", {
+ url: "/table",
+ templateUrl : "templates/table.html",
+ controller : "tableCtrl",
+ authenticate: true
+ })
+ .state("home.buttons", {
+ url: "/buttons",
+ templateUrl : "templates/buttons.html",
+ controller : "buttonsCtrl",
+ authenticate: true
+ })
+ /*state for radio button and checkboxes-------------------------------------------------*/
+ .state("home.radiobuttons", {
+ url: "/radiobuttons",
+ templateUrl : "templates/radioButtons.html",
+ controller : "radioCtrl",
+ authenticate: true
+ })
+ .state("home.checkboxes", {
+ url: "/checkboxes",
+ templateUrl : "templates/checkBoxes.html",
+ controller : "checkBoxCtrl",
+ authenticate: true
+ })
+ .state("home.dropdown", {
+ url: "/dropdown",
+ templateUrl: "templates/dropdown.html",
+ controller: "dropdownCtrl",
+ authenticate: true
+ })
+
+ .state("home.list", {
+ url: "/list",
+ /*template:"<h3>Under Progress</h3>",*/
+ templateUrl : "templates/list.html",
+ controller : "listCtrl",
+ authenticate: true
+ })
+
+ .state("home.provinceMgmt", {
+ url: "/provinceMgmt",
+ templateUrl : "templates/provinceMgmt.html",
+ controller : "provinceMgmtCtrl",
+ authenticate: true
+ })
+ .state("home.tooltip", {
+ url: "/tooltip",
+ templateUrl : "templates/textarea.html",
+ controller : "toolCtrl",
+ authenticate: true
+ })
+
+ .state("home.notification", {
+ url: "/notification",
+ templateUrl : "templates/notification.html",
+ controller : "notificationCtrl",
+ authenticate: true
+ })
+ .state("home.functional", {
+ url: "/functional",
+ templateUrl : "templates/functional.html",
+ controller : "functionalCtrl",
+ authenticate: true
+ })
+
+
+ })
+ .controller('LoginController', function($scope, $rootScope, $stateParams, $state, LoginService) {
+ $rootScope.title = "AngularJS Login Sample";
+
+ $scope.formSubmit = function() {
+ LoginService.login($scope.user)
+ .then(function (data) {
+ if (data) {
+ $scope.error = '';
+ $scope.user.username = '';
+ $scope.user.password = '';
+ $state.transitionTo('home.tree');
+ }
+ else {
+ $scope.error = "Incorrect username/password !";
+ }
+ }, function (reason) {
+ $scope.error = "Incorrect username/password !";
+ });
+ };
+
+ })
+ .controller('registerController', function($scope, $state, LoginService){
+ $scope.formSubmit = function() {
+ if($scope.user.password === $scope.user.confpassword) {
+ LoginService.registerUser($scope.user)
+ .then(function (data) {
+ $state.transitionTo("login");
+ }, function () {
+ console.log("Failed to register");
+ });
+ }
+ else {
+ console.log("Password not matched...");
+ var dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var data = {'title':'Error',showClose:true, 'closeBtnTxt':'Ok', 'icon':'glyphicon glyphicon-exclamation-sign','iconColor':'icon_error','msg':'Password and Confirm password does not match.', buttons:[]};
+ var html = Mustache.to_html(dialog_tpl, data);
+ $(html).modal({backdrop: "static"}); //backdrop: "static" - for grayed out and no outside click work, backdrop: false - no grayed out*/
+ }
+ };
+ })
+ .controller("homeCtrl", function($scope, $state, DataService){
+ $scope.message = "Home Page";
+
+ /*$scope.geticonClass = function() {
+ if($( "#panel1" ).hasClass( "in" )){
+ return "openo_accordion_ui-icon-expand";
+ }
+ else{
+ return "openo_accordion_ui-icon-expand.current";
+ }
+
+
+ }*/
+
+
+
+ /* $scope.accordionLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("left menu loading..");
+ menuaccordion();
+ return true;
+ }
+ console.log("left menu not loading..");
+ return false;
+ }
+
+ function menuaccordion() {
+ var accordion_tpl = $(modelTemplate).filter('#menu_accordion').html();
+
+ $.getJSON('./data/homelinks.json', function (accordion) {
+ var html = Mustache.to_html(accordion_tpl, accordion.accordion_data);
+ $('#accordionmenuid').html(html);
+ });
+ }*/
+
+ })
+
+ /* Tree Controller */
+ .controller("treeCtrl", function($scope,DataService,$log){
+ $scope.message = "Tree Data";
+ var setting = {};
+ /*$scope.treeLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Tree data loading..");
+ tree();
+ return true;
+ }
+ console.log("Tree data not loading..");
+ return false;
+ }*/
+ $scope.init = function() {
+ $scope.param="treeData";
+ $scope.shortNote="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.treeData = data;
+ tree();
+ console.log("inside tree");
+ $log.info($scope.treeData);
+ });
+ DataService.getAllData($scope.shortNote)
+ .then(function(data1){
+ $scope.treeTip = data1.treeTip;
+ console.log("inside treeTip");
+ $log.info(data1);
+ });
+ }
+ function tree() {
+ zNodes = $scope.treeData;
+ $.fn.zTree.init($("#tree1"), setting, zNodes);
+
+ }
+ })
+
+ /* Accordian Controller */
+ .controller("accordionCtrl", function($scope,DataService, $log){
+
+ $scope.message = "Accordion";
+
+ $scope.accordionLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("accordion loading..");
+
+ accordion();
+ return true;
+ }
+ console.log("accordion not loading..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="accordionData";
+ $scope.accordionTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.accordion = data;
+ accordion();
+ console.log("inside accordion");
+ $log.info(data);
+ });
+ DataService.getAllData($scope.accordionTip)
+ .then(function(data){
+ $scope.accordionTipData = data.accordionTip;
+ console.log("inside accordion");
+ $log.info(data);
+ });
+ }
+
+ function accordion() {
+
+ var accordion_tpl = $(modelTemplate).filter('#accordion').html();
+ console.log("in acc" );
+ var html = Mustache.to_html(accordion_tpl, $scope.accordion.accordion_data);
+ $('#accordion').html(html);
+ }
+ })
+ .controller("tabsCtrl", function($scope, $state, DataService, $log){
+ $scope.message = "Tabs";
+ $scope.tabLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Tab is loading..");
+ loadTabData();
+ return true;
+ }
+ console.log("Not ready..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="tabData";
+ $scope.tabTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.tabdata = data;
+ loadTabData();
+ console.log("inside tabs");
+ $log.info(data);
+ });
+ DataService.getAllData($scope.tabTip)
+ .then(function(data){
+ $scope.tabTipData = data.tabTip;
+ $log.info(data);
+ });
+ }
+
+ function loadTabData() {
+ var tab_tpl = $(modelTemplate).filter('#tabs').html();
+ var html = Mustache.to_html(tab_tpl, $scope.tabdata.tabData);
+ $('#tabArea').html(html);
+ }
+
+ })
+ .controller("vTabCtrl", function($scope, $state, DataService){
+ $scope.message = "Vertical Tabs";
+
+ $scope.vtabLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Vertical Tab is loading..");
+ loadvTabData();
+ return true;
+ }
+ console.log("Not ready..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="vtabData";
+ $scope.vtabTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(vtabdata){
+ $scope.data = vtabdata;
+ loadvTabData();
+ console.log("inside vTab");
+ });
+ DataService.getAllData($scope.vtabTip)
+ .then(function(vtabdata){
+ $scope.vtabTipdata = vtabdata.vtabTip;
+ console.log("inside vTab");
+ });
+ }
+
+ function loadvTabData() {
+
+ var vtab_tpl = $(modelTemplate).filter('#vtabs').html();
+ var html = Mustache.to_html(vtab_tpl, $scope.data.vtabData);
+ $('#vtabArea').html(html);
+ }
+ })
+ .controller("tableCtrl", function($scope, $state, DataService){
+ $scope.message = "Tables";
+
+ $scope.tableLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Table is loading..");
+ loadTableData();
+ return true;
+ }
+ console.log("Not ready..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="tableData";
+ $scope.tableTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.tableData = data;
+ loadTableData();
+ console.log("inside table");
+ });
+
+ DataService.getAllData($scope.tableTip)
+ .then(function(data){
+ $scope.tableTipData = data.tableTip;
+ console.log("inside table");
+ });
+ }
+
+ function loadTableData() {
+
+ var table_tpl = $(modelTemplate).filter('#table').html();
+
+ var html = Mustache.to_html(table_tpl, $scope.tableData.basic_table_data);
+ $('#basictableArea').html(html);
+
+ var html = Mustache.to_html(table_tpl, $scope.tableData.str_table_data);
+ $('#strippedtableArea').html(html);
+
+ var html = Mustache.to_html(table_tpl, $scope.tableData.cond_table_data);
+ $('#condensedtableArea').html(html);
+ }
+ })
+
+ /* Buttons Controller */
+ .controller("buttonsCtrl", function($scope,DataService,$log){
+ $scope.message = "Types of Buttons";
+ $scope.buttonTip="shortNote";
+
+ $scope.init = function() {
+ $scope.param="buttonsData";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.buttons = data;
+ defaultButtons();
+ visualButtons();
+ sizeButtons();
+ iconButtons();
+ console.log("inside accordion");
+ $log.info(data);
+ });
+ DataService.getAllData($scope.buttonTip)
+ .then(function(data){
+ $scope.buttonTipData = data.buttonTip;
+ console.log("inside table");
+ });
+ }
+
+ function defaultButtons(){
+ console.log("Default buttons Loaded..");
+ //Here your view content is fully loaded !!
+ var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();
+ var def_icon_button_tpl = $(modelTemplate).filter('#defaultIconButtons').html();
+
+ var html = Mustache.to_html(def_button_tpl, $scope.buttons.default_btn_data.def_button);
+ $('#defaultButtonArea').html(html);
+
+ var html = Mustache.to_html(def_icon_button_tpl, $scope.buttons.default_btn_data.def_print_button);
+ $('#defaultButtonArea').append(html);
+
+ var html = Mustache.to_html(def_icon_button_tpl, $scope.buttons.default_btn_data.def_print_button_right);
+ $('#defaultButtonArea').append(html);
+ }
+
+
+ function visualButtons(){
+ console.log("Loaded..");
+ //Here your view content is fully loaded !!
+ var visual_button_tpl = $(modelTemplate).filter('#visualButtons').html();
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_pri_btn_data);
+ $('#visualButtonArea').html(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_sec_btn_data);
+ $('#visualButtonArea').append(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_succ_btn_data);
+ $('#visualButtonArea').append(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_inf_btn_data);
+ $('#visualButtonArea').append(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_warn_btn_data);
+ $('#visualButtonArea').append(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_dang_btn_data);
+ $('#visualButtonArea').append(html);
+
+ var html = Mustache.to_html(visual_button_tpl, $scope.buttons.visual_btn_data.vis_link_btn_data);
+ $('#visualButtonArea').append(html);
+ }
+
+ function sizeButtons() {
+ var size_button_tpl = $(modelTemplate).filter('#sizeButtons').html();
+
+ var html = Mustache.to_html(size_button_tpl, $scope.buttons.diffSize_btn_data.size_small_btn_data);
+ $('#sizeButtonArea').html(html);
+
+ var html = Mustache.to_html(size_button_tpl, $scope.buttons.diffSize_btn_data.size_large_btn_data);
+ $('#sizeButtonArea').append(html);
+
+ var html = Mustache.to_html(size_button_tpl, $scope.buttons.diffSize_btn_data.size_block_btn_data);
+ $('#sizeButtonArea').append(html);
+
+ }
+
+ function iconButtons() {
+ var icon_button_tpl = $(modelTemplate).filter('#iconButtons').html();
+
+ var html = Mustache.to_html(icon_button_tpl, $scope.buttons.icon_btn_data.search_icon_btn_data);
+ $('#iconButtonArea').html(html);
+
+ var html = Mustache.to_html(icon_button_tpl, $scope.buttons.icon_btn_data.search_icon_styled_btn_data);
+ $('#iconButtonArea').append(html);
+
+ var html = Mustache.to_html(icon_button_tpl, $scope.buttons.icon_btn_data.print_icon_btn_data);
+ $('#iconButtonArea').append(html);
+
+ }
+
+ $scope.defaultButtonsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("default buttons loading..");
+ defaultButtons();
+ return true;
+ }
+ console.log("default buttons not loading..");
+ return false;
+ }
+
+ $scope.visualButtonsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("visual buttons loading..");
+ visualButtons();
+ return true;
+ }
+ console.log("visual buttons not loading..");
+ return false;
+ }
+
+ $scope.sizeButtonsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("size buttons loading..");
+ sizeButtons();
+ return true;
+ }
+ console.log("size buttons not loading..");
+ return false;
+ }
+
+ $scope.iconButtonsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("icon buttons loading..");
+ iconButtons();
+ return true;
+ }
+ console.log("icon buttons not loading..");
+ return false;
+ }
+ })
+ /* Drop down----------------------*/
+ .controller("dropdownCtrl", function($scope, DataService) {
+ $scope.message = "You selected drop down";
+ $scope.subIsLoaded = function () {
+ if (modelTemplate != null) {
+ console.log("Loading..");
+ loadDrop();
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="dropdownData";
+ $scope.dropdownTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.dropdown = data;
+ loadDrop();
+ });
+ DataService.getAllData($scope.dropdownTip)
+ .then(function(data){
+ $scope.dropdownTipData = data.dropdownTip;
+ console.log("inside table");
+ });
+ }
+ function loadDrop() {
+ var drop_tpl = $(modelTemplate).filter('#dropDown').html();
+ var dropHeader_tpl = $(modelTemplate).filter('#dropDownHeader').html();
+ var dropSimple_tpl = $(modelTemplate).filter('#simpleDropdownTmpl').html();
+
+ var html = Mustache.to_html(drop_tpl, $scope.dropdown.dropped_down_data);
+ $('#dropArea').html(html);
+
+ var html = Mustache.to_html(drop_tpl, $scope.dropdown.dropped_up_data);
+ $('#dropAreaUP').html(html);
+
+ var html = Mustache.to_html(dropHeader_tpl, $scope.dropdown.dropHeader_data);
+ $('#dropAreaHeader').html(html);
+
+ var html = Mustache.to_html(dropSimple_tpl, $scope.dropdown.dropSimple_data);
+ $('#plainDropDown').html(html);
+
+ }
+ })
+ .controller("radioCtrl", function($scope, DataService, $log) {
+ $scope.message = "You selected radio button tab";
+ var lodedOnce = false;
+ $scope.subIsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Loading..");
+ loadRadioBtn();
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="radioData";
+ $scope.radioTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.radioButton = data;
+ loadRadioBtn();
+ console.log("inside button");
+ $log.info(data);
+ });
+
+ DataService.getAllData($scope.radioTip)
+ .then(function(data){
+ $scope.radioTipData = data.radioTip;
+ console.log("inside table");
+ });
+ }
+ function loadRadioBtn(){
+ console.log("lodedOnce : "+lodedOnce);
+
+ var radio_button_tpl = $(modelTemplate).filter('#radioButtons').html();
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_default_data);
+ $('#radioBtnArea').html(html);
+
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_primary_data);
+ $('#radioBtnArea').append(html);
+
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_success_data);
+ $('#radioBtnArea').append(html);
+
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_danger_data);
+ $('#radioBtnArea').append(html);
+
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_Warn_data);
+ $('#radioBtnArea').append(html);
+
+ var html = Mustache.to_html(radio_button_tpl, $scope.radioButton .radio_btn_info_data);
+ $('#radioBtnArea').append(html);
+
+ }
+ })
+ .controller("checkBoxCtrl", function($scope, DataService) {
+ $scope.message = "You selected checkbox tab";
+ $scope.subIsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Loading..");
+ loadCheckBox();
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+ $scope.init = function() {
+ $scope.param="checkboxData";
+ $scope.checkboxTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.checkBox = data;
+ loadCheckBox();
+ });
+ DataService.getAllData($scope.checkboxTip)
+ .then(function(data){
+ $scope.checkboxTipData = data.checkboxTip;
+ console.log("inside table");
+ });
+ }
+ function loadCheckBox() {
+ var check_box_tpl = $(modelTemplate).filter('#checkBoxes').html();
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_default_data);
+ $('#CheckBoxArea').html(html);
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_primary_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_success_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_danger_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_warn_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, $scope.checkBox.checkbox_info_data);
+ $('#CheckBoxArea').append(html);
+
+ /*$.getJSON('./data/checkboxData.json', function(c_data) {
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_default_data);
+ $('#CheckBoxArea').html(html);
+
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_primary_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_success_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_danger_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_warn_data);
+ $('#CheckBoxArea').append(html);
+
+ var html = Mustache.to_html(check_box_tpl, c_data.checkbox_info_data);
+ $('#CheckBoxArea').append(html);
+ });*/
+ }
+ })
+
+ /* Reference Code -- Remove after use */
+ .controller("coursesCtrl", function($scope, DataService){
+ $scope.message = "Courses Offered";
+ $scope.courses = ["Java", "C/C++", "JavaScript", "AngularJS", "NodeJS", "HTML", "Python", "Action Script"];
+ $scope.showDialog = function() {
+ /*var dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var data = {'title':'Shahid Noor','showClose':true,'closeBtnTxt':'Cancel','icon':'glyphicon glyphicon-off','iconColor':'icon_warn','msg':'Good! There is a message that can be used to show on the screen. There is a message that can be used to show on the screen', buttons:[{"text": "Ok", 'action':'callThis()'},{"text": "Show"}]};
+ var html = Mustache.to_html(dialog_tpl, data);
+ $(html).modal({backdrop: "static"}); //backdrop: "static" - for grayed out and no outside click work, backdrop: false - no grayed out*/
+
+ var def_button_tpl = $(modelTemplate).filter('#visualButtons').html();
+ var def_btn_data = {'title':"asas", 'type':'primary'};
+ var html = Mustache.to_html(def_button_tpl, def_btn_data);
+ $('#sampleArea').html(html);
+ };
+
+ // $scope.$on('$viewContentLoaded', function(){
+ function loaded(){
+ console.log("Loaded..");
+ //Here your view content is fully loaded !!
+ var def_button_tpl = $(modelTemplate).filter('#dropDown').html();
+ var def_btn_data = {'title':'Shahid Noor','position':'down', items:[{"itemLabel": "Ok"},{"itemLabel": "Show"}]};
+ var html = Mustache.to_html(def_button_tpl, def_btn_data);
+ $('#sampleArea').html(html);
+
+ }
+ $scope.subIsLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Loading..");
+ loaded();
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+ })
+
+ .controller("toolCtrl", function($scope, DataService, $compile, $log){
+ $scope.toolTip = "shortNote";
+ $scope.toolTipContent = "textArea";
+
+ DataService.getAllData($scope.toolTipContent)
+ .then(function(data){
+ $log.info(data.Note.placement);
+ $scope.noteContent = data.Note.message;
+ $scope.notePlacement = data.Note.placement;
+ $scope.errMsg = data.ErrMsg;
+ console.log($scope.noteContent + " " + $scope.notePlacement);
+ loadTextArea();
+ });
+ DataService.getAllData($scope.toolTip)
+ .then(function(data){
+ $scope.toolTipData = data.toolTip;
+ //loadTextArea();
+ });
+
+ //$('[data-toggle="popover"]').popover();
+
+
+
+ function loadTextArea() {
+ var text = $(modelTemplate).filter('#fname').html();
+ var email = $(modelTemplate).filter('#email').html();
+ var url = $(modelTemplate).filter('#url').html();
+ var password = $(modelTemplate).filter('#password').html();
+ var numeric = $(modelTemplate).filter('#numeric').html();
+ var dot = $(modelTemplate).filter('#dot').html();
+ var dateinput = $(modelTemplate).filter('#dateinput').html();
+ var monthinput = $(modelTemplate).filter('#monthinput').html();
+ var weekinput = $(modelTemplate).filter('#weekinput').html();
+ var timeinput = $(modelTemplate).filter('#timeinput').html();
+ var ipv4 = $(modelTemplate).filter('#ipv4').html();
+ var ipv6 = $(modelTemplate).filter('#ipv6').html();
+ var textarea = $(modelTemplate).filter('#textarea').html();
+
+ var note = $(modelTemplate).filter('#note').html();
+
+ var html = Mustache.to_html(text, $scope.errMsg);
+ $('#fname').html($compile(html)($scope));
+
+ var html = Mustache.to_html(email, $scope.errMsg);
+ $('#email').html($compile(html)($scope));
+
+ var html = Mustache.to_html(url, $scope.errMsg);
+ $('#url').html($compile(html)($scope));
+
+ var html = Mustache.to_html(password, $scope.errMsg);
+ $('#password').html($compile(html)($scope));
+
+ var html = Mustache.to_html(numeric, $scope.errMsg);
+ $('#numeric').html($compile(html)($scope));
+
+
+ var html = Mustache.to_html(dot, $scope.errMsg);
+ $('#dot').html($compile(html)($scope));
+
+ var html = Mustache.to_html(dateinput, $scope.errMsg);
+ $('#dateinput').html($compile(html)($scope));
+
+ var html = Mustache.to_html(monthinput, $scope.errMsg);
+ $('#monthinput').html($compile(html)($scope));
+
+ var html = Mustache.to_html(weekinput, $scope.errMsg);
+ $('#weekinput').html($compile(html)($scope));
+
+ var html = Mustache.to_html(timeinput, $scope.errMsg);
+ $('#timeinput').html($compile(html)($scope));
+
+ var html = Mustache.to_html(ipv4, $scope.errMsg);
+ $('#ipv4').html($compile(html)($scope));
+
+ var html = Mustache.to_html(ipv6, $scope.errMsg);
+ $('#ipv6').html($compile(html)($scope));
+
+ var html = Mustache.to_html(textarea, $scope.errMsg);
+ $('#textarea').html($compile(html)($scope));
+
+
+
+ var html = Mustache.to_html(note, {"placement":$scope.notePlacement});
+ $('#note').html(html);
+ $("#noteanchor").popover({
+ template: '<div class="popover fade bottom in customPopover"><div class="arrow"></div>'+$scope.noteContent+'</div>'
+ });
+
+ $scope.validatetextbox = function (value){
+ if($scope.textbox) {
+ $scope.textboxErr = false;
+ }
+ else
+ $scope.textboxErr = true;
+
+ }
+ $scope.validateemail = function (value){
+ if($scope.email) {
+ $scope.emailErr = false;
+ }
+ else
+ $scope.emailErr = true;
+
+ }
+ $scope.validateurl = function (value){
+ if($scope.url) {
+ $scope.urlErr = false;
+ }
+ else
+ $scope.urlErr = true;
+
+ }
+ $scope.validatepassword = function (value){
+ if($scope.password) {
+ $scope.passwordErr = false;
+ }
+ else
+ $scope.passwordErr = true;
+
+ }
+ $scope.validatenumeric = function (value){
+ if($scope.number) {
+ $scope.numericErr = false;
+ }
+ else
+ $scope.numericErr = true;
+
+ }
+ $scope.validatedot = function (value){
+ if($scope.datetime) {
+ $scope.dotErr = false;
+ }
+ else
+ $scope.dotErr = true;
+
+ }
+ $scope.validatedateinput = function (value){
+ if($scope.date) {
+ $scope.dateinputErr = false;
+ }
+ else
+ $scope.dateinputErr = true;
+
+ }
+ $scope.validatemonthinput = function (value){
+ if($scope.month) {
+ $scope.monthinputErr = false;
+ }
+ else
+ $scope.monthinputErr = true;
+
+ }
+ $scope.validateweek = function (value){
+ if($scope.week) {
+ $scope.weekinputErr = false;
+ }
+ else
+ $scope.weekinputErr = true;
+
+ }
+ $scope.validatetime = function (value){
+ if($scope.time) {
+ $scope.timeinputErr = false;
+ }
+ else
+ $scope.timeinputErr = true;
+
+ }
+ $scope.validateipv4 = function (value){
+ if($scope.ipv4) {
+ $scope.ipv4Err = false;
+ }
+ else
+ $scope.ipv4Err = true;
+
+ }
+ $scope.validateipv6 = function (value){
+ if($scope.ipv6) {
+ $scope.ipv6Err = false;
+ }
+ else
+ $scope.ipv6Err = true;
+
+ }
+
+ $scope.validatetextarea = function (value){
+ if($scope.textarea) {
+ $scope.textareaErr = false;
+ }
+ else
+ $scope.textareaErr = true;
+
+ }
+
+
+
+ }
+
+
+ })
+
+
+
+
+
+
+
+ .controller("notificationCtrl", function($scope, DataService){
+ $scope.message = "Notification and Messages";
+ $scope.notificationTip = "shortNote";
+
+ var dialog_tpl;
+ $scope.templateLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Loading..");
+
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+ $scope.init = function() {
+ $scope.param="notificationData";
+ $scope.notificationTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.notification = data;
+ });
+ DataService.getAllData($scope.notificationTip)
+ .then(function(data){
+ $scope.notificationTipData = data.notificationTip;
+ });
+ }
+
+ $scope.showError = function() {
+ dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.notification.err_data);
+ $(html).modal({backdrop: "static"});//backdrop: "static" - for grayed out and no outside click work, backdrop: false - no grayed out*!
+ }
+
+ $scope.showWarning = function() {
+ dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.notification.warn_data);
+ $(html).modal();
+ }
+
+ $scope.showInfo = function() {
+ dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.notification.info_data);
+ $(html).modal();
+ }
+ $scope.showConfirm = function() {
+ dialog_tpl = $(modelTemplate).filter('#personDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.notification.confirm_data);
+ $(html).modal({backdrop: "static"}); //backdrop: "static" - for grayed out and no outside click work, backdrop: false - no grayed out*!/
+ }
+
+ })
+
+ .controller("functionalCtrl", function($scope, DataService){
+ $scope.message = "Functional Flow";
+
+ var dialog_tpl;
+ $scope.templateLoaded = function() {
+ if(modelTemplate != null) {
+ console.log("Loading..");
+
+ return true;
+ }
+ console.log("Not Loaded..");
+ return false;
+ }
+
+ $scope.init = function() {
+ $scope.param="functionalData";
+ $scope.functionalTip="shortNote";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.functional = data;
+ });
+ DataService.getAllData($scope.functionalTip)
+ .then(function(data){
+ $scope.functionalTipData = data.functionalTip;
+ });
+ }
+ $scope.showCreate = function() {
+ dialog_tpl = $(modelTemplate).filter('#functionalDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.functional.create_data);
+ $(html).modal();
+ }
+ $scope.showModify = function() {
+ dialog_tpl = $(modelTemplate).filter('#functionalDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.functional.modify_data);
+ $(html).modal();
+ }
+ $scope.showDelete = function() {
+ dialog_tpl = $(modelTemplate).filter('#functionalDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.functional.delete_data);
+ $(html).modal();
+ }
+ $scope.showWorkflow = function() {
+ dialog_tpl = $(modelTemplate).filter('#functionalDialog').html();
+ var html = Mustache.to_html(dialog_tpl, $scope.functional.workflow_data);
+ $(html).modal();
+ }
+ })
+
+ .controller("listCtrl", function($scope, $log, DataService){
+ $scope.message = "List Page";
+ $scope.listTip = "shortNote";
+ $scope.init = function() {
+ console.log("Shahid... ng-init");
+ $scope.param="list";
+ DataService.getAllData($scope.param)
+ .then(function(data){
+ $scope.mainlistItem = data;
+ }, function(reason){
+ $scope.portfolios = [];
+
+ });
+
+ DataService.getAllData($scope.listTip)
+ .then(function(data){
+ $scope.listTipData = data.listTip;
+ });
+ }
+ $scope.loadSubMenuPage = function(index) {
+ $log.info($scope.mainlistItem);
+ $scope.subMenuListItem = $scope.mainlistItem[index].subMenu;
+ $scope.subsubMenuListItem = [];
+ }
+ $scope.loadSubSubMenuPage = function(index) {
+ $log.info($scope.subMenuListItem);
+ console.log("index: "+index);
+ $scope.subsubMenuListItem = $scope.subMenuListItem[index].subsubMenu;
+ }
+ })
+
+ .controller("provinceMgmtCtrl", function($scope, $log, DataService, $state, $compile, NgTableParams){
+ $scope.message = "Province Management";
+ $scope.provinceTip = "shortNote";
+ /*$scope.provinceData = [
+ {id:1, province_name:'First', ip:'192.168.1.45', port:'8080'},
+ {id:2, province_name:'Second', ip:'192.168.1.5', port:'8081'},
+ {id:3, province_name:'Third', ip:'192.168.1.15', port:'8082'},
+ {id:4, province_name:'Fourth', ip:'192.168.1.28', port:'8083'},
+ {id:5, province_name:'Fifth', ip:'192.168.1.19', port:'8084'}
+ ];*/
+
+ $scope.init = function() {
+ console.log("Shahid... ng-init");
+ DataService.getAllProvinceData()
+ .then(function(data){
+ $scope.provinceData = data.provinceData;
+ console.log("Data: ");
+ loadButtons();
+ $log.info(data.provinceData);
+ }, function(reason){
+ $scope.message = "Error is :" + JSON.stringify(reason);
+ });
+
+ DataService.getAllData($scope.provinceTip)
+ .then(function(data){
+ $scope.provinceTipData = data.provinceTip;
+ });
+ }
+
+ /*DataService.getAllProvinceData()
+ .then(function(data){
+ $scope.provinceData = data.provinceData;
+ console.log("Data: ");
+ $log.info(data.provinceData);
+ }, function(reason){
+ $scope.message = "Error is :" + JSON.stringify(reason);
+ });*/
+ /*DataService.getAllData($scope.provinceTip)
+ .then(function(data){
+ $scope.provinceTipData = data.provinceTip;
+ });*/
+
+ function loadButtons() {
+ var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();
+ var add_data = {"title":"Add", "clickAction":"showAddModal()"};
+ var delete_data = {"title":"Delete Selected", "clickAction":"deleteData()"};
+ var addhtml = Mustache.to_html(def_button_tpl, add_data);
+ var deletehtml = Mustache.to_html(def_button_tpl, delete_data);
+ $('#provinceAction').html($compile(addhtml)($scope));
+ $('#provinceAction').append($compile(deletehtml)($scope));
+
+ $scope.checkboxes = { 'checked': false, items: {} };
+
+ //var data = [{id: 1, name: "Moroni", age: 50}, {id: 2, name: "ABC", age: 30}, {id: 3, name: "Morhoni", age: 10}, {id: 4, name: "DABC", age: 31}, {id: 5, name: "Noor", age: 30}, {id: 6, name: "ABCD", age: 40}, {id: 7, name: "DABC", age: 31}, {id: 8, name: "Noor", age: 30}, {id: 9, name: "ABCD", age: 40}, {id: 10, name: "DABC", age: 31}, {id: 11, name: "Noor", age: 30}, {id: 12, name: "ABCD", age: 40}];
+ $scope.tableParams = new NgTableParams({count: 5, sorting: {id: 'asc'} //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}
+ }, { counts:[5, 10, 20, 50], dataset: $scope.provinceData});
+
+ $scope.$watch('checkboxes.checked', function(value) {
+ angular.forEach($scope.provinceData, function(item) {
+ if (angular.isDefined(item.id)) {
+ $scope.checkboxes.items[item.id] = value;
+ }
+ });
+ });
+
+ var modelBtn_data = {"title":"Close me", "clickAction":"closeModal()"};
+ var modelBtn_html = Mustache.to_html(def_button_tpl, modelBtn_data);
+ $('#myModal #footerBtns').append($compile(modelBtn_html)($scope));
+ }
+
+ $scope.closeModal = function() {
+ console.log("Closing Modal...");
+ $('#myModal').modal('hide');
+ }
+
+
+ $scope.checkAll = function() {
+ console.log("Checked ..");
+ angular.forEach($scope.provinceData, function(data) {
+ //data.select = $scope.selectAll;
+ $scope.checkboxes.items[user.id]
+ });
+ };
+
+ $scope.showAddModal = function() {
+ console.log("Showing Modal to Add data");
+ $scope.province = {};
+ $("#myModal").modal();
+ }
+ $scope.saveData = function(id) {
+ if(id) {
+ //edit data
+ console.log("Editing data.." + JSON.stringify($scope.province));
+ DataService.editProvinceData($scope.province)
+ .then(function (data) {
+ $scope.message = "Success :-)";
+ $state.reload();
+ //$state.go($state.current.name, {}, {reload: true})
+ },
+ function (reason) {
+ //$log.info(reason);
+ $scope.message = reason.status + " " + reason.statusText;
+ });
+ }
+ else {
+ console.log("Adding data.." + JSON.stringify($scope.province));
+ DataService.addProvinceData($scope.province)
+ .then(function (data) {
+ $scope.message = "Success :-)";
+ $state.reload();
+ //$state.go($state.current.name, {}, {reload: true})
+ },
+ function (reason) {
+ //$log.info(reason);
+ $scope.message = reason.status + " " + reason.statusText;
+ });
+ }
+ $('#myModal').modal('hide');
+ }
+
+ $scope.deleteData = function() {
+ var deleteArr = [];
+ //$log.info($scope.checkboxes);
+ angular.forEach($scope.checkboxes.items, function(value , key) {
+ //$log.info(data);
+ if(value) {
+ deleteArr.push(key);
+ }
+ });
+
+ console.log("To be deleted : "+deleteArr);
+ //$log.info(deleteArr);
+ DataService.deleteProvinceData(deleteArr)
+ .then(function(data){
+ $scope.message = "Successfully deleted :-)";
+ $state.reload();
+ },
+ function(reason){
+ //$log.info(reason);
+ $scope.message = reason.status + " " + reason.statusText;
+ });
+ }
+
+ $scope.deleteIndividualData = function(id) {
+ var deleteArr = [];
+ //$log.info($scope.checkboxes);
+ deleteArr.push(id);
+
+ console.log("To be deleted : "+deleteArr);
+ //$log.info(deleteArr);
+ DataService.deleteProvinceData(deleteArr)
+ .then(function(data){
+ $scope.message = "Successfully deleted :-)";
+ $state.reload();
+ },
+ function(reason){
+ //$log.info(reason);
+ $scope.message = reason.status + " " + reason.statusText;
+ });
+ }
+
+ $scope.editData = function(id) {
+ console.log("To be edited : " + id);
+ var dataFound = false;
+ angular.forEach($scope.provinceData, function(data) {
+ if(!dataFound) {
+ if (data.id == id) {
+ console.log("Found : " + data.id);
+ $scope.province = data;
+ /*$scope.province.province_name = data.province_name;
+ $scope.province.ip = data.ip;
+ $scope.province.port = data.port;*/
+
+ $("#myModal").modal();
+ dataFound = true;
+ }
+ }
+ });
+ }
+
+ })
+
+var modelTemplate;
+function loadTemplate() {
+ $.get('template.html', function(template) {
+ modelTemplate = template;
+ });
+}
+
+function callThis() {
+ alert("Going Great!");
+}
+
+function searchTable() {
+ var filter, table, tr, td;
+ filter = $("#myInput").val().toUpperCase();
+ table = $("#myTable_search");
+ tr = $("#myTable_search tr");
+
+ // Loop through all table rows, and hide those who don't match the search query
+ for (var i = 0; i < tr.length; i++) {
+ td = tr[i].getElementsByTagName("td")[0];
+ if (td) {
+ if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
+ tr[i].style.display = "";
+ } else {
+ tr[i].style.display = "none";
+ }
+ }
+ }
+}
+
+function linkClicked(state) {
+ console.log("State to : " + state);
+} \ No newline at end of file