From 2a0443445b278c4a20b65afa4d1d9b72f3bc51c0 Mon Sep 17 00:00:00 2001 From: Robin Ward Date: Wed, 21 Sep 2016 11:22:46 -0400 Subject: [PATCH] New step to choose emoji set --- .../templates/components/radio-button.hbs | 5 ++++ .../components/wizard-field-radio.hbs | 1 + app/assets/stylesheets/wizard.scss | 30 +++++++++++++++++++ .../wizard_field_choice_serializer.rb | 10 ++++++- config/locales/server.en.yml | 4 +++ lib/wizard/builder.rb | 27 +++++++++++++++++ lib/wizard/field.rb | 3 +- spec/components/step_updater_spec.rb | 11 +++++++ 8 files changed, 89 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/wizard/templates/components/radio-button.hbs b/app/assets/javascripts/wizard/templates/components/radio-button.hbs index ed8e2c8702c..c7636811889 100644 --- a/app/assets/javascripts/wizard/templates/components/radio-button.hbs +++ b/app/assets/javascripts/wizard/templates/components/radio-button.hbs @@ -6,6 +6,11 @@ {{/if}} {{label}} + {{#if extraLabel}} + + {{{extraLabel}}} + + {{/if}}
{{description}} diff --git a/app/assets/javascripts/wizard/templates/components/wizard-field-radio.hbs b/app/assets/javascripts/wizard/templates/components/wizard-field-radio.hbs index 6461851a77d..c4697794c95 100644 --- a/app/assets/javascripts/wizard/templates/components/wizard-field-radio.hbs +++ b/app/assets/javascripts/wizard/templates/components/wizard-field-radio.hbs @@ -3,6 +3,7 @@ {{radio-button value=field.value radioValue=c.id label=c.label + extraLabel=c.extra_label icon=c.icon description=c.description onChange="changed"}} diff --git a/app/assets/stylesheets/wizard.scss b/app/assets/stylesheets/wizard.scss index ddd184b6236..1a1d2b52615 100644 --- a/app/assets/stylesheets/wizard.scss +++ b/app/assets/stylesheets/wizard.scss @@ -48,6 +48,36 @@ body.wizard { z-index: 10; } +.wizard-step-emoji { + + .radio-area { + display: flex; + flex-direction: row; + align-items: center; + + input { + flex: 1 0 0; + } + + span { + flex: 10 0 0; + } + + span.extra-label { + flex: 20 0 0; + } + } + + .emoji-preview { + margin-left: 1em; + img { + height: 20px; + width: 20px; + padding-right: 0.5em; + } + } +} + .wizard-column { position: relative; z-index: 11; diff --git a/app/serializers/wizard_field_choice_serializer.rb b/app/serializers/wizard_field_choice_serializer.rb index 286562ad437..4c9d641d328 100644 --- a/app/serializers/wizard_field_choice_serializer.rb +++ b/app/serializers/wizard_field_choice_serializer.rb @@ -1,5 +1,5 @@ class WizardFieldChoiceSerializer < ApplicationSerializer - attributes :id, :label, :description, :icon, :data + attributes :id, :label, :extra_label, :description, :icon, :data def id object.id @@ -18,6 +18,14 @@ class WizardFieldChoiceSerializer < ApplicationSerializer I18n.t("#{i18nkey}.label", default: id) end + def extra_label + object.extra_label + end + + def include_extra_label? + object.extra_label.present? + end + def description I18n.t("#{i18nkey}.description", default: "") end diff --git a/config/locales/server.en.yml b/config/locales/server.en.yml index 8dc67d59784..0962c086558 100644 --- a/config/locales/server.en.yml +++ b/config/locales/server.en.yml @@ -3329,6 +3329,10 @@ en: label: "Large Icon" description: "Icon used to represent your site on mobile devices. Recommended size is 144px by 144px." + emoji: + title: "Emoji Style" + description: "We offer several different ways to display emoji. Choose your favorite!" + invites: title: "Invite Staff" description: "You’re almost ready! Let’s invite some staff members to help you seed your discussions with interesting topics and replies." diff --git a/lib/wizard/builder.rb b/lib/wizard/builder.rb index 64d8476cd62..f1bd55404aa 100644 --- a/lib/wizard/builder.rb +++ b/lib/wizard/builder.rb @@ -1,4 +1,5 @@ require_dependency 'introduction_updater' +require_dependency 'emoji_set_site_setting' class Wizard class Builder @@ -168,6 +169,32 @@ class Wizard end end + @wizard.append_step('emoji') do |step| + sets = step.add_field({ + id: 'emoji_set', + type: 'radio', + required: true, + value: SiteSetting.emoji_set + }) + + emoji = ["smile", "+1", "tada", "poop"] + + EmojiSetSiteSetting.values.each do |set| + imgs = emoji.map do |e| + "" + end + + sets.add_choice(set[:value], { + label: I18n.t("js.#{set[:name]}"), + extra_label: "#{imgs.join}" + }) + + step.on_update do |updater| + updater.apply_settings(:emoji_set) + end + end + end + @wizard.append_step('invites') do |step| step.add_field(id: 'invite_list', type: 'component') diff --git a/lib/wizard/field.rb b/lib/wizard/field.rb index 47883161ca0..0816e055d7f 100644 --- a/lib/wizard/field.rb +++ b/lib/wizard/field.rb @@ -1,13 +1,14 @@ class Wizard class Choice - attr_reader :id, :label, :icon, :data + attr_reader :id, :label, :icon, :data, :extra_label attr_accessor :field def initialize(id, opts) @id = id @data = opts[:data] @label = opts[:label] + @extra_label = opts[:extra_label] @icon = opts[:icon] end end diff --git a/spec/components/step_updater_spec.rb b/spec/components/step_updater_spec.rb index ab383cf78f4..564fe9d36ee 100644 --- a/spec/components/step_updater_spec.rb +++ b/spec/components/step_updater_spec.rb @@ -204,6 +204,17 @@ describe Wizard::StepUpdater do end end + context "emoji step" do + it "updates the fields correctly" do + updater = wizard.create_updater('emoji', emoji_set: "twitter") + updater.update + + expect(updater).to be_success + expect(wizard.completed_steps?('emoji')).to eq(true) + expect(SiteSetting.emoji_set).to eq('twitter') + end + end + context "invites step" do let(:invites) {