padding-right: 360px;
}
+ .watcher #wrapper {
+ padding-right: 0;
+ }
+
#wrapper.toggled {
padding-right: 0;
}
#preview .refresh {
margin: 15px 0px 0px 0px;
}
+
+.watcher {
+ padding: 0;
+ background-color: #333333;
+}
+
+.watcher .navbar, .watcher #sidebar-wrapper, .watcher #dialpad {
+ display: none;
+}
+
+.watcher #wrapper.toggled {
+ padding-right: 0;
+}
+
+.watcher #incall .panel {
+ margin: 0;
+}
+
+.watcher #video-tag-wrapper {
+ background: linear-gradient(to bottom, #272627, #27252A);
+ background-color: #27252A;
+}
+
+.watcher #incall .video-call {
+ width: 100%;
+ height: 100%;
+ padding: 0;
+ max-width: none;
+ max-height: none;
+}
+
+.watcher #webcam {
+ max-width: 160.78vh;
+ margin: auto;
+}
+
+.watcher .spinner {
+ top: 20%;
+}
<div class="centered-block-frame" id="incall">
- <div class="col-md-12 centered-block" ng-class="{'video-call': storage.data.videoCall, 'phone-call': !storage.data.videoCall}">
+ <div class="col-md-12 centered-block" ng-class="storage.data.videoCall || watcher ? 'video-call' : 'phone-call'">
<div class="slide-animate height100" ng-include="callTemplate"></div>
</div>
</div>
<div class="panel panel-default shadow-z-0">
<div class="video-wrapper">
- <div class="video-hover-buttons" ng-show="verto.data.callState == 'active'">
+ <div class="video-hover-buttons" ng-show="verto.data.callState == 'active' && !watcher">
<div id="moderator-tools" ng-show="verto.data.confRole == 'moderator'">
<button tooltip-placement="bottom" tooltip-title="Play" uib-tooltip="Play"
class="btn btn-material-blue-900" ng-click="play()">
</li>
</ul>
</div>
+ <div class="btn-group" ng-show="conf.canvasCount > 1">
+ <button tooltip-placement="bottom" tooltip-title="Popup" uib-tooltips="Popup" type="button" class="btn btn-material-blue-900 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ <i class="mdi-image-filter-none"></i>
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li ng-repeat="canvas in canvases">
+ <a ng-click="confPopup(canvas.id)">{{ canvas.name }}</a>
+ </li>
+ </ul>
+ </div>
</div>
</div>
<div class="video-tag-wrapper" id="video-tag-wrapper" ng-dblclick="goFullscreen()" show-controls>
<div class="row">
<div class="col-md-6 col-xs-6 text-left">
<div class="video-timer">
- <timer start-time="start_time" autostart="false" interval="1000">{{hhours}}:{{mminutes}}:{{sseconds}}</timer>
+ <span ng-show="watcher" style="font-size: 18px">Room {{ extension }} - Canvas {{ canvasID }}</span>
+ <timer start-time="start_time" autostart="false" interval="1000" ng-if="!watcher">{{hhours}}:{{mminutes}}:{{sseconds}}</timer>
</div>
</div>
<div class="col-md-6 col-xs-6 text-right">
<button class="btn btn-danger" ng-click="hangup()">
<i class="mdi-communication-call-end"></i>
- End Call
+ {{ watcher ? 'Close' : 'End Call' }}
</button>
</div>
</div>
});
$rootScope.$on('members.del', function(event, uuid) {
+ if ($rootScope.watcher && $rootScope.master === uuid) {
+ verto.hangup();
+ window.close();
+ }
+
$scope.$apply(function() {
var memberIdx = findMemberByUUID(uuid);
if (memberIdx != -1) {
eventQueue.process();
+ if ($location.search().autocall) {
+ $rootScope.dialpadNumber = $location.search().autocall;
+ delete $location.search().autocall;
+ call($rootScope.dialpadNumber);
+ if($rootScope.watcher) {
+ return;
+ }
+ }
+
$scope.call_history = CallHistory.all();
$scope.history_control = CallHistory.all_control();
$scope.has_history = Object.keys($scope.call_history).length;
/**
* fill dialpad via querystring [?autocall=\d+]
*/
- if ($location.search().autocall) {
- $rootScope.dialpadNumber = $location.search().autocall;
- delete $location.search().autocall;
- call($rootScope.dialpadNumber);
- }
/**
* fill in dialpad via config.json
return false;
}
+ if (extension.indexOf('-canvas-') != -1) {
+ $rootScope.watcher = true;
+ verto.call($rootScope.dialpadNumber, null, { useCamera: false, useMic: false, caller_id_name: null, userVariables: {}, caller_id_number: null, mirrorInput: false });
+ $location.path('/incall');
+ return;
+ }
+
storage.data.mutedVideo = false;
storage.data.mutedMic = false;
$scope.dialpadTemplate = '';
$scope.incall = true;
-
if (storage.data.videoCall) {
$scope.callTemplate = 'partials/video_call.html';
}
if($scope.chatStatus) {
$scope.openChat();
}
+ buildCanvasesData();
});
});
$rootScope.$emit('changedSpeaker', speakerId);
};
+ $scope.confPopup = function(canvas_id) {
+ var s = window.location.href;
+ var curCall = verto.data.call.callID;
+ var extension = verto.data.call.params.remote_caller_id_number;
+ var width = 465, height = 360;
+ var x = screen.width/2 - width/2
+ var y = screen.height/2 - height/2
+
+ s = s.replace(/\#.*/, '');
+ s += "#/?sessid=random&master=" + curCall + "&watcher=true&extension=" + extension+ "&canvas_id=" + canvas_id;
+
+ console.log("opening new window to " + s);
+ var popup = window.open(s, "canvas_window_" + canvas_id, "toolbar=0,location=0,menubar=0,directories=0,width=" + width + ",height=" + height, + ',left=' + x + ',top=' + y);
+ popup.moveTo(x, y);
+ };
+
$scope.screenshare = function() {
if(verto.data.shareCall) {
verto.screenshareHangup();
verto.screenshare(storage.data.called_number);
};
+ function buildCanvasesData() {
+ $scope.conf = verto.data.conf.params.laData;
+ $scope.canvases = [{ id: 1, name: 'Super Canvas' }];
+ for (var i = 1; i < $scope.conf.canvasCount; i++) {
+ $scope.canvases.push({ id: i+1, name: 'Canvas ' + (i+1) });
+ }
+ }
+
$scope.muteMic = verto.muteMic;
$scope.muteVideo = verto.muteVideo;
console.debug('Executing MainController.');
+ $rootScope.master = $location.search().master;
+ if ($location.search().watcher === 'true') {
+ $rootScope.watcher = true;
+ angular.element(document.body).addClass('watcher');
+ var dialpad;
+ var extension = dialpad = $location.search().extension;
+ var canvasID = $location.search().canvas_id;
+
+ if (dialpad) {
+ if (canvasID) {
+ dialpad += '-canvas-' + canvasID;
+ }
+ $rootScope.extension = extension;
+ $rootScope.canvasID = canvasID;
+ $location.search().autocall = dialpad;
+ }
+ }
+
var myVideo = document.getElementById("webcam");
$scope.verto = verto;
$scope.storage = storage;
return;
}
+ if ($rootScope.watcher) {
+ window.close();
+ return;
+ }
+
//var hangupCallback = function(v, hangup) {
// if (hangup) {
// $location.path('/dialpad');
}
});
-})();
\ No newline at end of file
+})();
var that = this;
function ourBootstrap() {
+ var sessid = $location.search().sessid;
+ if (sessid === 'random') {
+ sessid = $.verto.genUUID();
+ $location.search().sessid = sessid;
+ }
// Checking if we have a failed connection attempt before
// connecting again.
if (data.instance && !data.instance.rpcClient.socketReady()) {
googNoiseSuppression: storage.data.googNoiseSuppression || true,
googHighpassFilter: storage.data.googHighpassFilter || true
},
+ sessid: sessid,
iceServers: storage.data.useSTUN
}, callbacks);
jQuery.verto.unloadJobs.push(function() {
that.reloaded = true;
});
+
data.instance.deviceParams({
useCamera: storage.data.selectedVideo,
useSpeak: storage.data.selectedSpeaker,
*
* @param callback
*/
- call: function(destination, callback) {
+ call: function(destination, callback, custom) {
console.debug('Attempting to call destination ' + destination + '.');
- var call = data.instance.newCall({
+ var call = data.instance.newCall(angular.extend({
destination_number: destination,
caller_id_name: data.name,
caller_id_number: data.callerid ? data.callerid : data.email,
email : storage.data.email,
avatar: "http://gravatar.com/avatar/" + md5(storage.data.email) + ".png?s=600"
}
- });
+ }, custom));
data.call = call;