froala-editor/js/plugins/image_manager.min.js

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

/*!
 * froala_editor v2.8.3 (https://www.froala.com/wysiwyg-editor)
 * License https://froala.com/wysiwyg-editor/terms/
 * Copyright 2014-2018 Froala Labs
 */

!function(e,a){"object"==typeof exports&&"undefined"!=typeof module?a(require("jquery")):"function"==typeof define&&define.amd?define(["jquery"],a):a(e.jQuery)}(this,function(e){"use strict";var a=(e=e&&e.hasOwnProperty("default")?e["default"]:e).FE;if(Object.assign(a.DEFAULTS,{imageManagerLoadURL:"https://i.froala.com/load-files",imageManagerLoadMethod:"get",imageManagerLoadParams:{},imageManagerPreloader:null,imageManagerDeleteURL:"",imageManagerDeleteMethod:"post",imageManagerDeleteParams:{},imageManagerPageSize:12,imageManagerScrollOffset:20,imageManagerToggleTags:!0}),a.PLUGINS.imageManager=function(s){var g,l,r,n,i,d,o,f,m,c,u,p=s.$,h="image_manager",e=10,v=11,M=12,b=13,y=14,w=15,L=21,P=22,t={};function D(){var e=p(window).outerWidth();return e<768?2:e<1200?3:4}function C(){i.html("");for(var e=0;e<u;e++)i.append('<div class="fr-list-column"></div>')}function I(){if(m<o.length&&(i.outerHeight()<=r.outerHeight()+s.opts.imageManagerScrollOffset||r.scrollTop()+s.opts.imageManagerScrollOffset>i.outerHeight()-r.outerHeight())){f++;for(var e=s.opts.imageManagerPageSize*(f-1);e<Math.min(o.length,s.opts.imageManagerPageSize*f);e++)a(o[e])}}function a(n){var i=new Image,o=p('<div class="fr-image-container fr-empty fr-image-'+c+++'" data-loading="'+s.language.translate("Loading")+'.." data-deleting="'+s.language.translate("Deleting")+'..">');S(!1),i.onload=function(){o.height(Math.floor(o.width()/i.width*i.height));var t=p("<img/>");if(n.thumb)t.attr("src",n.thumb);else{if(H(y,n),!n.url)return H(w,n),!1;t.attr("src",n.url)}if(n.url&&t.attr("data-url",n.url),n.tag)if(l.find(".fr-modal-more.fr-not-available").removeClass("fr-not-available"),l.find(".fr-modal-tags").show(),0<=n.tag.indexOf(",")){for(var e=n.tag.split(","),a=0;a<e.length;a++)e[a]=e[a].trim(),0===d.find('a[title="'+e[a]+'"]').length&&d.append('<a role="button" title="'+e[a]+'">'+e[a]+"</a>");t.attr("data-tag",e.join())}else 0===d.find('a[title="'+n.tag.trim()+'"]').length&&d.append('<a role="button" title="'+n.tag.trim()+'">'+n.tag.trim()+"</a>"),t.attr("data-tag",n.tag.trim());for(var r in n.name&&t.attr("alt",n.name),n)Object.prototype.hasOwnProperty.call(n,r)&&"thumb"!=r&&"url"!=r&&"tag"!=r&&t.attr("data-"+r,n[r]);o.append(t).append(p(s.icon.create("imageManagerDelete")).addClass("fr-delete-img").attr("title",s.language.translate("Delete"))).append(p(s.icon.create("imageManagerInsert")).addClass("fr-insert-img").attr("title",s.language.translate("Insert"))),d.find(".fr-selected-tag").each(function(e,a){_(t,a.text)||o.hide()}),t.on("load",function(){o.removeClass("fr-empty"),o.height("auto"),m++,k(T(parseInt(t.parent().attr("class").match(/fr-image-(\d+)/)[1],10)+1)),S(!1),m%s.opts.imageManagerPageSize==0&&I()}),s.events.trigger("imageManager.imageLoaded",[t])},i.onerror=function(){m++,o.remove(),k(T(parseInt(o.attr("class").match(/fr-image-(\d+)/)[1],10)+1)),H(e,n),m%s.opts.imageManagerPageSize==0&&I()},i.src=n.thumb||n.url,O().append(o)}function O(){var r,n;return i.find(".fr-list-column").each(function(e,a){var t=p(a);0===e?(n=t.outerHeight(),r=t):t.outerHeight()<n&&(n=t.outerHeight(),r=t)}),r}function T(e){e===undefined&&(e=0);for(var a=[],t=c-1;e<=t;t--){var r=i.find(".fr-image-"+t);r.length&&(a.push(r),p('<div id="fr-image-hidden-container">').append(r),i.find(".fr-image-"+t).remove())}return a}function k(e){for(var a=e.length-1;0<=a;a--)O().append(e[a])}function S(e){if(e===undefined&&(e=!0),!g.isVisible())return!0;var a=D();if(a!=u){u=a;var t=T();C(),k(t)}s.modals.resize(h),e&&I()}function R(e){var a={},t=e.data();for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&"url"!=r&&"tag"!=r&&(a[r]=t[r]);return a}function U(e){var a=p(e.currentTarget).siblings("img"),t=g.data("instance")||s,r=g.data("current-image");if(s.modals.hide(h),t.image.showProgressBar(),r)r.data("fr-old-src",r.attr("src")),r.trigger("click");else{t.events.focus(!0),t.selection.restore();var n=t.position.getBoundingRect(),i=n.left+n.width/2+p(s.doc).scrollLeft(),o=n.top+n.height+p(s.doc).scrollTop();t.popups.setContainer("image.insert",s.$sc),t.popups.show("image.insert",i,o)}t.image.insert(a.data("url"),!1,R(a),r)}function j(e){var a=p(e.currentTarget).siblings("img"),t=s.language.translate("Are you sure? Image will be deleted.");if(confirm(t))if(s.opts.imageManagerDeleteURL){if(!1!==s.events.trigger("imageManager.beforeDeleteImage",[a])){a.parent().addClass("fr-image-deleting");var r=s.core.getXHR(s.opts.imageManagerDeleteURL,s.opts.imageManagerDeleteMethod),n=s.drag_support.formdata?new FormData:null;if(n){var i=Object.assign(Object.assign({src:a.attr("src")},R(a)),s.opts.imageManagerDeleteParams);for(key in i)Object.prototype.hasOwnProperty.call(i,key)&&n.append(key,i[key])}r.onload=function(){s.events.trigger("imageManager.imageDeleted",[JSON.parse(r.response)]);var e=T(parseInt(a.parent().attr("class").match(/fr-image-(\d+)/)[1],10)+1);a.parent().remove(),k(e),g.find("#fr-modal-tags > a").each(function(){0===g.find('#fr-image-list [data-tag*="'+p(this).text()+'"]').length&&p(this).removeClass("fr-selected-tag").hide()}),E(),S(!0)},r.onerror=function(){H(L,r.response||r.responseText)},r.send(n)}}else H(P)}function H(e,a){10<=e&&e<20?n.hide():20<=e&&e<30&&p(".fr-image-deleting").removeClass("fr-image-deleting"),s.events.trigger("imageManager.error",[{code:e,message:t[e]},a])}function x(){var e=l.find(".fr-modal-head-line").outerHeight(),a=d.outerHeight();l.toggleClass("fr-show-tags"),l.hasClass("fr-show-tags")?(l.css("height",e+a),d.find("a").css("opacity",1)):(l.css("height",e),d.find("a").css("opacity",0))}function E(){var e=d.find(".fr-selected-tag");0<e.length?(i.find("img").parent().show(),e.each(function(e,r){i.find("img").each(function(e,a){var t=p(a);_(t,r.text)||t.parent().hide()})})):i.find("img").parent().show(),k(T()),I()}function N(e){e.preventDefault();var a=p(e.currentTarget);a.toggleClass("fr-selected-tag"),s.opts.imageManagerToggleTags&&a.siblings("a").removeClass("fr-selected-tag"),E()}function _(e,a){for(var t=(e.attr("data-tag")||"").split(","),r=0;r<t.length;r++)if(t[r]==a)return!0;return!1}return t[e]="Image cannot be loaded from the passed link.",t[v]="Error during load images request.",t[M]="Missing imageManagerLoadURL option.",t[b]="Parsing load response failed.",t[y]="Missing image thumb.",t[w]="Missing image URL.",t[L]="Error during delete image request.",t[P]="Missing imageManagerDeleteURL option.",{require:["image"],_init:function(){if(!s.$wp&&"IMG"!=s.el.tagName)return!1},show:function(){if(!g){var e,a='<div class="fr-modal-head-line"><i class="fa fa-bars fr-modal-more fr-not-available" id="fr-modal-more-'+s.sid+'" title="'+s.language.translate("Tags")+'"></i><h4 data-text="true">'+s.language.translate("Manage Images")+"</h4></div>";a+='<div class="fr-modal-tags" id="fr-modal-tags"></div>',e=s.opts.imageManagerPreloader?'<img class="fr-preloader" id="fr-preloader" alt="'+s.language.translate("Loading")+'.." src="'+s.opts.imageManagerPreloader+'" style="display: none;">':'<span class="fr-preloader" id="fr-preloader" style="display: none;">'+s.language.translate("Loading")+"</span>",e+='<div class="fr-image-list" id="fr-image-list"></div>';var t=s.modals.create(h,a,e);g=t.$modal,l=t.$head,r=t.$body}g.data("current-image",s.image.get()),s.modals.show(h),n||(n=g.find("#fr-preloader"),i=g.find("#fr-image-list"),d=g.find("#fr-modal-tags"),u=D(),C(),l.css("height",l.find(".fr-modal-head-line").outerHeight()),s.events.$on(p(s.o_win),"resize",function(){S(!!o)}),s.helpers.isMobile()&&(s.events.bindClick(i,"div.fr-image-container",function(e){g.find(".fr-mobile-selected").removeClass("fr-mobile-selected"),p(e.currentTarget).addClass("fr-mobile-selected")}),g.on(s._mousedown,function(){g.find(".fr-mobile-selected").removeClass("fr-mobile-selected")})),s.events.bindClick(i,".fr-insert-img",U),s.events.bindClick(i,".fr-delete-img",j),g.on(s._mousedown+" "+s._mouseup,function(e){e.stopPropagation()}),g.on(s._mousedown,"*",function(){s.events.disableBlur()}),r.on("scroll",I),s.events.bindClick(g,"i#fr-modal-more-"+s.sid,x),s.events.bindClick(d,"a",N)),function(){if(n.show(),i.find(".fr-list-column").html(""),s.opts.imageManagerLoadURL){var e=s.core.getXHR(s.opts.imageManagerLoadURL,s.opts.imageManagerLoadMethod),a=s.drag_support.formdata?new FormData:null;if(a)for(key in s.opts.imageManagerLoadParams.params)Object.prototype.hasOwnProperty.call(s.opts.imageManagerLoadParams.params,key)&&a.append(key,s.opts.imageManagerLoadParams.params[key]);e.onload=function(){s.events.trigger("imageManager.imagesLoaded",[JSON.parse(e.responseText)]),function(e,a){try{i.find(".fr-list-column").html(""),c=m=f=0,o=e,I()}catch(t){H(b,a)}}(JSON.parse(e.responseText),e.response),n.hide()},e.onerror=function(){H(v,e.response||e.responseText)},e.send(a)}else H(M)}()},hide:function(){s.modals.hide(h)}}},!a.PLUGINS.image)throw new Error("Image manager plugin requires image plugin.");a.DEFAULTS.imageInsertButtons.push("imageManager"),a.RegisterCommand("imageManager",{title:"Browse",undo:!1,focus:!1,modal:!0,callback:function(){this.imageManager.show()},plugin:"imageManager"}),a.DefineIcon("imageManager",{NAME:"folder"}),a.DefineIcon("imageManagerInsert",{NAME:"plus"}),a.DefineIcon("imageManagerDelete",{NAME:"trash"})});