File: /volume1/@appstore/SynologyApplicationService/ui/AppLauncher.js
/* Copyright (c) 2020 Synology Inc. All rights reserved. */
Ext.define("SYNO.SDS.AppLauncher.DDProxy",{extend:"Ext.dd.StatusProxy",cls:"app-launcher-dd-proxy",constructor:function(a){Ext.apply(this,a);this.id=this.id||Ext.id();this.el=new Ext.Layer({dh:{id:this.id,cls:this.cls+" "+this.dropNotAllowed},shadow:false});this.ghost=Ext.get(this.el.dom);this.dropStatus=this.dropNotAllowed},reset:function(){this.el.dom.className=this.cls+" "+this.dropNotAllowed;this.dropStatus=this.dropNotAllowed},update:function(a){if(typeof a==="string"){this.ghost.update(a)}else{this.ghost.update("");this.ghost.dom.appendChild(a)}}});Ext.define("SYNO.SDS.AppLauncher.DragZone",{extend:"Ext.dd.DragZone",constructor:function(b,a){if(!SYNO.SDS.AppLauncher._DDProxy){SYNO.SDS.AppLauncher._DDProxy=new SYNO.SDS.AppLauncher.DDProxy()}this.proxy=SYNO.SDS.AppLauncher._DDProxy;this.callParent(arguments)},getDragData:function(c){var b=c.getTarget(".app-wrap"),a=(b)?b.getAttribute("data-app-name"):null;return{ddel:b,record:this.view.store.getById(a)}},onInitDrag:function(a,b){if(this.dragData.ddel){this.view.setDragging(true);this.onStartDrag(a,b);this.view.addClass("dragging")}return true},afterRepair:function(){var a=Ext.enableFx;Ext.enableFx=false;this.view.setDragging(false);this.callParent(arguments);this.view.removeClass("dragging");Ext.enableFx=a;this.view.onNodeDrop()},onBeforeDrag:function(a,b){if(!a.record){return false}return true}});Ext.define("SYNO.SDS.AppLauncher.DropZone",{extend:"Ext.dd.DropZone",ddGroup:"AppLauncherDD",getTargetFromEvent:function(a){return a.getTarget(".app-wrap")},getIndexByOffsets:function(f,d){var a=this.view,e=a.itemWidth,h=a.itemHeight,b=a.itemMarginBottom,c,g;if(d<h){g=0}else{g=Math.floor((d-h)/(h+b))+1}c=Math.floor(f/e);return g*3+c},setPreventChange:function(a){this.preventChange=a},onNodeOver:function(b,l,h,g){if(b===l.dragData.ddel||this.preventChange===true){return}this.setPreventChange(true);var k=this.view.store,c=k.data.items.map(function(i,e){return e}),j=this.getIndexByOffsets(b.offsetLeft,b.offsetTop),a=parseInt(l.dragData.ddel.getAttribute("data-index"),10),f,d;f=c.splice(a,1)[0];c.splice(j,0,f);for(d=0;d<c.length;d++){this.view.replaceOrder(c[d],d)}this.setPreventChange.defer(500,this,[false]);return this.dropAllowed},onAppDropDone:function(){this.view.removeClass("dragging");this.view.setDragging.defer(100,this.view,[false])},onNodeDrop:function(b,a,d,c){this.view.onNodeDrop();this.onAppDropDone();return true}});Ext.define("SYNO.SDS.AppLauncher.DataView",{extend:"SYNO.ux.FleXcroll.DataView",constructor:function(a){var b={cls:"app-launcher-dataview",tpl:this.getTpl(),width:348,height:184,itemWidth:116,itemHeight:104,itemMarginBottom:0,itemSelector:"a.app-wrap",store:this.createAppStore()};this.callParent([Ext.apply(b,a)]);this.mon(this,"afterrender",this.initDD,this);this.mon(this.store,"load",this.insertAppCSSRules,this)},getTemplateTarget:function(){var a=this;a.scrollBar=a.scrollBar||a.el.createChild({tag:"div",style:"width: 100%; position: relative;"});return a.scrollBar},getTpl:function(){return new Ext.XTemplate('<tpl for=".">','<a href="{launch_url}" rel="noreferrer" target="_blank" data-index="{[xindex - 1]}" class="app-wrap app-{[xindex - 1]}" data-app-name="{appname}">','<div class="app">','<div class="app-icon"><img src="{[this.getAppIcon(values)]}"></div>','<div class="app-name">{name}</div>',"</div>","</a>","</tpl>",{getAppIcon:function(c){var e=SYNO.SDS.Config.FnMap[c.appname],b;if(c.type==="local"){if(!e){return Ext.BLANK_IMAGE_URL}b=e.config.jsBaseURL+"/"+e.config.icon;return SYNO.SDS.UIFeatures.IconSizeManager.getIconPath(b,"ClassicalDesktop")}else{if(c.type==="wsg"){if(c.appname==="SYNO.Cal.Application"){b="webman/3rdparty/Calendar/images/Calendar_{0}.png"}else{if(c.appname==="SYNO.SDS.Chat.Application"){b="webman/3rdparty/Chat/images/icon/chat_{0}.png"}else{if(c.appname==="SYNO.SDS.MailClient.Application"){b="webman/3rdparty/MailClient/images/Mailplus_{0}.png"}else{if(c.appname==="SYNO.SDS.Drive.Application"){b="webman/3rdparty/SynologyDrive-Drive/images/_Favicon/SynologyDrive_{0}.png"}else{return Ext.BLANK_IMAGE_URL}}}}var a=SYNO.SDS.UIFeatures.IconSizeManager.getIconPath(b,"ClassicalDesktop");var g="/webapi/entry.cgi";var d=a.indexOf(g)+g.length;var f=[a.slice(0,d),"/"+c.nodeId,a.slice(d)].join("");return f}else{return Ext.BLANK_IMAGE_URL}}}})},createAppStore:function(){return new SYNO.API.JsonStore({appWindow:{findAppWindow:Ext.emptyFn},autoDestroy:true,autoLoad:true,api:"SYNO.Personal.Application.Info",method:"get",baseParams:{is_app_portal:!!_S("rewriteApp"),app_name:_S("standaloneAppName")},root:"applications",version:1,idProperty:"appname",fields:["id","name","description","appname","launch_url","version","badge","type","nodeId"],sortData:Ext.emptyFn})},initDD:function(){var a={view:this,ddGroup:"AppLauncherDD"};this.dragZone=new SYNO.SDS.AppLauncher.DragZone(this.el,a);this.dropZone=new SYNO.SDS.AppLauncher.DropZone(this.el,a);this.mon(this.el,"click",this.onClickView,this)},removeStyle:function(){if(this.styleEl){document.getElementsByTagName("head")[0].removeChild(this.styleEl);this.styleEl=null}},insertAppCSSRules:function(j){this.removeStyle();j.loaded=true;var a=document.createElement("style"),g=j.getCount(),f,b=this.itemWidth,l=this.itemHeight,e=this.itemMarginBottom,c=3,m,k=[],d,h;a.type="text/css";for(f=0;f<g;f++){d=(f%c)*b;m=parseInt(f/c,10);h=m*(l+e);k.push(String.format(".app-{0} { left: {1}px; top: {2}px;}",f,d,h))}if(a.styleSheet){a.styleSheet.cssText=k.join("")}else{a.appendChild(document.createTextNode(k.join("")))}document.getElementsByTagName("head")[0].appendChild(a);this.styleEl=a},setDragging:function(a){this.dragging=a},onClickView:function(a){if(this.dragging===true){a.preventDefault();return}if(a.getTarget(".app-wrap")){this.fireEvent("appclick",this,a)}},replaceOrder:function(e,a){var b=this.el.query(".app-wrap")[e],d=b._lastCls||"app-"+e,c="app-"+a;if(d===c){return}Ext.fly(b).replaceClass(d,c);b._lastCls=c},onNodeDrop:function(b,a){this.sendWebAPI({api:"SYNO.Personal.Application.Info",version:1,method:"setorder",params:{app_order:this.el.query(".app-wrap").sort(function(e,d){var h=e._lastCls||"app-"+Array.prototype.indexOf.call(e.parentNode.childNodes,e),g=d._lastCls||"app-"+Array.prototype.indexOf.call(d.parentNode.childNodes,d),c,i,f;f=/app-(\d)/.exec(h);c=parseInt(f[1],10);f=/app-(\d)/.exec(g);i=parseInt(f[1],10);return c>i?1:-1}).map(function(c){return c.getAttribute("data-app-name")})}})},destroy:function(){this.removeStyle();Ext.destroy(this.dragZone);Ext.destroy(this.dropZone);this.callParent(arguments)}});Ext.define("SYNO.SDS.AppLauncher.Panel",{extend:"SYNO.ux.Panel",constructor:function(a){var b={floating:true,shadow:false,cls:"app-launcher-panel",renderTo:Ext.getBody(),width:378,height:214,padding:"15px",preventClick:0,preventFirstClick:true,layout:"fit",defaultAlignEl:Ext.getBody(),defaultAlignPos:"tl-tl?",defaultOffsets:[0,0],defaultAnchor:"t",animate:false,defaultSlideInOpts:{duration:0.3},items:[this.createAppLauncherView(a)],listeners:{afterrender:{fn:this.onAfterRender,scope:this}}};this.callParent([Ext.apply(b,a)])},onAfterRender:function(){this.mon(Ext.getBody(),"click",this.onBodyClick,this);this.mon(this.launcherView,"appclick",this.onClickApp,this)},onBodyClick:function(a){if(!this.isVisible()){return}if(this.preventClick<=0&&!a.within(this.el)){this.hide();return}this.preventClick--},onClickApp:function(){if(!this.isVisible()){return}this.hide()},createAppLauncherView:function(a){this.launcherView=new SYNO.SDS.AppLauncher.DataView((a&&a.viewConfig)?a.viewConfig:{});return this.launcherView},resizeBeforeShow:function(){var a=this.launcherView,c=a.store.getCount(),b=32,e=32;this.setWidth(e+a.itemWidth*Math.min(c,3));this.setHeight(b+a.itemHeight*Math.ceil(c/3));SYNO.SDS.AppLauncher.Panel.superclass.show.call(this);var d=this.el.getAlignToXY(this.defaultAlignEl,this.defaultAlignPos,this.defaultOffsets);this.el.setXY(d)},show:function(){if(this.preventFirstClick){this.preventClick=1}if(this.launcherView.store.loaded){this.resizeBeforeShow()}else{this.mon(this.launcherView.store,"load",this.resizeBeforeShow.bind(this))}if(this.animate){this.el.slideIn(this.defaultAnchor,Ext.apply(this.defaultSlideInOpts,{callback:function(){SYNO.SDS.AppLauncher.Panel.superclass.show.call(this)}.bind(this)}))}},hide:function(){if(this.animate){this.el.slideOut(this.defaultAnchor,Ext.apply(this.defaultSlideInOpts,{callback:function(){SYNO.SDS.AppLauncher.Panel.superclass.hide.call(this)}.bind(this)}))}else{this.callParent(arguments)}}});