file_explorer.html 279 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088508950905091509250935094509550965097509850995100510151025103510451055106510751085109511051115112511351145115511651175118511951205121512251235124512551265127512851295130513151325133513451355136513751385139514051415142514351445145514651475148514951505151515251535154515551565157515851595160516151625163516451655166516751685169517051715172517351745175517651775178517951805181518251835184518551865187518851895190519151925193519451955196519751985199520052015202520352045205520652075208520952105211521252135214521552165217521852195220522152225223522452255226522752285229523052315232523352345235523652375238523952405241524252435244524552465247524852495250525152525253525452555256525752585259526052615262526352645265526652675268526952705271527252735274527552765277527852795280528152825283528452855286528752885289529052915292529352945295529652975298529953005301530253035304530553065307530853095310531153125313531453155316531753185319532053215322532353245325532653275328532953305331533253335334533553365337533853395340534153425343534453455346534753485349535053515352535353545355535653575358535953605361536253635364536553665367536853695370537153725373537453755376537753785379538053815382538353845385538653875388538953905391539253935394539553965397539853995400540154025403540454055406540754085409541054115412541354145415541654175418541954205421542254235424542554265427542854295430543154325433543454355436543754385439544054415442544354445445544654475448544954505451545254535454545554565457545854595460546154625463546454655466546754685469547054715472547354745475547654775478547954805481548254835484548554865487548854895490549154925493549454955496549754985499550055015502550355045505550655075508550955105511551255135514551555165517551855195520552155225523552455255526552755285529553055315532553355345535553655375538553955405541554255435544554555465547554855495550555155525553555455555556555755585559556055615562556355645565556655675568556955705571557255735574557555765577557855795580558155825583558455855586558755885589559055915592559355945595559655975598559956005601560256035604560556065607560856095610561156125613561456155616561756185619562056215622562356245625562656275628562956305631563256335634563556365637563856395640564156425643564456455646564756485649565056515652565356545655565656575658565956605661566256635664566556665667566856695670567156725673567456755676567756785679568056815682568356845685568656875688568956905691569256935694569556965697569856995700
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>File Manager</title>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
  7. <link rel="stylesheet" href="../../script/semantic/semantic.min.css">
  8. <link rel="icon" type="image/png" href="./img/small_icon.png">
  9. <link rel="manifest" crossorigin="use-credentials" href="manifest.json">
  10. <script type="text/javascript" src="../../script/jquery.min.js"></script>
  11. <script type="text/javascript" src="../../script/semantic/semantic.min.js"></script>
  12. <script type="text/javascript" src="../../script/ao_module.js"></script>
  13. <script type="text/javascript" src="../../script/forge-sha256.min.js"></script>
  14. <script type="text/javascript" src="../../script/qrcode.min.js"></script>
  15. <script type="text/javascript" src="../../script/applocale.js"></script>
  16. <link rel="stylesheet" href="../../script/ao.css">
  17. <link rel="stylesheet" href="file_explorer.css">
  18. <script>
  19. window.mobilecheck = function() {
  20. var check = false;
  21. (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
  22. return check;
  23. };
  24. </script>
  25. <style>
  26. </style>
  27. </head>
  28. <body class="whiteTheme">
  29. <div id="navibar" class="navibar">
  30. <!-- File Opr Group-->
  31. <button class="fileOprBtn tabletAndDesktopOnly" title="Open" onclick="openViaButton();"><img class="opricon" src="img/opr/open.svg"><p class="oprtxt" locale="fileopr/Open">Open</p></button>
  32. <button class="fileOprBtn tabletAndDesktopOnly" title="Copy" onclick="copy();"><img class="opricon" src="img/opr/copy.svg"><p class="oprtxt" locale="fileopr/Copy">Copy</p></button>
  33. <button class="fileOprBtn tabletAndDesktopOnly" title="Paste" onclick="paste();"><img class="opricon" src="img/opr/paste.svg"><p class="oprtxt" locale="fileopr/Paste">Paste</p></button>
  34. <div class="fileoprGroupDivider tabletAndDesktopOnly" style="display: inline-block; vertical-align: top;">
  35. <button class="fileoprSmallBtn" title="Open with" onclick="openWith();"><i class="external icon"></i> <span locale="fileopr/Open with" style="font-size: 0.9em !important;">Open With</span></button><br>
  36. <button class="fileoprSmallBtn" title="Cut" onclick="cut();"><i class="blue cut icon"></i> <span locale="fileopr/Cut">Cut</span></button><br>
  37. <button class="fileoprSmallBtn" title="Rename" onclick="rename();"><i class="teal i cursor icon"></i> <span locale="fileopr/Rename">Rename</span></button>
  38. </div>
  39. <button class="fileOprBtn" title="Upload" onclick="upload(); exitMultiSelectMode();"><img class="opricon" src="img/opr/upload.svg"><p class="oprtxt wideScreenOnly" locale="fileopr/Upload">Upload</p></button>
  40. <button class="fileOprBtn" title="Download" onclick="downloadFile(); exitMultiSelectMode();"><img class="opricon" src="img/opr/download.svg"><p class="oprtxt wideScreenOnly" locale="fileopr/Download">Download</p></button>
  41. <div class="fileoprGroupDivider" style="display: inline-block; vertical-align: top;"></div>
  42. <button class="twolines fileOprBtn" title="New Folder" onclick="newFolder(); exitMultiSelectMode();"><img class="opricon" src="img/opr/new_folder.svg"><p class="oprtxt wideScreenOnly" locale="fileopr/New Folder">New<br>Folder</p></button>
  43. <div class="fileoprGroupDivider tabletAndDesktopOnly" style="display: inline-block; vertical-align: top;">
  44. <button class="fileoprSmallBtn" title="New File" onclick="newfile();"><i class="file outline icon"></i> <span locale="fileopr/New File">New File</span></button><br>
  45. <button class="fileoprSmallBtn" title="Create Zip" onclick="zipFile();"><i class="brown zip file icon"></i> <span locale="fileopr/Create Zip">Create Zip</span></button><br>
  46. <button class="fileoprSmallBtn" title="Unzip Here" onclick="unzipHere();"><i class="inbox icon"></i> <span locale="fileopr/Unzip Here">Unzip Here</span></button><br>
  47. </div>
  48. <div class="fileoprGroupDivider tabletAndDesktopOnly" style="display: inline-block; vertical-align: top;">
  49. <button class="fileoprSmallBtn" title="Refresh" onclick="refreshList();"><i class="green refresh icon"></i> <span locale="fileopr/Refresh">Refresh</span></button><br>
  50. <button class="fileoprSmallBtn" title="Home" onclick="openHomeDir();"><i class="home icon"></i> <span locale="fileopr/Home">Home</span></button><br>
  51. <button class="fileoprSmallBtn" title="File Info" onclick="showFileProperties();"><i class="blue info circle icon"></i> <span locale="fileopr/File Info">File Info</span></button><br>
  52. </div>
  53. <button class="fileOprBtn tabletAndDesktopOnly" title="Delete" onclick="deleteFile();"><img class="opricon" src="img/opr/delete.svg"><p class="oprtxt" locale="fileopr/Delete">Delete</p></button>
  54. <button class="fileOprBtn" title="Share File" onclick="shareFile();"><img class="opricon" src="img/opr/share.svg"><p class="oprtxt wideScreenOnly" locale="fileopr/Share">Share</p></button>
  55. <div class="fileoprGroupDivider" style="display: inline-block; vertical-align: top;"></div>
  56. <button class="mobileOnly mobileFileOprMenu" onclick="toggleMobileSidebar(true);">
  57. <i class="ui large bars icon"></i>
  58. </button>
  59. <div style="display: inline-block; vertical-align: top;">
  60. <select id="sortingMethodSelector" title="Sorting Method" class="ui basic borderless mini dropdown" onchange="updateSortingMethods();" autocomplete="off" style="min-width: 10em !important;">
  61. <option value="default" locale="menu/sort/asc">Ascending</option>
  62. <option value="reverse" locale="menu/sort/desc">Descending</option>
  63. <option value="smallToLarge" locale="menu/sort/small">Smallest</option>
  64. <option value="largeToSmall" locale="menu/sort/large"> Largest</option>
  65. <option value="mostRecent" locale="menu/sort/mostrecent">Most Recent</option>
  66. <option value="leastRecent" locale="menu/sort/leastrecent">Least Recent</option>
  67. <option value="fileTypeAsce" locale="menu/sort/typeAsc">File Type (Asce)</option>
  68. <option value="fileTypeDesc" locale="menu/sort/typeDes">File Type (Desc)</option>
  69. <option value="smart" locale="menu/sort/smart">Smart</option>
  70. </select>
  71. <div class="buttons viewportBtns">
  72. <!-- Viewport-->
  73. <button class="ui icon tiny button videmode" mode="grid" title="Block View" onclick="changeViewMode(this);"><i class="block layout icon"></i></button>
  74. <button class="ui icon tiny button videmode" mode="list" title="List View" onclick="changeViewMode(this);"><i class="align justify icon"></i></button>
  75. <button class="ui icon tiny button videmode" mode="details" title="Detail View" onclick="changeViewMode(this);"><i class="list ul icon"></i></button>
  76. <div class="fileoprGroupDivider" style="display: inline-block; height: 30px; vertical-align: bottom; margin-left: -0.2em; padding-right: 0.4em;"></div>
  77. <button id="togglePropertiesViewBtn" class="ui icon tiny button videmode propbar" title="Show Properties" onclick="togglePropertiesView(this);"><i class="columns icon"></i></button>
  78. </div>
  79. </div>
  80. <!-- Mobile Navi-bar -->
  81. <div id="mobileNaviBar" class="ui right fixed vertical menu" style="display:none;">
  82. <div class="mobileFileOprMenuToggle" onclick="toggleMobileSidebar(false);">
  83. <img src="img/icon.svg" class="logo"></img>
  84. <i class="large times icon"></i>
  85. </div>
  86. <!-- Sorting Mode Selector-->
  87. <div id="mobileSortDropdown">
  88. </div>
  89. <!-- File Operation Buttons -->
  90. <div class="fileoprBtnMobile" title="Open" onclick="openViaButton(); toggleMobileSidebar(false, exitMultiSelectMode);"><img class="opricon" src="img/opr/open.svg"><p class="oprtxt" locale="fileopr/Open">Open</p></div>
  91. <div class="fileoprBtnMobile" title="Copy" onclick="copy(); toggleMobileSidebar(false, exitMultiSelectMode);"><img class="opricon" src="img/opr/copy.svg"><p class="oprtxt" locale="fileopr/Copy">Copy</p></div>
  92. <div class="fileoprBtnMobile" title="Paste" onclick="paste(); toggleMobileSidebar(false, exitMultiSelectMode);"><img class="opricon" src="img/opr/paste.svg"><p class="oprtxt" locale="fileopr/Paste">Paste</p></div>
  93. <div class="fileoprBtnMobile" title="Delete" onclick="deleteFile(); toggleMobileSidebar(false, exitMultiSelectMode);"><img class="opricon" src="img/opr/delete.svg"><p class="oprtxt" locale="fileopr/Delete">Delete</p></div>
  94. <button class="fileoprSmallBtnMobile" title="Multi Select" onclick="toggleCtrl(); toggleMobileSidebar(false);"> <i class="mouse pointer icon"></i> <span locale="fileopr/Multi Select">Multi-select</span></button><br>
  95. <button class="fileoprSmallBtnMobile" title="Select All" onclick="selectAll(); toggleMobileSidebar(false);"> <i class="blue plus square icon"></i> <span locale="fileopr/Select All">Select All</span></button><br>
  96. <button class="fileoprSmallBtnMobile" title="Clear Selection" onclick="clearSelection(); toggleMobileSidebar(false, exitMultiSelectMode);"> <i class="remove icon"></i> <span locale="fileopr/Clear Select">Clear Selection</span></button><br>
  97. <button class="fileoprSmallBtnMobile" title="New File" onclick="newfile();"><i class="file outline icon"></i> <span locale="fileopr/New File">New File</span></button><br>
  98. <button class="fileoprSmallBtnMobile" title="Open with" onclick="openWith(); toggleMobileSidebar(false);"><i class="external icon"></i> <span locale="fileopr/Open with">Open With</span></button><br>
  99. <button class="fileoprSmallBtnMobile" title="Cut" onclick="cut(); toggleMobileSidebar(false, exitMultiSelectMode);"><i class="blue cut icon"></i> <span locale="fileopr/Cut">Cut</span></button><br>
  100. <button class="fileoprSmallBtnMobile" title="Rename" onclick="rename(); toggleMobileSidebar(false);"><i class="teal i cursor icon"></i> <span locale="fileopr/Rename">Rename</span></button>
  101. <button class="fileoprSmallBtnMobile" title="Create Zip" onclick="zipFile(); toggleMobileSidebar(false, exitMultiSelectMode);"><i class="brown zip file icon"></i> <span locale="fileopr/Create Zip">Create Zip</span></button><br>
  102. <button class="fileoprSmallBtnMobile" title="Unzip Here" onclick="unzipHere(); toggleMobileSidebar(false, exitMultiSelectMode);"><i class="inbox icon"></i> <span locale="fileopr/Unzip Here">Unzip Here</span></button><br>
  103. <button class="fileoprSmallBtnMobile" title="Refresh" onclick="refreshList(); toggleMobileSidebar(false);"><i class="green refresh icon"></i> <span locale="fileopr/Refresh">Refresh</span></button><br>
  104. <button class="fileoprSmallBtnMobile" title="Home" onclick="openHomeDir(); toggleMobileSidebar(false, exitMultiSelectMode);"><i class="home icon"></i> <span locale="fileopr/Home">Home</span></button><br>
  105. <button class="fileoprSmallBtnMobile" title="File Info" onclick="showFileProperties(); toggleMobileSidebar(false, exitMultiSelectMode);"><i class="blue info circle icon"></i> <span locale="fileopr/File Info">File Info</span></button><br>
  106. </div>
  107. <br>
  108. <!-- Directoy navigations -->
  109. <div class="addressBar">
  110. <button id="backbtn" class="navibarBtn" onclick="previosPath();" title="Back"><i class="left arrow icon"></i></button>
  111. <button id="ppbtn" class="navibarBtn" onclick="parentDir();" title="Parent Folder"><i class="up arrow icon"></i></button>
  112. <button class="navibarBtn" onclick="toggleSidebar();" title="Toggle Folder List"><i class="content icon"></i></button>
  113. <button class="navibarBtn DarkThemeToggle inverted" title="Dark Theme" onclick="toggleDarkTheme();"><i class="moon icon" id="darkthemebtn"></i></button>
  114. <div id="pathDisplayField" class="ui breadcrumb addressText pathDisplay desktopOnly" onclick="showEditCurrentPathInput(event);">
  115. <div class="section selectable"><i class="folder icon"></i> user</div>
  116. <div class="divider">:/</div>
  117. <div class="section selectable">Desktop</div>
  118. </div>
  119. <button id="editPathBtn" class="navibarBtn" style="margin-left: 0.4em;" title="Edit Path" onclick="showEditCurrentPathInput(event)"><i class="ui edit icon"></i></button>
  120. <div id="pathInputField" class="ui action mini input" style="display:none;">
  121. <input type="text" style="min-width: 200px;" placeholder="Type a path and press enter" onkeydown="handleOpenPathKeydown(event);">
  122. <button class="ui icon basic button" title="Open" onclick="openEnteredPath(this);">
  123. <i class="checkmark icon"></i>
  124. </button>
  125. </div>
  126. <button id="searhbtn" class="navibarBtn" title="Search" onclick="toggleSearch();"><i class="search icon"></i></button>
  127. </div>
  128. <div class="mobilePathDisplayWrapper">
  129. <div id="mobilePathDisplay" style="width:100%;" class="ui pathDisplay breadcrumb addressText mobileOnly">
  130. <div class="section selectable"><i class="folder icon"></i> user</div>
  131. <div class="divider">:/</div>
  132. <div class="section selectable">Desktop</div>
  133. </div>
  134. </div>
  135. <div class="searchbar" style="display:none;">
  136. <div class="searInputBar" style="width: 80%; display:inline-block; margin-top:-4px;">
  137. <div class="ui mini fluid input">
  138. <input autocomplete="off" id="searchInput" type="text" placeholder="File Search (Start wildcard search with / , e.g. /*.mp3)" onkeypress="handleSearchBarPress(event);">
  139. </div>
  140. </div>
  141. <button class="navibarBtn" title="Case Sensitive" onclick="toggleCaseSensitive(this);" style="margin-left: 0.4em;">Aa</button>
  142. <button class="navibarBtn" title="Search" onclick="handleSearch();"><i class="search icon"></i></button>
  143. <button class="navibarBtn" title="Clear Search" onclick="hideSearchBar();"><i class="red remove icon"></i></button>
  144. </div>
  145. <div class="msgbox" style="z-index:999; display:none;">
  146. <i class="checkmark icon"></i> <span>No Message</span>
  147. <div class="closeMsgButton" onclick="$(this).parent().stop().slideUp('fast');"><i class="caret down icon"></i></div>
  148. </div>
  149. </div>
  150. <div id="mainWindow">
  151. <div id="directorySidebar">
  152. <div id="userroot" class="ui list" style="padding-top:0px !important;">
  153. <p class="dir item" style="opacity: 0.8;"><span locale="message/initiating">Initiating</span></p>
  154. </div>
  155. <div class="ui divider"></div>
  156. <div id="storageroot" class="ui list" style="padding-top:0px !important;">
  157. <p class="dir item" style="opacity: 0.8;"><span locale="message/initiating">Initiating</span></p>
  158. </div>
  159. <!-- <div class="ui divider"></div>
  160. <div id="networkneibour" class="ui list" style="padding-top:0px !important;">
  161. </div> -->
  162. <div class="ui divider"></div>
  163. <p id="selectInfo"></p>
  164. </div>
  165. <div id="folderView" ondrop="drop(event)" ondragover="allowDrop(event)">
  166. <div id="folderList" class="fileviewList">
  167. </div>
  168. <div id="fileList" class="fileviewList">
  169. </div>
  170. <br>
  171. </div>
  172. <div id="propertiesView" class="small" style="display:none;">
  173. <div class="preview" style="margin-top: 0.4em;">
  174. <img class="ui fluid image" >
  175. </div>
  176. <h3 class="ui header" style="margin-top: 0.4em;">
  177. <span class="filename" style="word-break: break-all;" locale="sidebar/default/nofileselected">No File Selected</span>
  178. <div class="sub header vpath" style="word-break: break-all;" locale="sidebar/default/instruction">Select a file to view file properties</div>
  179. </h3>
  180. <table class="ui very basic table">
  181. <tbody class="propertiesTable">
  182. </tbody>
  183. </table>
  184. <div style="height: 34px;">
  185. <div class="ui right floated buttons">
  186. <button style="min-width: 2.5em;" title="Share File" class="ui basic icon button shareBtn" onclick="shareFile();"><i class="share alternate icon"></i></button>
  187. <button style="min-width: 2.5em;" title="Expand Properties Sidebar" class="ui basic icon button sizeToggle" onclick="togglePreviewWindowSize();"><i class="expand icon"></i></button>
  188. </div>
  189. </div>
  190. </div>
  191. </div>
  192. <!-- Other popup windows -->
  193. <div class="popupWrapper"></div>
  194. <!-- Overwrite Selection Box-->
  195. <div id="overwriteModeSelection" class="popup" style="display:none;">
  196. <div class="popupheader">
  197. <i class="paste icon"></i> <span locale="opr/overwrite/title">Replace, Keep or Skip Files</span>
  198. <div class="popupcloser" onclick="hideAllPopupWindows();">
  199. <i class="remove icon"></i>
  200. </div>
  201. </div>
  202. <div class="popupcontent" style="padding:12px;">
  203. <small style="font-size:80%;"><span locale="opr/overwrite/copying">Copying</span> <span class="owm-fc"></span> <span locale="opr/overwrite/files">files from</span> <span class="owm-srcdir"></span> <span locale="opr/overwrite/to">to</span> <span class="owm-destdir"></span></small>
  204. <p><span locale="opr/overwrite/dest">The destination has </span><span class="owm-fc"></span> <span locale="opr/overwrite/samename">files with the same names.</span></p>
  205. <div class="popupbuttons allowHover primary" onclick="changeOverwriteRule(0,true);">
  206. <i class="checkmark icon"></i> <span locale="opr/overwrite/replace">Replace the files in the destination</span>
  207. </div>
  208. <div class="popupbuttons allowHover" onclick="changeOverwriteRule(1,true);">
  209. <i class="reply icon"></i> <span locale="opr/overwrite/skip">Skip these files</span>
  210. </div>
  211. <div class="popupbuttons allowHover" onclick="changeOverwriteRule(2,true);">
  212. <i class="undo icon"></i> <span locale="opr/overwrite/keep">Rename and keep the files</span>
  213. </div>
  214. </div>
  215. </div>
  216. <!-- Force delete confirmation box -->
  217. <div id="forceDeleteConfirmBox" class="popup" style="display:none;">
  218. <div class="popupheader">
  219. <i class="trash icon"></i> <span locale="opr/pre-remove/title">Permanently Remove Files</span>
  220. <div class="popupcloser" onclick="hideAllPopupWindows();">
  221. <i class="remove icon"></i>
  222. </div>
  223. </div>
  224. <div class="popupcontent" style="padding:12px;">
  225. <p locale="opr/pre-remove/questions">Are you sure you want to remove these files <u>permanently?</u><br>This action is <u>irreversible</u>.</p>
  226. <div class="ui list deleteFilelist" style="max-height:350px;overflow-y:auto; ">
  227. </div>
  228. <div class="popupbuttons allowHover" style="background-color: #eb4034 !important;" onclick="forceDelete(true);";>
  229. <i class="trash icon"></i> <span locale="opr/pre-remove/confirm">Confirm</span>
  230. </div>
  231. <div class="popupbuttons allowHover" onclick="cancelForceDelete();">
  232. <i class="remove icon"></i> <span locale="opr/pre-remove/cancel">Cancel</span>
  233. </div>
  234. </div>
  235. </div>
  236. <!-- Delete confirm box -->
  237. <div id="deleteConfirmBox" class="popup" style="display:none;">
  238. <div class="popupheader">
  239. <i class="recycle icon"></i> <span locale="opr/remove/title">Move files to Trash Bin</span>
  240. <div class="popupcloser" onclick="hideAllPopupWindows();">
  241. <i class="remove icon"></i>
  242. </div>
  243. </div>
  244. <div class="popupcontent" style="padding:12px;">
  245. <p locale="opr/remove/question">Are you sure you want to move these files to trash bin?</p>
  246. <div class="ui list deleteFilelist" style="max-height:350px;overflow-y:auto; ">
  247. </div>
  248. <div class="popupbuttons allowHover" style="color: #2bbbdf !important;" onclick="deleteFile(true);";>
  249. <i class="recycle icon"></i> <span locale="opr/remove/confirm">Move to Trash</span>
  250. </div>
  251. <div class="popupbuttons allowHover" style="background-color: #ff7a7a !important;" onclick="hideAllPopupWindows(); forceDelete();">
  252. <i class="trash icon"></i> <span locale="opr/pre-remove/title">Delete Permanently</span>
  253. </div>
  254. <div class="popupbuttons allowHover" onclick="cancelDelete(); ">
  255. <i class="remove icon"></i> <span locale="opr/remove/cancel">Cancel</span>
  256. </div>
  257. </div>
  258. </div>
  259. <!-- Rename tool box -->
  260. <div id="renameBox" class="popup" style="display:none;">
  261. <div class="popupheader">
  262. <i class="text cursor icon"></i> <span locale="opr/rename/title">Rename Files</span>
  263. <div class="popupcloser" onclick="hideAllPopupWindows();">
  264. <i class="remove icon"></i>
  265. </div>
  266. </div>
  267. <div class="popupcontent" style="padding:12px;">
  268. <p locale="opr/rename/instruction">Enter the new filename for renaming. </p>
  269. <p class="multifileWarning"><i class="notice icon"></i> Other files will be named as file(#)</p>
  270. <div class="ui left icon small fluid input" style="margin-bottom:12px;">
  271. <input type="text" class="orgfn" placeholder="Original Filename" readonly="true">
  272. <i class="minus square icon" style="color:rgb(122, 176, 247)"></i>
  273. </div>
  274. <div class="ui left icon small fluid input" style="margin-bottom:12px;">
  275. <input type="text" class="newfn" placeholder="New Filename" onkeydown="handleEnterKeyDown(event, function(){confirmRename(true);})">
  276. <i class="add square icon" style="color:rgb(122, 176, 247)"></i>
  277. </div>
  278. <div class="popupbuttons allowHover primary" onclick="confirmRename(true);";>
  279. <i class="checkmark icon"></i> <span locale="opr/rename/ok">OK</span>
  280. </div>
  281. <div class="popupbuttons allowHover" onclick="hideAllPopupWindows();">
  282. <i class="remove icon"></i> <span locale="opr/rename/cancel">Cancel</span>
  283. </div>
  284. </div>
  285. </div>
  286. <!-- New File Dialog-->
  287. <div id="newFile" class="popup" style="display:none;">
  288. <div class="popupheader">
  289. <i class="add icon"></i> <span locale="opr/newfile/title">New File</span>
  290. <div class="popupcloser" onclick="hideAllPopupWindows();">
  291. <i class="remove icon"></i>
  292. </div>
  293. </div>
  294. <div class="popupcontent" style="padding:12px;">
  295. <p locale="opr/newfile/instruction">Select a type of file to be created.</p>
  296. <div class="newfilelist" style="max-height:18em; overflow-y:scroll">
  297. <div class="item newFileFormat" ext="php">No Item</div>
  298. </div>
  299. <p locale="opr/newfile/newempty">Or create an empty file with given filename:</p>
  300. <div class="ui left icon small fluid input" style="margin-bottom:12px;">
  301. <input id="createNewFileName" type="text" placeholder="New Filename" onkeydown="handleEnterKeyDown(event, confirmNewFile);">
  302. <i class="add square icon" style="color:rgb(122, 176, 247)"></i>
  303. </div>
  304. <p class="duplicateWarning" style="color:#CE5F58; display:none;"><i class="caution sign icon"></i> The given filename already exist.</p>
  305. <div class="popupbuttons allowHover primary" onclick="confirmNewFile();";>
  306. <i class="add icon"></i> <span locale="opr/newfile/create">Create</span>
  307. </div>
  308. <div class="popupbuttons allowHover" onclick="hideAllPopupWindows();">
  309. <i class="remove icon"></i> <span locale="opr/newfile/cancel">Cancel</span>
  310. </div>
  311. </div>
  312. </div>
  313. <!-- New Folder Dialog-->
  314. <div id="newFolder" class="popup" style="display:none;">
  315. <div class="popupheader">
  316. <i class="folder icon"></i> <span locale="opr/newfolder/title">New Folder</span>
  317. <div class="popupcloser" onclick="hideAllPopupWindows();">
  318. <i class="remove icon"></i>
  319. </div>
  320. </div>
  321. <div class="popupcontent" style="padding:12px;">
  322. <p locale="opr/newfolder/desc">Enter the new folder name to be created.</p>
  323. <div class="ui left icon small fluid input" style="margin-bottom:12px;">
  324. <input id="createNewFolder" type="text" placeholder="New Folder Name" onkeydown="handleEnterKeyDown(event, function(){newFolder(true);});">
  325. <i class="add square icon" style="color:rgb(122, 176, 247)"></i>
  326. </div>
  327. <p class="duplicateWarning" style="color:#CE5F58; display:none;"><i class="caution sign icon"></i> <span locale="opr/newfolder/alreadyExists">The given folder already exist.</span></p>
  328. <div class="popupbuttons allowHover primary" onclick="newFolder(true);";>
  329. <i class="add icon"></i> <span locale="opr/newfolder/create">Create</span>
  330. </div>
  331. <div class="popupbuttons allowHover" onclick="hideAllPopupWindows();">
  332. <i class="remove icon"></i> <span locale="opr/newfolder/cancel">Cancel</span>
  333. </div>
  334. </div>
  335. </div>
  336. <!-- Share File Dialog-->
  337. <div id="shareFile" class="popup" style="display:none;">
  338. <div class="popupheader">
  339. <i class="external icon"></i> <span locale="opr/share/title">Share File</span>
  340. <div class="popupcloser" onclick="hideShare();">
  341. <i class="remove icon"></i>
  342. </div>
  343. </div>
  344. <div>
  345. <iframe id="shareFileEmbedded" style="border: 0px solid transparent; width: 100%; height: 70vh;" allowtransparency="true">
  346. </iframe>
  347. </div>
  348. <div style="padding:12px;">
  349. <div class="ui divider"></div>
  350. <div id="sharingRemoveBtn" class="popupbuttons negative allowHover" onclick="removeSharing()">
  351. <i class="remove icon"></i> <span locale="opr/share/remove">Remove Sharing</span>
  352. </div>
  353. <div class="popupbuttons allowHover" onclick="hideShare();">
  354. <i class="checkmark icon"></i> <span locale="opr/share/ok">OK</span>
  355. </div>
  356. </div>
  357. </div>
  358. <!-- Open With Dialog-->
  359. <div id="openWith" class="popup" style="display:none;">
  360. <div class="popupheader">
  361. <i class="external icon"></i> <span locale="opr/openwith/title">Open File With</span>
  362. <div class="popupcloser" onclick="hideAllPopupWindows();">
  363. <i class="remove icon"></i>
  364. </div>
  365. </div>
  366. <div class="popupcontent" style="padding:12px;">
  367. <p locale="opr/openwith/desc">Select a module from the list below:</p>
  368. <div id="openWithModuleList" class="ui segment" style="padding:0px;">
  369. <div class="item selectable">
  370. <div class="content" style="padding-left:12px;">
  371. <div class="header" locale="opr/openwith/loading">Loading...</div>
  372. </div>
  373. </div>
  374. </div>
  375. <div class="openWithModule popupbuttons allowHover primary" onclick="openWithSelectedModule(this);";>
  376. <i class="external icon"></i> <span locale="opr/openwith/openWithWebApp">Open with Selected Module</span>
  377. </div>
  378. <div class="openWithModule popupbuttons allowHover" onclick="openFileWithModuleInNewTab(this);">
  379. <i class="add icon"></i> <span locale="opr/openwith/openWithWebAppInNewWindow">Open in new tab</span>
  380. </div>
  381. <div class="popupbuttons allowHover vdonly" onclick="openRawFileInFloatWindow(this);">
  382. <i class="window restore outline icon"></i> <span locale="opr/openwith/openInNewWindow">Open File directly in floatWindow</span>
  383. </div>
  384. <div class="popupbuttons allowHover" onclick="hideAllPopupWindows();">
  385. <i class="remove icon"></i> <span locale="opr/openwith/cancel">Cancel</span>
  386. </div>
  387. </div>
  388. </div>
  389. <!-- Context Menu -->
  390. <div id="contextmenu" class="contextmenu" style="min-width:250px;">
  391. <div class="item" onclick="openViaButton();">
  392. <i class="folder open icon"></i> <span locale="contextmenu/open">Open</span>
  393. </div>
  394. <div class="item fileonly" onclick="openWith();">
  395. <i class="external icon"></i> <span locale="contextmenu/openWith">Open With</span>
  396. </div>
  397. <div class="item folderonly" onclick="openSelectedFolderInNewWindow();">
  398. <i class="external icon"></i> <span locale="contextmenu/openNewWindow">Open In New Window</span>
  399. </div>
  400. <!-- This is the vroot alternative new windows-->
  401. <div class="item vrootonly" onclick="openSelectedVroot();">
  402. <i class="external icon"></i> <span locale="contextmenu/openNewWindowVroot">Open In New Window</span>
  403. </div>
  404. <div class="item shareonly" onclick="openFileLocation();">
  405. <i class="folder outline icon"></i> <span locale="contextmenu/openFileLocation">Open File Location</span>
  406. </div>
  407. <div class="item singleObjectOnlyHide" onclick="shareFile();">
  408. <i class="share alternate icon"></i> <span locale="contextmenu/Share">Share</span>
  409. </div>
  410. <div class="item mobileonly" onclick="toggleCtrl();">
  411. <i class="mouse pointer icon"></i> <span locale="contextmenu/MuitSelect">Multi-select</span>
  412. </div>
  413. <div class="item" onclick="copy();">
  414. <i class="copy icon"></i> <span locale="contextmenu/copy">Copy</span>
  415. <span class="description">Ctrl + C</span>
  416. </div>
  417. <div class="item allowNoSelection" onclick="paste();">
  418. <i class="paste icon"></i> <span locale="contextmenu/paste">Paste</span>
  419. <span class="description">Ctrl + V</span>
  420. </div>
  421. <div class="item" onclick="cut();">
  422. <i class="cut icon"></i> <span locale="contextmenu/cut">Cut</span>
  423. <span class="description">Ctrl + X</span>
  424. </div>
  425. <div class="divider vroothide noSelectionOnly"></div>
  426. <div class="item noSelectionOnly" onclick="newfile();">
  427. <i class="file outline icon"></i> <span locale="contextmenu/newFile">New File</span>
  428. </div>
  429. <div class="item noSelectionOnly" onclick="newFolder();">
  430. <i class="folder outline icon"></i> <span locale="contextmenu/newFolder">New Folder</span>
  431. </div>
  432. <div class="divider vroothide"></div>
  433. <div class="item noSelectionOnly" onclick="upload();">
  434. <i class="upload icon"></i> <span locale="contextmenu/upload">Upload</span>
  435. </div>
  436. <div class="item" onclick="zipFile();">
  437. <i class="zip file icon"></i> <span locale="contextmenu/zip">Create Zip</span>
  438. </div>
  439. <div class="item zipFileOnly" onclick="unzipHere();">
  440. <i class="inbox icon"></i> <span locale="contextmenu/unzip">Unzip Here</span>
  441. </div>
  442. <div class="item" onclick="rename();">
  443. <i class="i cursor icon"></i> <span locale="contextmenu/rename">Rename</span>
  444. </div>
  445. <div class="item" onclick="deleteFile();">
  446. <i class="trash icon"></i> <span locale="contextmenu/delete">Delete</span>
  447. </div>
  448. <div class="item folderonly singleObjectOnlyHide" onclick="createDesktopShortcut();">
  449. <i class="external square icon"></i> <span locale="opr/shortcut/title">Create Shortcut on Desktop</span>
  450. </div>
  451. <div class="divider vroothide"></div>
  452. <div class="item noSelectionOnly" onclick="refreshList();">
  453. <i class="refresh icon"></i> <span locale="contextmenu/refresh">Refresh</span>
  454. </div>
  455. <div class="item" onclick="downloadFile();">
  456. <i class="download icon"></i> <span locale="contextmenu/download">Download</span>
  457. </div>
  458. <div class="item" onclick="showFileProperties();">
  459. <i class="info circle icon"></i> <span locale="contextmenu/properties">Properties</span>
  460. </div>
  461. <!-- This properties shows the currentDirectory properties instead of the selected file properties-->
  462. <div class="item noSelectionOnly" onclick="showCurrentDirectoryProperties();">
  463. <i class="ui info circle icon"></i> <span locale="contextmenu/properties">Properties</span>
  464. </div>
  465. <div class="item vrootonly" onclick="showSharesManager();">
  466. <i class="share alternate icon"></i> <span locale="contextmenu/sharemanager">Open Shares Manager</span>
  467. </div>
  468. <!-- This properties show the vroot properties -->
  469. <div class="item vrootonly" onclick="showVrootProperties();">
  470. <i class="ui info circle icon"></i> <span locale="contextmenu/properties">Properties</span>
  471. </div>
  472. </div>
  473. <!-- Upload Progress Bars-->
  474. <div id="uploadTab" class="ui segment" style="display:none;">
  475. <div class="statusBar">
  476. <i class="upload icon"></i><span id="uploadCount">0</span> <span locale="upload/count/uploading">Files</span> / <i class="wait icon"></i> <span id="waitingCount">0</span> <span locale="upload/count/pending">Files</span>
  477. <div class="hideUploadButton" onclick="toggleUploadList();">
  478. <i class="caret down icon"></i>
  479. </div>
  480. </div>
  481. <div class="uploadList" id="uploadProgressList">
  482. </div>
  483. </div>
  484. <!-- Confirm Exit -->
  485. <!-- Open With Dialog-->
  486. <div id="confirmExit" class="popup" style="display:none;">
  487. <div class="popupheader">
  488. <i class="external icon"></i> <span locale="opr/confirmclose/title">Confirm Exit</span>
  489. <div class="popupcloser" onclick="hideAllPopupWindows();">
  490. <i class="remove icon"></i>
  491. </div>
  492. </div>
  493. <div class="popupcontent" style="padding:12px;">
  494. <p locale="opr/confirmclose/desc">This file manager instance is currently uploading file to server. Closing this instance will cancel the upload tasks. <br>
  495. <b>Confirm Exit?</b></p>
  496. <div class="popupbuttons negative allowHover" onclick="ao_module_closeHandler(); hideAllPopupWindows();">
  497. <i class="trash icon"></i> <span locale="opr/confirmclose/cancelAndExit">Cancel Upload and Exit</span>
  498. </div>
  499. <div class="popupbuttons allowHover" onclick="hideAllPopupWindows();">
  500. <i class="checkmark icon"></i> <span locale="opr/confirmclose/continue">Continue Upload</span>
  501. </div>
  502. </div>
  503. </div>
  504. <script>
  505. let directorySidebarWidth = 250; //Width of the sidebar
  506. let sideBarShown = true; //Indicate if sidebar is shown
  507. let rootDirs = []; //Storage location for rootDirs
  508. let currentTheme = "whiteTheme"; //Default theme
  509. let viewMode = "list"; //Viewmode, support {list, grid, detail}
  510. let sortMode = "default"; //Sortmode, support {default, reverse, smallToLarge, largeToSmall, mostRecent, leastRecent}
  511. let currentPath = "user:/"
  512. let viewHistory = []; //View history
  513. let enableBetaFilename = false; //Enable beta filename conversion from "inith..." to "normal"
  514. let currentFilelist = []; //The current file list in the currentPath
  515. let currentPathHash = ""; //The folder content hash
  516. let enableAutoRefresh = true; //Enable directory updates on file change
  517. let filesIconTheme = "default";
  518. //File operations
  519. let clipboard = []; //System clipboard
  520. let cutMode = false; //If set to true, this is cut mode. Else copy mode
  521. let useLocalstorage = lscheck();
  522. let overwriteMode = "keep"; //Overwrite mode, support {skip, overwrite, keep}
  523. let thumbRenderWebSocket = null;
  524. let pathInputMode = false;
  525. let renameMode = false;
  526. //Searching related
  527. let searchCaseSensitive = false;
  528. let viewModeBeforeSearch = "list";
  529. let searchMode = false;
  530. let hotSearchBuffer = "";
  531. let hotSearchTimer = null;
  532. let hotSearchOffsetIndex = 0;
  533. let propertiesView = false; //Enable viewing properties on the right sidebar
  534. //Keypress listeners
  535. let ctrlHold = false;
  536. let shiftHold = false;
  537. let lastClickedElement = undefined;
  538. //Upload related
  539. let uploadingFileCount = 0;
  540. let maxConcurrentUpload = 4; //Maxmium number of oncurrent upload
  541. let uploadPendingList = []; //Upload pending queue for mass upoad
  542. let uploadRetryMap = new Map(); //taskUUID -> {file, targetDir} for WebSocket upload retry
  543. let lowMemoryMode = true; //Upload with low memory mode channel
  544. let largeFileCutoffSize = 8192 * 1024 * 1024; //Any file larger than this size is consider "large file", default to 8GB
  545. let uploadFileChunkSize = 1024 * 512; //512KB, 4MB not working quite well on slow network
  546. let postUploadModeCutoff = 25 * 1048576; //25MB, files smaller than this will upload using POST Mode
  547. const CHUNK_TIMEOUT_MS = 30000; //30s timeout waiting for server "next" ack before retrying a chunk
  548. const MAX_CHUNK_RETRIES = 3; //Maximum retries per individual chunk before failing the upload
  549. //CRC32 lookup table and helpers for chunk/file integrity verification
  550. const crc32Table = (() => {
  551. const t = new Uint32Array(256);
  552. for (let i = 0; i < 256; i++) {
  553. let c = i;
  554. for (let j = 0; j < 8; j++) c = (c & 1) ? (0xEDB88320 ^ (c >>> 1)) : (c >>> 1);
  555. t[i] = c;
  556. }
  557. return t;
  558. })();
  559. //Update a running CRC32 state with new bytes (does not finalize)
  560. function crc32UpdateState(state, bytes) {
  561. for (let i = 0; i < bytes.length; i++)
  562. state = (state >>> 8) ^ crc32Table[(state ^ bytes[i]) & 0xFF];
  563. return state;
  564. }
  565. //Compute standalone CRC32 of a Uint8Array and return hex string
  566. function crc32Hex(bytes) {
  567. return ((crc32UpdateState(0xFFFFFFFF, bytes) ^ 0xFFFFFFFF) >>> 0).toString(16).padStart(8, '0');
  568. }
  569. //Module-registered extension icons (ext without dot → web-root-relative path)
  570. var extIconRegistry = {};
  571. //File Sharing related
  572. let shareEditingObject = "";
  573. let shareEditingUUID = "";
  574. //System Information
  575. let systecontextmenumUUID = "";
  576. let systemIP = "";
  577. //Browser detection
  578. let isMobile = window.mobilecheck();
  579. let isChromium = window.chrome;
  580. let isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
  581. let isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
  582. let isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
  583. //Intiiation functions
  584. $(document).ready(function(){
  585. $("#contextmenu").css("display", "hidden");
  586. //Function to complete initialization after applocale is ready
  587. function completeInitialization(){
  588. //Fetch module-registered extension icons once so the grid view can use them
  589. $.get("/system/modules/exticons", function(data) {
  590. if (typeof data === "string") { try { data = JSON.parse(data); } catch(e) {} }
  591. if (data && typeof data === "object") { extIconRegistry = data; }
  592. });
  593. initRootDirs();
  594. initSystemInfo();
  595. initUploadMode();
  596. $(".dropdown").dropdown();
  597. $("#sortingMethodSelector").dropdown("set selected", sortMode);
  598. updateSelectedObjectsCount();
  599. initWindowSizes(false);
  600. //Initialize view mode buttons
  601. updateViewmodeButtons();
  602. //Initialize system theme
  603. loadPreference("file_explorer/theme",function(data){
  604. if (data.error === undefined){
  605. if (data == "darkTheme"){
  606. toggleDarkTheme();
  607. }else{
  608. //White theme
  609. }
  610. }
  611. });
  612. //Initialize properties view
  613. if (localStorage.getItem("file_explorer/viewProperties") == "true"){
  614. $("#togglePropertiesViewBtn").click();
  615. }
  616. //Initialize directory views based on hash
  617. if (window.location.hash != ""){
  618. //Check if the hash is standard open protocol. If yes, translate it
  619. if (ao_module_loadInputFiles() === null){
  620. //Window location hash set. List the desire directory
  621. currentPath = window.location.hash.substring(1,window.location.hash.length);
  622. if (currentPath.substring(currentPath.length -1) != "/"){
  623. currentPath = currentPath + "/";
  624. }
  625. currentPath = decodeURIComponent(currentPath);
  626. loadListModeFromDB(function(){
  627. listDirectory(currentPath);
  628. });
  629. }else{
  630. //This is ao_module load file input. Handle the file opening
  631. var filelist = ao_module_loadInputFiles();
  632. if (filelist.length > 0){
  633. filelist = filelist[0];
  634. //Check if this is folder or file. Only opendir when it is folder
  635. //Updates 27-12-2020: Open folder and highlight the file if it is file
  636. if (filelist.filename.includes(".") == false){
  637. //Try to open it and overwrite the hash to filesystem hash
  638. loadListModeFromDB(function(){
  639. listDirectory(filelist.filepath);
  640. });
  641. }else{
  642. //File. Open its parent folder and highlight the target file if exists
  643. var parentdir = filelist.filepath.split("/");
  644. let focusFilename = JSON.parse(JSON.stringify(filelist.filename));
  645. parentdir.pop();
  646. parentdir = parentdir.join("/");
  647. loadListModeFromDB(function(){
  648. listDirectory(parentdir, function(){
  649. if (focusFilename != ""){
  650. //Timeout to give the DOM time to render
  651. //DO NOT REPLACE THIS WITH listDirectoryAndHighlight
  652. //Additional delay are required on page load
  653. setTimeout(function(){
  654. focusFileObject(focusFilename);
  655. }, 300);
  656. }
  657. })
  658. });
  659. }
  660. }
  661. }
  662. }else{
  663. //Initialized directory views
  664. loadListModeFromDB(function(){
  665. listDirectory(currentPath);
  666. });
  667. }
  668. }
  669. if (applocale){
  670. //Applocale found. Do localization
  671. applocale.init("../locale/file_explorer.json", function(){
  672. applocale.translate();
  673. completeInitialization();
  674. });
  675. }else{
  676. //Applocale not found. Is this a trim down version of ArozOS?
  677. applocale = {
  678. getString: function(key, original){
  679. return original;
  680. }
  681. }
  682. completeInitialization();
  683. }
  684. if (isMobile){
  685. //Mobile css adjustment
  686. sideBarShown = false;
  687. $("#directorySidebar").hide();
  688. $("#directorySidebar").css("width",window.innerWidth + "px");
  689. $("body").css("overflow","hidden");
  690. $("#navibar").addClass("mobile");
  691. directorySidebarWidth = window.innerWidth;
  692. $("#folderView").css({
  693. "padding-right":"1em",
  694. "padding-left":"1em",
  695. "padding-top":"1em",
  696. });
  697. //Move the sort menu into the desktop address bar gap
  698. $(".viewportBtns").addClass("mobile");
  699. $(".addressBar").append($(".viewportBtns"));
  700. //Move the sorting dropdown to sidebar
  701. $("#mobileSortDropdown").append($("#sortingMethodSelector"));
  702. $(".desktopOnly").hide();
  703. $(".mobileOnly").show();
  704. }else{
  705. $(".mobileOnly").hide();
  706. $(".desktopOnly").show();
  707. }
  708. //Create a timer to check change in current folder
  709. setInterval(function(){
  710. if (enableAutoRefresh == false){
  711. return;
  712. }
  713. let currentPagePath = currentPath;
  714. getDirHash(function(hash){
  715. if (hash.error !== undefined){
  716. //Something went wrong. Ignore this request
  717. console.log(hash.error)
  718. }else{
  719. //Check if the hash match with the last hash && user is still on the same page
  720. if (hash != currentPathHash && currentPagePath == currentPath){
  721. //console.log(currentPathHash, hash);
  722. refreshList();
  723. currentPathHash = hash;
  724. if (currentPath == "user:/"){
  725. //Reload the User root folder list
  726. initRootDirs();
  727. }
  728. }
  729. }
  730. });
  731. }, 5000);
  732. //Update the window sizes for special cases
  733. if (window.innerWidth < 620 && !isMobile){
  734. toggleSidebar(false);
  735. }
  736. initWindowSizes(false);
  737. });
  738. //END OF INIT FUNCTIONS
  739. //Get the system ID and ip address from the system id services
  740. function initSystemInfo(){
  741. $.get("../../system/id/requestInfo",function(data){
  742. if (data.error !== undefined){
  743. msgbox("red remove", data.error);
  744. }else{
  745. systemUUID = data.SystemUUID;
  746. systemIP = data.IpAddress;
  747. }
  748. });
  749. }
  750. //Initiate the sidebar contents
  751. function initRootDirs(){
  752. //Load user directories
  753. $.ajax({
  754. url:"../../system/file_system/listRoots?user=true",
  755. success: function(data){
  756. $("#userroot").html("");
  757. for (var i =0; i < data.length; i++){
  758. var thisRootObject = data[i];
  759. if (thisRootObject.IsDir == true && !(thisRootObject.Filename == ".cache" || thisRootObject.Filename == ".trash")){
  760. //Files will not be listed in the root directory list
  761. var specifcRootInfo = getUserRootIcons(thisRootObject.Filename);
  762. var icon = specifcRootInfo[0];
  763. var displayName = specifcRootInfo[1];
  764. var vpath = thisRootObject.Filepath;
  765. $("#userroot").append(`<div class="dir item userrootfolder" filepath="${vpath}" type="folder" onclick="openthis(this);"><i class="${icon} rightmargin icon"></i> ${displayName}</div>`);
  766. }
  767. }
  768. }
  769. });
  770. //Load other storage devices
  771. $.ajax({
  772. url:"../../system/file_system/listRoots",
  773. success: function(data){
  774. $("#storageroot").html("");
  775. for (var i =0; i < data.length; i++){
  776. var thisRoot = data[i];
  777. var displayName = thisRoot.RootName;
  778. var rootPath = thisRoot.RootPath;
  779. $("#storageroot").append(`<div class="dir item vroot" filepath="${rootPath}" type="folder" rootname="${displayName}" onclick="openthis(this);"><i class="disk outline rightmargin icon"></i> ${displayName} (${rootPath})</div>`);
  780. }
  781. highlightCurrentRoot();
  782. }
  783. });
  784. }
  785. function highlightCurrentRoot(){
  786. //Highlight the target vroot name on the side bar
  787. $(".vroot.active").removeClass("active");
  788. $(".vroot").each(function(){
  789. let rootname = $(this).attr("filepath");
  790. if ((currentPath.toLowerCase()).startsWith((rootname.toLowerCase()))){
  791. //This is the root we are currently in
  792. $(this).addClass("active");
  793. }
  794. });
  795. }
  796. function getUserRootIcons(foldername){
  797. var icon = "folder open";
  798. var name = foldername;
  799. foldername = foldername.toLowerCase();
  800. if (foldername == "desktop"){
  801. icon = "computer";
  802. name = applocale.getString("sidebar/vroot/desktop", name);
  803. }else if (foldername == "document"){
  804. icon = "file text outline";
  805. name = applocale.getString("sidebar/vroot/document", name);
  806. }else if (foldername == "music" || foldername == "audio"){
  807. icon = "music";
  808. name = applocale.getString("sidebar/vroot/music", name);
  809. }else if (foldername == "photo" || foldername == "picture"){
  810. icon = "image";
  811. name = applocale.getString("sidebar/vroot/photo", name);
  812. }else if (foldername == "video" || foldername == "film"){
  813. icon = "video";
  814. name = applocale.getString("sidebar/vroot/video", name);
  815. }else if (foldername == "trash" || foldername == "bin" || foldername == "rubbish"){
  816. icon = "trash"
  817. name = applocale.getString("sidebar/vroot/trash", name);
  818. }else if (foldername == "download"){
  819. icon = "download"
  820. name = applocale.getString("sidebar/vroot/download", name);
  821. }else if (foldername == "www" || foldername == "web" || foldername == "mysite"){
  822. icon = "globe"
  823. name = applocale.getString("sidebar/vroot/web", name);
  824. }else if (foldername == "model"){
  825. icon = "cube"
  826. name = applocale.getString("sidebar/vroot/model", name);
  827. }else if (foldername == "appdata"){
  828. icon = "code"
  829. name = applocale.getString("sidebar/vroot/appdata", name);
  830. }
  831. return [icon, name];
  832. }
  833. // ============================== PATH SHORTCUT RESOLUTION ====================
  834. var pathShortcuts = {
  835. "%appdata%": "user:/.appdata/",
  836. };
  837. function resolvePathShortcut(path){
  838. var lower = path.trim().toLowerCase();
  839. if (pathShortcuts[lower] !== undefined){
  840. return pathShortcuts[lower];
  841. }
  842. return path;
  843. }
  844. // ============================== FOLDER LISTING FUNCTIONS ====================
  845. function listDirectory(path, callback=undefined, recordUndo=true){
  846. path = resolvePathShortcut(path);
  847. enableAutoRefresh = false;
  848. var recordPreviousPage = true;
  849. if (recordUndo == false){
  850. recordPreviousPage = false;
  851. }
  852. if (searchMode){
  853. hideSearchBar(true);
  854. }
  855. if (pathInputMode){
  856. hideManualOpenPathInput();
  857. }
  858. if (isMobile && ctrlHold){
  859. exitMultiSelectMode();
  860. }
  861. //Backup the current selected files if it is an refresh operation
  862. let selectedFiles = [];
  863. let currentScrollTop = JSON.parse(JSON.stringify($("#folderView").scrollTop()));
  864. if (path == currentPath){
  865. $(".fileObject.item.selected").each(function(){
  866. selectedFiles.push($(this).attr("filename"));
  867. });
  868. //Set record histroy to false on refresh
  869. recordPreviousPage = false;
  870. }
  871. //Always pad slash to the end of path
  872. if (path.substring(path.length - 1) != "/"){
  873. path = path + "/";
  874. }
  875. //Clean the path if there are any malformat
  876. if (path.indexOf("//") != -1){
  877. path = path.split("//").join("/");
  878. }
  879. if (recordPreviousPage){
  880. viewHistory.push(currentPath);
  881. }
  882. if (!ao_module_virtualDesktop){
  883. //Update the window hash
  884. window.location.hash = encodeURIComponent(path);
  885. }
  886. updatePathDisplay(path);
  887. currentPath = path;
  888. //Update floatWindow title if exists
  889. if (ao_module_virtualDesktop){
  890. var tmp = path.split("/");
  891. tmp.pop();
  892. ao_module_setWindowTitle(applocale.getString("title/title", "File Manager") + " - " + tmp.pop());
  893. }
  894. //Check if there are parent path for curret path
  895. if (checkIfParentDirExists(currentPath)){
  896. $("#ppbtn").removeClass("disabled");
  897. }else{
  898. $("#ppbtn").addClass("disabled");
  899. }
  900. if (viewHistory.length < 1){
  901. $("#backbtn").addClass("disabled");
  902. }else{
  903. $("#backbtn").removeClass("disabled");
  904. }
  905. //Add loading screen to the folderlists and fileList
  906. $("#fileList").html("");
  907. let loaderClass = "inverted";
  908. if (currentTheme == "darkTheme"){
  909. loaderClass = "";
  910. }
  911. $("#folderList").html(`<div style="height: 100px;">
  912. <div class="ui active ${loaderClass} dimmer" style="z-index: 95;">
  913. <div class="ui text loader">${applocale.getString("message/loading", "Loading")}</div>
  914. </div>
  915. </div>`);
  916. $(".userroot.active").removeClass('active');
  917. //Highlight new path coot
  918. highlightCurrentRoot();
  919. //Get sort mode from server side
  920. let loadStartPath = currentPath;
  921. $.ajax({
  922. url: "../../system/file_system/sortMode",
  923. metod: "POST",
  924. data: {opr: "get", folder: currentPath},
  925. success: function(data){
  926. if (data.error == undefined){
  927. sortMode = data;
  928. }
  929. $("#sortingMethodSelector").dropdown("set selected", sortMode);
  930. //Start listdir event
  931. $.ajax({
  932. url: "../../system/file_system/listDir",
  933. method: "POST",
  934. data: {dir: decodeURIComponent(path), sort: sortMode},
  935. success: function(data){
  936. //Parse the filelist into global variable
  937. currentFilelist = [];
  938. if (data === null){
  939. //There is nothing in this folder.
  940. $("#folderList").hide();
  941. $("#fileList").hide();
  942. if (callback !== undefined){
  943. callback();
  944. }
  945. return;
  946. }
  947. if (currentPath != loadStartPath){
  948. //Use switch to another path before the load finish. Do not render
  949. return;
  950. }
  951. if (data.error !== undefined){
  952. //Parse path error. Try to refresh the page
  953. if (data.error.length >= "Redirect:".length && data.error.substr(0,9) == "Redirect:"){
  954. var redirectAction = data.error.substr(9).trim();
  955. if (redirectAction == "parent"){
  956. var pdir = currentPath.split("/");
  957. pdir.pop(); pdir.pop();
  958. pdir = pdir.join("/");
  959. currentPath = pdir;
  960. listDirectory(currentPath);
  961. }else if (redirectAction == "root"){
  962. var currentRoot = currentPath.split("/").shift();
  963. listDirectory(currentRoot);
  964. }else if (redirectAction == "userroot"){
  965. listDirectory("user:/")
  966. }else{
  967. //Try to breakdown the redirection path
  968. listDirectory(redirectAction, undefined, false);
  969. }
  970. return
  971. }
  972. //Check if it is already rooted and no more parent ahead
  973. if (currentPath == ""){
  974. currentPath = "user:/";
  975. }
  976. //Print folder not found exception
  977. $("#folderList").show();
  978. $("#folderList").html(`<div class="ui basic segment">
  979. <div class="ui header themed">
  980. <i class="remove icon"></i> <span>${applocale.getString("message/folderCannotOpen","This Folder Cannot Be Opened")}</span>
  981. <div class="sub header" style="margin-top:12px;">${applocale.getString("message/folderCannotOpen/codedesc","The server return the following error message:")} <br><code>${data.error.toUpperCase()}</code><br>
  982. ${new Date().toLocaleString(undefined, {year: 'numeric', month: '2-digit', day: '2-digit', weekday:"long", hour: '2-digit', hour12: false, minute:'2-digit', second:'2-digit'})}</div>
  983. </div>
  984. </div>`);
  985. $("#fileList").hide();
  986. enableAutoRefresh = false;
  987. return;
  988. }else{
  989. enableAutoRefresh = true;
  990. //Filelist returned. Render it
  991. renderDirectory(data,function(){
  992. //Restore the selected file list
  993. $(".fileObject.item").each(function(){
  994. for (var i = 0; i < selectedFiles.length; i++){
  995. var thisFilename = selectedFiles[i];
  996. if (thisFilename == $(this).attr("filename")){
  997. $(this).addClass("selected");
  998. }
  999. }
  1000. });
  1001. //Restore the previous scroll position
  1002. $("#folderView").scrollTop(currentScrollTop);
  1003. //Perform the callback
  1004. if (callback !== undefined){
  1005. callback();
  1006. }
  1007. enableAutoRefresh = true;
  1008. });
  1009. }
  1010. },
  1011. error: function(){
  1012. enableAutoRefresh = true;
  1013. }
  1014. });
  1015. },
  1016. error: function(){
  1017. enableAutoRefresh = true;
  1018. }
  1019. });
  1020. }
  1021. function listDirectoryAndHighlight(path, filenameToHighlight = ""){
  1022. listDirectory(path, function(){
  1023. if (filenameToHighlight != ""){
  1024. //Timeout to give the DOM time to render
  1025. setTimeout(function(){
  1026. focusFileObject(filenameToHighlight);
  1027. }, 100);
  1028. }
  1029. })
  1030. }
  1031. //Render filelist --> Convert a file list object into the visable form of file list
  1032. function renderDirectory(filelist, callback=undefined){
  1033. var data = filelist;
  1034. $("#fileList").html("");
  1035. $("#folderList").html("");
  1036. //Build the css strcture of the list
  1037. if (viewMode == "list"){
  1038. }else if (viewMode == "details"){
  1039. //Append the table structure to the corrisponding elements
  1040. $("#folderList").append(`<table class="ui very basic unstackable table detailstable" style="padding-right: 2em;">
  1041. <thead>
  1042. <tr>
  1043. <th style="white-space: nowrap !important;"><span class="foldercounter"></span>${applocale.getString("view/details/folders", " Folders")}</th>
  1044. <th style="white-space: nowrap !important;">${applocale.getString("view/details/modTime", "Last Modification")}</th>
  1045. <th style="white-space: nowrap !important;">${applocale.getString("view/details/shared", "Shared")}</th>
  1046. </tr>
  1047. </thead>
  1048. <tbody class="folderDetailList detailTableContent">
  1049. </tbody>
  1050. </table>`);
  1051. $("#fileList").append(`<table class="ui very basic compact unstackable table detailstable" style="padding-right: 2em;">
  1052. <thead>
  1053. <tr>
  1054. <th><span class="filecounter"></span>${applocale.getString("view/details/files", " Files")}</th>
  1055. <th style="white-space: nowrap !important;">${applocale.getString("view/details/ext", "Extension")}</th>
  1056. <th style="white-space: nowrap !important;">${applocale.getString("view/details/size", "Filesize")}</th>
  1057. <th style="white-space: nowrap !important;">${applocale.getString("view/details/modTime", "Last Modification")}</th>
  1058. <th style="white-space: nowrap !important;">${applocale.getString("view/details/shared", "Shared")}</th>
  1059. </tr>
  1060. </thead>
  1061. <tbody class="fileDetailList detailTableContent">
  1062. </tbody>
  1063. </table>`);
  1064. }else if (viewMode == "grid"){
  1065. }
  1066. var files = [];
  1067. var folders = [];
  1068. for (var i =0; i < data.length; i++){
  1069. if (data[i].IsDir == true){
  1070. //This is folder
  1071. folders.push(data[i]);
  1072. }else{
  1073. //This is file
  1074. files.push(data[i]);
  1075. }
  1076. currentFilelist.push(JSON.parse(JSON.stringify(data[i].Filename)));
  1077. }
  1078. //Define the grid size for the interface
  1079. var gridSize = 150 ;
  1080. if (isMobile){
  1081. //Update 3/5/2021: Optimize the width calculation method to best fit
  1082. //A hack to align the divs to center of the container
  1083. $("#folderView").attr("align", "center");
  1084. $("#folderList").attr("align", "left");
  1085. $("#fileList").attr("align", "left");
  1086. //Calculate the best width to fit all the grids
  1087. var bestCount = Math.floor(parseFloat($("#folderView").width()) / parseFloat(gridSize));
  1088. var bestOffset = $("#folderView").width() % gridSize;
  1089. gridSize = gridSize + (bestOffset / bestCount) - (window.innerWidth - $("#folderView").width()) / bestCount;
  1090. }
  1091. //List all folders
  1092. for (var i =0; i < folders.length; i++){
  1093. var filename = folders[i].Filename;
  1094. var filepath = folders[i].Filepath;
  1095. var realpath = folders[i].Realpath;
  1096. var isDir = folders[i].IsDir;
  1097. var filesize = folders[i].Filesize;
  1098. var Displaysize = folders[i].Displaysize;
  1099. var isShared = folders[i].IsShared;
  1100. var modTime = folders[i].ModTime;
  1101. var ext = getExtFromPath(filepath);
  1102. //var icon = ao_module_utils.getIconFromExt(ext);
  1103. var icon = "folder";
  1104. var shareicon = "";
  1105. if (isShared == true){
  1106. shareicon = `<button class="sharebtn" onclick='handleShareFilebuttonClick(event, this);' style="margin-left: 0; height: 16px;">
  1107. <i class='share alternate icon'></i>
  1108. </button>`
  1109. }
  1110. if (viewMode == "list"){
  1111. var textclass = "normal object";
  1112. var displayName = filename;
  1113. try{
  1114. //Try to decode it using ArozOS Beta naming scheme
  1115. if (enableBetaFilename && ao_module_codec.decodeHexFoldername(displayName) != displayName){
  1116. displayName = ao_module_codec.decodeHexFoldername(displayName, false);
  1117. textclass = "hex foldername";
  1118. }
  1119. }catch(ex){
  1120. //Codec decode failed. Fallback to default name
  1121. }
  1122. $("#folderList").append(`<div class="fileObject item" draggable="true" ondragstart="onFileObjectDragStart(this,event);" ondrop="dropToFolder(event)" ondragover="allowDrop(event)" fileID="${i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event,true);" type="folder">
  1123. <span style="display:inline-block !important;word-break: break-all; width:100%;" class="${textclass}">
  1124. <i class="${icon} icon" style="margin-right:12px; color:#eab54e;"></i> <span class="filename">${displayName}</span> ${shareicon}
  1125. </span></div>`);
  1126. }else if (viewMode == "grid"){
  1127. var displayName = JSON.parse(JSON.stringify(filename));
  1128. var textclass = "normal object";
  1129. try{
  1130. //Try to decode it using ArozOS Beta naming scheme
  1131. if (enableBetaFilename && ao_module_codec.decodeHexFoldername(displayName) != displayName){
  1132. displayName = ao_module_codec.decodeHexFoldername(displayName, false);
  1133. textclass = "hex foldername";
  1134. }
  1135. }catch(ex){
  1136. //Codec decode failed. Fallback to default name
  1137. }
  1138. if (displayName.length > 16){
  1139. displayName = displayName.substring(0,16) + "...";
  1140. }
  1141. $("#folderList").append(`
  1142. <div class="fileObject card" draggable="true" ondragstart="onFileObjectDragStart(this,event);" ondrop="dropToFolder(event)" ondragover="allowDrop(event)" fileID="${i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event,true);" type="folder" style="width:${gridSize}px; display:inline-block !important;vertical-align:top; height:15em; margin-top:0px !important; overflow:hidden;">
  1143. <div class="image" style="text-align: center;">
  1144. <img draggable="true"ondragstart="disableDrag(event);" src="../../img/desktop/files_icon/${filesIconTheme}/folder.png" style="height: 148px; width: 148px; display: inline-block;">
  1145. <div class="shareOverlay ${isShared?"visible":""}">${shareicon}</div>
  1146. </div>
  1147. <div class="content" style="font-size: 12px;">
  1148. <div class="header ${textclass} filename" title="${filename}">${displayName}</div>
  1149. </div>
  1150. </div>`);
  1151. }else if (viewMode == "details"){
  1152. let isSharedIcon = '<i class="ui grey remove icon" style="margin-left: 6px;"></i>';
  1153. if (isShared){
  1154. isSharedIcon = shareicon;
  1155. }
  1156. //Convert the unix timestamp to datetime
  1157. var date = new Date(modTime * 1000);
  1158. $("#folderList").find(".folderDetailList").append(`<tr class="fileObject details" draggable="true" ondragstart="onFileObjectDragStart(this,event);" ondrop="dropToFolder(event)" ondragover="allowDrop(event)" fileID="${i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event,true);" type="folder">
  1159. <td style="word-break: break-all; text-overflow: ellipsis !important; min-width: 250px;"><i class="${icon} icon" style="margin-right:12px; color:#eab54e;"></i> <span class="filename">${filename}</span></td>
  1160. <td class="light-text">${date.toLocaleDateString("default") + " " + date.toLocaleTimeString("default")}</td>
  1161. <td>${isSharedIcon}</td>
  1162. </tr>`);
  1163. }
  1164. }
  1165. if (folders.length == 0){
  1166. $("#folderList").hide();
  1167. }else{
  1168. $("#folderList").show();
  1169. }
  1170. //List all files
  1171. let fl = folders.length; //DO NOT REMOVE THIS
  1172. for (var i =0; i < files.length; i++){
  1173. var filename = files[i].Filename;
  1174. var filepath = files[i].Filepath;
  1175. var realpath = files[i].Realpath;
  1176. var filesize = files[i].Filesize;
  1177. var Displaysize = files[i].Displaysize;
  1178. var isShared = files[i].IsShared;
  1179. var modTime = files[i].ModTime;
  1180. var ext = getExtFromPath(filepath);
  1181. var icon = "file outline";
  1182. if (ext == ""){
  1183. icon = "file outline";
  1184. }else if (ext == "shortcut"){
  1185. //Use the default shortcut icon
  1186. icon = ao_module_utils.getIconFromExt(ext);
  1187. //Check if the shortcut object exists
  1188. if (files[i].Shortcut != undefined && files[i].Shortcut != null){
  1189. icon = files[i].Shortcut.Icon;
  1190. }
  1191. }else{
  1192. icon = ao_module_utils.getIconFromExt(ext);
  1193. }
  1194. var shareicon = "";
  1195. if (isShared){
  1196. shareicon = `<button class="sharebtn" onclick='handleShareFilebuttonClick(event, this);' style="margin-left: 0px; height: 16px;">
  1197. <i class='share alternate icon'></i>
  1198. </button>`
  1199. }
  1200. var fileType = "file";
  1201. if (ext == "shortcut"){
  1202. fileType = "shortcut";
  1203. }
  1204. if (viewMode == "list"){
  1205. var displayName = filename;
  1206. var textclass = "normal object";
  1207. if (ext == "shortcut"){
  1208. //This is a shortcut file
  1209. displayName = files[i].Shortcut.Name;
  1210. //Adjust the icon based on its shortcut ype
  1211. switch(files[i].Shortcut.Type){
  1212. case "folder":
  1213. icon = "blue folder";
  1214. break;
  1215. case "module":
  1216. icon = "blue play circle";
  1217. break;
  1218. default:
  1219. icon = "external";
  1220. }
  1221. }
  1222. if (enableBetaFilename){
  1223. decodedName = ao_module_codec.decodeUmFilename(displayName);
  1224. if (decodedName != displayName){
  1225. displayName = decodedName;
  1226. textclass = "um filename";
  1227. }
  1228. filename = ao_module_codec.decodeUmFilename(filename);
  1229. }
  1230. $("#fileList").append(`<div class="fileObject item" draggable="true" ondragstart="onFileObjectDragStart(this,event);" fileID="${fl + i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event, true);" type="${fileType}" filesize="${filesize}" displaysize="${Displaysize}">
  1231. <span style="display:inline-block !important;word-break: break-all;text-overflow: ellipsis !important;overflow: hidden;" class="${textclass}">
  1232. <i class="${icon} icon" style="margin-right:12px;"></i>
  1233. <span class="filename">${displayName}</span> ${shareicon}
  1234. </span>
  1235. </div>`);
  1236. }else if (viewMode == "grid"){
  1237. //Update the icon path depends on the type of file
  1238. var imagePath = "../../img/desktop/files_icon/" + filesIconTheme + "/" + icon + ".png";
  1239. //Use module-registered icon for proprietary/unrecognised extensions
  1240. if (icon === "file outline" && extIconRegistry[ext]) {
  1241. imagePath = "../../" + extIconRegistry[ext];
  1242. }
  1243. var displayName = JSON.parse(JSON.stringify(filename));
  1244. if (ext == "shortcut"){
  1245. //This is a shortcut file. Treat it specially
  1246. if (icon.includes("http://") || icon.includes("https://")){
  1247. //Direct path. Do not add relative prefix
  1248. imagePath = icon;
  1249. }else{
  1250. imagePath = "../../" + icon;
  1251. }
  1252. displayName = files[i].Shortcut.Name;
  1253. ext = files[i].Shortcut.Type;
  1254. ext = ext.charAt(0).toUpperCase() + ext.slice(1);
  1255. }else{
  1256. ext = "." + ext;
  1257. }
  1258. var textclass = "normal object";
  1259. if (enableBetaFilename){
  1260. decodedName = ao_module_codec.decodeUmFilename(displayName);
  1261. if (decodedName != displayName){
  1262. textclass = "um filename";
  1263. displayName = decodedName;
  1264. }
  1265. filename = ao_module_codec.decodeUmFilename(filename);
  1266. }
  1267. if (displayName.length > 20){
  1268. displayName = displayName.substring(0,20) + "...";
  1269. }
  1270. $("#fileList").append(`
  1271. <div class="fileObject card" draggable="true" ondragstart="onFileObjectDragStart(this,event);" fileID="${fl + i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event);" type="${fileType}" style="width:${gridSize}px; display:inline-block !important;vertical-align:top; height:20em; margin-top:0px !important; overflow:hidden;">
  1272. <div class="image" style="text-align: center !important;">
  1273. <img draggable="true"ondragstart="disableDrag(event);" style="height: 148px; width: 148px; display:inline-block;" src="${imagePath}">
  1274. <div class="shareOverlay ${isShared?"visible":""}">${shareicon}</div>
  1275. </div>
  1276. <div class="content">
  1277. <div class="header ${textclass}" title="${filename}" style="text-overflow: ellipsis; font-size: 100%"><span class="filename">${displayName}</span></div>
  1278. <div class="meta">
  1279. <div>${ext}</div>
  1280. </div>
  1281. <div class="description">
  1282. ${Displaysize}
  1283. </div>
  1284. </div>
  1285. </div>
  1286. `);
  1287. }else if (viewMode == "details"){
  1288. if (ext == "shortcut"){
  1289. //This is a shortcut file
  1290. displayName = files[i].Shortcut.Name;
  1291. //Adjust the icon based on its shortcut ype
  1292. switch(files[i].Shortcut.Type){
  1293. case "folder":
  1294. icon = "blue folder";
  1295. break;
  1296. case "module":
  1297. icon = "blue play circle";
  1298. break;
  1299. default:
  1300. icon = "blue external";
  1301. }
  1302. }
  1303. let isSharedIcon = '<i class="ui grey remove icon" style="margin-left: 4px;"></i>';
  1304. if (isShared){
  1305. isSharedIcon = shareicon;
  1306. }
  1307. var date = new Date(modTime * 1000);
  1308. $("#fileList").find(".fileDetailList").append(`<tr class="fileObject details" draggable="true" ondragstart="onFileObjectDragStart(this,event);" ondrop="dropToFolder(event)" ondragover="allowDrop(event)" fileID="${fl + i}" filename="${filename}" filepath="${filepath}" ondblclick="openthis(this,event,true);" type="file">
  1309. <td style="word-break: break-all; text-overflow: ellipsis !important; min-width: 250px;"><i class="${icon} icon" style="margin-right:12px;"></i> <span class="filename">${filename}</span></td>
  1310. <td class="light-text">${ext}</td>
  1311. <td class="light-text">${Displaysize}</td>
  1312. <td class="light-text">${date.toLocaleDateString("default") + " " + date.toLocaleTimeString("default")}</td>
  1313. <td>${isSharedIcon}</td>
  1314. </tr>`);
  1315. }
  1316. }
  1317. if (files.length == 0){
  1318. $("#fileList").hide();
  1319. }else{
  1320. $("#fileList").show();
  1321. }
  1322. bindFileObjectEvents();
  1323. currentFilelist.sort();
  1324. //Update the filelist hash
  1325. enableAutoRefresh = false;
  1326. getDirHash(function(hash){
  1327. currentPathHash = hash;
  1328. enableAutoRefresh = true;
  1329. });
  1330. //Finish up the rendering
  1331. if (viewMode == "list"){
  1332. }else if (viewMode == "details"){
  1333. //Load the statistic of the folder details
  1334. $("#folderList").find(".foldercounter").text(folders.length);
  1335. $("#fileList").find(".filecounter").text(files.length);
  1336. }else if (viewMode == "grid"){
  1337. //If viewmode is grid, load file thumbnails
  1338. startThumbnailLoader();
  1339. }
  1340. //Update the no. of items in the viewport
  1341. updateSelectedObjectsCount();
  1342. if (callback !== undefined){
  1343. callback();
  1344. }
  1345. }
  1346. function startThumbnailLoader(){
  1347. let path = currentPath;
  1348. let protocol = "wss://";
  1349. if (location.protocol !== 'https:') {
  1350. protocol = "ws://";
  1351. }
  1352. var port = window.location.port;
  1353. if (window.location.port == ""){
  1354. if (location.protocol !== 'https:') {
  1355. port = "80";
  1356. }else{
  1357. port = "443";
  1358. }
  1359. }
  1360. thumbRenderWebSocket = new WebSocket(protocol + window.location.hostname + ":" + port + "/system/file_system/handleCacheRender?folder=" + encodeURIComponent(path));
  1361. thumbRenderWebSocket.onopen = function(e) {
  1362. };
  1363. thumbRenderWebSocket.onmessage = function(event) {
  1364. //Find the correct file in the current directory and place its image
  1365. if (path == currentPath){
  1366. var thumbData = JSON.parse(event.data);
  1367. $(".fileObject").each(function(){
  1368. if (thumbData[1].length > 0){
  1369. //Extract image type from base64
  1370. let ext = getThumbnailExtensionFromBase64String(thumbData[1]);
  1371. //Put the image data to image element
  1372. if ($(this).attr("filename") == thumbData[0]){
  1373. $(this).find("img").attr("src","data:image/" + ext + ";base64," + thumbData[1]);
  1374. }
  1375. }
  1376. });
  1377. }
  1378. };
  1379. thumbRenderWebSocket.onclose = function(event) {
  1380. //Transfer ended
  1381. };
  1382. thumbRenderWebSocket.onerror = function(error) {
  1383. //Cache render on websocket failed. Fallback to AJAX request
  1384. console.log("Cannot connect to WebSocket cache renderer. Falling back to AJAX request");
  1385. startFallbackThumbnailLoader();
  1386. };
  1387. }
  1388. function getThumbnailExtensionFromBase64String(base64String){
  1389. let ext = "jpg";
  1390. if (typeof base64String === 'string' || base64String instanceof String){
  1391. let tid = base64String.charAt(0);
  1392. if (tid == "i"){
  1393. ext = "png";
  1394. }else if (tid == "R"){
  1395. ext = "gif";
  1396. }else if (tid == "U"){
  1397. ext = "webp";
  1398. }
  1399. }else{
  1400. //Not string
  1401. }
  1402. return ext;
  1403. }
  1404. function startFallbackThumbnailLoader(){
  1405. let startingCurrentDir = currentPath;
  1406. let fallbackRenderList = [];
  1407. $(".fileObject").each(function(){
  1408. let filepath = $(this).attr("filepath");
  1409. let targetDOM = $(this);
  1410. if ($(this).attr("type") != "folder"){
  1411. fallbackRenderList.push([filepath, targetDOM]);
  1412. }
  1413. });
  1414. doThumbnailSequentialLoading(startingCurrentDir, fallbackRenderList, 0);
  1415. }
  1416. function doThumbnailSequentialLoading(startingCurrentDir, renderlist, index){
  1417. if (renderlist[index] == undefined){
  1418. //Starting index out of range
  1419. return;
  1420. }
  1421. let filepath = renderlist[index][0];
  1422. let targetDOM = renderlist[index][1];
  1423. $.ajax({
  1424. url: "../../system/file_system/loadThumbnail",
  1425. data: {vpath: filepath},
  1426. success: function(data){
  1427. if (startingCurrentDir == currentPath){
  1428. //User still not changed page
  1429. let ext = getThumbnailExtensionFromBase64String(data);
  1430. if (data.error == undefined && typeof data != "undefined" && data != ""){
  1431. $(targetDOM).find("img").attr("src","data:image/" + ext + ";base64," + data);
  1432. }
  1433. if (index + 1 < renderlist.length){
  1434. doThumbnailSequentialLoading(startingCurrentDir, renderlist, index + 1);
  1435. }
  1436. }else{
  1437. //User changed page. End the sequence
  1438. }
  1439. }
  1440. });
  1441. }
  1442. //Make an div not draggable
  1443. function disableDrag(event){
  1444. event.preventDefault();
  1445. event.stopPropagation();
  1446. }
  1447. //Make fileObject draggable
  1448. function onFileObjectDragStart(object, event){
  1449. if ((ctrlHold) && $(object).hasClass("selected") == false){
  1450. $(object).addClass("selected");
  1451. }else if ($(object).hasClass("selected") == false){
  1452. $(".fileObject.selected").removeClass("selected");
  1453. $(object).addClass("selected");
  1454. }
  1455. var fileList = [];
  1456. $(".selected.fileObject").each(function(){
  1457. var filename = $(this).attr('filename');
  1458. var filepath = $(this).attr('filepath');
  1459. var sourceSystemUUID = systemUUID;
  1460. //Extra information is passed in due to the need for cross cluster communication in the future
  1461. fileList.push({
  1462. filename: filename,
  1463. filepath: filepath,
  1464. hostUUID: sourceSystemUUID
  1465. });
  1466. });
  1467. event.dataTransfer.setData("filedata", JSON.stringify(fileList));
  1468. }
  1469. //Bind onclicke events for fileObjects
  1470. var lastClickedFileID = 0;
  1471. function bindFileObjectEvents(){
  1472. $(".fileObject").off("click").on("click",function(evt){
  1473. if (isMobile){
  1474. //There are no context menu in mobile
  1475. //Stop event propagation to document.click event
  1476. evt.stopImmediatePropagation();
  1477. }
  1478. if (renameMode && $(this).find(".renameinput").length == 0){
  1479. exitRenameModeWithConfirm();
  1480. return;
  1481. }else if (renameMode){
  1482. //Stop the click event propagating to the #fileViewer on-click exit event
  1483. evt.stopImmediatePropagation();
  1484. }
  1485. if (ctrlHold == true){
  1486. if ($(this).hasClass("selected")){
  1487. $(this).removeClass("selected");
  1488. //if there are no more selected files on the page
  1489. //exit multi-select mode
  1490. if ($(".fileObject.selected").length == 0){
  1491. exitMultiSelectMode();
  1492. }
  1493. }else{
  1494. $(this).addClass("selected");
  1495. if (propertiesView){
  1496. let filepath = $(this).attr("filepath");
  1497. loadFileProperties(filepath);
  1498. }
  1499. }
  1500. lastClickedFileID = parseInt($(this).attr("fileid"));
  1501. }else if (shiftHold == true){
  1502. //Select everything in range lastClicked to this
  1503. var thisFileID = $(this).attr("fileid");
  1504. let start = parseInt(thisFileID);
  1505. let end = parseInt(lastClickedFileID);
  1506. if (start > end){
  1507. start = parseInt(lastClickedFileID);
  1508. end = parseInt(thisFileID);
  1509. }
  1510. //Select all fileObject in range.
  1511. $(".fileObject").each(function(){
  1512. let currentItemFileID = $(this).attr('fileid');
  1513. currentItemFileID = currentItemFileID - 0;
  1514. if (currentItemFileID >= start && currentItemFileID <= end){
  1515. $(this).addClass("selected");
  1516. }
  1517. });
  1518. }else if(!ctrlHold && isMobile){
  1519. //If on mobile, click means open (only on not muilti selection mode)
  1520. evt.preventDefault();
  1521. evt.stopImmediatePropagation();
  1522. openthis(this,evt);
  1523. //Deselect everything if in multi-select mode
  1524. if (ctrlHold){
  1525. ctrlHold = false;
  1526. updateCtrlDisplay();
  1527. }
  1528. return
  1529. }else{
  1530. //Nothing is pressed. Deselect everything and add this only
  1531. $(".fileObject.selected").removeClass("selected");
  1532. $(this).addClass("selected");
  1533. lastClickedFileID = $(this).attr("fileID");
  1534. if (propertiesView){
  1535. loadFileProperties($(this).attr("filepath"));
  1536. }
  1537. }
  1538. updateSelectedObjectsCount();
  1539. });
  1540. //Bind right click select on items
  1541. $(".fileObject").off("mousedown").on("mousedown",function(evt){
  1542. if (evt.which == 3){
  1543. //Right click on this file
  1544. if ($(this).hasClass('selected') == false){
  1545. $(".fileObject.selected").removeClass("selected");
  1546. $(this).addClass("selected");
  1547. }
  1548. }
  1549. });
  1550. //This function calculate and offset the context menu to not go out of the window area
  1551. function calculateContextMenuOffsets(evt){
  1552. var defaultLeftPost = evt.pageX + "px";
  1553. var defaultTopPost =evt.pageY + "px";
  1554. if (evt.pageX > window.innerWidth / 2){
  1555. defaultLeftPost = evt.pageX - $("#contextmenu").width();
  1556. if (defaultLeftPost < 0){
  1557. //over the left boundary
  1558. defaultLeftPost = 0;
  1559. }
  1560. defaultLeftPost = defaultLeftPost + "px";
  1561. }else{
  1562. if (evt.pageX + $("#contextmenu").width() > window.innerWidth){
  1563. //Over the right boundary
  1564. defaultLeftPost = window.innerWidth - $("#contextmenu").width();
  1565. defaultLeftPost = defaultLeftPost + "px";
  1566. }
  1567. }
  1568. if (evt.pageY > window.innerHeight / 2){
  1569. defaultTopPost = evt.pageY - $("#contextmenu").height();
  1570. if (defaultTopPost < 0){
  1571. //over the top boundary
  1572. defaultTopPost = 0;
  1573. }
  1574. defaultTopPost = defaultTopPost + "px"
  1575. }else{
  1576. if (evt.pageY + $("#contextmenu").height() > window.innerHeight){
  1577. //Over the lower boundary
  1578. defaultTopPost = window.innerHeight - $("#contextmenu").height();
  1579. defaultTopPost = defaultTopPost + "px"
  1580. }
  1581. }
  1582. $("#contextmenu").css({
  1583. left: defaultLeftPost,
  1584. top: defaultTopPost
  1585. });
  1586. }
  1587. //Rightclick on a file object
  1588. $(".fileObject").off("contextmenu").on("contextmenu", function(evt){
  1589. evt.preventDefault();
  1590. if (isMobile){
  1591. //Firefox Mobile. Fix select with context menu not working bug
  1592. var selectedObject = $(evt.target);
  1593. if ($(selectedObject).hasClass("fileObject")){
  1594. if (!ctrlHold){
  1595. $(".fileObject.selected").removeClass("selected");
  1596. }
  1597. $(selectedObject).addClass("selected");
  1598. }else{
  1599. //Uptrace 5 layers for fileObject
  1600. for (var i = 0; i < 5; i++){
  1601. if ($(selectedObject).hasClass("fileObject") == false){
  1602. selectedObject = $(selectedObject).parent();
  1603. }else{
  1604. break;
  1605. }
  1606. }
  1607. if (!ctrlHold){
  1608. $(".fileObject.selected").removeClass("selected");
  1609. }
  1610. $(selectedObject).addClass("selected");
  1611. }
  1612. if (propertiesView){
  1613. let filepath = $(selectedObject).attr("filepath");
  1614. loadFileProperties(filepath);
  1615. }
  1616. //Enable multi-select mode
  1617. ctrlHold = true;
  1618. updateCtrlDisplay();
  1619. return;
  1620. }
  1621. //Show all options by defaults
  1622. $("#contextmenu").find(".item").show();
  1623. $("#contextmenu").find(".vroothide").show();
  1624. $("#contextmenu").find(".noSelectionOnly").hide();
  1625. $("#contextmenu").find(".vrootonly").hide();
  1626. $("#contextmenu").find(".zipFileOnly").hide();
  1627. //Hide general menu options for single / multiple
  1628. if ($(".fileObject.selected").length > 1){
  1629. //Multiple object selected
  1630. $(".singleObjectOnly").addClass("disabled");
  1631. $(".singleObjectOnlyHide").hide();
  1632. console.log("Hiding");
  1633. }else{
  1634. //Single object
  1635. $(".singleObjectOnly").removeClass("disabled");
  1636. $(".singleObjectOnlyHide").show();
  1637. }
  1638. //Check if this is folder or file. Replace the suitable selections
  1639. if ($(this).attr("type") == "folder"){
  1640. //Use folder mode
  1641. $("#contextmenu").find(".folderonly").show();
  1642. $("#contextmenu").find(".fileonly").hide();
  1643. }else{
  1644. //Use file mode
  1645. $("#contextmenu").find(".folderonly").hide();
  1646. $("#contextmenu").find(".fileonly").show();
  1647. }
  1648. console.log($(this).attr("type"));
  1649. if (searchMode == true){
  1650. $("#contextmenu").find(".shareonly").show();
  1651. }else{
  1652. $("#contextmenu").find(".shareonly").hide();
  1653. }
  1654. $("#contextmenu").addClass("visible");
  1655. //Handle CSS offset of the contextmenu
  1656. if ($("#contextmenu").offset().top < 0){
  1657. $("#contextmenu").css("top","0px");
  1658. }else if($("#contextmenu").offset().top + $("#contextmenu").height() > window.innerHeight){
  1659. $("#contextmenu").css("top",window.innerHeight - $("#contextmenu").height() + "px");
  1660. }
  1661. if (isMobile){
  1662. $("#contextmenu").find(".mobileonly").show();
  1663. }else{
  1664. $("#contextmenu").find(".mobileonly").hide();
  1665. }
  1666. $(".fileObject.selected").each(function(){
  1667. if ($(this).attr("filename").split(".").pop().toLowerCase() == "zip"){
  1668. $(".zipFileOnly").show();
  1669. }
  1670. });
  1671. calculateContextMenuOffsets(evt);
  1672. //Disable scroll on folderView
  1673. //$("#folderView").addClass("fixscroll");
  1674. });
  1675. //Right click on empty space of the file selector
  1676. $("#folderView").off("contextmenu").on("contextmenu", function(e){
  1677. if ($(e.target).attr("id") == "folderView" || $(e.target).attr("id") == "fileList" || $(e.target).attr("id") == "folderList" || $(e.target).is("table") || $(e.target).is("th")){
  1678. //Context menu on the empty space of the folder / file list
  1679. e.preventDefault();
  1680. $("#contextmenu").find(".item").hide();
  1681. $("#contextmenu").find(".noSelectionOnly").show();
  1682. $("#contextmenu").find(".allowNoSelection").show();
  1683. $("#contextmenu").find(".vroothide").show();
  1684. $("#contextmenu").find(".zipFileOnly").hide();
  1685. //Calculate the position of the context menu
  1686. calculateContextMenuOffsets(e);
  1687. //Show context menu
  1688. $("#contextmenu").addClass("visible");
  1689. //Handle CSS offset of the contextmenu
  1690. if ($("#contextmenu").offset().top < 0){
  1691. $("#contextmenu").css("top","0px");
  1692. }else if($("#contextmenu").offset().top + $("#contextmenu").height() > window.innerHeight){
  1693. $("#contextmenu").css("top",window.innerHeight - $("#contextmenu").height() + "px");
  1694. }
  1695. //Disable scroll on folderView
  1696. //$("#folderView").addClass("fixscroll");
  1697. }
  1698. });
  1699. //Handle right click on storage roots
  1700. $("#storageroot").off("contextmenu").on("contextmenu", function(e){
  1701. if ($(e.target).is("i")){
  1702. e.target = e.target.parentElement;
  1703. }
  1704. $("#storageroot").find(".dir.item").each(function(){
  1705. if ($(this).attr("rootname") != undefined){
  1706. $(this).removeClass("active");
  1707. }
  1708. });
  1709. if ($(e.target).attr("rootname") != undefined){
  1710. //Correct one. Show vroot functions
  1711. e.preventDefault();
  1712. var rootname = $(e.target).attr("rootname");
  1713. $(e.target).addClass("active");
  1714. $("#contextmenu").find(".item").hide();
  1715. $("#contextmenu").find(".vroothide").hide();
  1716. $("#contextmenu").find(".vrootonly").show();
  1717. //Show context menu
  1718. calculateContextMenuOffsets(e);
  1719. $("#contextmenu").addClass("visible");
  1720. //Handle CSS offset of the contextmenu
  1721. if ($("#contextmenu").offset().top < 0){
  1722. $("#contextmenu").css("top","0px");
  1723. }else if($("#contextmenu").offset().top + $("#contextmenu").height() > window.innerHeight){
  1724. $("#contextmenu").css("top",window.innerHeight - $("#contextmenu").height() + "px");
  1725. }
  1726. }
  1727. });
  1728. $(document).on("click",function(evt){
  1729. $(".contextmenu").removeClass("visible");
  1730. //Record what has been clicked
  1731. lastClickedElement = evt.target;
  1732. //Enable scroll on folderView
  1733. //$("#folderView").removeClass("fixscroll");
  1734. });
  1735. }
  1736. //Update the selected items display count
  1737. function updateSelectedObjectsCount(){
  1738. $("#selectInfo").text($(".fileObject").length + applocale.getString("tooltip/filecount", " items") + " / " + $(".fileObject.selected").length + applocale.getString("tooltip/selectedcount", " selected"));
  1739. }
  1740. //Change the current view mode
  1741. function changeViewMode(object){
  1742. var targetMode = $(object).attr("mode");
  1743. viewMode = targetMode;
  1744. refreshList(undefined, true);
  1745. updateViewmodeButtons();
  1746. setPreference("file_explorer/listmode",targetMode)
  1747. }
  1748. //Toggle properties view
  1749. //Setting will be save to this browser only
  1750. function togglePropertiesView(object){
  1751. propertiesView = !propertiesView;
  1752. if (propertiesView){
  1753. $("#propertiesView").show();
  1754. $(object).addClass('active');
  1755. localStorage.setItem("file_explorer/viewProperties", "true");
  1756. if ($(".fileObject.selected").length >= 1){
  1757. //Load the file properties
  1758. let targetFile = getFileObjectFromFID(lastClickedFileID);
  1759. if (targetFile == null){
  1760. targetFile = $(".fileObject.selected")[0];
  1761. }
  1762. let filepath = $(targetFile).attr("filepath");
  1763. loadFileProperties(filepath);
  1764. }
  1765. }else{
  1766. $("#propertiesView").hide();
  1767. $(object).removeClass('active');
  1768. localStorage.setItem("file_explorer/viewProperties", "false");
  1769. }
  1770. }
  1771. function updateViewmodeButtons(){
  1772. $(".videmode").removeClass('disabled');
  1773. $(".videmode").each(function(){
  1774. if ($(this).attr("mode") == viewMode){
  1775. $(this).addClass("disabled");
  1776. }
  1777. });
  1778. }
  1779. function previosPath(){
  1780. //Remove the current directory from history
  1781. if (viewHistory.length == 0){
  1782. //This is already the first page
  1783. return;
  1784. }
  1785. var previousPath = viewHistory.pop();
  1786. listDirectory(previousPath, undefined, false);
  1787. }
  1788. function parentDir(){
  1789. //If under searchmode, parentDir go back to the currentPath
  1790. if (searchMode){
  1791. hideSearchBar();
  1792. return;
  1793. }
  1794. //Check if there are any parent dir for this path
  1795. if (checkIfParentDirExists(currentPath)){
  1796. //There are parent path. Get it from currentPath
  1797. pathInfo = currentPath.split("/");
  1798. pathInfo.pop();
  1799. var parentFolderName = pathInfo.pop();
  1800. parentPath = pathInfo.join("/") + "/"
  1801. //List the parentDir
  1802. listDirectory(parentPath, function(){
  1803. focusFileObject(parentFolderName);
  1804. });
  1805. }
  1806. }
  1807. //Move the page focus to the given fileobject
  1808. //alias: Highlight file object / filename
  1809. function focusFileObject(targetFileName){
  1810. $(".fileObject").each(function(){
  1811. if ($(this).attr("filename") == targetFileName){
  1812. scrollToFileLocation(this);
  1813. $(this).addClass("selected");
  1814. }
  1815. });
  1816. }
  1817. function scrollToFileLocation(DOMElement){
  1818. if (DOMElement === undefined || $(DOMElement).offset() == undefined){
  1819. //DOM Element no longer exists
  1820. return;
  1821. }
  1822. //Trying to vertically align the directory from its parent list
  1823. let topPos = $("#folderView").scrollTop() + $(DOMElement).offset().top - $("#folderView").height()/2 - $(DOMElement).height()/2 - 28;
  1824. window.debug = $(DOMElement);
  1825. $("#folderView").stop().animate({
  1826. scrollTop: topPos
  1827. }, 300);
  1828. }
  1829. function loadListModeFromDB(callback = undefined){
  1830. //Get list mode from storage
  1831. loadPreference("file_explorer/listmode",function(data){
  1832. if (data != "" && data.error === undefined){
  1833. viewMode = data;
  1834. updateViewmodeButtons();
  1835. }
  1836. if (callback !== undefined){
  1837. callback();
  1838. }
  1839. });
  1840. }
  1841. function rootDir(){
  1842. //Go to the root dir of the current path
  1843. var rootDir = currentPath.split("/").shift();
  1844. rootDir = rootDir + "/";
  1845. listDirectory(rootDir);
  1846. }
  1847. function showEditCurrentPathInput(e){
  1848. e.preventDefault();
  1849. e.stopImmediatePropagation();
  1850. pathInputMode = true;
  1851. $("#pathInputField").find("input").val(currentPath);
  1852. $("#editPathBtn").hide();
  1853. if (isMobile){
  1854. $("#mobilePathDisplay").hide();
  1855. $(".mobilePathDisplayWrapper").append($("#pathInputField"));
  1856. }else{
  1857. //Desktop
  1858. $("#pathDisplayField").hide();
  1859. }
  1860. $("#pathInputField").show();
  1861. $("#pathInputField").find("input").focus();
  1862. }
  1863. function handleOpenPathKeydown(e){
  1864. if (e.key == "enter" | e.keyCode == 13){
  1865. //Etner pressed
  1866. openEnteredPath($("#pathInputField").find("button"));
  1867. }
  1868. }
  1869. function openEnteredPath(object){
  1870. var newPath = $(object).parent().find("input").val();
  1871. //Filter out the path
  1872. newPath = newPath.split("\\").join("/");
  1873. listDirectory(newPath);
  1874. hideManualOpenPathInput();
  1875. }
  1876. function hideManualOpenPathInput(){
  1877. $("#pathInputField").hide();
  1878. pathInputMode = false;
  1879. if (isMobile){
  1880. $("#mobilePathDisplay").show();
  1881. }else{
  1882. $("#pathDisplayField").show();
  1883. }
  1884. //Restore the edit btn
  1885. $("#editPathBtn").show();
  1886. }
  1887. $("#folderView").on("click", function(){
  1888. if (pathInputMode){
  1889. hideManualOpenPathInput();
  1890. }
  1891. if (renameMode && $(".renameinput").length > 0){
  1892. exitRenameModeWithConfirm();
  1893. return;
  1894. }
  1895. })
  1896. function checkIfParentDirExists(path){
  1897. if (path.includes("/")){
  1898. pathInfo = path.split("/");
  1899. if (pathInfo[1] == ""){
  1900. return false;
  1901. }else{
  1902. return true;
  1903. }
  1904. }else{
  1905. return false;
  1906. }
  1907. }
  1908. function getDirHash(callback){
  1909. $.ajax({
  1910. url: "../../system/file_system/listDirHash",
  1911. data: {dir: currentPath},
  1912. success: function(data){
  1913. if (data.error !== undefined){
  1914. if (data.error == "Invalid dir given"){
  1915. //Storage has been unmounted. Back to parent
  1916. var pdir = currentPath.split("/");
  1917. pdir.pop();pdir.pop();
  1918. pdir = pdir.join("/");
  1919. currentPath = pdir;
  1920. listDirectory(currentPath, function(){
  1921. window.location.reload();
  1922. });
  1923. return;
  1924. }else if (data.error == "Unable to resolve target directory"){
  1925. //Resolve failed. Back to user:/
  1926. var pdir = currentPath.split("/");
  1927. pdir = pdir.shift() + "/";
  1928. listDirectory(pdir, function(){
  1929. window.location.reload();
  1930. });
  1931. }
  1932. }
  1933. callback(data);
  1934. }
  1935. })
  1936. }
  1937. function openHomeDir(){
  1938. listDirectory("user:/", function(){
  1939. hideManualOpenPathInput();
  1940. hideSearchBar();
  1941. })
  1942. }
  1943. //=================================== FILE OPERATIONS ========================
  1944. function refreshList(callback = undefined, keepSelectedItems = false){
  1945. if (searchMode == true){
  1946. //Refresh the search result
  1947. if ($("#searchInput").val().length > 0){
  1948. handleSearch();
  1949. }
  1950. return;
  1951. }
  1952. shiftHold = false;
  1953. if (!isMobile){
  1954. //Desktop mode only, to prevent focus out when ctrl Up
  1955. ctrlHold = false;
  1956. }
  1957. let filenameBackups = [];
  1958. if (keepSelectedItems){
  1959. //Backup all the selected filenames
  1960. $(".fileObject.selected").each(function(){
  1961. filenameBackups.push($(this).attr("filename"));
  1962. });
  1963. }
  1964. console.log(filenameBackups);
  1965. updateCtrlDisplay();
  1966. listDirectory(currentPath, function(){
  1967. if (keepSelectedItems){
  1968. $(".fileObject").each(function(){
  1969. if (filenameBackups.includes($(this).attr("filename"))){
  1970. $(this).addClass("selected");
  1971. }
  1972. });
  1973. }
  1974. if (callback != undefined){
  1975. callback();
  1976. }
  1977. });
  1978. }
  1979. function zipFile(){
  1980. $(".popup").fadeOut('fast');
  1981. var zippingFiles = [];
  1982. $(".fileObject.selected").each(function(){
  1983. var filepath = $(this).attr("filepath");
  1984. zippingFiles.push(filepath);
  1985. });
  1986. console.log(zippingFiles);
  1987. //Request to create a zip file, named with the parent dir name
  1988. var oprConfig = {
  1989. opr: "zip",
  1990. src: zippingFiles,
  1991. dest: currentPath,
  1992. overwriteMode: "overwrite",
  1993. callbackWindowID: ao_module_windowID,
  1994. callbackFunction: `callRefresh("${currentPath}")`
  1995. }
  1996. var configHash = encodeURIComponent(JSON.stringify(oprConfig));
  1997. var title = applocale.getString("opr/zip/zipping","Zipping ") + zippingFiles.length;
  1998. if (fileList.length > 1){
  1999. title += applocale.getString("opr/zip/files", " files");
  2000. }else{
  2001. title += applocale.getString("opr/zip/file"," file");
  2002. }
  2003. if (!ao_module_virtualDesktop){
  2004. window.open("file_operation.html#" + configHash);
  2005. }else{
  2006. parent.newFloatWindow({
  2007. url: "SystemAO/file_system/file_operation.html#" + configHash,
  2008. width: 400,
  2009. height: 220,
  2010. appicon: "SystemAO/file_system/img/selector.png",
  2011. title: title
  2012. });
  2013. }
  2014. }
  2015. function unzipHere(){
  2016. $(".popup").fadeOut('fast');
  2017. //Get a list of zip files selected
  2018. var unzippingFiles = [];
  2019. $(".fileObject.selected").each(function(){
  2020. var filepath = $(this).attr("filepath");
  2021. if ((filepath.split(".").pop()).toLowerCase() == "zip"){
  2022. unzippingFiles.push(filepath);
  2023. }
  2024. });
  2025. if(unzippingFiles.length == 0){
  2026. msgbox("red remove", applocale.getString("opr/zip/nozipfile", "No zip file selected"));
  2027. return;
  2028. }
  2029. //Start unzip progress
  2030. console.log(unzippingFiles);
  2031. //Unzip and open them to tmp:/
  2032. var oprConfig = {
  2033. opr: "unzip",
  2034. src: unzippingFiles,
  2035. dest: currentPath,
  2036. overwriteMode: "overwrite",
  2037. callbackWindowID: ao_module_windowID,
  2038. callbackFunction: `callRefresh("${currentPath}")`
  2039. }
  2040. //Render the dialog title name
  2041. var configHash = encodeURIComponent(JSON.stringify(oprConfig));
  2042. var title = applocale.getString("opr/zip/unzipping","Unzipping ") + unzippingFiles.length;
  2043. if (unzippingFiles.length > 1){
  2044. title += applocale.getString("opr/zip/files", " files");
  2045. }else{
  2046. title += applocale.getString("opr/zip/file"," file");
  2047. }
  2048. if (!ao_module_virtualDesktop){
  2049. window.open("file_operation.html#" + configHash);
  2050. }else{
  2051. parent.newFloatWindow({
  2052. url: "SystemAO/file_system/file_operation.html#" + configHash,
  2053. width: 400,
  2054. height: 220,
  2055. appicon: "SystemAO/file_system/img/selector.png",
  2056. title: title,
  2057. });
  2058. }
  2059. }
  2060. let renameFileObjects = [];
  2061. function rename(){
  2062. hideAllPopupWindows();
  2063. renameFileObjects = [];
  2064. var filenames = [];
  2065. $(".fileObject.selected").each(function(){
  2066. var fileObjectType = $(this).attr("type");
  2067. let fileObject = {
  2068. filename: $(this).attr('filename'),
  2069. filepath: $(this).attr("filepath"),
  2070. filetype: fileObjectType
  2071. }
  2072. renameFileObjects.push(JSON.parse(JSON.stringify(fileObject)));
  2073. filenames.push($(this).attr('filename'));
  2074. });
  2075. var oldname = "unknown file.txt";
  2076. if (renameFileObjects.length == 0){
  2077. return;
  2078. }else if (renameFileObjects.length > 0){
  2079. $("#renameBox").find(".multifileWarning").hide();
  2080. oldname = filenames[0];
  2081. }
  2082. //Override with rename input box
  2083. renameMode = true;
  2084. if (isMobile){
  2085. //Mobile rename using sidebar dialog
  2086. $("#renameBox").find(".orgfn").val(oldname);
  2087. $("#renameBox").find(".newfn").val(oldname);
  2088. showPopupWrapper();
  2089. $("#renameBox").transition('slide left in');
  2090. }else{
  2091. //Desktop rename
  2092. let rootObject = $($(".fileObject.selected")[0]);
  2093. $(rootObject).addClass("renaming");
  2094. let targetDOM = $(rootObject).find(".filename");
  2095. rootObject.attr("draggable", "false");
  2096. if (viewMode == "list"){
  2097. $(targetDOM).html(`<div class="renameinput" oldname="${encodeURIComponent(oldname)}" onkeydown="handleInputConfirmRename(this, event);" style="width: calc(100% - 5em); display: inline-block;">
  2098. <input type="text" value="${oldname}">
  2099. </div>`);
  2100. $(rootObject).find(".sharebtn").remove();
  2101. }else if (viewMode == "grid"){
  2102. $(targetDOM).html(`<div class="renameinput" oldname="${encodeURIComponent(oldname)}" onkeydown="handleInputConfirmRename(this, event);" style="width: 100%; display: inline-block;">
  2103. <input type="text" value="${oldname}">
  2104. </div>`);
  2105. }else if (viewMode == "details"){
  2106. $(targetDOM).html(`<div class="renameinput" oldname="${encodeURIComponent(oldname)}" onkeydown="handleInputConfirmRename(this, event);" style="width: calc(100% - 5em); display: inline-block;">
  2107. <input type="text" value="${oldname}">
  2108. </div>`);
  2109. }
  2110. let targetInputField = $(".renameinput").find("input")[0];
  2111. $(targetInputField).focus();
  2112. targetInputField.selectionStart = 0;
  2113. targetInputField.selectionEnd = targetInputField.value.lastIndexOf(".");
  2114. }
  2115. }
  2116. //Exit rename mode with current name in filename as new filename
  2117. //Activate from clicking elsewhere
  2118. function exitRenameModeWithConfirm(applyChange = true){
  2119. let renamingObject = $($(".renameinput")[0]);
  2120. $(".fileObject.renaming").removeClass("renaming");
  2121. let newname = renamingObject.find("input").val();
  2122. let oldname = renamingObject.attr("oldname");
  2123. oldname = decodeURIComponent(oldname);
  2124. if (oldname == newname || !applyChange){
  2125. //Cancel Rename, in cases where old name = new name or applyChange set to false
  2126. let filenameField = $(renamingObject).parent();
  2127. $(filenameField).html(oldname);
  2128. renameMode = false;
  2129. return;
  2130. }
  2131. confirmRename(oldname, newname);
  2132. }
  2133. //Handle enter press on rename input box
  2134. function handleInputConfirmRename(object, evt){
  2135. let filenameForbiddenCharKey = [
  2136. '/',
  2137. '<',
  2138. '>',
  2139. ':',
  2140. '"',
  2141. '\\',
  2142. '*'
  2143. ];
  2144. if (evt.keyCode == 13){
  2145. evt.preventDefault();
  2146. evt.stopImmediatePropagation();
  2147. let oldname = $(object).attr("oldname").trim();
  2148. let newname = $(object).find("input").val().trim();
  2149. $(".fileObject.selected.renaming").removeClass("renaming");
  2150. if (oldname == newname){
  2151. //Cancel Rename
  2152. let filenameField = $(object).parent();
  2153. $(filenameField).html(oldname);
  2154. renameMode = false;
  2155. return;
  2156. }
  2157. confirmRename(oldname, newname);
  2158. }else if (evt.keyCode == 27){
  2159. //ESC key, restore to origin
  2160. //Exit rename mode but not apply change
  2161. exitRenameModeWithConfirm(false);
  2162. }else if (filenameForbiddenCharKey.includes(evt.key)){
  2163. //Show now allow popup
  2164. evt.preventDefault();
  2165. }
  2166. }
  2167. //Check if filename contains web-unsafe characters
  2168. function filenameContainsIllegalCharacters(filename){
  2169. var illegalChars = ['/', '\\', '?', '%', '*', ':', '|', '"', '<', '>'];
  2170. for (var i = 0; i < illegalChars.length; i++){
  2171. if (filename.includes(illegalChars[i])){
  2172. return true;
  2173. }
  2174. }
  2175. return false;
  2176. }
  2177. function confirmRename(oldName=undefined, newName=undefined){
  2178. renameMode = false;
  2179. if (oldName == undefined){
  2180. oldName = $("#renameBox").find(".orgfn").val().trim();
  2181. }
  2182. if (newName == undefined){
  2183. newName = $("#renameBox").find(".newfn").val().trim();
  2184. }
  2185. //Check for illegal characters
  2186. if (filenameContainsIllegalCharacters(newName)){
  2187. msgbox("red remove", applocale.getString("message/illegalCharacters", "Filename contains illegal characters"));
  2188. return;
  2189. }
  2190. if (newName == oldName){
  2191. msgbox("red remove",applocale.getString("message/newFilenameIdentical", "New filename is identical to the original filename."));
  2192. hideAllPopupWindows();
  2193. return;
  2194. }
  2195. var newNameWithoutExt = newName;
  2196. var newnameExt = "";
  2197. if (newName.includes(".")){
  2198. tmp = newName.split(".");
  2199. newnameExt = tmp.pop();
  2200. newNameWithoutExt = tmp.join(".");
  2201. }
  2202. var counter = 0;
  2203. var srclist = [];
  2204. var newnamelist = [];
  2205. for (var i =0; i < renameFileObjects.length; i++){
  2206. var thisFilepath = renameFileObjects[i].filepath;
  2207. var thisFiletype = renameFileObjects[i].filetype;
  2208. var thisFilename = renameFileObjects[i].filename;
  2209. var newFilename = newName;
  2210. if ( i > 0){
  2211. if (thisFiletype == "file"){
  2212. var thisFileExt = thisFilename.split(".").pop();
  2213. newFilename = newNameWithoutExt + "(" + i + ")." + thisFileExt;
  2214. }else if (thisFiletype == "folder"){
  2215. newFilename = newNameWithoutExt + "(" + i + ")";
  2216. }
  2217. }
  2218. srclist.push(thisFilepath);
  2219. newnamelist.push(newFilename);
  2220. }
  2221. console.log(srclist, newnamelist);
  2222. //Send the request to serverside
  2223. requestCSRFToken(function(token){
  2224. $.ajax({
  2225. url: "../../system/file_system/fileOpr",
  2226. method: "POST",
  2227. data: {opr: "rename", src: JSON.stringify(srclist), new: JSON.stringify(newnamelist), csrft: token},
  2228. success: function(data){
  2229. if (data.error !== undefined){
  2230. msgbox("red remove",applocale.getString("message/" + data.error, data.error));
  2231. }else{
  2232. refreshList(function(){
  2233. focusFileObject(newName);
  2234. });
  2235. msgbox("checkmark",applocale.getString("message/rename/success", "Rename suceed"));
  2236. }
  2237. hideAllPopupWindows();
  2238. },
  2239. error: function(){
  2240. hideAllPopupWindows();
  2241. }
  2242. });
  2243. renameFileObjects = [];
  2244. });
  2245. }
  2246. function changeOverwriteRule(mode, doPasteAgain=false){
  2247. switch (mode){
  2248. case 0:
  2249. overwriteMode = "overwrite";
  2250. break;
  2251. case 1:
  2252. overwriteMode = "skip";
  2253. break;
  2254. case 2:
  2255. overwriteMode = "keep";
  2256. break;
  2257. default:
  2258. overwriteMode = "keep";
  2259. }
  2260. if (doPasteAgain){
  2261. //Initiate paste without checking and close the overwritemode selector
  2262. paste(undefined, true);
  2263. }
  2264. }
  2265. function copy(){
  2266. cutMode = false;
  2267. clipboard = [];
  2268. if ($(".fileObject.selected").length == 0){
  2269. return;
  2270. }
  2271. $(".fileObject.selected").each(function(){
  2272. var thisFilepath = $(this).attr("filepath");
  2273. clipboard.push(thisFilepath);
  2274. });
  2275. if (useLocalstorage){
  2276. localStorage.setItem("ao/file_system/clipboard",JSON.stringify(clipboard));
  2277. localStorage.setItem("ao/file_system/cutmode","false");
  2278. }
  2279. msgbox("copy",clipboard.length + applocale.getString("message/copy/success", " objects copied."))
  2280. }
  2281. function cut(){
  2282. cutMode = true;
  2283. clipboard = [];
  2284. if ($(".fileObject.selected").length == 0){
  2285. return;
  2286. }
  2287. $(".fileObject.selected").each(function(){
  2288. var thisFilepath = $(this).attr("filepath");
  2289. clipboard.push(thisFilepath);
  2290. });
  2291. if (useLocalstorage){
  2292. localStorage.setItem("ao/file_system/clipboard",JSON.stringify(clipboard));
  2293. localStorage.setItem("ao/file_system/cutmode","true");
  2294. }
  2295. msgbox("cut",clipboard.length + applocale.getString("message/move/success", " objects ready to be moved."))
  2296. }
  2297. function paste(redirectPasteTarget="", nocheck=false){
  2298. let thisOprCutMode = cutMode;
  2299. let fileList = clipboard;
  2300. let targetDir = currentPath;
  2301. if (redirectPasteTarget != ""){
  2302. //Allow redirection of paste target if necessary
  2303. targetDir = redirectPasteTarget;
  2304. }
  2305. if (useLocalstorage){
  2306. //There are localStorage. Always use localStorage if exists.
  2307. var crossFrameClipboard = localStorage.getItem("ao/file_system/clipboard");
  2308. var useCutMode = localStorage.getItem("ao/file_system/cutmode");
  2309. if (crossFrameClipboard !== "" && crossFrameClipboard !== undefined && crossFrameClipboard !== null){
  2310. fileList = JSON.parse(crossFrameClipboard);
  2311. }
  2312. if (useCutMode !== "" && useCutMode !== undefined && useCutMode !== null){
  2313. thisOprCutMode = (useCutMode == "true");
  2314. }
  2315. }
  2316. if (fileList.length == 0){
  2317. //There are nothing to paste
  2318. msgbox("question",applocale.getString("message/paste/nothing", "There are nothing to paste."))
  2319. return;
  2320. }
  2321. //console.log(fileList,JSON.stringify(fileList));
  2322. if (thisOprCutMode == true){
  2323. //Cut and paste
  2324. $.ajax({
  2325. type: 'POST',
  2326. url: `../../system/file_system/validateFileOpr`,
  2327. data: {src: JSON.stringify(fileList), dest: targetDir},
  2328. success: function(data){
  2329. if (!nocheck && data.length > 0){
  2330. //There are problem with the copy target. Pop up overwrite rule selector
  2331. showDuplicateHandler(data);
  2332. }else{
  2333. //OK!
  2334. //Clear clipboard settings
  2335. localStorage.setItem("ao/file_system/clipboard", "");
  2336. clipboard = "";
  2337. //Stsart operations
  2338. if (!ao_module_virtualDesktop){
  2339. //Not under desktop mode. Use direct copy API
  2340. requestCSRFToken(function(token){
  2341. $.ajax({
  2342. type: 'POST',
  2343. url: `../../system/file_system/fileOpr`,
  2344. data: {opr: "move" ,src: JSON.stringify(fileList), dest: targetDir,existsresp: overwriteMode, csrft: token},
  2345. success: function(data){
  2346. if (data.error !== undefined){
  2347. msgbox("red remove",applocale.getString("message/" + data.error, data.error));
  2348. }else{
  2349. //OK
  2350. msgbox("checkmark",fileList.length + applocale.getString("message/move/success", " objects moved."))
  2351. refreshList();
  2352. }
  2353. hideAllPopupWindows();
  2354. }
  2355. });
  2356. });
  2357. }else{
  2358. //Pass the request to operation handler
  2359. var oprConfig = {
  2360. opr: "move",
  2361. src: fileList,
  2362. dest: targetDir,
  2363. overwriteMode: overwriteMode,
  2364. callbackWindowID: ao_module_windowID,
  2365. callbackFunction: `callRefresh("${targetDir}")`
  2366. }
  2367. var configHash = encodeURIComponent(JSON.stringify(oprConfig));
  2368. var title = "Moving " + fileList.length;
  2369. if (fileList.length > 1){
  2370. title += " files";
  2371. }else{
  2372. title += " file";
  2373. }
  2374. parent.newFloatWindow({
  2375. url: "SystemAO/file_system/file_operation.html#" + configHash,
  2376. width: 400,
  2377. height: 220,
  2378. appicon: "SystemAO/file_system/img/selector.png",
  2379. title: title
  2380. });
  2381. hideAllPopupWindows();
  2382. }
  2383. }
  2384. }
  2385. });
  2386. }else{
  2387. //Copy and paste
  2388. //Check if the file list is OK for continue without the need for overwrite
  2389. $.ajax({
  2390. type: 'POST',
  2391. url: `../../system/file_system/validateFileOpr`,
  2392. data: {src: JSON.stringify(fileList), dest: targetDir},
  2393. success: function(data){
  2394. if (!nocheck && data.length > 0){
  2395. //There are problem with the copy target. Pop up overwrite rule selector
  2396. showDuplicateHandler(data);
  2397. }else{
  2398. //OK!
  2399. if (!ao_module_virtualDesktop){
  2400. requestCSRFToken(function(token){
  2401. $.ajax({
  2402. type: 'POST',
  2403. url: `../../system/file_system/fileOpr`,
  2404. data: {opr: "copy" ,src: JSON.stringify(fileList), dest: targetDir,existsresp: overwriteMode, csrft: token},
  2405. success: function(data){
  2406. if (data.error !== undefined){
  2407. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  2408. }else{
  2409. //OK
  2410. msgbox("checkmark",fileList.length + applocale.getString("message/copy/success", " objects copied."))
  2411. refreshList();
  2412. }
  2413. hideAllPopupWindows();
  2414. }
  2415. });
  2416. });
  2417. }else{
  2418. //Pass the request to operation handler
  2419. var oprConfig = {
  2420. opr: "copy",
  2421. src: fileList,
  2422. dest: targetDir,
  2423. overwriteMode: overwriteMode,
  2424. callbackWindowID: ao_module_windowID,
  2425. callbackFunction: `callRefresh("${targetDir}")`
  2426. }
  2427. var configHash = encodeURIComponent(JSON.stringify(oprConfig));
  2428. var title = "Copying " + fileList.length;
  2429. if (fileList.length > 1){
  2430. title += " files";
  2431. }else{
  2432. title += " file";
  2433. }
  2434. parent.newFloatWindow({
  2435. url: "SystemAO/file_system/file_operation.html#" + configHash,
  2436. width: 400,
  2437. height: 220,
  2438. appicon: "SystemAO/file_system/img/selector.png",
  2439. title: title
  2440. });
  2441. hideAllPopupWindows();
  2442. }
  2443. }
  2444. }
  2445. });
  2446. }
  2447. }
  2448. //Callback function for file operation display
  2449. window.callRefresh = function(targetdir){
  2450. console.log(currentPath, targetdir);
  2451. if (currentPath == targetdir){
  2452. refreshList();
  2453. }
  2454. }
  2455. //This action may duplicate files. Show handler
  2456. function showDuplicateHandler(duplicateFileList){
  2457. $(".popup").fadeOut(100);
  2458. var duplicatedFileCounts = duplicateFileList.length;
  2459. showPopupWrapper();
  2460. $("#overwriteModeSelection").transition("slide left in");
  2461. $("#overwriteModeSelection").find(".owm-fc").text(duplicatedFileCounts);
  2462. var srcpath = duplicateFileList[0];
  2463. srcpath = srcpath.split("/");
  2464. srcpath.pop();
  2465. srcpath = srcpath.join("/");
  2466. $("#overwriteModeSelection").find(".owm-srcdir").text(srcpath);
  2467. $("#overwriteModeSelection").find(".owm-destdir").text(currentPath);
  2468. }
  2469. //Force delete. Use normal delete fucntion if you want to move things to recycle bin instead.
  2470. let forceDeleteList = [];
  2471. function forceDelete(confirmed=false){
  2472. if (!confirmed){
  2473. //Show confirm box
  2474. let deletePendingList = [];
  2475. var listObject = $("#forceDeleteConfirmBox").find(".deleteFilelist")[0];
  2476. $(listObject).html("");
  2477. $(".selected.fileObject").each(function(data){
  2478. var thispath = $(this).attr("filepath");
  2479. var thisfilename = $(this).attr("filename");
  2480. var ext = thisfilename.split(".").pop();
  2481. var icon = ao_module_utils.getIconFromExt(ext);
  2482. deletePendingList.push(thispath);
  2483. $(listObject).append(`<div class="item" ><span style="display:inline-block;">${thisfilename}</span></div>`);
  2484. });
  2485. showPopupWrapper();
  2486. $("#forceDeleteConfirmBox").transition("slide left in");
  2487. forceDeleteList = deletePendingList;
  2488. }else{
  2489. //Start force delete function
  2490. let fdlistLength = forceDeleteList.length;
  2491. requestCSRFToken(function(token){
  2492. $.ajax({
  2493. url: "../../system/file_system/fileOpr",
  2494. method:"POST",
  2495. data: {opr: "delete", src: JSON.stringify(forceDeleteList), csrft: token},
  2496. success: function(data){
  2497. if (data.error !== undefined){
  2498. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  2499. }else{
  2500. refreshList();
  2501. msgbox("checkmark",fdlistLength + applocale.getString("message/remove/success", " objects removed."))
  2502. }
  2503. }
  2504. });
  2505. //Finishing up delete sequence
  2506. forceDeleteList = [];
  2507. hideAllPopupWindows();
  2508. });
  2509. }
  2510. }
  2511. let deleteFileList = [];
  2512. function deleteFile(confirmed = false){
  2513. if (!confirmed){
  2514. //Show the confirm dialog
  2515. $("#deleteConfirmBox").find(".deleteFilelist").html("");
  2516. $(".fileObject.selected").each(function(data){
  2517. var thisfilename = $(this).attr('filename');
  2518. var thisFilepath = $(this).attr('filepath');
  2519. deleteFileList.push(thisFilepath);
  2520. $("#deleteConfirmBox").find(".deleteFilelist").append(`<div class="item" ><span style="display:inline-block;">${thisfilename}</span></div>`);
  2521. });
  2522. if (deleteFileList.length == 0){
  2523. //No files selected
  2524. return;
  2525. }else{
  2526. //File selected. Continue to delete
  2527. showPopupWrapper();
  2528. $("#deleteConfirmBox").transition("slide left in");
  2529. }
  2530. }else{
  2531. //Continue to delete files
  2532. let fdlistLength = deleteFileList.length;
  2533. requestCSRFToken(function(token){
  2534. $.ajax({
  2535. url: "../../system/file_system/fileOpr",
  2536. method:"POST",
  2537. data: {opr: "recycle", src: JSON.stringify(deleteFileList), csrft: token},
  2538. success: function(data){
  2539. if (data.error !== undefined){
  2540. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  2541. }else{
  2542. refreshList();
  2543. msgbox("checkmark",fdlistLength + applocale.getString("message/recycle/success", " objects moved to trash bin."))
  2544. }
  2545. if (currentPath == "user:/"){
  2546. //Reload the User root folder list
  2547. initRootDirs();
  2548. }
  2549. }
  2550. });
  2551. console.log(deleteFileList);
  2552. deleteFileList = [];
  2553. hideAllPopupWindows();
  2554. });
  2555. }
  2556. }
  2557. function cancelDelete(){
  2558. deleteFileList=[];
  2559. hideAllPopupWindows();
  2560. }
  2561. function cancelForceDelete(){
  2562. forceDeleteList = [];
  2563. hideAllPopupWindows();
  2564. }
  2565. function createDesktopShortcut(){
  2566. let folders = [];
  2567. let filenames = [];
  2568. if ($(".fileObject.selected").length == 0){
  2569. return;
  2570. }
  2571. $(".fileObject.selected").each(function(){
  2572. var thisFilepath = $(this).attr("filepath");
  2573. var thisFilename = $(this).attr("filename");
  2574. if($(this).attr("type") == "folder"){
  2575. folders.push(thisFilepath);
  2576. filenames.push(thisFilename);
  2577. }
  2578. });
  2579. let targetFolder = folders[0];
  2580. let targetFilename = filenames[0];
  2581. $.ajax({
  2582. url: "../../system/desktop/createShortcut",
  2583. method: "POST",
  2584. data: {
  2585. stype: "folder",
  2586. stext: targetFilename,
  2587. spath: targetFolder,
  2588. sicon: "img/system/folder-shortcut.png",
  2589. sdest: "user:/Desktop/",
  2590. },
  2591. success: function(data){
  2592. if (data.error !== undefined){
  2593. console.log("[File Manager] Shortcut creation failed: ", data.error)
  2594. msgbox("red remove",applocale.getString("opr/shortcut/error", "Shortcut creation failed. See console for more information.") , 3000);
  2595. }else{
  2596. msgbox("checkmark", applocale.getString("opr/shortcut/ok", "Shortcut created successfully"), 3000);
  2597. if (ao_module_virtualDesktop){
  2598. parent.refresh();
  2599. }
  2600. }
  2601. }
  2602. })
  2603. }
  2604. function upload(){
  2605. var input = document.createElement('input');
  2606. input.type = 'file';
  2607. input.multiple = true;
  2608. input.onchange = e => {
  2609. var files = e.target.files;
  2610. msgbox("upload",applocale.getString("message/upload/started", "Upload Started"));
  2611. for (var i = 0; i < files.length; i++){
  2612. uploadFile(files[i]);
  2613. }
  2614. }
  2615. input.click();
  2616. }
  2617. function updatePathDisplay(path){
  2618. var pathInfo = path.split("/");
  2619. var vdID = pathInfo[0];
  2620. //As path always end with /, pop the empty pathinfo from array
  2621. pathInfo.pop();
  2622. var l = pathInfo.length;
  2623. //Append the starting vdir
  2624. $(".pathDisplay").html("");
  2625. $(".pathDisplay").append(`<div class="section selectable" onclick="event.stopImmediatePropagation(); rootDir();"><i class="folder icon"></i> ${vdID}</div>`);
  2626. $(".pathDisplay").append(`<div class="divider">/</div>`);
  2627. //console.log(pathInfo);
  2628. let domPathChunks = [];
  2629. let thisPath = vdID + "/";
  2630. for(var i = 1; i < pathInfo.length; i++){
  2631. let thisname = pathInfo[i];
  2632. thisPath += thisname + "/";
  2633. let pathHighlight = "";
  2634. if (i < pathInfo.length - 1){
  2635. pathHighlight = pathInfo[i + 1];
  2636. }
  2637. domPathChunks.push(`<div class="section selectable" onclick="event.stopImmediatePropagation(); listDirectoryAndHighlight('${thisPath}', '${pathHighlight}');">${shortenLongFoldername(thisname, 20)}</div>`);
  2638. }
  2639. let fullpath = domPathChunks.join(`<div class="divider">/</div>`);
  2640. let targetDisplayDOM = $("#pathDisplayField");
  2641. if (isMobile){
  2642. targetDisplayDOM = $("#mobilePathDisplay");
  2643. }
  2644. $(targetDisplayDOM).append(`<div id="pre-render" class="measure">${fullpath}</div>`);
  2645. let pathWidth = $("#pre-render").width();
  2646. let pathFieldWidth = $(targetDisplayDOM).width();
  2647. let counter = 0;
  2648. //Check for a combination that just fit the path bar
  2649. while(pathWidth > (pathFieldWidth - 80) && counter < l-2){
  2650. //Drop the first segment, only keep last one in extreme cases
  2651. console.log(counter, l);
  2652. domPathChunks.shift();
  2653. fullpath = `<div class="section">...</div><div class="divider">/</div>` + domPathChunks.join(`<div class="divider">/</div>`);
  2654. $("#pre-render").html(fullpath);
  2655. pathWidth = $("#pre-render").width();
  2656. counter++;
  2657. }
  2658. //Render the final address into a visiable field
  2659. $("#pre-render").remove();
  2660. $(targetDisplayDOM).append(fullpath);
  2661. //Update the manual input field as well
  2662. $("#pathInputField").find("input").val(path);
  2663. }
  2664. function shortenLongFoldername(name, maxchar = 20){
  2665. var resultname = name;
  2666. if (name.length > maxchar){
  2667. //Shorten it
  2668. var offset = parseInt((maxchar - 2) / 2);
  2669. resultname = name.substr(0, offset) + "..." + name.substr(name.length - offset)
  2670. }
  2671. return resultname
  2672. }
  2673. function getExtFromPath(path){
  2674. if (path.includes(".") == false){
  2675. return "";
  2676. }
  2677. return path.split(".").pop();
  2678. }
  2679. function getFileObjectFromFID(fid){
  2680. var targetFileObject = null;
  2681. $(".fileObject").each(function(){
  2682. if ($(this).attr("fileid") == fid){
  2683. targetFileObject = $(this);
  2684. }
  2685. });
  2686. return targetFileObject;
  2687. }
  2688. function openViaButton(){
  2689. let fileOpenList = [];
  2690. let foldersToBeOpened=[];
  2691. $(".fileObject.selected").each(function(){
  2692. let type = $(this).attr("type");
  2693. let filepath = $(this).attr("filepath");
  2694. if (type == "file"){
  2695. fileOpenList.push(filepath);
  2696. }else if (type == "folder"){
  2697. foldersToBeOpened.push(filepath);
  2698. }
  2699. });
  2700. //Open files
  2701. openPathWithDefaultOpener(fileOpenList);
  2702. //Open folders
  2703. openFolderInNewWindow(foldersToBeOpened);
  2704. }
  2705. function openthis(object,evt=null, isDoubleClick=false){
  2706. if (evt !== null){
  2707. evt.preventDefault();
  2708. }
  2709. if (isDoubleClick && isMobile && ctrlHold){
  2710. //User is clicking too fast or touch screen is too sensitive! ignore this double click
  2711. return;
  2712. }
  2713. if (renameMode && $(object).find(".renameinput").length > 0){
  2714. //This object is currently under rename. Ignore input
  2715. return;
  2716. }else if (renameMode){
  2717. //Opening another stuffs. Exit renameMode
  2718. exitRenameModeWithConfirm();
  2719. }
  2720. var objType = $(object).attr("type");
  2721. if ( objType == "file"){
  2722. //Open this file. Generate the access path from filepath
  2723. var filepath = $(object).attr("filepath");
  2724. //Only one path to be opened. Pass in as a single object array
  2725. openPathWithDefaultOpener([filepath]);
  2726. }else if (objType == "folder"){
  2727. //Open this folder
  2728. var folderPath = $(object).attr('filepath');
  2729. listDirectory(folderPath, function(){
  2730. //Scroll to top of the list
  2731. $("#folderView").stop().finish().animate({
  2732. scrollTop: 0
  2733. }, 300);
  2734. if ($(object).hasClass('dir') && isMobile){
  2735. toggleSidebar();
  2736. }
  2737. });
  2738. }else if (objType == "shortcut"){
  2739. //Load the shortcut information
  2740. getShortcutInfo($(object).attr('filepath'), function(shortcutInfo){
  2741. /*
  2742. Shortcut Info format
  2743. 0: Shortcut type
  2744. 1: Shortcut Name
  2745. 2: Shortcut target
  2746. 3: Shortcut icon image
  2747. */
  2748. if (shortcutInfo[0] == "module"){
  2749. //This is a module
  2750. if (ao_module_virtualDesktop){
  2751. //Open Module with VDI API
  2752. parent.openModule(shortcutInfo[2]);
  2753. }else{
  2754. //Open module in new tab
  2755. $.get("../../system/modules/getLaunchPara?module=" + shortcutInfo[2], function(data) {
  2756. window.open("../../" + data.StartDir);
  2757. });
  2758. }
  2759. }else if (shortcutInfo[0] == "folder"){
  2760. //This is a folder
  2761. listDirectory(shortcutInfo[2]);
  2762. }else if (shortcutInfo[0] == "url"){
  2763. //This is a url shortcut
  2764. //Update 2020_02-03: Open with floatWindow instead
  2765. parent.newFloatWindow({
  2766. url: shortcutInfo[2],
  2767. appicon: shortcutInfo[3],
  2768. title: shortcutInfo[1],
  2769. parent: shortcutInfo[2]
  2770. })
  2771. //window.open(shortcutInfo[2]);
  2772. }
  2773. console.log(shortcutInfo);
  2774. });
  2775. }
  2776. //Check if this opened in sidebar and in mobile mode. Close sidebar if yes
  2777. }
  2778. /*
  2779. Shortcut Info format
  2780. 0: Shortcut type
  2781. 1: Shortcut Name
  2782. 2: Shortcut target
  2783. 3: Shortcut icon image
  2784. */
  2785. function getShortcutInfo(filepath, callback){
  2786. $.get("../../media?file=" + filepath, function(data){
  2787. //This return the shortcut information. Split it and see what shortcut is this
  2788. data = data.split("\r\n").join("\n");
  2789. var shortcutInfo = data.trim().split("\n");
  2790. callback(shortcutInfo);
  2791. });
  2792. }
  2793. //Download the selected files.
  2794. function downloadFile(){
  2795. var fileList = [];
  2796. if ($(".fileObject.selected").length == 1 && $(".fileObject.selected").attr("type") == "file"){
  2797. //One file. Download directly.
  2798. var downloadURL = "../../media/download?file=" + encodeURIComponent($(".fileObject.selected").attr("filepath"));
  2799. var filename = $(".fileObject.selected").attr("filename");
  2800. generateDownloadFromURL(downloadURL,escape(filename));
  2801. }else if ($(".fileObject.selected").length > 1 || ($(".fileObject.selected").length == 1 && $(".fileObject.selected").attr("type") == "folder")){
  2802. //Do zip and download for multiple files
  2803. $(".fileObject.selected").each(function(){
  2804. fileList.push($(this).attr("filepath"));
  2805. });
  2806. console.log("Zipping: ", fileList);
  2807. //Add a display for file compression
  2808. var fileCount = $(".fileObject.selected").length;
  2809. var displayString = applocale.getString("opr/zip/zipping", "Zipping ") + fileCount + applocale.getString("opr/zip/files", " files");
  2810. if (fileCount == 1){
  2811. //Use the filename as task name
  2812. displayString = applocale.getString("opr/zip/zipping", "Zipping ") + $(".fileObject.selected").attr("filename");
  2813. }
  2814. var taskUUID = appendUploadFileItem(displayString, -1);
  2815. $("#uploadTab").show();
  2816. //Set the progress bar to intermediate mode
  2817. let targetTaskDisplayObject = getUploadTaskByID(taskUUID);
  2818. targetTaskDisplayObject.find(".progress").addClass("preparing");
  2819. //Zip the file or folder
  2820. $.ajax({
  2821. url: "../../system/file_system/zipHandler",
  2822. data: {opr: "tmpzip", src: JSON.stringify(fileList), dest: ""},
  2823. method: "POST",
  2824. success: function(data){
  2825. if (data.error !== undefined){
  2826. //Error
  2827. targetTaskDisplayObject.find(".progress").removeClass("preparing").removeClass("primary").addClass("error");
  2828. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  2829. }else{
  2830. //Zip completed.
  2831. targetTaskDisplayObject.find(".progress").removeClass("preparing").removeClass("primary").addClass("positive");
  2832. //Open the zip file
  2833. window.open("../../media/download?file=" + data);
  2834. }
  2835. targetTaskDisplayObject.find(".bar").css("width", "100%");
  2836. //Hide the taskbar after 5 secs
  2837. setTimeout(function(){
  2838. //Fade out this task
  2839. $(targetTaskDisplayObject).fadeOut('fast',
  2840. function(){
  2841. $(this).remove();
  2842. if ($(".uploadTask").length == 0){
  2843. $("#uploadTab").hide();
  2844. }
  2845. }
  2846. );
  2847. }, 3000);
  2848. },
  2849. error: function(){
  2850. targetTaskDisplayObject.find(".progress").removeClass("preparing").removeClass("primary").addClass("error");
  2851. targetTaskDisplayObject.find(".bar").css("width", "100%");
  2852. msgbox("red remove",applocale.getString("message/zip/fail", "Zipping failed due to unknown reason"));
  2853. setTimeout(function(){
  2854. if ($(".uploadTask").length == 0){
  2855. $("#uploadTab").hide();
  2856. }
  2857. }, 3000);
  2858. }
  2859. });
  2860. }else{
  2861. msgbox("red remove",applocale.getString("message/No file selected", "No file selected"));
  2862. //alert("No file selected!")
  2863. }
  2864. }
  2865. //Create a new file
  2866. function newfile(){
  2867. $(".popup:visible ").transition('slide left out');
  2868. showPopupWrapper();
  2869. $("#newFile").transition('slide left in');
  2870. $("#newFile").find(".duplicateWarning").hide();
  2871. $("#createNewFileName").parent().removeClass("error");
  2872. //Update the newfile list
  2873. $("#newFile").find(".newfilelist").html("");
  2874. requestCSRFToken(function(token){
  2875. $.ajax({
  2876. url: "../../system/file_system/newItem",
  2877. data: {csrft: token},
  2878. success: function(data){
  2879. if (data.error !== undefined){
  2880. return;
  2881. }
  2882. for (var i =0; i < data.length; i++){
  2883. var desc = data[i].Desc;
  2884. var ext = data[i].Ext;
  2885. var icon = ao_module_utils.getIconFromExt(ext);
  2886. $("#newFile").find(".newfilelist").append(`<div class="item newFileFormat" ext="${ext}"><i class="${icon} icon" style="margin-right:12px;"></i> ${desc}</div>`);
  2887. }
  2888. //Initialize the new file as txt
  2889. var filename = "newfile";
  2890. var finalFilename = filename;
  2891. var i = 0;
  2892. while (currentFilelist.includes(finalFilename)){
  2893. finalFilename = finalFilename + "(" + i + ")";
  2894. i++;
  2895. }
  2896. $("#createNewFileName").val(finalFilename + ".txt");
  2897. //Hook events for on click
  2898. $(".newFileFormat").off("click").on("click",function(data){
  2899. $(".newFileFormat").removeClass("selected");
  2900. $(this).addClass("selected");
  2901. //Parse the newfilename
  2902. var selectedExt = $(this).attr("ext");
  2903. var filename = "newfile";
  2904. var finalFilename = filename;
  2905. var i = 0;
  2906. while (currentFilelist.includes(finalFilename)){
  2907. finalFilename = finalFilename + "(" + i + ")";
  2908. i++;
  2909. }
  2910. $("#createNewFileName").val(filename + "." + selectedExt);
  2911. });
  2912. }
  2913. });
  2914. });
  2915. }
  2916. function filePermission(){
  2917. //Open file permission window
  2918. if ($(".fileObject.selected").length > 0){
  2919. //Build the filelist
  2920. var fileList = [];
  2921. $(".fileObject.selected").each(function(){
  2922. var filepath = $(this).attr("filepath");
  2923. fileList.push(filepath);
  2924. });
  2925. var hashPassthrough = encodeURIComponent(JSON.stringify(fileList));
  2926. ao_module_newfw({
  2927. url: "SystemAO/file_system/file_permission.html#" + hashPassthrough,
  2928. width: 340,
  2929. height: 480,
  2930. appicon: "SystemAO/file_system/img/properties.png",
  2931. title: "File Permissions",
  2932. })
  2933. }
  2934. }
  2935. function newFolder(confirmed = false){
  2936. if (confirmed == false){
  2937. //Launch the dialog for newFolder
  2938. hideAllPopupWindows();
  2939. $("#createNewFolder").val("");
  2940. $("#createNewFolder").parent().removeClass("error").removeClass("success");
  2941. $("#newFolder").find(".duplicateWarning").hide();
  2942. showPopupWrapper();
  2943. $("#newFolder").transition("slide left in");
  2944. }else{
  2945. //Create new folder
  2946. var newFoldername = $("#createNewFolder").val().trim();
  2947. if (newFoldername == ""){
  2948. $("#createNewFolder").parent().addClass("error");
  2949. return;
  2950. }
  2951. //Check for invalid characters
  2952. if (filenameContainsIllegalCharacters(newFoldername)){
  2953. $("#createNewFolder").parent().addClass("error");
  2954. msgbox("red remove", applocale.getString("message/illegalCharacters", "Folder name contains illegal characters"));
  2955. return;
  2956. }
  2957. if (currentFilelist.includes(newFoldername)){
  2958. //Current filelist already contain a folder with the same name
  2959. $("#createNewFolder").parent().addClass("error");
  2960. $("#newFolder").find(".duplicateWarning").show();
  2961. return;
  2962. }
  2963. //OK to proceed.
  2964. $("#createNewFolder").parent().removeClass("error").addClass("success");
  2965. $("#newFolder").find(".duplicateWarning").hide();
  2966. requestCSRFToken(function(token){
  2967. $.ajax({
  2968. url: "../../system/file_system/newItem",
  2969. data: {type: "folder", src: currentPath, filename: newFoldername, csrft: token},
  2970. success: function(data){
  2971. if (data.error !== undefined){
  2972. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  2973. }else{
  2974. msgbox("checkmark",applocale.getString("message/newfolder/success", "New folder created."));
  2975. refreshList();
  2976. }
  2977. $("#newFolder").fadeOut('fast');
  2978. hideAllPopupWindows();
  2979. if (currentPath == "user:/"){
  2980. //Reload the User root folder list
  2981. initRootDirs();
  2982. }
  2983. }
  2984. });
  2985. });
  2986. }
  2987. }
  2988. function confirmNewFile(){
  2989. var filename = $("#createNewFileName").val();
  2990. if (filename == ""){
  2991. //Filename not set
  2992. $("#createNewFileName").parent().addClass("error");
  2993. return;
  2994. }
  2995. //Check for illegal characters
  2996. if (filenameContainsIllegalCharacters(filename)){
  2997. $("#createNewFileName").parent().addClass("error");
  2998. msgbox("red remove", applocale.getString("message/illegalCharacters", "Filename contains illegal characters"));
  2999. return;
  3000. }
  3001. if(currentFilelist.includes(filename)){
  3002. //File with this name already exists
  3003. $("#createNewFileName").parent().addClass("error");
  3004. $("#newFile").find(".duplicateWarning").show();
  3005. return;
  3006. }
  3007. $("#createNewFileName").parent().removeClass("error");
  3008. //Ok to proceed
  3009. requestCSRFToken(function(token){
  3010. $.ajax({
  3011. url: "../../system/file_system/newItem",
  3012. data: {type: "file", src: currentPath, filename:filename,csrft: token},
  3013. success: function(data){
  3014. if (data.error !== undefined){
  3015. msgbox("red remove",applocale.getString("message/" + data.error,data.error));
  3016. }else{
  3017. msgbox("checkmark",filename + applocale.getString("message/newItem/success", " created."));
  3018. refreshList();
  3019. }
  3020. }
  3021. });
  3022. });
  3023. hideAllPopupWindows();
  3024. $("#newFile").fadeOut('fast');
  3025. }
  3026. //Open File Location
  3027. function openFileLocation(){
  3028. var folders = [];
  3029. $(".selected.fileObject").each(function(){
  3030. var thisFilepath = $(this).attr('filepath');
  3031. var thisFilename = $(this).attr('filename');
  3032. openPathInNewWindow(encodeURIComponent(JSON.stringify([{
  3033. filename: thisFilename,
  3034. filepath: thisFilepath
  3035. }])))
  3036. });
  3037. }
  3038. //OpenWith dialog
  3039. function openWith(){
  3040. if ($(".selected.fileObject").length == 0){
  3041. msgbox("question",applocale.getString("message/nofileSelected", "No file selected"));
  3042. return;
  3043. }
  3044. //Get a list of modules and append it into the selection list
  3045. $.get("../../system/modules/list",function(data){
  3046. if (data.error !== undefined){
  3047. console.log(data.error);
  3048. }else{
  3049. $("#openWithModuleList").html("");
  3050. for (var i =0; i < data.length; i++){
  3051. var thisModule = data[i];
  3052. var supportFW = `<div class="ui horizontal mini icon label"><i class="window restore outline icon"></i> ${applocale.getString("opr/openwith/floatWindow", "Floating Window")}</div>`;
  3053. var supportEmb = `<div class="ui horizontal mini icon label"><i class="folder open icon"></i> ${applocale.getString("opr/openwith/embedded", "File Input")}</div>`;
  3054. if (!thisModule.SupportFW){
  3055. supportFW = "";
  3056. }
  3057. if (!thisModule.LaunchEmb){
  3058. supportEmb = "";
  3059. }
  3060. var launchInfo = encodeURIComponent(JSON.stringify(thisModule));
  3061. $("#openWithModuleList").append(`<div class="item selectable openWithModule" launchInfo="${launchInfo}" onclick="selectOpenWithModule(this, event);" ondblclick="selectOpenWithModule(this, event); openWithSelectedModule();">
  3062. <img class="ui avatar image" src="../../${thisModule.IconPath}">
  3063. <div class="content" style="padding-left:12px;">
  3064. <div class="header">${thisModule.Name}</div>
  3065. <div class="description">
  3066. ${supportFW}
  3067. ${supportEmb}
  3068. </div>
  3069. </div>
  3070. </div>`);
  3071. }
  3072. }
  3073. });
  3074. $(".openWithModule.popupbuttons").addClass("disabled");
  3075. hideAllPopupWindows();
  3076. if (!ao_module_virtualDesktop){
  3077. $("#openWith").find(".vdonly").hide();
  3078. }
  3079. showPopupWrapper();
  3080. $("#openWith").transition("slide left in");
  3081. }
  3082. //Functions for handling open with module selection and file opening
  3083. function selectOpenWithModule(object, event){
  3084. event.preventDefault();
  3085. $(".openWithModule.popupbuttons").removeClass("disabled");
  3086. $(".openWithModule.selected").removeClass("selected");
  3087. $(object).addClass("selected");
  3088. }
  3089. function openWithSelectedModule(btn){
  3090. if ($(btn).hasClass("disabled")){
  3091. return false;
  3092. }
  3093. var targetModuleInfo = JSON.parse(decodeURIComponent($(".openWithModule.selected").attr("launchInfo")));
  3094. var targetObjects = $(".selected.fileObject");
  3095. //Phrase launch mode from the module info
  3096. var launchURL = targetModuleInfo.StartDir
  3097. var launchSize = [undefined, undefined];
  3098. var iconPath = targetModuleInfo.IconPath;
  3099. var title = targetModuleInfo.Name;
  3100. if (targetModuleInfo.SupportEmb){
  3101. //Launch with embedded mode
  3102. launchURL = targetModuleInfo.LaunchEmb;
  3103. if (targetModuleInfo.InitEmbSize !== null){
  3104. launchSize = targetModuleInfo.InitEmbSize
  3105. }
  3106. }else if (targetModuleInfo.SupportFW){
  3107. //Launch with floatWindow mode
  3108. launchURL = targetModuleInfo.LaunchFWDir;
  3109. if (targetModuleInfo.InitFWSize !== null){
  3110. launchSize = targetModuleInfo.InitFWSize
  3111. }
  3112. }else if (targetModuleInfo.StartDir !== ""){
  3113. //Launch with default mode
  3114. }else{
  3115. msgbox("red remove",applocale.getString("message/moduleNotSupport", "This module has no endpoint for opening a file."));
  3116. return;
  3117. }
  3118. //Parse the filelist
  3119. var filelist = [];
  3120. $(targetObjects).each(function(){
  3121. var filename = $(this).attr("filename");
  3122. var filepath = $(this).attr("filepath");
  3123. filelist.push({
  3124. filename: filename,
  3125. filepath: filepath
  3126. });
  3127. });
  3128. fileHash = encodeURIComponent(JSON.stringify(filelist));
  3129. if (ao_module_virtualDesktop){
  3130. //Open the target module in a new fw
  3131. parent.newFloatWindow({
  3132. url: launchURL + "#" + fileHash,
  3133. width: launchSize[0],
  3134. height: launchSize[1],
  3135. appicon: iconPath,
  3136. title: title
  3137. });
  3138. }else{
  3139. //Redirect current window to the target module
  3140. window.location.href = "../../" + launchURL + "#" + fileHash;
  3141. }
  3142. hideAllPopupWindows();
  3143. }
  3144. function openFileWithModuleInNewTab(btn){
  3145. if ($(btn).hasClass("disabled")){
  3146. return false;
  3147. }
  3148. var targetModuleInfo = JSON.parse(decodeURIComponent($(".openWithModule.selected").attr("launchInfo")));
  3149. var targetObjects = $(".selected.fileObject");
  3150. //Parse the filelist
  3151. var filelist = [];
  3152. $(targetObjects).each(function(){
  3153. var filename = $(this).attr("filename");
  3154. var filepath = $(this).attr("filepath");
  3155. filelist.push({
  3156. filename: filename,
  3157. filepath: filepath
  3158. });
  3159. });
  3160. //Directly passing the file information to the startdir
  3161. fileHash = encodeURIComponent(JSON.stringify(filelist));
  3162. console.log(targetModuleInfo);
  3163. if (targetModuleInfo.StartDir == ""){
  3164. //Not a module supporting fw mode
  3165. if (targetModuleInfo.SupportEmb == true && targetModuleInfo.LaunchEmb != ""){
  3166. window.open("../../" + targetModuleInfo.LaunchEmb + "#" + fileHash);
  3167. }
  3168. }else{
  3169. window.open("../../" + targetModuleInfo.StartDir + "#" + fileHash);
  3170. }
  3171. hideAllPopupWindows();
  3172. }
  3173. function openRawFileInFloatWindow(btn){
  3174. //Directly open this (or more than one) files / folder in floatWindow
  3175. var targetObjects = $(".selected.fileObject");
  3176. $(targetObjects).each(function(){
  3177. if ($(this).attr("type") == "file"){
  3178. var launchURL = "media?file=" + $(this).attr('filepath');
  3179. parent.newFloatWindow({
  3180. url: launchURL,
  3181. appicon: "img/system/file.png",
  3182. title: $(this).attr('filename'),
  3183. "background-color": "#1f1f1f"
  3184. });
  3185. }else if ($(this).attr("type") == "folder"){
  3186. var launchURL = "SystemAO/file_system/file_explorer.html#" + $(this).attr("filepath");
  3187. parent.newFloatWindow({
  3188. url: launchURL,
  3189. appicon: "SystemAO/file_system/img/small_icon.png",
  3190. title: "File Manager - " + $(this).attr('filename'),
  3191. });
  3192. }else{
  3193. //Not supported openeing type.
  3194. console.log("Failed to open file " + $(this).attr('filepath') + " . WIP")
  3195. }
  3196. });
  3197. hideAllPopupWindows();
  3198. }
  3199. //Open the filepaths in the given paramters
  3200. function openPathWithDefaultOpener(filepaths){
  3201. console.log("Opening: ", filepaths);
  3202. for (var i =0; i < filepaths.length; i++){
  3203. let filepath = JSON.parse(JSON.stringify(filepaths[i]));
  3204. var ext = "." + filepath.split(".").pop();
  3205. $.ajax({
  3206. url: "../../system/modules/getDefault",
  3207. method: "GET",
  3208. data: {opr: "launch", ext: ext, mode: "launch"},
  3209. success: function(data){
  3210. if (data.error !== undefined){
  3211. //No default opener assigned. Launch it with opener selector
  3212. var url = "SystemAO/file_system/defaultOpener.html";
  3213. var icon = "SystemAO/file_system/img/opener.png";
  3214. var title = "Select an opener WebApp: "
  3215. var openFileList = [];
  3216. var openFileObject = {
  3217. filepath: filepath,
  3218. filename: filepath.split("/").pop()
  3219. }
  3220. openFileList.push(openFileObject);
  3221. var openParamter = encodeURIComponent(JSON.stringify(openFileObject));
  3222. var ao_module_virtualDesktop = !(!parent.isDesktopMode);
  3223. console.log(window.innerHeight/2 - 510/20);
  3224. if (ao_module_virtualDesktop){
  3225. parent.newFloatWindow({
  3226. url: url + "#" + openParamter,
  3227. width: 320,
  3228. height: 510,
  3229. appicon: icon,
  3230. title: title
  3231. });
  3232. }else{
  3233. url = "defaultOpener.html";
  3234. window.open(url + "#" + openParamter);
  3235. }
  3236. }else{
  3237. //Assigned. Launch with given paramter
  3238. var url = data["StartDir"];
  3239. var size = [undefined, undefined];
  3240. var title = data["Name"];
  3241. var icon = "img/system/favicon.png";
  3242. if (data["IconPath"] != ""){
  3243. icon = data["IconPath"];
  3244. }
  3245. //Use floatWindow if exists
  3246. if (data["SupportFW"] == true && data["LaunchFWDir"] != ""){
  3247. url = data["LaunchFWDir"];
  3248. if (data["InitFWSize"] !== null){
  3249. size = data["InitFWSize"]
  3250. }
  3251. }
  3252. //Use embedded mode if exists
  3253. if (data["SupportEmb"] == true && data["LaunchEmb"] != ""){
  3254. url = data["LaunchEmb"];
  3255. if (data["InitEmbSize"] !== null){
  3256. size = data["InitEmbSize"]
  3257. }
  3258. }
  3259. //Build open File Hash Data Format
  3260. var openFileList = [];
  3261. var openFileObject = {
  3262. filepath: filepath,
  3263. filename: filepath.split("/").pop()
  3264. }
  3265. openFileList.push(openFileObject);
  3266. var openParamter = encodeURIComponent(JSON.stringify(openFileList));
  3267. //Add launch files info and launch floatWindow
  3268. var ao_module_virtualDesktop = !(!parent.isDesktopMode);
  3269. if (ao_module_virtualDesktop){
  3270. parent.newFloatWindow({
  3271. url: url + "#" + openParamter,
  3272. width: size[0],
  3273. height: size[1],
  3274. appicon: icon,
  3275. title: title
  3276. });
  3277. }else{
  3278. window.open("../../" + url + "#" + openParamter);
  3279. }
  3280. }
  3281. }
  3282. });
  3283. }
  3284. }
  3285. function openSelectedFolderInNewWindow(){
  3286. $(".fileObject.selected").each(function(){
  3287. if ($(this).attr("type") == "folder"){
  3288. console.log($(this).attr('filepath'));
  3289. openPathInNewWindow([$(this).attr('filepath')]);
  3290. }
  3291. })
  3292. }
  3293. function openSelectedVroot(){
  3294. $("#storageroot").find(".dir.item").each(function(){
  3295. if ($(this).hasClass("active")){
  3296. var thisRootPath = $(this).attr('filepath');
  3297. openPathInNewWindow([$(this).attr('filepath')]);
  3298. }
  3299. });
  3300. }
  3301. //Always open the first object locally, and open others in new floatWindows
  3302. function openFolderInNewWindow(paths){
  3303. if (paths.length > 0){
  3304. listDirectory(paths[0]);
  3305. for (var i = 1; i < paths.length; i++){
  3306. //newFloatWindow(location.href.replace(location.hash,"") + "#" + path[i])
  3307. openPathInNewWindow(paths[i]);
  3308. }
  3309. }
  3310. }
  3311. function openPathInNewWindow(path){
  3312. console.log("Opening in new File Maanger: ", window.location.pathname + "#" + path);
  3313. ao_module_newfw({
  3314. url: window.location.pathname + "#" + path,
  3315. appicon: "SystemAO/file_system/img/small_icon.png",
  3316. title: "File Manager",
  3317. width: 1080,
  3318. height: 580,
  3319. parent: ao_module_windowID,
  3320. });
  3321. }
  3322. //Preference setting and loading functions.
  3323. function setPreference(key, value){
  3324. $.ajax({
  3325. url:"../../system/file_system/preference?key=" + key + "&value=" + value,
  3326. success: function(data){
  3327. if (data.error !== undefined){
  3328. console.log(data);
  3329. }
  3330. }
  3331. });
  3332. }
  3333. function loadPreference(key, callback){
  3334. $.get("../../system/file_system/preference?key=" + key,function(data){
  3335. callback(data);
  3336. });
  3337. }
  3338. // ============================== WINDOW RESIZE FUNCTIONS =====================
  3339. $(window).on("resize",function(){
  3340. initWindowSizes(false);
  3341. if (!isMobile && window.innerWidth < 620 && sideBarShown == true){
  3342. toggleSidebar(false);
  3343. }else if (!isMobile && window.innerWidth > 650 && sideBarShown == false){
  3344. toggleSidebar(false);
  3345. }
  3346. if (isMobile && !pathInputMode){
  3347. //refreshList();
  3348. }
  3349. //Resize the share iframe
  3350. resizeShareIframe()
  3351. //Resize the path display content
  3352. if (!pathInputMode){
  3353. updatePathDisplay(currentPath);
  3354. }
  3355. });
  3356. function handleShareFilebuttonClick(event, object){
  3357. event.preventDefault();
  3358. event.stopImmediatePropagation();
  3359. $(".fileObject.selected").removeClass("selected");
  3360. if (viewMode == "list"){
  3361. $(object).parent().parent().addClass("selected");
  3362. }else if (viewMode == "grid"){
  3363. $(object).parent().parent().parent().addClass("selected");
  3364. }else if (viewMode == "details"){
  3365. $(object).parent().parent().addClass("selected");
  3366. }
  3367. shareFile();
  3368. }
  3369. function resizeShareIframe(){
  3370. $("#shareFileEmbedded").css("height", $("#shareFile").height() - 126 + "px");
  3371. }
  3372. function shareFile(){
  3373. var selectedFiles = [];
  3374. var selectedFileObjects = [];
  3375. $(".fileObject.selected").each(function(){
  3376. var thisFilepath = $(this).attr("filepath");
  3377. var thisFilename = $(this).attr("filename");
  3378. selectedFiles.push(thisFilepath);
  3379. selectedFileObjects.push({"filepath": thisFilepath, "filename": thisFilename});
  3380. });
  3381. if (selectedFiles.length == 0){
  3382. msgbox("question", applocale.getString("message/No file selected", "No file selected"));
  3383. console.log("No file is selected for sharing");
  3384. return;
  3385. }else if (selectedFiles.length > 1){
  3386. //Try to share more than 1 files, which is not supported
  3387. msgbox("yellow exclamation", applocale.getString("message/Multiple files share is currently not supported", "Multiple files share is currently not supported"));
  3388. console.log("Multi share is current not supported");
  3389. return
  3390. }
  3391. //OK! Continue to generate link
  3392. var selectedFile = selectedFiles[0];
  3393. var selectedFileObject = selectedFileObjects[0];
  3394. shareEditingObject = selectedFile;
  3395. $.ajax({
  3396. url: "../../system/file_system/share/new",
  3397. data: {path: selectedFile},
  3398. success: function(data){
  3399. if (data.error !== undefined){
  3400. msgbox("red remove",applocale.getString("message/" + data.error,data.error), 5000);
  3401. }else{
  3402. //Build the predicted share endpoint
  3403. selectedFileObject["QRCode"] = true;
  3404. selectedFileObject["ActionButtons"] = false;
  3405. var payload = encodeURIComponent(JSON.stringify([selectedFileObject]));
  3406. var requestURL = "file_share.html#" + payload;
  3407. console.log(selectedFileObject, requestURL);
  3408. $("#shareFileEmbedded").attr("src", requestURL);
  3409. resizeShareIframe();
  3410. //Show the share file interface
  3411. hideAllPopupWindows();
  3412. showPopupWrapper();
  3413. $("#shareFile").transition('slide left');
  3414. //Reload the list
  3415. listDirectory(currentPath);
  3416. }
  3417. }
  3418. });
  3419. }
  3420. function removeSharing(){
  3421. if (shareEditingObject == ""){
  3422. return
  3423. }
  3424. //The target file to remove
  3425. var selectedFile = shareEditingObject;
  3426. $("#shareFileEmbedded").attr("src", "");
  3427. $.ajax({
  3428. url: "../../system/file_system/share/delete",
  3429. data: {vpath: selectedFile},
  3430. success: function(data){
  3431. console.log(data);
  3432. $("#qrcode").html(`<img src="img/private.png">`);
  3433. $(".shareoption").parent().addClass("disabled");
  3434. $("#sharelink").text("(Sharing Removed)");
  3435. $("#sharelink").removeAttr("href");
  3436. //Reload the current filelist and hide the share interface
  3437. listDirectory(currentPath);
  3438. //Reset sharing file settings
  3439. shareEditingObject = ""
  3440. shareEditingUUID = ""
  3441. }
  3442. });
  3443. hideAllPopupWindows();
  3444. msgbox("checkmark", applocale.getString("message/share/removed", "File share removed"))
  3445. }
  3446. function updateShareSettings(object){
  3447. $(object).addClass("loading");
  3448. var shareMode = $("#shareSettingForm [name='shareopt']:checked").val();
  3449. $.ajax({
  3450. url: "../../system/file_system/share/edit",
  3451. data: {uuid: shareEditingUUID, mode: shareMode},
  3452. success: function(data){
  3453. if (data.error !== undefined){
  3454. alert(data.error);
  3455. }
  3456. $(object).removeClass("loading");
  3457. $(object).html(`<i class="checkmark icon"></i> Updated`);
  3458. $(object).addClass("positive");
  3459. setTimeout(function(){
  3460. $(object).html("Update");
  3461. $(object).removeClass("positive");
  3462. }, 3000);
  3463. }
  3464. })
  3465. }
  3466. function hideShare(){
  3467. hideAllPopupWindows();
  3468. $("#shareFileEmbedded").attr("src", "");
  3469. }
  3470. function exitMultiSelectMode(){
  3471. if (ctrlHold){
  3472. ctrlHold = false;
  3473. updateCtrlDisplay();
  3474. }
  3475. }
  3476. function toggleMobileSidebar(show=undefined, callback=undefined){
  3477. if(show == true){
  3478. $("#mobileNaviBar").stop().finish().show();
  3479. }else if (show == false){
  3480. $("#mobileNaviBar").stop().finish().hide();
  3481. }else{
  3482. $("#mobileNaviBar").toggle();
  3483. }
  3484. if (callback != undefined){
  3485. setTimeout(callback, 300);
  3486. }
  3487. }
  3488. function toggleSidebar(useAnimation=true){
  3489. //Fixing desktop bugs on showing the sidebar
  3490. if (isMobile){
  3491. if (sideBarShown){
  3492. $("#directorySidebar").hide();
  3493. }else{
  3494. $("#directorySidebar").show();
  3495. }
  3496. }else{
  3497. if (sideBarShown){
  3498. $("#directorySidebar").stop().finish().transition("slide right out", function(){
  3499. $("#directorySidebar").hide();
  3500. });
  3501. //$("#directorySidebar").stop().finish().animate({left: 0},200);
  3502. }else{
  3503. $("#directorySidebar").stop().finish().transition("slide right in", function(){
  3504. $("#directorySidebar").show();
  3505. });
  3506. //$("#directorySidebar").stop().finish().animate({left: -1 * directorySidebarWidth},200);
  3507. }
  3508. }
  3509. sideBarShown = !sideBarShown;
  3510. initWindowSizes(useAnimation);
  3511. }
  3512. function initWindowSizes(animate=true){
  3513. var h = $("#navibar").css("height");
  3514. var hint = $("#navibar").height();
  3515. //$("#mainWindow").css("padding-top",h);
  3516. var windowHeight = window.innerHeight - hint - 12;
  3517. //console.log(windowHeight);
  3518. if (sideBarShown){
  3519. //Resize the sidebar
  3520. $("#directorySidebar").css("top",h);
  3521. $("#directorySidebar").css("width",directorySidebarWidth);
  3522. $("#directorySidebar").css("height",windowHeight + "px");
  3523. //Resize the file viewer
  3524. $("#folderView").css("top",h);
  3525. /*
  3526. if (window.innerWidth > 650){
  3527. if (animate){
  3528. $("#folderView").stop().finish().animate({
  3529. left: directorySidebarWidth + 'px',
  3530. width: window.innerWidth - directorySidebarWidth - 2 + "px"
  3531. },200);
  3532. }else{
  3533. $("#folderView").css({
  3534. left: directorySidebarWidth + 'px',
  3535. width: window.innerWidth - directorySidebarWidth - 2 + "px"
  3536. });
  3537. }
  3538. }else{
  3539. //Window width too small to allow resizing sidebar shown. Overlap it
  3540. if (animate){
  3541. $("#folderView").stop().finish().animate({
  3542. left: directorySidebarWidth + 'px',
  3543. width: window.innerWidth + "px"
  3544. },200);
  3545. }else{
  3546. $("#folderView").css({
  3547. left: directorySidebarWidth + 'px',
  3548. width: window.innerWidth + "px"
  3549. });
  3550. }
  3551. }
  3552. */
  3553. if (isChromium){
  3554. //$("#mainWindow").css("height", window.innerWidth);
  3555. }
  3556. //$("#folderView").css("left",directorySidebarWidth + "px");
  3557. $("#folderView").css("height",windowHeight + "px");
  3558. }else{
  3559. $("#folderView").css("top",h);
  3560. if (animate){
  3561. $("#folderView").stop().finish().animate({
  3562. left:'0px',
  3563. width:(window.innerWidth - 2 + "px")
  3564. },200);
  3565. }else{
  3566. $("#folderView").css({
  3567. left:'0px',
  3568. width:(window.innerWidth - 2 + "px")
  3569. });
  3570. }
  3571. $("#folderView").css("height",windowHeight + "px");
  3572. }
  3573. $("#propertiesView").css("height", windowHeight + "px");
  3574. }
  3575. function toggleDarkTheme(){
  3576. if ($(".darkTheme").length > 0){
  3577. //Set To whiteTheme
  3578. $("body").removeClass("darkTheme").addClass("whiteTheme");
  3579. currentTheme = "whiteTheme";
  3580. $("#darkthemebtn").attr("class","moon icon");
  3581. $("#darkthemebtn").parent().addClass("inverted");
  3582. $(".dropdown").removeClass("inverted");
  3583. setPreference("file_explorer/theme","whiteTheme");
  3584. $("#mobileNaviBar").removeClass("inverted");
  3585. $("#darkthemebtn").css("color", "#dadada");
  3586. //If in vdi mode, update desktop's listMenu as well
  3587. if (ao_module_virtualDesktop){
  3588. parent.initTheme("whiteTheme");
  3589. }
  3590. }else{
  3591. //Set to DarkTheme
  3592. $("body").removeClass("whiteTheme").addClass("darkTheme");
  3593. currentTheme = "darkTheme";
  3594. $("#darkthemebtn").attr("class","sun icon");
  3595. $("#darkthemebtn").parent().removeClass("inverted");
  3596. $("#darkthemebtn").css("color", "#3d3f47");
  3597. $(".dropdown").addClass("inverted");
  3598. setPreference("file_explorer/theme","darkTheme");
  3599. $("#mobileNaviBar").addClass("inverted");
  3600. //If in vdi mode, update desktop's listMenu as well
  3601. if (ao_module_virtualDesktop){
  3602. parent.initTheme("darkTheme");
  3603. }
  3604. }
  3605. }
  3606. function msgbox(icon, text, delay=3000){
  3607. $($(".msgbox").find("span")[0]).text(text);
  3608. $($(".msgbox").find("i")[0]).attr("class", icon + " icon");
  3609. $(".msgbox").stop().finish().slideDown('fast').delay(delay).slideUp('fast', function(){
  3610. initWindowSizes(false);
  3611. });
  3612. }
  3613. //Keyboard hotkey events
  3614. $(document).keydown(function(event){
  3615. if ($(':focus').is("input")){
  3616. //Do not block operations on input fields.
  3617. if (event.which == 27){
  3618. //Cancel the operation
  3619. if (searchMode){
  3620. //Exit search mode
  3621. hideSearchBar();
  3622. }else if (pathInputMode){
  3623. //Path input mode. Hide the path input
  3624. hideManualOpenPathInput();
  3625. }
  3626. }
  3627. return;
  3628. }
  3629. if(event.which==17 || event.which == 91){
  3630. ctrlHold = true;
  3631. updateCtrlDisplay();
  3632. }else if (event.which == 16){
  3633. shiftHold = true;
  3634. updateCtrlDisplay();
  3635. }else if (event.which == 67 && ctrlHold == true){
  3636. //Ctrl + C
  3637. if (!$(".popup").is(":visible")){
  3638. if ($(lastClickedElement).closest("#propertiesView").length > 0){
  3639. //Inside the file properties View
  3640. return;
  3641. }
  3642. event.preventDefault();
  3643. copy();
  3644. }
  3645. }else if (event.which == 88 && ctrlHold == true){
  3646. //Ctrl + X
  3647. if (!$(".popup").is(":visible")){
  3648. if ($(lastClickedElement).closest("#propertiesView").length > 0){
  3649. //Inside the file properties View
  3650. return;
  3651. }
  3652. event.preventDefault();
  3653. cut();
  3654. }
  3655. }else if (event.which == 65 && ctrlHold == true){
  3656. //Ctrl + A
  3657. if ($(lastClickedElement).closest("#propertiesView").length > 0){
  3658. //Inside the file properties View
  3659. return;
  3660. }
  3661. event.preventDefault();
  3662. $(".fileObject").addClass("selected");
  3663. updateSelectedObjectsCount();
  3664. }else if (event.which == 78 && shiftHold == true){
  3665. //Shift + N, Open new file manager window with current path
  3666. event.preventDefault();
  3667. openPathInNewWindow(currentPath);
  3668. }else if (event.which == 86 && ctrlHold == true){
  3669. if (!$(".popup").is(":visible")){
  3670. if ($(lastClickedElement).closest("#propertiesView").length > 0){
  3671. //Inside the file properties View
  3672. return;
  3673. }
  3674. paste();
  3675. }
  3676. }else if (event.which == 46 && shiftHold == true){
  3677. //Shift + delete
  3678. forceDelete();
  3679. }else if (event.which == 46){
  3680. //Delete
  3681. deleteFile();
  3682. }else if (event.which == 38){
  3683. //Up Arrow
  3684. if ($(".popup:visible").length == 0){
  3685. //No popup visiable
  3686. if (ctrlHold == true){
  3687. //Parenet path
  3688. parentDir();
  3689. }else{
  3690. //Select the file on the upper
  3691. selectPreviousFile(event);
  3692. }
  3693. }
  3694. }else if (event.which == 40){
  3695. //Down arrow
  3696. if ($(".popup:visible").length == 0){
  3697. //No popup visiable
  3698. selectNextFile(event);
  3699. }
  3700. }else if (event.which == 39){
  3701. //Right arrow
  3702. if ($(".popup:visible").length == 0 && viewMode == "grid"){
  3703. //No popup visiable and grid mode
  3704. selectRightFile(event);
  3705. }
  3706. }else if (event.which == 37){
  3707. //Left arrow
  3708. if ($(".popup:visible").length == 0 && viewMode == "grid"){
  3709. //No popup visiable and grid mode
  3710. selectLeftFile(event);
  3711. }
  3712. }else if (event.which == 13){
  3713. //Enter key
  3714. if ($(".fileObject.selected").length > 0){
  3715. openViaButton();
  3716. }else if ($(".fileObject.hotSearchHighlight").length > 0 && $(".fileObject.selected").length == 0){
  3717. //Hot search selection mode
  3718. }
  3719. }else if (event.which == 27){
  3720. //Esc key
  3721. hideAllPopupWindows();
  3722. $(".fileObject.selected").removeClass("selected");
  3723. }else{
  3724. //Handle generic file search by consecutive typing
  3725. if (hotSearchTimer != null){
  3726. clearTimeout(hotSearchTimer);
  3727. }
  3728. $(".fileObject.selected").removeClass("selected");
  3729. hotSearchTimer = setTimeout(function(){
  3730. exitHotSearch();
  3731. }, 1000);
  3732. if (hotSearchBuffer.length > 0 && event.key == hotSearchBuffer.substr(hotSearchBuffer.length - 1, 1)){
  3733. //Jump to next result
  3734. hotSearchOffsetIndex++;
  3735. }else{
  3736. hotSearchOffsetIndex = 0;
  3737. hotSearchBuffer+= event.key;
  3738. }
  3739. handleHotSearch(hotSearchBuffer, hotSearchOffsetIndex);
  3740. }
  3741. });
  3742. $(document).keyup(function(event){
  3743. if(event.which==17 || event.which == 91){
  3744. ctrlHold = false;
  3745. updateCtrlDisplay();
  3746. }else if (event.which == 16){
  3747. shiftHold = false;
  3748. }
  3749. });
  3750. $("#directorySidebar").on("click",function(evt){
  3751. //Clear the button holding
  3752. $(".fileObject.selected").removeClass("selected");
  3753. shiftHold = false;
  3754. ctrlHold = false;
  3755. updateCtrlDisplay();
  3756. if (renameMode){
  3757. exitRenameModeWithConfirm();
  3758. }
  3759. });
  3760. //Check if localstorage is availble
  3761. function lscheck(){
  3762. var test = 'test';
  3763. try {
  3764. localStorage.setItem(test, test);
  3765. localStorage.removeItem(test);
  3766. return true;
  3767. } catch(e) {
  3768. return false;
  3769. }
  3770. }
  3771. function selectNextFile(e){
  3772. e.preventDefault();
  3773. //Check if there are no selection. If yes, select the first file object
  3774. if ($(".fileObject.selected").length == 0 && $(".fileObject").length > 0){
  3775. //Select the first file object
  3776. $($(".fileObject")[0]).addClass("selected");
  3777. return
  3778. }else if ( $(".fileObject").length == 0){
  3779. //No file in this folder
  3780. return
  3781. }
  3782. //Already contain selected file on the interface. Seleect it
  3783. var baseObject = $($(".fileObject.selected")[0]);
  3784. if ($(".fileObject.selected").length > 1){
  3785. $(".fileObject.selected").removeClass("selected");
  3786. }
  3787. if (viewMode == "list" || viewMode == "details"){
  3788. //Select the next file
  3789. var nextObject = $(".fileObject").eq( $(".fileObject").index( $(baseObject) ) + 1 );
  3790. if (nextObject.length > 0){
  3791. nextObject.addClass("selected");
  3792. scrollToFileObject(nextObject);
  3793. $(baseObject).removeClass("selected");
  3794. }
  3795. }else if (viewMode == "grid"){
  3796. var colobj = getFileObjectInTheSameCol(baseObject);
  3797. var nextObject = baseObject;
  3798. for (var i = 0; i < colobj.length; i++){
  3799. if ($(colobj[i]).hasClass("selected") && i != colobj.length - 1){
  3800. nextObject = colobj[i + 1];
  3801. }
  3802. }
  3803. $(baseObject).removeClass("selected");
  3804. nextObject.addClass("selected");
  3805. scrollToFileObject(nextObject);
  3806. }
  3807. if (propertiesView){
  3808. let selectedFile = $(".fileObject.selected")[0];
  3809. let filepath = $(selectedFile).attr('filepath');
  3810. loadFileProperties(filepath);
  3811. }
  3812. }
  3813. function selectPreviousFile(e){
  3814. e.preventDefault();
  3815. //Check if there are no selection. If yes, select the first file object
  3816. if ($(".fileObject.selected").length == 0 && $(".fileObject").length > 0){
  3817. //Select the first file object
  3818. $($(".fileObject")[$(".fileObject").length - 1]).addClass("selected");
  3819. return
  3820. }else if ( $(".fileObject").length == 0){
  3821. //No file in this folder
  3822. return
  3823. }
  3824. var baseObject = $($(".fileObject.selected")[0]);
  3825. if ($(".fileObject.selected").length > 1){
  3826. $(".fileObject.selected").removeClass("selected");
  3827. }
  3828. if (viewMode == "list" || viewMode == "details"){
  3829. //Select the previous file
  3830. if ($(".fileObject").index( $(baseObject) ) -1 < 0){
  3831. return;
  3832. }
  3833. var previousObject = $(".fileObject").eq( $(".fileObject").index( $(baseObject) ) -1 );
  3834. if (previousObject.length > 0){
  3835. previousObject.addClass("selected");
  3836. scrollToFileObject(previousObject);
  3837. $(baseObject).removeClass("selected");
  3838. }
  3839. }else if (viewMode == "grid"){
  3840. var colobj = getFileObjectInTheSameCol(baseObject);
  3841. var prevObj = baseObject;
  3842. for (var i = 0; i < colobj.length; i++){
  3843. if ($(colobj[i]).hasClass("selected") && i > 0){
  3844. prevObj = colobj[i - 1];
  3845. }
  3846. }
  3847. $(baseObject).removeClass("selected");
  3848. prevObj.addClass("selected");
  3849. scrollToFileObject(prevObj);
  3850. }
  3851. if (propertiesView){
  3852. let selectedFile = $(".fileObject.selected")[0];
  3853. let filepath = $(selectedFile).attr('filepath');
  3854. loadFileProperties(filepath);
  3855. }
  3856. }
  3857. function scrollToFileObject(fileObject){
  3858. if (viewMode == "grid"){
  3859. $('#folderView').scrollTop($(fileObject)[0].offsetTop - ($("#directorySidebar").height()/2 - 340));
  3860. }else{
  3861. $('#folderView').scrollTop($(fileObject)[0].offsetTop - ($("#directorySidebar").height()/2 - 140));
  3862. }
  3863. }
  3864. //Grid mode left right opr
  3865. function selectLeftFile(e){
  3866. e.preventDefault();
  3867. if (viewMode != "grid"){
  3868. return;
  3869. }
  3870. if ($(".fileObject.selected").length == 0 && $(".fileObject").length > 0){
  3871. //Select the first file object
  3872. $($(".fileObject")[$(".fileObject").length - 1]).addClass("selected");
  3873. return
  3874. }else if ( $(".fileObject").length == 0){
  3875. //No file in this folder
  3876. return
  3877. }
  3878. var baseObject = $($(".fileObject.selected")[0]);
  3879. if ($(".fileObject").index( $(baseObject) ) -1 < 0){
  3880. return;
  3881. }
  3882. var previousObject = $(".fileObject").eq( $(".fileObject").index( $(baseObject) ) -1 );
  3883. if (previousObject.length > 0){
  3884. previousObject.addClass("selected");
  3885. scrollToFileObject(previousObject);
  3886. $(baseObject).removeClass("selected");
  3887. }
  3888. if (propertiesView){
  3889. let selectedFile = $(".fileObject.selected")[0];
  3890. let filepath = $(selectedFile).attr('filepath');
  3891. loadFileProperties(filepath);
  3892. }
  3893. }
  3894. function selectRightFile(e){
  3895. e.preventDefault();
  3896. if (viewMode != "grid"){
  3897. return;
  3898. }
  3899. if ($(".fileObject.selected").length == 0 && $(".fileObject").length > 0){
  3900. //Select the first file object
  3901. $($(".fileObject")[0]).addClass("selected");
  3902. return
  3903. }else if ( $(".fileObject").length == 0){
  3904. //No file in this folder
  3905. return
  3906. }
  3907. var baseObject = $($(".fileObject.selected")[0]);
  3908. var nextObject = $(".fileObject").eq( $(".fileObject").index( $(baseObject) ) + 1 );
  3909. if (nextObject.length > 0){
  3910. nextObject.addClass("selected");
  3911. scrollToFileObject(nextObject);
  3912. $(baseObject).removeClass("selected");
  3913. }
  3914. if (propertiesView){
  3915. let selectedFile = $(".fileObject.selected")[0];
  3916. let filepath = $(selectedFile).attr('filepath');
  3917. loadFileProperties(filepath);
  3918. }
  3919. }
  3920. //Functions for getting file objects in the same collume
  3921. function getFileObjectInTheSameCol(baseFileObject){
  3922. if (viewMode != "grid"){
  3923. return;
  3924. }
  3925. var baseOffset = $(baseFileObject).offset().left;
  3926. var fileObjectInTheSameCol = [];
  3927. $(".fileObject").each(function(){
  3928. if ($(this).offset().left == baseOffset){
  3929. let thisFileObject = $(this);
  3930. fileObjectInTheSameCol.push(thisFileObject);
  3931. }
  3932. });
  3933. return fileObjectInTheSameCol;
  3934. }
  3935. //Function for getting file objects in the same row
  3936. function getFileObjectInTheSameRow(baseFileObject){
  3937. if (viewMode != "grid"){
  3938. return;
  3939. }
  3940. var baseOffset = $(baseFileObject).offset().top;
  3941. var fileObjectInTheSameRow = [];
  3942. $(".fileObject").each(function(){
  3943. if ($(this).offset().top == baseOffset){
  3944. let thisFileObject = $(this);
  3945. fileObjectInTheSameRow.push(thisFileObject);
  3946. }
  3947. });
  3948. return fileObjectInTheSameRow;
  3949. }
  3950. //Handle drag drop upload
  3951. function drop(event){
  3952. event.preventDefault();
  3953. console.log(event, event.target)
  3954. //Check if this is file upload or file move / copy function
  3955. let dt = event.dataTransfer
  3956. let files = dt.files
  3957. if (files.length > 0){
  3958. //Upload file via dragdrop
  3959. msgbox("upload",applocale.getString("message/upload/started", "Upload Started"));
  3960. let items = event.dataTransfer.items;
  3961. for (let i=0; i<items.length; i++) {
  3962. let item = items[i].webkitGetAsEntry();
  3963. if (item) {
  3964. recursiveScanFilesUpload(item);
  3965. }
  3966. }
  3967. }else{
  3968. //File transfer within system
  3969. let filedata = event.dataTransfer.getData("filedata");
  3970. if (filedata != ""){
  3971. try{
  3972. let fileList = JSON.parse(filedata);
  3973. //Check if the file objects are from the same host
  3974. let localFiles = [];
  3975. let remoteFiles = [];
  3976. fileList.forEach(file => {
  3977. if (file.hostUUID == systemUUID){
  3978. //Local file
  3979. localFiles.push(file);
  3980. }else{
  3981. //Remote files
  3982. remoteFiles.push(file);
  3983. }
  3984. });
  3985. //Start processing the local files
  3986. let currentVroot = currentPath.split(":/").shift();
  3987. clipboard = [];
  3988. //Assume all files are from the same directory
  3989. if (localFiles.length > 0){
  3990. //Check if drag drop from the same directory
  3991. let currentDirname = currentPath.split("/")
  3992. currentDirname.pop();
  3993. currentDirname = currentDirname.join("/");
  3994. let firstFileDirname = localFiles[0].filepath.split("/")
  3995. firstFileDirname.pop();
  3996. firstFileDirname = firstFileDirname.join("/");
  3997. if (currentDirname == firstFileDirname){
  3998. //Drag start and drop location are the same directory
  3999. msgbox("red remove",applocale.getString("message/destIdentical", "Source and destination file names are the same"));
  4000. return;
  4001. }
  4002. let fileVroot = localFiles[0].filepath.split(":/").shift();
  4003. if (currentVroot == fileVroot){
  4004. //Same device same root. Move the file
  4005. cutMode = true;
  4006. }else{
  4007. //Same device differnet root. Copy the file
  4008. cutMode = false;
  4009. }
  4010. //Move all localFiles into clipboard
  4011. localFiles.forEach(file => {
  4012. clipboard.push(file.filepath);
  4013. });
  4014. if (useLocalstorage){
  4015. localStorage.setItem("ao/file_system/clipboard",JSON.stringify(clipboard));
  4016. if (cutMode){
  4017. localStorage.setItem("ao/file_system/cutmode","true");
  4018. }else{
  4019. localStorage.setItem("ao/file_system/cutmode","false");
  4020. }
  4021. }
  4022. //Paste all the files to the current path
  4023. console.log(clipboard);
  4024. paste();
  4025. }
  4026. }catch(ex){
  4027. console.log(ex);
  4028. msgbox("red remove",applocale.getString("message/decodeFilelistFail", "File drop failed. Unable to decode filelist."));
  4029. }
  4030. }
  4031. }
  4032. }
  4033. function recursiveScanFilesUpload(item, rootpath="", base=""){
  4034. var filesInside = [];
  4035. if (item.isDirectory) {
  4036. //This is a directory
  4037. let directoryReader = item.createReader();
  4038. directoryReader.readEntries(function(entries) {
  4039. entries.forEach(function(entry) {
  4040. recursiveScanFilesUpload(entry, rootpath + item.name + "/", base);
  4041. });
  4042. });
  4043. }else{
  4044. //This is a file. Upload it
  4045. item.file(function(fileObject){
  4046. if (isChrome || isSafari){
  4047. //WebKits
  4048. console.log("Upload Target", fileObject, rootpath);
  4049. uploadFile(fileObject, undefined, currentPath + rootpath);
  4050. }else{
  4051. //Firefox. Special handling for root path.
  4052. //Updates for Firefox 84.0.2 (64-bit), which changed minor implementation on relative path in folder updates
  4053. //This section of code is deprecated since then
  4054. /*
  4055. //As firefox will keep its file input relative path, we need to remove the root folder
  4056. //name from the rootpath passed in by the webkit API
  4057. if (rootpath.substr(rootpath.length - 1, 1) == "/"){
  4058. rootpath = rootpath.substr(0, rootpath.length - 1);
  4059. }
  4060. var rootpathInfo = rootpath.split("/");
  4061. if (rootpathInfo.length > 1){
  4062. //Uploading folder to folder. Extract the folder root name
  4063. rootpathInfo.pop();
  4064. }else{
  4065. //Uploading file to folder. Do nothing
  4066. }
  4067. rootpath = rootpathInfo.join("/") + "/";
  4068. console.log("Upload Target", fileObject, rootpath);
  4069. uploadFile(fileObject, undefined, currentPath + rootpath);
  4070. */
  4071. //console.log(currentPath + rootpath);
  4072. uploadFile(fileObject, undefined, currentPath + base);
  4073. }
  4074. });
  4075. }
  4076. return filesInside;
  4077. }
  4078. function showCurrentDirectoryProperties(){
  4079. var fileList = [currentPath];
  4080. console.log(fileList);
  4081. var hashPassthrough = encodeURIComponent(JSON.stringify(fileList));
  4082. ao_module_newfw({
  4083. url: "SystemAO/file_system/file_properties.html#" + hashPassthrough,
  4084. width: 340,
  4085. height: 480,
  4086. appicon: "SystemAO/file_system/img/properties.png",
  4087. title: "File Properties",
  4088. });
  4089. }
  4090. function showVrootProperties(){
  4091. var rootname = [$("#storageroot").find(".dir.item.active").attr("filepath")];
  4092. var hashPassthrough = encodeURIComponent(JSON.stringify(rootname));
  4093. ao_module_newfw({
  4094. url: "SystemAO/disk/diskprop.html#" + hashPassthrough,
  4095. width: 420,
  4096. height: 580,
  4097. appicon: "img/system/drive.svg",
  4098. title: "Disk Properties",
  4099. });
  4100. }
  4101. function showSharesManager(){
  4102. var rootname = [$("#storageroot").find(".dir.item.active").attr("filepath")];
  4103. var hashPassthrough = encodeURIComponent(JSON.stringify(rootname));
  4104. ao_module_newfw({
  4105. url: "SystemAO/file_system/sharelist.html#" + hashPassthrough,
  4106. width: 420,
  4107. height: 580,
  4108. appicon: "img/system/share.svg",
  4109. title: "Shares Manager"
  4110. });
  4111. }
  4112. function openBackupManager(){
  4113. var rootname = [$("#storageroot").find(".dir.item.active").attr("filepath")];
  4114. var hashPassthrough = encodeURIComponent(JSON.stringify(rootname));
  4115. ao_module_newfw({
  4116. url: "SystemAO/disk/disk_restore.html#" + hashPassthrough,
  4117. width: 410,
  4118. height: 580,
  4119. appicon: "img/system/backup.svg",
  4120. title: "Backup & Restore",
  4121. });
  4122. }
  4123. function showFileProperties(){
  4124. //Show the file list of the selected files
  4125. if ($(".fileObject.selected").length > 0){
  4126. //Build the filelist
  4127. var fileList = [];
  4128. $(".fileObject.selected").each(function(){
  4129. var filepath = $(this).attr("filepath");
  4130. fileList.push(filepath);
  4131. });
  4132. var hashPassthrough = encodeURIComponent(JSON.stringify(fileList));
  4133. ao_module_newfw({
  4134. url: "SystemAO/file_system/file_properties.html#" + hashPassthrough,
  4135. width: 340,
  4136. height: 480,
  4137. appicon: "SystemAO/file_system/img/properties.png",
  4138. title: "File Properties",
  4139. });
  4140. }
  4141. }
  4142. function initUploadMode(){
  4143. //Deprecated, will automatically decide which mode to use base on file size and disk space
  4144. /*
  4145. //Get the amount of RAM on the server side to check if low memory mode should be used.
  4146. $.ajax({
  4147. url: "../../system/info/getRAMinfo",
  4148. success: function(data){
  4149. if (data.error !== undefined){
  4150. //Permission denied or other reasons that cannot access harwdare info. Use default mode
  4151. lowMemoryMode = true;
  4152. }else{
  4153. //Check if ramsize > 3.8GB. If yes, switch to large memory upload mode
  4154. var memsize = JSON.parse(data);
  4155. if (parseFloat(memsize)/ 1024 / 1024 / 1024 >= 3.8){
  4156. console.log("[File Explorer] Entering large memory upload mode")
  4157. lowMemoryMode = false;
  4158. }
  4159. }
  4160. },
  4161. error: function(){
  4162. //Hardware mode disabled. Always use low memory upload mode instead
  4163. lowMemoryMode = true;
  4164. }
  4165. });
  4166. */
  4167. //Get the avaible space on tmp disk and decide the cutoff file size that need to directly write to disk
  4168. $.ajax({
  4169. url: "../../system/disk/space/tmp",
  4170. method: "POST",
  4171. data: {},
  4172. success: function(data){
  4173. if (data.error !== undefined){
  4174. console.log("[File Explorer] Unable to auto-detect huge file cutoff size: " + data.error);
  4175. }else{
  4176. if (!isNaN(data.Available) && data.Available > 0){
  4177. largeFileCutoffSize = data.Available/16 - 4096;
  4178. console.log("[File Explorer] Setting huge file cutoff size at: " + ao_module_utils.formatBytes(data.Available/16));
  4179. }else if (isNaN(data.Available)){
  4180. console.log("[File Explorer] Unable to read available tmp disk size. Using default huge file cutoff size.");
  4181. }
  4182. }
  4183. },
  4184. error: function(){
  4185. //Hardware mode disabled. Use default value.
  4186. }
  4187. });
  4188. }
  4189. function uploadFile(file, uuid=undefined, targetDir=undefined) {
  4190. if (file.size > postUploadModeCutoff && lowMemoryMode){
  4191. /*
  4192. Low Memory Upload Mode
  4193. */
  4194. var filename = encodeURIComponent(file.name);
  4195. var filesize = file.size;
  4196. //Generate a new file item
  4197. let taskUUID = uuid; //For queueing objects
  4198. if (taskUUID == undefined){
  4199. //If this is a new file to be uploaded
  4200. taskUUID = appendUploadFileItem(file.name, file.size);
  4201. setTimeout(function(){
  4202. updateUploadFileCount();
  4203. }, 100);
  4204. }
  4205. //Push to upload pending list if the max concurrent upload is reached
  4206. if (uploadingFileCount >= maxConcurrentUpload){
  4207. let uploadDir = currentPath;
  4208. if (targetDir !== undefined){
  4209. uploadDir = targetDir;
  4210. }else if (isFirefox && uploadDir == currentPath && file.webkitRelativePath != ""){
  4211. //Use the webkitRelativePath instead of the name, this is a folder upload
  4212. //Deprecated for Firefox 84.0.2 updates
  4213. /*
  4214. let pathinfo = file.webkitRelativePath.split("/");
  4215. pathinfo.pop();
  4216. let subpath = pathinfo.join("/");
  4217. uploadDir = uploadDir + subpath;
  4218. */
  4219. uploadDir = targetDir;
  4220. }
  4221. uploadPendingList.push({
  4222. File: file,
  4223. UUID: taskUUID,
  4224. TargetDir: JSON.parse(JSON.stringify(uploadDir)),
  4225. });
  4226. return
  4227. }
  4228. function updateProgressForWebSocketUpload(uuid, progress){
  4229. $(".uploadTask").each(function(){
  4230. if ($(this).attr("taskID") == uuid){
  4231. //Update this progress bar
  4232. $(this).find(".bar").css("width",progress + "%");
  4233. $(this).find(".progress.percentage").html(`<i class="ui upload icon"></i> ${progress.toFixed(1)}%`);
  4234. //console.log(progress.toFixed(1) + "%");
  4235. if (progress == 100){
  4236. //When progress = 100 and the server is not response with 200,
  4237. //That means the upload has finish and server is processing the upload
  4238. $(this).find(".progress").addClass("indicating");
  4239. //$(this).find(".progress.percentage").hide();
  4240. }
  4241. }
  4242. });
  4243. }
  4244. //Open the websocket
  4245. let path = currentPath;
  4246. let protocol = "wss://";
  4247. if (location.protocol !== 'https:') {
  4248. protocol = "ws://";
  4249. }
  4250. var port = window.location.port;
  4251. if (window.location.port == ""){
  4252. if (location.protocol !== 'https:') {
  4253. port = "80";
  4254. }else{
  4255. port = "443";
  4256. }
  4257. }
  4258. let uploadDir = currentPath;
  4259. if (targetDir !== undefined){
  4260. //Not uploading to current directory. Change upload path to target
  4261. uploadDir = targetDir;
  4262. }
  4263. //Fixing Firefox path issues on or above FF48.0
  4264. if (isFirefox && file.webkitRelativePath != ""){
  4265. //Use the webkitRelativePath instead of the name, this is a folder upload
  4266. let pathinfo = file.webkitRelativePath.split("/");
  4267. pathinfo.pop();
  4268. let subpath = pathinfo.join("/");
  4269. uploadDir = uploadDir + subpath;
  4270. //console.log("Firefox Mode: ", uploadDir, "Target Dir", targetDir)
  4271. }
  4272. let hugeFileMode = "";
  4273. if (file.size > largeFileCutoffSize){
  4274. //Filesize over cutoff line. Use huge file mode
  4275. hugeFileMode = "&hugefile=true";
  4276. }
  4277. let socket = new WebSocket(protocol + window.location.hostname + ":" + port + "/system/file_system/lowmemUpload?filename=" + encodeURIComponent(filename) + "&path=" + encodeURIComponent(uploadDir) + hugeFileMode);
  4278. let currentSendingIndex = 0;
  4279. let chunks = Math.ceil(file.size/uploadFileChunkSize);
  4280. // Per-chunk retry state
  4281. let chunkRetryCount = 0;
  4282. let chunkTimeoutTimer = null;
  4283. // Running CRC32 state across all chunks for full-file checksum
  4284. // Initialized to 0xFFFFFFFF (pre-conditioning), finalized with XOR at the end
  4285. let runningCRC32State = 0xFFFFFFFF;
  4286. // Track which chunk indices have already been factored into the running state
  4287. // so that retries do not corrupt the full-file CRC32
  4288. let chunkCRC32Committed = {};
  4289. // Store file reference in retry map so the user can retry on failure
  4290. uploadRetryMap.set(taskUUID, {file: file, targetDir: JSON.parse(JSON.stringify(uploadDir))});
  4291. // Mark an upload task as failed and reveal the retry button
  4292. function markUploadFailed(tUUID) {
  4293. clearTimeout(chunkTimeoutTimer);
  4294. $(".uploadTask").each(function(){
  4295. if ($(this).attr("taskID") == tUUID){
  4296. $(this).find(".bar").css("width","100%");
  4297. $(this).find(".progress:not(.percentage)").attr("class","ui tiny error progress");
  4298. $(this).find(".uploadTaskRemoveIcon").show();
  4299. $(this).find(".uploadTaskRetryBtn").show();
  4300. $(this).addClass("ended");
  4301. $(this).find(".progress.percentage").hide();
  4302. }
  4303. });
  4304. }
  4305. // Send a specific chunk by index.
  4306. // Reads the slice as ArrayBuffer, computes CRC32, sends metadata then binary.
  4307. // Sets a CHUNK_TIMEOUT_MS timer; on expiry retries up to MAX_CHUNK_RETRIES times.
  4308. async function sendChunk(id) {
  4309. var offsetStart = id * uploadFileChunkSize;
  4310. var offsetEnd = id * uploadFileChunkSize + uploadFileChunkSize;
  4311. var thisblob = file.slice(offsetStart, offsetEnd);
  4312. let arrayBuffer;
  4313. try {
  4314. arrayBuffer = await thisblob.arrayBuffer();
  4315. } catch(e) {
  4316. console.error("[Upload] Failed to read chunk " + id + ": " + e);
  4317. markUploadFailed(taskUUID);
  4318. return;
  4319. }
  4320. let bytes = new Uint8Array(arrayBuffer);
  4321. // Update the running full-file CRC32 only on the first attempt for each
  4322. // chunk index so that retries do not double-count the bytes
  4323. if (!chunkCRC32Committed[id]) {
  4324. runningCRC32State = crc32UpdateState(runningCRC32State, bytes);
  4325. chunkCRC32Committed[id] = true;
  4326. }
  4327. // Compute a standalone CRC32 for this chunk for transmission verification
  4328. let chunkCRCHex = crc32Hex(bytes);
  4329. // Protocol: text metadata frame, then binary data frame
  4330. socket.send(JSON.stringify({index: id, checksum: chunkCRCHex}));
  4331. socket.send(arrayBuffer);
  4332. // Update progress (cap at 95% to leave room for the merge phase)
  4333. var progress = chunks <= 1 ? 50 : (id / (chunks - 1) * 95.0);
  4334. if (progress > 95) progress = 95;
  4335. updateProgressForWebSocketUpload(taskUUID, progress);
  4336. // (Re)start the per-chunk acknowledgement timeout
  4337. clearTimeout(chunkTimeoutTimer);
  4338. chunkTimeoutTimer = setTimeout(function() {
  4339. if (chunkRetryCount < MAX_CHUNK_RETRIES) {
  4340. chunkRetryCount++;
  4341. console.warn("[Upload] Chunk " + id + " ACK timeout – retry " + chunkRetryCount + "/" + MAX_CHUNK_RETRIES);
  4342. sendChunk(id);
  4343. } else {
  4344. console.error("[Upload] Chunk " + id + " failed after " + MAX_CHUNK_RETRIES + " retries");
  4345. markUploadFailed(taskUUID);
  4346. socket.close();
  4347. }
  4348. }, CHUNK_TIMEOUT_MS);
  4349. }
  4350. //Update all UI elements
  4351. updateUploadFileCount();
  4352. uploadingFileCount++;
  4353. $(".uploadTask").each(function(){
  4354. if ($(this).attr("taskID") == taskUUID){
  4355. //This is the target upload task object. Hide its close button
  4356. $(this).find(".uploadTaskRemoveIcon").hide();
  4357. $(this).find(".uploadTaskRetryBtn").hide();
  4358. }
  4359. });
  4360. //Start sending
  4361. socket.onopen = async function(e) {
  4362. if (filesize < uploadFileChunkSize){
  4363. //This file is smaller than chunk size, set it to somewhere within 10% - 20% so it doesn't look like it is stuck
  4364. updateProgressForWebSocketUpload(taskUUID, 10 + Math.floor(Math.random() * 10));
  4365. }
  4366. //Send the first chunk
  4367. await sendChunk(0);
  4368. currentSendingIndex = 1;
  4369. };
  4370. socket.onmessage = async function(event) {
  4371. var incomingValue = event.data;
  4372. if (incomingValue == "next"){
  4373. // Server acknowledged the last chunk; clear timeout and reset retry counter
  4374. clearTimeout(chunkTimeoutTimer);
  4375. chunkRetryCount = 0;
  4376. if (currentSendingIndex >= chunks){
  4377. // All chunks sent and acknowledged – send done + full-file checksum
  4378. let finalCRC32Hex = ((runningCRC32State ^ 0xFFFFFFFF) >>> 0).toString(16).padStart(8, '0');
  4379. socket.send(JSON.stringify({done: true, totalChunks: chunks, fileChecksum: finalCRC32Hex}));
  4380. }else{
  4381. //Send next chunk
  4382. await sendChunk(currentSendingIndex);
  4383. currentSendingIndex++;
  4384. }
  4385. }else if (incomingValue == "OK"){
  4386. //Merge completed successfully
  4387. uploadRetryMap.delete(taskUUID);
  4388. $(".uploadTask").each(function(){
  4389. if ($(this).attr("taskID") == taskUUID){
  4390. //Update this progress bar to completed
  4391. $(this).find(".bar").css("width","100%");
  4392. $(this).find(".progress:not(.percentage)").attr("class", "ui tiny success progress");
  4393. $(this).find(".progress.percentage").hide();
  4394. $(this).find(".uploadTaskRemoveIcon").show();
  4395. $(this).find(".uploadTaskRetryBtn").hide();
  4396. $(this).addClass("ended");
  4397. $.when($(this).delay(1000).fadeOut("fast")).then(function(){
  4398. $(this).remove();
  4399. updateUploadFileCount();
  4400. });
  4401. }
  4402. });
  4403. }else{
  4404. //Try to parse it as JSON
  4405. try{
  4406. var resp = JSON.parse(incomingValue);
  4407. if (resp.error !== undefined){
  4408. //Server reported an error
  4409. msgbox("red remove", resp.error);
  4410. markUploadFailed(taskUUID);
  4411. }else if (resp.retryChunk !== undefined){
  4412. // Server detected a CRC32 mismatch and requests a chunk re-send
  4413. clearTimeout(chunkTimeoutTimer);
  4414. if (chunkRetryCount < MAX_CHUNK_RETRIES){
  4415. chunkRetryCount++;
  4416. console.warn("[Upload] Server requested retry for chunk " + resp.retryChunk + " (CRC32 mismatch) – retry " + chunkRetryCount + "/" + MAX_CHUNK_RETRIES);
  4417. await sendChunk(resp.retryChunk);
  4418. } else {
  4419. console.error("[Upload] Chunk " + resp.retryChunk + " CRC32 mismatch after max retries");
  4420. markUploadFailed(taskUUID);
  4421. socket.close();
  4422. }
  4423. }else if (resp.move !== undefined){
  4424. //File move from tmp to archive – show progress
  4425. $(".uploadTask").each(function(){
  4426. if ($(this).attr("taskID") == taskUUID){
  4427. $(this).find(".bar").css("width","100%");
  4428. $(this).find(".progress:not(.percentage)").attr("class","ui small indicating themed saving progress");
  4429. $(this).find(".progress.percentage").html(`<i class="ui save icon"></i> ${resp.move}`);
  4430. }
  4431. });
  4432. }
  4433. }catch(ex){
  4434. //Something else
  4435. console.log(incomingValue);
  4436. console.log(ex);
  4437. }
  4438. }
  4439. };
  4440. socket.onclose = function(event) {
  4441. clearTimeout(chunkTimeoutTimer);
  4442. uploadingFileCount--;
  4443. updateUploadFileCount();
  4444. //After the previous file has uploaded / errored, check if there are another file needed to be uploaded
  4445. setTimeout(function(){
  4446. if (uploadPendingList.length > 0){
  4447. let nextFile = uploadPendingList.shift();
  4448. uploadFile(nextFile.File, nextFile.UUID, nextFile.TargetDir);
  4449. }
  4450. }, 100)
  4451. };
  4452. socket.onerror = function(error) {
  4453. console.error("[Upload] WebSocket error:", error);
  4454. // Mark the task as failed and show the retry button
  4455. markUploadFailed(taskUUID);
  4456. };
  4457. }else{
  4458. /*
  4459. Standard Upload Mode
  4460. */
  4461. //Create the task progress Object
  4462. let taskUUID = uuid; //For queueing objects
  4463. if (taskUUID == undefined){
  4464. //If this is a new file to be uploaded
  4465. taskUUID = appendUploadFileItem(file.name, file.size);
  4466. setTimeout(function(){
  4467. updateUploadFileCount();
  4468. }, 100);
  4469. }
  4470. //TODO: Make the upload management interface a bit better
  4471. //return;
  4472. //Updates 22-10-2020
  4473. //Added file upload queuing system to prevent too many request on-the-fly at the same time
  4474. if (uploadingFileCount >= maxConcurrentUpload){
  4475. //Push to upload pending list
  4476. //Sometime files will be recursively uploaded (aka retry multiple time), hence the targetDir needed to be copied as well
  4477. let uploadDir = currentPath;
  4478. if (targetDir !== undefined){
  4479. uploadDir = targetDir;
  4480. }
  4481. uploadPendingList.push({
  4482. File: file,
  4483. UUID: taskUUID,
  4484. TargetDir: JSON.parse(JSON.stringify(uploadDir)),
  4485. });
  4486. return
  4487. }
  4488. //Prase upload Form
  4489. let uploadCurrentPath = JSON.parse(JSON.stringify(currentPath));
  4490. if (targetDir !== undefined){
  4491. //The upload paramter supplied targetDir
  4492. uploadCurrentPath = targetDir;
  4493. }
  4494. let url = '../../system/file_system/upload?path=' + encodeURIComponent(uploadCurrentPath)
  4495. //console.log("Uploading To => ", uploadCurrentPath, targetDir, currentPath);
  4496. let formData = new FormData()
  4497. let xhr = new XMLHttpRequest()
  4498. formData.append('file', file);
  4499. formData.append('path', uploadCurrentPath);
  4500. //Hide the cancel upload task button
  4501. $(".uploadTask").each(function(){
  4502. if ($(this).attr("taskID") == taskUUID){
  4503. //This is the target upload task object. Hide its close button
  4504. $(this).find(".uploadTaskRemoveIcon").hide();
  4505. }
  4506. });
  4507. xhr.open('POST', url, true)
  4508. xhr.upload.addEventListener("progress", function(e) {
  4509. var progress = (e.loaded * 100.0 / e.total) || 100;
  4510. $(".uploadTask").each(function(){
  4511. if ($(this).attr("taskID") == taskUUID){
  4512. //Update this progress bar
  4513. $(this).find(".bar").css("width",progress + "%");
  4514. $(this).find(".progress.percentage").text(progress.toFixed(1) + "%");
  4515. if (progress == 100){
  4516. //When progress = 100 and the server is not response with 200,
  4517. //That means the upload has finish and server is processing the upload
  4518. $(this).find(".progress").addClass("active");
  4519. $(this).find(".progress.percentage").hide();
  4520. }
  4521. }
  4522. });
  4523. })
  4524. xhr.addEventListener('readystatechange', function(e) {
  4525. if (xhr.readyState == 4 && xhr.status == 200) {
  4526. //Upload process ended
  4527. //Update task status
  4528. $(".uploadTask").each(function(){
  4529. if ($(this).attr("taskID") == taskUUID){
  4530. //Update this progress bar to completed
  4531. $(this).find(".bar").css("width","100%");
  4532. $(this).find(".progress").attr("class", "ui tiny success progress");
  4533. $(this).find(".uploadTaskRemoveIcon").show();
  4534. $(this).addClass("ended");
  4535. //Update 15-11-2020
  4536. //Remove this taskbar after 1 second to prevent lags during > 2000 uploads
  4537. $.when($(this).delay(1000).fadeOut("fast")).then(function(){
  4538. $(this).remove();
  4539. updateUploadFileCount();
  4540. });
  4541. }
  4542. });
  4543. var resp = JSON.parse(e.target.response);
  4544. if (resp.error !== undefined){
  4545. msgbox("caution",resp.error);
  4546. //Something went wrong. Set the color to red
  4547. $(".uploadTask").each(function(){
  4548. if ($(this).attr("taskID") == taskUUID){
  4549. //Update this progress bar to completed
  4550. $(this).find(".bar").css("width","100%");
  4551. $(this).find(".progress").attr("class", "ui tiny error progress");
  4552. $(this).find(".uploadTaskRemoveIcon").show();
  4553. $(this).addClass("ended");
  4554. }
  4555. });
  4556. }
  4557. uploadingFileCount--;
  4558. //After the previous file has uploaded / errored, check if there are another file needed to be uploaded
  4559. setTimeout(function(){
  4560. if (uploadPendingList.length > 0){
  4561. let nextFile = uploadPendingList.shift();
  4562. uploadFile(nextFile.File, nextFile.UUID, nextFile.TargetDir);
  4563. }
  4564. }, 100)
  4565. }else if (xhr.readyState == 4 && xhr.status != 200) {
  4566. msgbox("red remove",applocale.getString( "message/uploadFailed", "File too big or the target disk is fulled"));
  4567. console.log(xhr);
  4568. $(".uploadTask").each(function(){
  4569. if ($(this).attr("taskID") == taskUUID){
  4570. //Upload screwed up. Show error
  4571. $(this).find(".progress").attr("class","ui tiny error progress");
  4572. $(this).find(".uploadTaskRemoveIcon").show();
  4573. $(this).addClass("ended");
  4574. }
  4575. });
  4576. uploadingFileCount--;
  4577. //After the previous file has uploaded / errored, check if there are another file needed to be uploaded
  4578. setTimeout(function(){
  4579. if (uploadPendingList.length > 0){
  4580. let nextFile = uploadPendingList.shift();
  4581. uploadFile(nextFile.File, nextFile.UUID, nextFile.TargetDir);
  4582. }
  4583. }, 100)
  4584. }
  4585. updateUploadFileCount();
  4586. })
  4587. xhr.send(formData);
  4588. uploadingFileCount++;
  4589. updateUploadFileCount();
  4590. }
  4591. }
  4592. //Clear all finished upload tasks
  4593. function clearAllUploadTask(){
  4594. $(".uploadTask.ended").slideUp('300',function(){
  4595. $(this).remove();
  4596. updateUploadFileCount();
  4597. });
  4598. }
  4599. function toggleSearch(){
  4600. //Start search mode
  4601. $(".searchbar").show()
  4602. initWindowSizes(true);
  4603. $("#searhbtn").addClass("disabled");
  4604. //Force videmode to list
  4605. viewModeBeforeSearch = viewMode;
  4606. viewMode = "list"
  4607. $(".videmode.button").each(function(){
  4608. $(this).addClass('disabled');
  4609. });
  4610. searchMode = true;
  4611. //Adjust the css for mobile interface
  4612. if (isMobile){
  4613. $("#searchInput").parent().parent().css("width", window.innerWidth - 135 + "px");
  4614. }
  4615. //Clear current folderlist
  4616. $("#folderList").show();
  4617. $("#folderList").html(`<div class="ui basic segment">
  4618. <div class="ui header themed">
  4619. <i class="arrow up icon"></i> <span>${applocale.getString("func/search/typeToStart", "Type to Start Search")}</span>
  4620. <div class="sub header" style="margin-top:12px;">${applocale.getString("func/search/tip1", "Type something in the search bar to start searching.")}<br>
  4621. ${applocale.getString("func/search/tip2", `Start wildcard matching with "/" (slash) and your wildcard string (e.g. /*.mp3)`)}</div>
  4622. </div>
  4623. </div>`);
  4624. $("#fileList").hide();
  4625. }
  4626. function hideSearchBar(skipFilelistRefresh = false){
  4627. $(".searchbar").hide();
  4628. initWindowSizes(true);
  4629. $("#searchInput").val("");
  4630. $("#searhbtn").removeClass("disabled");
  4631. viewMode = viewModeBeforeSearch;
  4632. $(".videmode.button").each(function(){
  4633. if ($(this).attr("mode") != viewMode){
  4634. $(this).removeClass('disabled');
  4635. }
  4636. });
  4637. if (skipFilelistRefresh == false){
  4638. listDirectory(currentPath);
  4639. }
  4640. searchMode = false;
  4641. }
  4642. //Handle case sensitive in keyword searching
  4643. function toggleCaseSensitive(btn){
  4644. if ($(btn).hasClass("active")){
  4645. $(btn).removeClass("active");
  4646. searchCaseSensitive = false;
  4647. }else{
  4648. $(btn).addClass("active");
  4649. searchCaseSensitive = true;
  4650. }
  4651. }
  4652. function exitHotSearch(){
  4653. hotSearchBuffer = "";
  4654. hotSearchTimer = null;
  4655. //Move the file to "selected" mode
  4656. $(".hotSearchHighlight").addClass("selected");
  4657. $(".hotSearchHighlight").removeClass("hotSearchHighlight");
  4658. }
  4659. function handleHotSearch(starting, offset){
  4660. if (offset < 0){
  4661. offset = 0;
  4662. }
  4663. starting = starting.toLowerCase();
  4664. console.log(starting);
  4665. $(".hotSearchHighlight").removeClass("hotSearchHighlight");
  4666. let files = $(".fileObject");
  4667. let matchingFiles = [];
  4668. for (var i = 0; i < files.length; i++){
  4669. let thisFile = files[i];
  4670. if ($(thisFile).attr("filename") != undefined && $(thisFile).attr("filename").length > starting.length && $(thisFile).attr("filename").substr(0, starting.length).toLowerCase() == starting){
  4671. matchingFiles.push(thisFile);
  4672. }
  4673. }
  4674. //Loopback if offset overflow
  4675. let newOffset = offset;
  4676. if (offset > matchingFiles.length - 1){
  4677. newOffset =offset % matchingFiles.length;
  4678. }
  4679. var targetHighlightingFile = matchingFiles[newOffset];
  4680. $(targetHighlightingFile).addClass("hotSearchHighlight");
  4681. scrollToFileLocation($(targetHighlightingFile));
  4682. return;
  4683. }
  4684. function handleSearch(){
  4685. var keyword = $("#searchInput").val();
  4686. $("#folderList").html(`<div class="ui basic segment">
  4687. <i class="loading spinner icon"></i> <span>Searching</span>
  4688. </div>`);
  4689. $("#fileList").hide();
  4690. $("#fileList").html("");
  4691. $.ajax({
  4692. url: "../../system/file_system/search",
  4693. data: {path: currentPath, keyword: keyword, casesensitive: searchCaseSensitive},
  4694. success: function(data){
  4695. if (data.error !== undefined){
  4696. msgbox("red remove", applocale.getString("message/" + data.error, data.error));
  4697. hideSearchBar();
  4698. }else{
  4699. //Render the filelist
  4700. console.log(data);
  4701. if (data.length == 0){
  4702. $("#folderList").show();
  4703. $("#folderList").html(`<div class="ui basic segment">
  4704. <div class="ui header">
  4705. <i class="question icon"></i> <span>${applocale.getString("message/noMatchResults","No Matching Results")}</span>
  4706. <div class="sub header">${applocale.getString("message/noMatchResultsDesc","The host return no matching results for your keyword")} "${keyword}". <br>${applocale.getString("message/noMatchResultsInst","Check your spelling and your wildcard characters.")}</div>
  4707. </div>
  4708. </div>`);
  4709. }else{
  4710. renderDirectory(data);
  4711. }
  4712. }
  4713. }, error: function(){
  4714. $("#folderList").html(`<div class="ui basic segment">
  4715. <div class="ui header">
  4716. <i class="remove icon"></i> Search Error
  4717. <div class="sub header">Search timeout</div>
  4718. </div>
  4719. </div>`);
  4720. }
  4721. })
  4722. }
  4723. function handleSearchBarPress(e){
  4724. if (e.keyCode == 13 || e.key == "Enter"){
  4725. e.preventDefault();
  4726. handleSearch();
  4727. }
  4728. }
  4729. function toggleCtrl(){
  4730. ctrlHold = !ctrlHold;
  4731. updateCtrlDisplay();
  4732. }
  4733. function selectAll(){
  4734. $(".fileObject").addClass("selected");
  4735. updateSelectedObjectsCount();
  4736. }
  4737. function clearSelection(){
  4738. $('.fileObject.selected').removeClass("selected");
  4739. updateSelectedObjectsCount();
  4740. if (ctrlHold){
  4741. //Deselect everything, also exit multi-select mode
  4742. ctrlHold = false;
  4743. updateCtrlDisplay();
  4744. }
  4745. }
  4746. function updateCtrlDisplay(){
  4747. if (isMobile){
  4748. //Change color of the navibar based on selection mode
  4749. if (ctrlHold){
  4750. $("#navibar").addClass("ctrl");
  4751. }else{
  4752. $("#navibar").removeClass("ctrl");
  4753. }
  4754. }
  4755. }
  4756. function getUploadTaskByID(taskUUID){
  4757. var task = undefined;
  4758. $("#uploadTab").find(".uploadTask").each(function(){
  4759. if ($(this).attr("taskid") == taskUUID){
  4760. task = $(this);
  4761. }
  4762. });
  4763. return task;
  4764. }
  4765. function appendUploadFileItem(filename, filesize){
  4766. var newuuid = uuidv4();
  4767. var humanReadableFilesize = 0;
  4768. if (filesize < 0){
  4769. humanReadableFilesize = applocale.getString("message/unknownSize", "Unknown Size")
  4770. }else{
  4771. humanReadableFilesize = bytesToSize(filesize);
  4772. }
  4773. $("#uploadProgressList").append(`<div class="uploadTask" taskID="${newuuid}">
  4774. <p style="width: calc(100% - 15px);">${filename} (${humanReadableFilesize})</p>
  4775. <div class="ui small themed progress" style="margin-top:-12px;">
  4776. <div class="bar" style="width: 0%; min-width: 0px;">
  4777. <div class="progress percentage"></div>
  4778. </div>
  4779. </div>
  4780. <div class="uploadTaskRetryBtn" onclick="retryUploadFile('${newuuid}');" style="display:none; cursor:pointer; float:left; margin-right:4px;" title="Retry upload">
  4781. <i class="redo icon"></i>
  4782. </div>
  4783. <div class="uploadTaskRemoveIcon" onclick="removeThisTask(this, '${newuuid}');" style="">
  4784. <i class="remove icon"></i>
  4785. </div>
  4786. </div>`);
  4787. return newuuid;
  4788. }
  4789. function retryUploadFile(taskUUID){
  4790. let retryInfo = uploadRetryMap.get(taskUUID);
  4791. if (!retryInfo){
  4792. console.warn("[Upload] No retry info found for task " + taskUUID);
  4793. return;
  4794. }
  4795. // Reset the task UI back to pending state
  4796. $(".uploadTask").each(function(){
  4797. if ($(this).attr("taskID") == taskUUID){
  4798. $(this).removeClass("ended");
  4799. $(this).find(".bar").css("width","0%");
  4800. $(this).find(".progress:not(.percentage)").attr("class","ui small themed progress");
  4801. $(this).find(".progress.percentage").text("").show();
  4802. $(this).find(".uploadTaskRetryBtn").hide();
  4803. $(this).find(".uploadTaskRemoveIcon").hide();
  4804. }
  4805. });
  4806. // Re-queue the file for upload using the same task UUID
  4807. uploadFile(retryInfo.file, taskUUID, retryInfo.targetDir);
  4808. }
  4809. function removeThisTask(object, taskUUID){
  4810. //Remove item from uploadPendingList
  4811. let removeId = -1;
  4812. for (var i = 0; i < uploadPendingList.length; i++){
  4813. if (uploadPendingList[i].UUID == taskUUID){
  4814. removeId = i;
  4815. break;
  4816. }
  4817. }
  4818. if (removeId >= 0){
  4819. uploadPendingList.splice(removeId, 1);
  4820. }
  4821. //Remove the DOM Element
  4822. $(object).parent().fadeOut('fast',
  4823. function(){
  4824. $(this).remove();
  4825. updateUploadFileCount();
  4826. }
  4827. );
  4828. }
  4829. function toggleUploadList(){
  4830. $("#uploadProgressList").toggle();
  4831. if ($("#uploadProgressList").is(":visible")){
  4832. $("#hideUploadButton").html('<i class="caret down icon"></i>');
  4833. }else{
  4834. $("#hideUploadButton").html('<i class="caret up icon"></i>');
  4835. }
  4836. }
  4837. function updateUploadFileCount(){
  4838. $("#uploadCount").text(uploadingFileCount);
  4839. $("#waitingCount").text(uploadPendingList.length);
  4840. if (uploadingFileCount == 0 && $(".uploadTask").length == 0){
  4841. $("#uploadTab").hide();
  4842. }else{
  4843. $("#uploadTab").show();
  4844. }
  4845. }
  4846. function bytesToSize(bytes) {
  4847. var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB'];
  4848. if (bytes == 0) return '0 Byte';
  4849. var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
  4850. return Math.round(bytes / Math.pow(1024, i) * 100, 2) / 100 + ' ' + sizes[i];
  4851. }
  4852. function uuidv4() {
  4853. return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
  4854. var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
  4855. return v.toString(16);
  4856. });
  4857. }
  4858. function dropToFolder(event){
  4859. event.preventDefault();
  4860. event.stopImmediatePropagation();
  4861. console.log("Drop to folder detected");
  4862. //Extract target folder path from object
  4863. var targetPath = $(event.target).attr("filepath");
  4864. if (targetPath == ""){
  4865. return
  4866. }
  4867. //Check if this is upload or file move drag
  4868. var files = event.dataTransfer.files;
  4869. if (files.length > 0){
  4870. //Upload mode. Extract the target folder basename from path
  4871. if (targetPath.substr(targetPath.length -1,1) == "/"){
  4872. targetPath = targetPath.substr(0, targetPath.length-1);
  4873. }
  4874. var folderBase = targetPath.split("/").pop() + "/";
  4875. var items = event.dataTransfer.items;
  4876. for (let i=0; i<items.length; i++) {
  4877. let item = items[i].webkitGetAsEntry();
  4878. if (item) {
  4879. recursiveScanFilesUpload(item, folderBase, folderBase);
  4880. }
  4881. }
  4882. }else if (event.dataTransfer.getData("filedata") != ""){
  4883. var targetVroot = targetPath.split(":/").shift();
  4884. //Get the source files
  4885. var filelist = JSON.parse(event.dataTransfer.getData("filedata"));
  4886. if (filelist.length > 0){
  4887. var srcVroot = filelist[0].filepath.split(":/").shift();
  4888. if (srcVroot == targetVroot){
  4889. //Use move mode
  4890. cutMode = true;
  4891. }else{
  4892. //Use copy mode
  4893. cutMode = false;
  4894. }
  4895. //Parse the filelist
  4896. clipboard = [];
  4897. filelist.forEach(file=>{
  4898. clipboard.push(file.filepath);
  4899. });
  4900. if (useLocalstorage){
  4901. localStorage.setItem("ao/file_system/clipboard",JSON.stringify(clipboard));
  4902. localStorage.setItem("ao/file_system/cutmode","true");
  4903. }
  4904. //Perform operations
  4905. paste(targetPath, false)
  4906. }
  4907. }
  4908. }
  4909. function allowDrop(event){
  4910. event.preventDefault();
  4911. }
  4912. $(".popupWrapper").on("click",function(){
  4913. hideAllPopupWindows();
  4914. });
  4915. function hideAllPopupWindows(){
  4916. $(".popup:visible").transition('slide left out');
  4917. $(".popupWrapper").fadeOut(100);
  4918. $('body').css("overflow","");
  4919. if($("#shareFile").is(":visible")){
  4920. $("#shareFileEmbedded").attr("src", "");
  4921. }
  4922. }
  4923. function showPopupWrapper(){
  4924. $(".popupWrapper").fadeIn('fast');
  4925. $('body').css("overflow","hidden");
  4926. }
  4927. //Handle keydown of enter on certain input boxes
  4928. function handleEnterKeyDown(event, handler){
  4929. if (event.which == 13){
  4930. handler();
  4931. }
  4932. }
  4933. //Generate a download link and press it
  4934. function generateDownloadFromURL(url, filename){
  4935. let a = document.createElement('a')
  4936. a.href = url;
  4937. a.download = filename;
  4938. document.body.appendChild(a)
  4939. a.click()
  4940. document.body.removeChild(a)
  4941. }
  4942. //Update sorting method for file listing
  4943. function updateSortingMethods(){
  4944. var method = $("#sortingMethodSelector").val();
  4945. sortMode = method;
  4946. //Save it to server side
  4947. $.ajax({
  4948. url: "../../system/file_system/sortMode",
  4949. method: "POST",
  4950. data: {opr: "set", folder: currentPath, mode: sortMode},
  4951. success: function(data){
  4952. //console.log("Sort mode saved: " + data)
  4953. refreshList();
  4954. }
  4955. });
  4956. }
  4957. /*
  4958. Properties Sidebar
  4959. */
  4960. function loadFileProperties(filepath){
  4961. $.ajax({
  4962. url: "../../system/file_system/getProperties",
  4963. method: "POST",
  4964. data: {path: filepath},
  4965. success: function(data){
  4966. if (data.error !== undefined){
  4967. //Failed to load
  4968. }else{
  4969. let previewSidebar = $("#propertiesView");
  4970. //Check the extension. If the extension is image supported
  4971. //by web browser, enable full resolution button
  4972. let enableFullResButton = false;
  4973. if (!data.IsDirectory && data.Basename.indexOf(".") >= 0){
  4974. let ext = data.Basename.split(".").pop().toLowerCase();
  4975. if (ext == "jpeg" || ext == "jpg" || ext == "webp" || ext == "png" || ext == "gif"){
  4976. //Web preview-able formats
  4977. }
  4978. }
  4979. //Load the preview
  4980. fetch("../../system/file_system/loadThumbnail?vpath=" + encodeURIComponent(data.VirtualPath))
  4981. .then((response) => response.json())
  4982. .then((imageData) => {
  4983. if (imageData.error !== undefined || imageData.trim() == ""){
  4984. //Image load error.
  4985. if (data.IsDirectory){
  4986. //Load the folder image
  4987. $(previewSidebar).find(".preview img").attr("src", "../../img/system/folder.svg")
  4988. }else{
  4989. let icon = "file outline";
  4990. let ext = data.Basename.split(".").pop().toLowerCase();
  4991. if (ext != ""){
  4992. icon = ao_module_utils.getIconFromExt(ext);
  4993. }
  4994. let imagePath = "../../img/desktop/files_icon/default/" + icon + ".png";
  4995. $(previewSidebar).find(".preview img").attr("src", imagePath);
  4996. }
  4997. return;
  4998. }
  4999. $(previewSidebar).find(".preview img").attr('src',"data:image/jpg;base64," + imageData);
  5000. });
  5001. //Render the remaining information
  5002. $("#propertiesView").find(".filename").text(data.Basename);
  5003. $("#propertiesView").find(".vpath").text(data.VirtualPath);
  5004. let propTable = $("#propertiesView").find(".propertiesTable");
  5005. let styleOverwrite = `min-width: 4em;`;
  5006. $(propTable).html("");
  5007. $(propTable).append(`<tr>
  5008. <td style="${styleOverwrite}">
  5009. ${applocale.getString("sidebar/properties/filesize", "File Size")}
  5010. </td>
  5011. <td>
  5012. ${bytesToSize(data.Filesize)}
  5013. </td>
  5014. </tr><tr>
  5015. <td style="${styleOverwrite}">
  5016. ${applocale.getString("sidebar/properties/modtime", "Last Modification")}
  5017. </td>
  5018. <td>
  5019. ${data.LastModTime}
  5020. </td>
  5021. </tr><tr>
  5022. <td style="${styleOverwrite}">
  5023. ${applocale.getString("sidebar/properties/mimetype", "MIME Type")}
  5024. </td>
  5025. <td>
  5026. ${data.MimeType}
  5027. </td>
  5028. </tr><tr>
  5029. <td style="${styleOverwrite}">
  5030. ${applocale.getString("sidebar/properties/owner", "Owner")}
  5031. </td>
  5032. <td>
  5033. ${data.Owner}
  5034. </td>
  5035. </tr><tr>
  5036. <td style="${styleOverwrite}">
  5037. ${applocale.getString("sidebar/properties/permission", "Permission")}
  5038. </td>
  5039. <td>
  5040. ${data.Permission}
  5041. </td>
  5042. </tr><tr>
  5043. <td style="${styleOverwrite}">
  5044. ${applocale.getString("sidebar/properties/storepath", "Storage Path")}
  5045. </td>
  5046. <td style="word-break: break-all;">
  5047. ${data.StoragePath}
  5048. </td>
  5049. </tr><tr>
  5050. <td style="${styleOverwrite}">
  5051. ${applocale.getString("sidebar/properties/vpath", "Virtualized Path")}
  5052. </td>
  5053. <td style="word-break: break-all;">
  5054. ${data.VirtualPath}
  5055. </td>
  5056. </tr>`);
  5057. }
  5058. }
  5059. })
  5060. }
  5061. //Toggle preview windows size from small to large mode,
  5062. //set restoreDefault to true for force small interface
  5063. function togglePreviewWindowSize(restoreDefault = false){
  5064. if ($("#propertiesView").hasClass("small") && restoreDefault == false){
  5065. //Set it to big
  5066. $("#propertiesView").css({
  5067. "width": "500px",
  5068. "min-width": "500px"
  5069. });
  5070. $("#propertiesView").removeClass("small").addClass("big");
  5071. $("#propertiesView").find(".sizeToggle").html(`<i class="compress icon"></i>`);
  5072. $("#propertiesView").find(".sizeToggle").attr("title", applocale.getString("sidebar/properties/shrink", "Shrink Properties Sidebar"));
  5073. }else{
  5074. //Set it to small
  5075. $("#propertiesView").css({
  5076. "width": "300px",
  5077. "min-width": "300px"
  5078. });
  5079. $("#propertiesView").removeClass("big").addClass("small");
  5080. $("#propertiesView").find(".sizeToggle").html(`<i class="expand icon"></i>`);
  5081. $("#propertiesView").find(".sizeToggle").attr("title", applocale.getString("sidebar/properties/expand", "Expand Properties Sidebar"));
  5082. }
  5083. }
  5084. /*
  5085. Integration functions
  5086. */
  5087. //Request CSRF token before any file operation API Calls for better security
  5088. function requestCSRFToken(callback){
  5089. $.ajax({
  5090. url: "../../system/csrf/new",
  5091. success: function(token){
  5092. callback(token);
  5093. }
  5094. })
  5095. }
  5096. //Overwrite of the ao_module_close
  5097. function ao_module_close(){
  5098. if (uploadPendingList.length > 0 || uploadingFileCount > 0){
  5099. //There are pending upload item or uploading items
  5100. //ask the user to confirm exit
  5101. hideAllPopupWindows();
  5102. showPopupWrapper();
  5103. $("#confirmExit").transition("slide left in");
  5104. return
  5105. }
  5106. //Exit window
  5107. ao_module_closeHandler();
  5108. }
  5109. </script>
  5110. </body>
  5111. </html>