@progress/kendo-ui
Version:
This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.
3 lines (2 loc) • 15.2 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("kendo.listview.js"),require("kendo.dropdownlist.js"),require("kendo.upload.js"),require("kendo.breadcrumb.js"),require("kendo.icons.js")):"function"==typeof define&&define.amd?define(["exports","kendo.listview","kendo.dropdownlist","kendo.upload","kendo.breadcrumb","kendo.icons"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).kendo=e.kendo||{},e.kendo._globals=e.kendo._globals||{},e.kendo._globals.Filebrowser={}))}(this,(function(e){!function(e,t){var i=window.kendo,o=i.ui.Widget,n=e.isPlainObject,a=e.extend,r=i.htmlEncode,s=i.support.placeholder,l=i.isFunction,d=/(^\/|\/$)/g,c="change",u="apply",p="error",f="click",h=".kendoFileBrowser",m=".kendoSearchBox",k="name",v="size",b="type",w={field:b,dir:"asc"},g=i.template((({text:e})=>`<div class="k-listview-item k-listview-item-empty"><span class="k-file-preview"><span class="k-file-icon k-icon k-svg-icon k-i-none"></span></span><span class="k-file-name">${i.htmlEncode(e)}</span></div>`)),_=({showCreate:e,showUpload:t,showDelete:o,messages:n})=>'<div class="k-widget k-filebrowser-toolbar k-toolbar k-toolbar-md k-floatwrap">'+(e?'<button type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-icon-button">'+i.ui.icon({icon:"folder-add",iconClass:"k-button-icon"})+"</button>":"")+`${t?(({messages:e})=>'<div class="k-upload k-upload-button-wrap"><div class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-upload-button">'+i.ui.icon({icon:"plus",iconClass:"k-button-icon"})+`<span class="k-button-text">${i.htmlEncode(e.uploadFile)}</span></div><input type="file" name="file" /></div>`)({messages:n}):""}`+(o?'<button type="button" class="k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-icon-button k-disabled">'+i.ui.icon({icon:"x",iconClass:"k-button-icon"})+"</button>":"")+'<div class="k-tiles-arrange">'+`<label>${i.htmlEncode(n.orderBy)}: <select></select></label></div><span class="k-toolbar-spacer"></span><input data-role="searchbox" /></div>`;function y(e,i){return e!==t&&e.match(/\/$/)||(e=(e||"")+"/"),e+i}a(!0,i.data,{schemas:{filebrowser:{data:function(e){return e.items||e||[]},model:{id:"name",fields:{name:"name",size:"size",type:"type"}}}}}),a(!0,i.data,{transports:{filebrowser:i.data.RemoteTransport.extend({init:function(t){i.data.RemoteTransport.fn.init.call(this,e.extend(!0,{},this.options,t))},_call:function(t,o){o.data=e.extend({},o.data,{path:this.options.path()}),l(this.options[t])?this.options[t].call(this,o):i.data.RemoteTransport.fn[t].call(this,o)},read:function(e){this._call("read",e)},create:function(e){this._call("create",e)},destroy:function(e){this._call("destroy",e)},update:function(){},options:{read:{type:"POST"},update:{type:"POST"},create:{type:"POST"},destroy:{type:"POST"}}})}});var x=o.extend({init:function(e,t){var i=this;t=t||{},o.fn.init.call(i,e,t),i.element.addClass("k-filebrowser"),i.element.on(f+h,".k-filebrowser-toolbar button:not(.k-disabled):has(.k-i-x,.k-svg-i-x)",i._deleteClick.bind(i)).on(f+h,".k-filebrowser-toolbar button:not(.k-disabled):has(.k-i-folder-add,.k-svg-i-folder-add)",i._addClick.bind(i)).on("keydown"+h,".k-listview-item.k-selected input",i._directoryKeyDown.bind(i)).on("blur"+h,".k-listview-item.k-selected input",i._directoryBlur.bind(i)),i._dataSource(),i.refresh(),i.path(i.options.path)},options:{name:"FileBrowser",messages:{uploadFile:"Upload",orderBy:"Arrange by",orderByName:"Name",orderBySize:"Size",directoryNotFound:"A directory with this name was not found.",emptyFolder:"Empty Folder",deleteFile:"Are you sure you want to delete {0}?",invalidFileType:"The selected file {0} is not valid. Supported file types are {1}.",overwriteFile:"A file with name {0} already exists in the current directory. Do you want to overwrite it?",dropFilesHere:"drop file here to upload",search:"Search"},transport:{},path:"/",fileTypes:"*.*"},events:[p,c,u],destroy:function(){var e=this;o.fn.destroy.call(e),e.dataSource.unbind(p,e._errorHandler),e.element.add(e.list).add(e.toolbar).off(h),i.destroy(e.element)},value:function(){var e,t=this,o=t._selectedItem(),n=t.options.transport.fileUrl;if(o&&"f"===o.get(b))return e=y(t.path(),o.get(k)).replace(d,""),n&&(e=l(n)?n(e):i.format(n,encodeURIComponent(e))),e},_selectedItem:function(){var e=this.listView.select();if(e.length)return this.dataSource.getByUid(e.attr(i.attr("uid")))},_toolbar:function(){var t=this,o=i.template(_),n=t.options.messages,a=[{text:n.orderByName,value:"name"},{text:n.orderBySize,value:"size"}];t.toolbar=e(o({messages:n,showUpload:t.options.transport.uploadUrl,showCreate:t.options.transport.create,showDelete:t.options.transport.destroy})).appendTo(t.element).find(".k-upload input").kendoUpload({multiple:!1,localization:{dropFilesHere:n.dropFilesHere},async:{saveUrl:t.options.transport.uploadUrl,autoUpload:!0},upload:t._fileUpload.bind(t),error:function(e){t._error({xhr:e.XMLHttpRequest,status:"error"})}}).end(),t.upload=t.toolbar.find(".k-upload input").data("kendoUpload"),t.arrangeBy=t.toolbar.find(".k-tiles-arrange select").kendoDropDownList({dataSource:a,dataTextField:"text",dataValueField:"value",change:function(){t.orderBy(this.value())}}).data("kendoDropDownList"),t.searchBox=t.toolbar.find("input[data-role='searchbox']").kendoSearchBox({label:t.options.messages.search,change:function(){t.search(this.value())}}).data("kendoSearchBox"),t._attachDropzoneEvents()},_attachDropzoneEvents:function(){var t,i,o,n,a,r=this;r.options.transport.uploadUrl&&(t=e(document.documentElement),i=r._dropEnter.bind(r),o=r._dropLeave.bind(r),t.on("dragenter"+h,(function(){i(),a=new Date,n||(n=setInterval((function(){new Date-a>100&&(o(),clearInterval(n),n=null)}),100))})).on("dragover"+h,(function(){a=new Date})),r._scrollHandler=r._positionDropzone.bind(r))},_dropEnter:function(){this._positionDropzone(),e(document).on("scroll"+h,this._scrollHandler)},_dropLeave:function(){this._removeDropzone(),e(document).off("scroll"+h,this._scrollHandler)},_positionDropzone:function(){var e=this.element,t=e.offset();this.toolbar.find(".k-dropzone").addClass("k-filebrowser-dropzone").offset(t).css({width:e[0].clientWidth,height:e[0].clientHeight,lineHeight:e[0].clientHeight+"px"})},_removeDropzone:function(){this.toolbar.find(".k-dropzone").removeClass("k-filebrowser-dropzone").css({width:"",height:"",lineHeight:"",top:"",left:""})},_deleteClick:function(){var e=this,t=e.listView.select(),o=r(i.format(e.options.messages.deleteFile,t.find(".k-file-name").text()));t.length&&e._showMessage(o,"confirm")&&e.listView.remove(t)},_addClick:function(){this.createDirectory()},_getFieldName:function(e){return function(e,t){var i=e[t];return n(i)?i.from||i.field||t:i}(this.dataSource.reader.model.fields,e)},_fileUpload:function(e){var t,o=this,n=o.options,a=n.fileTypes,s=new RegExp(("("+a.split(",").join(")|(")+")").replace(/\*\./g,".*."),"i"),l=e.files[0].name,d=e.files[0].size,c=k,u=v;s.test(l)?(e.data={path:o.path()},(t=o._createFile(l,d))?o.upload.one("success",(function(e){var n=o._insertFileToList(t);n._override&&(n.set(c,e.response[o._getFieldName(c)]),n.set(u,e.response[o._getFieldName(u)]),o.listView.dataSource.pushUpdate(n)),o._tiles=o.listView.items().filter("["+i.attr("type")+"=f]")})):e.preventDefault()):(e.preventDefault(),o._showMessage(r(i.format(n.messages.invalidFileType,l,a))))},_findFile:function(e){var t,i,o,n=this.dataSource.data(),a=b,r=k;for(e=e.toLowerCase(),t=0,o=n.length;t<o;t++)if("f"===n[t].get(a)&&n[t].get(r).toLowerCase()===e){i=n[t];break}return i},_createFile:function(e,t){var o=this,n={},a=b,s=o._findFile(e);return s?o._showMessage(r(i.format(o.options.messages.overwriteFile,e)),"confirm")?(s._override=!0,s):null:(n[a]="f",n[k]=e,n[v]=t,n)},_insertFileToList:function(e){var t;if(e._override)return e;for(var i=this.dataSource,o=i.view(),n=0,a=o.length;n<a;n++)if("f"===o[n].get(b)){t=n;break}return i.insert(++t,e)},createDirectory:function(){var e,t,o=this,n=0,a=b,r=k,s=o.dataSource.data(),l=o._nameDirectory(),d=new o.dataSource.reader.model;for(e=0,t=s.length;e<t;e++)"d"===s[e].get(a)&&(n=e);d.set(a,"d"),d.set(r,l),o.listView.one("dataBound",(function(){var e=o.listView.items().filter("["+i.attr("uid")+"="+d.uid+"]");e.length&&this.edit(e),this.element.scrollTop(e.attr("offsetTop")-this.element[0].offsetHeight),setTimeout((function(){o.listView.element.find(".k-edit-item input").select()}))})).one("save",(function(e){var t=e.model.get(r);t?e.model.set(r,o._nameExists(t,d.uid)?o._nameDirectory():t):e.model.set(r,l)})),o.dataSource.insert(++n,d)},_directoryKeyDown:function(e){13==e.keyCode&&e.currentTarget.blur()},_directoryBlur:function(){this.listView.save()},_nameExists:function(e,t){var i,o,n=this.dataSource.data(),a=b,r=k;for(i=0,o=n.length;i<o;i++)if("d"===n[i].get(a)&&n[i].get(r).toLowerCase()===e.toLowerCase()&&n[i].uid!==t)return!0;return!1},_nameDirectory:function(){var t,i,o,n="New folder",a=this.dataSource.data(),r=[],s=b,l=k;for(i=0,o=a.length;i<o;i++)"d"===a[i].get(s)&&a[i].get(l).toLowerCase().indexOf(n.toLowerCase())>-1&&r.push(a[i].get(l));if(e.inArray(n,r)>-1){i=2;do{t=n+" ("+i+")",i++}while(e.inArray(t,r)>-1);n=t}return n},orderBy:function(e){this.dataSource.sort([{field:b,dir:"asc"},{field:e,dir:"asc"}])},search:function(e){this.dataSource.filter({field:k,operator:"contains",value:e})},_content:function(){var t=this;t.list=e('<div class="k-filemanager-listview" />').appendTo(t.element).on("dblclick"+h,".k-listview-item",t._dblClick.bind(t)),t.listView=new i.ui.ListView(t.list,{layout:"flex",flex:{direction:"row",wrap:"wrap"},dataSource:t.dataSource,template:t._itemTmpl(),editTemplate:t._editTmpl(),selectable:!0,autoBind:!1,dataBinding:function(e){t.toolbar.find(".k-i-x,.k-svg-i-x").parent().addClass("k-disabled"),"remove"!==e.action&&"sync"!==e.action||(e.preventDefault(),i.ui.progress(t.listView.content,!1),i.ui.progress(t.listView.wrapper,!1))},dataBound:function(){t.dataSource.view().length?t._tiles=this.items().filter("["+i.attr("type")+"=f]"):this.content.append(g({text:t.options.messages.emptyFolder}))},change:t._listViewChange.bind(t)})},_dblClick:function(t){var o=this,n=e(t.currentTarget);if(n.hasClass("k-edit-item")&&o._directoryBlur(),n.filter("["+i.attr("type")+"=d]").length){var a=o.dataSource.getByUid(n.attr(i.attr("uid")));a&&(o.path(y(o.path(),a.get(k))),o.breadcrumbs.value("/"+o.path()))}else n.filter("["+i.attr("type")+"=f]").length&&o.trigger(u)},_listViewChange:function(){var e=this._selectedItem();e&&(this.toolbar.find(".k-i-x,.k-svg-i-x").parent().removeClass("k-disabled"),this.trigger(c,{selected:e}))},_dataSource:function(){var e=this,t=e.options,o=t.transport,r=a({},w),s={field:k,dir:"asc"},l={type:o.type||"filebrowser",sort:[r,s]};n(o)&&(o.path=e.path.bind(e),l.transport=o),n(t.schema)?l.schema=t.schema:o.type&&n(i.data.schemas[o.type])&&i.data.schemas[o.type],e.dataSource&&e._errorHandler?e.dataSource.unbind(p,e._errorHandler):e._errorHandler=e._error.bind(e),e.dataSource=i.data.DataSource.create(l).bind(p,e._errorHandler)},_navigation:function(){var t=this,i=e('<div class="k-floatwrap"><nav></nav></div>').appendTo(this.element);t.breadcrumbs=i.find("nav").first().kendoBreadcrumb({editable:!0,gap:50,value:t.options.path||"/",change:function(){t.path(this.value())}}).data("kendoBreadcrumb")},_error:function(e){var t,o=this;if(!o.trigger(p,e)){t=e.xhr.status,"error"==e.status?"404"==t?o._showMessage(i.htmlEncode(o.options.messages.directoryNotFound)):"0"!=t&&o._showMessage("Error! The requested URL returned "+t+" - "+e.xhr.statusText):"timeout"==t&&o._showMessage("Error! Server timeout.");var n=o.dataSource;n.hasChanges()&&n.cancelChanges()}},_showMessage:function(e,t){return window[t||"alert"](e)},refresh:function(){var e=this;e._navigation(),e._toolbar(),e._content()},_editTmpl:function(){return i.template((e=>`<div class="k-listview-item k-selected" ${i.attr("uid")}="${e.uid}">`+("d"===e[b]?'<div class="k-file-preview">'+i.ui.icon({icon:"folder",iconClass:"k-file-icon",size:"xxxlarge"})+"</div>":'<div class="k-file-preview"><span class="k-file-icon k-icon k-i-loading"></span></div>')+("d"===e[b]?`<span class="k-file-name">\n <span class="k-textbox k-input k-input-md k-rounded-md k-input-solid">\n <input class="k-input-inner" ${i.attr("bind")}="value:${k}"/>\n </span>\n </span>`:"")+"</div>"))},_itemTmpl:function(){return i.template((e=>`<div class="k-listview-item" ${i.attr("uid")}="${e.uid}" ${i.attr("type")}="${e[b]}">`+("d"===e[b]?'<div class="k-file-preview">'+i.ui.icon({icon:"folder",iconClass:"k-file-icon",size:"xxxlarge"})+"</div>":'<div class="k-file-preview">'+i.ui.icon({icon:"file",iconClass:"k-file-icon",size:"xxxlarge"})+"</div>")+`<span class="k-file-name">${e[k]}</span>`+("f"===e[b]?`<span class="k-file-size">${function(e){if(!e)return"";var t=" bytes";return e>=1073741824?(t=" GB",e/=1073741824):e>=1048576?(t=" MB",e/=1048576):e>=1024&&(t=" KB",e/=1024),Math.round(100*e)/100+t}(e[v])}</span>`:"")+"</div>"))},path:function(e){var i=this,o=i._path||"";return e!==t?(i._path=e.replace(d,"")+"/",void i.dataSource.read({path:i._path})):(o&&(o=o.replace(d,"")),"/"===o||""===o?"":o+"/")}}),S=o.extend({init:function(e,t){var i=this;t=t||{},o.fn.init.call(i,e,t),s&&i.element.attr("placeholder",i.options.label),i._wrapper(),i.element.on("keydown"+m,i._keydown.bind(i)).on("change"+m,i._updateValue.bind(i)),i.wrapper.on(f+m,"a",i._click.bind(i)),s||i.element.on("focus"+m,i._focus.bind(i)).on("blur"+m,i._blur.bind(i))},options:{name:"SearchBox",label:"Search",value:""},events:[c],destroy:function(){var e=this;e.wrapper.add(e.element).add(e.label).off(m),o.fn.destroy.call(e)},_keydown:function(e){13===e.keyCode&&this._updateValue()},_click:function(e){e.preventDefault(),this._updateValue()},_updateValue:function(){var e=this,t=e.element.val();t!==e.value()&&(e.value(t),e.trigger(c))},_blur:function(){this._updateValue(),this._toggleLabel()},_toggleLabel:function(){s||this.label.toggle(!this.element.val())},_focus:function(){this.label.hide()},_wrapper:function(){var t=this.element,o=t.parents(".k-search-wrap");t[0].style.width="",t.addClass("k-input-inner"),o.length||(o=t.wrap(e('<div class="k-widget k-search-wrap"><span class="k-textbox k-input k-input-md k-rounded-md k-input-solid"></span></div>')).parents(".k-search-wrap"),s||e("<label>"+this.options.label+"</label>").css("display","block").insertBefore(t),e('<span class="k-input-suffix">'+i.ui.icon(e('<a href="#" />'),{icon:"search",iconClass:"k-search"})+"</span>").appendTo(o.find(".k-textbox"))),this.wrapper=o,this.label=o.find(">label")},value:function(e){var i=this;return e!==t?(i.options.value=e,i.element.val(e),void i._toggleLabel()):i.options.value}});i.ui.plugin(x),i.ui.plugin(S)}(window.kendo.jQuery);var t=kendo;e.__meta__={id:"filebrowser",name:"FileBrowser",category:"web",description:"",hidden:!0,depends:["selectable","listview","dropdownlist","upload","breadcrumb","icons"]},e.default=t,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=kendo.filebrowser.min.js.map