file_explorer_legacy.html 255 KB

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