vendor/assets/javascripts/uikit/components/htmleditor.js in uikit-sass-rails-1.3.0 vs vendor/assets/javascripts/uikit/components/htmleditor.js in uikit-sass-rails-1.4.0

- old
+ new

@@ -1,22 +1,24 @@ -/*! UIkit 2.11.1 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ (function(addon) { var component; - if (jQuery && jQuery.UIkit) { - component = addon(jQuery, jQuery.UIkit); + if (window.UIkit) { + component = addon(UIkit); } if (typeof define == "function" && define.amd) { define("uikit-htmleditor", ["uikit"], function(){ - return component || addon(jQuery, jQuery.UIkit); + return component || addon(UIkit); }); } -})(function($, UI) { +})(function(UI) { + "use strict"; + var editors = []; UI.component('htmleditor', { defaults: { @@ -24,63 +26,81 @@ mode : 'split', markdown : false, autocomplete : true, height : 500, maxsplitsize : 1000, - markedOptions: { gfm: true, tables: true, breaks: true, pedantic: true, sanitize: false, smartLists: true, smartypants: false, langPrefix: 'lang-'}, codemirror : { mode: 'htmlmixed', lineWrapping: true, dragDrop: false, autoCloseTags: true, matchTags: true, autoCloseBrackets: true, matchBrackets: true, indentUnit: 4, indentWithTabs: false, tabSize: 4, hintOptions: {completionSingle:false} }, toolbar : [ 'bold', 'italic', 'strike', 'link', 'image', 'blockquote', 'listUl', 'listOl' ], lblPreview : 'Preview', lblCodeview : 'HTML', lblMarkedview: 'Markdown' }, + boot: function() { + + // init code + UI.ready(function(context) { + + UI.$('textarea[data-uk-htmleditor]', context).each(function() { + + var editor = UI.$(this), obj; + + if (!editor.data('htmleditor')) { + obj = UI.htmleditor(editor, UI.Utils.options(editor.attr('data-uk-htmleditor'))); + } + }); + }); + }, + init: function() { var $this = this, tpl = UI.components.htmleditor.template; this.CodeMirror = this.options.CodeMirror || CodeMirror; this.buttons = {}; tpl = tpl.replace(/\{:lblPreview\}/g, this.options.lblPreview); tpl = tpl.replace(/\{:lblCodeview\}/g, this.options.lblCodeview); - this.htmleditor = $(tpl); + this.htmleditor = UI.$(tpl); this.content = this.htmleditor.find('.uk-htmleditor-content'); this.toolbar = this.htmleditor.find('.uk-htmleditor-toolbar'); this.preview = this.htmleditor.find('.uk-htmleditor-preview').children().eq(0); this.code = this.htmleditor.find('.uk-htmleditor-code'); this.element.before(this.htmleditor).appendTo(this.code); this.editor = this.CodeMirror.fromTextArea(this.element[0], this.options.codemirror); this.editor.htmleditor = this; this.editor.on('change', UI.Utils.debounce(function() { $this.render(); }, 150)); - this.editor.on('change', function() { $this.editor.save(); }); + this.editor.on('change', function() { + $this.editor.save(); + $this.element.trigger('input'); + }); this.code.find('.CodeMirror').css('height', this.options.height); // iframe mode? if (this.options.iframe) { - this.iframe = $('<iframe class="uk-htmleditor-iframe" frameborder="0" scrolling="auto" height="100" width="100%"></iframe>'); + this.iframe = UI.$('<iframe class="uk-htmleditor-iframe" frameborder="0" scrolling="auto" height="100" width="100%"></iframe>'); this.preview.append(this.iframe); // must open and close document object to start using it! this.iframe[0].contentWindow.document.open(); this.iframe[0].contentWindow.document.close(); - this.preview.container = $(this.iframe[0].contentWindow.document).find('body'); + this.preview.container = UI.$(this.iframe[0].contentWindow.document).find('body'); // append custom stylesheet if (typeof(this.options.iframe) === 'string') { this.preview.container.parent().append('<link rel="stylesheet" href="'+this.options.iframe+'">'); } } else { this.preview.container = this.preview; } - UI.$win.on('resize', UI.Utils.debounce(function() { $this.fit(); }, 200)); + UI.$win.on('resize load', UI.Utils.debounce(function() { $this.fit(); }, 200)); var previewContainer = this.iframe ? this.preview.container:$this.preview.parent(), codeContent = this.code.find('.CodeMirror-sizer'), codeScroll = this.code.find('.CodeMirror-scroll').on('scroll', UI.Utils.debounce(function() { @@ -103,22 +123,22 @@ if ($this.htmleditor.attr('data-mode') == 'tab') { $this.htmleditor.find('.uk-htmleditor-button-code, .uk-htmleditor-button-preview').removeClass('uk-active').filter(this).addClass('uk-active'); - $this.activetab = $(this).hasClass('uk-htmleditor-button-code') ? 'code' : 'preview'; + $this.activetab = UI.$(this).hasClass('uk-htmleditor-button-code') ? 'code' : 'preview'; $this.htmleditor.attr('data-active-tab', $this.activetab); $this.editor.refresh(); } }); // toolbar actions this.htmleditor.on('click', 'a[data-htmleditor-button]', function() { if (!$this.code.is(':visible')) return; - $this.trigger('action.' + $(this).data('htmleditor-button'), [$this.editor]); + $this.trigger('action.' + UI.$(this).data('htmleditor-button'), [$this.editor]); }); this.preview.parent().css('height', this.code.height()); // autocomplete @@ -138,27 +158,27 @@ }, 100)); } this.debouncedRedraw = UI.Utils.debounce(function () { $this.redraw(); }, 5); - this.on('init', function() { + this.on('init.uk.component', function() { $this.redraw(); }); - this.element.attr('data-uk-check-display', 1).on('uk.check.display', function(e) { - if(this.htmleditor.is(":visible")) this.fit(); + this.element.attr('data-uk-check-display', 1).on('display.uk.check', function(e) { + if (this.htmleditor.is(":visible")) this.fit(); }.bind(this)); editors.push(this); }, addButton: function(name, button) { this.buttons[name] = button; }, addButtons: function(buttons) { - $.extend(this.buttons, buttons); + UI.$.extend(this.buttons, buttons); }, replaceInPreview: function(regexp, callback) { var editor = this.editor, results = [], value = editor.getValue(), offset = -1; @@ -178,19 +198,19 @@ if (cursor.line === match.from.line && cursor.line === match.to.line) { return cursor.ch >= match.from.ch && cursor.ch < match.to.ch; } - return (cursor.line === match.from.line && cursor.ch >= match.from.ch) - || (cursor.line > match.from.line && cursor.line < match.to.line) - || (cursor.line === match.to.line && cursor.ch < match.to.ch); + return (cursor.line === match.from.line && cursor.ch >= match.from.ch) || + (cursor.line > match.from.line && cursor.line < match.to.line) || + (cursor.line === match.to.line && cursor.ch < match.to.ch); } }; var result = callback(match); - if (result == false) { + if (!result) { return arguments[0]; } results.push(match); return result; @@ -283,11 +303,11 @@ this.preview.container.html(this.currentvalue); }, addShortcut: function(name, callback) { var map = {}; - if (!$.isArray(name)) { + if (!UI.$.isArray(name)) { name = [name]; } name.forEach(function(key) { map[key] = callback; @@ -486,18 +506,16 @@ UI.plugin('htmleditor', 'markdown', { init: function(editor) { - var parser = editor.options.marked || marked; + var parser = editor.options.mdparser || marked || null; if (!parser) return; - parser.setOptions(editor.options.markedOptions); - if (editor.options.markdown) { - enableMarkdown() + enableMarkdown(); } addAction('bold', '**$1**'); addAction('italic', '*$1*'); addAction('strike', '~~$1~~'); @@ -562,11 +580,11 @@ param.mode = 'markdown'; } } }); - $.extend(editor, { + UI.$.extend(editor, { enableMarkdown: function() { enableMarkdown() this.render(); }, @@ -597,18 +615,7 @@ }); } } }); - // init code - $(function() { - $('textarea[data-uk-htmleditor]').each(function() { - var editor = $(this), obj; - - if (!editor.data('htmleditor')) { - obj = UI.htmleditor(editor, UI.Utils.options(editor.attr('data-uk-htmleditor'))); - } - }); - }); - return UI.htmleditor; -}); \ No newline at end of file +});