From 59f7f504e86a2a05a35fa89a212ba3198c8ac84e Mon Sep 17 00:00:00 2001 From: Dennis Collinson Date: Thu, 29 Mar 2012 15:13:10 -0700 Subject: [PATCH] Wallpaper Mood --- app/assets/javascripts/app/models/post.js | 3 +- .../javascripts/app/views/post/mood_view.js | 7 +++- .../app/views/template_picker_view.js | 2 +- app/assets/stylesheets/new-templates.css.scss | 4 ++ app/assets/templates/wallpaper-mood.jst.hbs | 10 +++++ features/step_definitions/trumpeter_steps.rb | 42 +++++++++++++------ features/trumpeter.feature | 10 +++++ .../app/views/post/wallpaper_view_spec.js | 14 +++++++ 8 files changed, 76 insertions(+), 16 deletions(-) create mode 100644 app/assets/templates/wallpaper-mood.jst.hbs create mode 100644 spec/javascripts/app/views/post/wallpaper_view_spec.js diff --git a/app/assets/javascripts/app/models/post.js b/app/assets/javascripts/app/models/post.js index 307158662..892571feb 100644 --- a/app/assets/javascripts/app/models/post.js +++ b/app/assets/javascripts/app/models/post.js @@ -107,7 +107,8 @@ app.models.Post = Backbone.Model.extend({ frameMoods : [ "Day", - "Night" + "Night", + "Wallpaper" ], legacyTemplateNames : [ diff --git a/app/assets/javascripts/app/views/post/mood_view.js b/app/assets/javascripts/app/views/post/mood_view.js index e96a6c1ee..424b6dc77 100644 --- a/app/assets/javascripts/app/views/post/mood_view.js +++ b/app/assets/javascripts/app/views/post/mood_view.js @@ -34,4 +34,9 @@ app.views.Post.Day = app.views.Post.Mood.extend({ app.views.Post.Night = app.views.Post.Mood.extend({ mood : "night" -}) \ No newline at end of file +}) + +app.views.Post.Wallpaper = app.views.Post.Mood.extend({ + mood : "wallpaper", + templateName : "wallpaper-mood" +}) diff --git a/app/assets/javascripts/app/views/template_picker_view.js b/app/assets/javascripts/app/views/template_picker_view.js index be2954ae5..938872a52 100644 --- a/app/assets/javascripts/app/views/template_picker_view.js +++ b/app/assets/javascripts/app/views/template_picker_view.js @@ -19,7 +19,7 @@ app.views.TemplatePicker = app.views.Base.extend({ presenter : function() { return _.extend(this.defaultPresenter(), { - templates : _.union(app.models.Post.frameMoods, _.without(app.models.Post.legacyTemplateNames, ["status"])) + templates : _.union(app.models.Post.frameMoods, _.without(app.models.Post.legacyTemplateNames, ["status", "status-with-photo-backdrop", "photo-backdrop", "activity-streams-photo"])) //subtract re-implemented templates }) } }) \ No newline at end of file diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss index f4f65d305..4598f74d6 100644 --- a/app/assets/stylesheets/new-templates.css.scss +++ b/app/assets/stylesheets/new-templates.css.scss @@ -833,4 +833,8 @@ article { //mood posts background-color : $night-background-color; color : $night-text-color; } + + &.wallpaper{ + color : #fff; + } } \ No newline at end of file diff --git a/app/assets/templates/wallpaper-mood.jst.hbs b/app/assets/templates/wallpaper-mood.jst.hbs new file mode 100644 index 000000000..b3949f6c2 --- /dev/null +++ b/app/assets/templates/wallpaper-mood.jst.hbs @@ -0,0 +1,10 @@ +{{#each photos}} +
+
+
+
{{../headline}}
+
{{../body}}
+
+
+
+{{/each}} diff --git a/features/step_definitions/trumpeter_steps.rb b/features/step_definitions/trumpeter_steps.rb index f690e6187..ec57d7d7a 100644 --- a/features/step_definitions/trumpeter_steps.rb +++ b/features/step_definitions/trumpeter_steps.rb @@ -29,14 +29,17 @@ def assert_post_renders_with(mood) find(".post.#{mood.downcase}").should be_present end -def find_image_by_filename(filename) - find("img[src='#{@image_sources[filename]}']") +def get_image_filename(filename) + @image_sources[filename].tap {|src| src.should be_present} end -def store_image_filename(file_name) +def set_image_filename(file_name) @image_sources ||= {} - @image_sources[file_name] = all(".photos img").last["src"] - @image_sources[file_name].should be_present + @image_sources[file_name] = all(".photos img").last["src"].tap {|src| src.should be_present} +end + +def find_image_by_filename(filename) + find("img[src='#{get_image_filename(filename)}']") end def upload_photo(file_name) @@ -47,15 +50,15 @@ def upload_photo(file_name) wait_until { all(".photos img").size == orig_photo_count + 1 } end - store_image_filename(file_name) + set_image_filename(file_name) end When /^I trumpet$/ do visit new_post_path end -When /^I write "([^"]*)"$/ do |text| - fill_in 'text', :with => text +When /^I write "([^"]*)"(?:| with body "([^"]*)")$/ do |headline, body| + fill_in 'text', :with => [headline, body].join("\n") end Then /I mention "([^"]*)"$/ do |text| @@ -105,16 +108,29 @@ Then /^I should see "([^"]*)" in the framer preview$/ do |post_text| within(find(".post")) { page.should have_content(post_text) } end -When /^I select the mood "([^"]*)"$/ do |template_name| - select template_name, :from => 'template' +When /^I select the mood "([^"]*)"$/ do |mood| + select mood, :from => 'template' end -Then /^the post's mood should (?:still |)be "([^"]*)"$/ do |template_name| - assert_post_renders_with(template_name) +Then /^the post's mood should (?:still |)be "([^"]*)"$/ do |mood| + assert_post_renders_with(mood) end When /^"([^"]*)" should be in the post's picture viewer$/ do |file_name| within(".photo_viewer") do find_image_by_filename(file_name).should be_present end -end \ No newline at end of file +end + +Then /^it should be a wallpaper frame with the background "([^"]*)"$/ do |file_name| + assert_post_renders_with("Wallpaper") + find("div.photo-fill")["data-img-src"].should == get_image_filename(file_name) +end + +When /^the frame's headline should be "([^"]*)"$/ do |header_text| + find("header").text.should == header_text +end + +When /^the frame's body should be "([^"]*)"$/ do |body_text| + find("section.body").text.should == body_text +end diff --git a/features/trumpeter.feature b/features/trumpeter.feature index 8177c959a..4e5ea12db 100644 --- a/features/trumpeter.feature +++ b/features/trumpeter.feature @@ -45,6 +45,7 @@ Feature: Creating a new post And I start the framing process Then I should see "This is hella customized" in the framer preview + #### Will test the template picker being ported to JS #### # Then the default mood for the post should be "Wallpaper" # And I should see the image "button.gif" background When I select the mood "Day" @@ -57,3 +58,12 @@ Feature: Creating a new post Then "This is hella customized" should be post 1 And I click the show page link for "This is hella customized" And the post's mood should still be "Day" + + Scenario: The Wallpaper mood + When I write "This is a pithy status" with body "And this is a long body" + And I upload a fixture picture with filename "button.gif" + And I start the framing process + When I select the mood "Wallpaper" + Then it should be a wallpaper frame with the background "button.gif" + And the frame's headline should be "This is a pithy status" + And the frame's body should be "And this is a long body" diff --git a/spec/javascripts/app/views/post/wallpaper_view_spec.js b/spec/javascripts/app/views/post/wallpaper_view_spec.js new file mode 100644 index 000000000..afa84f390 --- /dev/null +++ b/spec/javascripts/app/views/post/wallpaper_view_spec.js @@ -0,0 +1,14 @@ +describe("app.views.Post.Wallpaper", function(){ + beforeEach(function(){ + this.post = factory.post({photos : [factory.photoAttrs({sizes :{large : "http://omgimabackground.com/wow.gif"}})]}) + this.view = new app.views.Post.Wallpaper({model : this.post}) + }) + + describe("rendering", function(){ + it("has the image as the photo-fill", function(){ + this.view.render() + expect(this.view.$(".photo-fill").data("img-src")).toBe("http://omgimabackground.com/wow.gif") //for the cuke + expect(this.view.$(".photo-fill").css("background-image")).toBe("url(http://omgimabackground.com/wow.gif)") + }) + }) +}) \ No newline at end of file