framework7
Version:
Full featured mobile HTML framework for building iOS & Android apps
2 lines (1 loc) • 14.7 kB
JavaScript
(function framework7ComponentLoader(e,t){void 0===t&&(t=!0);var o=e.$,n=e.utils,r=e.getDevice,i=(e.getSupport,e.Class),a=(e.Modal,e.ConstructorMethods),l=(e.ModalMethods,n.extend),c=n.deleteProps;function s(e){this.wrapped=e}function d(e){var t,o;function n(t,o){try{var i=e[t](o),a=i.value,l=a instanceof s;Promise.resolve(l?a.wrapped:a).then((function(e){l?n("return"===t?"return":"next",e):r(i.done?"return":"normal",e)}),(function(e){n("throw",e)}))}catch(e){r("throw",e)}}function r(e,r){switch(e){case"return":t.resolve({value:r,done:!0});break;case"throw":t.reject(r);break;default:t.resolve({value:r,done:!1})}(t=t.next)?n(t.key,t.arg):o=null}this._invoke=function(e,r){return new Promise((function(i,a){var l={key:e,arg:r,resolve:i,reject:a,next:null};o?o=o.next=l:(t=o=l,n(e,r))}))},"function"!=typeof e.return&&(this.return=void 0)}function u(e,t){return(u=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function p(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}d.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},d.prototype.next=function(e){return this._invoke("next",e)},d.prototype.throw=function(e){return this._invoke("throw",e)},d.prototype.return=function(e){return this._invoke("return",e)};var m={bold:["bold","format_bold","bold"],italic:["italic","format_italic","italic"],underline:["underline","format_underlined","underline"],strikeThrough:["strikethrough","strikethrough_s","strikeThrough"],orderedList:["list_number","format_list_numbered","insertOrderedList"],unorderedList:["list_bullet","format_list_bulleted","insertUnorderedList"],link:["link","link","createLink"],image:["photo","image","insertImage"],paragraph:["paragraph",'<i class="icon">¶</i>',"formatBlock.P"],h1:['<i class="icon">H<sub>1</sub></i>','<i class="icon">H<sub>1</sub></i>',"formatBlock.H1"],h2:['<i class="icon">H<sub>2</sub></i>','<i class="icon">H<sub>2</sub></i>',"formatBlock.H2"],h3:['<i class="icon">H<sub>3</sub></i>','<i class="icon">H<sub>3</sub></i>',"formatBlock.H3"],alignLeft:["text_alignleft","format_align_left","justifyLeft"],alignCenter:["text_aligncenter","format_align_center","justifyCenter"],alignRight:["text_alignright","format_align_right","justifyRight"],alignJustify:["text_justify","format_align_justify","justifyFull"],subscript:["textformat_subscript",'<i class="icon">A<sub>1</sub></i>',"subscript"],superscript:["textformat_superscript",'<i class="icon">A<sup>1</sup></i>',"superscript"],indent:["increase_indent","format_indent_increase","indent"],outdent:["decrease_indent","format_indent_decrease","outdent"]},f=function(e){var t,n;function i(t,n){var i,a=p(i=e.call(this,n,[t])||this),c=r(),s=l({},t.params.textEditor);a.useModulesParams(s),a.params=l(s,n);var d=a.params.el;if(!d)return a||p(i);var u=o(d);if(0===u.length)return a||p(i);if(u[0].f7TextEditor)return u[0].f7TextEditor||p(i);var m=u.children(".text-editor-content");if(m.length||(u.append('<div class="text-editor-content" contenteditable></div>'),m=u.children(".text-editor-content")),l(a,{app:t,$el:u,el:u[0],$contentEl:m,contentEl:m[0]}),"value"in n&&(a.value=a.params.value),"keyboard-toolbar"===a.params.mode&&(c.cordova||c.capacitor||c.android||(a.params.mode="popover")),"string"==typeof a.params.buttons)try{a.params.buttons=JSON.parse(a.params.buttons)}catch(e){throw new Error('Framework7: TextEditor: wrong "buttons" parameter format')}return u[0].f7TextEditor=a,a.onButtonClick=a.onButtonClick.bind(a),a.onFocus=a.onFocus.bind(a),a.onBlur=a.onBlur.bind(a),a.onInput=a.onInput.bind(a),a.onPaste=a.onPaste.bind(a),a.onSelectionChange=a.onSelectionChange.bind(a),a.closeKeyboardToolbar=a.closeKeyboardToolbar.bind(a),a.attachEvents=function(){"toolbar"===a.params.mode&&a.$el.find(".text-editor-toolbar").on("click","button",a.onButtonClick),"keyboard-toolbar"===a.params.mode&&(a.$keyboardToolbarEl.on("click","button",a.onButtonClick),a.$el.parents(".page").on("page:beforeout",a.closeKeyboardToolbar)),"popover"===a.params.mode&&a.popover&&a.popover.$el.on("click","button",a.onButtonClick),a.$contentEl.on("paste",a.onPaste),a.$contentEl.on("focus",a.onFocus),a.$contentEl.on("blur",a.onBlur),a.$contentEl.on("input",a.onInput,!0),o(document).on("selectionchange",a.onSelectionChange)},a.detachEvents=function(){"toolbar"===a.params.mode&&a.$el.find(".text-editor-toolbar").off("click","button",a.onButtonClick),"keyboard-toolbar"===a.params.mode&&(a.$keyboardToolbarEl.off("click","button",a.onButtonClick),a.$el.parents(".page").off("page:beforeout",a.closeKeyboardToolbar)),"popover"===a.params.mode&&a.popover&&a.popover.$el.off("click","button",a.onButtonClick),a.$contentEl.off("paste",a.onPaste),a.$contentEl.off("focus",a.onFocus),a.$contentEl.off("blur",a.onBlur),a.$contentEl.off("input",a.onInput,!0),o(document).off("selectionchange",a.onSelectionChange)},a.useModules(),a.init(),a||p(i)}n=e,(t=i).prototype=Object.create(n.prototype),t.prototype.constructor=t,u(t,n);var a=i.prototype;return a.setValue=function(e){var t=this;return t.value===e||(t.value=e,t.$contentEl.html(e),t.$el.trigger("texteditor:change",t.value),t.emit("local::change textEditorChange",t,t.value)),t},a.getValue=function(){return this.value},a.clearValue=function(){var e=this;return e.setValue(""),e.params.placeholder&&!e.$contentEl.html()&&e.insertPlaceholder(),e},a.createLink=function(){var e,t=this,n=window.getSelection(),r=[];if(n&&n.anchorNode&&o(n.anchorNode).parents(t.$el).length){for(var i=n.anchorNode;i;)r.push(i),i.nextSibling&&i!==n.focusNode||(i=null),i&&(i=i.nextSibling);for(var a=[],l=o(r),c=0;c<l.length;c+=1){var s=l[c].children;if(s)for(var d=0;d<s.length;d+=1)o(s[d]).is("a")&&a.push(s[d])}e=l.closest("a").add(o(a))}if(e&&e.length)return e.each((function(e){var t=window.getSelection(),o=document.createRange();o.selectNodeContents(e),t.removeAllRanges(),t.addRange(o),document.execCommand("unlink",!1),t.removeAllRanges()})),t;var u=t.getSelectionRange();return u?(t.app.dialog.prompt(t.params.linkUrlText,"",(function(e){e&&e.trim().length&&(t.setSelectionRange(u),document.execCommand("createLink",!1,e.trim()),t.$el.trigger("texteditor:insertlink",{url:e.trim()}),t.emit("local:insertLink textEditorInsertLink",t,e.trim()))})).$el.find("input").focus(),t):t},a.insertImage=function(){var e=this,t=e.getSelectionRange();return t?(e.app.dialog.prompt(e.params.imageUrlText,"",(function(o){o&&o.trim().length&&(e.setSelectionRange(t),document.execCommand("insertImage",!1,o.trim()),e.$el.trigger("texteditor:insertimage",{url:o.trim()}),e.emit("local:insertImage textEditorInsertImage",e,o.trim()))})).$el.find("input").focus(),e):e},a.removePlaceholder=function(){this.$contentEl.find(".text-editor-placeholder").remove()},a.insertPlaceholder=function(){this.$contentEl.append('<div class="text-editor-placeholder">'+this.params.placeholder+"</div>")},a.onSelectionChange=function(){var e=this;if("toolbar"!==e.params.mode){var t=window.getSelection(),n=o(t.anchorNode).parents(e.contentEl).length||t.anchorNode===e.contentEl;if("keyboard-toolbar"!==e.params.mode){if("popover"===e.params.mode){var r=o(t.anchorNode).parents(e.popover.el).length||t.anchorNode===e.popover.el;if(!n&&!r)return void e.closePopover();if(!t.isCollapsed&&t.rangeCount){var i=t.getRangeAt(0).getBoundingClientRect(),a=e.app.$el[0]||document.body;e.openPopover(i.x+(window.scrollX||0)-a.offsetLeft,i.y+(window.scrollY||0)-a.offsetTop,i.width,i.height)}else t.isCollapsed&&e.closePopover()}}else n?e.openKeyboardToolbar():e.closeKeyboardToolbar()}},a.onPaste=function(e){if(this.params.clearFormattingOnPaste&&e.clipboardData&&e.clipboardData.getData){var t=e.clipboardData.getData("text/plain");e.preventDefault(),document.execCommand("insertText",!1,t)}},a.onInput=function(){var e=this,t=e.$contentEl.html();e.value=t,e.$el.trigger("texteditor:input"),e.emit("local:input textEditorInput",e,e.value),e.$el.trigger("texteditor:change",e.value),e.emit("local::change textEditorChange",e,e.value)},a.onFocus=function(){var e=this;e.removePlaceholder(),e.$contentEl.focus(),e.$el.trigger("texteditor:focus"),e.emit("local::focus textEditorFocus",e)},a.onBlur=function(){var e=this;if(e.params.placeholder&&""===e.$contentEl.html()&&e.insertPlaceholder(),"popover"===e.params.mode){var t=window.getSelection(),n=o(t.anchorNode).parents(e.contentEl).length||t.anchorNode===e.contentEl;document.activeElement&&e.popover&&o(document.activeElement).closest(e.popover.$el).length||n||e.closePopover()}if("keyboard-toolbar"===e.params.mode){var r=window.getSelection();o(r.anchorNode).parents(e.contentEl).length||r.anchorNode===e.contentEl||e.closeKeyboardToolbar()}e.$el.trigger("texteditor:blur"),e.emit("local::blur textEditorBlur",e)},a.onButtonClick=function(e){var t=this,n=window.getSelection();if(o(n.anchorNode).parents(t.contentEl).length||n.anchorNode===t.contentEl){var r=o(e.target).closest("button");r.parents("form").length&&e.preventDefault();var i=r.attr("data-button"),a=t.params.customButtons&&t.params.customButtons[i];if(i&&(m[i]||a))if(r.trigger("texteditor:buttonclick",i),t.emit("local::buttonClick textEditorButtonClick",t,i),a)a.onClick&&a.onClick(t,r[0]);else{var l=m[i][2];if("createLink"!==l)if("insertImage"!==l)if(0!==l.indexOf("formatBlock"))document.execCommand(l,!1);else{var c=l.split(".")[1],s=o(n.anchorNode);s.parents(c.toLowerCase()).length||s.is(c)?document.execCommand("formatBlock",!1,"div"):document.execCommand("formatBlock",!1,c)}else t.insertImage();else t.createLink()}}},a.getSelectionRange=function(){if(window.getSelection){var e=window.getSelection();if(e.getRangeAt&&e.rangeCount)return e.getRangeAt(0)}else if(document.selection&&document.selection.createRange)return document.selection.createRange();return null},a.setSelectionRange=function(e){if(e)if(window.getSelection){var t=window.getSelection();t.removeAllRanges(),t.addRange(e)}else document.selection&&e.select&&e.select()},a.renderButtons=function(){var e=this,t="";function o(t){var o="md"===e.app.theme?"material-icons":"f7-icons";if(e.params.customButtons&&e.params.customButtons[t])return'<button type="button" class="text-editor-button" data-button="'+t+'">'+(e.params.customButtons[t].content||"")+"</button>";if(!m[t])return"";var n=m[t]["md"===e.app.theme?1:0];return('<button type="button" class="text-editor-button" data-button="'+t+'">'+(n.indexOf("<")>=0?n:'<i class="'+o+'">'+n+"</i>")+"</button>").trim()}return e.params.buttons.forEach((function(n,r){Array.isArray(n)?(n.forEach((function(e){t+=o(e)})),r<e.params.buttons.length-1&&e.params.dividers&&(t+='<div class="text-editor-button-divider"></div>')):t+=o(n)})),t},a.createToolbar=function(){this.$el.prepend('<div class="text-editor-toolbar">'+this.renderButtons()+"</div>")},a.createKeyboardToolbar=function(){this.$keyboardToolbarEl=o('<div class="toolbar toolbar-bottom text-editor-keyboard-toolbar"><div class="toolbar-inner">'+this.renderButtons()+"</div></div>")},a.createPopover=function(){var e=this;e.popover=e.app.popover.create({content:'\n <div class="popover theme-dark text-editor-popover">\n <div class="popover-inner">'+e.renderButtons()+"</div>\n </div>\n ",closeByOutsideClick:!1,backdrop:!1})},a.openKeyboardToolbar=function(){var e=this;e.$keyboardToolbarEl.parent(e.app.$el).length||(e.$el.trigger("texteditor:keyboardopen"),e.emit("local::keyboardOpen textEditorKeyboardOpen",e),e.app.$el.append(e.$keyboardToolbarEl))},a.closeKeyboardToolbar=function(){var e=this;e.$keyboardToolbarEl.remove(),e.$el.trigger("texteditor:keyboardclose"),e.emit("local::keyboardClose textEditorKeyboardClose",e)},a.openPopover=function(e,t,o,n){var r=this;r.popover&&(Object.assign(r.popover.params,{targetX:e,targetY:t,targetWidth:o,targetHeight:n}),clearTimeout(r.popoverTimeout),r.popoverTimeout=setTimeout((function(){r.popover&&(r.popover.opened?r.popover.resize():(r.$el.trigger("texteditor:popoveropen"),r.emit("local::popoverOpen textEditorPopoverOpen",r),r.popover.open()))}),400))},a.closePopover=function(){var e=this;clearTimeout(e.popoverTimeout),e.popover&&e.popover.opened&&(e.popoverTimeout=setTimeout((function(){e.popover&&(e.$el.trigger("texteditor:popoverclose"),e.emit("local::popoverClose textEditorPopoverClose",e),e.popover.close())}),400))},a.init=function(){var e=this;return e.value?e.$contentEl.html(e.value):e.value=e.$contentEl.html(),e.params.placeholder&&""===e.value&&e.insertPlaceholder(),"toolbar"===e.params.mode?e.createToolbar():"popover"===e.params.mode?e.createPopover():"keyboard-toolbar"===e.params.mode&&e.createKeyboardToolbar(),e.attachEvents(),e.$el.trigger("texteditor:init"),e.emit("local::init textEditorInit",e),e},a.destroy=function(){var e=this;e.$el.trigger("texteditor:beforedestroy"),e.emit("local::beforeDestroy textEditorBeforeDestroy",e),e.detachEvents(),"keyboard-toolbar"===e.params.mode&&e.$keyboardToolbarEl&&e.$keyboardToolbarEl.remove(),e.popover&&(e.popover.close(!1),e.popover.destroy()),delete e.$el[0].f7TextEditor,c(e),e=null},i}(i),v={name:"textEditor",params:{textEditor:{el:null,mode:"toolbar",value:void 0,customButtons:null,buttons:[["bold","italic","underline","strikeThrough"],["orderedList","unorderedList"],["link","image"],["paragraph","h1","h2","h3"],["alignLeft","alignCenter","alignRight","alignJustify"],["subscript","superscript"],["indent","outdent"]],dividers:!0,imageUrlText:"Insert image URL",linkUrlText:"Insert link URL",placeholder:null,clearFormattingOnPaste:!0}},create:function(){this.textEditor=l(a({defaultSelector:".text-editor",constructor:f,app:this,domProp:"f7TextEditor"}))},static:{TextEditor:f},on:{tabMounted:function(e){var t=this;o(e).find(".text-editor-init").each((function(e){var n=o(e).dataset();t.textEditor.create(l({el:e},n||{}))}))},tabBeforeRemove:function(e){o(e).find(".text-editor-init").each((function(e){e.f7TextEditor&&e.f7TextEditor.destroy()}))},pageInit:function(e){var t=this;e.$el.find(".text-editor-init").each((function(e){var n=o(e).dataset();t.textEditor.create(l({el:e},n||{}))}))},pageBeforeRemove:function(e){e.$el.find(".text-editor-init").each((function(e){e.f7TextEditor&&e.f7TextEditor.destroy()}))}},vnode:{"text-editor-init":{insert:function(e){var t=e.elm,n=o(t).dataset();this.textEditor.create(l({el:t},n||{}))},destroy:function(e){var t=e.elm;t.f7TextEditor&&t.f7TextEditor.destroy()}}}};if(t){if(e.prototype.modules&&e.prototype.modules[v.name])return;e.use(v),e.instance&&(e.instance.useModuleParams(v,e.instance.params),e.instance.useModule(v))}return v}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))