VRFS-2701 wip adding recording sources

web/app/assets/javascripts/accounts_profile_samples.js

@@ -25,18 +25,12 @@
     var $twitterUsername = $screen.find('#twitter-username');
 
     // performance samples
-    var $soundCloudRecordingUrl = $screen.find('#soundcloud-recording');
-    var $youTubeVideoUrl = $screen.find('#youtube-video');
-
     var $jamkazamSampleList = $screen.find('.samples.jamkazam');
     var $soundCloudSampleList = $screen.find('.samples.soundcloud');
     var $youTubeSampleList = $screen.find('.samples.youtube');
 
     // buttons
     var $btnAddJkRecording = $screen.find('#btn-add-jk-recording');
-    var $btnAddSoundCloudRecording = $screen.find('#btn-add-soundcloud-recording');
-    var $btnAddYouTubeVideo = $screen.find('#btn-add-youtube-video');
-
     var $btnCancel = $screen.find('#account-edit-profile-cancel');
     var $btnBack = $screen.find('#account-edit-profile-back');
     var $btnSubmit = $screen.find('#account-edit-profile-submit');
@@ -102,7 +96,7 @@
 
       // JamKazam recordings
       var samples = profileUtils.jamkazamSamples(user.performance_samples);
-      if (samples) {
+      if (samples && samples.length > 0) {
         $.each(samples, function(index, val) {
 
         });
@@ -110,7 +104,7 @@
 
       // SoundCloud recordings
       samples = profileUtils.soundCloudSamples(user.performance_samples);
-      if (samples) {
+      if (samples && samples.length > 0) {
         $.each(samples, function(index, val) {
 
         });
@@ -118,9 +112,9 @@
 
       // YouTube videos
       samples = profileUtils.youTubeSamples(user.performance_samples);
-      if (samples) {
+      if (samples && samples.length > 0) {
         $.each(samples, function(index, val) {
-
+          
         });
       }
     }
@@ -200,13 +194,13 @@
       addPerformanceSamples(ps, $soundCloudSampleList, performanceSampleTypes.SOUNDCLOUD.description);
       addPerformanceSamples(ps, $youTubeSampleList, performanceSampleTypes.YOUTUBE.description);
 
-      // api.updateUser({
-      //   website: $website.val(),
-      //   online_presences: op,
-      //   performance_samples: ps
-      // })
-      // .done(postUpdateProfileSuccess)
-      // .fail(postUpdateProfileFailure);
+      api.updateUser({
+        website: $website.val(),
+        online_presences: op,
+        performance_samples: ps
+      })
+      .done(postUpdateProfileSuccess)
+      .fail(postUpdateProfileFailure);
     }
 
     function postUpdateProfileSuccess(response) {

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

@@ -174,3 +174,6 @@ context.JK.RecordingSourceValidator = class RecordingSourceValidator extends Sit
       src_data['url'] == url
     0 < vals.length
 
+  recordingSources: () =>
+    @recording_sources
+

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

@@ -31,8 +31,10 @@
       }
     }
 
-    .sample-list {
-      height: inherit;
+    div.sample-list {
+      height: 250px;
+      width: 250px;
+      border: 2px solid #ccc;
       overflow: auto;
     }
   }

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

@@ -74,21 +74,18 @@
           <hr>
 
           <div>
+
             <div class="left samples jamkazam">
               <label>JamKazam Recordings:</label>
               <div class="left">
                 <a id="btn-add-jk-recording" class="button-grey">BROWSE</a>
               </div>
-              <div class="clearall"></div>
+              <div class="clearall"></div><br/>
               <div class="sample-list">
-                <table>
-                  <tr data-attr-id='12345' data-attr-name='Test Recording' data-attr-url="http://test.url">
-                    <td>Test Recording</td>
-                    <td>X</td>
-                  </tr>
-                </table>
+                &nbsp;
               </div>
             </div>
+
             <div class="left samples soundcloud">
               <label>SoundCloud Recordings (URL):</label>
               <div id="rec_soundcloud_validator" class="left sample site_validator">
@@ -98,14 +95,10 @@
               </div>
               <div class="clearall"></div>
               <div class="sample-list">
-                <table>
-                  <tr data-attr-id='12345' data-attr-name='Test Recording' data-attr-url="http://test.url">
-                    <td>Test Recording</td>
-                    <td>X</td>
-                  </tr>
-                </table>
+                &nbsp;
               </div>
             </div>
+
             <div class="left samples youtube">
               <label>YouTube Videos (URL):</label>
               <div id="rec_youtube_validator" class="left sample site_validator">
@@ -115,22 +108,18 @@
               </div>
               <div class="clearall"></div>
               <div class="sample-list">
-                <table>
-                  <tr data-attr-id='12345' data-attr-name='Test Recording' data-attr-url="http://test.url">
-                    <td>Test Recording</td>
-                    <td>X</td>
-                  </tr>
-                </table>
+                &nbsp;
               </div>
             </div>
+
           </div>
 
           <div class="clearall"></div>
           <br/><br/>
 
           <div class="right field actions">
-            <a id="account-edit-profile-cancel" class="button-grey">CANCEL</a>&nbsp;&nbsp;
-            <a id="account-edit-profile-back" class="button-grey">BACK</a>&nbsp;&nbsp;
+            <a id="account-edit-profile-cancel" class="button-grey">CANCEL</a>&nbsp;
+            <a id="account-edit-profile-back" class="button-grey">BACK</a>&nbsp;
             <a id="account-edit-profile-submit" class="button-orange">SAVE &amp; FINISH</a>
           </div>
 
@@ -152,6 +141,12 @@
       }
       initialized = true;
 
+      var $screen = $('#account-profile-samples');
+      var $btnAddSoundCloudRecording = $screen.find('#btn-add-soundcloud-recording');
+      var $btnAddYouTubeVideo = $screen.find('#btn-add-youtube-video');
+      var $soundCloudSampleList = $screen.find('.samples.soundcloud');
+      var $youTubeSampleList = $screen.find('.samples.youtube');
+
       setTimeout(function() {
         window.urlValidator = new JK.SiteValidator('url', userNameSuccessCallback, userNameFailCallback);
         urlValidator.init();
@@ -177,13 +172,30 @@
         window.twitterValidator = new JK.SiteValidator('twitter', userNameSuccessCallback, userNameFailCallback);
         twitterValidator.init();
 
-        window.soundCloudRecordingValidator = new JK.SiteValidator('rec_soundcloud', userNameSuccessCallback, userNameFailCallback);
+        window.soundCloudRecordingValidator = new JK.SiteValidator('rec_soundcloud', siteSuccessCallback, siteFailCallback);
         soundCloudRecordingValidator.init();
 
-        window.youTubeRecordingValidator = new JK.SiteValidator('rec_youtube', userNameSuccessCallback, userNameFailCallback);
+        window.youTubeRecordingValidator = new JK.SiteValidator('rec_youtube', siteSuccessCallback, siteFailCallback);
         youTubeRecordingValidator.init();
       }, 1);
 
+      $btnAddSoundCloudRecording.click(function(evt) {
+        evt.preventDefault();
+        console.log("IN ADD");
+        if (!$('#rec_soundcloud_validator').hasClass('error')) {
+          console.log("NO ERROR");
+          var recordingSources = [];//window.soundCloudRecordingValidator.recordingSources();
+          console.log("recordingSources=%o", recordingSources);
+          if (recordingSources && recordingSources.length > 0) {
+            var $sampleList = $soundCloudSampleList.find('.sample-list');
+            var addedRecording = recordingSources[recordingSources.length-1];
+            $sampleList.append('<div class="recording-row left" data-recording-id="' + addedRecording.recording_id + '">');
+            $sampleList.append(addedRecording.url);
+            $sampleList.append('</div>');
+          }
+        }
+      });
+
       function userNameSuccessCallback($inputDiv) {
         $inputDiv.removeClass('error');
         $inputDiv.find('.error-text').remove();