From 63e9d7b73f52b46c3582bdc0198de4a7d84d4536 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jonne=20Ha=C3=9F?= <me@jhass.eu>
Date: Fri, 5 Dec 2014 02:34:11 +0100
Subject: [PATCH] Update aspect list checkmarks only after the stream was
 fetched

---
 .../javascripts/app/models/stream_aspects.js  |  9 ++++++++-
 .../javascripts/app/views/aspect_view.js      |  2 +-
 .../app/views/aspects_list_view.js            | 19 ++++++++++++-------
 features/step_definitions/aspects_steps.rb    |  4 ++--
 .../javascripts/app/views/aspect_view_spec.js |  1 -
 .../app/views/aspects_list_view_spec.js       |  1 -
 6 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/app/assets/javascripts/app/models/stream_aspects.js b/app/assets/javascripts/app/models/stream_aspects.js
index 4f03fd3d1..a0115887d 100644
--- a/app/assets/javascripts/app/models/stream_aspects.js
+++ b/app/assets/javascripts/app/models/stream_aspects.js
@@ -21,7 +21,14 @@ app.models.StreamAspects = app.models.Stream.extend({
     var url = this.url();
     var ids = this.aspects_ids;
     this.deferred = this.items.fetch(this._fetchOpts({url : url, data : { 'a_ids': ids }}))
-      .done(_.bind(this.triggerFetchedEvents, this));
+      .done(_.bind(this.fetchDone, this));
+  },
+
+  fetchDone: function() {
+    this.triggerFetchedEvents();
+    if (app.aspects) {
+      app.aspects.trigger('aspectStreamFetched');
+    }
   }
 });
 // @license-end
diff --git a/app/assets/javascripts/app/views/aspect_view.js b/app/assets/javascripts/app/views/aspect_view.js
index 3cef67458..982301370 100644
--- a/app/assets/javascripts/app/views/aspect_view.js
+++ b/app/assets/javascripts/app/views/aspect_view.js
@@ -14,7 +14,7 @@ app.views.Aspect = app.views.Base.extend({
   toggleAspect: function(evt) {
     if (evt) { evt.preventDefault(); };
     this.model.toggleSelected();
-    this.$el.find('.icons-check_yes_ok').toggleClass('selected');
+
     app.router.aspects_stream();
   },
 
diff --git a/app/assets/javascripts/app/views/aspects_list_view.js b/app/assets/javascripts/app/views/aspects_list_view.js
index ea8d321bf..60416567c 100644
--- a/app/assets/javascripts/app/views/aspects_list_view.js
+++ b/app/assets/javascripts/app/views/aspects_list_view.js
@@ -12,6 +12,7 @@ app.views.AspectsList = app.views.Base.extend({
   initialize: function() {
     this.collection.on('change', this.toggleSelector, this);
     this.collection.on('change', this.updateStreamTitle, this);
+    this.collection.on('aspectStreamFetched', this.updateAspectList, this);
   },
 
   postRenderTemplate: function() {
@@ -30,17 +31,10 @@ app.views.AspectsList = app.views.Base.extend({
   toggleAll: function(evt) {
     if (evt) { evt.preventDefault(); };
 
-    var aspects = this.$('li:not(:last)')
     if (this.collection.allSelected()) {
       this.collection.deselectAll();
-      aspects.each(function(i){
-        $(this).find('.icons-check_yes_ok').removeClass('selected');
-      });
     } else {
       this.collection.selectAll();
-      aspects.each(function(i){
-        $(this).find('.icons-check_yes_ok').addClass('selected');
-      });
     }
 
     this.toggleSelector();
@@ -60,6 +54,17 @@ app.views.AspectsList = app.views.Base.extend({
     $('.stream_title').text(this.collection.toSentence());
   },
 
+  updateAspectList: function() {
+    this.collection.each(function(aspect) {
+      var element = this.$("li[data-aspect_id="+aspect.get('id')+"]");
+      if (aspect.get('selected')) {
+        element.find('.icons-check_yes_ok').addClass('selected');
+      } else {
+        element.find('.icons-check_yes_ok').removeClass('selected');
+      }
+    });
+  },
+
   hideAspectsList: function() {
     this.$el.empty();
   },
diff --git a/features/step_definitions/aspects_steps.rb b/features/step_definitions/aspects_steps.rb
index a151df7f0..759361f62 100644
--- a/features/step_definitions/aspects_steps.rb
+++ b/features/step_definitions/aspects_steps.rb
@@ -91,14 +91,14 @@ end
 Then /^I should see "([^"]*)" aspect selected$/ do |aspect_name|
   aspect = @me.aspects.where(:name => aspect_name).first
   within("#aspects_list") do
-    page.should have_css "li[data-aspect_id='#{aspect.id}'] .selected"
+    current_scope.should have_css "li[data-aspect_id='#{aspect.id}'] .selected"
   end
 end
 
 Then /^I should see "([^"]*)" aspect unselected$/ do |aspect_name|
   aspect = @me.aspects.where(:name => aspect_name).first
   within("#aspects_list") do
-    page.should have_no_css "li[data-aspect_id='#{aspect.id}'] .selected"
+    current_scope.should have_no_css "li[data-aspect_id='#{aspect.id}'] .selected"
   end
 end
 
diff --git a/spec/javascripts/app/views/aspect_view_spec.js b/spec/javascripts/app/views/aspect_view_spec.js
index 1247d6ad6..a69792092 100644
--- a/spec/javascripts/app/views/aspect_view_spec.js
+++ b/spec/javascripts/app/views/aspect_view_spec.js
@@ -28,7 +28,6 @@ describe("app.views.Aspect", function(){
       it('it should deselect the aspect', function(){
         this.view.$el.children('a.selectable').trigger('click');
         expect(this.view.toggleAspect).toHaveBeenCalled();
-        expect(this.view.$el.children('.icons-check_yes_ok').hasClass('selected')).toBeFalsy();
         expect(app.router.aspects_stream).toHaveBeenCalled();
       });
 
diff --git a/spec/javascripts/app/views/aspects_list_view_spec.js b/spec/javascripts/app/views/aspects_list_view_spec.js
index e6bd915ec..6c18e3490 100644
--- a/spec/javascripts/app/views/aspects_list_view_spec.js
+++ b/spec/javascripts/app/views/aspects_list_view_spec.js
@@ -48,7 +48,6 @@ describe("app.views.AspectsList", function(){
 
         it('should show all the aspects selected', function(){
           expect(this.view.toggleAll).toHaveBeenCalled();
-          expect(this.view.$('.selected').length).toBe(3);
         });
 
         it('should show \'Deselect all\' link', function(){