diff options
author | 2017-05-04 07:48:42 -0400 | |
---|---|---|
committer | 2017-05-04 12:28:17 -0400 | |
commit | b54df0ddd0c6a0372327c5aa3668e5a6458fcd64 (patch) | |
tree | e69cfa9b314a801bd187cf0145d1d4306436229c /ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp | |
parent | 39d1e62c84041831bfc52cca73b5ed5efaf57d27 (diff) |
[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>
Diffstat (limited to 'ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp')
-rw-r--r-- | ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp | 529 |
1 files changed, 0 insertions, 529 deletions
diff --git a/ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp b/ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp deleted file mode 100644 index b0480d45..00000000 --- a/ecomp-portal-BE/war/WEB-INF/fusion/jsp/webrtc/collaboration.jsp +++ /dev/null @@ -1,529 +0,0 @@ -<%-- - ================================================================================ - 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. - ================================================================================ - --%> -<!DOCTYPE html> - -<html xmlns="http://www.w3.org/1999/xhtml"> -<head> - <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> - <link type="text/css" rel="stylesheet" href="static/fusion/css/layout/layout-default-latest.css" /> - <link rel="stylesheet" type="text/css" href="static/ebz/sandbox/styles/btn.css" > - <link rel="stylesheet" type="text/css" href="static/ebz/fn-ebz.css" > - <style type="text/css"> - /* - * NOTE: All CSS is purely cosmetic - it does not affect functionality - * http://layout.jquery-dev.com/demos.cfm - */ - - /* customize borders to avoid double-borders around inner-layouts */ - .ui-layout-pane { - border: 0; /* override layout-default-latest.css */ - border-top: 1px solid #BBB; - border-bottom: 1px solid #BBB; - } - .ui-layout-pane-north , - .ui-layout-pane-south { - border: 1px solid #BBB; - overflow: auto; - } - .ui-layout-pane-west , - .ui-layout-pane-east { - } - .ui-layout-pane-center { - border-left: 0; - border-right: 0; - } - .inner-center { - border: 1px solid #BBB; - } - - /* add shading to outer sidebar-panes */ - .outer-west , - .outer-east { - background-color: #EEE; - } - .middle-west , - .middle-east { - background-color: #F8F8F8; - } - - /* remove padding & scrolling from panes that are 'containers' for nested layouts */ - .outer-center , - .middle-center { - border: 0; /* cosmetic */ - padding: 0; - overflow: auto; - } - - /* - * customize borders on panes/resizers to make pretty - */ - .ui-layout-pane-west { border-right: 0; } - .ui-layout-resizer-west { border-left: 1px solid #BBB; } - .ui-layout-pane-east { border-left: 0; } - .ui-layout-resizer-east { border-right: 1px solid #BBB; } - .ui-layout-pane-north { border-bottom: 0; } - .ui-layout-resizer-north { border-top: 1px solid #BBB; } - .ui-layout-pane-south { border-top: 0; } - .ui-layout-resizer-south { border-bottom: 1px solid #BBB; } - /* - * add borders to resizers when pane is 'closed' - * - *.ui-layout-resizer-closed { border: 1px solid #BBB; } - */ - /* - * show both borders when the resizer is 'dragging' - */ - .ui-layout-resizer-west-dragging , - .ui-layout-resizer-east-dragging { - border-left: 1px solid #BBB; - border-right: 1px solid #BBB; - } - .ui-layout-resizer-north-dragging , - .ui-layout-resizer-south-dragging { - border-top: 1px solid #BBB; - border-bottom: 1px solid #BBB; - } - - - /* - layout toggler background image - */ - .ui-layout-toggler-west, .ui-layout-toggler-east { - border-width: 1px 0; - background-image: url("static/fusion/images/layout/panel-e-w-toggle.png"); - background-size: 10px 10px; - background-repeat: no-repeat; - background-position: center; - } - - .ui-layout-toggler-north, .ui-layout-toggler-south { - border-width: 0 1px; - background-image: url("static/fusion/images/layout/panel-n-s-toggle.png"); - background-size: 10px 10px; - background-repeat: no-repeat; - background-position: center; - } - - </style> - - - <!-- LAYOUT v 1.3.0 --> - <script type="text/javascript" src="static/fusion/js/layout/jquery-latest.js"></script> - <script type="text/javascript" src="static/fusion/js/layout/jquery-ui-latest.js"></script> - <script type="text/javascript" src="static/fusion/js/layout/jquery.layout-latest.js"></script> - <script type="text/javascript" src="static/fusion/webrtc/js/RTCMultiConnection.js"></script> - <script type="text/javascript" src="static/fusion/webrtc/js/peerBroadcast.js"></script> - <script type="text/javascript" src="static/fusion/js/layout/debug.js"></script> - - <script type="text/javascript"> - - - $(document).ready(function () { - - // OUTER-LAYOUT - panelLayout = $('body').layout({ - center__paneSelector: ".outer-center" - , west__paneSelector: ".outer-west" - , east__paneSelector: ".outer-east" - , west__size: 500 - , east__size: 200 - , spacing_open: 8 // ALL panes - , spacing_closed: 12 // ALL panes - - , center__childOptions: { - center__paneSelector: ".inner-center" - , west__paneSelector: ".inner-west" - , east__paneSelector: ".inner-east" - , west__size: 75 - , east__size: 75 - , spacing_open: 8 // ALL panes - , spacing_closed: 8 // ALL panes - , west__spacing_closed: 12 - , east__spacing_closed: 12 - } - - - - - }); - - - function initializeConnections() { - - var channelId = null; var audioVideo = true; var data = true; - channelId = location.href.replace(/\/|:|#|%|\.|\[|\]/g, ''); - var videoChannelId = channelId.concat("video"); - var screenChannelId = channelId.concat("screen"); - - videoConnection = new RTCMultiConnection(videoChannelId); - screenConnection = new RTCMultiConnection(screenChannelId); - - - if( window.location.protocol == 'http:' && DetectRTC.browser.isChrome ) { - audioVideo = false; - console.log("Video Chat is not supported over unsecured connection for Chrome; Use Firefox") - } - configConnection(videoConnection,audioVideo,audioVideo,false,true,false); - configConnection(screenConnection,false,false,true,false,true); - - }; - - function configConnection(_connection, _audio, _video, _screen, _data, _oneway) { - _connection.session = { - audio: _audio, // by default, it is true - video: _video, // by default, it is true - screen: _screen, - data: _data, - oneway: _oneway, - broadcast: false - }; - - _connection.direction = "one-to-one"; - - if( _data == true ) { - _connection.onmessage = function(e) { - appendDIV(e.data); - - console.debug(e.userid, 'posted', e.data); - console.log('latency:', e.latency, 'ms'); - }; - } - - - }; - - function assignStreamToDom() { - - - screenConnection.screenbody = document.querySelector('.screenContainer1'); - screenConnection.videobody = document.querySelector('.videoContainer2'); - - videoConnection.screenbody = document.querySelector('.screenContainer2'); - videoConnection.videobody = document.querySelector('.videoContainer1'); - }; - - function maximizeLayout() { - - // open the panes and maximize the window. - top.window.resizeTo(screen.availWidth,screen.availHeight); - // lets keep this closed as its the screen share panel; will be opened up in future release - panelLayout.open('west'); - // panelLayout.open('south'); is not working due to state initialization problem; debug to find out. so replacing the call with work around below - hack. - // $(".ui-layout-toggler-south-closed").first().click(); - - }; - - function minimizeLayout() { - - // close the panes and minimize the window. - top.window.resizeTo(screen.availWidth - 2*screen.availWidth/3, screen.availHeight - screen.availHeight/2); - panelLayout.close('west'); - // panelLayout.close('south'); is not working due to state initialization problem; debug to find out. so replacing the call with work around below - hack. - $(".ui-layout-toggler-south-opened").first().click(); - }; - - function emptyContainers() { - $('.screenContainer1').empty(); - $('.videoContainer2').empty(); - - $('.screenContainer2').empty(); - $('.videoContainer1').empty(); - }; - - function appendDIV(div, parent) { - if (typeof div === 'string') { - var content = div; - div = document.createElement('div'); - div.innerHTML = content; - }; - - var chatOutput = document.getElementById('chat-output'), - fileProgress = document.getElementById('file-progress'); - - if (!parent) {chatOutput.appendChild(div, chatOutput.firstChild); chatOutput.scrollTop = chatOutput.scrollHeight; - } - else fileProgress.insertBefore(div, fileProgress.firstChild); - - div.tabIndex = 0; - $('#chat-input').focus(); - }; - - function confirmClose() { - var message = "Are you sure you want to close the session?"; - - // if(popupModalService != undefined) { - // popupModalService.popupConfirmWin("Confirm", message, function(){ location.reload();}); - // } - - if (confirm(message) == true) { - location.reload(); - //window.opener.location.reload(); // go to the parent window - //close(); - } else { - // do nothing - } - - }; - - function notifyOthers() { - - // var websocket = localStorage.getItem('notifySocket'); - //if( websocket != null) { - // handling websocket peer broadcast session - var currentUser = "${sessionScope.user.orgUserId}"; - var initialPageVisit = "${sessionScope.initialPageVisit}"; - var remoteUser = ''; - - var userList = location.search.split('chat_id=')[1].split('-'); - for(var i=0;i<userList.length;i++) { - if(userList[i] !== currentUser) { - remoteUser = userList[i]; - break; - } - } - - socketSetup(initialPageVisit, currentUser, remoteUser,"socketSend"); - - - - - - - }; - - function makeChatVisible() { - - $('#chat-input').css("visibility", 'visible'); - }; - - function srcDestinationSessionAction() { - var url = window.location.href; - var chatId = ""; - - try{ - chatId = url.split("chat_id=")[1]; - } - catch(err) { - chatId =""; - } - // window.localStorage.getItem(chatId) == "source" - if(chatId != "" && getCookie(chatId) == "source") { - startSession(); - setCookie(chatId,"",-1); - //window.localStorage.removeItem(chatId); - } else { - viewSession(); - } - - }; - - function startSession() { - - emptyContainers(); - videoConnection.close(); - screenConnection.close(); - - maximizeLayout(); - emptyContainers(); - makeChatVisible(); - - videoConnection.open(); - screenConnection.open(); - - - notifyOthers(); - }; - - function viewSession() { - maximizeLayout(); - emptyContainers(); - makeChatVisible(); - - // timeout is required for the sharing to properly work - setTimeout(function() { - screenConnection.connect(); - },2000); - setTimeout(function() { - videoConnection.connect(); - },1000); - }; - - - function setCookie(cname,cvalue,exdays) { - var d = new Date(); - d.setTime(d.getTime() + (exdays*24*60*60*1000)); - var expires = "expires=" + d.toGMTString(); - document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; - } - - function getCookie(cname) { - var name = cname + "="; - var decodedCookie = decodeURIComponent(document.cookie); - var ca = decodedCookie.split(';'); - for(var i = 0; i < ca.length; i++) { - var c = ca[i]; - while (c.charAt(0) == ' ') { - c = c.substring(1); - } - if (c.indexOf(name) == 0) { - return c.substring(name.length, c.length); - } - } - return ""; - } - - - - /* on click button enabled*/ - document.getElementById('share-screen').onclick = function() { - startSession(); - }; - - document.getElementById('stop-share-screen').onclick = function() { - - emptyContainers(); - - videoConnection.close(); - screenConnection.close(); - - confirmClose(); - - }; - - document.getElementById('view-screen').onclick = function() { - viewSession(); - }; - - document.getElementById('chat-input').onkeypress = function(e) { - if (e.keyCode !== 13 || !this.value) return; - var message = "<b>${model.name}</b>: " + this.value; - appendDIV(message); - - // sending text message - videoConnection.send(message); - - this.value = ''; - }; - - /* - document.getElementById('file').onchange = function() { - videoConnection.send(this.files[0]); - }; - */ - - - //document.querySelector('.screenContainerPane').appenChild(document.querySelector('.screenContainer')); - //document.querySelector('.videoContainerPane').appendChild(document.querySelector('.videoContainer')); - - //panelLayout.bindButton($('#share-screen'), 'open', 'outer-west'); - //panelLayout.bindButton($('#stop-share-screen'), 'close', 'outer-west'); - var videoConnection = null, screenConnection = null; - initializeConnections(); - assignStreamToDom(); - srcDestinationSessionAction(); - - // start the share - //document.getElementById('share-screen').click(); - // - }); - - -</script> - - -</head> - -<body> -<!-- - <button id="share-screen" hidden="true" style="display: none;" class="setup">Share Your Screen</button> - <button id="stop-share-screen" hidden="true" style="display: none;" class="setup">Stop Share Your Screen</button> - <button id="view-screen" hidden="true" style="display: none;" class="setup">View My Screen</button> - - --> - -<div class="outer-center" style="position: absolute; left: 12px; right: 0px; top: 0px;bottom: 0px;"> - <div class="inner-center"> - - <!-- <jsp:include page="/WEB-INF/fusion/zul/chatOne.zul" /> --> - - - - <table style="width: 100%;"> - <tbody><tr> - <td> - <button id="share-screen" style="display:none" class="button button--primary button--small setup">Start Session</button> - <button id="stop-share-screen" style="display:none" class="button button--primary button--small setup">Stop Session</button> - <button id="view-screen" style="display:none" class="button button--primary button--small setup">View</button> - - </td> - <td> - - </td> - - </tr> - </tbody> - - <tbody> - <tr> - <td> - <div class="videoContainer1"></div> - <div class="videoContainer2"></div> - </td> - </tr> - </tbody> - </table> - - - </div> - <!-- - <div id="inner-south" class="ui-layout-south"> - <!-- - <div class="videoContainer1"></div> - <div class="videoContainer2"></div> - --> - - </div> - --> -</div> - -<div class="outer-west"> - <!-- - <div class="screenContainer1"></div> - <div class="screenContainer2"></div> - <div ng-controller="collaborationController"> </div> - --> - - - <div style="height: 90%;overflow-y: scroll;overflow-x: hidden;overflow-wrap: break-word;word-wrap: break-word;" id="chat-output"></div> - - <div style="bottom:0;width: 100%;"> - <input type="text" id="chat-input" style="font-size: 1.2em;width: 100%;" placeholder="Please type and hit return to send..."/> - </div> - - - -</div> - - - - - -</body> -</html> |