prepare for sharing music

src/components/dialogs/AlbumViewer.vue

@@ -211,6 +211,9 @@ export default {
     selectAlbum(album) {
       this.$store.dispatch("albums/selectAlbum", album);
     },
+    share() {
+      this.$store.dispatch("albums/share", this.selectedAlbum);
+    },
   },
   computed: {
     ...mapGetters({
@@ -340,16 +343,15 @@ export default {
   border-top: 1px solid #ffffff20;
   border-bottom: 1px solid #00000020;
 }
-
 #stats button {
   width: 32px;
   height: 32px;
 }
-
 #trackList {
   background-color: var(--white);
   z-index: 1;
 }
+
 @media (max-width: 480px) {
   #header {
     width: 100%;
@@ -358,7 +360,6 @@ export default {
     flex-direction: column;
   }
 }
-
 @media (max-width: 480px), (max-height: 480px) {
   #albumViewer {
     width: 100%;

src/components/dialogs/BoxViewer.vue

@@ -168,6 +168,9 @@ export default {
     resetCover() {
       this.$store.dispatch("boxes/resetCover", this.selectedBox);
     },
+    share() {
+      this.$store.dispatch("boxes/share", this.selectedBox);
+    },
   },
   computed: {
     ...mapGetters({
@@ -249,18 +252,10 @@ export default {
   position: relative;
   background-color: black;
 }
-
 #header img {
   align-self: center;
   width: 256px;
 }
-
-#videoList {
-  background-color: var(--white);
-  z-index: 1;
-  overflow: overlay;
-}
-
 #stats {
   z-index: 2;
   align-items: center;
@@ -271,16 +266,19 @@ export default {
   border-top: 1px solid #ffffff20;
   border-bottom: 1px solid #00000020;
 }
-
 #stats button {
   width: 32px;
   height: 32px;
 }
-
 #stats p {
   max-width: 192px;
   align-self: center;
 }
+#videoList {
+  background-color: var(--white);
+  z-index: 1;
+  overflow: overlay;
+}
 .video {
   width: 220px;
 }
@@ -293,7 +291,6 @@ export default {
     max-width: initial;
   }
 }
-
 @media (max-width: 480px), (max-height: 480px) {
   #boxViewer {
     width: 100%;

src/store/modules/albums/actions.js

@@ -153,5 +153,12 @@ export default {
       visibility: album.visibility
     }
     axios.put(context.rootGetters.server + "/api/albums/" + album._id, body, context.rootGetters.headers);
+  },
+  share(context, album) {
+    return new Promise((resolve) => {
+      axios.get(context.rootGetters.server + "/api/albums/" + album._id + "/share", context.rootGetters.headers).then(res => {
+        resolve(res.data);
+      });
+    })
   }
 }