* make network test optional, add help for no audio

2016-04-13 12:05:04 -05:00 · 2016-04-13 12:05:04 -05:00 · 10c3571cd8
parent 90c167fb91
commit 10c3571cd8
11 changed files with 87 additions and 20 deletions
--- a/web/app/assets/javascripts/networkTestHelper.js
+++ b/web/app/assets/javascripts/networkTestHelper.js
@ -1278,7 +1278,11 @@
      $startNetworkTestBtn = $step.find('.start-network-test');
      $foreverNetworkTestBtn = $step.find('.forever-network-test')

-      if ($startNetworkTestBtn.length == 0) throw 'no start network test button found in network-test'
+      if ($startNetworkTestBtn.length == 0) {
+        console.log('no start network test button found in network-test. in gear wizard=' + inGearWizard)
+        return
+        //throw 'no start network test button found in network-test. in gear wizard=' + inGearWizard
+      }

      $testResults = $step.find('.network-test-results');
      $testScoreAudio = $step.find('.network-test-score-audio');
--- a/web/app/assets/javascripts/react-components/SessionOtherTrack.js.jsx.coffee
+++ b/web/app/assets/javascripts/react-components/SessionOtherTrack.js.jsx.coffee
@ -70,6 +70,7 @@ MixerActions = @MixerActions
    connectionStateClasses[classification] = true

    `<div className={componentClasses}>
+      <a className="noAudioHelp">No Audio?</a>
      <div className="disabled-track-overlay" />
      <div className="session-track-contents">
        <div className="name">{this.props.trackName}</div>
@ -100,6 +101,7 @@ MixerActions = @MixerActions
    $mute = $root.find('.track-icon-mute')
    $pan  = $root.find('.track-icon-pan')
    $connectionState = $root.find('.track-connection-state')
+    $noAudioHelp = $root.find('.noAudioHelp')

    context.JK.interactReactBubble(
      $mute,
@ -127,6 +129,8 @@ MixerActions = @MixerActions
    ,
      {width:385, positions:['right', 'left'], offsetParent:$root.closest('.screen')})

+    context.JK.helpBubblePersist($noAudioHelp, 'no-audio-help', {}, {duration:10000, offsetParent:$root.closest('.screen'), width:385, positions:['bottom','right', 'left', 'top']})
+
    unless this.props.hasMixer
      $mute.on("mouseenter", false)
      $mute.on("mouseleave", false)
--- a/web/app/assets/javascripts/utils.js
+++ b/web/app/assets/javascripts/utils.js
@ -107,6 +107,17 @@
    holder.append(helpText);
    return holder;
  }
+
+  /** same as helpBubble(), but doesnt' go away until the user clicks somewhere */
+  context.JK.helpBubblePersist = function ($element, templateName, data, options) {
+    if(!options) options = {};
+    options['trigger'] = 'none';
+    options['clickAnywhereToClose'] = true
+    options['closeWhenOthersOpen']= true
+    options['persist'] = true
+    context.JK.helpBubble($element, templateName, data, options)
+  }
+
  /**
   * Associates a help bubble on hover (by default) with the specified $element, using jquery.bt.js (BeautyTips)
   * @param $element The element that should show the help when hovered
@ -122,6 +133,23 @@
      options = {};
    }

+
+
+    if(options.persist) {
+
+      var timeout = null;
+      options.postShow = function(container) {
+        context.JK.popExternalLinks($(container))
+      }
+
+      $element.hoverIntent({
+        over: function() {
+          $element.btOn();
+        },
+        out: function() {
+
+        }});
+    }
    $element.on('remove', function() {
      $element.btOff(); // if the element goes away for some reason, get rid of the bubble too
    })
--- a/web/app/assets/javascripts/wizard/gear/gear_wizard.js
+++ b/web/app/assets/javascripts/wizard/gear/gear_wizard.js
@ -215,6 +215,7 @@
      $wizardSteps = $dialog.find('.wizard-step');
      $templateSteps = $('#template-ftuesteps');
      var videoGear = $wizardSteps.filter($('.video-gear'))
+      var networkTest = $wizardSteps.filter($('.network-test'))
      wizard = new context.JK.Wizard(app);

      stepUnderstandGear.initialize($wizardSteps.filter($('[layout-wizard-step=0]')), self);
@ -222,19 +223,21 @@
      stepConfigureTracks.initialize($wizardSteps.filter($('[layout-wizard-step=2]')), self);
      stepConfigureVoiceChat.initialize($wizardSteps.filter($('[layout-wizard-step=3]')), self);
      stepDirectMonitoring.initialize($wizardSteps.filter($('[layout-wizard-step=4]')), self);
-      stepNetworkTest.initialize($wizardSteps.filter($('.network-test')), self);
      stepSuccess.initialize($wizardSteps.filter($('.success')), self);
-      
+
+      var dynamicStepCount = 5
      if(videoGear.length) {
        stepVideoGear.initialize(videoGear, self);
-        STEPS[5]=stepVideoGear
-        STEPS[6]=stepNetworkTest
-        STEPS[7]=stepSuccess
-      } else {
-        STEPS[5]=stepNetworkTest
-        STEPS[6]=stepSuccess     
+        STEPS[dynamicStepCount++] = stepVideoGear
      }
-      
+
+      if(networkTest.length) {
+        stepNetworkTest.initialize($wizardSteps.filter($('.network-test')), self);
+        STEPS[dynamicStepCount++] = stepNetworkTest
+      }
+
+      STEPS[dynamicStepCount++]=stepSuccess
+
      wizard.initialize($dialog, $wizardSteps, STEPS);
      events();
    }
--- a/web/app/assets/javascripts/wizard/gear_utils.js
+++ b/web/app/assets/javascripts/wizard/gear_utils.js
@ -607,7 +607,7 @@
  }

  gearUtils.validNetworkScore = function () {
-    return gearUtils.skippedNetworkTest || context.jamClient.GetNetworkTestScore() >= 2;
+    return !gon.global.network_test_required || gearUtils.skippedNetworkTest || context.jamClient.GetNetworkTestScore() >= 2;
  }

  gearUtils.isRestartingAudio = function () {
--- a/web/app/assets/stylesheets/client/help.css.scss
+++ b/web/app/assets/stylesheets/client/help.css.scss
@ -28,6 +28,10 @@ body.jam, body.web, .dialog{
        font-weight:bold;
      }

+      .no-audio-help {
+        p {margin-bottom:20px !important;}
+      }
+
      .help-musician-score-count {
        .measurement {

--- a/web/app/assets/stylesheets/client/react-components/SessionTrack.css.scss
+++ b/web/app/assets/stylesheets/client/react-components/SessionTrack.css.scss
@ -70,6 +70,16 @@
    border-radius: 6px;
  }

+  .noAudioHelp {
+    display:none;
+    right:6px;
+    top:6px;
+    position:absolute;
+    color:#fc0;
+    z-index:1000;
+    font-size:12px;
+  }
+
  &.no-mixer, &.no-audio {
    .disabled-track-overlay {
      width: 100%;
@ -77,6 +87,10 @@
      opacity:0.5;
      z-index:1;
    }
+
+    .noAudioHelp {
+      display:block;
+    }
  }


--- a/web/app/views/clients/_help.html.slim
+++ b/web/app/views/clients/_help.html.slim
@ -377,4 +377,12 @@ script type="text/template" id="template-help-vid-record-chat-input"

 script type="text/template" id="template-help-first-time-jamtrack-web-player"
  .first-time-jamtrack-web-player
-    | Create custom mixes to mute parts, slow down playback, etc.
+    | Create custom mixes to mute parts, slow down playback, etc.
+
+script type="text/template" id="template-help-no-audio-help"
+  .no-audio-help
+    p A remote musician will appear grayed out if you are not receiving streaming audio from them.
+
+    p Usually audio streaming just works, but in some cases router configurations do not allow audio streams to reach your computer.
+
+    p This article <a href="https://jamkazam.desk.com/customer/portal/articles/1716139-what-to-do-if-you-cannot-pass-the-network-test" rel="external">describes how you can configure your router</a> to allow the streamed audio to get through to you.
--- a/web/app/views/clients/wizard/gear/_gear_wizard.html.haml
+++ b/web/app/views/clients/wizard/gear/_gear_wizard.html.haml
@ -157,11 +157,11 @@
        .ftuesteps
        .clearall
        = render :partial => '/clients/wizard/gear/video_gear'
-
-    .wizard-step.network-test{ 'layout-wizard-step' => "#{step+=1}", 'dialog-title' =>  "Test Router & Network", 'dialog-purpose' => "TestRouterNetwork" }
-      .ftuesteps
-      .clearall
-      = render :partial => '/clients/network_test'
+    -if (Rails.application.config.network_test_required)
+      .wizard-step.network-test{ 'layout-wizard-step' => "#{step+=1}", 'dialog-title' =>  "Test Router & Network", 'dialog-purpose' => "TestRouterNetwork" }
+        .ftuesteps
+        .clearall
+        = render :partial => '/clients/network_test'

    .wizard-step.success{ 'layout-wizard-step' => "#{step+=1}", 'dialog-title' =>  "Success!", 'dialog-purpose' => "Success" }
      .ftuesteps
@ -211,8 +211,9 @@
    -if (Rails.application.config.video_available && Rails.application.config.video_available!="none") 
      %a.ftue-stepnumber{'data-step-number' => step+=1}=step+1
      .ftue-step-title Select Video Gear
-    %a.ftue-stepnumber{'data-step-number' => step+=1}=step+1
-    .ftue-step-title Test Router & Network
+    -if (Rails.application.config.network_test_required)
+      %a.ftue-stepnumber{'data-step-number' => step+=1}=step+1
+      .ftue-step-title Test Router & Network
    %a.ftue-stepnumber{'data-step-number' => step+=1}=step+1
    .ftue-step-title Success!

--- a/web/config/application.rb
+++ b/web/config/application.rb
@ -295,7 +295,7 @@ if defined?(Bundler)
    # we have to do this for a while until all www.jamkazam.com cookies are gone,
    # and only .jamkazam.com cookies are around.. 2016?
    config.middleware.insert_before "ActionDispatch::Cookies", "Middlewares::ClearDuplicatedSession"
-
+    config.network_test_required = false
    # how long should the frontend wait for the IO to stabilize before asking for a IO score?
    config.ftue_io_wait_time = 10
    # what should the threshold be for us to say, 'this person can't play at this rate' during the network test
--- a/web/config/initializers/gon.rb
+++ b/web/config/initializers/gon.rb
@ -24,4 +24,5 @@ Gon.global.bugsnag_key = Rails.application.config.bugsnag_key
 Gon.global.bugsnag_notify_release_stages = Rails.application.config.bugsnag_notify_release_stages
 Gon.global.vst_enabled = Rails.application.config.vst_enabled
 Gon.global.chat_opened_by_default = Rails.application.config.chat_opened_by_default
+Gon.global.network_test_required = Rails.application.config.network_test_required
 Gon.global.env = Rails.env