From 4cdbf2a051ba3a3f7694f5582d28e691498bfc8a Mon Sep 17 00:00:00 2001 From: vanmil Date: Sat, 11 Aug 2018 21:33:34 +0200 Subject: [PATCH] Add customization of froala lineBreaker tags (#3687) Credit to @vanmil --- modules/backend/formwidgets/RichEditor.php | 1 + .../backend/formwidgets/richeditor/assets/js/build-min.js | 4 ++-- .../backend/formwidgets/richeditor/assets/js/richeditor.js | 6 +++++- .../formwidgets/richeditor/partials/_richeditor.htm | 1 + modules/backend/lang/en/lang.php | 2 ++ modules/backend/lang/nl/lang.php | 2 ++ modules/backend/models/EditorSetting.php | 3 +++ modules/backend/models/editorsetting/fields.yaml | 7 +++++++ 8 files changed, 23 insertions(+), 3 deletions(-) diff --git a/modules/backend/formwidgets/RichEditor.php b/modules/backend/formwidgets/RichEditor.php index 75a291ba5..48f548156 100644 --- a/modules/backend/formwidgets/RichEditor.php +++ b/modules/backend/formwidgets/RichEditor.php @@ -90,6 +90,7 @@ class RichEditor extends FormWidgetBase $this->vars['allowTags'] = EditorSetting::getConfigured('html_allow_tags'); $this->vars['noWrapTags'] = EditorSetting::getConfigured('html_no_wrap_tags'); $this->vars['removeTags'] = EditorSetting::getConfigured('html_remove_tags'); + $this->vars['lineBreakerTags'] = EditorSetting::getConfigured('html_line_breaker_tags'); $this->vars['imageStyles'] = EditorSetting::getConfiguredStyles('html_style_image'); $this->vars['linkStyles'] = EditorSetting::getConfiguredStyles('html_style_link'); diff --git a/modules/backend/formwidgets/richeditor/assets/js/build-min.js b/modules/backend/formwidgets/richeditor/assets/js/build-min.js index 4113f1b95..f11dfb490 100755 --- a/modules/backend/formwidgets/richeditor/assets/js/build-min.js +++ b/modules/backend/formwidgets/richeditor/assets/js/build-min.js @@ -606,7 +606,7 @@ Base.call(this) this.init()} RichEditor.prototype=Object.create(BaseProto) RichEditor.prototype.constructor=RichEditor -RichEditor.DEFAULTS={linksHandler:null,stylesheet:null,fullpage:false,editorLang:'en',toolbarButtons:null,allowEmptyTags:null,allowTags:null,noWrapTags:null,removeTags:null,imageStyles:null,linkStyles:null,paragraphStyles:null,tableStyles:null,tableCellStyles:null,aceVendorPath:'/',readOnly:false} +RichEditor.DEFAULTS={linksHandler:null,stylesheet:null,fullpage:false,editorLang:'en',toolbarButtons:null,allowEmptyTags:null,allowTags:null,noWrapTags:null,removeTags:null,lineBreakerTags:null,imageStyles:null,linkStyles:null,paragraphStyles:null,tableStyles:null,tableCellStyles:null,aceVendorPath:'/',readOnly:false} RichEditor.prototype.init=function(){var self=this;this.$el.one('dispose-control',this.proxy(this.dispose)) if(!this.$textarea.attr('id')){this.$textarea.attr('id','element-'+Math.random().toString(36).substring(7))} this.initFroala()} @@ -625,7 +625,7 @@ if(this.options.htmlAllowedEmptyTags){froalaOptions.allowEmptyTags=this.options. if(this.options.allowTags){froalaOptions.htmlAllowedTags=this.options.allowTags.split(/[\s,]+/)} froalaOptions.htmlDoNotWrapTags=this.options.noWrapTags?this.options.noWrapTags.split(/[\s,]+/):['figure','script','style'] if(this.options.removeTags){froalaOptions.htmlRemoveTags=this.options.removeTags.split(/[\s,]+/)} -froalaOptions.lineBreakerTags=['figure','table','hr','iframe','form','dl'] +froalaOptions.lineBreakerTags=this.options.lineBreakerTags?this.options.lineBreakerTags.split(/[\s,]+/):['figure,table,hr,iframe,form,dl'] froalaOptions.shortcutsEnabled=['show','bold','italic','underline','indent','outdent','undo','redo'] froalaOptions.imageUploadURL=froalaOptions.fileUploadURL=window.location froalaOptions.imageUploadParam=froalaOptions.fileUploadParam='file_data' diff --git a/modules/backend/formwidgets/richeditor/assets/js/richeditor.js b/modules/backend/formwidgets/richeditor/assets/js/richeditor.js index 981791070..6a245efcd 100755 --- a/modules/backend/formwidgets/richeditor/assets/js/richeditor.js +++ b/modules/backend/formwidgets/richeditor/assets/js/richeditor.js @@ -44,6 +44,7 @@ allowTags: null, noWrapTags: null, removeTags: null, + lineBreakerTags: null, imageStyles: null, linkStyles: null, paragraphStyles: null, @@ -145,7 +146,10 @@ froalaOptions.htmlRemoveTags = this.options.removeTags.split(/[\s,]+/) } - froalaOptions.lineBreakerTags = ['figure', 'table', 'hr', 'iframe', 'form', 'dl'] + froalaOptions.lineBreakerTags = this.options.lineBreakerTags + ? this.options.lineBreakerTags.split(/[\s,]+/) + : ['figure, table, hr, iframe, form, dl'] + froalaOptions.shortcutsEnabled = ['show', 'bold', 'italic', 'underline', 'indent', 'outdent', 'undo', 'redo'] // File upload diff --git a/modules/backend/formwidgets/richeditor/partials/_richeditor.htm b/modules/backend/formwidgets/richeditor/partials/_richeditor.htm index 4630b61df..8501c5279 100755 --- a/modules/backend/formwidgets/richeditor/partials/_richeditor.htm +++ b/modules/backend/formwidgets/richeditor/partials/_richeditor.htm @@ -14,6 +14,7 @@ data-allow-tags="" data-no-wrap-tags="" data-remove-tags="" + data-line-breaker-tags="" data-image-styles="" data-link-styles="" data-paragraph-styles="" diff --git a/modules/backend/lang/en/lang.php b/modules/backend/lang/en/lang.php index 0b2ae4e85..7d6866bf6 100644 --- a/modules/backend/lang/en/lang.php +++ b/modules/backend/lang/en/lang.php @@ -380,6 +380,8 @@ return [ 'no_wrap_comment' => 'The list of tags that should not be wrapped inside block tags.', 'remove_tags' => 'Remove tags', 'remove_tags_comment' => 'The list of tags that are removed together with their content.', + 'line_breaker_tags' => 'Line breaker tags', + 'line_breaker_tags_comment' => 'The list of tags that are used to place a line breaker element between.', 'toolbar_buttons' => 'Toolbar Buttons', 'toolbar_buttons_comment' => 'The Toolbar Buttons to be displayed in the Rich Editor by default. [fullscreen, bold, italic, underline, strikeThrough, subscript, superscript, fontFamily, fontSize, |, color, emoticons, inlineStyle, paragraphStyle, |, paragraphFormat, align, formatOL, formatUL, outdent, indent, quote, insertHR, -, insertLink, insertImage, insertVideo, insertAudio, insertFile, insertTable, undo, redo, clearFormatting, selectAll, html]', ], diff --git a/modules/backend/lang/nl/lang.php b/modules/backend/lang/nl/lang.php index 3879beed2..df4102a8e 100644 --- a/modules/backend/lang/nl/lang.php +++ b/modules/backend/lang/nl/lang.php @@ -362,6 +362,8 @@ return [ 'no_wrap_comment' => 'Een lijst van tags die niet worden afgebroken.', 'remove_tags' => 'Te verwijderen HTML-tags', 'remove_tags_comment' => 'Een lijst van HTML-tags die samen met hun inhoud worden verwijderd.', + 'line_breaker_tags' => 'Line breaker tags', + 'line_breaker_tags_comment' => 'Een lijst van HTML-tags waartussen een line breaker element wordt geplaatst.', 'toolbar_buttons' => 'Toolbar knoppen', 'toolbar_buttons_comment' => 'De toolbar knoppen die standaard getoond worden door de Rich Editor. [fullscreen, bold, italic, underline, strikeThrough, subscript, superscript, fontFamily, fontSize, |, color, emoticons, inlineStyle, paragraphStyle, |, paragraphFormat, align, formatOL, formatUL, outdent, indent, quote, insertHR, -, insertLink, insertImage, insertVideo, insertAudio, insertFile, insertTable, undo, redo, clearFormatting, selectAll, html]', ], diff --git a/modules/backend/models/EditorSetting.php b/modules/backend/models/EditorSetting.php index 2c74384c5..5429b20a9 100644 --- a/modules/backend/models/EditorSetting.php +++ b/modules/backend/models/EditorSetting.php @@ -44,6 +44,8 @@ class EditorSetting extends Model protected $defaultHtmlRemoveTags = 'script, style'; + protected $defaultHtmlLineBreakerTags = 'figure, table, hr, iframe, form, dl'; + protected $defaultHtmlStyleImage = [ 'oc-img-rounded' => 'Rounded', 'oc-img-bordered' => 'Bordered', @@ -87,6 +89,7 @@ class EditorSetting extends Model $this->html_allow_tags = $this->defaultHtmlAllowTags; $this->html_no_wrap_tags = $this->defaultHtmlNoWrapTags; $this->html_remove_tags = $this->defaultHtmlRemoveTags; + $this->html_line_breaker_tags = $this->defaultHtmlLineBreakerTags; $this->html_custom_styles = File::get(base_path().'/modules/backend/models/editorsetting/default_styles.less'); $this->html_style_image = $this->makeStylesForTable($this->defaultHtmlStyleImage); $this->html_style_link = $this->makeStylesForTable($this->defaultHtmlStyleLink); diff --git a/modules/backend/models/editorsetting/fields.yaml b/modules/backend/models/editorsetting/fields.yaml index ad4c746b0..437ded931 100644 --- a/modules/backend/models/editorsetting/fields.yaml +++ b/modules/backend/models/editorsetting/fields.yaml @@ -96,6 +96,13 @@ tabs: type: textarea span: auto + html_line_breaker_tags: + label: backend::lang.editor.line_breaker_tags + comment: backend::lang.editor.line_breaker_tags_comment + tab: backend::lang.editor.markup_tags + type: textarea + span: auto + html_toolbar_buttons: label: backend::lang.editor.toolbar_buttons comment: backend::lang.editor.toolbar_buttons_comment