diff --git a/app/assets/javascripts/app/models/post/interactions.js b/app/assets/javascripts/app/models/post/interactions.js index fdf38e959e06dbe169b6e884ecc359ad9c36d375..8f15fc33cf1387a28e52dc25d2452e295e09e1cf 100644 --- a/app/assets/javascripts/app/models/post/interactions.js +++ b/app/assets/javascripts/app/models/post/interactions.js @@ -102,7 +102,7 @@ app.models.Post.Interactions = Backbone.Model.extend({ this.post.reshare().save() .done(function(reshare) { - app.flashMessages.success(Diaspora.I18n.t("reshares.successful")); + app.flashMessages.success(Diaspora.I18n.t("reshares.successful")); interactions.reshares.add(reshare); if (app.stream && /^\/(?:stream|activity|aspects)/.test(app.stream.basePath())) { app.stream.addNow(reshare); diff --git a/app/assets/stylesheets/_flash_messages.scss b/app/assets/stylesheets/_flash_messages.scss index 99d494a7a787b262759a580ba2b08f4d34f187dc..42ce1b4a1afcc9d6a39603992be1d1302b503275 100644 --- a/app/assets/stylesheets/_flash_messages.scss +++ b/app/assets/stylesheets/_flash_messages.scss @@ -1,4 +1,4 @@ -#flash-body { +.flash-body { left: 0; position: fixed; text-align: center; @@ -7,9 +7,9 @@ width: 100%; &.expose { @include animation(expose, 10s) } - #flash-message { + .flash-message { border-radius: 0; - box-shadow: $card-shadow; + box-shadow: 0 1px 4px rgba(0,0,0,0.8); display: inline-block; font-weight: bold; max-width: 800px; diff --git a/app/assets/stylesheets/animations.scss b/app/assets/stylesheets/animations.scss index f42ff32ef78c8fa3ecdb8dad90bdf3e0ce398519..52171102f299469f5e41043af467c98b990287db 100644 --- a/app/assets/stylesheets/animations.scss +++ b/app/assets/stylesheets/animations.scss @@ -1,8 +1,8 @@ // flash message animations - header height is about 50px @keyframes expose { 0% { top: -100px; } - 15% { top: 44px; } - 85% { top: 44px; } + 12% { top: 50px; } + 88% { top: 50px; } 100% { top: -100px; } } diff --git a/app/assets/templates/flash_messages_tpl.jst.hbs b/app/assets/templates/flash_messages_tpl.jst.hbs index efe61b41cd74e638fe8176e490b17ece3cefcf1a..109987147e8054778d3e35652fe138d3fcb1e25c 100644 --- a/app/assets/templates/flash_messages_tpl.jst.hbs +++ b/app/assets/templates/flash_messages_tpl.jst.hbs @@ -1,5 +1,5 @@ -<div id="flash-body" class="expose"> - <div id="flash-message" class="alert {{ alertLevel }}"> +<div class="flash-body expose"> + <div class="flash-message alert {{ alertLevel }}"> {{ message }} </div> </div> diff --git a/app/helpers/layout_helper.rb b/app/helpers/layout_helper.rb index 84eb4c0694f23c9e23951c12a4608fa47e3b2bd5..3dab764f760b00a2b93e5d306f861e12d9924ec7 100644 --- a/app/helpers/layout_helper.rb +++ b/app/helpers/layout_helper.rb @@ -67,15 +67,9 @@ module LayoutHelper def flash_messages flash.map do |name, msg| - klass = if name == "alert" - "warning" - elsif name == "error" - "danger" - else - "success" - end - content_tag(:div, msg, id: "flash-body", class: "expose") do - content_tag(:div, msg, id: "flash-message", class: "message alert alert-#{klass}") + klass = flash_class name + content_tag(:div, msg, class: "flash-body expose") do + content_tag(:div, msg, class: "flash-message message alert alert-#{klass}") end end.join(' ').html_safe end diff --git a/app/helpers/sessions_helper.rb b/app/helpers/sessions_helper.rb index 74f5695e73c585e5e94337953cf8d5e25f769467..65a9bdaf452996972a09ddb2555802909d9b1f71 100644 --- a/app/helpers/sessions_helper.rb +++ b/app/helpers/sessions_helper.rb @@ -17,6 +17,6 @@ module SessionsHelper end def flash_class(name) - {notice: "success", alert: "warning", error: "danger"}[name.to_sym] + {notice: "success", alert: "danger", error: "danger"}[name.to_sym] end end diff --git a/app/views/sessions/new.mobile.haml b/app/views/sessions/new.mobile.haml index 0ae8bba47fc485a6581a953c83437cf3291f7c34..799839fa57befaaea44880bb1179b599d86f67ba 100644 --- a/app/views/sessions/new.mobile.haml +++ b/app/views/sessions/new.mobile.haml @@ -10,7 +10,7 @@ #main_stream.stream - flash.each do |name, msg| .expose#flash-container - #flash-message{class: "message alert alert-#{flash_class name}"} + .flash-message{class: "message alert alert-#{flash_class name}"} = msg #login_form diff --git a/features/support/application_cuke_helpers.rb b/features/support/application_cuke_helpers.rb index 95e100120e1a3c30280374856473f747c74e6a13..0078d61fc62779dc0ad9ffe09a92c941de3295a0 100644 --- a/features/support/application_cuke_helpers.rb +++ b/features/support/application_cuke_helpers.rb @@ -8,7 +8,7 @@ module ApplicationCukeHelpers end def flash_message_alert? - flash_message(selector: "warning").visible? + flash_message(selector: "danger").visible? end def flash_message_containing?(text) @@ -18,7 +18,7 @@ module ApplicationCukeHelpers def flash_message(opts={}) selector = opts.delete(:selector) selector &&= ".alert-#{selector}" - find(selector || "#flash-message", {match: :first}.merge(opts)) + find(selector || ".flash-message", {match: :first}.merge(opts)) end def confirm_form_validation_error(element) diff --git a/spec/javascripts/app/views/aspect_create_view_spec.js b/spec/javascripts/app/views/aspect_create_view_spec.js index cef1acf3ff59d3b2c1f93e349fae65ea96e80c6c..a99e4d1957a59c95c2d3762edf3ebcf10b5f1ab4 100644 --- a/spec/javascripts/app/views/aspect_create_view_spec.js +++ b/spec/javascripts/app/views/aspect_create_view_spec.js @@ -117,7 +117,7 @@ describe("app.views.AspectCreate", function() { it("should display a flash message", function() { this.view.createAspect(); jasmine.Ajax.requests.mostRecent().respondWith(this.response); - expect(this.view.$("#flash-message")).toBeSuccessFlashMessage( + expect(this.view.$(".flash-message")).toBeSuccessFlashMessage( Diaspora.I18n.t("aspects.create.success", {name: "new name"}) ); }); @@ -140,7 +140,7 @@ describe("app.views.AspectCreate", function() { it("should display a flash message", function() { this.view.createAspect(); jasmine.Ajax.requests.mostRecent().respondWith(this.response); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage( + expect(this.view.$(".flash-message")).toBeErrorFlashMessage( Diaspora.I18n.t("aspects.create.failure") ); }); diff --git a/spec/javascripts/app/views/aspect_membership_view_spec.js b/spec/javascripts/app/views/aspect_membership_view_spec.js index 9e8d2ed0ac27c2a77717fa5f8234ce84e35f6cbe..536834a9eafcf866d8fe0aecea64d2a59192f9c3 100644 --- a/spec/javascripts/app/views/aspect_membership_view_spec.js +++ b/spec/javascripts/app/views/aspect_membership_view_spec.js @@ -38,7 +38,7 @@ describe("app.views.AspectMembership", function(){ this.newAspect.trigger('click'); jasmine.Ajax.requests.mostRecent().respondWith(success); - expect(this.view.$("#flash-message")).toBeSuccessFlashMessage( + expect(this.view.$(".flash-message")).toBeSuccessFlashMessage( Diaspora.I18n.t("aspect_dropdown.started_sharing_with", {name: this.personName}) ); }); @@ -58,7 +58,7 @@ describe("app.views.AspectMembership", function(){ this.newAspect.trigger('click'); jasmine.Ajax.requests.mostRecent().respondWith(resp_fail); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage( + expect(this.view.$(".flash-message")).toBeErrorFlashMessage( Diaspora.I18n.t("aspect_dropdown.error", {name: this.personName}) ); }); @@ -82,7 +82,7 @@ describe("app.views.AspectMembership", function(){ this.oldAspect.trigger('click'); jasmine.Ajax.requests.mostRecent().respondWith(success); - expect(this.view.$("#flash-message")).toBeSuccessFlashMessage( + expect(this.view.$(".flash-message")).toBeSuccessFlashMessage( Diaspora.I18n.t("aspect_dropdown.stopped_sharing_with", {name: this.personName}) ); }); @@ -102,7 +102,7 @@ describe("app.views.AspectMembership", function(){ this.oldAspect.trigger('click'); jasmine.Ajax.requests.mostRecent().respondWith(resp_fail); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage( + expect(this.view.$(".flash-message")).toBeErrorFlashMessage( Diaspora.I18n.t("aspect_dropdown.error_remove", {name: this.personName}) ); }); diff --git a/spec/javascripts/app/views/comment_stream_view_spec.js b/spec/javascripts/app/views/comment_stream_view_spec.js index 06e2e4ae52277af6e7446e7bbc25d9ad386bee7d..7578f7e5e3b03e5f956a5350b56bfd998f685e4f 100644 --- a/spec/javascripts/app/views/comment_stream_view_spec.js +++ b/spec/javascripts/app/views/comment_stream_view_spec.js @@ -61,7 +61,7 @@ describe("app.views.CommentStream", function(){ this.request.respondWith({status: 500}); expect(this.view.$(".comment-content p").text()).not.toEqual("a new comment"); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage("posting failed!"); + expect(this.view.$(".flash-message")).toBeErrorFlashMessage("posting failed!"); }); }); diff --git a/spec/javascripts/app/views/contact_view_spec.js b/spec/javascripts/app/views/contact_view_spec.js index a3390c305a1fb4ac9dbb402f5e9486a3ce272c86..57acbd406e691bfea9f77f16c96337a8c38bd164 100644 --- a/spec/javascripts/app/views/contact_view_spec.js +++ b/spec/javascripts/app/views/contact_view_spec.js @@ -88,7 +88,7 @@ describe("app.views.Contact", function(){ jasmine.Ajax.requests.mostRecent().respondWith({ status: 400 // fail }); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage( + expect(this.view.$(".flash-message")).toBeErrorFlashMessage( Diaspora.I18n.t( "contacts.error_add", {name: this.model.get("person").name} ) ); }); @@ -151,7 +151,7 @@ describe("app.views.Contact", function(){ jasmine.Ajax.requests.mostRecent().respondWith({ status: 400 // fail }); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage( + expect(this.view.$(".flash-message")).toBeErrorFlashMessage( Diaspora.I18n.t( "contacts.error_remove", {name: this.model.get("person").name}) ); }); diff --git a/spec/javascripts/app/views/flash_messages_view-spec.js b/spec/javascripts/app/views/flash_messages_view-spec.js index 4c5c31b9a80d54304fcea156d0e51b48d9bb3d6d..bcae20b2c0d98839f22771bbdbfe23d802f6558d 100644 --- a/spec/javascripts/app/views/flash_messages_view-spec.js +++ b/spec/javascripts/app/views/flash_messages_view-spec.js @@ -13,21 +13,21 @@ describe("app.views.FlashMessages", function(){ describe("render", function(){ beforeEach(function(){ - spec.content().html("<div id='flash-container'/>"); - flashMessages = new app.views.FlashMessages({ el: $("#flash-container") }); + spec.content().html("<div class='flash-container'/>"); + flashMessages = new app.views.FlashMessages({ el: $(".flash-container") }); }); it("renders a success message", function(){ flashMessages.success("success!"); - expect(flashMessages.$("#flash-body")).toHaveClass("expose"); - expect($("#flash-message")).toHaveClass("alert-success"); - expect($("#flash-message").text().trim()).toBe("success!"); + expect(flashMessages.$(".flash-body")).toHaveClass("expose"); + expect($(".flash-message")).toHaveClass("alert-success"); + expect($(".flash-message").text().trim()).toBe("success!"); }); it("renders an error message", function(){ flashMessages.error("error!"); - expect(flashMessages.$("#flash-body")).toHaveClass("expose"); - expect($("#flash-message")).toHaveClass("alert-danger"); - expect($("#flash-message").text().trim()).toBe("error!"); + expect(flashMessages.$(".flash-body")).toHaveClass("expose"); + expect($(".flash-message")).toHaveClass("alert-danger"); + expect($(".flash-message").text().trim()).toBe("error!"); }); }); }); diff --git a/spec/javascripts/app/views/pod_entry_view_spec.js b/spec/javascripts/app/views/pod_entry_view_spec.js index 592ea85306df69c2e41fb9be1c15fd05667ee279..35006f2b2606c3b7c32c4310f929945cfb4ceef9 100644 --- a/spec/javascripts/app/views/pod_entry_view_spec.js +++ b/spec/javascripts/app/views/pod_entry_view_spec.js @@ -72,13 +72,13 @@ describe("app.views.PodEntry", function() { it("renders a success flash message", function() { this.view.recheckPod(); jasmine.Ajax.requests.mostRecent().respondWith(ajaxSuccess); - expect(this.view.$("#flash-message")).toBeSuccessFlashMessage(); + expect(this.view.$(".flash-message")).toBeSuccessFlashMessage(); }); it("renders an error flash message", function() { this.view.recheckPod(); jasmine.Ajax.requests.mostRecent().respondWith(ajaxFail); - expect(this.view.$("#flash-message")).toBeErrorFlashMessage(); + expect(this.view.$(".flash-message")).toBeErrorFlashMessage(); }); it("sets the appropriate CSS class", function() {