UNPKG

ellipsis-folders

Version:
1 lines 18.4 kB
!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var s=t();for(var i in s)("object"==typeof exports?exports:e)[i]=s[i]}}(self,(function(){return(()=>{"use strict";var e={d:(t,s)=>{for(var i in s)e.o(s,i)&&!e.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:s[i]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{EllipsisDrive:()=>i});const s=class{folders=[];blocks=[];text=void 0;name=void 0;id=void 0;root=!1;showExpanded=!1;foldersExpanded=!1;trueRoot=!1;depth=0;constructor(e,t,s,i=0,l=!1){this.text=e,this.name=t,this.id=s,this.root=l,this.blocks=[],this.folders=[],this.depth=i}},i=class{BLUE="#089EC8";GRAY="rgba(0, 0, 0, 0.87)";SVGGRAY="rgba(0, 0, 0, 0.54)";APIURL="https://api.ellipsis-drive.com/v3";DEPTHFACTOR=30;DEPTHCONSTANT=0;isValidTimestamp=e=>"active"!==e.status?{available:!1,reason:"Timestamp not active"}:e.availability.blocked?{available:!1,reason:e.availability.reason}:{available:!0};isValidMap=e=>e?"raster"!==e.type&&"vector"!==e.type?{available:!0}:e.disabled?{available:!1,reason:"Layer disabled"}:e.deleted?{available:!1,reason:"Layer trashed"}:0===e.yourAccess.accessLevel?{available:!1,reason:"No access"}:0===e[e.type].timestamps.filter((t=>this.isValidTimestamp(t,e).available)).length?e[e.type].timestamps.find((e=>"relocation"===e.availability?.reason))?{available:!1,reason:"Relocating layer"}:e[e.type].timestamps.find((e=>"reindexing"===e.availability?.reason))?{available:!1,reason:"Reindexing layer"}:"raster"===e.type&&0===e[e.type].timestamps.filter((e=>e.uploads.completed>0)).length?{available:!1,reason:"No uploads"}:e[e.type].timestamps.find((e=>"activating"===e.status))?{available:!1,reason:"Activating files"}:e[e.type].timestamps.find((e=>"pausing"===e.status))?{available:!1,reason:"Pausing files"}:e[e.type].timestamps.find((e=>"created"===e.status))?{available:!1,reason:"No active timestamps"}:{available:!1,reason:"No timestamps"}:{available:!0}:{available:!1,reason:"No Layer"};debounce=(e,t=300)=>{let s;return(...i)=>{clearTimeout(s),s=setTimeout((()=>{e.apply(this,i)}),t)}};arrowDown=(e=0)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","svg");return t.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M7 10l5 5 5-5z"></path></svg>',t.style.fill=this.SVGGRAY,t.style.height="15px",t.style.width="15px",t.style.cursor="pointer",t.style.transition="transform 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms",t.style.marginLeft=`${this.DEPTHCONSTANT+this.DEPTHFACTOR*e}px`,t.classList.add("ellipsis-folder-arrow-down"),t};arrowRight=(e=0)=>{let t=this.arrowDown(e);return t.classList.remove("ellipsis-folder-arrow-down"),t.classList.add("ellipsis-folder-arrow-right"),t.style.transform="rotate(-90deg)",t};refreshSVG=(e=0)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","svg");return t.innerHTML='\n <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" enable-background="new 0 0 65 65" y="0px" x="0px" viewBox="0 0 65 65">\n <path d="m32.5 4.999c-5.405 0-10.444 1.577-14.699 4.282l-5.75-5.75v16.11h16.11l-6.395-6.395c3.18-1.787 6.834-2.82 10.734-2.82 12.171 0 22.073 9.902 22.073 22.074 0 2.899-0.577 5.664-1.599 8.202l4.738 2.762c1.47-3.363 2.288-7.068 2.288-10.964 0-15.164-12.337-27.501-27.5-27.501z"/>\n <path d="m43.227 51.746c-3.179 1.786-6.826 2.827-10.726 2.827-12.171 0-22.073-9.902-22.073-22.073 0-2.739 0.524-5.35 1.439-7.771l-4.731-2.851c-1.375 3.271-2.136 6.858-2.136 10.622 0 15.164 12.336 27.5 27.5 27.5 5.406 0 10.434-1.584 14.691-4.289l5.758 5.759v-16.112h-16.111l6.389 6.388z"/>\n </svg>',t.style.height="15px",t.style.width="15px",t.style.cursor="pointer",t.setAttribute("viewBox","0 0 24 24"),t.style.fill=this.BLUE,t};getFolderSVG=(e,t=0)=>{const s=document.createElementNS("http://www.w3.org/2000/svg","svg");switch(s.style.height="23px",s.style.width="23px",s.style.position="relative",s.style.bottom="5px",s.style.fill=this.SVGGRAY,s.style.cursor="pointer",s.style.marginLeft=`${this.DEPTHCONSTANT+this.DEPTHFACTOR*t+10}px`,s.style.float="left",s.classList.add("ellipsis-folder-icon"),e){case"myDrive":s.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.09 5.37516C10.71 4.99516 10.2 4.78516 9.67 4.78516H4.5C3.4 4.78516 2.51 5.68516 2.51 6.78516L2.5 18.7852C2.5 19.8852 3.4 20.7852 4.5 20.7852H20.5C21.6 20.7852 22.5 19.8852 22.5 18.7852V8.78516C22.5 7.68516 21.6 6.78516 20.5 6.78516H12.5L11.09 5.37516ZM15.502 16.8819C14.7572 16.8818 14.0374 16.6134 13.4745 16.1257C12.9116 15.6381 12.5433 14.9641 12.4372 14.227H15.502V13.3459H12.4372C12.5136 12.8141 12.727 12.3113 13.0566 11.8869C13.3862 11.4626 13.8205 11.1313 14.317 10.9256C14.8135 10.7199 15.355 10.6469 15.8882 10.7138C16.4214 10.7807 16.9281 10.9852 17.3583 11.3072L18.0025 10.6632C17.4141 10.192 16.7045 9.89662 15.9555 9.81103C15.2065 9.72545 14.4485 9.85315 13.769 10.1794C13.0894 10.5057 12.5158 11.0173 12.1144 11.6552C11.713 12.2932 11.5 13.0315 11.5 13.7852C11.5 14.5388 11.713 15.2772 12.1144 15.9151C12.5158 16.553 13.0894 17.0646 13.769 17.3909C14.4485 17.7172 15.2065 17.8449 15.9555 17.7593C16.7045 17.6737 17.4141 17.3783 18.0025 16.9071L17.3583 16.2632C16.8232 16.6655 16.1716 16.8827 15.502 16.8819ZM17.9847 15.6338C18.3836 15.1005 18.5989 14.4524 18.5983 13.7865C18.5996 13.1212 18.3854 12.4735 17.9878 11.9401C17.9861 11.9379 17.9852 11.9353 17.9852 11.9325C17.9852 11.9298 17.9861 11.9271 17.9878 11.925L18.6125 11.2983C18.6136 11.297 18.615 11.2961 18.6165 11.2954C18.618 11.2947 18.6197 11.2944 18.6214 11.2944C18.623 11.2944 18.6247 11.2947 18.6262 11.2954C18.6277 11.2961 18.6291 11.297 18.6302 11.2983C19.1934 12.0058 19.5 12.8832 19.5 13.7874C19.5 14.6915 19.1934 15.569 18.6302 16.2764C18.6291 16.2777 18.6277 16.2787 18.6262 16.2794C18.6247 16.28 18.623 16.2804 18.6214 16.2804C18.6197 16.2804 18.618 16.28 18.6165 16.2794C18.615 16.2787 18.6136 16.2777 18.6125 16.2764L17.9847 15.6489C17.983 15.6467 17.9821 15.6441 17.9821 15.6413C17.9821 15.6386 17.983 15.6359 17.9847 15.6338Z"></path></svg>';break;case"sharedWithMe":s.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm-5 3c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm4 8h-8v-1c0-1.33 2.67-2 4-2s4 .67 4 2v1z"></path></svg>';break;case"favorites":s.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M20 6h-8l-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm-2.06 11L15 15.28 12.06 17l.78-3.33-2.59-2.24 3.41-.29L15 8l1.34 3.14 3.41.29-2.59 2.24.78 3.33z"></path></svg>';break;default:s.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"></path></svg>'}return s};getVectorSVG=e=>{let t=document.createElement("div");t.style.backgroundColor="#3F51B5",t.style.borderRadius="50%",t.style.height="20px",t.style.width="20px",t.style.alignItems="center",t.style.display="flex",t.style.float="left",t.style.marginLeft=this.DEPTHFACTOR*(e-1)+57+"px";const s=document.createElementNS("http://www.w3.org/2000/svg","svg");return s.style.height="15px",s.style.cursor="pointer",s.style.float="left",s.classList.add("ellipsis-vector-icon"),s.innerHTML='<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="draw-polygon" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="#FFFFFF" d="M384 352c-.35 0-.67.1-1.02.1l-39.2-65.32c5.07-9.17 8.22-19.56 8.22-30.78s-3.14-21.61-8.22-30.78l39.2-65.32c.35.01.67.1 1.02.1 35.35 0 64-28.65 64-64s-28.65-64-64-64c-23.63 0-44.04 12.95-55.12 32H119.12C108.04 44.95 87.63 32 64 32 28.65 32 0 60.65 0 96c0 23.63 12.95 44.04 32 55.12v209.75C12.95 371.96 0 392.37 0 416c0 35.35 28.65 64 64 64 23.63 0 44.04-12.95 55.12-32h209.75c11.09 19.05 31.49 32 55.12 32 35.35 0 64-28.65 64-64 .01-35.35-28.64-64-63.99-64zm-288 8.88V151.12A63.825 63.825 0 0 0 119.12 128h208.36l-38.46 64.1c-.35-.01-.67-.1-1.02-.1-35.35 0-64 28.65-64 64s28.65 64 64 64c.35 0 .67-.1 1.02-.1l38.46 64.1H119.12A63.748 63.748 0 0 0 96 360.88zM272 256c0-8.82 7.18-16 16-16s16 7.18 16 16-7.18 16-16 16-16-7.18-16-16zM400 96c0 8.82-7.18 16-16 16s-16-7.18-16-16 7.18-16 16-16 16 7.18 16 16zM64 80c8.82 0 16 7.18 16 16s-7.18 16-16 16-16-7.18-16-16 7.18-16 16-16zM48 416c0-8.82 7.18-16 16-16s16 7.18 16 16-7.18 16-16 16-16-7.18-16-16zm336 16c-8.82 0-16-7.18-16-16s7.18-16 16-16 16 7.18 16 16-7.18 16-16 16z"></path></svg>',t.appendChild(s),t};getRasterSVG=e=>{let t=document.createElement("div");t.style.backgroundColor="#00796B",t.style.borderRadius="50%",t.style.height="20px",t.style.width="20px",t.style.alignItems="center",t.style.display="flex",t.style.float="left",t.style.marginLeft=this.DEPTHFACTOR*(e-1)+57+"px";const s=document.createElementNS("http://www.w3.org/2000/svg","svg");return s.style.height="15px",s.style.fill="#FFFFFF",s.style.cursor="pointer",s.style.float="left",s.classList.add("ellipsis-raster-icon"),s.innerHTML='<svg focusable="false" viewBox="0 0 24 24" aria-hidden="true"><path d="M20.5 3l-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5zM15 19l-6-2.11V5l6 2.11V19z"></path></svg>',t.appendChild(s),t};authError=!1;defaultSettings={loggedIn:!1,token:null,types:"",cb:e=>{console.log("Default callback is called, please provide your own callback!")},icon:"default",div:null,showRaster:!0,showVector:!0,searchIncludeFolders:!0,preloadRoots:!1};settings={};constructor(e={}){if(this.root={name:"ellipsis-folder-root",text:"ellipsis-folder-root",id:"ellipsis-folder-root",trueRoot:!0,showExpanded:!0,foldersExpanded:!0,folders:[new s("My Drive","myDrive","myDrive",0,!0),new s("Shared with me","sharedWithMe","sharedWithMe",0,!0),new s("Favorites","favorites","favorites",0,!0)],blocks:[]},this.settings={...this.defaultSettings,...e},this.searching=!1,this.activeSearch=!1,this.searchString="",this.searchResults=[],"div"in e){if("token"in e)this.settings.token=e.token,this.settings.loggedIn=!0;else{const e=window.location.search,t=new URLSearchParams(e);t.has("token")&&(this.settings.token=t.get("token"),this.settings.loggedIn=!0)}if(this.searchBarDiv=this.getSearchBar(),this.normalDiv=document.createElement("div"),this.searchBarDiv.setAttribute("id","ellipsis-drive-searchbar"),this.normalDiv.setAttribute("id","ellipsis-drive-explorer"),this.settings.div.style.backgroundColor="#f5f5f5",this.settings.div.style.overflow="scroll",this.settings.div.appendChild(this.searchBarDiv),this.settings.div.appendChild(this.normalDiv),this.settings.preloadRoots)for(const e of this.root.folders)this.expandFolder(e);this.render()}else console.warn("EllipsisDrive: no div is provided!")}bouncingOnClick=(e,t)=>{e.showExpanded=!e.showExpanded,this.render()};onClick=this.debounce(this.bouncingOnClick,100);p=(e,t=0)=>{let s=document.createElement("p");return s.innerText=e,s.style.paddingLeft=`${this.DEPTHCONSTANT+this.DEPTHFACTOR*t+40}px`,s.classList.add("ellipsis-folder-p"),s.style.fontFamily='"Roboto Condensed","Roboto","Helvetica","Lucida Sans Unicode","sans-serif"',s.style.cursor="default",s};getListFolder=async(e,t,s=!1)=>{let i="",l={};return i=s?`${this.APIURL}/account/root/${e.id}?&isFolder=${t}`:`${this.APIURL}/path/${e.id}/list?isFolder=${t}`,l={"Content-Type":"application/json",Authorization:`Bearer ${this.settings.token}`},(await fetch(i,{method:"GET",headers:l})).json()};fixFolder=e=>{let t=new s;return t.name=e.name,t.id=e.id,t.text=e.name,t.obj=e,t};fixBlock=e=>{let t=new class{type=void 0;name=void 0;id=void 0;showExpanded=!1;obj=void 0;availability=void 0};return t.type=e.type,t.id=e.id,t.name=e.name,t.obj=e,t.availability=this.isValidMap(e),t};expandFolder=e=>{e.foldersExpanded=!0;let t=e.root,s=this.getListFolder(e,!0,t),i=this.getListFolder(e,!1,t);Promise.all([s,i]).then((t=>{if(!("result"in t[0]))return console.warn("EllipsisDrive: Authentication error, your token might be invalid"),void this.render();e.folders=t[0].result.map(this.fixFolder),e.blocks=t[1].result.map(this.fixBlock),e.folders.map((t=>{t.depth=e.depth+1})),e.blocks.map((t=>{t.depth=e.depth+1})),this.render()}))};attachMouseEnter=(e,t,s,i)=>{for(const e of t)e.style.color=this.GRAY,e.style.cursor="pointer";s||(s=[]);let l=(e,l,r)=>()=>{null!=i&&(i.style.display=r?"initial":"none");for(const s of t)s.style.color=e;null!=i&&(i.style.color=l);for(const e of s)e.style.fill=l};e&&(e.onmouseenter=l(this.BLUE,this.BLUE,!0)),e&&(e.onmouseleave=l(this.GRAY,this.SVGGRAY,!1))};renderBlock=(e,t=!1)=>{t&&(e.depth=0);let s=e.availability.available,i=document.createElement("div");("raster"==e.type&&!this.settings.showRaster||"vector"==e.type&&!this.settings.showVector)&&(i.style.display="none");let l,r=this.p(`${e.name}`,e.depth);s?l=this.p(`${e.type}`,e.depth):(r.style.color="gray",l=this.p(`${e.availability.reason}`,e.depth)),l.style.color="gray",l.style.marginLeft="20px",l.style.marginTop="-15px",r.style.marginLeft="20px";let o="raster"==e.type?this.getRasterSVG(e.depth):this.getVectorSVG(e.depth);return s?(this.attachMouseEnter(i,[r,l],[o],null),i.onclick=()=>{this.settings.cb(e.obj)}):o.style.backgroundColor=this.SVGGRAY,o.style.marginTop="8px",i.appendChild(o),i.appendChild(r),i.appendChild(l),i};renderFolder=e=>{let t=document.createElement("div");t.setAttribute("id",`${e.id}`),t.classList.add("ellipsis-folder");let s=document.createElement("div");s.setAttribute("id",`${e.id}_start`);let i=document.createElement("div");if(i.setAttribute("id",`${e.id}_end`),t.appendChild(s),t.appendChild(i),!e.trueRoot){s.onclick=t=>this.onClick(e,t);let t=this.p(`${e.text}`,e.depth);t.style.marginLeft="20px";let i=e.showExpanded?this.arrowDown(e.depth):this.arrowRight(e.depth),l=this.refreshSVG();l.onclick=()=>{e.showExpanded=!e.showExpanded,e.foldersExpanded=!1,e.folders=[],e.blocks=[]};let r=this.getFolderSVG(e.id);this.attachMouseEnter(s,[t],[i,r],l),l.style.float="right",l.style.position="relative",l.style.display="none",i.style.float="left",s.appendChild(i),s.appendChild(r),s.appendChild(l),s.appendChild(t)}if(e.showExpanded&&!e.foldersExpanded){let s=this.p("Loading...",e.depth+1);t.insertBefore(s,i),this.expandFolder(e)}if(e.showExpanded){for(const s of e.folders)t.insertBefore(this.renderFolder(s),i);for(const s of e.blocks)t.insertBefore(this.renderBlock(s),i);0==e.folders.length&&e.blocks.length}return t};getButton=(e,t)=>{let s=document.createElement("button");return s.onclick=t,s.innerHTML=e,s.style.color="#fff",s.style.backgroundColor="#089EC8",s.style.boxShadow="0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",s.style.padding="6px 16px",s.style.fontSize="1rem",s.style.minWidth="64px",s.style.boxSizing="border-box",s.style.transition='"background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms',s.style.fontFamily=["Roboto Condensed","Roboto","-apple-system","BlinkMacSystemFont","Segoe UI","Helvetica Neue","Arial","sans-serif","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Exo 2"],s.style.fontWeight="500",s.style.lineHeight="1.75",s.style.borderRadius="4px",s.style.letterSpacing="0.5px",s.style.textTransform="uppercase",s.style.border=0,s};loginDiv=()=>{let e=document.createElement("div");e.appendChild(this.p("Please log in to your Ellipsis Drive account:")),e.style.textAlign="center";let t=this.getButton("Log in",(()=>{window.location=`https://app.ellipsis-drive.com/login?referer=${window.location.href}`}));return e.appendChild(t),e};authErrorDiv=()=>{let e=document.createElement("div");e.appendChild(this.p("Authentication error, please check if token is correct")),e.style.textAlign="center";let t=this.getButton("Retry",(()=>{this.render()}));return console.warn(`Authentication error, token used is: ${this.settings.token}`),e.appendChild(t),e};renderSearch=()=>{let e=document.createElement("div");if(this.activeSearch){let t=this.p("Loading..");e.appendChild(t)}else{let t=!1;if(this.settings.searchIncludeFolders)for(const s of this.searchResults[0])t=!0,e.appendChild(this.renderFolder(s));if(this.settings.showRaster)for(const s of this.searchResults[1])t=!0,e.appendChild(this.renderBlock(s,!0));if(this.settings.showVector)for(const s of this.searchResults[2])t=!0,e.appendChild(this.renderBlock(s,!0));t||e.appendChild(this.p("No results found"))}return e};performSearch=async e=>{let t=`${this.APIURL}/path`,s=[`${t}?type=["folder"]&name=${e}`,`${t}?type=["vector"]&name=${e}`,`${t}?type=["raster"]&name=${e}`],i=[],l={"Content-Type":"application/json",Authorization:`Bearer ${this.settings.token}`};for(const e of s)i.push(fetch(e,{method:"GET",headers:l}));Promise.all(i).then((e=>{let t=[];for(const s of e)t.push(s.json());return Promise.all(t)})).then((e=>{this.searchResults=[e[0].result.map(this.fixFolder),e[1].result.map(this.fixBlock),e[2].result.map(this.fixBlock)],this.activeSearch=!1,this.render()}))};bouncingOnSearchChange=e=>{let t=e.target.value;this.searchString=t,""==t?(this.searching=!1,this.activeSearch=!1):(this.searching=!0,this.activeSearch=!0,this.performSearch(this.searchString)),this.render()};onSearchChange=this.debounce(this.bouncingOnSearchChange,200);getSearchBar=()=>{let e=document.createElement("div"),t=document.createElement("input");return t.setAttribute("id","ellipsis-drive-search"),t.style.marginLeft=`${this.DEPTHCONSTANT}px`,t.type="text",t.placeholder="Search Drive",t.value=this.searchString,t.addEventListener("input",this.onSearchChange),t.style.width="80%",t.style.left="20px",t.style.position="relative",e.appendChild(t),e};render=()=>{this.normalDiv.innerHTML="",this.settings.loggedIn?this.authError?this.normalDiv.appendChild(this.authErrorDiv()):(this.searchBarDiv.style.display="initial",this.searching?this.normalDiv.appendChild(this.renderSearch()):this.normalDiv.appendChild(this.renderFolder(this.root))):(this.searchBarDiv.style.display="none",this.normalDiv.appendChild(this.loginDiv()))}};return t})()}));