VRFS-1845 : Webcam settings included in account page. Script uses same WebcamViewer object as the flue.

web/app/assets/javascripts/accounts_video_profile.js

@@ -0,0 +1,32 @@
+(function (context, $) {
+
+  "use strict";
+
+  context.JK = context.JK || {};
+  context.JK.AccountVideoProfile = function (app) {
+    var $webcamViewer = new context.JK.WebcamViewer()
+    function initialize() {
+      var screenBindings = {
+        'beforeShow': beforeShow,
+        'beforeHide':beforeHide
+      };
+      app.bindScreen('account/video', screenBindings);
+      
+      $webcamViewer.init($(".webcam-container"))      
+    }
+
+    function beforeShow() {
+      $webcamViewer.beforeShow()      
+    }
+
+    function beforeHide() {
+      $webcamViewer.setVideoOff()
+    }
+
+    this.beforeShow = beforeShow
+    this.beforeHide = beforeHide
+    this.initialize = initialize
+    return this;
+  };
+
+})(window, jQuery);

web/app/assets/stylesheets/client/account.css.scss

@@ -49,6 +49,22 @@
     width: 20%;
   }
 
+  .wizard_control {
+    margin-bottom: 10px;
+  }
+
+  .content-wrapper .account-video {
+
+    .subcaption {
+      margin-bottom: 4px;
+    }    
+  }
+
+  .webcam-container {
+    margin-top: 10px;
+  }
+
+
   .account-left h2 {
     color: #FFFFFF;
     font-size: 23px;
@@ -107,7 +123,7 @@
     }
   }
 
-  .audio .audio-profiles-short{
+  .audio .audio-profiles-short, .video .video-profiles-short {
     white-space: normal;
   }
 
@@ -151,7 +167,6 @@
   }
 
   .account-audio {
-
     table.generaltable td {
       vertical-align:middle;
     }
@@ -160,7 +175,6 @@
       margin-bottom:9px;
     }
 
-
     .rescanning-notice {
       display:none;
 
@@ -216,7 +230,6 @@
       }
     }
 
-
     .spinner-large {
       width:300px;
       height:300px;

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

@@ -0,0 +1,37 @@
+<!-- Account Summary Dialog -->
+<div layout="screen" layout-id="account/video" class="screen secondary" id="account-video-profile">
+  <!-- header -->
+  <div class="content-head">
+    <!-- icon -->
+    <div class="content-icon">
+      <%= image_tag "content/icon_account.png", {:width => 27, :height => 20} %>
+    </div>
+    <!-- section head text -->
+    <h1>my account</h1>
+
+    <%= render "screen_navigation" %>
+  </div>
+  <!-- end header -->
+
+  <!-- profile scrolling area -->
+  <div class="content-body">
+    <div id="account-video-content-scroller" class="content-body-scroller account-content-scroller">
+      <!-- content wrapper -->
+      <div class="content-wrapper account-video">
+        <div class="video-header">
+          <h2 class="subcaption">video gear:</h2>
+          <div class="subcaption">
+            Select webcam to use for video in sessions.  Verify that you see video from webcam in window to the right.  Configure webcam settings if desired.
+          </div>          
+        </div>
+
+        <div class="webcam-container">
+          <%= render 'webcam' %>
+        </div>
+        
+      </div>
+    </div>
+  </div>
+  <!-- end content scrolling area -->
+</div>
+

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

@@ -50,6 +50,7 @@
 <%= render "account_profile" %>
 <%= render "account_profile_avatar" %>
 <%= render "account_audio_profile" %>
+<%= render "account_video_profile" %>
 <%= render "account_sessions" %>
 <%= render "account_session_detail" %>
 <%= render "account_session_properties" %>
@@ -206,6 +207,9 @@
             var accountAudioProfile = new JK.AccountAudioProfile(JK.app);
             accountAudioProfile.initialize();
 
+            var accountVideoProfile = new JK.AccountVideoProfile(JK.app);
+            accountVideoProfile.initialize();
+
             var searchResultScreen = new JK.SearchResultScreen(JK.app);
             searchResultScreen.initialize();