diff options
Diffstat (limited to 'ecomp-sdk-app/src/main/webapp/WEB-INF/jsp')
6 files changed, 1213 insertions, 0 deletions
diff --git a/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/error.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/error.jsp new file mode 100644 index 000000000..2a48507c9 --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/error.jsp @@ -0,0 +1,20 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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-sdk-app/src/main/webapp/WEB-INF/jsp/leafletMap.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/leafletMap.jsp new file mode 100644 index 000000000..77981f736 --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/leafletMap.jsp @@ -0,0 +1,288 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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. + ================================================================================ + --%> +<!DOCTYPE html> + +<html> +<head> + + <meta charset="UTF-8"> + + <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> + <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> + <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" /> + + <style> + #map { + height: 450px; + width: 800px; + } + .animateOff { + color: red; + } + .animateOn { + color: green; + } + </style> + + <script> + + var siteData = [ + {"id": "cb1ma", "name": "Cambridge, MA", "title": "100G", "lat": 42.3736, "lon": -71.11}, + {"id": "st6wa", "name": "Seattle, WA", "title": "40G", "lat": 47.6097, "lon": -122.33}, + {"id": "cgcil", "name": "Chicago, IL", "title": "310G", "lat": 41.8819, "lon": -87.627}, + {"id": "n54ny", "name": "New York, NY", "title": "160G", "lat": 40.7127, "lon": -74.005}, + {"id": "cl2oh", "name": "Columbus, OH", "title": "300G", "lat": 39.9833, "lon": -82.983}, + {"id": "phlpa", "name": "Philadelphia, PA", "title": "210G", "lat": 39.95, "lon": -75.166}, + {"id": "ptdor", "name": "Portland, OR", "title": "90G", "lat": 45.52, "lon": -122.68}, + {"id": "dvmco", "name": "Denver, CO", "title": "170G", "lat": 39.7391, "lon": -104.98}, + {"id": "kc9mo", "name": "Kansas City, MO", "title": "100G", "lat": 39.0997, "lon": -94.578}, + {"id": "sffca", "name": "San Fransisco, CA", "title": "130G", "lat": 37.7833, "lon": -122.41}, + {"id": "sl9mo", "name": "St Louis, MO", "title": "330G", "lat": 38.6272, "lon": -90.197}, + {"id": "wswdc", "name": "Washington, DC", "title": "210G", "lat": 38.8951, "lon": -77.036}, + {"id": "sc1ca", "name": "Sacramento, CA", "title": "250G", "lat": 38.5555, "lon": -121.46}, + {"id": "slkut", "name": "Salt Lake City, UT", "title": "250G", "lat": 40.75, "lon": -111.88}, + {"id": "rlgnc", "name": "Raleigh, NC", "title": "180G", "lat": 35.8188, "lon": -78.644}, + {"id": "nsvtn", "name": "Nashville, TN", "title": "210G", "lat": 36.1666, "lon": -86.783}, + {"id": "la2ca", "name": "Los Angeles, CA", "title": "180G", "lat": 34.05, "lon": -118.25}, + {"id": "dlstx", "name": "Dallas, TX", "title": "330G", "lat": 32.7758, "lon": -96.796}, + {"id": "attga", "name": "Atlanta, GA", "title": "280G", "lat": 33.755, "lon": -84.39}, + {"id": "nwrla", "name": "New Orleans, LA", "title": "180G", "lat": 29.9647, "lon": -90.07}, + {"id": "sd2ca", "name": "San Diego, CA", "title": "150G", "lat": 32.715, "lon": -117.16}, + {"id": "phmaz", "name": "Phoenix, AZ", "title": "210G", "lat": 33.45, "lon": -112.06}, + {"id": "santx", "name": "San Antonio, TX", "title": "220G", "lat": 29.4166, "lon": -98.5}, + {"id": "hs1tx", "name": "Houston, TX", "title": "290G", "lat": 29.7627, "lon": -95.383}, + {"id": "ormfl", "name": "Orlando, FL", "title": "130G", "lat": 28.4158, "lon": -81.298}, + ]; + + var pipeData = [ + {"id_a": "st6wa", "id_z": "ptdor", "name": "Seattle, WA to Portland, OR", "title": "60G", "lat_a": 47.6097, "lon_a": -122.33, "lat_z": 45.52, "lon_z": -122.68}, + {"id_a": "sc1ca", "id_z": "slkut", "name": "Sacramento, CA to Salt Lake City, UT", "title": "200G", "lat_a": 38.5555, "lon_a": -121.46, "lat_z": 40.75, "lon_z": -111.88}, + {"id_a": "hs1tx", "id_z": "ormfl", "name": "Houston, TX to Orlando, FL", "title": "130G", "lat_a": 29.7627, "lon_a": -95.383, "lat_z": 28.4158, "lon_z": -81.298}, + {"id_a": "nwrla", "id_z": "ormfl", "name": "New Orleans, LA to Orlando, FL", "title": "90G", "lat_a": 29.9647, "lon_a": -90.07, "lat_z": 28.4158, "lon_z": -81.298}, + {"id_a": "n54ny", "id_z": "phlpa", "name": "New York, NY to Philadelphia, PA", "title": "240G", "lat_a": 40.7127, "lon_a": -74.005, "lat_z": 39.95, "lon_z": -75.166}, + {"id_a": "n54ny", "id_z": "wswdc", "name": "New York, NY to Washington, DC", "title": "380G", "lat_a": 40.7127, "lon_a": -74.005, "lat_z": 38.8951, "lon_z": -77.036}, + {"id_a": "rlgnc", "id_z": "attga", "name": "Raleigh, NC to Atlanta, GA", "title": "160G", "lat_a": 35.8188, "lon_a": -78.644, "lat_z": 33.755, "lon_z": -84.39}, +// {"id_a": "st6wa", "id_z": "sffca", "name": "Seattle, WA to San Fransisco, CA", "title": "40G", "lat_a": 47.6097, "lon_a": -122.33, "lat_z": 37.7833, "lon_z": -122.41}, + {"id_a": "la2ca", "id_z": "sd2ca", "name": "Los Angeles, CA to San Diego, CA", "title": "160G", "lat_a": 34.05, "lon_a": -118.25, "lat_z": 32.715, "lon_z": -117.16}, + {"id_a": "sd2ca", "id_z": "phmaz", "name": "San Diego, CA to Phoenix, AZ", "title": "200G", "lat_a": 32.715, "lon_a": -117.16, "lat_z": 33.45, "lon_z": -112.06}, + {"id_a": "ptdor", "id_z": "sffca", "name": "Portland, OR to San Fransisco, CA", "title": "70G", "lat_a": 45.52, "lon_a": -122.68, "lat_z": 37.7833, "lon_z": -122.41}, + {"id_a": "sffca", "id_z": "sc1ca", "name": "San Fransisco, CA to Sacramento, CA", "title": "80G", "lat_a": 37.7833, "lon_a": -122.41, "lat_z": 38.5555, "lon_z": -121.46}, + {"id_a": "la2ca", "id_z": "slkut", "name": "Los Angeles, CA to Salt Lake City, UT", "title": "200G", "lat_a": 34.05, "lon_a": -118.25, "lat_z": 40.75, "lon_z": -111.88}, + {"id_a": "cgcil", "id_z": "cl2oh", "name": "Chicago, IL to Columbus, OH", "title": "200G", "lat_a": 41.8819, "lon_a": -87.627, "lat_z": 39.9833, "lon_z": -82.983}, + {"id_a": "cl2oh", "id_z": "phlpa", "name": "Columbus, OH to Philadelphia, PA", "title": "240G", "lat_a": 39.9833, "lon_a": -82.983, "lat_z": 39.95, "lon_z": -75.166}, + {"id_a": "phlpa", "id_z": "wswdc", "name": "Philadelphia, PA to Washington, DC", "title": "240G", "lat_a": 39.95, "lon_a": -75.166, "lat_z": 38.8951, "lon_z": -77.036}, + {"id_a": "sffca", "id_z": "la2ca", "name": "San Fransisco, CA to Los Angeles, CA", "title": "280G", "lat_a": 37.7833, "lon_a": -122.41, "lat_z": 34.05, "lon_z": -118.25}, + {"id_a": "dvmco", "id_z": "cgcil", "name": "Denver, CO to Chicago, IL", "title": "200G", "lat_a": 39.7391, "lon_a": -104.98, "lat_z": 41.8819, "lon_z": -87.627}, + {"id_a": "dlstx", "id_z": "hs1tx", "name": "Dallas, TX to Houston, TX", "title": "360G", "lat_a": 32.7758, "lon_a": -96.796, "lat_z": 29.7627, "lon_z": -95.383}, + {"id_a": "nsvtn", "id_z": "cl2oh", "name": "Nashville, TN to Columbus, OH", "title": "200G", "lat_a": 36.1666, "lon_a": -86.783, "lat_z": 39.9833, "lon_z": -82.983}, + {"id_a": "cb1ma", "id_z": "phlpa", "name": "Cambridge, MA to Philadelphia, PA", "title": "110G", "lat_a": 42.3736, "lon_a": -71.11, "lat_z": 39.95, "lon_z": -75.166}, +// {"id_a": "sffca", "id_z": "cgcil", "name": "San Fransisco, CA to Chicago, IL", "title": "170G", "lat_a": 37.7833, "lon_a": -122.41, "lat_z": 41.8819, "lon_z": -87.627}, + {"id_a": "sffca", "id_z": "dvmco", "name": "San Fransisco, CA to Denver, CO", "title": "90G", "lat_a": 37.7833, "lon_a": -122.41, "lat_z": 39.7391, "lon_z": -104.98}, + {"id_a": "sffca", "id_z": "sl9mo", "name": "San Fransisco, CA to St Louis, MO", "title": "80G", "lat_a": 37.7833, "lon_a": -122.41, "lat_z": 38.6272, "lon_z": -90.197}, + {"id_a": "santx", "id_z": "dlstx", "name": "San Antonio, TX to Dallas, TX", "title": "180G", "lat_a": 29.4166, "lon_a": -98.5, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "santx", "id_z": "hs1tx", "name": "San Antonio, TX to Houston, TX", "title": "240G", "lat_a": 29.4166, "lon_a": -98.5, "lat_z": 29.7627, "lon_z": -95.383}, + {"id_a": "sl9mo", "id_z": "wswdc", "name": "St Louis, MO to Washington, DC", "title": "280G", "lat_a": 38.6272, "lon_a": -90.197, "lat_z": 38.8951, "lon_z": -77.036}, + {"id_a": "nwrla", "id_z": "attga", "name": "New Orleans, LA to Atlanta, GA", "title": "200G", "lat_a": 29.9647, "lon_a": -90.07, "lat_z": 33.755, "lon_z": -84.39}, + {"id_a": "la2ca", "id_z": "dlstx", "name": "Los Angeles, CA to Dallas, TX", "title": "280G", "lat_a": 34.05, "lon_a": -118.25, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "slkut", "id_z": "dvmco", "name": "Salt Lake City, UT to Denver, CO", "title": "200G", "lat_a": 40.75, "lon_a": -111.88, "lat_z": 39.7391, "lon_z": -104.98}, + {"id_a": "dvmco", "id_z": "dlstx", "name": "Denver, CO to Dallas, TX", "title": "200G", "lat_a": 39.7391, "lon_a": -104.98, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "kc9mo", "id_z": "sl9mo", "name": "Kansas City, MO to St Louis, MO", "title": "280G", "lat_a": 39.0997, "lon_a": -94.578, "lat_z": 38.6272, "lon_z": -90.197}, + {"id_a": "kc9mo", "id_z": "dlstx", "name": "Kansas City, MO to Dallas, TX", "title": "280G", "lat_a": 39.0997, "lon_a": -94.578, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "cgcil", "id_z": "wswdc", "name": "Chicago, IL to Washington, DC", "title": "200G", "lat_a": 41.8819, "lon_a": -87.627, "lat_z": 38.8951, "lon_z": -77.036}, + {"id_a": "cgcil", "id_z": "sl9mo", "name": "Chicago, IL to St Louis, MO", "title": "370G", "lat_a": 41.8819, "lon_a": -87.627, "lat_z": 38.6272, "lon_z": -90.197}, + {"id_a": "n54ny", "id_z": "cb1ma", "name": "New York, NY to Cambridge, MA", "title": "80G", "lat_a": 40.7127, "lon_a": -74.005, "lat_z": 42.3736, "lon_z": -71.11}, + {"id_a": "st6wa", "id_z": "dvmco", "name": "Seattle, WA to Denver, CO", "title": "40G", "lat_a": 47.6097, "lon_a": -122.33, "lat_z": 39.7391, "lon_z": -104.98}, + {"id_a": "la2ca", "id_z": "phmaz", "name": "Los Angeles, CA to Phoenix, AZ", "title": "260G", "lat_a": 34.05, "lon_a": -118.25, "lat_z": 33.45, "lon_z": -112.06}, + {"id_a": "phmaz", "id_z": "santx", "name": "Phoenix, AZ to San Antonio, TX", "title": "160G", "lat_a": 33.45, "lon_a": -112.06, "lat_z": 29.4166, "lon_z": -98.5}, + {"id_a": "sl9mo", "id_z": "dlstx", "name": "St Louis, MO to Dallas, TX", "title": "200G", "lat_a": 38.6272, "lon_a": -90.197, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "dlstx", "id_z": "nsvtn", "name": "Dallas, TX to Nashville, TN", "title": "160G", "lat_a": 32.7758, "lon_a": -96.796, "lat_z": 36.1666, "lon_z": -86.783}, + {"id_a": "wswdc", "id_z": "attga", "name": "Washington, DC to Atlanta, GA", "title": "380G", "lat_a": 38.8951, "lon_a": -77.036, "lat_z": 33.755, "lon_z": -84.39}, + {"id_a": "st6wa", "id_z": "cgcil", "name": "Seattle, WA to Chicago, IL", "title": "70G", "lat_a": 47.6097, "lon_a": -122.33, "lat_z": 41.8819, "lon_z": -87.627}, + {"id_a": "dvmco", "id_z": "kc9mo", "name": "Denver, CO to Kansas City, MO", "title": "100G", "lat_a": 39.7391, "lon_a": -104.98, "lat_z": 39.0997, "lon_z": -94.578}, + {"id_a": "phmaz", "id_z": "dlstx", "name": "Phoenix, AZ to Dallas, TX", "title": "210G", "lat_a": 33.45, "lon_a": -112.06, "lat_z": 32.7758, "lon_z": -96.796}, + {"id_a": "cgcil", "id_z": "n54ny", "name": "Chicago, IL to New York, NY", "title": "280G", "lat_a": 41.8819, "lon_a": -87.627, "lat_z": 40.7127, "lon_z": -74.005}, + {"id_a": "sl9mo", "id_z": "nsvtn", "name": "St Louis, MO to Nashville, TN", "title": "170G", "lat_a": 38.6272, "lon_a": -90.197, "lat_z": 36.1666, "lon_z": -86.783}, + {"id_a": "dlstx", "id_z": "attga", "name": "Dallas, TX to Atlanta, GA", "title": "240G", "lat_a": 32.7758, "lon_a": -96.796, "lat_z": 33.755, "lon_z": -84.39}, + {"id_a": "hs1tx", "id_z": "nwrla", "name": "Houston, TX to New Orleans, LA", "title": "170G", "lat_a": 29.7627, "lon_a": -95.383, "lat_z": 29.9647, "lon_z": -90.07}, + {"id_a": "ormfl", "id_z": "attga", "name": "Orlando, FL to Atlanta, GA", "title": "210G", "lat_a": 28.4158, "lon_a": -81.298, "lat_z": 33.755, "lon_z": -84.39}, + {"id_a": "nsvtn", "id_z": "attga", "name": "Nashville, TN to Atlanta, GA", "title": "240G", "lat_a": 36.1666, "lon_a": -86.783, "lat_z": 33.755, "lon_z": -84.39}, + {"id_a": "wswdc", "id_z": "rlgnc", "name": "Washington, DC to Raleigh, NC", "title": "200G", "lat_a": 38.8951, "lon_a": -77.036, "lat_z": 35.8188, "lon_z": -78.644} + ]; + </script> + + +</head> +<body> + <div id="map"></div> + <button id="forwardButton" onclick="stepForward();">Step Forward</button> + <button id="playPause" onclick="playPause();">Play</button> + <div> + <table att-table table-data="tableData" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage"> + <thead att-table-row type="header"> + <tr> + <th att-table-header key="id">Site</th> + <th att-table-header key="lastName">Usage</th> + </tr> + </thead> + <tbody att-table-row type="body" id="topTenSites"> + </tbody> + </table> + <table att-table table-data="tableData" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage"> + <thead att-table-row type="header"> + <tr> + <th att-table-header key="id">Link</th> + <th att-table-header key="lastName">Usage</th> + </tr> + </thead> + <tbody att-table-row type="body" id="topTenLinks"> + </tbody> + </table> + </div> + + <script> + var map = L.map('map').setView([40, -96], 4); + L.tileLayer('', {maxZoom:18}).addTo(map); //TODO configure + + var dataLayer = addDataLayers(map, null); + + function addDataLayers(map, dataLayer) { + if (dataLayer!=null) { + map.removeLayer(dataLayer); + } + + dataLayer = L.layerGroup(); + + var siteInfo = []; + + var pipeLayer = L.layerGroup(); + for (var i=0; i<pipeData.length; i++) { + var pipe = pipeData[i]; + + var usage = pipe.usage; + if (!usage || Math.random()<0.05) { + //console.log("Rerolling " + pipe.name); + usage = Math.floor(Math.random()*33 + Math.random()*33 + Math.random()*34); + } else { + //console.log("Adjusting " + pipe.name); + usage = Math.floor(usage + Math.random()*15 - Math.random()*15); + } + if (usage<0) usage = 0; + while (usage>100) usage -= Math.floor(20*Math.random()); + if (usage>90) usage -= Math.floor(20*Math.random()); + + pipe.usage = usage; + + var color = "black"; + if (usage>60) color = "yellow"; + if (usage>70) color = "orange"; + if (usage>80) color = "red"; + pipeLayer.addLayer(L.polyline([[pipe.lat_a, pipe.lon_a], [pipe.lat_z, pipe.lon_z]], {"color": color, "title": pipe.name}).bindPopup(pipe.name + "<br/>" + pipe.title + "<br/>" + usage + "% usage")); + + var siteA = siteInfo[pipe.id_a]; + if (siteA) { + siteA.usage += usage; + siteA.maxUsage += 100; + //console.log("Site a id = " + pipe.id_a + ", object existed = " + siteA + ", usage = " + siteA.usage + ", max = " + siteA.maxUsage); + } else { + siteA = {}; + siteA.usage = usage; + siteA.maxUsage = 100; + siteInfo[pipe.id_a] = siteA; + //console.log("Site a id = " + pipe.id_a + ", object is new = " + siteA + ", usage = " + siteA.usage + ", max = " + siteA.maxUsage); + } + + var siteZ = siteInfo[pipe.id_z]; + if (siteZ) { + siteZ.usage += usage; + siteZ.maxUsage += 100; + //console.log("Site z id = " + pipe.id_z + ", object existed = " + siteZ + ", usage = " + siteZ.usage + ", max = " + siteZ.maxUsage); + } else { + siteZ = {}; + siteZ.usage = usage; + siteZ.maxUsage = 100; + siteInfo[pipe.id_z] = siteZ; + //console.log("Site z id = " + pipe.id_z + ", object is new = " + siteZ + ", usage = " + siteZ.usage + ", max = " + siteZ.maxUsage); + } + } + dataLayer.addLayer(pipeLayer); + + var dataCenterLayer = L.layerGroup(); + for (var i=0; i<siteData.length; i++) { + var site = siteData[i]; +// {"id": "slkut", "name": "Salt Lake City, UT", "title": "250G", "lat": 40.75, "lon": -111.88}, + var info = siteInfo[site.id]; + var color = "black"; + if (info.usage/info.maxUsage>.6) color = "yellow"; + if (info.usage/info.maxUsage>.7) color = "orange"; + if (info.usage/info.maxUsage>.8) color = "red"; + var pct = Math.floor(100*info.usage/info.maxUsage); + site.usage = pct; +// dataCenterLayer.addLayer(L.marker([site.lat, site.lon], {"title": site.name}).bindPopup(site.name + "<br/>" + pipe.title + "<br/>" + info.usage + "/" + info.maxUsage)); + dataCenterLayer.addLayer(L.circleMarker([site.lat, site.lon], {"color": color, "title": site.name, "fillOpacity": .5}).bindPopup(site.name + "<br/>" + pipe.title + "<br/>" + pct + "%")); + } + dataLayer.addLayer(dataCenterLayer); + + dataLayer.addTo(map); + + siteData.sort(function(a,b){return b.usage-a.usage}); + var topTenHtml = ""; + for (var i=0; i<10; i++) { + topTenHtml = topTenHtml + "<tr><td att-table-body>" + siteData[i].name + "</td><td att-table-body>" + siteData[i].usage + "%</td></tr>"; + } + document.getElementById("topTenSites").innerHTML = topTenHtml; + + pipeData.sort(function(a,b){return b.usage-a.usage}); + topTenHtml = ""; + for (var i=0; i<10; i++) { + topTenHtml = topTenHtml + "<tr><td att-table-body>" + pipeData[i].name + "</td><td att-table-body>" + pipeData[i].usage + "%</td></tr>"; + } + document.getElementById("topTenLinks").innerHTML = topTenHtml; + + return dataLayer; + } + + function stepForward() { + dataLayer = addDataLayers(map, dataLayer); + } + + var intervalObj = null; + function playPause() { + if (intervalObj==null) { + document.getElementById('playPause').innerHTML = "Pause"; + document.getElementById('forwardButton').disabled = true; + intervalObj = window.setInterval(function(){dataLayer = addDataLayers(map, dataLayer);},1500); + } else { + document.getElementById('playPause').innerHTML = "Play"; + document.getElementById('forwardButton').disabled = false; + clearInterval(intervalObj); + intervalObj = null; + } + } + + function onMapClick(e) { + //alert("You clicked the map at " + e.latlng); + dataLayer = addDataLayers(map, dataLayer); + } + + map.on('click', onMapClick); + </script> + +</body> +</html> diff --git a/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/login_external.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/login_external.jsp new file mode 100644 index 000000000..b4e3c0932 --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/login_external.jsp @@ -0,0 +1,154 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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" %> +<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> + + <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="app/fusion/external/ebz/fn-ebz.css" > + <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= "app/fusion/external/ebz/angular_js/angular.js"></script> + <script src="app/fusion/external/ebz/angular_js/angular-route.min.js"></script> + <script src= "app/fusion/external/ebz/angular_js/angular-sanitize.js"></script> + <script src= "app/fusion/external/ebz/angular_js/angular-cookies.js"></script> + <script src= "app/fusion/external/ebz/sandbox/att-abs-tpls.js" type="text/javascript"></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= "app/fusion/external/ebz/angular_js/checklist-model.js"></script> + <script src= "app/fusion/external/ebz/angular_js/app.js"></script> + <script src= "app/fusion/external/ebz/angular_js/gestures.js"></script> + <script src="static/js/modalService.js"></script> + <script src="app/fusion/external/angular-ui/ui-bootstrap-tpls-1.1.2.min.js"></script> + + <style> + .terms { + font-family: Verdana,Arial,Helvetica, sans-serif; + font-size: 9px; + } + + </style> + </head> + <body style="padding-top: 15px;"> + <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_trans.png"/> + <h2> ECOMP Portal </h2> + <label> + <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 > 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 /> + + <input id="loginBtn" type="image" ng-click="loginExternal();" src="static/fusion/images/login_button.gif" alt="Login" /> + <br> + </div> + </div> + <br/><br/><br/><br/><br/><br/><br/> + <div id="footer"> + </div> + </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.loginExternal = function() { + + $.ajax({ + url: "login_external/login?"+"loginId="+$scope.loginId+"&password="+$scope.password, + type : "POST", + success:function (response){ + if(response=="success"){ + window.location.href = 'welcome.htm'; + }else{ + $("#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-sdk-app/src/main/webapp/WEB-INF/jsp/net_map.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/net_map.jsp new file mode 100644 index 000000000..2a341467f --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/net_map.jsp @@ -0,0 +1,38 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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. + ================================================================================ + --%> +<!DOCTYPE html> +<html> +<head> + <link rel="import" href="app/fusion/elementmap/element-map-import.html"> +</head> + +<body> + + +<div data-ng-app="elementMapModule"> + <element-map contentfilename='NetworkMap_topology_composition' layoutfilename='network_map_layout' callflowfilename='call_flow_sip_digest' callflowstep='Step_1'></element-map> +</div> + +<input type="hidden" name="inner_width" value="1500px"> +<input type="hidden" name="inner_height" value="800px"> + +</body> + +</html> diff --git a/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/user_profile.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/user_profile.jsp new file mode 100644 index 000000000..cb5c4e3bf --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/user_profile.jsp @@ -0,0 +1,84 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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. + ================================================================================ + --%> +<%@ include file="/WEB-INF/fusion/jsp/popup_modal.html" %> +<div ng-controller="userProfileSampleController"> + <div> + <h1 class="heading1" style="margin-top:20px;">Profile Search</h1> + <div style="margin-top:30px"> + <table att-table table-data="tableData" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage"> + + <thead att-table-row type="header"> + <tr> + <th att-table-header key="id">User ID</th> + <th att-table-header key="last_name">Last Name</th> + <th att-table-header key="first_name">First Name</th> + <th att-table-header key="email">Email</th> + <th att-table-header key="org_user_id">OrgUserId</th> + <th att-table-header key="org_manager_userid">Manager OrgUserId</th> + </tr> + </thead> + <tbody att-table-row type="body" row-repeat="rowData in tableData"> + <tr> + <td att-table-body >{{rowData.id}}</td> + <td att-table-body >{{rowData.last_name}}</td> + <td att-table-body >{{rowData.first_name}}</td> + <td att-table-body >{{rowData.email}}</td> + <td att-table-body >{{rowData.orgUserId}}</td> + <td att-table-body >{{rowData.org_manager_userid}}</td> + </tr> + </tbody> + </table> + </div> + </div> + <div class="fn-ebz-container"> + Rows Per Page: + <input class="fn-ebz-text" type="text" ng-model="viewPerPage" size="5" style="width: 47px;"> + </div> + <div class="fn-ebz-container"> + Current Page: + <input class="fn-ebz-text" type="text" ng-model="currentPage" size="5" style="width: 47px;"> + </div> + <div class="fn-ebz-container"> + Total Page(s): + <input class="fn-ebz-text" type="text" ng-model="totalPage" size="5" readonly="true" style="width: 47px;"> + </div> +</div> + +<script> +app.controller("userProfileSampleController", function ($scope,$http,modalService, $modal) { + // Table Data + $scope.tableData=${model.customerInfo}; + console.log($scope.tableData); + $scope.viewPerPage = 20; + $scope.scrollViewsPerPage = 2; + $scope.currentPage = 1; + $scope.totalPage; + $scope.searchCategory = ""; + $scope.searchString = ""; + // modalService.showSuccess('','Modal Sample') ; + for(x in $scope.tableData){ + if($scope.tableData[x].active_yn=='Y') + $scope.tableData[x].active_yn=true; + else + $scope.tableData[x].active_yn=false; + } + +}); +</script> diff --git a/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/welcome.jsp b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/welcome.jsp new file mode 100644 index 000000000..d7d3b8967 --- /dev/null +++ b/ecomp-sdk-app/src/main/webapp/WEB-INF/jsp/welcome.jsp @@ -0,0 +1,629 @@ +<%-- + ================================================================================ + eCOMP Portal SDK + ================================================================================ + 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/scribble.css" /> + +<link rel="stylesheet" type="text/css" href="static/fusion/sample/css/welcome.css" /> + +<script src="static/js/jquery-1.10.2.js"></script> +<script src="app/fusion/external/angular-ui/ui-bootstrap-tpls-1.1.2.min.js"></script> + +<!-- <script src="static/fusion/js/jquery.resize.js"></script> --> +<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/fusion/js/att_angular_gridster/ui-gridster-tpls.js"></script> +<script src="static/fusion/js/att_angular_gridster/angular-gridster.js"></script> +<script src="app/fusion/external/ebz/sandbox/att-abs-tpls.js" type="text/javascript"></script> + +<!--for line Chart and Area Chart--> +<script src="static/fusion/d3/js/d3.v3.min.js"></script> +<script src="static/fusion/d3/js/nv.d3.min.js"></script> +<script src="static/fusion/d3/js/models/axis.min.js"></script> + +<!-- Style for line Chart and area chart --> +<link rel="stylesheet" type="text/css" href="static/fusion/d3/css/nv.d3.css"> + + +<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/scribble.js"></script> <!-- Scribble --> + +<!-- Data for Line and Area Charts --> +<script> +historicalBarChart=[{"type":"line","key":"AP_CPU","yAxis":"1","values":[{"x":1388552400000,"y":2.13},{"x":1388552400000,"y":5.0},{"x":1388552400000,"y":2.36},{"x":1388552400000,"y":10.0},{"x":1391230800000,"y":3.15},{"x":1391230800000,"y":2.88},{"x":1391230800000,"y":3.0},{"x":1391230800000,"y":4.0},{"x":1393650000000,"y":8.0},{"x":1393650000000,"y":3.93},{"x":1393650000000,"y":4.27},{"x":1393650000000,"y":4.0},{"x":1396324800000,"y":4.25},{"x":1396324800000,"y":5.35},{"x":1396324800000,"y":5.92},{"x":1396324800000,"y":12.0},{"x":1398916800000,"y":5.55},{"x":1398916800000,"y":4.89},{"x":1398916800000,"y":5.01},{"x":1398916800000,"y":3.27},{"x":1401595200000,"y":6.27},{"x":1401595200000,"y":9.17},{"x":1401595200000,"y":9.31},{"x":1401595200000,"y":6.07},{"x":1404187200000,"y":8.37},{"x":1404187200000,"y":8.11},{"x":1404187200000,"y":8.84},{"x":1404187200000,"y":8.93},{"x":1406865600000,"y":11.79},{"x":1406865600000,"y":12.22},{"x":1406865600000,"y":12.6},{"x":1406865600000,"y":11.61},{"x":1409544000000,"y":15.27},{"x":1409544000000,"y":19.09},{"x":1409544000000,"y":16.09},{"x":1409544000000,"y":18.66},{"x":1412136000000,"y":18.4},{"x":1412136000000,"y":22.05},{"x":1412136000000,"y":21.66},{"x":1412136000000,"y":19.04},{"x":1414814400000,"y":19.13},{"x":1414814400000,"y":19.61},{"x":1414814400000,"y":17.61},{"x":1414814400000,"y":17.5},{"x":1417410000000,"y":19.0},{"x":1417410000000,"y":15.73},{"x":1420088400000,"y":9.67},{"x":1420088400000,"y":15.19},{"x":1420088400000,"y":15.02},{"x":1420088400000,"y":9.62333333333333},{"x":1422766800000,"y":16.95},{"x":1422766800000,"y":14.29},{"x":1425186000000,"y":12.9},{"x":1425186000000,"y":16.1166666666667}]},{"type":"line","key":"ROUTER_CPU","yAxis":"1","values":[{"x":1388552400000,"y":3.0},{"x":1388552400000,"y":4.0},{"x":1388552400000,"y":4.89},{"x":1388552400000,"y":7.0},{"x":1391230800000,"y":4.57},{"x":1391230800000,"y":4.0},{"x":1391230800000,"y":4.0},{"x":1391230800000,"y":7.0},{"x":1393650000000,"y":7.0},{"x":1393650000000,"y":4.18},{"x":1393650000000,"y":5.0},{"x":1393650000000,"y":5.0},{"x":1396324800000,"y":5.0},{"x":1396324800000,"y":5.0},{"x":1396324800000,"y":5.06},{"x":1396324800000,"y":6.0},{"x":1398916800000,"y":5.0},{"x":1398916800000,"y":5.0},{"x":1398916800000,"y":5.0},{"x":1398916800000,"y":5.0},{"x":1401595200000,"y":6.0},{"x":1401595200000,"y":6.09},{"x":1401595200000,"y":6.0},{"x":1401595200000,"y":6.0},{"x":1404187200000,"y":6.36},{"x":1404187200000,"y":7.0},{"x":1404187200000,"y":7.0},{"x":1404187200000,"y":7.0},{"x":1406865600000,"y":7.0},{"x":1406865600000,"y":7.02},{"x":1406865600000,"y":7.24},{"x":1406865600000,"y":7.0},{"x":1409544000000,"y":8.23},{"x":1409544000000,"y":8.11},{"x":1409544000000,"y":8.12},{"x":1409544000000,"y":8.03},{"x":1412136000000,"y":9.0},{"x":1412136000000,"y":8.93},{"x":1412136000000,"y":8.57},{"x":1412136000000,"y":9.0},{"x":1414814400000,"y":5.97},{"x":1414814400000,"y":6.0},{"x":1414814400000,"y":9.0},{"x":1414814400000,"y":9.0},{"x":1417410000000,"y":9.0},{"x":1417410000000,"y":8.78},{"x":1420088400000,"y":3.0},{"x":1420088400000,"y":2.01},{"x":1420088400000,"y":3.0},{"x":1420088400000,"y":3.01},{"x":1422766800000,"y":2.67},{"x":1422766800000,"y":2.0},{"x":1425186000000,"y":2.8},{"x":1425186000000,"y":3.63333333333333}]},{"type":"line","key":"SCTP_CPU","yAxis":"1","values":[{"x":1388552400000,"y":7.0},{"x":1388552400000,"y":10.0},{"x":1388552400000,"y":8.27},{"x":1388552400000,"y":8.0},{"x":1391230800000,"y":10.02},{"x":1391230800000,"y":8.04},{"x":1391230800000,"y":9.0},{"x":1391230800000,"y":10.0},{"x":1393650000000,"y":12.0},{"x":1393650000000,"y":10.04},{"x":1393650000000,"y":11.16},{"x":1393650000000,"y":10.0},{"x":1396324800000,"y":10.7},{"x":1396324800000,"y":13.31},{"x":1396324800000,"y":12.73},{"x":1396324800000,"y":9.0},{"x":1398916800000,"y":12.41},{"x":1398916800000,"y":11.95},{"x":1398916800000,"y":12.82},{"x":1398916800000,"y":9.58},{"x":1401595200000,"y":11.28},{"x":1401595200000,"y":14.01},{"x":1401595200000,"y":14.63},{"x":1401595200000,"y":11.83},{"x":1404187200000,"y":14.06},{"x":1404187200000,"y":13.96},{"x":1404187200000,"y":14.66},{"x":1404187200000,"y":14.36},{"x":1406865600000,"y":16.6},{"x":1406865600000,"y":16.95},{"x":1406865600000,"y":17.11},{"x":1406865600000,"y":15.94},{"x":1409544000000,"y":19.86},{"x":1409544000000,"y":22.97},{"x":1409544000000,"y":21.56},{"x":1409544000000,"y":24.55},{"x":1412136000000,"y":22.66},{"x":1412136000000,"y":26.79},{"x":1412136000000,"y":26.54},{"x":1412136000000,"y":25.35},{"x":1414814400000,"y":21.0},{"x":1414814400000,"y":20.35},{"x":1414814400000,"y":21.93},{"x":1414814400000,"y":23.63},{"x":1417410000000,"y":24.0},{"x":1417410000000,"y":21.43},{"x":1420088400000,"y":12.63},{"x":1420088400000,"y":25.14},{"x":1420088400000,"y":21.85},{"x":1420088400000,"y":12.5766666666667},{"x":1422766800000,"y":26.3},{"x":1422766800000,"y":24.4},{"x":1425186000000,"y":23.3833333333333},{"x":1425186000000,"y":24.5833333333333}]},{"type":"line","key":"DP_CPU","yAxis":"1","values":[{"x":1388552400000,"y":2.0},{"x":1388552400000,"y":5.0},{"x":1388552400000,"y":2.17},{"x":1388552400000,"y":2.0},{"x":1391230800000,"y":3.01},{"x":1391230800000,"y":2.56},{"x":1391230800000,"y":3.0},{"x":1391230800000,"y":9.0},{"x":1393650000000,"y":10.0},{"x":1393650000000,"y":3.64},{"x":1393650000000,"y":4.06},{"x":1393650000000,"y":4.0},{"x":1396324800000,"y":4.04},{"x":1396324800000,"y":5.11},{"x":1396324800000,"y":5.9},{"x":1396324800000,"y":8.0},{"x":1398916800000,"y":5.08},{"x":1398916800000,"y":4.65},{"x":1398916800000,"y":4.74},{"x":1398916800000,"y":2.98},{"x":1401595200000,"y":6.13},{"x":1401595200000,"y":8.98},{"x":1401595200000,"y":9.22},{"x":1401595200000,"y":5.84},{"x":1404187200000,"y":8.12},{"x":1404187200000,"y":7.89},{"x":1404187200000,"y":8.41},{"x":1404187200000,"y":8.47},{"x":1406865600000,"y":11.06},{"x":1406865600000,"y":11.84},{"x":1406865600000,"y":11.92},{"x":1406865600000,"y":10.8},{"x":1409544000000,"y":14.58},{"x":1409544000000,"y":18.39},{"x":1409544000000,"y":15.5},{"x":1409544000000,"y":18.33},{"x":1412136000000,"y":18.01},{"x":1412136000000,"y":21.3},{"x":1412136000000,"y":21.11},{"x":1412136000000,"y":18.37},{"x":1414814400000,"y":18.59},{"x":1414814400000,"y":18.81},{"x":1414814400000,"y":17.13},{"x":1414814400000,"y":16.92},{"x":1417410000000,"y":18.0},{"x":1417410000000,"y":15.18},{"x":1420088400000,"y":9.16},{"x":1420088400000,"y":12.13},{"x":1420088400000,"y":11.76},{"x":1420088400000,"y":9.31},{"x":1422766800000,"y":13.47},{"x":1422766800000,"y":13.41},{"x":1425186000000,"y":12.2333333333333},{"x":1425186000000,"y":12.4}]}]; +</script> + + <script> + $(function(){ + + + /* area chart and line chart titles */ + d3.select("#areaChart svg").append("text").attr("x", 200).attr("y", 15) + .attr("text-anchor", "middle").style("font-size", "16px").text( + "Data Usage in NJ Locations"); + + d3.select("#lineChart svg").append("text").attr("x", 200).attr("y", 15) + .attr("text-anchor", "middle").style("font-size", "16px").text( + "Data Usage in NJ Locations"); + }); +</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> + (Last Login: <fmt:formatDate value="${sessionScope.user.lastLoginDate}" type="date" pattern="dd MMM yyyy hh:mma zzz" var="lastLogin" /> ${lastLogin}) + </div> + + <div id="gridDiv" class="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="ion-chevron-up" style="color:gray" ng-show="item.max"></i> + <i class="ion-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> 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"> + <div id="areaChart"> + <div> <svg></svg> </div> + <script src="static/fusion/sample/html/js/area_chart.min.js"></script> + </div> + <!-- <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"> + <div id="lineChart"> + <div> <svg></svg> </div> + <script src="static/fusion/sample/html/js/line_chart.min.js"></script> + </div> + +<!-- <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"> + <div id = "selectedTrafficDay"> + <ul> + <li ng-repeat="Daytab in selectedTrafficDay" + ng-class="{active1:isActiveTab1(Daytab.url)}" + ng-click="onClickTab1(Daytab)">{{Daytab.title}}</li> + </ul> + <div id = "SelectedTrafficeDayView"> + <div ng-include="currentSelectedDayTab"></div> + </div> + <script type="text/ng-template" id="#Monday"> + <div id="Monday" align="centers"><img src="static/fusion/sample/images/tunnels/1_mon.png" width=100% height=100% alt="Monday"></div> + </script> + <script type="text/ng-template" id="#Tuesday"> + <div id="Tuesday" align="center"><img src="static/fusion/sample/images/tunnels/2_tue.png" width=100% height=100% alt="Tuesday"></div> + </script> + <script type="text/ng-template" id="#Wednesday"> + <div id="Wednesday" align="center"><img src="static/fusion/sample/images/tunnels/3_wed.png" width=100% height=100% alt="Wednesday"></div> + </script> + <script type="text/ng-template" id="#Thursday"> + <div id="Thursday" align="center"><img src="static/fusion/sample/images/tunnels/4_thu.png" width=100% height=100% alt="Thursday"></div> + </script> + <script type="text/ng-template" id="#Friday"> + <div id="Friday" align="center"><img src="static/fusion/sample/images/tunnels/5_fri.png" width=100% height=100% alt="Friday"></div> + </script> + <script type="text/ng-template" id="#Saturday"> + <div id="Saturday" align="center"><img src="static/fusion/sample/images/tunnels/6_sat.png" width=100% height=100% alt="Saturday"></div> + </script> + <script type="text/ng-template" id="#Sunday"> + <div id="Sunday" align="center"><img src="static/fusion/sample/images/tunnels/7_sun.png" width=100% height=100% alt="Sunday"></div> + </script> + </div> + </div> + + <div align="left" ng-if="item.headerText=='Busy hour traffic analysis by day of week' && item.max"> + <div id = "BusyHourTraffic"> + <ul> + <li ng-repeat="TrafficTab in BusyHourTraffic" + ng-class="{active2:isActiveTab2(TrafficTab.url)}" + ng-click="onClickTab2(TrafficTab)">{{TrafficTab.title}}</li> + </ul> + <div id = "BusyHourTrafficView"> + <div ng-include="currentSelectedBusyHourTraffic"></div> + </div> + <script type="text/ng-template" id="#Incoming"> + <div id="Incoming" align="left"><img src="static/fusion/sample/images/tunnels/BH_DLSTX_IN.png" width=100% height=100%></div> + </script> + <script type="text/ng-template" id="#Outgoing"> + <div id="Outgoing" align="center"><img src="static/fusion/sample/images/tunnels/BH_DLSTX_OUT.png" width=100% height=100%></div> + </script> + <script type="text/ng-template" id="#Default"> + <div id="Default" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat_Def.png" width=100% height=100%></div> + </script> + <script type="text/ng-template" id="#Priority"> + <div id="Priority" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat_Priority.png" width=100% height=100%></div> + </script> + <script type="text/ng-template" id="#BHNational"> + <div id="BHNational" align="center"><img src="static/fusion/sample/images/tunnels/BH_Nat.png" width=100% height=100%></div> + </script> + </div> + </div> + + <div align="left" ng-if="item.headerText=='Additional Samples' && item.max"> + <label> Quick Links</label> + <table att-table > + + + <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="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="leafletMap.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="collaborate_list.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 style="overflow:auto" 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 style="overflow:auto" 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> + </div> + </div> + </div> <!-- End gridDiv --> + +</div> + +<script> + $(document).ready(function() { + $("#rightIcon").hide(); + $("#leftIcon").show(); + }); + + 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 : false + }, + { + 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 : false + }, + { + 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.selectedTrafficDay = [{ + title : 'Mon', + url : '#Monday' + }, { + title : 'Tue', + url : '#Tuesday' + }, { + title : 'Wed', + url : '#Wednesday' + }, { + title : 'Thu', + url : '#Thursday' + }, { + title : 'Fri', + url : '#Friday' + }, { + title : 'Sat', + url : '#Saturday' + }, { + title : 'Sun', + url : '#Sunday' + }]; + + $scope.currentSelectedDayTab = '#Monday'; + + $scope.onClickTab1 = function (Daytab) { + $scope.currentSelectedDayTab = Daytab.url; + } + + $scope.isActiveTab1 = function(tabUrl) { + return tabUrl == $scope.currentSelectedDayTab; + } + + + $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.BusyHourTraffic = [ { + title : 'BH SNRC DLSTX - Incoming', + url : '#Incoming' + }, { + title : 'BH SNRC DLSTX - Outgoing', + url : '#Outgoing' + }, { + title : 'BH National - Default', + url : '#Default' + }, { + title : 'BH National - Priority', + url : '#Priority' + }, { + title : 'BH National', + url : '#BHNational' + } + + ]; + + $scope.currentSelectedBusyHourTraffic = '#Incoming'; + + $scope.onClickTab2 = function (TrafficTab) { + $scope.currentSelectedBusyHourTraffic = TrafficTab.url; + } + + $scope.isActiveTab2 = function(tabUrl) { + return tabUrl == $scope.currentSelectedBusyHourTraffic; + } + + + $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> |