From 3c2e1b17de1387acbd30848e7e123ae6471d3466 Mon Sep 17 00:00:00 2001 From: Seth Call Date: Sun, 6 Jan 2013 20:03:14 -0600 Subject: [PATCH 1/6] * publish deb for jam-web after jenkins build --- jenkins | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/jenkins b/jenkins index 60eddfe68..915aefd9d 100755 --- a/jenkins +++ b/jenkins @@ -5,8 +5,20 @@ echo "starting build..." if [ "$?" = "0" ]; then echo "build succeeded" - - echo "TODO: build debian package" + + if [ ! -z "$PACKAGE" ]; then + echo "publishing ubuntu package (.deb)" + DEBPATH=`find target/deb -name *.deb` + DEBNAME=`basename $DEBPATH` + + curl -f -T $DEBPATH $DEB_SERVER/$DEBNAME + + if [ "$?" != "0" ]; then + echo "deb publish failed" + exit 1 + fi + echo "done publishing deb" + fi else echo "build failed" exit 1 From 0940175f8850364c5860f568019a7cbfba5f27e2 Mon Sep 17 00:00:00 2001 From: Seth Call Date: Sun, 6 Jan 2013 20:31:31 -0600 Subject: [PATCH 2/6] * oops; forgot to add DEB_SERVER decl --- jenkins | 2 ++ 1 file changed, 2 insertions(+) diff --git a/jenkins b/jenkins index 915aefd9d..0acf5a9a9 100755 --- a/jenkins +++ b/jenkins @@ -1,5 +1,7 @@ #!/bin/bash +DEB_SERVER=http://localhost:9010/apt-i386 + echo "starting build..." ./build From b6609eb39c5e46131ae550b418604ca7a1eed6e7 Mon Sep 17 00:00:00 2001 From: Brian Smith Date: Thu, 10 Jan 2013 22:42:26 -0500 Subject: [PATCH 3/6] fixed friend bug --- spec/requests/music_sessions_api_spec.rb | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/spec/requests/music_sessions_api_spec.rb b/spec/requests/music_sessions_api_spec.rb index 4d1e9388d..917a82daf 100644 --- a/spec/requests/music_sessions_api_spec.rb +++ b/spec/requests/music_sessions_api_spec.rb @@ -12,15 +12,7 @@ describe "Music Session API ", :type => :api do end def make_friends(user1, user2) - friendship = Friendship.new() - friendship.user_id = user1.id - friendship.friend_id = user2.id - friendship.save - - friendship = Friendship.new() - friendship.user_id = user2.id - friendship.friend_id = user1.id - friendship.save + Friendship.save(user1, user2) end describe "profile page" do From 57c4078be3f2e7e21a415fde3686d9ef07880e6c Mon Sep 17 00:00:00 2001 From: Jonathon Wilson Date: Thu, 10 Jan 2013 09:08:59 -0700 Subject: [PATCH 4/6] Revisions to FTUE screen 1 --- .../stylesheets/client/jamkazam.css.scss | 3 ++ .../stylesheets/client/screen_common.css.scss | 53 ++++++++++++------- app/views/clients/_ftue1.html.erb | 13 +++-- 3 files changed, 46 insertions(+), 23 deletions(-) diff --git a/app/assets/stylesheets/client/jamkazam.css.scss b/app/assets/stylesheets/client/jamkazam.css.scss index 566c06e08..c18f09c0d 100644 --- a/app/assets/stylesheets/client/jamkazam.css.scss +++ b/app/assets/stylesheets/client/jamkazam.css.scss @@ -21,9 +21,12 @@ body { font-weight: 300; } +b { font-weight: bold; } + a { cursor:pointer; color: $ColorLink; + text-decoration: none; } a:hover { diff --git a/app/assets/stylesheets/client/screen_common.css.scss b/app/assets/stylesheets/client/screen_common.css.scss index b93afebdc..78fdc5b7e 100644 --- a/app/assets/stylesheets/client/screen_common.css.scss +++ b/app/assets/stylesheets/client/screen_common.css.scss @@ -8,6 +8,39 @@ .screen.secondary { border: 1px solid $ColorScreenPrimary; background-color:$ColorScreenBackground; + + .footer button { + margin:1em 0em 1em 1em; + } + + .breadcrumb { + margin-bottom:3em; + } + + .breadcrumb p { + float:left; + } + + p { + margin: 1em; + cursor: pointer; + font-size: 120%; + line-height: 150%; + } + + ul { + margin-left: 2em; + list-style: disc; + } + + li { + margin-bottom:1.5em; + } + + p.current { + font-weight: bold; + } + } .content-head { @@ -70,23 +103,3 @@ width:100%; /*text-align:right;*/ } -.screen.secondary .footer button { - margin:1em 0em 1em 1em; -} - -.screen.secondary .breadcrumb { - margin-bottom:3em; -} - -.screen.secondary .breadcrumb p { - float:left; -} - -.screen.secondary p { - margin: .5em; - cursor: pointer; - font-size: 120%; -} -.screen.secondary p.current { - font-weight: bold; -} diff --git a/app/views/clients/_ftue1.html.erb b/app/views/clients/_ftue1.html.erb index 28280984a..1a21e3856 100644 --- a/app/views/clients/_ftue1.html.erb +++ b/app/views/clients/_ftue1.html.erb @@ -1,10 +1,17 @@
-

Welcome to JamKazam!

+

Audio Gear Settings

<%= render "screen_navigation" %>
-

You'll need appropriate audio gear. Here are some links to where you can buy some.

-

Make sure your audio gear is plugged in, then CONTINUE.

+

If you already have audio gear to get your instrumental or vocal music into your computer, please set up your gear and instrument now. Then click the Next button below. For Windows this will be ASIO-compatible audio devices, and Mac gear will use Core Audio. We strongly recommend using headphones with your gear vs. speakers or powered monitors to avoid feedback problems. If you don't already have this gear handy or are not sure what will work, please use the help links below for some guidance:

+ +
+

+
From f95f30d8273b91f62298d46b0996bacfafe1eaeb Mon Sep 17 00:00:00 2001 From: Jonathon Wilson Date: Fri, 11 Jan 2013 19:46:36 -0700 Subject: [PATCH 5/6] FTUE, screens 2 and 3 --- .../{ftue.js => ftueAudioSelection.js} | 58 +---- app/assets/javascripts/ftueAudioTesting.js | 98 +++++++ app/assets/javascripts/layout.js | 240 +----------------- app/assets/stylesheets/client/ftue.css.scss | 42 +++ app/views/clients/_ftue1.html.erb | 4 +- app/views/clients/_ftue2.html.erb | 38 ++- app/views/clients/_ftue3.html.erb | 55 ++-- app/views/clients/index.html.erb | 8 +- app/views/layouts/client.html.erb | 1 + 9 files changed, 219 insertions(+), 325 deletions(-) rename app/assets/javascripts/{ftue.js => ftueAudioSelection.js} (62%) create mode 100644 app/assets/javascripts/ftueAudioTesting.js create mode 100644 app/assets/stylesheets/client/ftue.css.scss diff --git a/app/assets/javascripts/ftue.js b/app/assets/javascripts/ftueAudioSelection.js similarity index 62% rename from app/assets/javascripts/ftue.js rename to app/assets/javascripts/ftueAudioSelection.js index 04b28b73e..011c97a8b 100644 --- a/app/assets/javascripts/ftue.js +++ b/app/assets/javascripts/ftueAudioSelection.js @@ -1,18 +1,17 @@ /** -* The First-Time User Experience (FTUE) Screen to be shown -* to users who have not set up their audio hardware yet. -* Corresponds to the route #/ftue3 +* FtueAudioSelectionScreen +* Javascript that goes with the screen where initial +* selection of the audio devices takes place. +* Corresponds to /#ftue2 */ (function(context,$) { "use strict"; context.JK = context.JK || {}; - context.JK.FTUEScreen = function(app) { + context.JK.FtueAudioSelectionScreen = function(app) { var logger = context.JK.logger; var jamClient = context.jamClient; - var playbackTestRunning = false; - var recordingTestRunning = false; function beforeShow(data) { loadDevices(); @@ -24,6 +23,7 @@ function loadDevices() { $('#choose-input-audio-device select').empty(); $('#choose-output-audio-device select').empty(); + $('#choose-input-voice-device select').empty(); var optionTemplate = $('#template_audio_device_item').html(); var devices = context.jamClient.GetASIODevices(); var inputOptions = []; @@ -60,6 +60,7 @@ } $('#choose-input-audio-device select').html(inputOptions.join('')); $('#choose-output-audio-device select').html(outputOptions.join('')); + $('#choose-input-voice-device select').html(inputOptions.join('')); } /** @@ -89,45 +90,6 @@ $('#latency-testing p').html("Done."); } - function playbackButtonHandler(evt) { - if (playbackTestRunning) { - $('#playback-testing p').html('Test stopped by user'); - $('#playbackTestingButton').html('Start Playback Test'); - playbackTestRunning = false; - context.jamClient.StopPlayTest(); - } else { - $('#playback-testing p').html('Playback test in progress... Click the button below when things start to sound crappy'); - $('#playbackTestingButton').html('Click when things sound bad...'); - playbackTestRunning = true; - context.jamClient.StartPlayTest('JK.playbackTestComplete'); - } - } - - function playbackTestComplete() { - logger.debug('playbackTestComplete. Arguments:'); - logger.debug(arguments); - $('#playback-testing p').html('Done'); - $('#playbackTestingButton').html('Start Playback Test'); - playbackTestRunning = false; - } - - function recordingButtonHandler(evt) { - if (recordingTestRunning) { - $('#recording-testing p').html('Recording complete.'); - $('#recordingTestingButton').html('Start Recording Test'); - recordingTestRunning = false; - context.jamClient.RecordTestEnd(); - } else { - $('#recording-testing p').html('Recording in progress... Click the button below to stop recording'); - $('#recordingTestingButton').html('Stop Recording'); - recordingTestRunning = true; - context.jamClient.RecordTestBegin(); - } - } - - function recordingPlaybackButtonHandler(evt) { - context.jamClient.RecordTestPlayback(); - } function events() { $('#enableDevices').click(function() { @@ -135,15 +97,12 @@ testLatency(); }); - $('#playbackTestingButton').click(playbackButtonHandler); - $('#recordingTestingButton').click(recordingButtonHandler); - $('#recordingTestPlaybackButton').click(recordingPlaybackButtonHandler); } function initialize() { events(); var screenBindings = { 'beforeShow': beforeShow, 'afterShow': afterShow }; - app.bindScreen('ftue3', screenBindings); + app.bindScreen('ftue2', screenBindings); } // Expose publics @@ -151,7 +110,6 @@ // Expose callbacks for the bridge on the global namespace context.JK.latencyTestingComplete = latencyTestingComplete; - context.JK.playbackTestComplete = playbackTestComplete; return this; }; diff --git a/app/assets/javascripts/ftueAudioTesting.js b/app/assets/javascripts/ftueAudioTesting.js new file mode 100644 index 000000000..cc5b5116f --- /dev/null +++ b/app/assets/javascripts/ftueAudioTesting.js @@ -0,0 +1,98 @@ +/** +* FtueAudioTestingScreen +* Javascript that goes with the screen where +* testing of selected audio devices happens. +* Corresponds to /#ftue3 +*/ +(function(context,$) { + "use strict"; + + context.JK = context.JK || {}; + context.JK.FtueAudioTestingScreen = function(app) { + var logger = context.JK.logger; + var jamClient = context.jamClient; + + var selectors = { + step1: 'div[layout-id="ftue3"] div[data-step="step1"]', + step2: 'div[layout-id="ftue3"] div[data-step="step2"]', + step3: 'div[layout-id="ftue3"] div[data-step="step3"]', + good: 'div[layout-id="ftue3"] div[data-step="good"]', + bad: 'div[layout-id="ftue3"] div[data-step="bad"]', + progress1: '#recordingTestProgress1', + progress1Int: '#___recordingTestProgress1___', + progress2: '#recordingTestProgress2', + progress2Int: '#___recordingTestProgress2___' + }; + + function beforeShow(data) { + $(selectors.step1).show(); + $(selectors.step2).hide(); + $(selectors.step3).hide(); + $(selectors.good).hide(); + $(selectors.bad).hide(); + } + + function afterShow(data) {} + + function runProgressBar(selector, seconds, doneFunction) { + var id = "___" + selector.substr(1) + "___"; + $(selector).html('
'); + $("#" + id).animate({ + width: "400px" + }, seconds * 1000, doneFunction); + } + + function startTestButtonHandler(evt) { + $(selectors.step1).hide(); + $(selectors.step3).hide(); + $(selectors.good).hide(); + $(selectors.bad).hide(); + $(selectors.step2).show(); + runProgressBar(selectors.progress1, 10, good); + context.jamClient.RecordTestBegin(); + } + + function poorAudioButtonHandler(evt) { + $(selectors.progress1Int).stop(); + $(selectors.step2).hide(); + $(selectors.step3).show(); + runProgressBar(selectors.progress2, 10, bad); + //context.jamClient.RecordTestBegin(); + } + + function goodAudioButtonHandler(evt) { + good(); + } + + function good() { + $(selectors.step2).hide(); + $(selectors.step3).hide(); + $(selectors.good).show(); + } + + function bad() { + $(selectors.step3).hide(); + $(selectors.bad).show(); + } + + function events() { + $('.startTestButton').click(startTestButtonHandler); + $('#poorAudioButton').click(poorAudioButtonHandler); + $('#goodAudioButton').click(goodAudioButtonHandler); + } + + function initialize() { + events(); + var screenBindings = { 'beforeShow': beforeShow, 'afterShow': afterShow }; + app.bindScreen('ftue3', screenBindings); + } + + // Expose publics + this.initialize = initialize; + + //context.JK.playbackTestComplete = playbackTestComplete; + + return this; + }; + + })(window,jQuery); \ No newline at end of file diff --git a/app/assets/javascripts/layout.js b/app/assets/javascripts/layout.js index 3e5380646..0b1e8ab0f 100644 --- a/app/assets/javascripts/layout.js +++ b/app/assets/javascripts/layout.js @@ -71,245 +71,7 @@ } function layout() { - width = $(context).width(); - height = $(context).height(); - // TODO - // Work on naming. File is layout, class is Layout, this method - // is layout and every other method starts with 'layoutX'. Perhaps - // a little redundant? - layoutCurtain(width, height); - layoutScreens(width, height); - layoutSidebar(width, height); - layoutHeader(width, height); - layoutNotify(width, height); - } - - function layoutCurtain(screenWidth, screenHeight) { - var curtainStyle = { - width: screenWidth + 'px', - height: screenHeight + 'px' - }; - $('.curtain').css(curtainStyle); - } - - function layoutScreens(screenWidth, screenHeight) { - var previousScreenSelector = '[layout-id="' + previousScreen + '"]'; - var currentScreenSelector = '[layout-id="' + currentScreen + '"]'; - $(currentScreenSelector).show(); - - var width = screenWidth - (2 * opts.gutter + 2 * opts.screenMargin); - var left = -1 * width; - - if (currentScreenSelector === previousScreenSelector) { - left = $(currentScreenSelector).css("left"); - if (left) { - left = left.split("px")[0]; - } - } - $(previousScreenSelector).animate({left: left}, {duration: opts.animationDuration, queue: false}); - sizeScreens(screenWidth, screenHeight, '[layout="screen"]'); - positionOffscreens(screenWidth, screenHeight); - positionOnscreen(screenWidth, screenHeight); - } - - function sizeScreens(screenWidth, screenHeight, selector, immediate) { - var duration = opts.animationDuration; - if (immediate) { - duration = 0; - } - - var width = screenWidth - (2 * opts.gutter + 2 * opts.screenMargin); - if (sidebarVisible) { - width -= (opts.sidebarWidth + 2*opts.gridPadding); - } else { - width -= opts.collapsedSidebar + 2*opts.gridPadding; - width += opts.gutter; // Add back in the right gutter width. - } - var height = screenHeight - opts.headerHeight - (2 * opts.gutter + 2 * opts.screenMargin); - var css = { - width: width, - height: height - }; - var $screens = $(selector); - $screens.animate(css, {duration:duration, queue:false}); - layoutHomeScreen(width, height); - } - - /** - * Postition all screens that are not the current screen. - */ - function positionOffscreens(screenWidth, screenHeight) { - var top = opts.headerHeight + opts.gutter + opts.screenMargin; - var left = -1 * (screenWidth + 2*opts.gutter); - var $screens = $('[layout="screen"]').not('[layout-id="' + currentScreen + '"]'); - $screens.css({ - top: top, - left: left - }); - } - - /** - * Position the current screen - */ - function positionOnscreen(screenWidth, screenHeight, immediate) { - var duration = opts.animationDuration; - if (immediate) { - duration = 0; - } - var top = opts.headerHeight + opts.gutter + opts.screenMargin; - var left = opts.gutter + opts.screenMargin; - var $screen = $('[layout-id="' + currentScreen + '"]'); - $screen.animate({ - top: top, - left: left - }, duration); - } - - function layoutHomeScreen(homeScreenWidth, homeScreenHeight) { - var $grid = $('[layout-grid]'); - var gridWidth = homeScreenWidth; - var gridHeight = homeScreenHeight; - $grid.css({width:gridWidth, height: gridHeight}); - var layout = $grid.attr('layout-grid'); - if (!layout) - return; - var gridRows = layout.split('x')[0]; - var gridCols = layout.split('x')[1]; - - $grid.children().each(function() { - var childPosition = $(this).attr("layout-grid-position"); - var childRow = childPosition.split(',')[1]; - var childCol = childPosition.split(',')[0]; - var childRowspan = $(this).attr("layout-grid-rows"); - var childColspan = $(this).attr("layout-grid-columns"); - var childLayout = me.getCardLayout(gridWidth, gridHeight, gridRows, gridCols, - childRow, childCol, childRowspan, childColspan); - - $(this).animate({ - width: childLayout.width, - height: childLayout.height, - top: childLayout.top, - left: childLayout.left - }, opts.animationDuration); - }); - } - - function layoutSidebar(screenWidth, screenHeight) { - var width = opts.sidebarWidth; - var expanderHeight = $('[layout-sidebar-expander]').height(); - var height = screenHeight - opts.headerHeight - 2 * opts.gutter + expanderHeight; - var right = opts.gutter; - if (!sidebarVisible) { - // Negative right to hide most of sidebar - right = (0 - opts.sidebarWidth) + opts.collapsedSidebar; - } - var top = opts.headerHeight + opts.gutter - expanderHeight; - var css = { - width: width, - height: height, - top: top, - right: right - }; - $('[layout="sidebar"]').animate(css, opts.animationDuration); - layoutPanels(width, height); - if (sidebarVisible) { - $('[layout-panel="collapsed"]').hide(); - $('[layout-panel="expanded"]').show(); - $('[layout-sidebar-expander="hidden"]').hide(); - $('[layout-sidebar-expander="visible"]').show(); - } else { - $('[layout-panel="collapsed"]').show(); - $('[layout-panel="expanded"]').hide(); - $('[layout-sidebar-expander="hidden"]').show(); - $('[layout-sidebar-expander="visible"]').hide(); - } - } - - function layoutPanels(sidebarWidth, sidebarHeight) { - // TODO - don't like the accordian - poor usability. Requires longest mouse - // reach when switching panels. Probably better to do tabs. - if (!sidebarVisible) { - return; - } - var $expandedPanelContents = $('[layout-id="' + expandedPanel + '"] [layout-panel="contents"]'); - var combinedHeaderHeight = $('[layout-panel="contents"]').length * opts.panelHeaderHeight; - var searchHeight = $('.sidebar .search').first().height(); - logger.debug(searchHeight); - var expanderHeight = $('[layout-sidebar-expander]').height(); - var expandedPanelHeight = sidebarHeight - (combinedHeaderHeight + expanderHeight + searchHeight); - $('[layout-panel="contents"]').hide(); - $('[layout-panel="contents"]').css({"height": "1px"}); - $expandedPanelContents.show(); - $expandedPanelContents.animate({"height": expandedPanelHeight + "px"}, opts.animationDuration); - } - - function layoutHeader(screenWidth, screenHeight) { - var width = screenWidth - 2*opts.gutter; - var height = opts.headerHeight - opts.gutter; - var top = opts.gutter; - var left = opts.gutter; - var css = { - width: width + "px", - height: height + "px", - top: top + "px", - left: left + "px" - }; - $('[layout="header"]').css(css); - } - - function layoutNotify(screenWidth, screenHeight) { - var notifyStyle = { - bottom: opts.gutter + opts.notifyGutter + 'px', - left: opts.gutter + opts.notifyGutter + 'px', - height: opts.notifyHeight - 2 * opts.notifyGutter + 'px', - width: screenWidth - 2 * opts.gutter - 2 * opts.notifyGutter + 'px' - }; - $('[layout="notify"]').css(notifyStyle); - } - - function requiredStyles() { - var bodyStyle = { - margin: '0px', - padding: '0px', - overflow: 'hidden' - }; - if (opts.allowBodyOverflow) { - delete bodyStyle.overflow; - } - $('body').css(bodyStyle); - - var layoutStyle = { - position: 'absolute', - margin: '0px', - padding: '0px' - }; - $('[layout]').css(layoutStyle); - $('[layout="notify"]').css({"z-index": "9"}); - $('[layout="panel"]').css({position: 'relative'}); - $('[layout-panel="expanded"] [layout-panel="header"]').css({ - margin: "0px", - padding: "0px", - height: opts.panelHeaderHeight + "px" - }); - $('[layout-grid]').css({ - position: "relative" - }); - $('[layout-grid]').children().css({ - position: "absolute" - }); - var curtainStyle = { - position: "absolute", - margin: '0px', - padding: '0px', - overflow: 'hidden', - zIndex: 100 - }; - $('.curtain').css(curtainStyle); - } - - function hideAll() { - $('[layout]').hide(); - $('[layout="header"]').show(); +g $('[layout="header"]').show(); } diff --git a/app/assets/stylesheets/client/ftue.css.scss b/app/assets/stylesheets/client/ftue.css.scss new file mode 100644 index 000000000..be15eba5e --- /dev/null +++ b/app/assets/stylesheets/client/ftue.css.scss @@ -0,0 +1,42 @@ +/* Custom Styles for the FTUE Screens */ + +@import "client/common.css.scss"; +@charset "UTF-8"; + +div[layout-id="ftue2"] { + .formrow { + position:relative; + clear:both; + border:none; + margin: 12px; + padding:4px; + } + label { + text-align:left; + } + select { + display:block; + position:absolute; + left: 140px; + top: 0px; + } +} + +div[layout-id="ftue3"] { + button { + margin: 0px 2em; + } + + .progressContainer { + margin: 2em; + border: 1px solid #fff; + width: 400px; + height: 10px; + } + + .progressFull { + height: 10px; + width: 2px; + background-color:#0f0; + } +} diff --git a/app/views/clients/_ftue1.html.erb b/app/views/clients/_ftue1.html.erb index 1a21e3856..abf69e557 100644 --- a/app/views/clients/_ftue1.html.erb +++ b/app/views/clients/_ftue1.html.erb @@ -1,7 +1,7 @@
-

Audio Gear Settings

+

Audio Gear Setup

<%= render "screen_navigation" %>
@@ -12,6 +12,6 @@
  • Electric/digital instruments with or without vocals (for guitars, keyboards, etc.)
    • -

    +

    diff --git a/app/views/clients/_ftue2.html.erb b/app/views/clients/_ftue2.html.erb index 20273c3ab..31752fcea 100644 --- a/app/views/clients/_ftue2.html.erb +++ b/app/views/clients/_ftue2.html.erb @@ -1,10 +1,42 @@
    -

    Welcome to JamKazam!

    +

    Audio Gear Settings

    <%= render "screen_navigation" %>
    -

    Next we'll show you how to hook up a cable for a loopback test, so we can test your latency.

    -

    Once your cables are all connected, then CONTINUE.

    +

    Please choose the audio gear you want to use for audio input, chat input, and audio output below. Then play and either sing or speak to ensure that you can hear both your instrument and voice through your headphones. After verifying that you hear your music and voice properly, please click the Next button below. If you don't hear things correctly, please press the Help button below for troubleshooting guidance.

    + +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +

    + + + +

    +
    + + diff --git a/app/views/clients/_ftue3.html.erb b/app/views/clients/_ftue3.html.erb index f921b9d3a..3345abcd4 100644 --- a/app/views/clients/_ftue3.html.erb +++ b/app/views/clients/_ftue3.html.erb @@ -1,45 +1,44 @@
    -

    Welcome to JamKazam!

    +

    Audio Gear Test

    <%= render "screen_navigation" %>
    -
    -

    Step 1: Choose Devices

    - - - +
    +

    We will now test your audio gear to ensure it works and to find its ideal settings. When you are ready, please click the Start Test button below, and be ready to start playing your instrument or singing.

    +
    -
    -

    Latency Testing

    -

    +
    +

    Please play your instrument and/or sing, and listen to the audio. If the quality of the audio becomes poor, please click the Poor Audio button below. This test will last about 45 seconds.

    + +
    -
    -

    Playback Testing

    -

    Click the button below to start a playback test. We'll start with safe settings, and then lower the values for better latency. When things begin to sound bad, click the button again.

    - +
    +

    Please press the Good Audio button when the audio quality improves to an acceptable level.

    + +
    -
    -

    Recording Testing

    -

    When ready, click the button below to enable recording of your audio input. When done, click the button again, and use the other button for playback to see how things sound.

    - - + +
    +

    Congratulations! Your audio gear is now ready to use, and you may create or join sessions with other musicians in JamKazam.

    +
    -

    If everything looks good, then WE'RE DONE.

    +
    +

    We're sorry, but it appears you are not happy with the quality of your audio, so we cannot recommend that you use JamKazam with this audio gear.

    + + +
    +
    +

    + + +

    +
    - diff --git a/app/views/clients/index.html.erb b/app/views/clients/index.html.erb index 1f87d7d36..cbd8ccf80 100644 --- a/app/views/clients/index.html.erb +++ b/app/views/clients/index.html.erb @@ -72,13 +72,15 @@ var sessionScreen = new JK.SessionScreen(jk); sessionScreen.initialize(); - var ftueScreen = new JK.FTUEScreen(jk); - ftueScreen.initialize(); + var ftueAudioSelectionScreen = new JK.FtueAudioSelectionScreen(jk); + ftueAudioSelectionScreen.initialize(); + + var ftueAudioTestingScreen = new JK.FtueAudioTestingScreen(jk); + ftueAudioTestingScreen.initialize(); var testBridgeScreen = new JK.TestBridgeScreen(jk); testBridgeScreen.initialize(); - } else { var landing = new JK.LandingPage(jk); landing.initialize(); diff --git a/app/views/layouts/client.html.erb b/app/views/layouts/client.html.erb index 07500a21d..45ab02314 100644 --- a/app/views/layouts/client.html.erb +++ b/app/views/layouts/client.html.erb @@ -18,6 +18,7 @@ <%= stylesheet_link_tag "client/findSession", media: "all" %> <%= stylesheet_link_tag "client/session", media: "all" %> <%= stylesheet_link_tag "client/search", media: "all" %> + <%= stylesheet_link_tag "client/ftue", media: "all" %> <%= stylesheet_link_tag "client/lato", media: "all" %> <%= include_gon %> <%= javascript_include_tag "application" %> From 76d82f7d01d56330cdfbb7476f55396e5b06faed Mon Sep 17 00:00:00 2001 From: Jonathon Wilson Date: Sat, 12 Jan 2013 12:19:20 -0700 Subject: [PATCH 6/6] Fixes for cucumber tests. Restore big chunk of accidentally deleted layout.js --- app/assets/javascripts/layout.js | 240 +++++++++++++++++- app/views/clients/_ftue2.html.erb | 2 +- .../step_definitions/create_session_steps.rb | 12 + features/support/login_helper.rb | 7 +- 4 files changed, 258 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/layout.js b/app/assets/javascripts/layout.js index 0b1e8ab0f..3e5380646 100644 --- a/app/assets/javascripts/layout.js +++ b/app/assets/javascripts/layout.js @@ -71,7 +71,245 @@ } function layout() { -g $('[layout="header"]').show(); + width = $(context).width(); + height = $(context).height(); + // TODO + // Work on naming. File is layout, class is Layout, this method + // is layout and every other method starts with 'layoutX'. Perhaps + // a little redundant? + layoutCurtain(width, height); + layoutScreens(width, height); + layoutSidebar(width, height); + layoutHeader(width, height); + layoutNotify(width, height); + } + + function layoutCurtain(screenWidth, screenHeight) { + var curtainStyle = { + width: screenWidth + 'px', + height: screenHeight + 'px' + }; + $('.curtain').css(curtainStyle); + } + + function layoutScreens(screenWidth, screenHeight) { + var previousScreenSelector = '[layout-id="' + previousScreen + '"]'; + var currentScreenSelector = '[layout-id="' + currentScreen + '"]'; + $(currentScreenSelector).show(); + + var width = screenWidth - (2 * opts.gutter + 2 * opts.screenMargin); + var left = -1 * width; + + if (currentScreenSelector === previousScreenSelector) { + left = $(currentScreenSelector).css("left"); + if (left) { + left = left.split("px")[0]; + } + } + $(previousScreenSelector).animate({left: left}, {duration: opts.animationDuration, queue: false}); + sizeScreens(screenWidth, screenHeight, '[layout="screen"]'); + positionOffscreens(screenWidth, screenHeight); + positionOnscreen(screenWidth, screenHeight); + } + + function sizeScreens(screenWidth, screenHeight, selector, immediate) { + var duration = opts.animationDuration; + if (immediate) { + duration = 0; + } + + var width = screenWidth - (2 * opts.gutter + 2 * opts.screenMargin); + if (sidebarVisible) { + width -= (opts.sidebarWidth + 2*opts.gridPadding); + } else { + width -= opts.collapsedSidebar + 2*opts.gridPadding; + width += opts.gutter; // Add back in the right gutter width. + } + var height = screenHeight - opts.headerHeight - (2 * opts.gutter + 2 * opts.screenMargin); + var css = { + width: width, + height: height + }; + var $screens = $(selector); + $screens.animate(css, {duration:duration, queue:false}); + layoutHomeScreen(width, height); + } + + /** + * Postition all screens that are not the current screen. + */ + function positionOffscreens(screenWidth, screenHeight) { + var top = opts.headerHeight + opts.gutter + opts.screenMargin; + var left = -1 * (screenWidth + 2*opts.gutter); + var $screens = $('[layout="screen"]').not('[layout-id="' + currentScreen + '"]'); + $screens.css({ + top: top, + left: left + }); + } + + /** + * Position the current screen + */ + function positionOnscreen(screenWidth, screenHeight, immediate) { + var duration = opts.animationDuration; + if (immediate) { + duration = 0; + } + var top = opts.headerHeight + opts.gutter + opts.screenMargin; + var left = opts.gutter + opts.screenMargin; + var $screen = $('[layout-id="' + currentScreen + '"]'); + $screen.animate({ + top: top, + left: left + }, duration); + } + + function layoutHomeScreen(homeScreenWidth, homeScreenHeight) { + var $grid = $('[layout-grid]'); + var gridWidth = homeScreenWidth; + var gridHeight = homeScreenHeight; + $grid.css({width:gridWidth, height: gridHeight}); + var layout = $grid.attr('layout-grid'); + if (!layout) + return; + var gridRows = layout.split('x')[0]; + var gridCols = layout.split('x')[1]; + + $grid.children().each(function() { + var childPosition = $(this).attr("layout-grid-position"); + var childRow = childPosition.split(',')[1]; + var childCol = childPosition.split(',')[0]; + var childRowspan = $(this).attr("layout-grid-rows"); + var childColspan = $(this).attr("layout-grid-columns"); + var childLayout = me.getCardLayout(gridWidth, gridHeight, gridRows, gridCols, + childRow, childCol, childRowspan, childColspan); + + $(this).animate({ + width: childLayout.width, + height: childLayout.height, + top: childLayout.top, + left: childLayout.left + }, opts.animationDuration); + }); + } + + function layoutSidebar(screenWidth, screenHeight) { + var width = opts.sidebarWidth; + var expanderHeight = $('[layout-sidebar-expander]').height(); + var height = screenHeight - opts.headerHeight - 2 * opts.gutter + expanderHeight; + var right = opts.gutter; + if (!sidebarVisible) { + // Negative right to hide most of sidebar + right = (0 - opts.sidebarWidth) + opts.collapsedSidebar; + } + var top = opts.headerHeight + opts.gutter - expanderHeight; + var css = { + width: width, + height: height, + top: top, + right: right + }; + $('[layout="sidebar"]').animate(css, opts.animationDuration); + layoutPanels(width, height); + if (sidebarVisible) { + $('[layout-panel="collapsed"]').hide(); + $('[layout-panel="expanded"]').show(); + $('[layout-sidebar-expander="hidden"]').hide(); + $('[layout-sidebar-expander="visible"]').show(); + } else { + $('[layout-panel="collapsed"]').show(); + $('[layout-panel="expanded"]').hide(); + $('[layout-sidebar-expander="hidden"]').show(); + $('[layout-sidebar-expander="visible"]').hide(); + } + } + + function layoutPanels(sidebarWidth, sidebarHeight) { + // TODO - don't like the accordian - poor usability. Requires longest mouse + // reach when switching panels. Probably better to do tabs. + if (!sidebarVisible) { + return; + } + var $expandedPanelContents = $('[layout-id="' + expandedPanel + '"] [layout-panel="contents"]'); + var combinedHeaderHeight = $('[layout-panel="contents"]').length * opts.panelHeaderHeight; + var searchHeight = $('.sidebar .search').first().height(); + logger.debug(searchHeight); + var expanderHeight = $('[layout-sidebar-expander]').height(); + var expandedPanelHeight = sidebarHeight - (combinedHeaderHeight + expanderHeight + searchHeight); + $('[layout-panel="contents"]').hide(); + $('[layout-panel="contents"]').css({"height": "1px"}); + $expandedPanelContents.show(); + $expandedPanelContents.animate({"height": expandedPanelHeight + "px"}, opts.animationDuration); + } + + function layoutHeader(screenWidth, screenHeight) { + var width = screenWidth - 2*opts.gutter; + var height = opts.headerHeight - opts.gutter; + var top = opts.gutter; + var left = opts.gutter; + var css = { + width: width + "px", + height: height + "px", + top: top + "px", + left: left + "px" + }; + $('[layout="header"]').css(css); + } + + function layoutNotify(screenWidth, screenHeight) { + var notifyStyle = { + bottom: opts.gutter + opts.notifyGutter + 'px', + left: opts.gutter + opts.notifyGutter + 'px', + height: opts.notifyHeight - 2 * opts.notifyGutter + 'px', + width: screenWidth - 2 * opts.gutter - 2 * opts.notifyGutter + 'px' + }; + $('[layout="notify"]').css(notifyStyle); + } + + function requiredStyles() { + var bodyStyle = { + margin: '0px', + padding: '0px', + overflow: 'hidden' + }; + if (opts.allowBodyOverflow) { + delete bodyStyle.overflow; + } + $('body').css(bodyStyle); + + var layoutStyle = { + position: 'absolute', + margin: '0px', + padding: '0px' + }; + $('[layout]').css(layoutStyle); + $('[layout="notify"]').css({"z-index": "9"}); + $('[layout="panel"]').css({position: 'relative'}); + $('[layout-panel="expanded"] [layout-panel="header"]').css({ + margin: "0px", + padding: "0px", + height: opts.panelHeaderHeight + "px" + }); + $('[layout-grid]').css({ + position: "relative" + }); + $('[layout-grid]').children().css({ + position: "absolute" + }); + var curtainStyle = { + position: "absolute", + margin: '0px', + padding: '0px', + overflow: 'hidden', + zIndex: 100 + }; + $('.curtain').css(curtainStyle); + } + + function hideAll() { + $('[layout]').hide(); + $('[layout="header"]').show(); } diff --git a/app/views/clients/_ftue2.html.erb b/app/views/clients/_ftue2.html.erb index 31752fcea..26fce3cdc 100644 --- a/app/views/clients/_ftue2.html.erb +++ b/app/views/clients/_ftue2.html.erb @@ -37,6 +37,6 @@
    - diff --git a/features/step_definitions/create_session_steps.rb b/features/step_definitions/create_session_steps.rb index c8f797a60..a3b178a60 100644 --- a/features/step_definitions/create_session_steps.rb +++ b/features/step_definitions/create_session_steps.rb @@ -14,6 +14,12 @@ When /^I create a public music session$/ do sleep 1 page.find("a[href='#/ftue3']").click sleep 1 + page.find('div[data-step="step1"] button.startTestButton').click + sleep 1 + page.find("#poorAudioButton").click + sleep 1 + page.find("#goodAudioButton").click + sleep 1 page.find("[cucumber-id='ftue-home-link']").click sleep 1 @@ -47,6 +53,12 @@ Then /^I should be in a music session that another musician can find$/ do sleep 1 @second_session.find("a[href='#/ftue3']").click sleep 1 + @second_session.find('div[data-step="step1"] button.startTestButton').click + sleep 1 + @second_session.find("#poorAudioButton").click + sleep 1 + @second_session.find("#goodAudioButton").click + sleep 1 @second_session.find("[cucumber-id='ftue-home-link']").click sleep 1 diff --git a/features/support/login_helper.rb b/features/support/login_helper.rb index b5153b92b..e869e908c 100644 --- a/features/support/login_helper.rb +++ b/features/support/login_helper.rb @@ -2,6 +2,11 @@ module LoginHelper def login(user, context) context.visit root_path + + # When troubleshooting JS errors, sleeping when the UI first comes up is helpful. + # It allows you to bring up a JS console on the test browser and see what the problem is. + # sleep 60 + # verify that the root page is showing context.should have_content "Welcome to JamKazam" @@ -20,4 +25,4 @@ module LoginHelper end end -World(LoginHelper) \ No newline at end of file +World(LoginHelper)