VRFS-1847 : Show video button in session.

* Hook to webcam viewer widget and initialize and toggle as appropriate
from session.js
* Camera icon

web/app/assets/javascripts/session.js

@@ -13,6 +13,7 @@
         var modUtils = context.JK.ModUtils;
         var logger = context.JK.logger;
         var self = this;
+        var webcamViewer = new context.JK.WebcamViewer()
         
         var defaultParticipant = {
           tracks: [{
@@ -143,6 +144,7 @@
 
             var shareDialog = new JK.ShareDialog(context.JK.app, sessionId, "session");
             shareDialog.initialize(context.JK.FacebookHelperInstance);
+            webcamViewer.beforeShow()
         }
 
         function beforeDisconnect() {
@@ -710,7 +712,7 @@
 
         function _initDialogs() {
             configureTrackDialog.initialize();
-            addNewGearDialog.initialize();
+            addNewGearDialog.initialize();                    
         }
 
         // Get the latest list of underlying audio mixer channels, and populates:
@@ -2473,6 +2475,14 @@
             return false;
         }
 
+        function sessionWebCam(e) {
+            e.preventDefault();            
+            webcamViewer.toggleWebcam()
+            //webcamViewer.beforeShow() 
+            logger.debug("WEBCAMMMING")
+            return false; 
+        }
+
         // http://stackoverflow.com/questions/2604450/how-to-create-a-jquery-clock-timer
         function updateRecordingTimer() {
 
@@ -3096,6 +3106,7 @@
         function events() {            
             $('#session-leave').on('click', sessionLeave);
             $('#session-resync').on('click', sessionResync);
+            $('#session-webcam').on('click', sessionWebCam);
             $('#session-contents').on("click", '[action="delete"]', deleteSession);
             $tracksHolder.on('click', 'div[control="mute"]', toggleMute);
             $('#recording-start-stop').on('click', startStopRecording);
@@ -3179,7 +3190,7 @@
             $fluidTracks = $screen.find('.session-fluidtracks');
             $voiceChat = $screen.find('#voice-chat');
             $tracksHolder = $screen.find('#tracks')
-
+            webcamViewer.init($(".webcam-container")) 
             events();
 
 

web/app/assets/javascripts/webcam_viewer.js.coffee

@@ -14,13 +14,13 @@ context.JK.WebcamViewer = class WebcamViewer
     @resolution=null
 
   init: (root) =>
-    console.log 'root', root
+    @logger.debug 'root', root
     @root = root
     @toggleBtn = @root.find(".webcam-test-btn")
     @webcamSelect = @root.find(".webcam-select-container select")
     @resolutionSelect = @root.find(".webcam-resolution-select-container select")
     @webcamSelect.on("change", this.selectWebcam)
-    console.log 'webcamSelect', @webcamSelect
+    @logger.debug 'webcamSelect', @webcamSelect
 
   beforeShow:() =>
     this.loadWebCams()
@@ -35,16 +35,16 @@ context.JK.WebcamViewer = class WebcamViewer
     
   
   selectWebcam:(e, data) =>
-    console.log 'Selecting control: ', @webcamSelect
+    @logger.debug 'Selecting control: ', @webcamSelect
     device = @webcamSelect.val()
     if device != null and device != ''
-      console.log 'Selecting webcam: ', device
+      @logger.debug 'Selecting webcam: ', device
       
   selectResolution:() =>
-    console.log 'Selecting res control: ', @resolutionSelect
+    @logger.debug 'Selecting res control: ', @resolutionSelect
     @resolution = @resolutionSelect.val()
     if @resolution != null and @resolution != ''
-      console.log 'Selecting res: ', @resolution
+      @logger.debug 'Selecting res: ', @resolution
       @client.FTUESetVideoEncodeResolution @resolution    
 
   setVideoOff:() =>
@@ -57,12 +57,12 @@ context.JK.WebcamViewer = class WebcamViewer
   setToggleState:() =>
     available = @webcamSelect.find('option').size() > 0
     shared = this.isVideoShared()
-    console.log 'Setting toggle from : ', shared
+    @logger.debug 'Setting toggle from : ', shared
     @toggleBtn.prop 'disabled', true
     @toggleBtn.prop 'disabled', !available
     
   toggleWebcam:() =>
-    console.log 'Toggling webcam from: ', this.isVideoShared()
+    @logger.debug 'Toggling webcam from: ', this.isVideoShared()
     if this.isVideoShared()
       @client.SessStopVideoSharing()
       @videoShared = false
@@ -80,7 +80,7 @@ context.JK.WebcamViewer = class WebcamViewer
         id: device
         value: device
         text: device)
-      console.log("Appending ", option, selectControl)
+      @logger.debug("Appending to: ", selectControl, option)
       selectControl.append option
     selectControl.val selectedDevice
     
@@ -92,9 +92,9 @@ context.JK.WebcamViewer = class WebcamViewer
   loadResolutions:() =>
     resolutions = @client.FTUEGetAvailableEncodeVideoResolutions()
     selectControl = @resolutionSelect
-    console.log 'FOUND THESE RESOLUTIONS', resolutions, selectControl
+    @logger.debug 'FOUND THESE RESOLUTIONS', resolutions, selectControl
     context._.each resolutions, (value, key, obj) ->
-      console.log 'RRR', key, value
+      @logger.debug 'RRR', key, value
       option = $('<option/>',
         value: value
         text: value)

web/app/views/clients/_session.html.slim

@@ -7,7 +7,7 @@
   .content-body
     #session-controls
       a#session-resync.button-grey.resync.left
-        = image_tag "content/icon_resync.png", {:align => "texttop", :height => 14, :width => 12}
+        = image_tag "content/icon_resync.png", {:align => "texttop", :height => 12, :width => 12}
         |  RESYNC 
       a#session-settings-button.button-grey.left[layout-link="session-settings"]
         = image_tag "content/icon_settings_sm.png", {:align => "texttop", :height => 12, :width => 12}
@@ -15,6 +15,9 @@
       a.button-grey.left[layout-link="share-dialog"]
         = image_tag "content/icon_share.png", {:align => "texttop", :height => 12, :width => 12}
         |  SHARE 
+      a#session-webcam.button-grey.video.left
+        = image_tag "content/icon_cam.png", {:align => "texttop", :height => 12, :width => 12}
+        |  VIDEO 
       .block
         .label
           | VOLUME:
@@ -109,6 +112,8 @@
                 br[clear="all"]
                 .play-controls-holder
                   = render "play_controls"
+    .webcam-container
+      = render 'webcam'
 = render "configureTrack"
 = render "addTrack"
 = render "addNewGear"