VRFS-2822 : Create a jam track landing page, a coffee script to control it, and styles.

Link from main client view.  Link TO current (browse) page.

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

@@ -0,0 +1,93 @@
+$ = jQuery
+context = window
+context.JK ||= {};
+
+context.JK.JamTrackLanding = class JamTrackLanding
+  constructor: (@app) ->
+    console.log "CONSTRUCTING", @app
+    @client = context.jamClient
+    @logger = context.JK.logger
+    @screen = null
+
+  initialize:() =>
+    screenBindings =
+      'beforeShow': @beforeShow
+      'afterShow': @afterShow
+    @app.bindScreen('jamtrackLanding', screenBindings);
+    @screen = $('#jamtrackLanding')    
+    console.log "INITIALIZING", @screen
+    
+  beforeShow:() =>
+    console.log "beforeShow"
+  
+  afterShow:() =>
+    console.log "afterShow"
+  
+  # selectWebcam:(e, data) =>
+  #   console.log 'Selecting control: ', @webcamSelect
+  #   device = @webcamSelect.val()
+  #   if device != null and device != ''
+  #     console.log 'Selecting webcam: ', device
+      
+  # selectResolution:() =>
+  #   console.log 'Selecting res control: ', @resolutionSelect
+  #   @resolution = @resolutionSelect.val()
+  #   if @resolution != null and @resolution != ''
+  #     console.log 'Selecting res: ', @resolution
+  #     @client.FTUESetVideoEncodeResolution @resolution    
+
+  # setVideoOff:() =>
+  #   if this.isVideoShared()
+  #     @client.SessStopVideoSharing()
+      
+  # isVideoShared:() =>
+  #   @videoShared
+    
+  # setToggleState:() =>
+  #   available = @webcamSelect.find('option').size() > 0
+  #   shared = this.isVideoShared()
+  #   console.log 'Setting toggle from : ', shared
+  #   @toggleBtn.prop 'disabled', true
+  #   @toggleBtn.prop 'disabled', !available
+    
+  # toggleWebcam:() =>
+  #   console.log 'Toggling webcam from: ', this.isVideoShared()
+  #   if this.isVideoShared()
+  #     @client.SessStopVideoSharing()
+  #     @videoShared = false
+  #   else
+  #     @client.SessStartVideoSharing 0
+  #     @videoShared = true
+    
+  # loadWebCams:() =>
+  #   devices = @client.FTUEGetVideoCaptureDeviceNames()
+  #   selectedDevice = @client.FTUECurrentSelectedVideoDevice()
+  #   selectControl = @webcamSelect
+  #   context._.each devices, (device) ->
+  #     selected = device == selectedDevice
+  #     option = $('<option/>',
+  #       id: device
+  #       value: device
+  #       text: device)
+  #     console.log("Appending ", option, selectControl)
+  #     selectControl.append option
+  #   selectControl.val selectedDevice
+    
+  #   if devices.length == 0
+  #     @root.find('.no-webcam-msg').removeClass 'hidden'
+  #   else
+  #     @root.find('.no-webcam-msg').addClass 'hidden'      
+
+  # loadResolutions:() =>
+  #   resolutions = @client.FTUEGetAvailableEncodeVideoResolutions()
+  #   selectControl = @resolutionSelect
+  #   console.log 'FOUND THESE RESOLUTIONS', resolutions, selectControl
+  #   context._.each resolutions, (value, key, obj) ->
+  #     console.log 'RRR', key, value
+  #     option = $('<option/>',
+  #       value: value
+  #       text: value)
+  #     selectControl.append option      
+
+  #   if @resolution != null and @resolution != ''
+  #     selectControl.val(@resolution)

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

@@ -1,3 +1,29 @@
+#jamtrackLanding {
+  .list-columns {
+    h2 {
+      font-size: 1.4em;
+      font-weight:300;
+      font-style: bolder;
+      font-family: verdana; 
+      text-transform: lowercase;
+    }
+    .about {
+      float: left;
+      width: 50%;
+      > * {
+        margin: 4px;
+      }
+    }
+    .browse {
+      float: left;
+      width: 50%;
+      > * {
+        margin: 4px;
+      }
+    }
+  }
+}
+
 #jamtrackScreen {
   a.jamtrack_help {
     color: #fff;

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

@@ -71,7 +71,7 @@
         .homebox-info
       -if jamtracks
         /! 1 session invitation, 19 public sessions active
-        .homecard.jamtrack layout-grid-columns=small_tile_size layout-grid-position=column_positions[2] layout-grid-rows="1" layout-link="jamtrack" 
+        .homecard.jamtrack layout-grid-columns=small_tile_size layout-grid-position=column_positions[2] layout-grid-rows="1" layout-link="jamtrackLanding" 
           h2 jamtracks
           .homebox-info
             /! 5 followers, 3 following

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

@@ -0,0 +1,18 @@
+#jamtrackLanding.screen.secondary layout='screen' layout-id='jamtrackLanding'
+  .content
+    .content-head
+      .content-icon=image_tag("content/icon_jamtracks.png",  height:19, width:19)
+      h1 jamtracks      
+      = render "screen_navigation"
+    .content-body
+      .list-columns
+        .about
+          h2 what are jamtracks?
+        .browse
+          h2 my jamtracks
+          .howto 
+            ="To play with your JamTracks, open a JamTrack while in a session in the JamKazam app.  Or "
+            a.jamtrack_help href="client#/jamtrack" visit the JamTracks Section of your account.
+          h2 browse jamtracks
+          
+

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

@@ -37,6 +37,7 @@
 <%= render "users/feed_music_session_ajax" %>
 <%= render "users/feed_recording_ajax" %>
 <%= render "jamtrack" %>
+<%= render "jamtrack_landing" %>
 <%= render "shopping_cart" %>
 <%= render "signin" %>
 <%= render "order" %>
@@ -245,6 +246,9 @@
             var jamtrackScreen = new JK.JamTrackScreen(JK.app);
             jamtrackScreen.initialize();
 
+            var jamtrackLanding = new JK.JamTrackLanding(JK.app);
+            jamtrackLanding.initialize();
+
             var shoppingCartScreen = new JK.ShoppingCartScreen(JK.app);
             shoppingCartScreen.initialize();