VRFS-3070 : Webcam selection & state fixes

* Hook up test webcam button
* Handle object vs. string from client method.

web/app/assets/javascripts/accounts.js

@@ -45,9 +45,12 @@
             var invalidProfiles = prettyPrintAudioProfiles(context.JK.getBadConfigMap());
             var sessionSummary = summarizeSession(userDetail);
 
-            var webcam = context.jamClient.FTUECurrentSelectedVideoDevice
-            if (webcam==null || typeof(webcam)=="undefined" || webcam.length==0) {
-                webcam = "None Configured"                
+            var webcamName;
+            var webcam = context.jamClient.FTUECurrentSelectedVideoDevice()
+            if (webcam==null || typeof(webcam)=="undefined" || Object.keys(webcam).length==0) {
+                webcamName = "None Configured"                
+            } else {
+                webcamName = _.values(webcam)[0]
             }
 
             var $template = $(context._.template($('#template-account-main').html(), {
@@ -63,7 +66,7 @@
               invalidProfiles : invalidProfiles,
               isNativeClient: gon.isNativeClient,
               musician: context.JK.currentUserMusician,
-              webcamName: webcam,
+              webcamName: webcamName,
               sales_count: userDetail.sales_count
             } , { variable: 'data' }));
 

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

@@ -14,13 +14,12 @@ context.JK.WebcamViewer = class WebcamViewer
     @resolution=null
 
   init: (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)
-    @logger.debug 'webcamSelect', @webcamSelect
+    @toggleBtn.on 'click', @toggleWebcam
 
   beforeShow:() =>
     this.loadWebCams()
@@ -35,17 +34,21 @@ context.JK.WebcamViewer = class WebcamViewer
     
   
   selectWebcam:(e, data) =>
-    @logger.debug 'Selecting control: ', @webcamSelect
-    device = @webcamSelect.val()
-    if device != null and device != ''
-      @logger.debug 'Selecting webcam: ', device
+    device = @webcamSelect.val()    
+    if device?
+      caps = @client.FTUEGetVideoCaptureDeviceCapabilities(device)
+      @logger.debug("Got capabilities from device", caps, device)
+      @client.FTUESelectVideoCaptureDevice(device, caps)      
       
   selectResolution:() =>
     @logger.debug 'Selecting res control: ', @resolutionSelect
     @resolution = @resolutionSelect.val()
-    if @resolution != null and @resolution != ''
+    if @resolution?
       @logger.debug 'Selecting res: ', @resolution
       @client.FTUESetVideoEncodeResolution @resolution    
+      if @isVideoShared
+        this.setVideoOff()
+        this.toggleWebcam()
 
   setVideoOff:() =>
     if this.isVideoShared()
@@ -57,22 +60,31 @@ context.JK.WebcamViewer = class WebcamViewer
   setToggleState:() =>
     available = @webcamSelect.find('option').size() > 0
     shared = this.isVideoShared()
-    @logger.debug 'Setting toggle from : ', shared
     @toggleBtn.prop 'disabled', true
     @toggleBtn.prop 'disabled', !available
     
   toggleWebcam:() =>
     @logger.debug 'Toggling webcam from: ', this.isVideoShared()
     if this.isVideoShared()
+      @toggleBtn.removeClass("selected")
       @client.SessStopVideoSharing()
       @videoShared = false
     else
+      @toggleBtn.addClass("selected")
       @client.SessStartVideoSharing 0
       @videoShared = true
+
+  selectedDeviceName:() =>
+    webcamName="None Configured"
+    webcam = @client.FTUECurrentSelectedVideoDevice()
+    if (webcam? && Object.keys(webcam).length>0) 
+      webcamName = _.values(webcam)[0]    
+
+    webcamName
     
   loadWebCams:() =>
     devices = @client.FTUEGetVideoCaptureDeviceNames()
-    selectedDevice = @client.FTUECurrentSelectedVideoDevice()
+    selectedDevice = this.selectedDeviceName()
     selectControl = @webcamSelect
     context._.each devices, (device) ->
       selected = device == selectedDevice
@@ -80,7 +92,6 @@ context.JK.WebcamViewer = class WebcamViewer
         id: device
         value: device
         text: device)
-      @logger.debug("Appending to: ", selectControl, option)
       selectControl.append option
     selectControl.val selectedDevice
     
@@ -94,7 +105,6 @@ context.JK.WebcamViewer = class WebcamViewer
     selectControl = @resolutionSelect
     @logger.debug 'FOUND THESE RESOLUTIONS', resolutions, selectControl
     context._.each resolutions, (value, key, obj) ->
-      @logger.debug 'RRR', key, value
       option = $('<option/>',
         value: value
         text: value)

web/app/views/clients/_account.html.erb

@@ -38,42 +38,37 @@
         <hr/>
 
         {% if (data.isNativeClient) { %}
-        <div class="account-left">
-          <h2>audio gear:</h2>
-        </div>
+          <div class="account-left">
+            <h2>audio gear:</h2>
+          </div>
 
-        <div class="account-mid audio">
-          <strong>Profiles:</strong> <span class="audio-profiles-short">{{data.validProfiles}}</span>
-        </div>
+          <div class="account-mid audio">
+            <strong>Profiles:</strong> <span class="audio-profiles-short">{{data.validProfiles}}</span>
+          </div>
 
-        <div class="right">
-          <a id="account-edit-audio-link" href="#" class="button-orange">UPDATE</a>
-        </div>
-        <br clear="all" />
-        <hr />
+          <div class="right">
+            <a id="account-edit-audio-link" href="#" class="button-orange">UPDATE</a>
+          </div>
+          <br clear="all" />
+          <hr />
 
         {% } %}
 
-        <br clear="all" />
-        <hr />
-
-
         <% if Rails.application.config.video_available || (current_user && current_user.admin) %>
 
-        <div class="account-left">
-          <h2>video gear:</h2>
-        </div>
+          <div class="account-left">
+            <h2>video gear:</h2>
+          </div>
 
-        <div class="account-mid video">
-          <strong>Webcam:</strong> {{data.webcamName}}<br />
-        </div>
+          <div class="account-mid video">
+            <strong>webcam:</strong> {{data.webcamName}}<br />
+          </div>
 
-        <div class="right">
-          <a id="account-edit-video-link" href="#" class="button-orange">UPDATE</a>
-        </div>
-        <br clear="all" />
-
-        <hr />
+          <div class="right">
+            <a id="account-edit-video-link" href="#" class="button-orange">UPDATE</a>
+          </div>
+          <br clear="all" />
+          <hr />
         <% end %>
 
 

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

@@ -1,11 +1,11 @@
-h2.sub-header Webcam
+h2.sub-header webcam:
 form.video
   .webcam-select-container.wizard_control
     select.w100
   .webcam-resolution-select-container.wizard_control
     select.w100
   .configure-webcam.wizard_control
-    a.button-orange.webcam-test-btn Test Webcam
+    a.button-grey-toggle.webcam-test-btn Test Webcam
   .configure-webcam.wizard_control
-    a.button-orange.webcam-settings-btn Webcam Settings
+    a.button-grey-toggle.webcam-settings-btn Webcam Settings
 em.no-webcam-msg.hidden No webcam detected.  If using an external webcam, please make sure it is plugged in to your computer.