diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 5ca18f609..359a273ff 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -55,6 +55,7 @@ //= require checkbox_toggle //= require markdown-it //= require markdown_editor +//= require html_editor //= require cocoon //= require answers //= require questions @@ -114,6 +115,7 @@ var initialize_modules = function() { App.SocialShare.initialize(); App.CheckboxToggle.initialize(); App.MarkdownEditor.initialize(); + App.HTMLEditor.initialize(); App.LegislationAdmin.initialize(); App.LegislationAllegations.initialize(); App.Legislation.initialize(); diff --git a/app/assets/javascripts/html_editor.js b/app/assets/javascripts/html_editor.js new file mode 100644 index 000000000..4325fa255 --- /dev/null +++ b/app/assets/javascripts/html_editor.js @@ -0,0 +1,14 @@ +(function() { + "use strict"; + App.HTMLEditor = { + initialize: function() { + $("textarea.html-area").each(function() { + if ($(this).hasClass("admin")) { + CKEDITOR.replace(this.name, { language: $("html").attr("lang"), toolbar: "admin", height: 500 }); + } else { + CKEDITOR.replace(this.name, { language: $("html").attr("lang") }); + } + }); + } + }; +}).call(this); diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index b7e0265dc..85a5a304f 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -1072,8 +1072,8 @@ form { margin: $line-height / 2 0 $line-height / 2 $line-height / 4; } - .ckeditor { - min-height: $line-height * 13; + .cke { + margin-bottom: $line-height; } .checkbox, diff --git a/app/views/admin/budget_investments/edit.html.erb b/app/views/admin/budget_investments/edit.html.erb index bb3acc7f1..e7d36337f 100644 --- a/app/views/admin/budget_investments/edit.html.erb +++ b/app/views/admin/budget_investments/edit.html.erb @@ -21,10 +21,10 @@ maxlength: Budget::Investment.title_max_length %> -
- <%= translations_form.cktext_area :description, +
+ <%= translations_form.text_area :description, maxlength: Budget::Investment.description_max_length, - ckeditor: { language: I18n.locale } %> + class: "html-area" %>
<% end %> diff --git a/app/views/admin/budget_phases/_form.html.erb b/app/views/admin/budget_phases/_form.html.erb index a75ce79b8..f8e5cd964 100644 --- a/app/views/admin/budget_phases/_form.html.erb +++ b/app/views/admin/budget_phases/_form.html.erb @@ -22,19 +22,17 @@
<%= f.translatable_fields do |translations_form| %>
-
- <%= translations_form.cktext_area :description, - maxlength: Budget::Phase::DESCRIPTION_MAX_LENGTH, - hint: t("admin.budget_phases.edit.description_help_text") %> -
+ <%= translations_form.text_area :description, + maxlength: Budget::Phase::DESCRIPTION_MAX_LENGTH, + class: "html-area", + hint: t("admin.budget_phases.edit.description_help_text") %>
-
- <%= translations_form.cktext_area :summary, - maxlength: Budget::Phase::SUMMARY_MAX_LENGTH, - hint: t("admin.budget_phases.edit.summary_help_text") %> -
+ <%= translations_form.text_area :summary, + maxlength: Budget::Phase::SUMMARY_MAX_LENGTH, + class: "html-area", + hint: t("admin.budget_phases.edit.summary_help_text") %>
<% end %>
diff --git a/app/views/admin/dashboard/actions/_form.html.erb b/app/views/admin/dashboard/actions/_form.html.erb index b80765e84..810726868 100644 --- a/app/views/admin/dashboard/actions/_form.html.erb +++ b/app/views/admin/dashboard/actions/_form.html.erb @@ -31,9 +31,7 @@ <%= f.text_field :short_description %>
-
- <%= f.cktext_area :description, ckeditor: { language: I18n.locale } %> -
+ <%= f.text_area :description, class: "html-area" %> diff --git a/app/views/admin/legislation/homepages/_form.html.erb b/app/views/admin/legislation/homepages/_form.html.erb index 2c2485cfe..a0758efed 100644 --- a/app/views/admin/legislation/homepages/_form.html.erb +++ b/app/views/admin/legislation/homepages/_form.html.erb @@ -15,12 +15,10 @@
<%= f.translatable_fields do |translations_form| %>
-
- <%= translations_form.cktext_area :homepage, - language: I18n.locale, - ckeditor: { height: 500, toolbar: "admin" }, - hint: t("admin.legislation.processes.form.homepage_description") %> -
+ <%= translations_form.text_area :homepage, + language: I18n.locale, + class: "html-area admin", + hint: t("admin.legislation.processes.form.homepage_description") %>
<% end %>
diff --git a/app/views/admin/legislation/milestones/_summary_form.html.erb b/app/views/admin/legislation/milestones/_summary_form.html.erb index 3c4297049..27442d377 100644 --- a/app/views/admin/legislation/milestones/_summary_form.html.erb +++ b/app/views/admin/legislation/milestones/_summary_form.html.erb @@ -6,8 +6,8 @@ <%= translatable_form_for [:admin, @process] do |f| %>
<%= f.translatable_fields do |translations_form| %> -
- <%= translations_form.cktext_area :milestones_summary, ckeditor: { language: I18n.locale } %> +
+ <%= translations_form.text_area :milestones_summary, class: "html-area" %>
<% end %>
diff --git a/app/views/admin/newsletters/_form.html.erb b/app/views/admin/newsletters/_form.html.erb index a389a090d..a1c5f1abb 100644 --- a/app/views/admin/newsletters/_form.html.erb +++ b/app/views/admin/newsletters/_form.html.erb @@ -5,7 +5,7 @@ @newsletter[:segment_recipient]) %> <%= f.text_field :subject %> <%= f.text_field :from %> - <%= f.cktext_area :body, ckeditor: { language: I18n.locale } %> + <%= f.text_area :body, class: "html-area" %>
<%= f.submit class: "button success" %> diff --git a/app/views/admin/poll/active_polls/_form.html.erb b/app/views/admin/poll/active_polls/_form.html.erb index d3aeaedab..5794b641f 100644 --- a/app/views/admin/poll/active_polls/_form.html.erb +++ b/app/views/admin/poll/active_polls/_form.html.erb @@ -6,9 +6,9 @@
<%= f.translatable_fields do |translations_form| %> -
+
<%= t("admin.active_polls.form.description.help_text") %> - <%= translations_form.cktext_area :description, + <%= translations_form.text_area :description, class: "html-area", maxlength: ActivePoll.description_max_length %>
<% end %> diff --git a/app/views/admin/poll/questions/answers/_form.html.erb b/app/views/admin/poll/questions/answers/_form.html.erb index 873ce5785..53eceae17 100644 --- a/app/views/admin/poll/questions/answers/_form.html.erb +++ b/app/views/admin/poll/questions/answers/_form.html.erb @@ -14,8 +14,8 @@
<%= translations_form.text_field :title %>
-
- <%= translations_form.cktext_area :description, maxlength: Poll::Question.description_max_length %> +
+ <%= translations_form.text_area :description, maxlength: Poll::Question.description_max_length, class: "html-area" %>
<% end %>
diff --git a/app/views/admin/site_customization/pages/_form.html.erb b/app/views/admin/site_customization/pages/_form.html.erb index 6d280087a..76c1d175e 100644 --- a/app/views/admin/site_customization/pages/_form.html.erb +++ b/app/views/admin/site_customization/pages/_form.html.erb @@ -36,9 +36,8 @@
<%= translations_form.text_field :subtitle %>
-
- <%= translations_form.cktext_area :content, - ckeditor: { language: I18n.locale, toolbar: "admin" } %> +
+ <%= translations_form.text_area :content, class: "html-area admin" %>
<% end %>
diff --git a/app/views/budgets/investments/_form.html.erb b/app/views/budgets/investments/_form.html.erb index c118611fd..3eff59f72 100644 --- a/app/views/budgets/investments/_form.html.erb +++ b/app/views/budgets/investments/_form.html.erb @@ -22,10 +22,10 @@
-
- <%= translations_form.cktext_area :description, +
+ <%= translations_form.text_area :description, maxlength: Budget::Investment.description_max_length, - ckeditor: { language: I18n.locale } %> + class: "html-area" %>
<% end %> diff --git a/app/views/dashboard/polls/_question_answer_fields.html.erb b/app/views/dashboard/polls/_question_answer_fields.html.erb index 4f3dfae57..3cf81e8ee 100644 --- a/app/views/dashboard/polls/_question_answer_fields.html.erb +++ b/app/views/dashboard/polls/_question_answer_fields.html.erb @@ -14,11 +14,9 @@
-
- <%= f.cktext_area :description, - maxlength: Poll::Question.description_max_length, - ckeditor: { language: I18n.locale } %> -
+ <%= f.text_area :description, + maxlength: Poll::Question.description_max_length, + class: "html-area" %>
diff --git a/app/views/debates/_form.html.erb b/app/views/debates/_form.html.erb index 38b4e2bcc..155bb7da5 100644 --- a/app/views/debates/_form.html.erb +++ b/app/views/debates/_form.html.erb @@ -16,10 +16,10 @@
-
- <%= translations_form.cktext_area :description, +
+ <%= translations_form.text_area :description, maxlength: Debate.description_max_length, - ckeditor: { language: I18n.locale } %> + class: "html-area" %>
<% end %> diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb index 0f9a82856..50f74a80c 100644 --- a/app/views/layouts/admin.html.erb +++ b/app/views/layouts/admin.html.erb @@ -1,5 +1,5 @@ - + <%= render "layouts/common_head", default_title: "Admin" %> diff --git a/app/views/layouts/devise.html.erb b/app/views/layouts/devise.html.erb index f2cb29bba..55916e678 100644 --- a/app/views/layouts/devise.html.erb +++ b/app/views/layouts/devise.html.erb @@ -1,5 +1,5 @@ - + <%= render "layouts/common_head", default_title: "Gobierno abierto" %> <%= render "layouts/meta_tags" %> diff --git a/app/views/layouts/mailer.html.erb b/app/views/layouts/mailer.html.erb index a3911df41..6691fe4fb 100644 --- a/app/views/layouts/mailer.html.erb +++ b/app/views/layouts/mailer.html.erb @@ -1,5 +1,5 @@ - + <%= t("mailers.title") %> diff --git a/app/views/layouts/management.html.erb b/app/views/layouts/management.html.erb index 6f224b0c5..a3dc288f9 100644 --- a/app/views/layouts/management.html.erb +++ b/app/views/layouts/management.html.erb @@ -1,5 +1,5 @@ - + <%= render "layouts/common_head", default_title: "Management" %> diff --git a/app/views/legislation/proposals/_form.html.erb b/app/views/legislation/proposals/_form.html.erb index d0c387482..9985bfa03 100644 --- a/app/views/legislation/proposals/_form.html.erb +++ b/app/views/legislation/proposals/_form.html.erb @@ -15,10 +15,10 @@ hint: t("proposals.form.proposal_summary_note") %>
-
- <%= f.cktext_area :description, +
+ <%= f.text_area :description, maxlength: Legislation::Proposal.description_max_length, - ckeditor: { language: I18n.locale } %> + class: "html-area" %>
diff --git a/app/views/proposals/_form.html.erb b/app/views/proposals/_form.html.erb index 6f2a34e82..eba35f60d 100644 --- a/app/views/proposals/_form.html.erb +++ b/app/views/proposals/_form.html.erb @@ -21,10 +21,10 @@ hint: t("proposals.form.proposal_summary_note") %>
-
- <%= translations_form.cktext_area :description, - maxlength: Proposal.description_max_length, - ckeditor: { language: I18n.locale } %> +
+ <%= translations_form.text_area :description, + maxlength: Proposal.description_max_length, + class: "html-area" %>
<% end %> diff --git a/lib/consul_form_builder.rb b/lib/consul_form_builder.rb index 86c84589f..33b0fc1af 100644 --- a/lib/consul_form_builder.rb +++ b/lib/consul_form_builder.rb @@ -9,7 +9,7 @@ class ConsulFormBuilder < FoundationRailsHelper::FormBuilder select attribute, choices, options, html_options end - %i[text_field text_area cktext_area number_field password_field email_field].each do |field| + %i[text_field text_area number_field password_field email_field].each do |field| define_method field do |attribute, options = {}| label_with_hint(attribute, options.merge(label_options: label_options_for(options))) + super(attribute, options.merge( diff --git a/spec/features/admin/site_customization/pages_spec.rb b/spec/features/admin/site_customization/pages_spec.rb index 42042f028..3671ba64a 100644 --- a/spec/features/admin/site_customization/pages_spec.rb +++ b/spec/features/admin/site_customization/pages_spec.rb @@ -86,10 +86,9 @@ describe "Admin custom pages" do scenario "Allows images in CKEditor", :js do visit edit_admin_site_customization_page_path(custom_page) + fill_in_ckeditor "Content", with: "Will add an image" - within(".ckeditor") do - expect(page).to have_css(".cke_toolbar .cke_button__image_icon") - end + expect(page).to have_css(".cke_toolbar .cke_button__image_icon") end end diff --git a/spec/features/admin/translatable_spec.rb b/spec/features/admin/translatable_spec.rb index 9a9b76d98..c40919d81 100644 --- a/spec/features/admin/translatable_spec.rb +++ b/spec/features/admin/translatable_spec.rb @@ -55,15 +55,15 @@ describe "Admin edit translatable records" do visit path - within_frame(0) { expect(page).to have_content "Content in English" } + expect(page).to have_ckeditor "Content", with: "Content in English" select "Español", from: :select_language - within_frame(0) { expect(page).to have_content "Contenido en español" } + expect(page).to have_ckeditor "Content", with: "Contenido en español" select "Français", from: :select_language - within_frame(0) { expect(page).to have_content "Contenu en Français" } + expect(page).to have_ckeditor "Content", with: "Contenu en Français" end end @@ -155,7 +155,7 @@ describe "Admin edit translatable records" do select "Français", from: :select_language - within_frame(0) { expect(page.text).to be_empty } + expect(page). to have_ckeditor "Description", with: "" end end @@ -237,7 +237,7 @@ describe "Admin edit translatable records" do select("Español", from: "locale-switcher") expect(page).to have_field "Respuesta", with: "Respuesta corregida" - within_frame(0) { expect(page).to have_content "Descripción corregida" } + expect(page).to have_ckeditor "Descripción", with: "Descripción corregida" end end diff --git a/spec/features/translatable_spec.rb b/spec/features/translatable_spec.rb index a750947fa..d075f1487 100644 --- a/spec/features/translatable_spec.rb +++ b/spec/features/translatable_spec.rb @@ -212,7 +212,7 @@ describe "Public area translatable records" do select "Español", from: "locale-switcher" expect(page).to have_field "Título del debate", with: "Título corregido" - within_frame(0) { expect(page).to have_content "Texto corregido" } + expect(page).to have_ckeditor "Texto inicial del debate", with: "Texto corregido" end end diff --git a/spec/support/matchers/have_ckeditor.rb b/spec/support/matchers/have_ckeditor.rb new file mode 100644 index 000000000..8072ad511 --- /dev/null +++ b/spec/support/matchers/have_ckeditor.rb @@ -0,0 +1,31 @@ +RSpec::Matchers.define :have_ckeditor do |label, with:| + define_method :textarea_id do + find("label", text: label)[:for] + end + + define_method :ckeditor_id do + "#cke_#{textarea_id}" + end + + define_method :has_ckeditor? do + has_css?("label", text: label) && has_css?(ckeditor_id) + end + + match do + return false unless has_ckeditor? + + page.within(ckeditor_id) do + within_frame(0) { has_content?(with) } + end + end + + failure_message do + if has_ckeditor? + text = page.within(ckeditor_id) { within_frame(0) { page.text } } + + "expected to find visible CKEditor '#{label}' with '#{with}', but had '#{text}'" + else + "expected to find visible CKEditor '#{label}' but there were no matches." + end + end +end