Permalink
Browse files

Customization and previewing of broadcast messages

  • Loading branch information...
1 parent 566b496 commit 0760ba3efb7566b9f56bb066f4b15ba8ea34e1e7 @atomaka atomaka committed Dec 9, 2013
View
@@ -23,6 +23,7 @@ v 6.4.0
- API Cross-origin resource sharing
- Show READMe link at project home page
- Show repo size for projects in Admin area
+ - Add color custimization and previewing to broadcast messages
v 6.3.0
- API for adding gitlab-ci service
@@ -8,6 +8,23 @@ class Admin
else
elems.removeAttr 'disabled'
+ $('body').on 'click', '.js-toggle-colors-link', (e) ->
+ e.preventDefault()
+ $('.js-toggle-colors-link').hide()
+ $('.js-toggle-colors-container').show()
+
+ $('input#broadcast_message_color').on 'input', ->
+ previewColor = $('input#broadcast_message_color').val()
+ $('div.broadcast-message-preview').css('background-color', previewColor)
+
+ $('input#broadcast_message_font').on 'input', ->
+ previewColor = $('input#broadcast_message_font').val()
+ $('div.broadcast-message-preview').css('color', previewColor)
+
+ $('textarea#broadcast_message_message').on 'input', ->
+ previewMessage = $('textarea#broadcast_message_message').val()
+ $('div.broadcast-message-preview span').text(previewMessage)
+
$('.log-tabs a').click (e) ->
e.preventDefault()
$(this).tab('show')
@@ -361,6 +361,11 @@ table {
color: #BBB;
}
+.broadcast-message-preview {
+ @extend .broadcast-message;
+ margin-bottom: 20px;
+}
+
.ajax-users-select {
width: 400px;
@@ -0,0 +1,9 @@
+module BroadcastMessagesHelper
+ def broadcast_styling(broadcast_message)
+ if(broadcast_message.color || broadcast_message.font)
+ "background-color:#{broadcast_message.color};color:#{broadcast_message.font}"
+ else
+ ""
+ end
+ end
+end
@@ -9,10 +9,12 @@
# alert_type :integer
# created_at :datetime not null
# updated_at :datetime not null
+# color :string(255)
+# font :string(255)
#
class BroadcastMessage < ActiveRecord::Base
- attr_accessible :alert_type, :ends_at, :message, :starts_at
+ attr_accessible :alert_type, :color, :ends_at, :font, :message, :starts_at
validates :message, presence: true
validates :starts_at, presence: true
@@ -2,7 +2,9 @@
Broadcast Messages
%p.light
Broadcast messages are displayed for every user and can be used to notify users about scheduled maintenance, recent upgrades and more.
-%hr
+.broadcast-message-preview
+ %i.icon-bullhorn
+ %span Your message here
= form_for [:admin, @broadcast_message] do |f|
-if @broadcast_message.errors.any?
@@ -13,6 +15,17 @@
= f.label :message
.controls
= f.text_area :message, class: "input-xxlarge", rows: 2, required: true
+ %div
+ = link_to '#', class: 'js-toggle-colors-link' do
+ Customize colors
+ .control-group.js-toggle-colors-container.hide
+ = f.label :color, "Background Color"
+ .controls
+ = f.text_field :color
+ .control-group.js-toggle-colors-container.hide
+ = f.label :font, "Font Color"
+ .controls
+ = f.text_field :font
.control-group
= f.label :starts_at
.controls.datetime-controls
@@ -1,4 +1,4 @@
- if broadcast_message.present?
- .broadcast-message
+ .broadcast-message{ style: broadcast_styling(broadcast_message) }
%i.icon-bullhorn
= broadcast_message.message
@@ -0,0 +1,6 @@
+class AddColorAndFontToBroadcastMessages < ActiveRecord::Migration
+ def change
+ add_column :broadcast_messages, :color, :string
+ add_column :broadcast_messages, :font, :string
+ end
+end
View
@@ -20,6 +20,8 @@
t.integer "alert_type"
t.datetime "created_at", null: false
t.datetime "updated_at", null: false
+ t.string "color"
+ t.string "font"
end
create_table "deploy_keys_projects", force: true do |t|
@@ -11,3 +11,10 @@ Feature: Admin Broadcast Messages
When submit form with new broadcast message
Then I should be redirected to admin messages page
And I should see newly created broadcast message
+
+ Scenario: Create a customized broadcast message
+ When submit form with new customized broadcast message
+ Then I should be redirected to admin messages page
+ And I should see newly created broadcast message
+ Then I visit dashboard page
+ And I should see a customized broadcast message
@@ -24,4 +24,18 @@ class Spinach::Features::AdminBroadcastMessages < Spinach::FeatureSteps
step 'I should see newly created broadcast message' do
page.should have_content 'Application update from 4:00 CST to 5:00 CST'
end
+
+ step 'submit form with new customized broadcast message' do
+ fill_in 'broadcast_message_message', with: 'Application update from 4:00 CST to 5:00 CST'
+ click_link "Customize colors"
+ fill_in 'broadcast_message_color', with: '#f2dede'
+ fill_in 'broadcast_message_font', with: '#b94a48'
+ select '2018', from: "broadcast_message_ends_at_1i"
+ click_button "Add broadcast message"
+ end
+
+ step 'I should see a customized broadcast message' do
+ page.should have_content 'Application update from 4:00 CST to 5:00 CST'
+ page.should have_selector %(div[style="background-color:#f2dede;color:#b94a48"])
+ end
end
@@ -9,6 +9,8 @@
# alert_type :integer
# created_at :datetime not null
# updated_at :datetime not null
+# color :string(255)
+# font :string(255)
#
# Read about factories at https://github.com/thoughtbot/factory_girl
@@ -19,5 +21,7 @@
starts_at "2013-11-12 13:43:25"
ends_at "2013-11-12 13:43:25"
alert_type 1
+ color "#555"
+ font "#BBB"
end
end
@@ -0,0 +1,21 @@
+require 'spec_helper'
+
+describe BroadcastMessagesHelper do
+ describe 'broadcast_styling' do
+ let(:broadcast_message) { double(color: "", font: "") }
+
+ context "default style" do
+ it "should have no style" do
+ broadcast_styling(broadcast_message).should match('')
+ end
+ end
+
+ context "customiezd style" do
+ before { broadcast_message.stub(color: "#f2dede", font: "#b94a48") }
+
+ it "should have a customized style" do
+ broadcast_styling(broadcast_message).should match('background-color:#f2dede;color:#b94a48')
+ end
+ end
+ end
+end
@@ -9,6 +9,8 @@
# alert_type :integer
# created_at :datetime not null
# updated_at :datetime not null
+# color :string(255)
+# font :string(255)
#
require 'spec_helper'

0 comments on commit 0760ba3

Please sign in to comment.