activeadmin_trumbowyg 0.1.1 → 0.2.0

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/mention/trumbowyg.mention.min.js

@@ -0,0 +1 @@
+!function(n){"use strict";function t(t,o){var e=[];return n.each(t,function(n,t){var i="mention-"+n,r={hasIcon:!1,text:o.o.plugins.mention.formatDropdownItem(t),fn:function(){return o.execCmd("insertHTML",o.o.plugins.mention.formatResult(t)),!0}};o.addBtnDef(i,r),e.push(i)}),e}function o(n){return n.login}function e(n){return"@"+n.login+" "}var i={source:[],formatDropdownItem:o,formatResult:e};n.extend(!0,n.trumbowyg,{langs:{en:{mention:"Mention"},da:{mention:"Nævn"},fr:{mention:"Mentionner"},ru:{mention:"Упомянуть"},tr:{mention:"Bahset"},zh_tw:{mention:"標記"},pt_br:{mention:"Menção"},ko:{mention:"언급"}},plugins:{mention:{init:function(o){o.o.plugins.mention=n.extend(!0,{},i,o.o.plugins.mention||{});var e={dropdown:t(o.o.plugins.mention.source,o)};o.addBtnDef("mention",e)}}}})}(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/mention/ui/sass/trumbowyg.mention.scss

@@ -0,0 +1,29 @@
+/**
+ * Trumbowyg v2.21.0 - A lightweight WYSIWYG editor
+ * Default stylesheet for Trumbowyg editor plugin
+ * ------------------------
+ * @link http://alex-d.github.io/Trumbowyg
+ * @license MIT
+ * @author Alexandre Demode (Alex-D)
+ *         Twitter : @AlexandreDemode
+ *         Website : alex-d.fr
+ */
+
+.trumbowyg-dropdown-mention {
+    button {
+        position: relative;
+        white-space: nowrap;
+
+        &:after {
+            content: "";
+            position: absolute;
+            top: 0;
+            right: 0;
+            width: 15%;
+            height: 100%;
+            background-size: 100%;
+            background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #ffffff 80%, #ffffff 100%);
+            pointer-events: none;
+        }
+    }
+}

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/mention/ui/trumbowyg.mention.css

@@ -0,0 +1,24 @@
+/**
+ * Trumbowyg v2.21.0 - A lightweight WYSIWYG editor
+ * Trumbowyg plugin stylesheet
+ * ------------------------
+ * @link http://alex-d.github.io/Trumbowyg
+ * @license MIT
+ * @author Alexandre Demode (Alex-D)
+ *         Twitter : @AlexandreDemode
+ *         Website : alex-d.fr
+ */
+
+.trumbowyg-dropdown-mention button {
+  position: relative;
+  white-space: nowrap; }
+  .trumbowyg-dropdown-mention button:after {
+    content: "";
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 15%;
+    height: 100%;
+    background-size: 100%;
+    background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #ffffff 80%, #ffffff 100%);
+    pointer-events: none; }

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/mention/ui/trumbowyg.mention.min.css

@@ -0,0 +1,2 @@
+/** Trumbowyg v2.21.0 - A lightweight WYSIWYG editor - alex-d.github.io/Trumbowyg - License MIT - Author : Alexandre Demode (Alex-D) / alex-d.fr */
+.trumbowyg-dropdown-mention button{position:relative;white-space:nowrap}.trumbowyg-dropdown-mention button:after{content:"";position:absolute;top:0;right:0;width:15%;height:100%;background-size:100%;background-image:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 80%,#fff 100%);pointer-events:none}

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/noembed/trumbowyg.noembed.js

@@ -19,10 +19,14 @@
 
     $.extend(true, $.trumbowyg, {
         langs: {
+            // jshint camelcase:false
             en: {
                 noembed: 'Noembed',
                 noembedError: 'Error'
             },
+            da: {
+                noembedError: 'Fejl'
+            },
             sk: {
                 noembedError: 'Chyba'
             },
@@ -37,7 +41,23 @@
             },
             ja: {
                 noembedError: 'エラー'
-            }
+            },
+            tr: {
+                noembedError: 'Hata'
+            },
+            zh_tw: {
+                noembed: '插入影片',
+                noembedError: '錯誤'
+            },
+            pt_br: {
+                noembed: 'Incorporar',
+                noembedError: 'Erro'
+            },
+            ko: {
+                noembed: 'oEmbed 넣기',
+                noembedError: '에러'
+            },
+            // jshint camelcase:true
         },
 
         plugins: {

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/noembed/trumbowyg.noembed.min.js

@@ -1 +1 @@
-!function(e){"use strict";var r={proxy:"https://noembed.com/embed?nowrap=on",urlFiled:"url",data:[],success:void 0,error:void 0};e.extend(!0,e.trumbowyg,{langs:{en:{noembed:"Noembed",noembedError:"Error"},sk:{noembedError:"Chyba"},fr:{noembedError:"Erreur"},cs:{noembedError:"Chyba"},ru:{noembedError:"Ошибка"},ja:{noembedError:"エラー"}},plugins:{noembed:{init:function(o){o.o.plugins.noembed=e.extend(!0,{},r,o.o.plugins.noembed||{});var n={fn:function(){var r=o.openModalInsert(o.lang.noembed,{url:{label:"URL",required:!0}},function(n){e.ajax({url:o.o.plugins.noembed.proxy,type:"GET",data:n,cache:!1,dataType:"json",success:o.o.plugins.noembed.success||function(n){n.html?(o.execCmd("insertHTML",n.html),setTimeout(function(){o.closeModal()},250)):o.addErrorOnModalField(e("input[type=text]",r),n.error)},error:o.o.plugins.noembed.error||function(){o.addErrorOnModalField(e("input[type=text]",r),o.lang.noembedError)}})})}};o.addBtnDef("noembed",n)}}}})}(jQuery);
+!function(e){"use strict";var r={proxy:"https://noembed.com/embed?nowrap=on",urlFiled:"url",data:[],success:void 0,error:void 0};e.extend(!0,e.trumbowyg,{langs:{en:{noembed:"Noembed",noembedError:"Error"},da:{noembedError:"Fejl"},sk:{noembedError:"Chyba"},fr:{noembedError:"Erreur"},cs:{noembedError:"Chyba"},ru:{noembedError:"Ошибка"},ja:{noembedError:"エラー"},tr:{noembedError:"Hata"},zh_tw:{noembed:"插入影片",noembedError:"錯誤"},pt_br:{noembed:"Incorporar",noembedError:"Erro"},ko:{noembed:"oEmbed 넣기",noembedError:"에러"}},plugins:{noembed:{init:function(o){o.o.plugins.noembed=e.extend(!0,{},r,o.o.plugins.noembed||{});var n={fn:function(){var r=o.openModalInsert(o.lang.noembed,{url:{label:"URL",required:!0}},function(n){e.ajax({url:o.o.plugins.noembed.proxy,type:"GET",data:n,cache:!1,dataType:"json",success:o.o.plugins.noembed.success||function(n){n.html?(o.execCmd("insertHTML",n.html),setTimeout(function(){o.closeModal()},250)):o.addErrorOnModalField(e("input[type=text]",r),n.error)},error:o.o.plugins.noembed.error||function(){o.addErrorOnModalField(e("input[type=text]",r),o.lang.noembedError)}})})}};o.addBtnDef("noembed",n)}}}})}(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/pasteembed/trumbowyg.pasteembed.js

@@ -0,0 +1,96 @@
+/* ===========================================================
+ * trumbowyg.pasteembed.js v1.0
+ * Url paste to iframe with noembed. Plugin for Trumbowyg
+ * http://alex-d.github.com/Trumbowyg
+ * ===========================================================
+ * Author : Max Seelig
+ *          Facebook : https://facebook.com/maxse
+ *          Website : https://www.maxmade.nl/
+ */
+
+(function($) {
+    'use strict';
+
+    var defaultOptions = {
+        enabled: true,
+        endpoints: [
+            'https://noembed.com/embed?nowrap=on',
+            'https://api.maxmade.nl/url2iframe/embed'
+        ]
+    };
+
+    $.extend(true, $.trumbowyg, {
+        plugins: {
+            pasteEmbed: {
+                init: function(trumbowyg) {
+                    trumbowyg.o.plugins.pasteEmbed = $.extend(true, {}, defaultOptions, trumbowyg.o.plugins.pasteEmbed || {});
+
+                    if (!trumbowyg.o.plugins.pasteEmbed.enabled) {
+                        return;
+                    }
+
+                    trumbowyg.pasteHandlers.push(function(pasteEvent) {
+                        try {
+                            var clipboardData = (pasteEvent.originalEvent || pasteEvent).clipboardData,
+                                pastedData = clipboardData.getData('Text'),
+                                endpoints = trumbowyg.o.plugins.pasteEmbed.endpoints,
+                                request = null;
+
+                            if (pastedData.startsWith('http')) {
+                                pasteEvent.stopPropagation();
+                                pasteEvent.preventDefault();
+
+                                var query = {
+                                    url: pastedData.trim()
+                                };
+                                var content = '';
+                                var index = 0;
+
+                                if (request && request.transport) {
+                                    request.transport.abort();
+                                }
+
+                                request = $.ajax({
+                                    crossOrigin: true,
+                                    url: endpoints[index],
+                                    type: 'GET',
+                                    data: query,
+                                    cache: false,
+                                    dataType: 'jsonp',
+                                    success: function(res) {
+                                        if (res.html) {
+                                            index = 0;
+                                            content = res.html;
+                                        } else {
+                                            index += 1;
+                                        }
+                                    },
+                                    error: function() {
+                                        index += 1;
+                                    },
+                                    complete: function() {
+                                        if (content.length === 0 && index < endpoints.length - 1) {
+                                            this.url = endpoints[index];
+                                            this.data = query;
+                                            $.ajax(this);
+                                        }
+                                        if (index === endpoints.length - 1) {
+                                            content = $('<a>', {
+                                                href: pastedData,
+                                                text: pastedData
+                                            }).prop('outerHTML');
+                                        }
+                                        if (content.length > 0) {
+                                            index = 0;
+                                            trumbowyg.execCmd('insertHTML', content);
+                                        }
+                                    }
+                                });
+                            }
+                        } catch (c) {}
+                    });
+                }
+            }
+        }
+    });
+})(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/pasteembed/trumbowyg.pasteembed.min.js

@@ -0,0 +1 @@
+!function(t){"use strict";var e={enabled:!0,endpoints:["https://noembed.com/embed?nowrap=on","https://api.maxmade.nl/url2iframe/embed"]};t.extend(!0,t.trumbowyg,{plugins:{pasteEmbed:{init:function(n){n.o.plugins.pasteEmbed=t.extend(!0,{},e,n.o.plugins.pasteEmbed||{}),n.o.plugins.pasteEmbed.enabled&&n.pasteHandlers.push(function(e){try{var a=(e.originalEvent||e).clipboardData,r=a.getData("Text"),s=n.o.plugins.pasteEmbed.endpoints,i=null;if(r.startsWith("http")){e.stopPropagation(),e.preventDefault();var o={url:r.trim()},p="",l=0;i&&i.transport&&i.transport.abort(),i=t.ajax({crossOrigin:!0,url:s[l],type:"GET",data:o,cache:!1,dataType:"jsonp",success:function(t){t.html?(l=0,p=t.html):l+=1},error:function(){l+=1},complete:function(){0===p.length&&l<s.length-1&&(this.url=s[l],this.data=o,t.ajax(this)),l===s.length-1&&(p=t("<a>",{href:r,text:r}).prop("outerHTML")),p.length>0&&(l=0,n.execCmd("insertHTML",p))}})}}catch(u){}})}}}})}(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/pasteimage/trumbowyg.pasteimage.js

@@ -18,19 +18,27 @@
                     trumbowyg.pasteHandlers.push(function (pasteEvent) {
                         try {
                             var items = (pasteEvent.originalEvent || pasteEvent).clipboardData.items,
+                                mustPreventDefault = false,
                                 reader;
 
-                            for (var i = items.length -1; i >= 0; i += 1) {
+                            for (var i = items.length - 1; i >= 0; i -= 1) {
                                 if (items[i].type.match(/^image\//)) {
                                     reader = new FileReader();
                                     /* jshint -W083 */
                                     reader.onloadend = function (event) {
-                                        trumbowyg.execCmd('insertImage', event.target.result, undefined, true);
+                                        trumbowyg.execCmd('insertImage', event.target.result, false, true);
                                     };
                                     /* jshint +W083 */
                                     reader.readAsDataURL(items[i].getAsFile());
+
+                                    mustPreventDefault = true;
                                 }
                             }
+
+                            if (mustPreventDefault) {
+                                pasteEvent.stopPropagation();
+                                pasteEvent.preventDefault();
+                            }
                         } catch (c) {
                         }
                     });

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/pasteimage/trumbowyg.pasteimage.min.js

@@ -1 +1 @@
-!function(e){"use strict";e.extend(!0,e.trumbowyg,{plugins:{pasteImage:{init:function(e){e.pasteHandlers.push(function(t){try{for(var a,n=(t.originalEvent||t).clipboardData.items,i=n.length-1;i>=0;i+=1)n[i].type.match(/^image\//)&&(a=new FileReader,a.onloadend=function(t){e.execCmd("insertImage",t.target.result,void 0,!0)},a.readAsDataURL(n[i].getAsFile()))}catch(r){}})}}}})}(jQuery);
+!function(e){"use strict";e.extend(!0,e.trumbowyg,{plugins:{pasteImage:{init:function(e){e.pasteHandlers.push(function(t){try{for(var a,n=(t.originalEvent||t).clipboardData.items,i=!1,r=n.length-1;r>=0;r-=1)n[r].type.match(/^image\//)&&(a=new FileReader,a.onloadend=function(t){e.execCmd("insertImage",t.target.result,!1,!0)},a.readAsDataURL(n[r].getAsFile()),i=!0);i&&(t.stopPropagation(),t.preventDefault())}catch(o){}})}}}})}(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/preformatted/trumbowyg.preformatted.js

@@ -16,8 +16,11 @@
             en: {
                 preformatted: 'Code sample <pre>'
             },
+            da: {
+                preformatted: 'Præformateret <pre>'
+            },
             fr: {
-                preformatted: 'Exemple de code'
+                preformatted: 'Exemple de code <pre>'
             },
             it: {
                 preformatted: 'Codice <pre>'
@@ -30,7 +33,19 @@
             },
             ja: {
                 preformatted: 'コードサンプル <pre>'
-            }
+            },
+            tr: {
+                preformatted: 'Kod örneği <pre>'
+            },
+            zh_tw: {
+                preformatted: '代碼範例 <pre>'
+            },
+            pt_br: {
+                preformatted: 'Exemple de código <pre>'
+            },
+            ko: {
+                preformatted: '코드 예제 <pre>'
+            },
         },
         // jshint camelcase:true
 
@@ -69,6 +84,7 @@
     function getSelectionParentElement() {
         var parentEl = null,
             selection;
+
         if (window.getSelection) {
             selection = window.getSelection();
             if (selection.rangeCount) {
@@ -80,6 +96,7 @@
         } else if ((selection = document.selection) && selection.type !== 'Control') {
             parentEl = selection.createRange().parentElement();
         }
+
         return parentEl;
     }
 
@@ -100,6 +117,7 @@
      */
     function unwrapCode() {
         var container = null;
+
         if (document.selection) { //for IE
             container = document.selection.createRange().parentElement();
         } else {
@@ -108,9 +126,11 @@
                 container = select.getRangeAt(0).startContainer.parentNode;
             }
         }
+
         //'paranoic' unwrap
         var ispre = $(container).contents().closest('pre').length;
         var iscode = $(container).contents().closest('code').length;
+
         if (ispre && iscode) {
             $(container).contents().unwrap('code').unwrap('pre');
         } else if (ispre) {
@@ -119,5 +139,4 @@
             $(container).contents().unwrap('code');
         }
     }
-
 })(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/preformatted/trumbowyg.preformatted.min.js

@@ -1 +1 @@
-!function(e){"use strict";function t(){var e,t=null;return window.getSelection?(e=window.getSelection(),e.rangeCount&&(t=e.getRangeAt(0).commonAncestorContainer,1!==t.nodeType&&(t=t.parentNode))):(e=document.selection)&&"Control"!==e.type&&(t=e.createRange().parentElement()),t}function n(e){var t=document.createElement("DIV");return t.innerHTML=e,t.textContent||t.innerText||""}function r(){var t=null;if(document.selection)t=document.selection.createRange().parentElement();else{var n=window.getSelection();n.rangeCount>0&&(t=n.getRangeAt(0).startContainer.parentNode)}var r=e(t).contents().closest("pre").length,o=e(t).contents().closest("code").length;r&&o?e(t).contents().unwrap("code").unwrap("pre"):r?e(t).contents().unwrap("pre"):o&&e(t).contents().unwrap("code")}e.extend(!0,e.trumbowyg,{langs:{en:{preformatted:"Code sample <pre>"},fr:{preformatted:"Exemple de code"},it:{preformatted:"Codice <pre>"},zh_cn:{preformatted:"代码示例 <pre>"},ru:{preformatted:"Пример кода <pre>"},ja:{preformatted:"コードサンプル <pre>"}},plugins:{preformatted:{init:function(e){var o={fn:function(){e.saveRange();var o=e.getRangeText();if(""!==o.replace(/\s/g,""))try{var a=t().tagName.toLowerCase();if("code"===a||"pre"===a)return r();e.execCmd("insertHTML","<pre><code>"+n(o)+"</code></pre>")}catch(c){}},tag:"pre"};e.addBtnDef("preformatted",o)}}}})}(jQuery);
+!function(e){"use strict";function t(){var e,t=null;return window.getSelection?(e=window.getSelection(),e.rangeCount&&(t=e.getRangeAt(0).commonAncestorContainer,1!==t.nodeType&&(t=t.parentNode))):(e=document.selection)&&"Control"!==e.type&&(t=e.createRange().parentElement()),t}function r(e){var t=document.createElement("DIV");return t.innerHTML=e,t.textContent||t.innerText||""}function n(){var t=null;if(document.selection)t=document.selection.createRange().parentElement();else{var r=window.getSelection();r.rangeCount>0&&(t=r.getRangeAt(0).startContainer.parentNode)}var n=e(t).contents().closest("pre").length,o=e(t).contents().closest("code").length;n&&o?e(t).contents().unwrap("code").unwrap("pre"):n?e(t).contents().unwrap("pre"):o&&e(t).contents().unwrap("code")}e.extend(!0,e.trumbowyg,{langs:{en:{preformatted:"Code sample <pre>"},da:{preformatted:"Præformateret <pre>"},fr:{preformatted:"Exemple de code <pre>"},it:{preformatted:"Codice <pre>"},zh_cn:{preformatted:"代码示例 <pre>"},ru:{preformatted:"Пример кода <pre>"},ja:{preformatted:"コードサンプル <pre>"},tr:{preformatted:"Kod örneği <pre>"},zh_tw:{preformatted:"代碼範例 <pre>"},pt_br:{preformatted:"Exemple de código <pre>"},ko:{preformatted:"코드 예제 <pre>"}},plugins:{preformatted:{init:function(e){var o={fn:function(){e.saveRange();var o=e.getRangeText();if(""!==o.replace(/\s/g,""))try{var a=t().tagName.toLowerCase();if("code"===a||"pre"===a)return n();e.execCmd("insertHTML","<pre><code>"+r(o)+"</code></pre>")}catch(p){}},tag:"pre"};e.addBtnDef("preformatted",o)}}}})}(jQuery);

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/resizimg/resizable-resolveconflict.js

@@ -0,0 +1,20 @@
+(function (factory, define, require, module) {
+    'use strict';
+
+    if (typeof define === 'function' && define.amd) {
+        // AMD
+        define(['jquery'], factory);
+    } else if (typeof module === 'object' && typeof module.exports === 'object') {
+        // CommonJS
+        module.exports = factory(require('jquery'));
+    } else {
+        // Global jQuery
+        factory(jQuery);
+    }
+}(function ($) {
+    'use strict';
+
+    // rename to avoid conflict with jquery-resizable
+    $.fn.uiresizable = $.fn.resizable;
+    delete $.fn.resizable;
+}));

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/resizimg/resizable-resolveconflict.min.js

@@ -0,0 +1 @@
+!function(e,t,o,r){"use strict";"function"==typeof t&&t.amd?t(["jquery"],e):"object"==typeof r&&"object"==typeof r.exports?r.exports=e(o("jquery")):e(jQuery)}(function(e){"use strict";e.fn.uiresizable=e.fn.resizable,delete e.fn.resizable});

data/app/assets/javascripts/activeadmin/trumbowyg/plugins/resizimg/trumbowyg.resizimg.js

@@ -0,0 +1,303 @@
+;(function ($) {
+    'use strict';
+
+    var defaultOptions = {
+        minSize: 32,
+        step: 4
+    };
+
+    function preventDefault(e) {
+        e.stopPropagation();
+        e.preventDefault();
+    }
+
+    var ResizeWithCanvas = function () {
+        // variable to create canvas and save img in resize mode
+        this.resizeCanvas = document.createElement('canvas');
+        // to allow canvas to get focus
+        this.resizeCanvas.setAttribute('tabindex', '0');
+        this.resizeCanvas.id = 'trumbowyg-resizimg-' + (+new Date());
+        this.ctx = null;
+        this.resizeImg = null;
+
+        this.pressEscape = function (obj) {
+            obj.reset();
+        };
+        this.pressBackspaceOrDelete = function (obj) {
+            $(obj.resizeCanvas).replaceWith('');
+            obj.resizeImg = null;
+        };
+
+        // PRIVATE FUNCTION
+        var focusedNow = false;
+        var isCursorSeResize = false;
+
+        // calculate offset to change mouse over square in the canvas
+        var offsetX, offsetY;
+        var reOffset = function (canvas) {
+            var BB = canvas.getBoundingClientRect();
+            offsetX = BB.left;
+            offsetY = BB.top;
+        };
+
+        var drawRect = function (shapeData, ctx) {
+            // Inner
+            ctx.beginPath();
+            ctx.fillStyle = 'rgb(255, 255, 255)';
+            ctx.rect(shapeData.points.x, shapeData.points.y, shapeData.points.width, shapeData.points.height);
+            ctx.fill();
+            ctx.stroke();
+        };
+
+        var updateCanvas = function (canvas, ctx, img, canvasWidth, canvasHeight) {
+            ctx.translate(0.5, 0.5);
+            ctx.lineWidth = 1;
+
+            // image
+            ctx.drawImage(img, 5, 5, canvasWidth - 10, canvasHeight - 10);
+
+            // border
+            ctx.beginPath();
+            ctx.rect(5, 5, canvasWidth - 10, canvasHeight - 10);
+            ctx.stroke();
+
+            // square in the angle
+            ctx.beginPath();
+            ctx.fillStyle = 'rgb(255, 255, 255)';
+            ctx.rect(canvasWidth - 10, canvasHeight - 10, 9, 9);
+            ctx.fill();
+            ctx.stroke();
+
+            // get the offset to change the mouse cursor
+            reOffset(canvas);
+
+            return ctx;
+        };
+
+        // PUBLIC FUNCTION
+        // necessary to correctly print cursor over square. Called once for instance. Useless with trumbowyg.
+        this.init = function () {
+            var _this = this;
+            $(window).on('scroll resize', function () {
+                _this.reCalcOffset();
+            });
+        };
+
+        this.reCalcOffset = function () {
+            reOffset(this.resizeCanvas);
+        };
+
+        this.canvasId = function () {
+            return this.resizeCanvas.id;
+        };
+
+        this.isActive = function () {
+            return this.resizeImg !== null;
+        };
+
+        this.isFocusedNow = function () {
+            return focusedNow;
+        };
+
+        this.blurNow = function () {
+            focusedNow = false;
+        };
+
+        // restore image in the HTML of the editor
+        this.reset = function () {
+            if (this.resizeImg === null) {
+                return;
+            }
+
+            this.resizeImg.width = this.resizeCanvas.clientWidth - 10;
+            this.resizeImg.height = this.resizeCanvas.clientHeight - 10;
+            // clear style of image to avoid issue on resize because this attribute have priority over width and height attribute
+            this.resizeImg.removeAttribute('style');
+
+            $(this.resizeCanvas).replaceWith($(this.resizeImg));
+
+            // reset canvas style
+            this.resizeCanvas.removeAttribute('style');
+            this.resizeImg = null;
+        };
+
+        // setup canvas with points and border to allow the resizing operation
+        this.setup = function (img, resizableOptions) {
+            this.resizeImg = img;
+
+            if (!this.resizeCanvas.getContext) {
+                return false;
+            }
+
+            focusedNow = true;
+
+            // draw canvas
+            this.resizeCanvas.width = $(this.resizeImg).width() + 10;
+            this.resizeCanvas.height = $(this.resizeImg).height() + 10;
+            this.resizeCanvas.style.margin = '-5px';
+            this.ctx = this.resizeCanvas.getContext('2d');
+
+            // replace image with canvas
+            $(this.resizeImg).replaceWith($(this.resizeCanvas));
+
+            updateCanvas(this.resizeCanvas, this.ctx, this.resizeImg, this.resizeCanvas.width, this.resizeCanvas.height);
+
+            // enable resize
+            $(this.resizeCanvas).resizable(resizableOptions)
+                .on('mousedown', preventDefault);
+
+            var _this = this;
+            $(this.resizeCanvas)
+                .on('mousemove', function (e) {
+                    var mouseX = Math.round(e.clientX - offsetX);
+                    var mouseY = Math.round(e.clientY - offsetY);
+
+                    var wasCursorSeResize = isCursorSeResize;
+
+                    _this.ctx.rect(_this.resizeCanvas.width - 10, _this.resizeCanvas.height - 10, 9, 9);
+                    isCursorSeResize = _this.ctx.isPointInPath(mouseX, mouseY);
+                    if (wasCursorSeResize !== isCursorSeResize) {
+                        this.style.cursor = isCursorSeResize ? 'se-resize' : 'default';
+                    }
+                })
+                .on('keydown', function (e) {
+                    if (!_this.isActive()) {
+                        return;
+                    }
+
+                    var x = e.keyCode;
+                    if (x === 27) { // ESC
+                        _this.pressEscape(_this);
+                    } else if (x === 8 || x === 46) { // BACKSPACE or DELETE
+                        _this.pressBackspaceOrDelete(_this);
+                    }
+                })
+                .on('focus', preventDefault);
+
+            this.resizeCanvas.focus();
+
+            return true;
+        };
+
+        // update the canvas after the resizing
+        this.refresh = function () {
+            if (!this.resizeCanvas.getContext) {
+                return;
+            }
+
+            this.resizeCanvas.width = this.resizeCanvas.clientWidth;
+            this.resizeCanvas.height = this.resizeCanvas.clientHeight;
+            updateCanvas(this.resizeCanvas, this.ctx, this.resizeImg, this.resizeCanvas.width, this.resizeCanvas.height);
+        };
+    };
+
+    // object to interact with canvas
+    var resizeWithCanvas = new ResizeWithCanvas();
+
+    function destroyResizable(trumbowyg) {
+        // clean html code
+        trumbowyg.$ed.find('canvas.resizable')
+            .resizable('destroy')
+            .off('mousedown', preventDefault)
+            .removeClass('resizable');
+
+        resizeWithCanvas.reset();
+
+        trumbowyg.syncCode();
+    }
+
+    $.extend(true, $.trumbowyg, {
+        plugins: {
+            resizimg: {
+                init: function (trumbowyg) {
+                    trumbowyg.o.plugins.resizimg = $.extend(true, {},
+                        defaultOptions,
+                        trumbowyg.o.plugins.resizimg || {},
+                        {
+                            resizable: {
+                                resizeWidth: false,
+                                onDragStart: function (ev, $el) {
+                                    var opt = trumbowyg.o.plugins.resizimg;
+                                    var x = ev.pageX - $el.offset().left;
+                                    var y = ev.pageY - $el.offset().top;
+                                    if (x < $el.width() - opt.minSize || y < $el.height() - opt.minSize) {
+                                        return false;
+                                    }
+                                },
+                                onDrag: function (ev, $el, newWidth, newHeight) {
+                                    var opt = trumbowyg.o.plugins.resizimg;
+                                    if (newHeight < opt.minSize) {
+                                        newHeight = opt.minSize;
+                                    }
+                                    newHeight -= newHeight % opt.step;
+                                    $el.height(newHeight);
+                                    return false;
+                                },
+                                onDragEnd: function () {
+                                    // resize update canvas information
+                                    resizeWithCanvas.refresh();
+                                    trumbowyg.syncCode();
+                                }
+                            }
+                        }
+                    );
+
+                    function initResizable() {
+                        trumbowyg.$ed.find('img')
+                            .off('click')
+                            .on('click', function (e) {
+                                // if I'm already do a resize, reset it
+                                if (resizeWithCanvas.isActive()) {
+                                    resizeWithCanvas.reset();
+                                }
+                                // initialize resize of image
+                                resizeWithCanvas.setup(this, trumbowyg.o.plugins.resizimg.resizable);
+
+                                preventDefault(e);
+                            });
+                    }
+
+                    trumbowyg.$c.on('tbwinit', function () {
+                        initResizable();
+
+                        // disable resize when click on other items
+                        trumbowyg.$ed.on('click', function (e) {
+                            // check if I've clicked out of canvas or image to reset it
+                            if ($(e.target).is('img') || e.target.id === resizeWithCanvas.canvasId()) {
+                                return;
+                            }
+
+                            preventDefault(e);
+                            resizeWithCanvas.reset();
+
+                            // save changes
+                            trumbowyg.$c.trigger('tbwchange');
+                        });
+
+                        trumbowyg.$ed.on('scroll', function () {
+                            resizeWithCanvas.reCalcOffset();
+                        });
+                    });
+
+                    trumbowyg.$c.on('tbwfocus tbwchange', initResizable);
+                    trumbowyg.$c.on('tbwresize', function () {
+                        resizeWithCanvas.reCalcOffset();
+                    });
+
+                    // Destroy
+                    trumbowyg.$c.on('tbwblur', function () {
+                        // if I have already focused the canvas avoid destroy
+                        if (resizeWithCanvas.isFocusedNow()) {
+                            resizeWithCanvas.blurNow();
+                        } else {
+                            destroyResizable(trumbowyg);
+                        }
+                    });
+                },
+                destroy: function (trumbowyg) {
+                    destroyResizable(trumbowyg);
+                }
+            }
+        }
+    });
+})(jQuery);