From 5c1e5204b2943b0f2f10adb65a38f98fe634e19a Mon Sep 17 00:00:00 2001 From: Roberto Tonino Date: Thu, 19 Nov 2020 18:34:51 +0100 Subject: [PATCH] style: added BaseTabs and BaseTab functional components for unified tab displaying; workflow: added .js files check when purging in prod --- public/js/bundle.js | 22 ++++++++++++-------- src/components/globals/BaseTabs.js | 33 ++++++++++++++++++++++++++++++ src/components/pages/Artist.vue | 15 +++++++++----- src/components/pages/Favorites.vue | 19 ++++++++--------- src/components/pages/Search.vue | 14 +++++++------ src/data/artist.js | 28 ++++++++----------------- tailwind.config.js | 2 +- 7 files changed, 82 insertions(+), 51 deletions(-) create mode 100644 src/components/globals/BaseTabs.js diff --git a/public/js/bundle.js b/public/js/bundle.js index 8680108..cd010f9 100644 --- a/public/js/bundle.js +++ b/public/js/bundle.js @@ -1681,6 +1681,10 @@ color: rgba(10.20000000000001, 132.59999999999988, 255, var(--text-opacity)) } +.lowercase { + text-transform: lowercase +} + .capitalize { text-transform: capitalize } @@ -2721,15 +2725,15 @@ PERFORMANCE OF THIS SOFTWARE. `)]),e._v(" "),a("p",{staticClass:"mb-2 text-base"},[e._v("For security reasons you will need to provide your own Client ID and Secret")]),e._v(" "),a("h2",{staticClass:"mt-6 text-3xl"},[e._v("How do I get my Client ID and Secret?")]),e._v(" "),e._m(0),e._v(" "),e._m(1),e._v(" "),e._m(2),e._v(" "),e._m(3),e._v(" "),a("p",{staticClass:"mb-2 text-base"},[e._v("Now you can copy-paste those results in the appropriate fields in the settings.")]),e._v(" "),a("h2",{staticClass:"mt-6 text-3xl"},[e._v("How do I get my Spotify Username?")]),e._v(" "),e._m(4)])},__vue_staticRenderFns__$d=[function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v("Connect to "),a("a",{attrs:{href:"https://developer.spotify.com/dashboard",target:"_blank"}},[e._v("Spotify for Developers's Dashboard")]),e._v(" and login with your Spotify account.")])},function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v(` Click on "Create an App".`),a("br"),e._v(" "),a("img",{attrs:{src:"https://i.imgur.com/YFz7rHj.png",alt:"Create an App button on Spotify for Developers's Dashboard"}})])},function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v(` Fill out the "App name" and "App description" fields and check both checkboxes. Then click on the "Create" button.`),a("br"),e._v(" "),a("img",{attrs:{src:"https://i.imgur.com/A9cvDkK.png",alt:"Create an app form"}})])},function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v(` - Now you can see the Client ID. If you click on "Show Client Secret" the client secret will be revealed.`),a("br"),e._v(" "),a("img",{attrs:{src:"https://i.imgur.com/foEfIhO.png",alt:"Screen of client ID and Secret"}})])},function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v("You can get your Spotify Username from the "),a("a",{attrs:{href:"https://www.spotify.com/it/account/overview/",target:"_blank"}},[e._v("Overview page on Spotify's Website")]),e._v(".")])}];const __vue_inject_styles__$d=void 0,__vue_scope_id__$d=void 0,__vue_is_functional_template__$d=!1;function __vue_normalize__$d(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="InfoSpotifyFeatures.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var InfoSpotifyFeatures=__vue_normalize__$d({render:__vue_render__$d,staticRenderFns:__vue_staticRenderFns__$d},__vue_inject_styles__$d,__vue_script__$b,__vue_scope_id__$d,__vue_is_functional_template__$d),freeGlobal=typeof global=="object"&&global&&global.Object===Object&&global,freeSelf=typeof self=="object"&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")(),Symbol$1=root.Symbol,objectProto=Object.prototype,hasOwnProperty$2=objectProto.hasOwnProperty,nativeObjectToString=objectProto.toString,symToStringTag=Symbol$1?Symbol$1.toStringTag:void 0;function getRawTag(e){var n=hasOwnProperty$2.call(e,symToStringTag),a=e[symToStringTag];try{e[symToStringTag]=void 0;var r=!0}catch(s){}var i=nativeObjectToString.call(e);return r&&(n?e[symToStringTag]=a:delete e[symToStringTag]),i}var objectProto$1=Object.prototype,nativeObjectToString$1=objectProto$1.toString;function objectToString(e){return nativeObjectToString$1.call(e)}var nullTag="[object Null]",undefinedTag="[object Undefined]",symToStringTag$1=Symbol$1?Symbol$1.toStringTag:void 0;function baseGetTag(e){return e==null?e===void 0?undefinedTag:nullTag:symToStringTag$1&&symToStringTag$1 in Object(e)?getRawTag(e):objectToString(e)}function isObjectLike(e){return e!=null&&typeof e=="object"}var symbolTag="[object Symbol]";function isSymbol(e){return typeof e=="symbol"||isObjectLike(e)&&baseGetTag(e)==symbolTag}function arrayMap(e,n){for(var a=-1,r=e==null?0:e.length,i=Array(r);++a-1&&e%1==0)&&e-1&&e%1==0&&e<=MAX_SAFE_INTEGER$1}function isArrayLike(e){return e!=null&&isLength(e.length)&&!isFunction$2(e)}var objectProto$3=Object.prototype;function isPrototype(e){var n=e&&e.constructor,a=typeof n=="function"&&n.prototype||objectProto$3;return e===a}function baseTimes(e,n){for(var a=-1,r=Array(e);++a-1}function listCacheSet(e,n){var a=this.__data__,r=assocIndexOf(a,e);return r<0?(++this.size,a.push([e,n])):a[r][1]=n,this}function ListCache(e){var n=-1,a=e==null?0:e.length;for(this.clear();++nc))return!1;var u=s.get(e);if(u&&s.get(n))return u==n;var d=-1,f=!0,m=a&COMPARE_UNORDERED_FLAG?new SetCache:void 0;for(s.set(e,n),s.set(n,e);++d=n||C<0||f&&I>=s}function k(){var z=now();if(w(z))return x(z);c=setTimeout(k,y(z))}function x(z){return c=void 0,m&&r?h(z):(r=i=void 0,l)}function A(){c!==void 0&&clearTimeout(c),u=0,r=o=i=c=void 0}function R(){return c===void 0?l:x(now())}function D(){var z=now(),C=w(z);if(r=arguments,i=this,o=z,C){if(c===void 0)return b(o);if(f)return clearTimeout(c),c=setTimeout(k,n),h(o)}return c===void 0&&(c=setTimeout(k,n)),l}return D.cancel=A,D.flush=R,D}function baseMap(e,n){var a=-1,r=isArrayLike(e)?Array(e.length):[];return baseEach(e,function(i,s,l){r[++a]=n(i,s,l)}),r}var mapTag$3="[object Map]",setTag$3="[object Set]",objectProto$c=Object.prototype,hasOwnProperty$b=objectProto$c.hasOwnProperty;function isEmpty(e){if(e==null)return!0;if(isArrayLike(e)&&(isArray$2(e)||typeof e=="string"||typeof e.splice=="function"||isBuffer(e)||isTypedArray(e)||isArguments(e)))return!e.length;var n=getTag$1(e);if(n==mapTag$3||n==setTag$3)return!e.size;if(isPrototype(e))return!baseKeys(e).length;for(var a in e)if(hasOwnProperty$b.call(e,a))return!1;return!0}function baseSortBy(e,n){var a=e.length;for(e.sort(n);a--;)e[a]=e[a].value;return e}function compareAscending(e,n){if(e!==n){var a=e!==void 0,r=e===null,i=e===e,s=isSymbol(e),l=n!==void 0,c=n===null,o=n===n,u=isSymbol(n);if(!c&&!u&&!s&&e>n||s&&l&&o&&!c&&!u||r&&l&&o||!a&&o||!i)return 1;if(!r&&!s&&!u&&e=c)return o;var u=a[r];return o*(u=="desc"?-1:1)}}return e.index-n.index}function baseOrderBy(e,n,a){var r=-1;n=arrayMap(n.length?n:[identity$1],baseUnary(baseIteratee));var i=baseMap(e,function(s,l,c){var o=arrayMap(n,function(u){return u(s)});return{criteria:o,index:++r,value:s}});return baseSortBy(i,function(s,l){return compareMultiple(s,l,a)})}function orderBy(e,n,a,r){return e==null?[]:(isArray$2(n)||(n=n==null?[]:[n]),a=r?void 0:a,isArray$2(a)||(a=a==null?[]:[a]),baseOrderBy(e,n,a))}function checkNewRelease(e){let n=new Date;return n.setHours(0,0,0,0),e=new Date(e),e.setDate(e.getDate()+3),n.getTime()<=e.getTime()}function formatArtistData(e){return{artistName:getPropertyWithFallback(e,"name"),artistPictureXL:getPropertyWithFallback(e,"picture_xl"),artistReleases:formatArtistReleases(getPropertyWithFallback(e,"releases"))}}function formatArtistReleases(e){let n={};for(const a in e)if(e.hasOwnProperty(a)){const r=e[a];n[a]=[];for(const i of r)n[a].push({releaseID:getPropertyWithFallback(i,"id"),releaseCover:getPropertyWithFallback(i,"cover_small"),releaseTitle:getPropertyWithFallback(i,"title"),releaseDate:getPropertyWithFallback(i,"release_date"),releaseTracksNumber:getPropertyWithFallback(i,"nb_song"),releaseLink:getPropertyWithFallback(i,"link"),isReleaseExplicit:getPropertyWithFallback(i,"explicit_lyrics")})}return n}function getArtistData(e){return socket.emit("getTracklist",{type:"artist",id:e}),new Promise((n,a)=>{socket.on("show_artist",r=>{socket.off("show_artist"),n(r)})})}function standardizeData(e,n){if(e.hasLoaded){const{data:a}=e,r=[];for(const i of a){let s=n(i);r.push(s)}return{data:r,hasLoaded:e.hasLoaded}}else return null}var script$c=defineComponent({setup(e,n){const a=reactive({currentTab:"",sortKey:"releaseDate",sortOrder:"desc",artistReleases:{},artistName:"",artistPicture:"",currentRelease:computed(()=>a.artistReleases[a.currentTab])}),r=computed(()=>n.root.$router.currentRoute.params.id),i=ref$2(!1);getArtistData(unref(r)).then(c=>{i.value=!0;const{data:[{artistName:o,artistPictureXL:u,artistReleases:d}]}=standardizeData({data:[c],hasLoaded:unref(i)},formatArtistData);Object.assign(a,{artistName:o,artistPicture:u,artistReleases:d,currentTab:Object.keys(d)[0]})}).catch(c=>console.error(c));const s=computed(()=>{if(!unref(i))return[];let c=a.sortKey;return c==="releaseTracksNumber"&&(c=o=>new Number(o.releaseTracksNumber)),orderBy(a.currentRelease,c,a.sortOrder)}),l=c=>{a.currentTab=c};return{...toRefs(a),downloadLink:computed(()=>`https://www.deezer.com/artist/${unref(r)}`),headerStyle:computed(()=>({backgroundImage:`linear-gradient(to bottom, transparent 0%, var(--main-background) 100%), url(${a.artistPicture})`})),sortedData:s,sendAddToQueue,checkNewRelease,changeTab:l}},data(){const e=this.$t.bind(this),n=this.$tc.bind(this);return{head:[{title:n("globals.listTabs.title",1),sortKey:"releaseTitle"},{title:e("globals.listTabs.releaseDate"),sortKey:"releaseDate"},{title:n("globals.listTabs.track",2),sortKey:"releaseTracksNumber"},{title:"",width:"32px"}]}},methods:{sortBy(e){e===this.sortKey?this.sortOrder=this.sortOrder==="asc"?"desc":"asc":(this.sortKey=e,this.sortOrder="asc")}}});const __vue_script__$c=script$c;var __vue_render__$e=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",{staticClass:"relative image-header"},[a("header",{staticClass:"flex items-center",style:e.headerStyle},[a("h1",{staticClass:"m-0"},[e._v(e._s(e.artistName))]),e._v(" "),a("div",{staticClass:"grid w-16 h-16 ml-auto rounded-full cursor-pointer bg-primary text-grayscale-870 place-items-center",attrs:{"aria-label":"download",role:"button"},on:{click:function(r){return r.stopPropagation(),e.sendAddToQueue(e.downloadLink)}}},[a("i",{staticClass:"text-4xl material-icons",attrs:{title:e.$t("globals.download_hint")}},[e._v("get_app")])])]),e._v(" "),a("ul",{staticClass:"my-8 section-tabs"},e._l(e.artistReleases,function(r,i){return a("li",{key:i,staticClass:"section-tabs__tab uppercase-first-letter",class:{active:e.currentTab===i},on:{click:function(s){return e.changeTab(i)}}},[e._v(` + Now you can see the Client ID. If you click on "Show Client Secret" the client secret will be revealed.`),a("br"),e._v(" "),a("img",{attrs:{src:"https://i.imgur.com/foEfIhO.png",alt:"Screen of client ID and Secret"}})])},function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("p",{staticClass:"mb-2 text-base"},[e._v("You can get your Spotify Username from the "),a("a",{attrs:{href:"https://www.spotify.com/it/account/overview/",target:"_blank"}},[e._v("Overview page on Spotify's Website")]),e._v(".")])}];const __vue_inject_styles__$d=void 0,__vue_scope_id__$d=void 0,__vue_is_functional_template__$d=!1;function __vue_normalize__$d(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="InfoSpotifyFeatures.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var InfoSpotifyFeatures=__vue_normalize__$d({render:__vue_render__$d,staticRenderFns:__vue_staticRenderFns__$d},__vue_inject_styles__$d,__vue_script__$b,__vue_scope_id__$d,__vue_is_functional_template__$d),freeGlobal=typeof global=="object"&&global&&global.Object===Object&&global,freeSelf=typeof self=="object"&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")(),Symbol$1=root.Symbol,objectProto=Object.prototype,hasOwnProperty$2=objectProto.hasOwnProperty,nativeObjectToString=objectProto.toString,symToStringTag=Symbol$1?Symbol$1.toStringTag:void 0;function getRawTag(e){var n=hasOwnProperty$2.call(e,symToStringTag),a=e[symToStringTag];try{e[symToStringTag]=void 0;var r=!0}catch(s){}var i=nativeObjectToString.call(e);return r&&(n?e[symToStringTag]=a:delete e[symToStringTag]),i}var objectProto$1=Object.prototype,nativeObjectToString$1=objectProto$1.toString;function objectToString(e){return nativeObjectToString$1.call(e)}var nullTag="[object Null]",undefinedTag="[object Undefined]",symToStringTag$1=Symbol$1?Symbol$1.toStringTag:void 0;function baseGetTag(e){return e==null?e===void 0?undefinedTag:nullTag:symToStringTag$1&&symToStringTag$1 in Object(e)?getRawTag(e):objectToString(e)}function isObjectLike(e){return e!=null&&typeof e=="object"}var symbolTag="[object Symbol]";function isSymbol(e){return typeof e=="symbol"||isObjectLike(e)&&baseGetTag(e)==symbolTag}function arrayMap(e,n){for(var a=-1,r=e==null?0:e.length,i=Array(r);++a-1&&e%1==0)&&e-1&&e%1==0&&e<=MAX_SAFE_INTEGER$1}function isArrayLike(e){return e!=null&&isLength(e.length)&&!isFunction$2(e)}var objectProto$3=Object.prototype;function isPrototype(e){var n=e&&e.constructor,a=typeof n=="function"&&n.prototype||objectProto$3;return e===a}function baseTimes(e,n){for(var a=-1,r=Array(e);++a-1}function listCacheSet(e,n){var a=this.__data__,r=assocIndexOf(a,e);return r<0?(++this.size,a.push([e,n])):a[r][1]=n,this}function ListCache(e){var n=-1,a=e==null?0:e.length;for(this.clear();++nc))return!1;var u=s.get(e);if(u&&s.get(n))return u==n;var d=-1,f=!0,m=a&COMPARE_UNORDERED_FLAG?new SetCache:void 0;for(s.set(e,n),s.set(n,e);++d=n||C<0||f&&I>=s}function k(){var z=now();if(w(z))return x(z);c=setTimeout(k,y(z))}function x(z){return c=void 0,m&&r?h(z):(r=i=void 0,l)}function A(){c!==void 0&&clearTimeout(c),u=0,r=o=i=c=void 0}function R(){return c===void 0?l:x(now())}function D(){var z=now(),C=w(z);if(r=arguments,i=this,o=z,C){if(c===void 0)return b(o);if(f)return clearTimeout(c),c=setTimeout(k,n),h(o)}return c===void 0&&(c=setTimeout(k,n)),l}return D.cancel=A,D.flush=R,D}function baseMap(e,n){var a=-1,r=isArrayLike(e)?Array(e.length):[];return baseEach(e,function(i,s,l){r[++a]=n(i,s,l)}),r}var mapTag$3="[object Map]",setTag$3="[object Set]",objectProto$c=Object.prototype,hasOwnProperty$b=objectProto$c.hasOwnProperty;function isEmpty(e){if(e==null)return!0;if(isArrayLike(e)&&(isArray$2(e)||typeof e=="string"||typeof e.splice=="function"||isBuffer(e)||isTypedArray(e)||isArguments(e)))return!e.length;var n=getTag$1(e);if(n==mapTag$3||n==setTag$3)return!e.size;if(isPrototype(e))return!baseKeys(e).length;for(var a in e)if(hasOwnProperty$b.call(e,a))return!1;return!0}function baseSortBy(e,n){var a=e.length;for(e.sort(n);a--;)e[a]=e[a].value;return e}function compareAscending(e,n){if(e!==n){var a=e!==void 0,r=e===null,i=e===e,s=isSymbol(e),l=n!==void 0,c=n===null,o=n===n,u=isSymbol(n);if(!c&&!u&&!s&&e>n||s&&l&&o&&!c&&!u||r&&l&&o||!a&&o||!i)return 1;if(!r&&!s&&!u&&e=c)return o;var u=a[r];return o*(u=="desc"?-1:1)}}return e.index-n.index}function baseOrderBy(e,n,a){var r=-1;n=arrayMap(n.length?n:[identity$1],baseUnary(baseIteratee));var i=baseMap(e,function(s,l,c){var o=arrayMap(n,function(u){return u(s)});return{criteria:o,index:++r,value:s}});return baseSortBy(i,function(s,l){return compareMultiple(s,l,a)})}function orderBy(e,n,a,r){return e==null?[]:(isArray$2(n)||(n=n==null?[]:[n]),a=r?void 0:a,isArray$2(a)||(a=a==null?[]:[a]),baseOrderBy(e,n,a))}const BaseTab=defineComponent({name:"BaseTab",functional:!0,render(e,n){return e("li",{class:[n.data.class,"section-tabs__tab","uppercase-first-letter"],on:n.data.on},n.slots().default)}}),BaseTabs=defineComponent({name:"BaseTabs",functional:!0,render(e,n){return e("ul",{class:[n.data.class,"my-8","section-tabs"],on:n.data.on},n.slots().default)}});function checkNewRelease(e){let n=new Date;return n.setHours(0,0,0,0),e=new Date(e),e.setDate(e.getDate()+3),n.getTime()<=e.getTime()}function formatArtistData(e){return{artistName:getPropertyWithFallback(e,"name"),artistPictureXL:getPropertyWithFallback(e,"picture_xl"),artistReleases:formatArtistReleases(getPropertyWithFallback(e,"releases"))}}function formatArtistReleases(e){let n={};for(const a in e)if(e.hasOwnProperty(a)){const r=e[a];n[a]=[];for(const i of r)n[a].push({releaseID:getPropertyWithFallback(i,"id"),releaseCover:getPropertyWithFallback(i,"cover_small"),releaseTitle:getPropertyWithFallback(i,"title"),releaseDate:getPropertyWithFallback(i,"release_date"),releaseTracksNumber:getPropertyWithFallback(i,"nb_song"),releaseLink:getPropertyWithFallback(i,"link"),isReleaseExplicit:getPropertyWithFallback(i,"explicit_lyrics")})}return n}function getArtistData(e){return socket.emit("getTracklist",{type:"artist",id:e}),new Promise((n,a)=>{socket.on("show_artist",r=>{socket.off("show_artist"),n(r)})})}function standardizeData(e,n){if(e.hasLoaded){const{data:a}=e,r=[];for(const i of a){let s=n(i);r.push(s)}return{data:r,hasLoaded:e.hasLoaded}}else return null}var script$c=defineComponent({components:{BaseTabs,BaseTab},setup(e,n){const a=reactive({currentTab:"",sortKey:"releaseDate",sortOrder:"desc",artistReleases:{},artistName:"",artistPicture:"",currentRelease:computed(()=>a.artistReleases[a.currentTab])}),r=computed(()=>n.root.$router.currentRoute.params.id),i=ref$2(!1);getArtistData(unref(r)).then(c=>{i.value=!0;const{data:[{artistName:o,artistPictureXL:u,artistReleases:d}]}=standardizeData({data:[c],hasLoaded:unref(i)},formatArtistData);Object.assign(a,{artistName:o,artistPicture:u,artistReleases:d,currentTab:Object.keys(d)[0]})}).catch(c=>console.error(c));const s=computed(()=>{if(!unref(i))return[];let c=a.sortKey;return c==="releaseTracksNumber"&&(c=o=>new Number(o.releaseTracksNumber)),orderBy(a.currentRelease,c,a.sortOrder)}),l=c=>{a.currentTab=c};return{...toRefs(a),downloadLink:computed(()=>`https://www.deezer.com/artist/${unref(r)}`),headerStyle:computed(()=>({backgroundImage:`linear-gradient(to bottom, transparent 0%, var(--main-background) 100%), url(${a.artistPicture})`})),sortedData:s,sendAddToQueue,checkNewRelease,changeTab:l}},data(){const e=this.$t.bind(this),n=this.$tc.bind(this);return{head:[{title:n("globals.listTabs.title",1),sortKey:"releaseTitle"},{title:e("globals.listTabs.releaseDate"),sortKey:"releaseDate"},{title:n("globals.listTabs.track",2),sortKey:"releaseTracksNumber"},{title:"",width:"32px"}]}},methods:{sortBy(e){e===this.sortKey?this.sortOrder=this.sortOrder==="asc"?"desc":"asc":(this.sortKey=e,this.sortOrder="asc")}}});const __vue_script__$c=script$c;var __vue_render__$e=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",{staticClass:"relative image-header"},[a("header",{staticClass:"flex items-center",style:e.headerStyle},[a("h1",{staticClass:"m-0"},[e._v(e._s(e.artistName))]),e._v(" "),a("div",{staticClass:"grid w-16 h-16 ml-auto rounded-full cursor-pointer bg-primary text-grayscale-870 place-items-center",attrs:{"aria-label":"download",role:"button"},on:{click:function(r){return r.stopPropagation(),e.sendAddToQueue(e.downloadLink)}}},[a("i",{staticClass:"text-4xl material-icons",attrs:{title:e.$t("globals.download_hint")}},[e._v("get_app")])])]),e._v(" "),a("BaseTabs",e._l(e.artistReleases,function(r,i){return a("BaseTab",{key:i,class:{active:e.currentTab===i},on:{click:function(s){return e.changeTab(i)}}},[e._v(` `+e._s(e.$tc("globals.listTabs."+i,2))+` - `)])}),0),e._v(" "),a("table",{staticClass:"table"},[a("thead",[a("tr",e._l(e.head,function(r){return a("th",{key:r.title,staticClass:"uppercase-first-letter",class:{"sort-asc":r.sortKey==e.sortKey&&e.sortOrder=="asc","sort-desc":r.sortKey==e.sortKey&&e.sortOrder=="desc",sortable:r.sortKey,clickable:r.sortKey},style:{width:r.width?r.width:"auto"},on:{click:function(i){r.sortKey&&e.sortBy(r.sortKey)}}},[e._v(` + `)])}),1),e._v(" "),a("table",{staticClass:"table"},[a("thead",[a("tr",e._l(e.head,function(r){return a("th",{key:r.title,staticClass:"uppercase-first-letter",class:{"sort-asc":r.sortKey==e.sortKey&&e.sortOrder=="asc","sort-desc":r.sortKey==e.sortKey&&e.sortOrder=="desc",sortable:r.sortKey,clickable:r.sortKey},style:{width:r.width?r.width:"auto"},on:{click:function(i){r.sortKey&&e.sortBy(r.sortKey)}}},[e._v(` `+e._s(r.title)+` `)])}),0)]),e._v(" "),a("tbody",e._l(e.sortedData,function(r){return a("tr",{key:r.releaseID},[a("RouterLink",{staticClass:"flex items-center clickable",attrs:{tag:"td",to:{name:"Album",params:{id:r.releaseID}}}},[a("img",{staticClass:"rounded coverart",staticStyle:{"margin-right":"16px",width:"56px",height:"56px"},attrs:{src:r.releaseCover}}),e._v(" "),r.isReleaseExplicit?a("i",{staticClass:"material-icons title-icon title-icon--explicit"},[e._v("explicit")]):e._e(),e._v(` `+e._s(r.releaseTitle)+` `),e.checkNewRelease(r.releaseDate)?a("i",{staticClass:"material-icons title-icon title-icon--new title-icon--right"},[e._v(` fiber_new - `)]):e._e()]),e._v(" "),a("td",{staticClass:"text-center"},[e._v(e._s(r.releaseDate))]),e._v(" "),a("td",{staticClass:"text-center"},[e._v(e._s(r.releaseTracksNumber))]),e._v(" "),a("td",{staticClass:"clickable",on:{click:function(i){return i.stopPropagation(),e.sendAddToQueue(r.releaseLink)}}},[a("i",{staticClass:"material-icons",attrs:{title:e.$t("globals.download_hint")}},[e._v(" file_download ")])])],1)}),0)])])},__vue_staticRenderFns__$e=[];const __vue_inject_styles__$e=void 0,__vue_scope_id__$e=void 0,__vue_is_functional_template__$e=!1;function __vue_normalize__$e(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="Artist.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var Artist=__vue_normalize__$e({render:__vue_render__$e,staticRenderFns:__vue_staticRenderFns__$e},__vue_inject_styles__$e,__vue_script__$c,__vue_scope_id__$e,__vue_is_functional_template__$e);let chartsData={},cached$1=!1;function getChartsData(){return cached$1?chartsData:(socket.emit("get_charts_data"),new Promise((e,n)=>{socket.on("init_charts",a=>{chartsData=a,cached$1=!0,socket.off("init_charts"),e(a)})}))}var script$d={methods:{previewMouseEnter(e){EventBus.$emit("trackPreview:previewMouseEnter",e)},previewMouseLeave(e){EventBus.$emit("trackPreview:previewMouseLeave",e)}}};const __vue_script__$d=script$d;var __vue_render__$f=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("i",{staticClass:"absolute top-0 right-0 flex items-center justify-center w-full h-full text-center text-white transition-opacity duration-200 ease-in-out bg-black bg-opacity-50 rounded opacity-0 material-icons preview_controls",attrs:{title:e.$t("globals.play_hint")},on:{mouseenter:e.previewMouseEnter,mouseleave:e.previewMouseLeave}},[e._v(` + `)]):e._e()]),e._v(" "),a("td",{staticClass:"text-center"},[e._v(e._s(r.releaseDate))]),e._v(" "),a("td",{staticClass:"text-center"},[e._v(e._s(r.releaseTracksNumber))]),e._v(" "),a("td",{staticClass:"clickable",on:{click:function(i){return i.stopPropagation(),e.sendAddToQueue(r.releaseLink)}}},[a("i",{staticClass:"material-icons",attrs:{title:e.$t("globals.download_hint")}},[e._v(" file_download ")])])],1)}),0)])],1)},__vue_staticRenderFns__$e=[];const __vue_inject_styles__$e=void 0,__vue_scope_id__$e=void 0,__vue_is_functional_template__$e=!1;function __vue_normalize__$e(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="Artist.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var Artist=__vue_normalize__$e({render:__vue_render__$e,staticRenderFns:__vue_staticRenderFns__$e},__vue_inject_styles__$e,__vue_script__$c,__vue_scope_id__$e,__vue_is_functional_template__$e);let chartsData={},cached$1=!1;function getChartsData(){return cached$1?chartsData:(socket.emit("get_charts_data"),new Promise((e,n)=>{socket.on("init_charts",a=>{chartsData=a,cached$1=!0,socket.off("init_charts"),e(a)})}))}var script$d={methods:{previewMouseEnter(e){EventBus.$emit("trackPreview:previewMouseEnter",e)},previewMouseLeave(e){EventBus.$emit("trackPreview:previewMouseLeave",e)}}};const __vue_script__$d=script$d;var __vue_render__$f=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("i",{staticClass:"absolute top-0 right-0 flex items-center justify-center w-full h-full text-center text-white transition-opacity duration-200 ease-in-out bg-black bg-opacity-50 rounded opacity-0 material-icons preview_controls",attrs:{title:e.$t("globals.play_hint")},on:{mouseenter:e.previewMouseEnter,mouseleave:e.previewMouseLeave}},[e._v(` play_arrow `)])},__vue_staticRenderFns__$f=[];const __vue_inject_styles__$f=void 0,__vue_scope_id__$f=void 0,__vue_is_functional_template__$f=!1;function __vue_normalize__$f(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="PreviewControls.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var PreviewControls=__vue_normalize__$f({render:__vue_render__$f,staticRenderFns:__vue_staticRenderFns__$f},__vue_inject_styles__$f,__vue_script__$d,__vue_scope_id__$f,__vue_is_functional_template__$f),script$e={components:{PreviewControls},data(){return{country:"",id:0,countries:[],chart:[]}},computed:{worldwideRelease(){let e=this.countries.filter(n=>n.title==="Worldwide");return e[0]}},async created(){socket.on("setChartTracks",this.setTracklist),this.$on("hook:destroyed",()=>{socket.off("setChartTracks")});let e=await getChartsData(),n;e=e.filter(a=>(a.title==="Worldwide"&&(n=a),a.title!=="Worldwide")),e.unshift(n),this.initCharts(e)},methods:{convertDuration,playPausePreview(e){EventBus.$emit("trackPreview:playPausePreview",e)},addToQueue(e){e.stopPropagation(),sendAddToQueue(e.currentTarget.dataset.link)},getTrackList(e){document.getElementById("content").scrollTo(0,0);const{currentTarget:{dataset:{title:n}},currentTarget:{dataset:{id:a}}}=e;this.country=n,localStorage.setItem("chart",this.country),this.id=a,socket.emit("getChartTracks",this.id)},setTracklist(e){this.chart=e},onChangeCountry(){this.country="",this.id=0},initCharts(e){if(this.countries=e,this.country=localStorage.getItem("chart")||"",!this.country)return;let n=0;for(;n{socket.on("init_favorites",a=>{favoritesData=a,cached$2=!0,socket.off("init_favorites"),e(a)})}))}var script$g={inheritAttrs:!1,props:{cover:{type:String,reqired:!0},isRounded:{type:Boolean,required:!1},isCircle:{type:Boolean,required:!1},link:{type:String,reqired:!0}}};const __vue_script__$g=script$g;var __vue_render__$i=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",{staticClass:"relative cover-container group"},[a("img",{staticClass:"block w-full opacity-100 coverart",class:{rounded:e.isRounded,"rounded-full":e.isCircle},attrs:{"aria-hidden":"true",src:e.cover}}),e._v(" "),a("button",e._g({staticClass:"absolute p-0 text-center bg-black border-0 rounded-full opacity-0 download_overlay hover:bg-primary",attrs:{role:"button","aria-label":"download","data-link":e.link,tabindex:"0"}},e.$listeners),[a("i",{staticClass:"text-white cursor-pointer material-icons",attrs:{title:e.$t("globals.download_hint")}},[e._v("get_app")])])])},__vue_staticRenderFns__$i=[];const __vue_inject_styles__$i=function(e){if(!e)return;e("data-v-3e6c40e4_0",{source:".cover-container[data-v-3e6c40e4]{width:156px;height:156px;margin-bottom:10px}.cover-container .coverart[data-v-3e6c40e4]{backface-visibility:hidden;transition:.5s ease;height:auto}.cover-container .download_overlay[data-v-3e6c40e4]{top:50%;left:50%;transform:translate(-50%,-50%);transition:.5s ease;opacity:0;min-width:2rem;height:2.75rem;text-align:center}.cover-container .download_overlay i[data-v-3e6c40e4]{padding:.625rem}.cover-container .download_overlay[data-v-3e6c40e4]:focus{opacity:1}.cover-container:hover .coverart[data-v-3e6c40e4]{opacity:.75}.cover-container:hover .download_overlay[data-v-3e6c40e4]{opacity:1;border:0}",map:void 0,media:void 0})},__vue_scope_id__$i="data-v-3e6c40e4",__vue_module_identifier__$b=void 0,__vue_is_functional_template__$i=!1;function __vue_normalize__$i(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};o.__file="CoverContainer.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r;{let u;if(n&&(u=function(d){n.call(this,l(d))}),u!==void 0)if(o.functional){const d=o.render;o.render=function(m,h){return u.call(h),d(m,h)}}else{const d=o.beforeCreate;o.beforeCreate=d?[].concat(d,u):[u]}}return o}function __vue_create_injector__$b(){const e=document.head||document.getElementsByTagName("head")[0],n=__vue_create_injector__$b.styles||(__vue_create_injector__$b.styles={}),a=typeof navigator!="undefined"&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(i,s){if(document.querySelector('style[data-vue-ssr-id~="'+i+'"]'))return;const l=a?s.media||"default":i,c=n[l]||(n[l]={ids:[],parts:[],element:void 0});if(!c.ids.includes(i)){let o=s.source,u=c.ids.length;if(c.ids.push(i),s.map&&(o+=` /*# sourceURL=`+s.map.sources[0]+" */",o+=` /*# sourceMappingURL=data:application/json;base64,`+btoa(unescape(encodeURIComponent(JSON.stringify(s.map))))+" */"),a&&(c.element=c.element||document.querySelector("style[data-group="+l+"]")),!c.element){const d=c.element=document.createElement("style");d.type="text/css",s.media&&d.setAttribute("media",s.media),a&&(d.setAttribute("data-group",l),d.setAttribute("data-next-index","0")),e.appendChild(d)}if(a&&(u=parseInt(c.element.getAttribute("data-next-index")),c.element.setAttribute("data-next-index",u+1)),c.element.styleSheet)c.parts.push(o),c.element.styleSheet.cssText=c.parts.filter(Boolean).join(` -`);else{const d=document.createTextNode(o),f=c.element.childNodes;f[u]&&c.element.removeChild(f[u]),f.length?c.element.insertBefore(d,f[u]):c.element.appendChild(d)}}}}var CoverContainer=__vue_normalize__$i({render:__vue_render__$i,staticRenderFns:__vue_staticRenderFns__$i},__vue_inject_styles__$i,__vue_script__$g,__vue_scope_id__$i,__vue_is_functional_template__$i,__vue_module_identifier__$b,__vue_create_injector__$b),script$h={components:{PreviewControls,CoverContainer},data(){return{tracks:[],albums:[],artists:[],playlists:[],spotifyPlaylists:[],activeTab:"playlist",tabs:["playlist","album","artist","track"]}},computed:{activeTabEmpty(){let e=this.getActiveRelease();return e.length===0}},async created(){const e=await getFavoritesData();if(Object.entries(e).length===0)return;this.setFavorites(e)},mounted(){socket.on("updated_userFavorites",this.updated_userFavorites),socket.on("updated_userSpotifyPlaylists",this.updated_userSpotifyPlaylists),socket.on("updated_userPlaylists",this.updated_userPlaylists),socket.on("updated_userAlbums",this.updated_userAlbums),socket.on("updated_userArtist",this.updated_userArtist),socket.on("updated_userTracks",this.updated_userTracks),this.$on("hook:destroyed",()=>{socket.off("updated_userFavorites"),socket.off("updated_userSpotifyPlaylists"),socket.off("updated_userPlaylists"),socket.off("updated_userAlbums"),socket.off("updated_userArtist"),socket.off("updated_userTracks")})},methods:{playPausePreview(e){EventBus.$emit("trackPreview:playPausePreview",e)},convertDuration,downloadAllOfType(){try{let e=this.getActiveRelease();if(this.activeTab==="track"){let n=this.getLovedTracksPlaylist();sendAddToQueue(n.link)}else sendAddToQueue(aggregateDownloadLinks(e))}catch(e){console.error(e.message)}},addToQueue(e){sendAddToQueue(e.currentTarget.dataset.link)},updated_userSpotifyPlaylists(e){this.spotifyPlaylists=e},updated_userPlaylists(e){this.playlists=e},updated_userAlbums(e){this.albums=e},updated_userArtist(e){this.artists=e},updated_userTracks(e){this.tracks=e},reloadTabs(){this.$refs.reloadButton.classList.add("spin"),socket.emit("update_userFavorites"),localStorage.getItem("spotifyUser")&&socket.emit("update_userSpotifyPlaylists",localStorage.getItem("spotifyUser"))},updated_userFavorites(e){this.setFavorites(e),this.$refs.reloadButton.addEventListener("animationiteration",()=>{this.$refs.reloadButton.classList.remove("spin"),toast(this.$t("toasts.refreshFavs"),"done",!0)},{once:!0})},setFavorites(e){const{tracks:n,albums:a,artists:r,playlists:i}=e;this.tracks=n,this.albums=a,this.artists=r,this.playlists=i},getActiveRelease(e=this.activeTab){let n;switch(e){case"playlist":n=this.playlists;break;case"album":n=this.albums;break;case"artist":n=this.artists;break;case"track":n=this.tracks;break}return n},getTabLenght(e=this.activeTab){let n=this[`${e}s`].length;return n},getLovedTracksPlaylist(){let e=this.playlists.filter(n=>n.is_loved_track);if(e.length!==0)return e[0];throw new Error("No loved tracks playlist!")}}};const __vue_script__$h=script$h;var __vue_render__$j=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",[a("h1",{staticClass:"mb-8 text-5xl"},[e._v(` +`);else{const d=document.createTextNode(o),f=c.element.childNodes;f[u]&&c.element.removeChild(f[u]),f.length?c.element.insertBefore(d,f[u]):c.element.appendChild(d)}}}}var CoverContainer=__vue_normalize__$i({render:__vue_render__$i,staticRenderFns:__vue_staticRenderFns__$i},__vue_inject_styles__$i,__vue_script__$g,__vue_scope_id__$i,__vue_is_functional_template__$i,__vue_module_identifier__$b,__vue_create_injector__$b),script$h={components:{PreviewControls,CoverContainer,BaseTabs,BaseTab},data(){return{tracks:[],albums:[],artists:[],playlists:[],spotifyPlaylists:[],activeTab:"playlist",tabs:["playlist","album","artist","track"]}},computed:{activeTabEmpty(){let e=this.getActiveRelease();return e.length===0}},async created(){const e=await getFavoritesData();if(Object.entries(e).length===0)return;this.setFavorites(e)},mounted(){socket.on("updated_userFavorites",this.updated_userFavorites),socket.on("updated_userSpotifyPlaylists",this.updated_userSpotifyPlaylists),socket.on("updated_userPlaylists",this.updated_userPlaylists),socket.on("updated_userAlbums",this.updated_userAlbums),socket.on("updated_userArtist",this.updated_userArtist),socket.on("updated_userTracks",this.updated_userTracks),this.$on("hook:destroyed",()=>{socket.off("updated_userFavorites"),socket.off("updated_userSpotifyPlaylists"),socket.off("updated_userPlaylists"),socket.off("updated_userAlbums"),socket.off("updated_userArtist"),socket.off("updated_userTracks")})},methods:{playPausePreview(e){EventBus.$emit("trackPreview:playPausePreview",e)},convertDuration,downloadAllOfType(){try{let e=this.getActiveRelease();if(this.activeTab==="track"){let n=this.getLovedTracksPlaylist();sendAddToQueue(n.link)}else sendAddToQueue(aggregateDownloadLinks(e))}catch(e){console.error(e.message)}},addToQueue(e){sendAddToQueue(e.currentTarget.dataset.link)},updated_userSpotifyPlaylists(e){this.spotifyPlaylists=e},updated_userPlaylists(e){this.playlists=e},updated_userAlbums(e){this.albums=e},updated_userArtist(e){this.artists=e},updated_userTracks(e){this.tracks=e},reloadTabs(){this.$refs.reloadButton.classList.add("spin"),socket.emit("update_userFavorites"),localStorage.getItem("spotifyUser")&&socket.emit("update_userSpotifyPlaylists",localStorage.getItem("spotifyUser"))},updated_userFavorites(e){this.setFavorites(e),this.$refs.reloadButton.addEventListener("animationiteration",()=>{this.$refs.reloadButton.classList.remove("spin"),toast(this.$t("toasts.refreshFavs"),"done",!0)},{once:!0})},setFavorites(e){const{tracks:n,albums:a,artists:r,playlists:i}=e;this.tracks=n,this.albums=a,this.artists=r,this.playlists=i},getActiveRelease(e=this.activeTab){let n;switch(e){case"playlist":n=this.playlists;break;case"album":n=this.albums;break;case"artist":n=this.artists;break;case"track":n=this.tracks;break}return n},getTabLenght(e=this.activeTab){let n=this[`${e}s`].length;return n},getLovedTracksPlaylist(){let e=this.playlists.filter(n=>n.is_loved_track);if(e.length!==0)return e[0];throw new Error("No loved tracks playlist!")}}};const __vue_script__$h=script$h;var __vue_render__$j=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",[a("h1",{staticClass:"mb-8 text-5xl"},[e._v(` `+e._s(e.$t("favorites.title"))+` - `),a("div",{ref:"reloadButton",staticClass:"inline-block clickable reload-button",attrs:{role:"button","aria-label":"reload"},on:{click:e.reloadTabs}},[a("i",{staticClass:"material-icons"},[e._v("sync")])])]),e._v(" "),a("ul",{staticClass:"section-tabs"},e._l(e.tabs,function(r){return a("li",{key:r,staticClass:"section-tabs__tab favorites_tablinks",class:{active:e.activeTab===r},on:{click:function(i){e.activeTab=r}}},[e._v(` + `),a("div",{ref:"reloadButton",staticClass:"inline-block clickable reload-button",attrs:{role:"button","aria-label":"reload"},on:{click:e.reloadTabs}},[a("i",{staticClass:"material-icons"},[e._v("sync")])])]),e._v(" "),a("BaseTabs",e._l(e.tabs,function(r){return a("BaseTab",{key:r,class:{active:e.activeTab===r},on:{click:function(i){e.activeTab=r}}},[e._v(` `+e._s(e.$tc("globals.listTabs."+r,2))+` - `)])}),0),e._v(" "),e.activeTabEmpty?e._e():a("button",{staticClass:"btn btn-primary",staticStyle:{"margin-bottom":"2rem"},on:{click:e.downloadAllOfType}},[e._v(` + `)])}),1),e._v(" "),e.activeTabEmpty?e._e():a("button",{staticClass:"btn btn-primary",staticStyle:{"margin-bottom":"2rem"},on:{click:e.downloadAllOfType}},[e._v(` `+e._s(e.$t("globals.download",{thing:e.$tc("globals.listTabs."+e.activeTab+"N",e.getTabLenght())}))+` `)]),e._v(" "),a("div",{staticClass:"favorites_tabcontent",class:{"favorites_tabcontent--active":e.activeTab==="playlist"}},[e.playlists.length==0?a("div",[a("h1",[e._v(e._s(e.$t("favorites.noPlaylists")))])]):e._e(),e._v(" "),e.playlists.length>0||e.spotifyPlaylists>0?a("div",{staticClass:"release-grid"},[e._l(e.playlists,function(r){return a("div",{key:r.id,staticClass:"release"},[a("router-link",{staticClass:"cursor-pointer",attrs:{tag:"div",to:{name:"Playlist",params:{id:r.id}}}},[a("CoverContainer",{attrs:{"is-rounded":"",cover:r.picture_medium,link:r.link},on:{click:function(i){return i.stopPropagation(),e.addToQueue(i)}}}),e._v(" "),a("p",{staticClass:"primary-text"},[e._v(e._s(r.title))])],1),e._v(" "),a("p",{staticClass:"secondary-text"},[e._v(` `+e._s(e.$t("globals.by",{artist:r.creator.name})+" - "+e.$tc("globals.listTabs.trackN",r.nb_tracks))+` @@ -2770,7 +2774,7 @@ PERFORMANCE OF THIS SOFTWARE. `+e._s(e.convertDuration(r.duration))+` `)]),e._v(" "),a("td",{staticClass:"cursor-pointer group",attrs:{"data-link":r.link,role:"button","aria-label":"download"},on:{click:function(i){return i.stopPropagation(),e.addToQueue(i)}}},[a("div",{staticClass:"table__cell-content table__cell-content--vertical-center"},[a("i",{staticClass:"transition-colors duration-150 ease-in-out material-icons group-hover:text-primary",attrs:{title:e.$t("globals.download_hint")}},[e._v(` get_app - `)])])])],1)}),0):e._e()])])},__vue_staticRenderFns__$j=[];const __vue_inject_styles__$j=function(e){if(!e)return;e("data-v-26d194a8_0",{source:".favorites_tabcontent[data-v-26d194a8]{display:none}.favorites_tabcontent--active[data-v-26d194a8]{display:block}.reload-button.spin i[data-v-26d194a8]{animation:spin .5s infinite ease-out reverse}",map:void 0,media:void 0})},__vue_scope_id__$j="data-v-26d194a8",__vue_module_identifier__$c=void 0,__vue_is_functional_template__$j=!1;function __vue_normalize__$j(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};o.__file="Favorites.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r;{let u;if(n&&(u=function(d){n.call(this,l(d))}),u!==void 0)if(o.functional){const d=o.render;o.render=function(m,h){return u.call(h),d(m,h)}}else{const d=o.beforeCreate;o.beforeCreate=d?[].concat(d,u):[u]}}return o}function __vue_create_injector__$c(){const e=document.head||document.getElementsByTagName("head")[0],n=__vue_create_injector__$c.styles||(__vue_create_injector__$c.styles={}),a=typeof navigator!="undefined"&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(i,s){if(document.querySelector('style[data-vue-ssr-id~="'+i+'"]'))return;const l=a?s.media||"default":i,c=n[l]||(n[l]={ids:[],parts:[],element:void 0});if(!c.ids.includes(i)){let o=s.source,u=c.ids.length;if(c.ids.push(i),s.map&&(o+=` + `)])])])],1)}),0):e._e()])],1)},__vue_staticRenderFns__$j=[];const __vue_inject_styles__$j=function(e){if(!e)return;e("data-v-3a107fa2_0",{source:".favorites_tabcontent[data-v-3a107fa2]{display:none}.favorites_tabcontent--active[data-v-3a107fa2]{display:block}.reload-button.spin i[data-v-3a107fa2]{animation:spin .5s infinite ease-out reverse}",map:void 0,media:void 0})},__vue_scope_id__$j="data-v-3a107fa2",__vue_module_identifier__$c=void 0,__vue_is_functional_template__$j=!1;function __vue_normalize__$j(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};o.__file="Favorites.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r;{let u;if(n&&(u=function(d){n.call(this,l(d))}),u!==void 0)if(o.functional){const d=o.render;o.render=function(m,h){return u.call(h),d(m,h)}}else{const d=o.beforeCreate;o.beforeCreate=d?[].concat(d,u):[u]}}return o}function __vue_create_injector__$c(){const e=document.head||document.getElementsByTagName("head")[0],n=__vue_create_injector__$c.styles||(__vue_create_injector__$c.styles={}),a=typeof navigator!="undefined"&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(i,s){if(document.querySelector('style[data-vue-ssr-id~="'+i+'"]'))return;const l=a?s.media||"default":i,c=n[l]||(n[l]={ids:[],parts:[],element:void 0});if(!c.ids.includes(i)){let o=s.source,u=c.ids.length;if(c.ids.push(i),s.map&&(o+=` /*# sourceURL=`+s.map.sources[0]+" */",o+=` /*# sourceMappingURL=data:application/json;base64,`+btoa(unescape(encodeURIComponent(JSON.stringify(s.map))))+" */"),a&&(c.element=c.element||document.querySelector("style[data-group="+l+"]")),!c.element){const d=c.element=document.createElement("style");d.type="text/css",s.media&&d.setAttribute("media",s.media),a&&(d.setAttribute("data-group",l),d.setAttribute("data-next-index","0")),e.appendChild(d)}if(a&&(u=parseInt(c.element.getAttribute("data-next-index")),c.element.setAttribute("data-next-index",u+1)),c.element.styleSheet)c.parts.push(o),c.element.styleSheet.cssText=c.parts.filter(Boolean).join(` `);else{const d=document.createTextNode(o),f=c.element.childNodes;f[u]&&c.element.removeChild(f[u]),f.length?c.element.insertBefore(d,f[u]):c.element.appendChild(d)}}}}var Favorites=__vue_normalize__$j({render:__vue_render__$j,staticRenderFns:__vue_staticRenderFns__$j},__vue_inject_styles__$j,__vue_script__$h,__vue_scope_id__$j,__vue_is_functional_template__$j,__vue_module_identifier__$c,__vue_create_injector__$c);let homeData={},cached$3=!1;function getHomeData(){return cached$3?homeData:(socket.emit("get_home_data"),new Promise((e,n)=>{socket.on("init_home",a=>{homeData=a,cached$3=!0,socket.off("init_home"),e(a)})}))}var script$i={components:{CoverContainer},data(){return{playlists:[],albums:[]}},async created(){const e=await getHomeData();this.initHome(e)},computed:{...mapGetters(["isLoggedIn"])},methods:{addToQueue(e){sendAddToQueue(e.currentTarget.dataset.link)},initHome(e){const{playlists:{data:n},albums:{data:a}}=e;this.playlists=n,this.albums=a}}};const __vue_script__$i=script$i;var __vue_render__$k=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("div",{attrs:{id:"home_tab"}},[a("h1",{staticClass:"mb-8 text-5xl"},[e._v(e._s(e.$t("globals.welcome")))]),e._v(" "),e.isLoggedIn?e._e():a("section",{ref:"notLogged",staticClass:"py-6 border-0 border-t border-solid border-grayscale-500"},[a("p",{staticClass:"mb-4",attrs:{id:"home_not_logged_text"}},[e._v(e._s(e.$t("home.needTologin")))]),e._v(" "),a("router-link",{staticClass:"btn btn-primary",attrs:{tag:"button",name:"button",to:{name:"Settings"}}},[e._v(` @@ -2823,9 +2827,9 @@ PERFORMANCE OF THIS SOFTWARE. `+e._s(e.$t("globals.by",{artist:r.artistName})+" - "+e.$tc("globals.listTabs.trackN",r.playlistTracksNumber))+` `)])],1)}),0)]],2)},__vue_staticRenderFns__$q=[];const __vue_inject_styles__$q=void 0,__vue_scope_id__$q=void 0,__vue_is_functional_template__$q=!1;function __vue_normalize__$q(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="ResultsPlaylists.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var ResultsPlaylists=__vue_normalize__$q({render:__vue_render__$q,staticRenderFns:__vue_staticRenderFns__$q},__vue_inject_styles__$q,__vue_script__$o,__vue_scope_id__$q,__vue_is_functional_template__$q),script$p={components:{TopResult,ResultsTracks,ResultsAlbums,ResultsArtists,ResultsPlaylists},props:{viewInfo:{type:Object,required:!1}},computed:{thereAreResults(){let e=!!this.viewInfo;if(!e)return!1;let n=this.viewInfo.ORDER.every(a=>a==="TOP_RESULT"?this.viewInfo[a].length===0:this.viewInfo[a].data.length===0);return!n}},methods:{convertDuration,upperCaseFirstLowerCaseRest,standardizeData,formatSingleTrack,formatAlbums,formatArtist,formatPlaylist,checkSectionResults(e){return e==="TOP_RESULT"?!!this.viewInfo.TOP_RESULT[0]:!!this.viewInfo[e].data[0]}}};const __vue_script__$p=script$p;var __vue_render__$r=function(){var e=this,n=e.$createElement,a=e._self._c||n;return a("section",[e.thereAreResults?e._l(e.viewInfo.ORDER,function(r){return a("section",{key:r,staticClass:"float-none py-5 border-t border-grayscale-500 first:border-t-0"},[e.checkSectionResults(r)?[a("h2",{staticClass:"mb-6 capitalize",class:{"text-4xl text-center":r==="TOP_RESULT","inline-block cursor-pointer text-3xl hover:text-primary transition-colors duration-200 ease-in-out":r!=="TOP_RESULT"},on:{click:function(i){return e.$emit("change-search-tab",r)}}},[e._v(` `+e._s(e.$tc("globals.listTabs."+r.toLowerCase(),2))+` - `)]),e._v(" "),r==="TOP_RESULT"?a("TopResult",{attrs:{info:e.viewInfo.TOP_RESULT[0]},on:{"add-to-queue":function(i){return e.$emit("add-to-queue",i)}}}):r==="TRACK"?a("ResultsTracks",{attrs:{viewInfo:e.standardizeData(e.viewInfo.TRACK,e.formatSingleTrack),itemsToShow:6},on:{"add-to-queue":function(i){return e.$emit("add-to-queue",i)}}}):r=="ALBUM"?a("ResultsAlbums",{attrs:{viewInfo:e.standardizeData(e.viewInfo.ALBUM,e.formatAlbums),itemsToShow:6},on:{"add-to-queue":function(i){return e.$emit("add-to-queue",i)}}}):r=="PLAYLIST"?a("ResultsPlaylists",{attrs:{viewInfo:e.standardizeData(e.viewInfo.PLAYLIST,e.formatPlaylist),itemsToShow:6},on:{"add-to-queue":function(i){return e.$emit("add-to-queue",i)}}}):r==="ARTIST"?a("ResultsArtists",{attrs:{viewInfo:e.standardizeData(e.viewInfo.ARTIST,e.formatArtist),itemsToShow:6},on:{"add-to-queue":function(i){return e.$emit("add-to-queue",i)}}}):e._e()]:e._e()],2)}):a("div",[a("h1",[e._v(e._s(e.$t("search.noResults")))])])],2)},__vue_staticRenderFns__$r=[];const __vue_inject_styles__$r=void 0,__vue_scope_id__$r=void 0,__vue_is_functional_template__$r=!1;function __vue_normalize__$r(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="ResultsAll.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var ResultsAll=__vue_normalize__$r({render:__vue_render__$r,staticRenderFns:__vue_staticRenderFns__$r},__vue_inject_styles__$r,__vue_script__$p,__vue_scope_id__$r,__vue_is_functional_template__$r);const resetObj={data:[],next:0,total:0,hasLoaded:!1};var script$q={components:{BaseLoadingPlaceholder},props:{performScrolledSearch:{type:Boolean,required:!1}},data(){const e=this.$t.bind(this),n=this.$tc.bind(this);return{currentTab:{name:"",searchType:"",component:{},viewInfo:"",formatFunc:()=>{}},tabs:[{name:e("globals.listTabs.all"),searchType:"all",component:ResultsAll,viewInfo:"allTab"},{name:n("globals.listTabs.track",2),searchType:"track",component:ResultsTracks,viewInfo:"trackTab",formatFunc:formatSingleTrack},{name:n("globals.listTabs.album",2),searchType:"album",component:ResultsAlbums,viewInfo:"albumTab",formatFunc:formatAlbums},{name:n("globals.listTabs.artist",2),searchType:"artist",component:ResultsArtists,viewInfo:"artistTab",formatFunc:formatArtist},{name:n("globals.listTabs.playlist",2),searchType:"playlist",component:ResultsPlaylists,viewInfo:"playlistTab",formatFunc:formatPlaylist}],results:{query:"",allTab:{ORDER:[],TOP_RESULT:[],ALBUM:{hasLoaded:!1},ARTIST:{hasLoaded:!1},TRACK:{hasLoaded:!1},PLAYLIST:{hasLoaded:!1}},trackTab:{...resetObj},albumTab:{...resetObj},artistTab:{...resetObj},playlistTab:{...resetObj}}}},computed:{showSearchTab(){return this.results.query!==""},loadedTabs(){const e=[];for(const n in this.results)if(this.results.hasOwnProperty(n)){const a=this.results[n];a.hasLoaded&&e.push(n.replace(/Tab/g,""))}return e}},created(){this.currentTab=this.tabs[0]},mounted(){this.$root.$on("mainSearch:showNewResults",this.checkIfPerformNewMainSearch),this.$root.$on("mainSearch:updateResults",this.checkIfUpdateResults),socket.on("mainSearch",this.saveMainSearchResult),socket.on("search",this.handleSearch)},methods:{numberWithDots,convertDuration,addToQueue(e){sendAddToQueue(e.currentTarget.dataset.link)},getViewInfo(){return this.currentTab.searchType==="all"?this.results.allTab:standardizeData(this.results[this.currentTab.viewInfo],this.currentTab.formatFunc)},changeSearchTab(e){e=e.toLowerCase();const n=this.tabs.find(a=>a.searchType===e);if(!n){console.error(`No tab ${e} found`);return}window.scrollTo(0,0),this.currentTab=n},checkIfPerformNewMainSearch(e){let n=e!==this.results.query;n&&this.performNewMainSearch(e)},performNewMainSearch(e){socket.emit("mainSearch",{term:e}),this.$root.$emit("updateSearchLoadingState",!0),this.currentTab=this.tabs[0]},checkIfUpdateResults(e){let n=e===this.results.query&&this.currentTab.searchType!=="all";n&&(this.results[this.currentTab.searchType+"Tab"]={...resetObj},this.search(this.currentTab.searchType))},search(e){socket.emit("search",{term:this.results.query,type:e,start:this.results[`${e}Tab`].next,nb:30})},scrolledSearch(){if(this.currentTab.searchType==="all")return;const e=`${this.currentTab.searchType}Tab`,n=this.results[e].next{}},tabs:[{name:e("globals.listTabs.all"),searchType:"all",component:ResultsAll,viewInfo:"allTab"},{name:n("globals.listTabs.track",2),searchType:"track",component:ResultsTracks,viewInfo:"trackTab",formatFunc:formatSingleTrack},{name:n("globals.listTabs.album",2),searchType:"album",component:ResultsAlbums,viewInfo:"albumTab",formatFunc:formatAlbums},{name:n("globals.listTabs.artist",2),searchType:"artist",component:ResultsArtists,viewInfo:"artistTab",formatFunc:formatArtist},{name:n("globals.listTabs.playlist",2),searchType:"playlist",component:ResultsPlaylists,viewInfo:"playlistTab",formatFunc:formatPlaylist}],results:{query:"",allTab:{ORDER:[],TOP_RESULT:[],ALBUM:{hasLoaded:!1},ARTIST:{hasLoaded:!1},TRACK:{hasLoaded:!1},PLAYLIST:{hasLoaded:!1}},trackTab:{...resetObj},albumTab:{...resetObj},artistTab:{...resetObj},playlistTab:{...resetObj}}}},computed:{showSearchTab(){return this.results.query!==""},loadedTabs(){const e=[];for(const n in this.results)if(this.results.hasOwnProperty(n)){const a=this.results[n];a.hasLoaded&&e.push(n.replace(/Tab/g,""))}return e}},created(){this.currentTab=this.tabs[0]},mounted(){this.$root.$on("mainSearch:showNewResults",this.checkIfPerformNewMainSearch),this.$root.$on("mainSearch:updateResults",this.checkIfUpdateResults),socket.on("mainSearch",this.saveMainSearchResult),socket.on("search",this.handleSearch)},methods:{numberWithDots,convertDuration,addToQueue(e){sendAddToQueue(e.currentTarget.dataset.link)},getViewInfo(){return this.currentTab.searchType==="all"?this.results.allTab:standardizeData(this.results[this.currentTab.viewInfo],this.currentTab.formatFunc)},changeSearchTab(e){e=e.toLowerCase();const n=this.tabs.find(a=>a.searchType===e);if(!n){console.error(`No tab ${e} found`);return}window.scrollTo(0,0),this.currentTab=n},checkIfPerformNewMainSearch(e){let n=e!==this.results.query;n&&this.performNewMainSearch(e)},performNewMainSearch(e){socket.emit("mainSearch",{term:e}),this.$root.$emit("updateSearchLoadingState",!0),this.currentTab=this.tabs[0]},checkIfUpdateResults(e){let n=e===this.results.query&&this.currentTab.searchType!=="all";n&&(this.results[this.currentTab.searchType+"Tab"]={...resetObj},this.search(this.currentTab.searchType))},search(e){socket.emit("search",{term:this.results.query,type:e,start:this.results[`${e}Tab`].next,nb:30})},scrolledSearch(){if(this.currentTab.searchType==="all")return;const e=`${this.currentTab.searchType}Tab`,n=this.results[e].next + `)])}),1),e._v(" "),a("keep-alive",[a(e.currentTab.component,{tag:"component",attrs:{viewInfo:e.getViewInfo(),"want-headers":""},on:{"add-to-queue":e.addToQueue,"change-search-tab":e.changeSearchTab}})],1)],1)])},__vue_staticRenderFns__$s=[];const __vue_inject_styles__$s=void 0,__vue_scope_id__$s=void 0,__vue_is_functional_template__$s=!1;function __vue_normalize__$s(e,n,a,r,i,s,l,c){const o=(typeof a=="function"?a.options:a)||{};return o.__file="Search.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,i&&(o.functional=!0)),o._scopeId=r,o}var Search=__vue_normalize__$s({render:__vue_render__$s,staticRenderFns:__vue_staticRenderFns__$s},__vue_inject_styles__$s,__vue_script__$q,__vue_scope_id__$s,__vue_is_functional_template__$s),it$1=` diff --git a/src/components/globals/BaseTabs.js b/src/components/globals/BaseTabs.js new file mode 100644 index 0000000..88a46d1 --- /dev/null +++ b/src/components/globals/BaseTabs.js @@ -0,0 +1,33 @@ +import { defineComponent } from '@vue/composition-api' + +// https://vuejs.org/v2/guide/render-function.html +// https://vuejs.org/v2/guide/render-function.html#createElement-Arguments +export const BaseTab = defineComponent({ + name: 'BaseTab', + functional: true, + render(h, ctx) { + return h( + 'li', + { + class: [ctx.data.class, 'section-tabs__tab', 'uppercase-first-letter'], + on: ctx.data.on + }, + ctx.slots().default + ) + } +}) + +export const BaseTabs = defineComponent({ + name: 'BaseTabs', + functional: true, + render(h, ctx) { + return h( + 'ul', + { + class: [ctx.data.class, 'my-8', 'section-tabs'], + on: ctx.data.on + }, + ctx.slots().default + ) + } +}) diff --git a/src/components/pages/Artist.vue b/src/components/pages/Artist.vue index 490d848..3b355a0 100644 --- a/src/components/pages/Artist.vue +++ b/src/components/pages/Artist.vue @@ -13,17 +13,16 @@ -
    -
  • + {{ $tc(`globals.listTabs.${name}`, 2) }} -
    • -
+ + @@ -82,6 +81,8 @@ import { defineComponent, ref, unref, reactive, computed, onMounted, toRefs } from '@vue/composition-api' import { orderBy } from 'lodash-es' +import { BaseTabs, BaseTab } from '@components/globals/BaseTabs' + import { socket } from '@/utils/socket' import { sendAddToQueue } from '@/utils/downloads' import { checkNewRelease } from '@/utils/dates' @@ -89,6 +90,10 @@ import { formatArtistData, getArtistData } from '@/data/artist' import { standardizeData } from '@/data/standardize' export default defineComponent({ + components: { + BaseTabs, + BaseTab + }, setup(props, ctx) { const state = reactive({ currentTab: '', diff --git a/src/components/pages/Favorites.vue b/src/components/pages/Favorites.vue index c5a8174..0572d67 100644 --- a/src/components/pages/Favorites.vue +++ b/src/components/pages/Favorites.vue @@ -13,17 +13,11 @@ -
    -
  • + + {{ $tc(`globals.listTabs.${tab}`, 2) }} -
    • -
+ +