file_explorer.html 252 KB

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