From 08ccda245e254b67fa84f2c056c91817e4491837 Mon Sep 17 00:00:00 2001 From: Seth Call Date: Mon, 6 Jul 2015 14:23:33 -0500 Subject: [PATCH] * wip --- .../assets/javascripts/helpBubbleHelper.js | 14 +-- .../assets/javascripts/react-components.js | 3 +- .../InvidualJamTrackPage.js.jsx.coffee | 52 +++++++++++ .../landing/JamTrackCta.js.jsx.coffee | 60 ++++++++++++ .../landing/PopupYoutubePlayer.js.jsx.coffee | 11 +++ .../stores/SessionStore.js.coffee | 2 +- .../javascripts/web/individual_jamtrack.js | 51 ++++++++++ .../javascripts/web/individual_jamtrack_v1.js | 2 +- web/app/assets/javascripts/web/web.js | 7 ++ .../landings/individual_jamtrack.css.scss | 92 ++++++++++++++++++- .../stylesheets/minimal/minimal.css.scss | 5 +- .../minimal/youtube_player.css.scss | 8 ++ web/app/assets/stylesheets/web/web.css | 1 + web/app/controllers/landings_controller.rb | 18 +++- web/app/controllers/popups_controller.rb | 4 + web/app/helpers/landings_helper.rb | 28 ++++++ .../landings/individual_jamtrack.html.slim | 31 +------ .../landings/individual_jamtrack_v1.html.slim | 2 +- .../landings/product_jamtracks.html.slim | 2 +- web/app/views/layouts/web.html.erb | 3 +- web/app/views/popups/youtube_player.html.slim | 2 + web/config/routes.rb | 1 + .../features/individual_jamtrack_band_spec.rb | 67 -------------- web/spec/features/individual_jamtrack_spec.rb | 56 +++++++---- 24 files changed, 385 insertions(+), 137 deletions(-) create mode 100644 web/app/assets/javascripts/react-components/landing/InvidualJamTrackPage.js.jsx.coffee create mode 100644 web/app/assets/javascripts/react-components/landing/JamTrackCta.js.jsx.coffee create mode 100644 web/app/assets/javascripts/react-components/landing/PopupYoutubePlayer.js.jsx.coffee create mode 100644 web/app/assets/javascripts/web/individual_jamtrack.js create mode 100644 web/app/assets/stylesheets/minimal/youtube_player.css.scss create mode 100644 web/app/helpers/landings_helper.rb create mode 100644 web/app/views/popups/youtube_player.html.slim delete mode 100644 web/spec/features/individual_jamtrack_band_spec.rb diff --git a/web/app/assets/javascripts/helpBubbleHelper.js b/web/app/assets/javascripts/helpBubbleHelper.js index c8ccdc4cf..6333e6529 100644 --- a/web/app/assets/javascripts/helpBubbleHelper.js +++ b/web/app/assets/javascripts/helpBubbleHelper.js @@ -29,6 +29,7 @@ function bigHelpOptions(options) { return {positions: options.positions, offsetParent: options.offsetParent, + width:options.width, spikeGirth: 15, spikeLength: 20, fill: 'white', @@ -68,7 +69,7 @@ helpBubble.jamtrackLandingPreview($preview, $preview.offsetParent()) setTimeout(function() { - helpBubble.jamtrackLandingVideo($video, $video.offsetParent()) + helpBubble.jamtrackLandingVideo($video, $video.closest('.row')) setTimeout(function() { helpBubble.jamtrackLandingCta($ctaButton, $alternativeCta) @@ -101,18 +102,19 @@ } helpBubble.jamtrackLandingPreview = function($element, $offsetParent) { - context.JK.prodBubble($element, 'jamtrack-landing-preview', {}, bigHelpOptions({positions:['right'], offsetParent: $offsetParent})) + console.log("SHOWING THE PREVIEW BUBBLE") + context.JK.prodBubble($element, 'jamtrack-landing-preview', {}, bigHelpOptions({positions:['right', 'top'], offsetParent: $offsetParent, width:250})) } helpBubble.jamtrackLandingVideo = function($element, $offsetParent) { - context.JK.prodBubble($element, 'jamtrack-landing-video', {}, bigHelpOptions({positions:['left'], offsetParent: $offsetParent})) + context.JK.prodBubble($element, 'jamtrack-landing-video', {}, bigHelpOptions({positions:['top', 'right'], offsetParent: $offsetParent})) } helpBubble.jamtrackLandingCta = function($element, $alternativeElement) { - if ($element.visible()) { - context.JK.prodBubble($element, 'jamtrack-landing-cta', {}, bigHelpOptions({positions:['left']})) + if (!$alternativeElement || $element.visible()) { + context.JK.prodBubble($element, 'jamtrack-landing-cta', {}, bigHelpOptions({positions:['top', 'right'], width:240})) } - else { + else if($alternativeElement) { context.JK.prodBubble($alternativeElement, 'jamtrack-landing-cta', {}, bigHelpOptions({positions:['right']})) } } diff --git a/web/app/assets/javascripts/react-components.js b/web/app/assets/javascripts/react-components.js index aa19d1274..14c31af19 100644 --- a/web/app/assets/javascripts/react-components.js +++ b/web/app/assets/javascripts/react-components.js @@ -11,4 +11,5 @@ //= require ./react-components/stores/SessionMediaTracksStore //= require_directory ./react-components/stores //= require_directory ./react-components/mixins -//= require_directory ./react-components \ No newline at end of file +//= require_directory ./react-components +//= require_directory ./react-components/landing \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/landing/InvidualJamTrackPage.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/InvidualJamTrackPage.js.jsx.coffee new file mode 100644 index 000000000..809a273a6 --- /dev/null +++ b/web/app/assets/javascripts/react-components/landing/InvidualJamTrackPage.js.jsx.coffee @@ -0,0 +1,52 @@ +context = window + +@IndividualJamTrackPage = React.createClass({ + + watchVideo: (e) -> + e.preventDefault() + window.open("/popups/youtube/player?id=askHvcCoNfw", 'What Are JamTracks?', 'scrollbars=yes,toolbar=no,status=no,height=282,width=500') + + render: () -> + + header = null + if @props.band + header = "#{@props.jam_track.original_artist} Backing Tracks - Complete Multitracks" + else if @props.generic? + header = "Backing Tracks + Free Amazing App = Unmatched Experience" + else + header = "#{@props.jam_track.name} Backing Track by #{@props.jam_track.original_artist}" + + + `
+
+

{header}

+
+
+
+

Here's Why 20,000 Musicians Love Our Backing Tracks

+

JamKazam gives you a better backing track experience:

+
    +
  • Full multitrack recordings with isolated track for each part
    • +
  • Free JamKazam app to: +
      +
    • Hear just the part you want to play to learn it
      • +
    • Mute the part you want to play, and play live with other parts
      • +
    • Record and mix your live play with unmuted tracks
      • +
    +
    • +
  • Free Internet Service to play this track live online with others
    • +
+ Watch A Video To See How It Works +
+
+

Preview "{this.props.jam_track.name}" Backing Track by {this.props.jam_track.original_artist}

+

Click the play buttons below to preview the master mix and fully isolated tracks of the professional backing track recording. All are included in your backing track.

+
+
+
+
+
+ +
+
` +}) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/landing/JamTrackCta.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/JamTrackCta.js.jsx.coffee new file mode 100644 index 000000000..de888990e --- /dev/null +++ b/web/app/assets/javascripts/react-components/landing/JamTrackCta.js.jsx.coffee @@ -0,0 +1,60 @@ +context = window +rest = context.JK.Rest() + +@JamTrackCta = React.createClass({ + + redeem: (e) -> + e.preventDefault() + + return if @state.processing + + isFree = context.JK.currentUserFreeJamTrack + + rest.addJamtrackToShoppingCart({id: @props.jam_track.id}).done((response) => + if(isFree) + if context.JK.currentUserId? + context.JK.currentUserFreeJamTrack = true # make sure the user sees no more free notices + context.location = '/client#/redeemComplete' + else + # now make a rest call to buy it + context.location = '/client#/redeemSignup' + + else + context.location = '/client#/shoppingCart' + + ).fail((jqXHR, textStatus, errorMessage) => + if jqXHR.status == 422 + errors = JSON.parse(jqXHR.responseText) + cart_errors = errors?.errors?.cart_id + if cart_errors?.length == 1 && cart_errors[0] == 'has already been taken' + context.location = '/client#/shoppingCart' + else + context.JK.app.ajaxError(jqXHR, textStatus, errorMessage) + @setState({processing:false}) + ) + + @setState({processing:true}) + + getInitialState:() -> + {processing: false} + + render: () -> + bandBrowseUrl = "/client?artist=#{this.props.jam_track.original_artist}#/jamtrackBrowse" + + `
+
+ + + + $1.99 value +
+
+
+ or browse all {this.props.band_track_count} AC/DC backing tracks +
+
+
+ or browse all {this.props.all_track_count} backing tracks! +
+
` +}) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/landing/PopupYoutubePlayer.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/PopupYoutubePlayer.js.jsx.coffee new file mode 100644 index 000000000..2d7ef7ce1 --- /dev/null +++ b/web/app/assets/javascripts/react-components/landing/PopupYoutubePlayer.js.jsx.coffee @@ -0,0 +1,11 @@ +context = window + +@PopupYoutubePlayer = React.createClass({ + + render: () -> + video_url = "//www.youtube.com/embed/#{this.props.video_id}" + + `
+ +
` +}) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/stores/SessionStore.js.coffee b/web/app/assets/javascripts/react-components/stores/SessionStore.js.coffee index e8c2422b9..89b9ab5df 100644 --- a/web/app/assets/javascripts/react-components/stores/SessionStore.js.coffee +++ b/web/app/assets/javascripts/react-components/stores/SessionStore.js.coffee @@ -43,7 +43,7 @@ NotificationActions = @NotificationActions this.listenTo(context.AppStore, this.onAppInit) this.listenTo(context.RecordingStore, this.onRecordingChanged) - if gon.global.video_available && gon.global.video_available!="none" + if gon.global.video_available && gon.global.video_available!="none" && context.JK.WebcamViewer? @webcamViewer = new context.JK.WebcamViewer() @webcamViewer.init() @webcamViewer.setVideoOff() diff --git a/web/app/assets/javascripts/web/individual_jamtrack.js b/web/app/assets/javascripts/web/individual_jamtrack.js new file mode 100644 index 000000000..6b0b8fd78 --- /dev/null +++ b/web/app/assets/javascripts/web/individual_jamtrack.js @@ -0,0 +1,51 @@ +(function (context, $) { + + "use strict"; + + context.JK = context.JK || {}; + context.JK.IndividualJamTrack = function (app) { + + var rest = context.JK.Rest(); + var logger = context.JK.logger; + var $page = null; + var $previews = null; + var $jamTracksButton = null; + var $ctaJamTracksButton = null; + + function fetchJamTrack() { + rest.getJamTrackWithArtistInfo({plan_code: gon.jam_track_plan_code}) + .done(function (jam_track) { + + context._.each(jam_track.tracks, function (track) { + + var $element = $('
') + + $previews.append($element); + + new context.JK.JamTrackPreview(app, $element, jam_track, track, {master_shows_duration: true, color:'black', master_adds_line_break: false, preload_master:true}) + + if(track.track_type =='Master') { + context.JK.HelpBubbleHelper.rotateJamTrackLandingBubbles($element.find('.jam-track-preview'), $page.find('.one_by_two .watch-video'), $page.find('.checkout')); + } + }) + + $previews.append('
') + }) + .fail(function () { + app.notify({title: 'Unable to fetch JamTrack', text: "Please refresh the page or try again later."}) + }) + } + function initialize() { + + $page = $('body') + $previews = $page.find('.previews') + $jamTracksButton = $page.find('.browse-jamtracks') + $ctaJamTracksButton = $page.find('.cta-free-jamtrack'); + + context.JK.Tracking.adTrack(app) + fetchJamTrack(); + } + + this.initialize = initialize; + } +})(window, jQuery); \ No newline at end of file diff --git a/web/app/assets/javascripts/web/individual_jamtrack_v1.js b/web/app/assets/javascripts/web/individual_jamtrack_v1.js index ebb720f2c..a9fc6ff38 100644 --- a/web/app/assets/javascripts/web/individual_jamtrack_v1.js +++ b/web/app/assets/javascripts/web/individual_jamtrack_v1.js @@ -3,7 +3,7 @@ "use strict"; context.JK = context.JK || {}; - context.JK.IndividualJamTrack = function (app) { + context.JK.IndividualJamTrackv1 = function (app) { var rest = context.JK.Rest(); var logger = context.JK.logger; diff --git a/web/app/assets/javascripts/web/web.js b/web/app/assets/javascripts/web/web.js index fda0f16c1..561e44bf9 100644 --- a/web/app/assets/javascripts/web/web.js +++ b/web/app/assets/javascripts/web/web.js @@ -65,6 +65,7 @@ //= require web/recordings //= require web/home //= require web/tracking +//= require web/individual_jamtrack //= require web/individual_jamtrack_v1 //= require web/individual_jamtrack_band_v1 //= require web/affiliate_program @@ -75,3 +76,9 @@ //= require JamServer //= require_directory ../dialog //= require everywhere/everywhere +//= require classnames +//= require reflux +//= require react +//= require react_ujs +//= require react-init +//= require react-components diff --git a/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss b/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss index 5999b06cb..c663d91e6 100644 --- a/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss +++ b/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss @@ -1,4 +1,61 @@ -body.web.landing_jamtrack.individual_jamtrack_v1 { +body.web.landing_jamtrack.individual_jamtrack { + + .landing-content { + .header { + text-align:center; + } + p { + width:100%; + } + h1 { + font-size:24px; + } + h2 { + font-size:18px; + color:white; + text-decoration:underline; + margin-bottom:8px; + } + ul { + width: 100%; + margin:5px 0 0; + } + li { + margin-bottom:4px; + } + .row .column { + padding:0 30px; + position:absolute; + float:none; + } + .row:nth-of-type(2) { + margin-top:30px; + position:relative; + } + + .row .column:nth-of-type(1) { + width: 50%; + left:0; + height:100%; + } + .row .column:nth-of-type(2) { + width: 50%; + left:50%; + position:relative; + border-width:0 0 0 1px; + border-color:white; + border-style:solid; + } + } + .watch-video { + position:absolute; + bottom:25px; + text-align:center; + display:block; + width: 50%; + left: 20%; + font-size:16px; + } .previews { margin-top:10px; @@ -23,13 +80,42 @@ body.web.landing_jamtrack.individual_jamtrack_v1 { .jam-track-preview-holder { margin-bottom: 7px; - + float:left; &[data-track-type="Master"] { width: 100%; } &[data-track-type="Track"] { - width: 100%; + width: 50%; + } + } + + .jam-track-preview { + font-size:12px; + } + + .cta-holder { + margin-top:30px; + text-align:center; + .checkout { + display:inline-block; + position:relative; + } + .browse-band { + display:inline-block; + position:relative; + margin-top:20px; + } + .browse-all { + display:inline-block; + position:relative; + margin-top:20px; + } + .value-indicator { + position:absolute; + left: 301px; + top: 19px; + width:80px; } } } \ No newline at end of file diff --git a/web/app/assets/stylesheets/minimal/minimal.css.scss b/web/app/assets/stylesheets/minimal/minimal.css.scss index be342382b..6ee69d0f5 100644 --- a/web/app/assets/stylesheets/minimal/minimal.css.scss +++ b/web/app/assets/stylesheets/minimal/minimal.css.scss @@ -6,10 +6,7 @@ *= require client/content *= require client/ftue *= require icheck/minimal/minimal -*= require minimal/popup -*= require minimal/recording_controls -*= require minimal/media_controls -*= require minimal/minimal_main +*= require_directory . *= require client/metronomePlaybackModeSelect *= require_directory ../client/react-components */ \ No newline at end of file diff --git a/web/app/assets/stylesheets/minimal/youtube_player.css.scss b/web/app/assets/stylesheets/minimal/youtube_player.css.scss new file mode 100644 index 000000000..1425bbd92 --- /dev/null +++ b/web/app/assets/stylesheets/minimal/youtube_player.css.scss @@ -0,0 +1,8 @@ +body.youtube-player { + .video-container { + position:absolute; + width:100%; + height:100%; + } + +} diff --git a/web/app/assets/stylesheets/web/web.css b/web/app/assets/stylesheets/web/web.css index 12c614f5c..b5b4707c4 100644 --- a/web/app/assets/stylesheets/web/web.css +++ b/web/app/assets/stylesheets/web/web.css @@ -34,4 +34,5 @@ *= require web/affiliate_links *= require_directory ../landings *= require icheck/minimal/minimal +*= require_directory ../client/react-components */ \ No newline at end of file diff --git a/web/app/controllers/landings_controller.rb b/web/app/controllers/landings_controller.rb index 6a9eba4db..70fc1bb71 100644 --- a/web/app/controllers/landings_controller.rb +++ b/web/app/controllers/landings_controller.rb @@ -1,5 +1,7 @@ class LandingsController < ApplicationController + include LandingsHelper + respond_to :html def watch_bands @@ -68,8 +70,12 @@ class LandingsController < ApplicationController def individual_jamtrack @no_landing_tag = true - @show_cta_free_jamtrack = true @jam_track = JamTrack.find_by_plan_code("jamtrack-" + params[:plan_code]) + band_jam_track_count = @jam_track.band_jam_track_count + jam_track_count = JamTrack.count + @title = individual_jamtrack_title(false, params[:generic], @jam_track) + @description = individual_jamtrack_desc(false, params[:generic], @jam_track) + @page_data = {jam_track: @jam_track, all_track_count: jam_track_count, band_track_count: band_jam_track_count, band: false, generic: params[:generic]} gon.jam_track_plan_code = params[:plan_code] ? "jamtrack-" + params[:plan_code] : nil gon.generic = params[:generic] render 'individual_jamtrack', layout: 'web' @@ -77,11 +83,15 @@ class LandingsController < ApplicationController def individual_jamtrack_band @no_landing_tag = true - @show_cta_free_jamtrack = true @jam_track = JamTrack.find_by_plan_code("jamtrack-" + params[:plan_code]) + band_jam_track_count = @jam_track.band_jam_track_count + jam_track_count = JamTrack.count + @title = individual_jamtrack_title(true, params[:generic], @jam_track) + @description = individual_jamtrack_desc(true, params[:generic], @jam_track) + @page_data = {jam_track: @jam_track, all_track_count: jam_track_count, band_track_count: band_jam_track_count, band: true, generic: params[:generic]} gon.jam_track_plan_code = params[:plan_code] ? "jamtrack-" + params[:plan_code] : nil - - render 'individual_jamtrack_band', layout: 'web' + gon.generic = params[:generic] + render 'individual_jamtrack', layout: 'web' end def individual_jamtrack_v1 diff --git a/web/app/controllers/popups_controller.rb b/web/app/controllers/popups_controller.rb index 1af9f57de..21c3693b3 100644 --- a/web/app/controllers/popups_controller.rb +++ b/web/app/controllers/popups_controller.rb @@ -10,4 +10,8 @@ class PopupsController < ApplicationController render :layout => "minimal" end + def youtube_player + @video_id = params[:id] + render :layout => "minimal" + end end \ No newline at end of file diff --git a/web/app/helpers/landings_helper.rb b/web/app/helpers/landings_helper.rb new file mode 100644 index 000000000..1c9e6340d --- /dev/null +++ b/web/app/helpers/landings_helper.rb @@ -0,0 +1,28 @@ +module LandingsHelper + + def individual_jamtrack_title(is_band, is_generic, jam_track) + + return 'Free Backing Track - Multitrack' unless jam_track + + if is_band + "#{jam_track.original_artist} - Get a Free Backing Track - Multitrack" + elsif is_generic + "Backing Tracks - Full Multitracks with Unique Features" + else + "#{jam_track.name} - Free Backing Track - Multitrack" + end + end + + def individual_jamtrack_desc(is_band, is_generic, jam_track) + + return "" unless jam_track + + if is_band + "Full multitrack recordings by #{jam_track.original_artist} deliver flexible backing tracks for any instrument or vocals" + elsif is_generic + "Full multitrack recordings plus free app deliver flexible backing tracks for any instrument or vocals with unique features" + else + "Full multitrack recording of \"#{jam_track.name}\" by #{jam_track.original_artist} delivers flexible backing track for any instrument or vocals." + end + end +end diff --git a/web/app/views/landings/individual_jamtrack.html.slim b/web/app/views/landings/individual_jamtrack.html.slim index 545f20585..278dec3f3 100644 --- a/web/app/views/landings/individual_jamtrack.html.slim +++ b/web/app/views/landings/individual_jamtrack.html.slim @@ -1,35 +1,10 @@ - provide(:page_name, 'landing_page full landing_jamtrack individual_jamtrack') -- provide(:description, @jam_track.nil? ? nil : "Preview multi-track JamTrack recording: #{@jam_track.name} by #{@jam_track.original_artist}. Way better than a backing track.") -- provide(:title, @jam_track.nil? ? nil : "Preview JamTrack: #{@jam_track.name} by #{@jam_track.original_artist}") +- provide(:description, @description) +- provide(:title, @title) -.one_by_two - .row - h1 - .row - .column - h1.hidden.individualized - | Preview  - strong.jamtrack_name - br - | JamTrack by  - span.jamtrack_band - - h1.hidden.generic - | Preview One of Our JamTracks - p.prompt Click play buttons to preview tracks. Every JamTrack includes fully isolated tracks for each part of the song! - .previews - a.browse-jamtracks.hidden - .column - h1 See What You Can Do With JamTracks - .video-wrapper - .video-container - iframe src="//www.youtube.com/embed/askHvcCoNfw" frameborder="0" allowfullscreen="allowfullscreen" - br clear="all" - br clear="all" += react_component 'IndividualJamTrackPage', @page_data.to_json javascript: - - $(document).on('JAMKAZAM_READY', function(e, data) { var song = new JK.IndividualJamTrack(data.app); song.initialize(); diff --git a/web/app/views/landings/individual_jamtrack_v1.html.slim b/web/app/views/landings/individual_jamtrack_v1.html.slim index 856c69ec6..21f970f39 100644 --- a/web/app/views/landings/individual_jamtrack_v1.html.slim +++ b/web/app/views/landings/individual_jamtrack_v1.html.slim @@ -29,6 +29,6 @@ javascript: $(document).on('JAMKAZAM_READY', function(e, data) { - var song = new JK.IndividualJamTrack(data.app); + var song = new JK.IndividualJamTrackv1(data.app); song.initialize(); }) diff --git a/web/app/views/landings/product_jamtracks.html.slim b/web/app/views/landings/product_jamtracks.html.slim index acfaeffd1..97196df8e 100644 --- a/web/app/views/landings/product_jamtracks.html.slim +++ b/web/app/views/landings/product_jamtracks.html.slim @@ -38,6 +38,6 @@ javascript: $(document).on('JAMKAZAM_READY', function (e, data) { - var song = new JK.IndividualJamTrack(data.app); + var song = new JK.IndividualJamTrackv1(data.app); song.initialize(); }) \ No newline at end of file diff --git a/web/app/views/layouts/web.html.erb b/web/app/views/layouts/web.html.erb index 9a8965853..db839da5c 100644 --- a/web/app/views/layouts/web.html.erb +++ b/web/app/views/layouts/web.html.erb @@ -51,7 +51,6 @@ <%= link_to image_tag("web/free-jamtrack-cta.png", :alt => "ClICK HERE TO PICK YOUR FIRST JAMTRACK FREE!"), "/client#/jamtrackBrowse", class: "cta-free-jamtrack" %> $1.99 value - <% end %> @@ -95,11 +94,13 @@ JK.currentUserAvatarUrl = JK.resolveAvatarUrl('<%= current_user.photo_url %>'); JK.currentUserName = '<%= current_user.name %>'; JK.currentUserMusician = '<%= current_user.musician %>'; + JK.currentUserFreeJamTrack = <%= APP_CONFIG.one_free_jamtrack_per_user && current_user.has_redeemable_jamtrack %> <% else %> JK.currentUserId = null; JK.currentUserAvatarUrl = null; JK.currentUserName = null; JK.currentUserMusician = null; + JK.currentUserFreeJamTrack = <%= APP_CONFIG.one_free_jamtrack_per_user && anonymous_user.nil? ? false : anonymous_user.has_redeemable_jamtrack%> <% end %> JK.app = JK.JamKazam(); diff --git a/web/app/views/popups/youtube_player.html.slim b/web/app/views/popups/youtube_player.html.slim new file mode 100644 index 000000000..0a3ba90b9 --- /dev/null +++ b/web/app/views/popups/youtube_player.html.slim @@ -0,0 +1,2 @@ +- provide(:page_name, 'youtube-player popup') += react_component 'PopupYoutubePlayer', {video_id: @video_id} \ No newline at end of file diff --git a/web/config/routes.rb b/web/config/routes.rb index 3fec0d1e3..63e0c8ffd 100644 --- a/web/config/routes.rb +++ b/web/config/routes.rb @@ -142,6 +142,7 @@ SampleApp::Application.routes.draw do scope '/popups' do match '/recording-controls', to: 'popups#recording_controls' match '/media-controls', to: 'popups#media_controls' + match '/youtube/player', to: 'popups#youtube_player' end scope '/corp' do diff --git a/web/spec/features/individual_jamtrack_band_spec.rb b/web/spec/features/individual_jamtrack_band_spec.rb deleted file mode 100644 index badfb8583..000000000 --- a/web/spec/features/individual_jamtrack_band_spec.rb +++ /dev/null @@ -1,67 +0,0 @@ -require 'spec_helper' - -describe "Individual JamTrack Band", :js => true, :type => :feature, :capybara_feature => true do - - subject { page } - - before(:all) do - ShoppingCart.delete_all - JamTrackRight.delete_all - JamTrack.delete_all - JamTrackTrack.delete_all - JamTrackLicensor.delete_all - end - - let(:user) { FactoryGirl.create(:user) } - let(:jamtrack_acdc_backinblack) { @jamtrack_acdc_backinblack } - - - - before(:all) do - @jamtrack_acdc_backinblack = FactoryGirl.create(:jam_track, name: 'Back in Black', original_artist: 'AC/DC', sales_region: 'United States', make_track: true, plan_code: 'jamtrack-acdc-backinblack') - end - - - describe "AC/DC Back in Black" do - - it "logged out" do - visit "/landing/jamtracks/band/acdc-backinblack" - - find('.jamtrack_band', text: @jamtrack_acdc_backinblack.original_artist) - jamtrack_acdc_backinblack.jam_track_tracks.each do |track| - if track.master? - find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') - find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:'Master Mix') - else - find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="' + track.instrument.id + '"]') - find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) - end - end - find('a.cta-free-jamtrack')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - find('a.browse-jamtracks')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - - find('a.browse-jamtracks').trigger(:click) - find('h1', text: 'jamtracks') - end - - it "logged in" do - fast_signin(user, "/landing/jamtracks/band/acdc-backinblack") - - find('.jamtrack_band', text: @jamtrack_acdc_backinblack.original_artist) - jamtrack_acdc_backinblack.jam_track_tracks.each do |track| - if track.master? - find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') - find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:'Master Mix') - else - find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="' + track.instrument.id + '"]') - find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) - end - end - find('a.cta-free-jamtrack')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - find('a.browse-jamtracks')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - - find('a.browse-jamtracks').trigger(:click) - find('h1', text: 'jamtracks') - end - end -end diff --git a/web/spec/features/individual_jamtrack_spec.rb b/web/spec/features/individual_jamtrack_spec.rb index 1711554b6..b801392a5 100644 --- a/web/spec/features/individual_jamtrack_spec.rb +++ b/web/spec/features/individual_jamtrack_spec.rb @@ -42,8 +42,7 @@ describe "Individual JamTrack", :js => true, :type => :feature, :capybara_featur it "logged out" do visit "/landing/jamtracks/acdc-backinblack" - find('.jamtrack_name', '"Back in Black"') - find('.jamtrack_band', '"AC/DC"') + find('h1', "#{jamtrack_acdc_backinblack.name} Backing Track by #{jamtrack_acdc_backinblack.original_artist}") jamtrack_acdc_backinblack.jam_track_tracks.each do |track| if track.master? find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') @@ -53,18 +52,26 @@ describe "Individual JamTrack", :js => true, :type => :feature, :capybara_featur find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) end end - find('a.cta-free-jamtrack')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - find('a.browse-jamtracks')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") + find('.browse-band a')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") + find('.browse-all a')['href'].should eq("/client#/jamtrackBrowse") + find('a.cta-free-jamtrack')['href'].should eq("/client#/jamtrackBrowse") + find('a.cta-free-jamtrack').trigger(:click) + find('h1', text: 'check out') + find('h3', text: 'OR SIGN UP USING YOUR EMAIL') + + # now go back, and then try to click checkout again + visit "/landing/jamtracks/acdc-backinblack" + find('a.cta-free-jamtrack').trigger(:click) + find('h1', text: 'check out') + find('h3', text: 'OR SIGN UP USING YOUR EMAIL') + - find('a.browse-jamtracks').trigger(:click) - find('h1', text: 'jamtracks') end it "logged in" do fast_signin(user, "/landing/jamtracks/acdc-backinblack") - find('.jamtrack_name', '"Back in Black"') - find('.jamtrack_band', '"AC/DC"') + find('h1', "#{jamtrack_acdc_backinblack.name} Backing Track by #{jamtrack_acdc_backinblack.original_artist}") jamtrack_acdc_backinblack.jam_track_tracks.each do |track| if track.master? find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') @@ -74,17 +81,14 @@ describe "Individual JamTrack", :js => true, :type => :feature, :capybara_featur find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) end end - find('a.cta-free-jamtrack')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - find('a.browse-jamtracks')['href'].should eq("/client?artist=#{jamtrack_acdc_backinblack.original_artist}#/jamtrackBrowse") - - find('a.browse-jamtracks').trigger(:click) - find('h1', text: 'jamtracks') + find('a.cta-free-jamtrack').trigger(:click) + find('p', text:'Thank you for joining our community, and congratulations on getting your first JamTrack!') end it "generic version" do visit "/landing/jamtracks/acdc-backinblack?generic=true" - find('h1', text: 'Preview One of Our JamTracks') + find('h1', "Backing Tracks + Free Amazing App = Unmatched Experience") jamtrack_acdc_backinblack.jam_track_tracks.each do |track| if track.master? find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') @@ -94,13 +98,27 @@ describe "Individual JamTrack", :js => true, :type => :feature, :capybara_featur find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) end end - find('a.cta-free-jamtrack')['href'].should eq("/client#/jamtrackBrowse") - find('a.browse-jamtracks')['href'].should eq("/client#/jamtrackBrowse") - - find('a.browse-jamtracks').trigger(:click) - find('h1', text: 'jamtracks') + find('a.cta-free-jamtrack').trigger(:click) + find('h1', text: 'check out') + find('h3', text: 'OR SIGN UP USING YOUR EMAIL') + end + it "band version" do + visit "/landing/jamtracks/band/acdc-backinblack" + find('h1', "#{jamtrack_acdc_backinblack.original_artist} Backing Tracks - Complete Multitracks") + jamtrack_acdc_backinblack.jam_track_tracks.each do |track| + if track.master? + find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="other"]') + find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:'Master Mix') + else + find('.jam-track-preview-holder[data-id="' + track.id + '"] img.instrument-icon[data-instrument-id="' + track.instrument.id + '"]') + find('.jam-track-preview-holder[data-id="' + track.id + '"] .instrument-name', text:track.instrument.description) + end + end + find('a.cta-free-jamtrack').trigger(:click) + find('h1', text: 'check out') + find('h3', text: 'OR SIGN UP USING YOUR EMAIL') end end end