From b54df0ddd0c6a0372327c5aa3668e5a6458fcd64 Mon Sep 17 00:00:00 2001 From: st782s Date: Thu, 4 May 2017 07:48:42 -0400 Subject: [PORTAL-7] Rebase This rebasing includes common libraries and common overlays projects abstraction of components Change-Id: I9a24a338665c7cd058978e8636bc412d9e2fdce8 Signed-off-by: st782s --- .../add-catalog-dialogs/new-catalog.modal.less | 125 +++++++ .../client/app/views/catalog/catalog.controller.js | 238 ++++++++++++ .../client/app/views/catalog/catalog.less | 413 +++++++++++++++++++++ .../client/app/views/catalog/catalog.tpl.html | 90 +++++ .../catalog/catalogconfirmation.controller.js | 62 ++++ .../app/views/catalog/information-box.tpl.html | 42 +++ 6 files changed, 970 insertions(+) create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/add-catalog-dialogs/new-catalog.modal.less create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/catalog.controller.js create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/catalog.less create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/catalog.tpl.html create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/catalogconfirmation.controller.js create mode 100644 ecomp-portal-FE-common/client/app/views/catalog/information-box.tpl.html (limited to 'ecomp-portal-FE-common/client/app/views/catalog') diff --git a/ecomp-portal-FE-common/client/app/views/catalog/add-catalog-dialogs/new-catalog.modal.less b/ecomp-portal-FE-common/client/app/views/catalog/add-catalog-dialogs/new-catalog.modal.less new file mode 100644 index 00000000..b98289e7 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/add-catalog-dialogs/new-catalog.modal.less @@ -0,0 +1,125 @@ +.new-catalog-modal { + height: 430px; + + .user-catalog-roles{ + .title{ + //.n18r; + .dGray18r; //AT&T Dark Gray + border-bottom: @portalDBlue 3px solid; + } + + input:not([type="button"]) { + height: 13px; +} + .display-userApp-Catalog-Roles + { + padding-left: 16px; + padding-top: 10px; + font-family: Omnes-ECOMP-W02,Arial; + font-size: 18px; + color: #5a5a5a; + } + + #pending-checkbox{ + font-family: Omnes-ECOMP-W02,Arial; + font-size: 15px; + color: #5a5a5a; + } + .app-catalog-roles-list{ + height: 286px; + + + .app-catalog-item{ + border: 1px solid @portalLGray; + border-radius: 2px; + background-color: @funcBkgGray; + + padding: 10px; + margin-top: 8px; + //margin-right: 6px; + //margin-left: 6px; + + .app-catalog-item-left{ + padding-top: 0; + line-height: 30px; + height: 30px; + vertical-align: middle; + display:inline-block; + width: 45%; + border-radius: 2px; + border: 1px solid @portalLGray; + margin-right: 10px; + padding-left: 4px; + background: @portalWhite; + white-space: nowrap; + + } + .app-catalog-item-right{ + display:inline-block; + width: 45%; + border-radius: 2px; + border: 1px solid @portalLGray; + background: @portalWhite; + vertical-align: middle; + } + + .app-catalog-item-right-error{ + .portalRed; + padding: 7px 7px 7px 7px; + display:inline-block; + width: 45%; + border-radius: 2px; + border: 1px solid @portalLGray; + background: @portalWhite; + vertical-align: middle; + } + + .app-catalog-item-right-contacting{ + .portalGreen; + padding: 7px 7px 7px 7px; + display:inline-block; + width: 45%; + border-radius: 2px; + border: 1px solid @portalLGray; + background: @portalWhite; + vertical-align: middle; + } + + .app-select-left{ + width: 45%; + margin-right: 10px; + vertical-align: middle; + + + .select-field{ + padding-top: 0; + line-height: 30px; + height: 30px; + vertical-align: middle; + border-radius: 2px; + border: 1px solid @portalLGray; + margin-right: 10px; + padding-left: 4px; + background: @portalWhite; + display:inline-block; + } + } + + + .app-item-delete{ + .ico_trash_default; + display: inline-block; + vertical-align: 2px; + cursor: pointer; + position: relative; + top: 6px; + color: transparent; + margin-left: 8px; + + } + + } + } + + } +} diff --git a/ecomp-portal-FE-common/client/app/views/catalog/catalog.controller.js b/ecomp-portal-FE-common/client/app/views/catalog/catalog.controller.js new file mode 100644 index 00000000..ad34b08d --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/catalog.controller.js @@ -0,0 +1,238 @@ +/*- + * ================================================================================ + * ECOMP Portal + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property + * ================================================================================ + * 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. + * ================================================================================ + */ +'use strict'; + +function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError('Cannot call a class as a function'); + } +} + +(function() { + var HTTP_PROTOCOL_RGX = /https?:\/\//; + + var CatalogCtrl = function CatalogCtrl(conf, catalogService, confirmBoxService, ExternalRequestAccessService, + $log, $window, userProfileService, applicationsService, $scope, $state, + $timeout, $interval, $modal, ngDialog) { + + this.conf = conf; + var _this = this; + _classCallCheck(this, CatalogCtrl); + + // activate spinner + this.isLoading = true; + $scope.getAppCatalogIsDone = false; + $scope.radioValue = 'All'; + $scope.$watch('radioValue', function(newValue, oldValue) { + var appCatalog = $scope.appCatalog; + $scope.appCatalog = []; + $scope.appCatalog = appCatalog; + + + }); + + this.catalogService = catalogService; + this.userProfileService = userProfileService; + this.applicationsService = applicationsService; + var resultAccessValue = null; + $scope.demoNum = 1; + $scope.appRoles = []; + + let init = () => { + getExternalAccess(); + }; + + var getExternalAccess = () => { + ExternalRequestAccessService.getExternalRequestAccessServiceInfo().then( + function(property) { + resultAccessValue = property.accessValue; + // $log.info(res); + }).catch(err => { + $log.error('CatalogCtrl: failed getExternalRequestAccessServiceInfo: ' + JSON.stringify(err)); + }); + }; + + + + $scope.applyPresentationDetailsToAppsCatalog = function(res, value) { + + _this.apps = res; + var rowNo = 0; + + // defend against error string result - + // a huge list that should never happen. + var maxItems = 333; + if (_this.apps.length < maxItems) + maxItems = _this.apps.length; + for (var i = 0; i < maxItems; i++) { + let imgLnk = ''; + if (_this.apps[i].imageUrl) + imgLnk = conf.api.appThumbnail.replace(':appId', _this.apps[i].id); + //$log.debug('CatalogCtlr::applyPresn: imgLink = ' + imgLnk); + $scope.appCatalog[i] = { + sizeX : 2, + sizeY : 2, + id : _this.apps[i].id, + headerText : _this.apps[i].name, + imageLink : imgLnk, + restricted : _this.apps[i].restricted, + select : _this.apps[i].select, + access : _this.apps[i].access, + pending: _this.apps[i].pending, + mlproperty: value + }; + } + //$log.debug('CatalogCtrl: getAppCatalog count : ' + // + $scope.appCatalog.length); + _this.isLoading = false; + $scope.getAppCatalogIsDone = true; + } + + let getAppsCatalog = () => { + catalogService.getAppCatalog() + .then(appsList => { + $scope.applyPresentationDetailsToAppsCatalog(appsList); + }).catch(err => { + confirmBoxService.showInformation('There was a problem retrieving the Applications. ' + + 'Please try again later. Error Status: '+ err.status).then(isConfirmed => {}); + $log.error('CatalogCtrl:openAddRoleModal: Error: ', err); + }); + }; + + this.openAddRoleModal = (item) => { + let data = null; + + if((!item.restricted) && (item.mlproperty)){ + data = { + dialogState: 2, + selectedUser:{ + attuid: $scope.attuid, + firstName: $scope.firstName, + lastName: $scope.lastName, + headerText: item.headerText, + item: item + + } + } + ngDialog.open({ + templateUrl: 'app/views/catalog/add-catalog-dialogs/new-catalog.modal.html', + controller: 'NewCatalogModalCtrl', + controllerAs: 'userInfo', + data: data + }).closePromise.then(needUpdate => { + if(needUpdate.value === true){ + getAppsCatalog(); + } + + }); + } + }; + + // Run this function when user clicks on checkbox. + this.storeSelection = function(item) { + // $log.debug('CatalogCtrl:storeSelection: item.id is ' + item.id + ', select is ' + item.select); + var pendingFlag = false; + + if(item.access) + pendingFlag = false; + else + pendingFlag = item.pending; + + var appData = { + appId : item.id, + select : item.select, + pending : pendingFlag // TODO + }; + + catalogService.updateManualAppSort(appData).then( + function(result) { + // $log.debug('CatalogCtrl:storeSelection result is ', result); + })['catch'](function(err) { + $log.error('CatalogCtrl:storeSelection: exception: ', err); + }); + catalogService.updateAppCatalog(appData).then( + function(result) { + // $log.debug('CatalogCtrl:storeSelection result is ', result); + })['catch'](function(err) { + $log.error('CatalogCtrl:storeSelection: exception: ', err); + }); + }; + + userProfileService + .getUserProfile() + .then( + function(profile) { + $scope.attuid = profile.orgUserId; + $scope.firstName = profile.firstName; + $scope.lastName = profile.lastName; + $scope.appCatalog = []; + + catalogService.getAppCatalog().then( + function(res) { + $scope.applyPresentationDetailsToAppsCatalog(res, resultAccessValue); + })['catch'](function(err) { + $log.error('CatalogCtrl: failed getAppCatalog: ', JSON.stringify(err)); + _this.isLoading = false; + $scope.getAppCatalogIsDone = true; + }); + }); + + // applicationsService.getUserApps() + + + this.gridsterOpts = { + columns : 12, + colWidth : 95, + rowHeight : 95, + margins : [ 20, 20 ], + outerMargin : true, + pushing : true, + floating : true, + swapping : true, + }; + + if (getParameterByName('noUserError') != null) { + if (getParameterByName('noUserError') == "Show") { + $("#errorInfo").show(); + } + + } + + init(); + }; + + CatalogCtrl.$inject = [ 'conf', 'catalogService', 'confirmBoxService', 'ExternalRequestAccessService', '$log', + '$window', 'userProfileService', 'applicationsService', '$scope', + '$state', '$timeout', '$interval', '$modal', 'ngDialog' ]; + angular.module('ecompApp').controller('CatalogCtrl', CatalogCtrl); +})(); + +function getParameterByName(name, url) { + if (!url) + url = window.location.href; + name = name.replace(/[\[\]]/g, "\\$&"); + var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), results = regex + .exec(url); + if (!results) + return ''; + if (!results[2]) + return ''; + return results[2].replace(/\+/g, " "); +} diff --git a/ecomp-portal-FE-common/client/app/views/catalog/catalog.less b/ecomp-portal-FE-common/client/app/views/catalog/catalog.less new file mode 100644 index 00000000..dc5e4671 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/catalog.less @@ -0,0 +1,413 @@ +.w-ecomp-app-catalog { + .bg_portalWhite;//white for 1702 + position: @page-main-position; + top: @page-main-top; + left: @page-main-left; + right: @page-main-right; + bottom: @page-main-bottom; + padding-top: @padding-top; + overflow-y: @page-main-overflow-y; + padding-left: @padding-left-side; + input:not([type="button"]) { + height: 13px; +} + + .gridster-item-container .gridster-item-body { + overflow-y:auto; + overflow-x:hidden; + } + + .appCatalogue-boarder{ + background-color: #eee; + border: 1px dashed white; + overflow-y: auto; + overflow-x: hidden; + } + + .app-catalog-container { + .content_justify; + position: relative; + padding: 0 0 32px 0; + width: 100%; + + .app-catalog-title { + //.a24r; + margin: auto; + // margin-left: 230px; + .content_justify; + } + + .app-catalog-list { + min-height: 70vh; + //display: flex; + justify-content: center; + flex-flow: row wrap; + width: @table-width; + //margin-left: 230px; + margin-bottom: 63px; + margin:auto; + .app-gridster-header { + background-color: @u; + font-size:12px; + overflow:hidden + } + + .app-gridster-footer { + background-color: @u; + } + + } + } +} + +@keyframes fadein { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +.slide.ng-hide-add, +.slide.ng-hide-remove, +.slide.ng-enter, +.slide.ng-leave { + transition: all 0.5s ease; +} +.slide.ng-hide, +.slide.ng-enter { + transform: translate(-100%, 0); +} +.slide.ng-enter-active { + transform: translate(0, 0); +} +.slide.ng-leave { + transform: translate(0, 0); +} +.slide.ng-leave-active { + transform: translate(+100%, 0); +} +.appCatalogue-boarder{ + // border: 2px solid #ccc!important; + // border-radius: 16px!important; + height: 800px; + overflow: auto; +} +.app-visibility.false { + opacity: 0.5; +} + +.dock ul{ +display: inline-block; + +width: auto; +margin: 0px; +padding: 0px; +list-style: none; + +} +.dock ul li { +width: auto; +height: auto; +display: inline-block; +bottom: 0; +vertical-align: bottom; +margin-top: -43px; +} +.dock ul li a { +display: block; +height: 150px; +width: 150px; +position: relative; +-webkit-transition-property: width, height,margin-top; +-webkit-transition-duration: 0.5s; +-o-transition-property: width, height,margin-top; +-o-transition-duration: 0.5s; +-moz-transition-property: width, height,margin-top; +-moz-transition-duration: 0.5s; +} +.dock ul li a:hover { +width: 200px; +height: 200px; +margin-top: -50px; +} +.dock ul li a img { +width: 100%; +position: absolute; +bottom: 0; +left: 0; +border: none; +padding: 0px 0px 0px 30px; +} +.dock_left{ +width: 31px; +-webkit-transform: rotate(33deg); +-moz-transform: rotate(33deg); +-o-transform: rotate(33deg); +position: relative; +background: #EEE; +overflow: hidden; +float: left; +height: 100px; +z-index: 2; +margin: -18px; +} +.dock_right{ +width: 36px; +-webkit-transform: rotate(-33deg); +-moz-transform: rotate(-33deg); +-o-transform: rotate(-33deg); +position: relative; +background: #EEE; +overflow: hidden; +float: left; +height: 100px; +z-index: 2; +margin: -18px; +} + + + + +/*Time for the CSS*/ +* {margin: 0; padding: 0;} +body {background: #ccc;} + +.caption { + background: rgba(0, 0, 0, 0.5); + position: absolute; + bottom: 0; + width: 640px +} + +.caption a { + display: block; + color: #fff; + text-decoration: none; + font: normal 16px 'Lato', Helvetica, Arial, sans-serif; + -webkit-font-smoothing: antialiased; + padding: 15px; +} + + +/*widgets*/ +.singleBtnBorder { + border-radius: 6px 6px 6px 6px; +} + +.icon-anchor { + color: #888; +} + +.widgetHeaderBtn:hover, .widgetHeaderBtn:focus { + background: rgba(0, 0, 0, 0); + color: #3a7999; + box-shadow: inset 0 0 0 2px #3a7999; +} + +.box-one { + -webkit-transition:all linear 0.4s; + transition:all linear 0.4s; + height:100px; width:200px; background:white; border: 2px solid #ccc!important; + border-radius: 16px!important; +} +.box-one.ng-hide { +display: block!important; + opacity:0; +} + +.gridsterContent{ + height:120px; +} +.gridsterAppContent{ + height:120px; +} + .gridsterImage{ + height:84px; + width:168px; + } + +/*application empty div*/ +.app-error-block { + padding-top: 10px; +} + +.text-center { text-align: center; } + +.text-right { text-align: right; } + +.text-justify { text-align: justify; } + +/*widget header*/ +.optionsMenu{ + position: absolute; + list-style: none; + top: 25px; + right: 10px; + border: 1px solid #067ab4; + display: none; + z-index: 2; + border-radius: 6px 0px 6px 6px; + background: #fff; + width: 130px; +} + +.optionsMenuLink { + position: relative; + padding-left: 8px; + padding-right: 2px; + font-size: 12px; + line-height: 30px; + color: #444444; +} +.optionsMenu > li:hover a { + color: #ffffff !important; +} +.optionsMenu > li { + width: 100%; + text-align: left; +} +.optionsMenu > li:hover { + background-color: #0faaf7; + border-color: none !important; + cursor: pointer; +} + +.simulateCatGridHeader{ + position: relative; + height: 70px !important; + border: 1px solid #d3d3d3; + border-bottom: 0; + background-color: #E5E5E5; + white-space: nowrap; + text-overflow: ellipsis; + z-index: 1; +} + +.simulateCatGridHeaderTitle{ + line-height: 20px; + margin-top: 10px; + margin-left: 26px; + font-family: "Omnes-ECOMP-W02", Arial; + font-size: 18px; + color: #444444; + float: left; +} + +.simulateCatGridHeaderRadio{ + line-height: 20px; + margin-top: 10px; + margin-left: 10px; + font-family: "Omnes-ECOMP-W02", Arial; + font-size: 12px; + color: #444444; + float: left; +} + +.simulateCatGridHeaderDetails{ + line-height: 20px; + margin-left: 10px; + font-family: "Omnes-ECOMP-W02", Arial; + font-size: 12px; + color: #444444; + float: left; +} + +.simulateGridHeaderHandle{ + cursor: move; + margin: 12px; + position: absolute; + top: 0; + left: 0; + border: 0; + vertical-align: middle; + -ms-interpolation-mode: bicubic; + display: block; +} + +.portal-checkbox--on .portal-checkbox__indicator, .portal-radio--on .portal-radio__indicator { + opacity: 1; +} + +.animate-enter, +.animate-leave +{ + -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + position: relative; + display: block; +} + +.animate-enter.animate-enter-active, +.animate-leave { + opacity: 1; + top: 0; + height: 30px; +} + +.animate-leave.animate-leave-active, +.animate-enter { + opacity: 0; + top: -50px; + height: 0px; +} + +/** gridster style**/ +ul { + list-style: none; +} +.gridster-box { + height: 100%; + border: 1px solid #ccc; + background-color: #fff; + transition: transform 0.5s ease-out; +} +.gridster-box-header { + background-color: #fff; + padding: 0 0px 0 10px; + border-bottom: 1px solid #ccc; + position: relative; + height: 50px !important; +} +.gridster-box-header h3 { + margin-top: 15px; + display: inline-block; + font-family: "Omnes-ECOMP-W02", Arial; +} +.gridster-box-content { + padding: 59px; +} +.gridster-box:hover{ + transform: scale(1.1); +} +.gridster-box-header-btns { + top: 15px; + right: 10px; + position: absolute; +} +.checkbox .skin { + left: 125px; + top: -24px; +} +.form-row { + margin-top: -14px; +} + +.icon-content-gridguide{ +cursor:move; +font-size: 22px; +} +.icon-tickets-contested{ +font-size: 20px; +margin-left: 126px; +} + +.checkbox, .radio { + min-height: 0px; + padding-left: 0px; + +} \ No newline at end of file diff --git a/ecomp-portal-FE-common/client/app/views/catalog/catalog.tpl.html b/ecomp-portal-FE-common/client/app/views/catalog/catalog.tpl.html new file mode 100644 index 00000000..68bf9ef2 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/catalog.tpl.html @@ -0,0 +1,90 @@ + +
+
+
+

Application Catalog

+
+
+
+ Click the check + boxes below to choose which applications are shown on the home page. +

+ +
+
+
+
    +
  • +
    +
    + +

    {{item.headerText | + elipsis: 13}}

    +
    + + +
    +
    +
    +
    +
    +
    • +
+
+
+ +
+ +
+ To request access to an application, please visit the Get Access page. +
+ +
+
+ +
+
diff --git a/ecomp-portal-FE-common/client/app/views/catalog/catalogconfirmation.controller.js b/ecomp-portal-FE-common/client/app/views/catalog/catalogconfirmation.controller.js new file mode 100644 index 00000000..83438e9c --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/catalogconfirmation.controller.js @@ -0,0 +1,62 @@ +/*- + * ================================================================================ + * eCOMP Portal + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property + * ================================================================================ + * 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. + * ================================================================================ + */ + +'use strict'; +(function () { + class CatalogConfirmationBoxCtrl { + constructor($scope,$state,catalogService) { + + let init = () => { + let item = ($scope.ngDialogData && $scope.ngDialogData.item) || 'this'; + this.message = $scope.ngDialogData.message ? $scope.ngDialogData.message : `Are you sure you want to delete "${item}"?`; + this.title = $scope.ngDialogData.title ? $scope.ngDialogData.title : ''; + }; + + this.closeBox = isConfirmed => { + $scope.closeThisDialog(isConfirmed); + }; + + this.goTo = (state, params) => { + $scope.closeThisDialog(false); + $state.go(state,params); + + }; + + this.storeSelection = function(item) { + // $log.debug('CatalogCtrl:storeSelection: item.id is ' + item.id + ', select is ' + item.select); + var appData = { + appId : item.id, + select : item.select, + pending : item.pending + }; + catalogService.updateAppCatalog(appData).then( + function(result) { + // $log.debug('CatalogCtrl:storeSelection result is ', result); + })['catch'](function(err) { + $log.error('CatalogCtrl:storeSelection: exception: ', err); + }); + }; + + init(); + } + } + CatalogConfirmationBoxCtrl.$inject = ['$scope','$state','catalogService']; + angular.module('ecompApp').controller('CatalogConfirmationBoxCtrl', CatalogConfirmationBoxCtrl); +})(); \ No newline at end of file diff --git a/ecomp-portal-FE-common/client/app/views/catalog/information-box.tpl.html b/ecomp-portal-FE-common/client/app/views/catalog/information-box.tpl.html new file mode 100644 index 00000000..a5b754f6 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/catalog/information-box.tpl.html @@ -0,0 +1,42 @@ + +
+
+
+
+ You do not have access to this application. + See the + + Get Access page and request access at MyLogins. +

+ You may check this box if access is pending: + +
+ +
+
+
+
Close
+
+
-- cgit 1.2.3-korg