From ede6c4f53d959157b5433adda0938508149086fb Mon Sep 17 00:00:00 2001 From: seshukm Date: Wed, 25 Jan 2017 17:09:32 +0530 Subject: CLIENT GUI Framework Framework files for the GUI framework. Issue-Id : CLIENT-11, CLIENT-125, CLIENT-126, CLIENT-127, CLIENT-128 Change-Id: I3fcbba6e50da220fa8191bd53e050821b812e3ae Signed-off-by: seshukm --- .../webapp/framework/browser/css/open-ostyle.css | 84 +- .../src/main/webapp/framework/browser/index.html | 24 +- .../src/main/webapp/framework/browser/js/app.js | 77 +- .../main/webapp/framework/browser/template.html | 131 +- .../framework/browser/templates/accordion.html | 6 +- .../framework/browser/templates/buttons.html | 7 +- .../framework/browser/templates/checkBoxes.html | 7 +- .../framework/browser/templates/courses.html | 1 + .../framework/browser/templates/dropdown.html | 3 +- .../framework/browser/templates/functional.html | 6 +- .../webapp/framework/browser/templates/home.html | 6 +- .../webapp/framework/browser/templates/list.html | 4 +- .../framework/browser/templates/notification.html | 6 +- .../framework/browser/templates/radioButtons.html | 7 +- .../webapp/framework/browser/templates/table.html | 26 +- .../webapp/framework/browser/templates/tabs.html | 2 +- .../framework/browser/templates/textarea.html | 44 +- .../webapp/framework/browser/templates/tree.html | 7 +- .../framework/browser/templates/verticalTab.html | 2 +- .../browser/thirdparty/angular-ui-router.min.js | 8 - .../framework/browser/thirdparty/angular.min.js | 295 -- .../bootstrap-table-filter-control.min.js | 7 - .../browser/thirdparty/bootstrap-table.min.js | 8 - .../framework/browser/thirdparty/bootstrap.min.js | 6 - .../browser/thirdparty/jquery.ztree.core-3.5.js | 70 - .../browser/thirdparty/jquery_1.12.4.min.js | 5 - .../framework/browser/thirdparty/mustache.js | 630 ---- .../framework/browser/thirdparty/tree.jquery.js | 3616 -------------------- 28 files changed, 303 insertions(+), 4792 deletions(-) delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/angular-ui-router.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/angular.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/bootstrap-table-filter-control.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/bootstrap-table.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/bootstrap.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/jquery.ztree.core-3.5.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/jquery_1.12.4.min.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/mustache.js delete mode 100644 portal-common/src/main/webapp/framework/browser/thirdparty/tree.jquery.js (limited to 'portal-common/src/main/webapp') 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 index 789dbd1c..d17d0c22 100644 --- a/portal-common/src/main/webapp/framework/browser/css/open-ostyle.css +++ b/portal-common/src/main/webapp/framework/browser/css/open-ostyle.css @@ -22,6 +22,7 @@ body { width: 100%; height: 100%; font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun; + font-size: 12px; } .container{ @@ -74,12 +75,12 @@ body { } .openo_accordion_ui-icon-expand { - background: url(/images/collapse_arrow.png) right 20px no-repeat; + background: url(../thirdparty/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; + background: url(../thirdparty/images/expand_arrow.png) right 20px no-repeat; } .openoAccordian_showHideArrow_hide, .openoAccordian_showHideArrow_show { @@ -232,7 +233,7 @@ a:hover { text-transform: capitalize; border-top: 2px solid #f1f1f1; border-bottom: 2px solid #f1f1f1; - padding: 15px 5px; + padding: 13px 5px; display: inline-block; letter-spacing: 5px; -webkit-animation: textScroll 500ms linear; @@ -257,10 +258,10 @@ a:hover { to {opacity: 1;} } -.modal-body span { +/*.modal-body span { font-size: 18px; color: #00f; -} +}*/ #msgModal .modal-body .container { width: 100%; @@ -382,7 +383,7 @@ a:hover { #dropdown .dropup .dropdown-menu { top: auto; - bottom: 45% !important; + bottom: 34% !important; margin-bottom: 1px; } #dropdown .dropdown-menu { @@ -666,7 +667,7 @@ a:hover { /* Functional & Notification*/ -#msgModal .modal-header, #funModal .modal-header { +#myModal .modal-header, #msgModal .modal-header, #funModal .modal-header { padding: 9px 15px; border-radius: 5px 5px 0 0; color: #666; @@ -688,7 +689,7 @@ a:hover { #myInput { - background-image: url('../images/searchicon.png'); /* Add a search icon to input */ + background-image: url('../thirdparty/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 */ @@ -774,6 +775,9 @@ a:hover { text-align:center; } +#provinceAction { + text-align: left; +} #provinceTable th { background-color: #e3e3e3; } @@ -797,10 +801,14 @@ a:hover { margin-top:50px; text-align:left; font-weight: bold; + font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun; } .shortnoteText{ margin-top:20px; text-align:left; + font-size:10px; + font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun; + } .ztree *{ @@ -820,7 +828,7 @@ a:hover { } #menu_accordion .collapsed span { - background: url(../images/expand_arrow.png) 1px 3px no-repeat; + background: url(../thirdparty/images/expand_arrow.png) 1px 3px no-repeat; display: block; float: left; margin-bottom: -1px; @@ -829,7 +837,7 @@ a:hover { padding-left: 20px; } #menu_accordion span { - background: url(../images/collapse_arrow.png) 1px 3px no-repeat; + background: url(../thirdparty/images/collapse_arrow.png) 1px 3px no-repeat; display: block; float: left; margin-bottom: -1px; @@ -870,4 +878,60 @@ a:hover { .errMsg{ color:red; + float: left; +} + +.customtable thead{ + background: #ECECEC; +} + +.customtable th,.table td{ + /* padding-top: 3px!important; */ + padding-bottom: 3px!important; +} + +.customtable tr,.customtable td, .customtable th{ + text-align:left; + +} + +.ng-table th.sortable .sort-indicator { + width:100%; + float:right; +} + +.btn-group>.btn.active{ + z-index: 2; + color: #fff; + background-color: #428bca; + border-color: #428bca; + cursor: default; +} + +.customtable tbody tr:hover td{ + background-color: #e6fbe0 !important; } + +.shortnote{ + width:100%; + float:left; +} + +.pagination{ + float:left; +} + +.btnmrg{ + margin:0 5px 0 5px; +} + +.labelstyle{ + text-align:left; + font-size:12px; + font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun; +} + +.titlestyle{ + font-size:14px !important; + font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun; +} \ No newline at end of file diff --git a/portal-common/src/main/webapp/framework/browser/index.html b/portal-common/src/main/webapp/framework/browser/index.html index 889232ae..c74b4b60 100644 --- a/portal-common/src/main/webapp/framework/browser/index.html +++ b/portal-common/src/main/webapp/framework/browser/index.html @@ -23,25 +23,25 @@ POC - + - - - - + + + + - - + + - - + + - - - + + + diff --git a/portal-common/src/main/webapp/framework/browser/js/app.js b/portal-common/src/main/webapp/framework/browser/js/app.js index 4ffe2c87..d9f26669 100644 --- a/portal-common/src/main/webapp/framework/browser/js/app.js +++ b/portal-common/src/main/webapp/framework/browser/js/app.js @@ -16,6 +16,7 @@ */ + var app = angular.module("POCApp", ["ui.router", "ngTable"]) /*.run(function($rootScope, $location, $state, LoginService) { @@ -116,13 +117,13 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) }) .state("home.provinceMgmt", { - url: "/provinceMgmt", - templateUrl : "templates/provinceMgmt.html", - controller : "provinceMgmtCtrl", + url: "/management", + templateUrl : "templates/management.html", + controller : "managementCtrl", authenticate: true }) .state("home.tooltip", { - url: "/tooltip", + url: "/textarea", templateUrl : "templates/textarea.html", controller : "toolCtrl", authenticate: true @@ -781,7 +782,7 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) function loadTextArea() { - var text = $(modelTemplate).filter('#fname').html(); + var text = $(modelTemplate).filter('#textfield').html(); var email = $(modelTemplate).filter('#email').html(); var url = $(modelTemplate).filter('#url').html(); var password = $(modelTemplate).filter('#password').html(); @@ -797,7 +798,8 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) var note = $(modelTemplate).filter('#note').html(); - var html = Mustache.to_html(text, $scope.errMsg); + var dataText = {"errMsg" : {"textboxErr" : "The name is required.", "modalVar":"province.province_name", "placeholder":""}}; + var html = Mustache.to_html(text, dataText.errMsg); $('#fname').html($compile(html)($scope)); var html = Mustache.to_html(email, $scope.errMsg); @@ -809,7 +811,8 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) var html = Mustache.to_html(password, $scope.errMsg); $('#password').html($compile(html)($scope)); - var html = Mustache.to_html(numeric, $scope.errMsg); + var dataNum = {"errMsg" : {"numericErr" : "The number is required.", "modalVar":"province.port", "placeholder":""}}; + var html = Mustache.to_html(numeric, dataNum.errMsg); $('#numeric').html($compile(html)($scope)); @@ -828,7 +831,8 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) var html = Mustache.to_html(timeinput, $scope.errMsg); $('#timeinput').html($compile(html)($scope)); - var html = Mustache.to_html(ipv4, $scope.errMsg); + var dataIP = {"errMsg" : {"ipv4Err" : "The ipv4 is required.", "modalVar":"province.ip", "placeholder":""}}; + var html = Mustache.to_html(ipv4, dataIP.errMsg); $('#ipv4').html($compile(html)($scope)); var html = Mustache.to_html(ipv6, $scope.errMsg); @@ -1095,8 +1099,8 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) } }) - .controller("provinceMgmtCtrl", function($scope, $log, DataService, $state, $compile, NgTableParams){ - $scope.message = "Province Management"; + .controller("managementCtrl", function($scope, $log, DataService, $state, $compile, NgTableParams){ + $scope.message = "Management"; $scope.provinceTip = "shortNote"; /*$scope.provinceData = [ {id:1, province_name:'First', ip:'192.168.1.45', port:'8080'}, @@ -1149,7 +1153,7 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) $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'} + $scope.tableParams = new NgTableParams({count: 5, sorting: {province_name: '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) { @@ -1160,9 +1164,48 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) }); }); - 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)); + var text = $(modelTemplate).filter('#textfield').html(); + var ipv4 = $(modelTemplate).filter('#ipv4').html(); + var number = $(modelTemplate).filter('#numeric').html(); + + var dataText = {"ErrMsg" : {"textboxErr" : "The name is required.", "modalVar":"province.province_name", "placeholder":"Name"}}; + $('#myModal .provinceName').html($compile(Mustache.to_html(text, dataText.ErrMsg))($scope)); + + var dataIP = {"ErrMsg" : {"ipv4Err" : "The ipv4 is required.", "modalVar":"province.ip", "placeholder":"IP Address"}}; + $('#myModal .ipAddress').html($compile(Mustache.to_html(ipv4, dataIP.ErrMsg))($scope)); + + var dataNum = {"ErrMsg" : {"numericErr" : "The number is required.", "modalVar":"province.port", "placeholder":"Port"}}; + $('#myModal .port').html($compile(Mustache.to_html(number, dataNum.ErrMsg))($scope)); + + var modelSubmit_data = {"title":"Submit", "clickAction":"saveData(province.id)"}; + var modelSubmit_html = Mustache.to_html(def_button_tpl, modelSubmit_data); + $('#myModal #footerBtns').html($compile(modelSubmit_html)($scope)); + + var modelDelete_data = {"title":"Close", "clickAction":"closeModal()"}; + var modelDelete_html = Mustache.to_html(def_button_tpl, modelDelete_data); + $('#myModal #footerBtns').append($compile(modelDelete_html)($scope)); + } + + $scope.validatetextbox = function (value){ + if($scope.province.province_name) { + $scope.textboxErr = false; + } + else + $scope.textboxErr = true; + } + $scope.validateipv4 = function (value){ + if($scope.province.ip) { + $scope.ipv4Err = false; + } + else + $scope.ipv4Err = true; + } + $scope.validatenumeric = function (value){ + if($scope.province.port) { + $scope.numericErr = false; + } + else + $scope.numericErr = true; } $scope.closeModal = function() { @@ -1182,6 +1225,9 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) $scope.showAddModal = function() { console.log("Showing Modal to Add data"); $scope.province = {}; + $scope.textboxErr = false; + $scope.ipv4Err = false; + $scope.numericErr = false; $("#myModal").modal(); } $scope.saveData = function(id) { @@ -1257,6 +1303,9 @@ var app = angular.module("POCApp", ["ui.router", "ngTable"]) } $scope.editData = function(id) { + $scope.textboxErr = false; + $scope.ipv4Err = false; + $scope.numericErr = false; console.log("To be edited : " + id); var dataFound = false; angular.forEach($scope.provinceData, function(data) { diff --git a/portal-common/src/main/webapp/framework/browser/template.html b/portal-common/src/main/webapp/framework/browser/template.html index d54f2010..974c9e2c 100644 --- a/portal-common/src/main/webapp/framework/browser/template.html +++ b/portal-common/src/main/webapp/framework/browser/template.html @@ -37,7 +37,7 @@