Creating Verto Communicator.

Verto Communicator is a web interface built on top of Verto and AngularJS.

Brought to you by Evolux Sistemas and FreeSWITCH team. :)

FS-7795 - implements fullscreen menu and doubleclick function.
FS-7795 - added chat icon on fullscreen video
FS-7796 - fix missing tooltips in call icons
FS-7796 - fix tooltip position
FS-7798 - implements change login information in modal view
FS-7828 - fix esc key bug when leave fullscren mode. Using css instead of javascript in fullscreen for elements manipulation.
FS-7826 - fix chat sender id with name instead of extension
FS-7831 - remove demo from title
FS-7841 - fix compatibility verification
FS-7842 - 'settings' data persistent
FS-7859 - moved popup down
FS-7827 - added screen share functionality
FS-7857 - default name for source media
FS-7879 - prompt before logout [incall]
FS-7873 - querystring for autocall
FS-7875 - persist login and password password
FS-7877 - phone feature: hold, transfer, incoming, answer, decline, call direction in history
FS-7878 - small devices
FS-7881 - added modal dialog for contributors

html5/verto/verto_communicator/js/angularjs/angular-fullscreen.js

@@ -0,0 +1,119 @@
+(function(window) {
+   var createModule = function(angular) {
+      var module = angular.module('FBAngular', []);
+
+      module.factory('Fullscreen', ['$document', '$rootScope', function ($document,$rootScope) {
+         var document = $document[0];
+
+         // ensure ALLOW_KEYBOARD_INPUT is available and enabled
+         var isKeyboardAvailbleOnFullScreen = (typeof Element !== 'undefined' && 'ALLOW_KEYBOARD_INPUT' in Element) && Element.ALLOW_KEYBOARD_INPUT;
+
+         var emitter = $rootScope.$new();
+
+         // listen event on document instead of element to avoid firefox limitation
+         // see https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode
+         $document.on('fullscreenchange webkitfullscreenchange mozfullscreenchange MSFullscreenChange', function(){
+            emitter.$emit('FBFullscreen.change', serviceInstance.isEnabled());
+         });
+
+         var serviceInstance = {
+            $on: angular.bind(emitter, emitter.$on),
+            all: function() {
+               serviceInstance.enable( document.documentElement );
+            },
+            enable: function(element) {
+               if(element.requestFullScreen) {
+                  element.requestFullScreen();
+               } else if(element.mozRequestFullScreen) {
+                  element.mozRequestFullScreen();
+               } else if(element.webkitRequestFullscreen) {
+                  // Safari temporary fix
+                  if (/Version\/[\d]{1,2}(\.[\d]{1,2}){1}(\.(\d){1,2}){0,1} Safari/.test(navigator.userAgent)) {
+                     element.webkitRequestFullscreen();
+                  } else {
+                     element.webkitRequestFullscreen(isKeyboardAvailbleOnFullScreen);
+                  }
+               } else if (element.msRequestFullscreen) {
+                  element.msRequestFullscreen();
+               }
+            },
+            cancel: function() {
+               if(document.cancelFullScreen) {
+                  document.cancelFullScreen();
+               } else if(document.mozCancelFullScreen) {
+                  document.mozCancelFullScreen();
+               } else if(document.webkitExitFullscreen) {
+                  document.webkitExitFullscreen();
+               } else if (document.msExitFullscreen) {
+                  document.msExitFullscreen();
+               }
+            },
+            isEnabled: function(){
+               var fullscreenElement = document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement;
+               return fullscreenElement ? true : false;
+            },
+            toggleAll: function(){
+                serviceInstance.isEnabled() ? serviceInstance.cancel() : serviceInstance.all();
+            },
+            isSupported: function(){
+                var docElm = document.documentElement;
+                var requestFullscreen = docElm.requestFullScreen || docElm.mozRequestFullScreen || docElm.webkitRequestFullscreen || docElm.msRequestFullscreen;
+                return requestFullscreen ? true : false;
+            }
+         };
+
+         return serviceInstance;
+      }]);
+
+      module.directive('fullscreen', ['Fullscreen', function(Fullscreen) {
+         return {
+            link : function ($scope, $element, $attrs) {
+               // Watch for changes on scope if model is provided
+               if ($attrs.fullscreen) {
+                  $scope.$watch($attrs.fullscreen, function(value) {
+                     var isEnabled = Fullscreen.isEnabled();
+                     if (value && !isEnabled) {
+                        Fullscreen.enable($element[0]);
+                        $element.addClass('isInFullScreen');
+                     } else if (!value && isEnabled) {
+                        Fullscreen.cancel();
+                        $element.removeClass('isInFullScreen');
+                     }
+                  });
+
+                  // Listen on the `FBFullscreen.change`
+                  // the event will fire when anything changes the fullscreen mode
+                  var removeFullscreenHandler = Fullscreen.$on('FBFullscreen.change', function(evt, isFullscreenEnabled){
+                     if(!isFullscreenEnabled){
+                        $scope.$evalAsync(function(){
+                           $scope.$eval($attrs.fullscreen + '= false');
+                           $element.removeClass('isInFullScreen');
+                        });
+                     }
+                  });
+
+                  $scope.$on('$destroy', function() {
+                     removeFullscreenHandler();
+                  });
+
+               } else {
+                  if ($attrs.onlyWatchedProperty !== undefined) {
+                     return;
+                  }
+
+                  $element.on('click', function (ev) {
+                     Fullscreen.enable(  $element[0] );
+                  });
+               }
+            }
+         };
+      }]);
+      return module;
+   };
+
+   if (typeof define === "function" && define.amd) {
+      define("FBAngular", ['angular'], function (angular) { return createModule(angular); } );
+   } else {
+      createModule(window.angular);
+   }
+})(window);