UNPKG

froala-editor

Version:

A beautiful Javascript WYSIWYG HTML rich text editor made by devs for devs. High performance and modern design make it easy to use for developers and loved by users.

www.froala.com/wysiwyg-editor

froala/wysiwyg-editor

7 lines (6 loc) • 8.06 kB
1
2
3
4
5
6
7
/*! * froala_editor v2.9.2 (https://www.froala.com/wysiwyg-editor) * License https://froala.com/wysiwyg-editor/terms/ * Copyright 2014-2019 Froala Labs */ !function(e){"function"==typeof define&&define.amd?define(["jquery"],e):"object"==typeof module&&module.exports?module.exports=function(o,r){return r===undefined&&(r="undefined"!=typeof window?require("jquery"):require("jquery")(o)),e(r)}:e(window.jQuery)}(function(C){C.extend(C.FE.POPUP_TEMPLATES,{"colors.picker":"[_BUTTONS_][_TEXT_COLORS_][_BACKGROUND_COLORS_][_CUSTOM_COLOR_]"}),C.extend(C.FE.DEFAULTS,{colorsText:["#61BD6D","#1ABC9C","#54ACD2","#2C82C9","#9365B8","#475577","#CCCCCC","#41A85F","#00A885","#3D8EB9","#2969B0","#553982","#28324E","#000000","#F7DA64","#FBA026","#EB6B56","#E25041","#A38F84","#EFEFEF","#FFFFFF","#FAC51C","#F37934","#D14841","#B8312F","#7C706B","#D1D5D8","REMOVE"],colorsBackground:["#61BD6D","#1ABC9C","#54ACD2","#2C82C9","#9365B8","#475577","#CCCCCC","#41A85F","#00A885","#3D8EB9","#2969B0","#553982","#28324E","#000000","#F7DA64","#FBA026","#EB6B56","#E25041","#A38F84","#EFEFEF","#FFFFFF","#FAC51C","#F37934","#D14841","#B8312F","#7C706B","#D1D5D8","REMOVE"],colorsStep:7,colorsHEXInput:!0,colorsDefaultTab:"text",colorsButtons:["colorsBack","|","-"]});var c=["text","background"];C.FE.PLUGINS.colors=function(E){function r(){E.popups.hide("colors.picker")}function s(o){for(var r="text"==o?E.opts.colorsText:E.opts.colorsBackground,e='<div class="fr-color-set fr-'+o+"-color"+(E.opts.colorsDefaultTab==o||"text"!=E.opts.colorsDefaultTab&&"background"!=E.opts.colorsDefaultTab&&"text"==o?" fr-selected-set":"")+'">',t=0;t<r.length;t++)0!==t&&t%E.opts.colorsStep==0&&(e+="<br>"),"REMOVE"!=r[t]?e+='<span class="fr-command fr-select-color" style="background: '+r[t]+';" tabIndex="-1" aria-selected="false" role="button" data-cmd="'+o+'Color" data-param1="'+r[t]+'"><span class="fr-sr-only">'+E.language.translate("Color")+" "+r[t]+"&nbsp;&nbsp;&nbsp;</span></span>":e+='<span class="fr-command fr-select-color" data-cmd="'+o+'Color" tabIndex="-1" role="button" data-param1="REMOVE" title="'+E.language.translate("Clear Formatting")+'">'+E.icon.create("remove")+'<span class="fr-sr-only">'+E.language.translate("Clear Formatting")+"</span></span>";return e+"</div>"}function l(o){var r=E.popups.get("colors.picker"),e=r.find(".fr-"+o+"-color .fr-active-item").attr("data-param1"),t=r.find(".fr-color-hex-layer input"),a=r.find('.fr-colors-tab[data-param1="'+o+'"]');t.length&&a.hasClass("fr-selected-tab")&&t.val(e).trigger("change")}function t(o){"REMOVE"!=o?E.format.applyStyle("background-color",E.helpers.HEXtoRGB(o)):E.format.removeStyle("background-color"),r()}function a(o){"REMOVE"!=o?E.format.applyStyle("color",E.helpers.HEXtoRGB(o)):E.format.removeStyle("color"),r()}return{showColorsPopup:function(){var o=E.$tb.find('.fr-command[data-cmd="color"]'),r=E.popups.get("colors.picker");if(r||(r=function(){var o,r='<div class="fr-buttons fr-colors-buttons">';E.opts.toolbarInline&&0<E.opts.colorsButtons.length&&(r+=E.button.buildList(E.opts.colorsButtons)),r+=(o='<div class="fr-colors-tabs fr-group">',o+='<span class="fr-colors-tab '+("background"==E.opts.colorsDefaultTab?"":"fr-selected-tab ")+'fr-command" tabIndex="-1" role="button" aria-pressed="'+("background"!=E.opts.colorsDefaultTab)+'" data-param1="text" data-cmd="colorChangeSet" title="'+E.language.translate("Text")+'">'+E.language.translate("Text")+"</span>",(o+='<span class="fr-colors-tab '+("background"==E.opts.colorsDefaultTab?"fr-selected-tab":"")+'fr-command" tabIndex="-1" role="button" aria-pressed="'+("background"==E.opts.colorsDefaultTab)+'" data-param1="background" data-cmd="colorChangeSet" title="'+E.language.translate("Background")+'">'+E.language.translate("Background")+"</span>")+"</div></div>");var e="";E.opts.colorsHEXInput&&(e='<div class="fr-color-hex-layer fr-active fr-layer" id="fr-color-hex-layer-'+E.id+'"><div class="fr-input-line"><input maxlength="7" id="fr-color-hex-layer-text-'+E.id+'" type="text" placeholder="'+E.language.translate("HEX Color")+'" tabIndex="1" aria-required="true"></div><div class="fr-action-buttons"><button type="button" class="fr-command fr-submit" data-cmd="customColor" tabIndex="2" role="button">'+E.language.translate("OK")+"</button></div></div>");var b,t={buttons:r,text_colors:s("text"),background_colors:s("background"),custom_color:e},a=E.popups.create("colors.picker",t);return b=a,E.events.on("popup.tab",function(o){var r=C(o.currentTarget);if(!E.popups.isVisible("colors.picker")||!r.is("span"))return!0;var e=o.which,t=!0;if(C.FE.KEYCODE.TAB==e){var a=b.find(".fr-buttons");t=!E.accessibility.focusToolbar(a,!!o.shiftKey)}else if(C.FE.KEYCODE.ARROW_UP==e||C.FE.KEYCODE.ARROW_DOWN==e||C.FE.KEYCODE.ARROW_LEFT==e||C.FE.KEYCODE.ARROW_RIGHT==e){if(r.is("span.fr-select-color")){var s=r.parent().find("span.fr-select-color"),l=s.index(r),c=E.opts.colorsStep,n=Math.floor(s.length/c),i=l%c,p=Math.floor(l/c),u=p*c+i,d=n*c;C.FE.KEYCODE.ARROW_UP==e?u=((u-c)%d+d)%d:C.FE.KEYCODE.ARROW_DOWN==e?u=(u+c)%d:C.FE.KEYCODE.ARROW_LEFT==e?u=((u-1)%d+d)%d:C.FE.KEYCODE.ARROW_RIGHT==e&&(u=(u+1)%d);var f=C(s.get(u));E.events.disableBlur(),f.focus(),t=!1}}else C.FE.KEYCODE.ENTER==e&&(E.button.exec(r),t=!1);return!1===t&&(o.preventDefault(),o.stopPropagation()),t},!0),a}()),!r.hasClass("fr-active"))if(E.popups.setContainer("colors.picker",E.$tb),c.map(function(o){!function(o){var r,e=E.popups.get("colors.picker"),t=C(E.selection.element());r="background"==o?"background-color":"color";var a=e.find(".fr-"+o+"-color .fr-select-color");for(a.find(".fr-selected-color").remove(),a.removeClass("fr-active-item"),a.not('[data-param1="REMOVE"]').attr("aria-selected",!1);t.get(0)!=E.el;){if("transparent"!=t.css(r)&&"rgba(0, 0, 0, 0)"!=t.css(r)){var s=e.find(".fr-"+o+'-color .fr-select-color[data-param1="'+E.helpers.RGBToHex(t.css(r))+'"]');s.append('<span class="fr-selected-color" aria-hidden="true">\uf00c</span>'),s.addClass("fr-active-item").attr("aria-selected",!0);break}t=t.parent()}l(o)}(o)}),o.is(":visible")){var e=o.offset().left+o.outerWidth()/2,t=o.offset().top+(E.opts.toolbarBottom?10:o.outerHeight()-10);E.popups.show("colors.picker",e,t,o.outerHeight())}else E.position.forSelection(r),E.popups.show("colors.picker")},hideColorsPopup:r,changeSet:function(o,r){o.hasClass("fr-selected-tab")||(o.siblings().removeClass("fr-selected-tab").attr("aria-pressed",!1),o.addClass("fr-selected-tab").attr("aria-pressed",!0),o.parents(".fr-popup").find(".fr-color-set").removeClass("fr-selected-set"),o.parents(".fr-popup").find(".fr-color-set.fr-"+r+"-color").addClass("fr-selected-set"),l(r)),E.accessibility.focusPopup(o.parents(".fr-popup"))},background:t,customColor:function(){var o=E.popups.get("colors.picker"),r=o.find(".fr-color-hex-layer input");if(r.length){var e=r.val();"background"==o.find(".fr-selected-tab").attr("data-param1")?t(e):a(e)}},text:a,back:function(){E.popups.hide("colors.picker"),E.toolbar.showInline()}}},C.FE.DefineIcon("colors",{NAME:"tint"}),C.FE.RegisterCommand("color",{title:"Colors",undo:!1,focus:!0,refreshOnCallback:!1,popup:!0,callback:function(){this.popups.isVisible("colors.picker")?(this.$el.find(".fr-marker").length&&(this.events.disableBlur(),this.selection.restore()),this.popups.hide("colors.picker")):this.colors.showColorsPopup()},plugin:"colors"}),C.FE.RegisterCommand("textColor",{undo:!0,callback:function(o,r){this.colors.text(r)}}),C.FE.RegisterCommand("backgroundColor",{undo:!0,callback:function(o,r){this.colors.background(r)}}),C.FE.RegisterCommand("colorChangeSet",{undo:!1,focus:!1,callback:function(o,r){var e=this.popups.get("colors.picker").find('.fr-command[data-cmd="'+o+'"][data-param1="'+r+'"]');this.colors.changeSet(e,r)}}),C.FE.DefineIcon("colorsBack",{NAME:"arrow-left"}),C.FE.RegisterCommand("colorsBack",{title:"Back",undo:!1,focus:!1,back:!0,refreshAfterCallback:!1,callback:function(){this.colors.back()}}),C.FE.RegisterCommand("customColor",{title:"OK",undo:!0,callback:function(){this.colors.customColor()}}),C.FE.DefineIcon("remove",{NAME:"eraser"})});