finish share menu

public/config.json

@@ -1,5 +1,5 @@
 {
-  "backend_de": "http://localhost:31204",
-  "backend_dev": "https://webplay.rocks",
+  "backend_dev": "http://localhost:31204",
+  "backend_de": "https://webplay.rocks",
   "backend": "https://webplay.rocks"
 }

src/components/dialogs/AlbumViewer.vue

@@ -37,9 +37,12 @@
                   }}
                 </button>
                 <hr />
-                <button @click="shareObject">
+                <button v-if="!selectedAlbum.share._id" @click="shareEnable">
                   <awesome-icon icon="share" />Share this album
                 </button>
+                <button v-else @click="shareDisable">
+                  <awesome-icon icon="share" />Remove share
+                </button>
               </div>
             </template>
           </DropDown>
@@ -59,7 +62,6 @@
               </span>
             </p>
           </div>
-
           <DropDown v-if="$store.getters['user/isAdministrator']">
             <button class="flat center">
               <awesome-icon icon="ellipsis-v" />
@@ -211,8 +213,11 @@ export default {
     selectAlbum(album) {
       this.$store.dispatch("albums/selectAlbum", album);
     },
-    share() {
-      this.$store.dispatch("albums/share", this.selectedAlbum);
+    shareEnable() {
+      this.$store.dispatch("albums/shareEnable", this.selectedAlbum);
+    },
+    shareDisable() {
+      this.$store.dispatch("albums/shareDisable", this.selectedAlbum);
     },
   },
   computed: {

src/components/dialogs/BoxViewer.vue

@@ -21,55 +21,60 @@
           :class="{ active: isFavourite }"
           @click="toggleFavourite"
         />
-        <div id="stats" class="z1 pa4">
-          <div class="flex-row">
-            <DropDown v-if="$store.getters['user/isAdministrator']">
-              <button class="flat center" :title="visibility_text">
-                <awesome-icon :icon="visibility_icon" />
-              </button>
-              <template v-slot:dropdown-content>
-                <div>
-                  <button
-                    v-for="(item, i) in $store.state.system.lists.visibility"
-                    :key="i"
-                    @click="setVisibility(item)"
-                  >
-                    <awesome-icon :icon="getVisibilityIcon(item)" />{{
-                      getVisibilityText(item)
-                    }}
-                  </button>
-                </div>
-              </template>
-            </DropDown>
-            <div class="grow flex-column">
-              <p class="ma4 center">
-                <span class="">
-                  <b>{{ selectedBox.title }}</b>
-                  <br />
-                  <b>{{ box_videos.length }}</b> Videos
-                </span>
-              </p>
-            </div>
-            <DropDown v-if="$store.getters['user/isAdministrator']">
-              <button class="flat center">
-                <awesome-icon icon="ellipsis-v" />
-              </button>
-              <template v-slot:dropdown-content>
-                <div>
-                  <button @click="uploadNewCover">
-                    <awesome-icon icon="image" />Set new Cover...
-                  </button>
-                  <button @click="resetCover">
-                    <awesome-icon icon="eraser" />Reset Cover
-                  </button>
-                  <hr />
-                  <button @click="mergeBox">
-                    <awesome-icon icon="compress-alt" />Merge Boxes...
-                  </button>
-                </div>
-              </template>
-            </DropDown>
+        <div id="stats" class="flex-row z1">
+          <DropDown v-if="$store.getters['user/isAdministrator']">
+            <button class="flat center" :title="visibility_text">
+              <awesome-icon :icon="visibility_icon" />
+            </button>
+            <template v-slot:dropdown-content>
+              <div>
+                <button
+                  v-for="(item, i) in $store.state.system.lists.visibility"
+                  :key="i"
+                  @click="setVisibility(item)"
+                >
+                  <awesome-icon :icon="getVisibilityIcon(item)" />{{
+                    getVisibilityText(item)
+                  }}
+                </button>
+                <hr />
+                <button v-if="!selectedBox.share._id" @click="shareEnable">
+                  <awesome-icon icon="share" />Share this box
+                </button>
+                <button v-else @click="shareDisable">
+                  <awesome-icon icon="share" />Remove share
+                </button>
+              </div>
+            </template>
+          </DropDown>
+          <div class="grow flex-column">
+            <p class="ma4 center">
+              <span class="">
+                <b>{{ selectedBox.title }}</b>
+                <br />
+                <b>{{ box_videos.length }}</b> Videos
+              </span>
+            </p>
           </div>
+          <DropDown v-if="$store.getters['user/isAdministrator']">
+            <button class="flat center">
+              <awesome-icon icon="ellipsis-v" />
+            </button>
+            <template v-slot:dropdown-content>
+              <div>
+                <button @click="uploadNewCover">
+                  <awesome-icon icon="image" />Set new Cover...
+                </button>
+                <button @click="resetCover">
+                  <awesome-icon icon="eraser" />Reset Cover
+                </button>
+                <hr />
+                <button @click="mergeBox">
+                  <awesome-icon icon="compress-alt" />Merge Boxes...
+                </button>
+              </div>
+            </template>
+          </DropDown>
         </div>
       </div>
 
@@ -168,8 +173,11 @@ export default {
     resetCover() {
       this.$store.dispatch("boxes/resetCover", this.selectedBox);
     },
-    share() {
-      this.$store.dispatch("boxes/share", this.selectedBox);
+    shareEnable() {
+      this.$store.dispatch("boxes/shareEnable", this.selectedBox);
+    },
+    shareDisable() {
+      this.$store.dispatch("boxes/shareDisable", this.selectedBox);
     },
   },
   computed: {

src/store/modules/albums/actions.js

@@ -154,11 +154,14 @@ export default {
     }
     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);
-      });
-    })
+  shareEnable(context, album) {
+    axios.post(context.rootGetters.server + "/api/albums/" + album._id + "/share", {}, context.rootGetters.headers).then(res => {
+      album.share = res.data;
+    });
+  },
+  shareDisable(context, album) {
+    axios.delete(context.rootGetters.server + "/api/albums/" + album._id + "/share", context.rootGetters.headers).then(() => {
+      album.share = {};
+    });
   }
 }

src/store/modules/albums/mutations.js

@@ -59,6 +59,7 @@ export default {
 
       } else if (existsAlbum && album.tracks.length > 0) {
         existsAlbum.covers = album.covers || {};
+        existsAlbum.share = album.share;
         existsAlbum.tracks = album.tracks;
         existsAlbum.tracks.forEach((track) => {
           track.parent = existsAlbum;

src/store/modules/albums/state.js

@@ -1,7 +1,7 @@
 export default {
     collection: [],
     newest: [],
-    selectedAlbum: { tracks: [], covers: {} },
+    selectedAlbum: { tracks: [], covers: {}, share: {} },
     page: 1,
     loading: false,
     eos: false

src/store/modules/boxes/actions.js

@@ -130,4 +130,14 @@ export default {
       box.covers = {}
     });
   },
+  shareEnable(context, box) {
+    axios.post(context.rootGetters.server + "/api/boxes/" + box._id + "/share", {}, context.rootGetters.headers).then(res => {
+      box.share = res.data;
+    });
+  },
+  shareDisable(context, box) {
+    axios.delete(context.rootGetters.server + "/api/boxes/" + box._id + "/share", context.rootGetters.headers).then(() => {
+      box.share = {};
+    });
+  }
 }

src/store/modules/boxes/mutations.js

@@ -50,6 +50,7 @@ export default {
         });
       } else if (existsBox && box.videos.length > 0) {
         existsBox.covers = box.covers || {};
+        existsBox.share = box.share;
         existsBox.videos = box.videos;
         existsBox.videos.forEach((video) => {
           video.parent = existsBox;

src/store/modules/boxes/state.js

@@ -1,7 +1,7 @@
 export default {
     collection: [],
     newest: [],
-    selectedBox: { videos: [], covers: {} },
+    selectedBox: { videos: [], covers: {}, share: {} },
     page: 1,
     loading: false,
     eos: false