Merge pull request #3802 from consul/html_area
Make HTML areas independent of CKEditor
This commit is contained in:
@@ -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();
|
||||
|
||||
14
app/assets/javascripts/html_editor.js
Normal file
14
app/assets/javascripts/html_editor.js
Normal file
@@ -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);
|
||||
@@ -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,
|
||||
|
||||
@@ -21,10 +21,10 @@
|
||||
maxlength: Budget::Investment.title_max_length %>
|
||||
</div>
|
||||
|
||||
<div class="ckeditor small-12 column">
|
||||
<%= translations_form.cktext_area :description,
|
||||
<div class="small-12 column">
|
||||
<%= translations_form.text_area :description,
|
||||
maxlength: Budget::Investment.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
||||
@@ -22,19 +22,17 @@
|
||||
<div class="row">
|
||||
<%= f.translatable_fields do |translations_form| %>
|
||||
<div class="small-12 column">
|
||||
<div class="ckeditor">
|
||||
<%= translations_form.cktext_area :description,
|
||||
maxlength: Budget::Phase::DESCRIPTION_MAX_LENGTH,
|
||||
hint: t("admin.budget_phases.edit.description_help_text") %>
|
||||
</div>
|
||||
<%= translations_form.text_area :description,
|
||||
maxlength: Budget::Phase::DESCRIPTION_MAX_LENGTH,
|
||||
class: "html-area",
|
||||
hint: t("admin.budget_phases.edit.description_help_text") %>
|
||||
</div>
|
||||
|
||||
<div class="small-12 column">
|
||||
<div class="ckeditor">
|
||||
<%= translations_form.cktext_area :summary,
|
||||
maxlength: Budget::Phase::SUMMARY_MAX_LENGTH,
|
||||
hint: t("admin.budget_phases.edit.summary_help_text") %>
|
||||
</div>
|
||||
<%= translations_form.text_area :summary,
|
||||
maxlength: Budget::Phase::SUMMARY_MAX_LENGTH,
|
||||
class: "html-area",
|
||||
hint: t("admin.budget_phases.edit.summary_help_text") %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -31,9 +31,7 @@
|
||||
<%= f.text_field :short_description %>
|
||||
</div>
|
||||
|
||||
<div class="ckeditor">
|
||||
<%= f.cktext_area :description, ckeditor: { language: I18n.locale } %>
|
||||
</div>
|
||||
<%= f.text_area :description, class: "html-area" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -15,12 +15,10 @@
|
||||
<div class="row">
|
||||
<%= f.translatable_fields do |translations_form| %>
|
||||
<div class="small-12 column">
|
||||
<div class="ckeditor">
|
||||
<%= translations_form.cktext_area :homepage,
|
||||
language: I18n.locale,
|
||||
ckeditor: { height: 500, toolbar: "admin" },
|
||||
hint: t("admin.legislation.processes.form.homepage_description") %>
|
||||
</div>
|
||||
<%= translations_form.text_area :homepage,
|
||||
language: I18n.locale,
|
||||
class: "html-area admin",
|
||||
hint: t("admin.legislation.processes.form.homepage_description") %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -6,8 +6,8 @@
|
||||
<%= translatable_form_for [:admin, @process] do |f| %>
|
||||
<div class="row">
|
||||
<%= f.translatable_fields do |translations_form| %>
|
||||
<div class="ckeditor column">
|
||||
<%= translations_form.cktext_area :milestones_summary, ckeditor: { language: I18n.locale } %>
|
||||
<div class="column">
|
||||
<%= translations_form.text_area :milestones_summary, class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -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" %>
|
||||
|
||||
<div class="margin-top">
|
||||
<%= f.submit class: "button success" %>
|
||||
|
||||
@@ -6,9 +6,9 @@
|
||||
|
||||
<div class="row">
|
||||
<%= f.translatable_fields do |translations_form| %>
|
||||
<div class="ckeditor column">
|
||||
<div class="column">
|
||||
<span class="help-text"><%= t("admin.active_polls.form.description.help_text") %></span>
|
||||
<%= translations_form.cktext_area :description,
|
||||
<%= translations_form.text_area :description, class: "html-area",
|
||||
maxlength: ActivePoll.description_max_length %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
@@ -14,8 +14,8 @@
|
||||
<div class="column end">
|
||||
<%= translations_form.text_field :title %>
|
||||
</div>
|
||||
<div class="ckeditor column">
|
||||
<%= translations_form.cktext_area :description, maxlength: Poll::Question.description_max_length %>
|
||||
<div class="column">
|
||||
<%= translations_form.text_area :description, maxlength: Poll::Question.description_max_length, class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -36,9 +36,8 @@
|
||||
<div class="small-12 column">
|
||||
<%= translations_form.text_field :subtitle %>
|
||||
</div>
|
||||
<div class="ckeditor column">
|
||||
<%= translations_form.cktext_area :content,
|
||||
ckeditor: { language: I18n.locale, toolbar: "admin" } %>
|
||||
<div class="column">
|
||||
<%= translations_form.text_area :content, class: "html-area admin" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -22,10 +22,10 @@
|
||||
</div>
|
||||
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
|
||||
|
||||
<div class="ckeditor small-12 column">
|
||||
<%= translations_form.cktext_area :description,
|
||||
<div class="small-12 column">
|
||||
<%= translations_form.text_area :description,
|
||||
maxlength: Budget::Investment.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
||||
@@ -14,11 +14,9 @@
|
||||
|
||||
<div class="row expanded">
|
||||
<div class="small-12 column">
|
||||
<div class="ckeditor">
|
||||
<%= f.cktext_area :description,
|
||||
maxlength: Poll::Question.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
</div>
|
||||
<%= f.text_area :description,
|
||||
maxlength: Poll::Question.description_max_length,
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -16,10 +16,10 @@
|
||||
</div>
|
||||
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
|
||||
|
||||
<div class="ckeditor small-12 column">
|
||||
<%= translations_form.cktext_area :description,
|
||||
<div class="small-12 column">
|
||||
<%= translations_form.text_area :description,
|
||||
maxlength: Debate.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<html lang="<%= I18n.locale %>">
|
||||
|
||||
<head>
|
||||
<%= render "layouts/common_head", default_title: "Admin" %>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<html lang="<%= I18n.locale %>">
|
||||
<head>
|
||||
<%= render "layouts/common_head", default_title: "Gobierno abierto" %>
|
||||
<%= render "layouts/meta_tags" %>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html lang="es">
|
||||
<html lang="<%= I18n.locale %>">
|
||||
<head>
|
||||
<title><%= t("mailers.title") %></title>
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<html lang="<%= I18n.locale %>">
|
||||
|
||||
<head>
|
||||
<%= render "layouts/common_head", default_title: "Management" %>
|
||||
|
||||
@@ -15,10 +15,10 @@
|
||||
hint: t("proposals.form.proposal_summary_note") %>
|
||||
</div>
|
||||
|
||||
<div class="ckeditor small-12 column">
|
||||
<%= f.cktext_area :description,
|
||||
<div class="small-12 column">
|
||||
<%= f.text_area :description,
|
||||
maxlength: Legislation::Proposal.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
|
||||
<div class="small-12 column">
|
||||
|
||||
@@ -21,10 +21,10 @@
|
||||
hint: t("proposals.form.proposal_summary_note") %>
|
||||
</div>
|
||||
|
||||
<div class="ckeditor small-12 column">
|
||||
<%= translations_form.cktext_area :description,
|
||||
maxlength: Proposal.description_max_length,
|
||||
ckeditor: { language: I18n.locale } %>
|
||||
<div class="small-12 column">
|
||||
<%= translations_form.text_area :description,
|
||||
maxlength: Proposal.description_max_length,
|
||||
class: "html-area" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
||||
@@ -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(
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
31
spec/support/matchers/have_ckeditor.rb
Normal file
31
spec/support/matchers/have_ckeditor.rb
Normal file
@@ -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
|
||||
Reference in New Issue
Block a user