[PORTAL-7] Rebase

This rebasing includes common libraries and common overlays projects
abstraction of components

Change-Id: I9a24a338665c7cd058978e8636bc412d9e2fdce8
Signed-off-by: st782s <statta@research.att.com>

8 files changed, 1291 insertions, 0 deletions

diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/error.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/error.jsp
new file mode 100644
index 00000000..c79aa89a
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/error.jsp
@@ -0,0 +1,20 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+${errMsg}
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/index.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/index.jsp
new file mode 100644
index 00000000..4726ce19
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/index.jsp
@@ -0,0 +1,21 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ taglib prefix="c"      uri="http://java.sun.com/jsp/jstl/core" %>
+<c:redirect url="/index.html"/>
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/login.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/login.jsp
new file mode 100644
index 00000000..7ca8531c
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/login.jsp
@@ -0,0 +1,166 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
+<%@ taglib prefix="c"      uri="http://java.sun.com/jsp/jstl/core" %>
+<%@ taglib prefix="fmt"    uri="http://java.sun.com/jsp/jstl/fmt" %>
+<%@ page import="org.openecomp.portalsdk.core.util.SystemProperties" %>
+<%@ page import="org.openecomp.portalapp.portal.utils.EPSystemProperties" %>
+<c:set var="title" value="Login" />
+<c:set var="isMobileEnabled"
+	value="<%=(SystemProperties.getProperty(SystemProperties.MOBILE_ENABLE)!= null && SystemProperties.getProperty(SystemProperties.MOBILE_ENABLE).trim().equals(\"true\"))%>" />
+
+<!DOCTYPE html>
+<html ng-app="abs">
+	<head>
+		<link rel="shortcut icon" href="assets/images/1cc621d2.ecomp_logo.png">
+	    <title>
+	      Login
+        </title>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta name="viewport" content="width=device-width, initial-scale=1"> 
+	<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+        <link rel="stylesheet" type="text/css" href="static/fusion/css/jquery-ui.css">
+		<script src="static/js/jquery-1.10.2.js" type="text/javascript"></script>
+		<script src= "static/ebz/angular_js/angular.js"></script> 
+		<script src= "static/ebz/angular_js/angular-sanitize.js"></script>
+		<script src= "static/ebz/angular_js/app.js"></script>
+		<script src= "static/ebz/angular_js/gestures.js"></script>
+		<style>
+			.terms {
+				font-family: Verdana,Arial,Helvetica, sans-serif;
+				font-size: 9px;
+			}
+			.login-btn {
+			    cursor: pointer;
+			    background: #d97b34;
+			    background-image: -webkit-linear-gradient(top, #d97b34, #b8632b);
+			    background-image: -moz-linear-gradient(top, #d97b34, #b8632b);
+			    background-image: -ms-linear-gradient(top, #d97b34, #b8632b);
+			    background-image: -o-linear-gradient(top, #d97b34, #b8632b);
+			    background-image: linear-gradient(to bottom, #d97b34, #b8632b);
+			    -webkit-border-radius: 7;
+			    -moz-border-radius: 7;
+			    border-radius: 7px;
+			    font-family: Arial;
+			    color: #ffffff;
+			    font-size: 13px;
+			    padding: 4px 10px 4px 10px;
+			    text-decoration: none;
+			}
+		</style>
+	</head>
+	<body style="padding-top: 15px;">
+	<% 
+       String frontUrl = SystemProperties.getProperty(EPSystemProperties.FE_URL);
+    %>
+	<div ng-controller="externalLoginController">
+		<div class="centered style="-webkit-transform: translateZ(0);background:white, z-index:0;">
+			<div align="center" id="errorInfo" style="display:none;float:left;font-size:12px;margin-left:5px"><span style="color:red">Invaild username or password, Please try again</span></div>
+			<br/>
+			<div align="center" style="margin-left:auto;margin-right:auto;width:40%;padding:6px;opacity:0.7;background-color:white">
+          		<img src="static/fusion/images/ecomp-login.jpg" height="250"/>
+				<br>
+				<label>
+					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<label class="form-field__label">Login ID:</label>
+				</label>
+				<input  type="text" class="fn-ebz-text" ng-model="loginId" style="width: 140px;height:25px;border-radius:7px;font-size:18px;padding-left:5px;"
+					maxlength="30" />
+				<br/>
+				<br/>
+				<label >&nbsp;Password:</label>
+				<input type="password" class="span3" ng-model="password" style="width: 140px;height:25px;border-radius:7px;font-size:18px;padding-left:5px;"
+					maxlength="30" onkeydown="if (event.keyCode == 13) document.getElementById('loginBtn').click()"/> 
+				<br />
+				<br />
+				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+				<a class="login-btn" id="loginBtn" ng-click="loginExternal();">LOGIN</a>
+				<br>
+			</div>
+		</div>
+		<br/><br/><br/><br/><br/><br/><br/>
+    </div>
+    </body>
+<script>
+app.controller("externalLoginController", function ($scope) { 
+	// Table Data
+	
+	$scope.viewPerPage = 200;
+	$scope.currentPage = 2;
+	$scope.totalPage;
+	$scope.searchCategory = "";
+	$scope.searchString = "";
+	$scope.loginId="";
+	$scope.password="";
+	$scope.loginError=true;
+	$scope.viewPerPage = 200;
+	$scope.currentPage = 2;
+	$scope.totalPage;
+	$scope.searchCategory = "";
+	$scope.searchString = "";
+	$scope.loginId="";
+	$scope.password="";
+	$scope.loginUrl = "";
+	
+	$scope.loginExternal = function() {
+		var postData={loginId:$scope.loginId,password:$scope.password};
+		$.ajax({
+	            url: "open_source/login?",
+                type : "POST",
+		  		 dataType: 'json',
+		  		 contentType: 'application/json',
+		  		 data: JSON.stringify(postData),                
+                success:function (response){
+                  if(response.success=="success"){
+                    //window.location.href = 'applicationsHome';
+                    window.location.href= "<%=frontUrl%>"
+                  }else{
+                	$("#errorInfo span").text(response);
+                	//$("#errorInfo").text = response;
+                	$("#errorInfo").show();
+                  }
+                },
+                error:function( jqXHR, status,error ){
+                	$("#errorInfo").show();
+                }
+                
+        });
+
+    };
+	/**
+	$scope.loginExternal = function() {
+
+        
+		  var redirectUrl = "login_external/login";
+          var form = $('<form action="' + redirectUrl + '" method="post">' +
+                  '<input type="hidden" name="loginId" value='+$scope.loginId+' />' +
+                  '<input type="hidden" name="password" value='+$scope.password+' />' +
+                  '</form>');
+                  
+                  $('body').append(form);
+                  $(form).submit();
+         
+
+    };
+    */	
+});
+</script>
+	
+</html>
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-admin.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-admin.jsp
new file mode 100644
index 00000000..93fd69ce
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-admin.jsp
@@ -0,0 +1,72 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
+<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags"%>
+<o:header title="Admin"/>
+<o:topbar pageName="Admin"/>
+<div class="container-fluid main">
+	<div class="row-fluid">
+		<div class="span10 offset1">
+
+			<h1>Hello ${ userInfo.name }</h1>
+
+			<div>
+				<p>This page requires that the user be logged in with a valid account and the <code>ROLE_ADMIN</code> Spring Security authority.
+				If you are reading this page, <span class="text-success">you are currently logged in as an administrator</span>.</p>
+
+				<p>The authorization provider will assign your account a set of authorities depending on how it's configured.
+				Your current login has the following Spring Security authorities:</p>
+				
+				<ul>
+					<security:authentication property="authorities" var="authorities" />
+					<c:forEach items="${authorities}" var="auth">
+						<li><code>${ auth }</code></li>
+					</c:forEach>
+				</ul>
+				
+			</div>
+			<div>
+				<h3>Administrators</h3>
+				
+				<p>Logged in users are assigned the <code>ROLE_USER</code> authority by default, but the following users
+				 (identified by issuer/subject pairs) will also be given <code>ROLE_ADMIN</code>:</p>
+				
+				<table class="table table-striped table-hover span4">
+					<tr>
+						<th>Issuer</th>
+						<th>Subject</th>
+					</tr>
+					<c:forEach items="${ admins }" var="admin">
+						<tr>
+							<td>${ admin.issuer }</td>
+							<td>${ admin.subject }</td>
+						</tr>
+					</c:forEach>
+				</table>
+			</div>
+
+		</div>
+	</div>
+</div>
+
+
+<o:footer />
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-home.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-home.jsp
new file mode 100644
index 00000000..9fd11036
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-home.jsp
@@ -0,0 +1,102 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
+<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags"%>
+<%@ page session="false" %>
+<o:header title="Home"/>
+<o:topbar pageName="Home"/>
+<div class="container-fluid main">
+	<div class="row-fluid">
+		<div class="span10 offset1">
+
+			<h1>
+				Hello world!
+			</h1>
+		
+			<div>
+				<p class="well">
+					<security:authorize access="hasRole('ROLE_USER')">
+						<b><span class="text-success">You are currently logged in.</span></b>
+					</security:authorize>
+					<security:authorize access="!hasRole('ROLE_USER')">
+						<b><span class="text-error">You are <em>NOT</em> currently logged in.</span></b>			
+					</security:authorize>
+				</p>
+				
+				<p>This example application is configured with several pages requiring different levels of access. 
+				This page does not require the user to be logged in. Use the tabs in the navbar above to navigate to 
+				pages with different access requirements.
+				</p>
+			
+				<ul>
+					<li><a href="user">User</a>, requires the user to be logged in with the <code>ROLE_USER</code> Spring Security authority.</li>
+					<li><a href="admin">Admin</a>, requires the user to be logged in with the <code>ROLE_ADMIN</code> Spring Security authority. 
+					    See below for the currently configured list of admin accounts.</li>
+					<security:authorize access="hasRole('ROLE_USER')">
+						<li><a href="j_spring_security_logout">Logout</a>, log out directly and return to this page.</li>
+					</security:authorize>
+					<security:authorize access="!hasRole('ROLE_USER')">
+						<li><a href="login">Log in</a>, log in directly and return to this page.</li>
+					</security:authorize>
+				</ul>
+			
+			
+			</div>
+		
+			<div>
+				<h3>Client Filter Configuration</h3>
+				
+				<p>This authorization filter for this client has been configured with the following components:</p>
+				
+				<ul>
+					<li>Issuer service: <code>${ issuerServiceClass }</code></li>
+					<li>Server configuration service: <code>${ serverConfigurationServiceClass }</code></li>
+					<li>Client configuration service: <code>${ clientConfigurationServiceClass }</code></li>
+					<li>Auth request options service: <code>${ authRequestOptionsServiceClass }</code></li>
+					<li>Auth request URI builder: <code>${ authRequestUriBuilderClass }</code></li>
+				</ul>
+			</div>
+			
+			<div>
+				<h3>Administrators</h3>
+				
+				<p>Logged in users are assigned the <code>ROLE_USER</code> authority by default, but the following users
+				 (identified by issuer/subject pairs) will also be given <code>ROLE_ADMIN</code>:</p>
+				
+				<table class="table table-striped table-hover span4">
+					<tr>
+						<th>Issuer</th>
+						<th>Subject</th>
+					</tr>
+					<c:forEach items="${ admins }" var="admin">
+						<tr>
+							<td>${ admin.issuer }</td>
+							<td>${ admin.subject }</td>
+						</tr>
+					</c:forEach>
+				</table>
+			</div>
+		</div>
+	</div>
+</div>
+
+
+<o:footer />
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-login.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-login.jsp
new file mode 100644
index 00000000..cf2f9bcc
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-login.jsp
@@ -0,0 +1,76 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
+<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags"%>
+<o:header title="Login"/>
+<div class="container-fluid main">
+	<div class="row-fluid">
+		<div class="span10 offset1">
+
+			<h2>Welcome to ECOMP Portal OpenId Login</h2>
+			
+			<p>
+				Please provide the URI for your <code>OpenId Authorization Server</code>. Make sure the OpenId Connect Server is Running on the following location 
+			</p>
+			
+			<p>
+				If you do not have one of your own, for a quick start up, you can clone from <a href='https://github.com/mitreid-connect/OpenID-Connect-Java-Spring-Server'>this</a> github location - It's an open source OpenID Connect Server.
+			</p>
+			
+			<p>
+				Simply clone on your local, go to sub-project directory called 'openid-connect-server-webapp' and do 
+				
+				<code>mvn jetty:run</code>				
+				  
+			</p>
+						
+			<p>
+				Choose a different port using the jetty plugin inside pom.xml, if the default 8080 is already taken by your Application.
+			</p>
+			
+			
+			
+			<div class="well">
+				<div class="row-fluid">
+	
+					<div class="span8">
+						<form action="openid_connect_login" method="get">
+							<input type="text" class="input-xxlarge" name="identifier" id="identifier" value = "http://localhost:8383/openid-connect-server-webapp/" />
+							<input type="submit" value="Log In" />
+						</form>
+					</div>
+				</div>
+		</div>
+	</div>
+</div>
+
+<script type="text/javascript">
+	$(document).ready(function () {
+		$('#localhost').on('click', function() {
+			$('#identifier').val('http://localhost:8383/openid-connect-server-webapp/');
+		});
+		$('#mitreidorg').on('click', function() {
+			$('#identifier').val('user@mitreid.org');
+		});
+		
+	});
+</script>
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-user.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-user.jsp
new file mode 100644
index 00000000..112415b0
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/oid-user.jsp
@@ -0,0 +1,139 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
+<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags"%>
+<o:header title="User"/>
+<o:topbar pageName="User"/>
+<div class="container-fluid main">
+	<div class="row-fluid">
+		<div class="span10 offset1">
+
+			<h1>Hello ${ userInfo.name }</h1>
+
+			<div>
+				<p>This page requires that the user be logged in with a valid account and the <code>ROLE_USER</code> Spring Security authority.
+				If you are reading this page, <span class="text-success">you are currently logged in</span>.</p>
+				
+				<security:authentication var="user" property="principal" />
+				
+				<p>The authorization provider will create a Principal object based on the <code>iss</code> and <code>sub</code>
+				claims associated with your ID token. This value can be used as a globally unique username within the application
+				(though it's not meant to be human-readable).
+				Your Principal is: <code>${ user }</code></p>
+
+				<p>The authorization provider will assign your account a set of authorities depending on how it's configured.
+				Your current login has the following Spring Security authorities:</p>
+				
+				<ul>
+					<security:authentication property="authorities" var="authorities" />
+					<c:forEach items="${authorities}" var="auth">
+						<li><code>${ auth }</code></li>
+					</c:forEach>
+				</ul>
+				
+				<h3>ID Token</h3>
+
+				<p>Your ID Token has the following set of claims:</p>
+				
+				<security:authentication property="idToken" var="idToken" />
+				<table class="table table-striped table-hover" id="idTokenTable">
+					<thead>
+						<tr>
+							<th class="span1">Name</th>
+							<th class="span11">Value</th>
+						</tr>
+					</thead>
+					<tbody>
+					</tbody>				
+				</table>
+				
+				<p>The ID Token header contains the following claims:</p>
+				
+				<table class="table table-striped table-hover" id="idTokenHeader">
+					<thead>
+						<tr>
+							<th class="span1">Name</th>
+							<th class="span11">Value</th>
+						</tr>
+					</thead>
+					<tbody>
+					</tbody>				
+				</table>
+
+				<h3>User Info</h3>
+				
+				<p>The call to the User Info Endpoint returned the following set of claims:</p>
+
+				<table class="table table-striped table-hover" id="userInfoTable">
+					<thead>
+						<tr>
+							<th class="span1">Name</th>
+							<th class="span11">Value</th>
+						</tr>
+					</thead>
+					<tbody>
+					</tbody>				
+				</table>
+
+			</div>
+
+		</div>
+	</div>
+</div>
+
+<script type="text/javascript">
+	$(document).ready(function () {
+
+		var idTokenString = "${ idToken.serialize() }";
+		var idToken = jwt.WebTokenParser.parse(idTokenString);
+		var idHeader = JSON.parse(jwt.base64urldecode(idToken.headerSegment));
+		var idClaims = JSON.parse(jwt.base64urldecode(idToken.payloadSegment));
+	
+		_.each(idClaims, function(val, key, list) {
+			if (_.contains(["iat", "exp", "auth_time", "nbf"], key)) {
+				// it's a date field, parse and print it
+				var date = new Date(val * 1000);
+				$('#idTokenTable tbody').append('<tr><td>' + _.escape(key) + '</td><td><span title="' + _.escape(val) + '">' + date + '</span></td></tr>');
+			} else {
+				$('#idTokenTable tbody').append('<tr><td>' + _.escape(key) + '</td><td>' + _.escape(val) + '</td></tr>');
+			}
+		});
+		
+		_.each(idHeader, function(val, key, list) {
+			if (_.contains(["iat", "exp", "auth_time", "nbf"], key)) {
+				// it's a date field, parse and print it
+				var date = new Date(val * 1000);
+				$('#idTokenHeader tbody').append('<tr><td>' + _.escape(key) + '</td><td><span title="' + _.escape(val) + '">' + date + '</span></td></tr>');
+			} else {
+				$('#idTokenHeader tbody').append('<tr><td>' + _.escape(key) + '</td><td>' + _.escape(val) + '</td></tr>');
+			}
+		});
+		
+		var userInfo = ${ userInfoJson };
+		_.each(userInfo, function(val, key, list) {
+			$('#userInfoTable tbody').append('<tr><td>' + _.escape(key) + '</td><td>' + _.escape(val) + '</td></tr>');
+		});
+	});
+
+</script>
+
+<o:footer />
diff --git a/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/welcome.jsp b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/welcome.jsp
new file mode 100644
index 00000000..054c38fe
--- /dev/null
+++ b/ecomp-portal-BE-os/src/main/webapp/WEB-INF/jsp/welcome.jsp
@@ -0,0 +1,695 @@
+<%--
+  ================================================================================
+  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.
+  ================================================================================
+  --%>
+<%@ taglib prefix="c"      uri="http://java.sun.com/jsp/jstl/core" %>
+<%@ taglib prefix="fmt"    uri="http://java.sun.com/jsp/jstl/fmt" %>
+<%@ taglib prefix="fn"     uri="http://java.sun.com/jsp/jstl/functions" %>
+
+<link rel="stylesheet" type="text/css" href="static/fusion/sample/css/slider.css">
+<link rel="stylesheet" type="text/css" href="static/fusion/sample/css/scribble.css" />
+<link rel="stylesheet" type="text/css" href="static/fusion/sample/css/spacegallery.css" />
+<link rel="stylesheet" href="static/fusion/css/att_angular_gridster/ui-gridster.css"/>
+<link rel="stylesheet" href="static/fusion/css/att_angular_gridster/sandbox-gridster.css"/>
+
+<script src= "static/ebz/angular_js/angular.js"></script> 
+<script src= "static/ebz/angular_js/angular-sanitize.js"></script>
+
+<script src= "static/ebz/angular_js/app.js"></script>
+<script src= "static/ebz/angular_js/gestures.js"></script>
+
+<script src="static/js/jquery-1.10.2.js"></script>
+<!-- <script src="static/fusion/js/jquery.resize.js"></script> -->
+<script src="static/fusion/js/att_angular_gridster/ui-gridster-tpls.js"></script>
+<script src="static/fusion/js/att_angular_gridster/angular-gridster.js"></script>
+
+<script src= "static/ebz/angular_js/checklist-model.js"></script>
+<script src= "static/js/modalService.js"></script>
+<script src="static/js/jquery.mask.min.js" type="text/javascript"></script>
+<script src="static/js/jquery-ui.js" type="text/javascript"></script>
+<script src="static/ebz/sandbox/att-abs-tpls.js" type="text/javascript"></script>
+<script src="static/ebz/sandbox/att-abs-tpls.min.js" type="text/javascript"></script>
+<style>
+.button--small, [class*=bg-] .button--small {
+    font-size: 14px;
+ };
+</style>
+
+<style>
+.gridster-item-container .gridster-item-body{
+bottom:0px;
+}
+.gridster-item-container{
+min-height:50px;
+}
+.att-accordion {
+    border-width: 0px;
+}
+</style>
+
+<style>
+  #myGallery {
+	width: 100%;
+	height: 400px;
+  }
+  
+  #myGallery img {
+	border: 2px solid #52697E;
+  }
+  
+  a.loading {
+	background: #fff url(../images/ajax_small.gif) no-repeat center;
+  }
+  
+  .center {
+    margin-left: auto;
+    margin-right: auto;
+  }
+
+</style>
+
+<script type="text/javascript" src="static/fusion/sample/js/FusionCharts.js"></script> <!--  Charts -->
+<script type="text/javascript" src="static/fusion/sample/js/charts.js"></script> <!--  Charts -->
+
+<script type="text/javascript" src="static/fusion/sample/js/slides.min.jquery.js"></script> <!-- Image Slider -->
+<script type="text/javascript" src="static/fusion/sample/js/scribble.js"></script>          <!-- Scribble -->
+<script type="text/javascript" src="static/fusion/sample/js/eye.js"></script>               <!-- Space Gallery -->
+<script type="text/javascript" src="static/fusion/sample/js/utils.js"></script>             <!-- Space Gallery -->
+<script type="text/javascript" src="static/fusion/sample/js/spacegallery.js"></script>      <!-- Space Gallery -->
+
+ <!--  Carousel rendering -->
+  <script>
+  (function($){
+		var initLayout = function() {
+			$('#myGallery').spacegallery({loadingClass: 'loading'});
+		};
+
+		EYE.register(initLayout, 'init');
+	})(jQuery)
+  </script>
+
+  <!--  Slider rendering -->
+  <script>
+  $(function(){
+	  $('#slides').slides({
+			preload: true,
+			preloadImage: 'static/fusion/sample/images/loading.gif',
+			play: 5000,
+			pause: 10000,
+			hoverPause: true,
+			animationStart: function(current){
+				$('.caption').animate({
+					bottom:-35
+				},100);
+				if (window.console && console.log) {
+					// example return of current slide number
+					//console.log('animationStart on slide: ', current);
+				};
+			},
+			animationComplete: function(current){
+				$('.caption').animate({
+					bottom:0
+				},200);
+				if (window.console && console.log) {
+					// example return of current slide number
+					//console.log('animationComplete on slide: ', current);
+				};
+			},
+			slidesLoaded: function() {
+				$('.caption').animate({
+					bottom:0
+				},200);
+			}
+		});
+    });
+  
+
+  </script>
+
+<div ng-controller="welcomeController">
+	<fmt:message key="general.home" var="title" /> 
+	<div>
+	  	<span style="font-weight:bold;font-size:11pt;">Welcome ${sessionScope.user.firstName} ${sessionScope.user.lastName}</span>&nbsp;
+	(Last Login:&nbsp;<fmt:formatDate value="${sessionScope.user.lastLoginDate}" type="date" pattern="dd MMM yyyy hh:mma zzz" var="lastLogin" /> ${lastLogin})
+	</div>
+	
+	<div style="float:left; width:320px; height:320px; margin:10px 27px 10px 27px;color:#222222;text-shadow: 1px 1px 2px #A0A0A0;" >
+	    <p style="font-weight:bold;font-size:16pt;color:#0046B8;">Network </p>
+	    <p style="font-weight:bold;font-size:16pt;color:#0046B8;">Visualization </p>
+	    
+  	</div>
+  	
+  	<!-- Spacer required to center the Image slider (can also be used for content) -->
+	  <div style="float:right; width:120px; height:320px; margin:10px 27px 10px 10px;color:#222222;text-shadow: 1px 1px 2px #A0A0A0;">
+	    <p style="font-weight:bold;font-size:9pt;">
+	      You can toggle between the Image Slider and Carousel controls by clicking on the respective radio button below:
+	    </p>
+	    <input type="radio" name="viewer" onClick="$('#example').show();$('#myGallery').hide();" value="Slider" />Slider<br/>
+	    <input type="radio" name="viewer" onClick="$('#example').hide();$('#myGallery').show();" value="Carousel" />Carousel 
+		
+	    <br/>
+	  </div>
+  	
+  	  <div id="container">
+
+	  	<div style="position:relative">
+	  		<div id="myGallery" class="spacegallery" style="position:static">
+		      <img src="static/fusion/sample/images/carousel/slide_b_drive_test_map.png" alt="Drive test analytics" />
+		      <img src="static/fusion/sample/images/carousel/slide_b_ios_throughput.png" alt="MTSA - Nationwide DL throughput for iOS devices over cellular network" />
+		      <img src="static/fusion/sample/images/carousel/slide_b_eppt_county.png" alt="Location based services county level drive test" />
+			  <img src="static/fusion/sample/images/carousel/slide_b_lata_map.png" alt="Network demand data by LATA (2020 forecast)" />
+			  <img src="static/fusion/sample/images/carousel/slide_b_eppt_regression.png" alt="Linear regression prediction of LBS/E911 drive test accuracy" />
+			  <img src="static/fusion/sample/images/carousel/slide_b_nova_sdn_map.png" alt="SDN Simulator - SNRC Traffic" />
+		      <span style="float:right; color:#222222;">(Click on Image to Rotate)</span>
+			</div>
+		</div>
+		<div id="example">
+		  <div id="slides">
+			<div class="slides_container">
+			  <div class="slide">
+				<a href="#" title="Drive test analytics"><img src="static/fusion/sample/images/carousel/slide_b_drive_test_map.png" width="570" height="270" alt="Drive test analytics"></a>
+				<div class="caption">
+				  <p>Drive test analytics</p>
+				</div>
+			  </div>
+			  <div class="slide">
+				<a href="doclib.htm" title="MTSA - Nationwide DL throughput for iOS devices over cellular network"><img src="static/fusion/sample/images/carousel/slide_b_ios_throughput.png" width="570" height="270" alt="MTSA - Nationwide DL throughput for iOS devices over cellular network"></a>
+				<div class="caption">
+				  <p>Nationwide DL throughput for iOS devices over cellular network</p>
+				</div>
+			  </div>
+			  <div class="slide">
+				<a href="#" title="Network demand data by LATA (2020 forecast)"><img src="static/fusion/sample/images/carousel/slide_b_lata_map.png" width="570" height="270" alt="Network demand data by LATA (2020 forecast)"></a>
+				<div class="caption">
+				  <p>Network demand data by LATA (2020 forecast)</p>
+				</div>
+			  </div>
+			  <div class="slide">
+				<a href="#" title="Location based services county level drive test"><img src="static/fusion/sample/images/carousel/slide_b_eppt_county.png" width="570" height="270" alt="Location based services county level drive test"></a>
+				<div class="caption">
+				  <p>Location based services county level drive test</p>
+				</div>
+			  </div>
+			  <div class="slide">
+				<a href="broadcast_list.htm" title="SDN Simulator - SNRC Traffic"><img src="static/fusion/sample/images/carousel/slide_b_nova_sdn_map.png" width="570" height="270" alt="SDN Simulator - SNRC Traffic"></a>
+				<div class="caption">
+				  <p>SDN Simulator - SNRC Traffic</p>
+				</div>
+			  </div>
+			  <div class="slide">
+				<a href="#" title="Linear regression prediction of LBS/E911 drive test accuracy"><img src="static/fusion/sample/images/carousel/slide_b_eppt_regression.png" width="570" height="270" alt="Linear regression prediction of LBS/E911 drive test accuracy"></a>
+				<div class="caption" style="bottom:0">
+				  <p>Linear regression prediction of LBS/E911 drive test accuracy</p>
+				</div>
+			  </div>
+			</div>
+			<a href="#" class="prev"><img src="static/fusion/sample/images/arrow-prev.png" width="24" height="43" alt="Arrow Prev"></a>
+			<a href="#" class="next"><img src="static/fusion/sample/images/arrow-next.png" width="24" height="43" alt="Arrow Next"></a>
+		  </div>
+		  <img src="static/fusion/sample/images/example-frame.png" width="739" height="341" alt="Example Frame" id="frame">
+		</div>
+	  </div>
+  		
+  	<center>
+        <div class="gridster-container">
+            <div att-gridster att-gridster-options='gridsterOpts'>
+                <div att-gridster-item='item' ng-repeat="item in standardItems">
+                    <div att-gridster-item-header 
+                         header-text={{item.headerText}} 
+                         sub-header-text={{item.subHeaderText}}>
+                            <!--ICON BUTTONS PLACEHOLDER START-->
+                            <div class="tileMinMaxBtn" ng-click="toggleMinMax($index,'')">
+								<span class="tileMinMaxIcon">
+									<i	class="icon-chevron-up" style="color:gray"  ng-show="item.max"></i>
+									<i	class="icon-chevron-down" style="color:gray"  ng-hide="item.max"></i>
+								</span>
+							</div>
+                            <!--ICON BUTTONS PLACEHOLDER END-->
+                    </div>
+               	 	<div att-gridster-item-body >
+		                <!--ACTUAL BODY CONTENT START-->
+			                <div align="center" style="margin-top:10px;">
+			               		<div align="left" ng-if="item.headerText=='Dashboard' && item.max">
+			               			<label>&nbsp; Sample Charts</label><BR>
+					              	<iframe scrolling="no" frameBorder="0" style="width: 430px; height: 360px;" src="static/fusion/sample/html/wordcloud.html"></iframe>
+			               		</div>
+			               		<div ng-if="item.headerText=='Donut Chart' && item.max">
+					              	<iframe scrolling="no" frameBorder="0"  style="width: 310px; height: 210px;" src="static/fusion/sample/html/donut_d3.html"></iframe>
+			               		</div>
+			               		<div ng-if="item.headerText=='Area Chart' && item.max">
+					              	<iframe scrolling="no" frameBorder="0"  style="width: 310px; height: 210px;" src="static/fusion/sample/html/area_chart.html"></iframe>
+			               		</div>
+			               		<div ng-if="item.headerText=='Pie Chart' && item.max">
+					              	<iframe scrolling="no" frameBorder="0"  style="width: 310px; height: 210px;" src="static/fusion/sample/html/pie_chart.html"></iframe>
+			               		</div>
+			               		<div ng-if="item.headerText=='Line Chart' && item.max">
+			               			<iframe scrolling="no" frameBorder="0"  style="width: 310px; height: 210px;" src="static/fusion/sample/html/line_chart.html"></iframe>
+			               		</div>
+			               		<div ng-if="item.headerText=='Gauges' && item.max">
+					              	<iframe scrolling="no" frameBorder="0"  style="width: 310pxx; height: 210px;" src="static/fusion/sample/html/d3_gauges_demo.html"></iframe>
+			               		</div>
+			               		
+			               		<div align="left" ng-if="item.headerText=='Traffic distribution by day of week' && item.max">
+					              	<att-tabs title="gTabs" class="tabs" >
+					                	<floating-tabs ng-model='activeTabId' size="small"></floating-tabs>
+					    			</att-Tabs>
+					    			<div>	
+							        	<div id="Monday" align="left"><img src="static/fusion/sample/images/tunnels/1_mon.png" width=100% height=100% alt="Monday"></div>
+										<div id="Tuesday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/2_tue.png" width=100% height=100% alt="Tuesday"></div>
+										<div id="Wednesday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/3_wed.png" width=100% height=100% alt="Wednesday"></div>
+										<div id="Thursday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/4_thu.png" width=100% height=100% alt="Thursday"></div>
+										<div id="Friday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/5_fri.png" width=100% height=100% alt="Friday"></div>
+										<div id="Saturday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/6_sat.png" width=100% height=100% alt="Saturday"></div>
+										<div id="Sunday" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/7_sun.png" width=100% height=100% alt="Sunday"></div>
+							        </div>
+			               		</div>
+			               		<div align="left" ng-if="item.headerText=='Busy hour traffic analysis by day of week' && item.max">
+					              	<att-tabs title="gTabs2">
+					                	<floating-tabs ng-model='activeTabId2' size="small"></floating-tabs>
+					    			</att-Tabs>
+					    			<div>	
+							        	<div id="Incoming" align="left"><img src="static/fusion/sample/images/tunnels/BH_DLSTX_IN.png" width=100% height=100% alt="Monday"></div>
+										<div id="Outgoing" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/BH_DLSTX_OUT.png" width=100% height=100% alt="Tuesday"></div>
+										<div id="Default" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat_Def.png" width=100% height=100% alt="Wednesday"></div>
+										<div id="Priority" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat_Priority.png" width=100% height=100% alt="Thursday"></div>
+										<div id="BHNational" class="hidden" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat.png" width=100% height=100% alt="Friday"></div>
+							        </div>
+			               		</div>
+
+			               		<div align="left" ng-if="item.headerText=='Additional Samples' && item.max">
+					              	<label>&nbsp;Quick Links</label>				          		 
+						    		<table att-table >
+							    
+										  <tr>
+										    <td att-table-body width="90%" ><a href="" target="_blank">Contacts</a></td>
+										    <td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										    <td att-table-body width="90%" ><a href="" target="_blank">Developer Program</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										    <td att-table-body width="90%" ><a href="http://www.zkoss.org" target="_blank">ZK Framework</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										    <td att-table-body width="90%" ><a href="http://jquery.com" target="_blank">JQuery</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										    <td att-table-body width="90%" ><a href="force_cluster.html" target="_blank">RNC Visualization</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										    <td att-table-body width="90%" ><a href="sample_heat_map.htm" target="">Heat Map</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										  	<td att-table-body width="90%" ><a href="sample_animated_map.htm" target="">Animated Map</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										  	<td att-table-body width="90%" ><a href="jbpm_drools.htm" target="_blank">Process Management</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+										  <tr>
+										  	<td att-table-body width="90%" ><a href="chatRoom.htm">Chat Session</a></td>
+											<td att-table-body width="10%">
+										    	<a ng-click="removeRole();" ><img src="static/fusion/sample/images/deleteicon.gif"></a>
+										     </td>
+										  </tr>
+									</table>
+			               		</div>
+			               		<div ng-if="item.headerText=='Sticky Notes' && item.max">
+					              	<div style="width:100%; height:400px" id="scribble-pad"><pre id="scribble" contenteditable="true" onkeyup="storeUserScribble(this.id);"></pre></div>
+			               		</div>
+			              		<div ng-if="item.headerText=='Service Configuration' && item.max">
+					              	          <accordion close-others="true" css="att-accordion">
+											          <accordion-group heading="Service Configuration" is-open="group11.open"> 
+													        <iframe scrolling="no" frameBorder="0" align="center" width="100%" height="400px"  src="static/fusion/sample/org_chart/example.html" ></iframe> 	
+											          </accordion-group>
+											          <accordion-group heading="VSP Service Configuration" is-open="group12.open">             	
+									              			<iframe scrolling="no" frameBorder="0" align="center" width="100%" height="400px" src="static/fusion/sample/org_chart/example_vsp.html" ></iframe>
+											          </accordion-group>
+									          </accordion> 	
+			               		</div>
+			               		
+				      	  	</div>
+							
+		                <!--ACTUAL BODY CONTENT END-->
+                	</div>
+                   <!--  <div att-gridster-item-footer 
+                         att-gridster-item-footer-link={{item.footerLink}}>
+                        {{item.footerLinkText}}
+                    </div> -->
+                </div>
+            </div>
+        </div>
+    </center>
+    
+</div>
+	
+<script>
+$(document).ready(function(){
+	  $( "#rightIcon" ).hide();
+		$( "#leftIcon" ).show();
+});
+var app=angular.module("abs", ["att.abs", "modalServices","att.gridster","checklist-model"]);
+app.controller('welcomeController', function ($scope, modalService, $modal) { 
+
+	$scope.gridsterOpts = {
+		    columns: 3, // the width of the grid, in columns
+		    pushing: true, // whether to push other items out of the way on move or resize
+		    floating: true, // whether to automatically float items up so they stack (you can temporarily disable if you are adding unsorted items with ng-repeat)
+		    width: 'auto', // can be an integer or 'auto'. 'auto' scales gridster to be the full width of its containing element
+		    colWidth: 'auto', // can be an integer or 'auto'.  'auto' uses the pixel width of the element divided by 'columns'
+		    rowHeight: 60, // can be an integer or 'match'.  Match uses the colWidth, giving you square widgets.
+		    margins: [10, 10], // the pixel distance between each widget
+		    outerMargin: true, // whether margins apply to outer edges of the grid
+	        swapping: true,
+	        draggable: {
+	            enabled: true, // whether dragging items is supported
+	            stop: function(event, uiWidget, $element) {$scope.setCookie();} // optional callback fired when item is finished dragging
+	         }
+
+		};
+	
+	/* $scope.gridsterOpts = {
+            columns: 6,
+            width: 'auto',
+            colWidth: '230',
+			rowHeight: '120',
+			margins: [10, 10],
+			outerMargin: true,
+			pushing: true,
+			floating: true,
+            swapping: true
+	        }; */
+		
+	
+	$scope.toggleMinMax = function(index, tileName){
+		if(tileName==''){
+			$scope.standardItems[index].max = !$scope.standardItems[index].max;
+			if($scope.standardItems[index].max)
+				$scope.standardItems[index].sizeY=$scope.standardItems[index].maxHeight;
+			else
+				$scope.standardItems[index].sizeY=0;	
+		}else{
+			$scope.tileTemp = $scope.$eval(tileName);
+			var tileMax = $parse(tileName+'.max');
+			tileMax.assign($scope, !$scope.$eval(tileName).max);
+			var tileSizeY = $parse(tileName+'.sizeY');
+			if($scope.tileTemp.max)
+				tileSizeY.assign($scope, $scope.tileTemp.maxHeight);
+			else
+				tileSizeY.assign($scope, 0);
+		}
+	};
+		// These map directly to gridsterItem options
+		    // IMPORTANT: Items should be placed in the grid in the order in which 
+		    // they should appear.
+		    // In most cases the sorting should be by row ASC, col ASC
+		    $scope.standardItems = [{
+			sizeX: 1,
+			sizeY: 8,
+ 	        maxHeight: 8,
+			row: 0,
+			col: 0,
+		            headerText:'Dashboard',
+		            max:false
+		            
+		            
+		},
+		    {
+			sizeX: 1,
+			sizeY: 5,
+ 	        maxHeight: 5,
+			row: 0,
+			col: 1,
+		            headerText:'Donut Chart',
+		            max:false
+		            
+		},
+		    {
+			sizeX: 1,
+			sizeY: 5,
+ 	        maxHeight: 5,
+			row: 0,
+			col: 2,
+		            headerText:'Area Chart',
+		            max:true
+		},
+		    {
+			sizeX: 1,
+			sizeY: 5,
+ 	        maxHeight: 5,
+			row: 8,
+			col: 0,
+		            headerText:'Pie Chart',
+		            max:false
+		},
+		    {
+			sizeX: 1,
+			sizeY: 5,
+ 	        maxHeight: 5,
+			row: 8,
+			col: 1,
+		            headerText:'Line Chart',
+		            max:true
+		},
+		    {
+			sizeX: 1,
+			sizeY: 5,
+ 	        maxHeight: 5,
+			row: 8,
+			col: 2,
+		            headerText:'Gauges',
+		            max:false
+		},
+		    {
+			sizeX: 1,
+			sizeY: 8,
+ 	        maxHeight: 8,
+			row: 16,
+			col: 0,
+		            headerText:'Traffic distribution by day of week',
+		            max:false
+		},
+		    {
+			sizeX: 1,
+			sizeY: 8,
+ 	        maxHeight: 8,
+			row: 16,
+			col: 1,
+		            headerText:'Busy hour traffic analysis by day of week',
+		            max:false
+		},
+		    {
+			sizeX: 1,
+			sizeY: 6,
+ 	        maxHeight: 6,
+			row: 24,
+			col: 0,
+		            headerText:'Additional Samples',
+		            max:false
+		},
+		    {
+			sizeX: 1,
+			sizeY: 8,
+ 	        maxHeight: 8,
+			row: 24,
+			col: 1,
+		            headerText:'Sticky Notes',
+		            max:false
+		},
+		    {
+			sizeX: 3,
+			sizeY: 10,
+ 	        maxHeight: 10,
+			row: 32,
+			col: 0,
+		            headerText:'Service Configuration',
+		            max:false
+		}];
+	
+	$.each($scope.standardItems, function(i, a){ 
+		    $scope.toggleMinMax(i,'');
+	});
+	 $scope.activeTabId = 'Monday';
+	//for generic tabs
+    $scope.gTabs = [{
+            title: 'Monday',
+            id: 'Monday',
+            url: '#Monday',
+            selected: true
+        },{
+            title: 'Tuesday',
+            id: 'Tuesday',
+            url: '#Tuesday'
+        },{
+            title: 'Wednesday',
+            id: 'Wednesday',
+            url: '#Wednesday'
+        },{
+            title: 'Thursday',
+            id: 'Thursday',
+            url: '#Thursday'
+        },{
+            title: 'Friday',
+            id: 'Friday',
+            url: '#Friday'
+        },{
+            title: 'Saturday',
+            id: 'Saturday',
+            url: '#Saturday'
+        },{
+            title: 'Sunday',
+            id: 'Sunday',
+            url: '#Sunday'
+        }
+    ];
+
+    $scope.activeTabId2 = 'Incoming';
+	//for generic tabs
+    $scope.gTabs2 = [{
+            title: 'BH SNRC DLSTX - Incoming',
+            id: 'Incoming',
+            url: '#Incoming',
+            selected: true
+        },{
+            title: 'BH SNRC DLSTX - Outgoing',
+            id: 'Outgoing',
+            url: '#Outgoing'
+        },{
+            title: 'BH National - Default',
+            id: 'Default',
+            url: '#Default'
+        },{
+            title: 'BH National - Priority',
+            id: 'Priority',
+            url: '#Priority'
+        },{
+            title: 'BH National',
+            id: 'BHNational',
+            url: '#BHNational'
+        }
+    ];
+	
+    $scope.activeTabId3 = 'Incoming';
+	//for generic tabs
+    $scope.gTabs3 = [{
+            title: 'BH SNRC DLSTX - Incoming',
+            id: 'Incoming',
+            url: '#Incoming',
+            selected: true            
+        },{
+            title: 'BH SNRC DLSTX - Outgoing',
+            id: 'Outgoing',
+            url: '#Outgoing'
+        },{
+            title: 'BH National - Default',
+            id: 'Default',
+            url: '#Default'
+        },{
+            title: 'BH National - Priority',
+            id: 'Priority',
+            url: '#Priority'
+        },{
+            title: 'BH National',
+            id: 'BHNational',
+            url: '#BHNational'
+        }
+    ];
+
+	/* $scope.$watch('activeTabId', function(newVal) {
+		alert(newval);
+		$('#'+newval).show();
+	}, true); */
+	
+	$scope.toggleEastToWest = function() {
+		$( "#toggle" ).toggle( 'slide');	
+		if ($("#leftIcon").is(":visible")) {
+			$( "#rightIcon" ).show();
+			$( "#leftIcon" ).hide();
+	    } 
+		else if ($("#rightIcon").is(":visible")) {
+	    	$( "#rightIcon" ).hide();
+			$( "#leftIcon" ).show();
+	    }
+	};
+	
+	$scope.group1 = {
+            open: true
+        };
+	$scope.group2 = {
+            open: true
+        };
+	$scope.group3 = {
+            open: true
+        };
+	$scope.group4 = {
+            open: true
+        };
+	$scope.group5 = {
+            open: true
+        };
+	$scope.group6 = {
+            open: true
+        };	
+	$scope.group7 = {
+            open: true
+        };
+	$scope.group71 = {
+            open: true
+        };
+	$scope.group8 = {
+            open: true
+        };
+	$scope.group9 = {
+            open: true
+        };
+	$scope.group10 = {
+            open: true
+        };
+	$scope.group11 = {
+            open: true
+        };
+	$scope.group12 = {
+            open: false
+        };
+});
+</script>
+
+  <!-- Select the Slider control by default -->
+  <script>$('input[name=viewer]:eq(1)').click();</script>