@christianriedl/media 1.0.42 → 1.0.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@christianriedl/media",
-  "version": "1.0.42",
+  "version": "1.0.43",
   "description": "RIC media interfaces",
 
   "main": "dist/index.js",

package/src/components/PhotoDownload.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
     import { inject, ref } from 'vue';
     import { Helper } from '@christianriedl/utils';
-    import { IMediaFolder, getMediaSymbol } from '@christianriedl/media';
+    import { IMediaFolder, MediaService, getMediaSymbol } from '@christianriedl/media';
 
     const props = defineProps<{ folder: IMediaFolder }>();
     const emits = defineEmits<{ (e: 'close'): void }>();
@@ -22,9 +22,9 @@
     }
 
     const quality = ref<Quality>(Quality.Medium);
-    const qualities = Helper.getEnumOptions(Quality);
+    const qualities = Helper.getEnumOptions(Quality, true);
     const height = ref<Height>(Height.Medium);
-    const heights = Helper.getEnumOptions(Height);
+    const heights = Helper.getEnumOptions(Height, true);
 
     function onChange() {
         if (height.value == Height.Original)
@@ -33,17 +33,18 @@
     function onCancel() {
         emits('close');
     }
-    function download() {
-        const downloadUrl = mediaService.getPictureDownloadUrl(props.folder.Url, height.value, quality.value);
+    async function onDownload() {
+        const folder = await mediaService.getPhotos(props.folder);
+        const downloadUrl = mediaService.getPicturesDownloadUrl(folder.Url, height.value, quality.value);
         window.open(downloadUrl);
         emits('close');
     }
 </script>
 
 <template>
-    <v-card class="bg-media" :width="300">
+    <v-card class="bg-media" :width="500">
         <v-card-title class="headline">Download Pictures</v-card-title>
-        <v-card-subtitle class="headline">Only Original Height includes MetaData</v-card-subtitle>
+        <v-card-subtitle>Only 'Original' height includes metadata</v-card-subtitle>
         <v-card-text>
             <v-container>
                 <v-row dense align="center">
@@ -57,7 +58,7 @@
                         </v-select>
                     </v-col>
                     <v-col cols="4">
-                        <v-text-field name="quality" type="number" v-model="quality" density="compact" hide-details></v-text-field>
+                        <v-text-field type="number" v-model="quality" density="compact" hide-details></v-text-field>
                     </v-col>
                 </v-row>
                 <v-row dense align="center">
@@ -71,17 +72,19 @@
                         </v-select>
                     </v-col>
                     <v-col cols="4">
-                        <v-text-field name="height" type="number" v-model="height" density="compact" hide-details></v-text-field>
+                        <v-text-field type="number" v-model="height" density="compact" hide-details></v-text-field>
                     </v-col>
                 </v-row>
             </v-container>
         </v-card-text>
         <v-card-actions>
-            <v-btn icon="$close" @click="onCancel">CANCEL</v-btn>
-            <v-btn icon="$download" @click="onDownload">Download</v-btn>
+            <v-btn icon="$download" class="action-btn" variant="text" @click="onDownload">Download</v-btn>
         </v-card-actions>
     </v-card>
 </template>
 
 <style scoped>
+    .action-btn {
+        justify-content: left
+    }
 </style>

package/src/views/PhotosPage.vue

@@ -203,7 +203,7 @@
                 </template>
                 <v-list-item v-for="subItem in item.Folders" :key="subItem.DLNAID" :title="itemText(subItem)" :value="itemText(subItem)" density="compact" @click.stop="listSubItem(subItem)">
                     <template v-slot:append>
-                        <v-btn variant="text" color="grey" icon="$download" @click.stop.prevent="onDownload(item)"></v-btn>
+                        <v-btn variant="text" color="grey" icon="$download" @click.stop.prevent="onDownload(subItem)"></v-btn>
                         <v-btn variant="text" color="grey" icon="$grid" @click.stop.prevent="onLightbox(subItem)"></v-btn>
                     </template>
                 </v-list-item>
@@ -211,7 +211,7 @@
         </v-list>
     </v-card>
     <v-dialog v-model="showDownload">
-        <photo-download :folder="downloadFolder" @close="onCloseDialog"></photo-download>
+        <photo-download :folder="downloadFolder" v-click-outside="onCloseDialog" @close="onCloseDialog"></photo-download>
     </v-dialog>
 </template>