@christianriedl/media 1.0.292 → 1.0.293

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@christianriedl/media",
-  "version": "1.0.292",
+  "version": "1.0.293",
   "description": "RIC media interfaces",
 
   "main": "dist/index.js",
@@ -18,7 +18,7 @@
   "author": "Christian Riedl",
   "license": "ISC",
   "dependencies": {
-    "@christianriedl/utils": "^1.0.200",
+    "@christianriedl/utils": "^1.0.201",
     "@christianriedl/rest": "^1.0.97",
     "@christianriedl/epg": "^1.0.44",
     "buffer": "^6.0.3"

package/src/components/PhotoMap.vue

@@ -2,14 +2,12 @@
 <script setup lang="ts">
     import { inject, ref, toRef, computed, onMounted, watch } from 'vue';
     import { GoogleMap } from 'vue3-google-map'
-    import { authorizeSymbol } from '@christianriedl/rest';
     import { IPhotoMarker, IPhotoRegion, IPictureFile, getMediaBinSymbol, EOrientation, MediaHelper } from '@christianriedl/media';
 
-    const props = defineProps<{ location: string, zoom: number, selectRegion?: IPhotoRegion, fotos?: IPhotoMarker[] }>();
+    const props = defineProps<{ googleApiKey: string, location: string, zoom: number, selectRegion?: IPhotoRegion, fotos?: IPhotoMarker[] }>();
     const emits = defineEmits<{ (e: 'select', value: IPhotoRegion): void }>();
 
-    const authorize = inject(authorizeSymbol)!;
-    const apiKey = authorize.keyGoogleMaps;
+    const apiKey = props.googleApiKey;
     const getMediaService = inject(getMediaBinSymbol)!;
     const mediaService = getMediaService() ;
 

package/src/views/PhotoAlbumPage.vue

@@ -7,6 +7,7 @@
 	EMediaType, EPictureFlags, IPictureFile, IMediaFolder, IMediaService, IMediaAppConfig, EPictureQuality,
 	MediaHelper, getMediaBinSymbol, getPlayerSymbol
     } from '@christianriedl/media';
+    import { authorizeSymbol } from '@christianriedl/rest';
 
     import PhotoMetaData from '../components/PhotoMetaData.vue';
     import PhotoMap from '../components/PhotoMap.vue';
@@ -15,6 +16,8 @@
 
     const router = useRouter();
     const route = useRoute();
+    const authorize = inject(authorizeSymbol)!;
+    const googleApiKey = authorize.keyGoogleMaps;
     const appState = inject(appStateSymbol)!;
     const appConfig = inject(appConfigSymbol)!;
     const mediaAppConfig = appConfig as unknown as IMediaAppConfig;
@@ -481,7 +484,7 @@
 	<v-dialog v-model="showMap" :fullscreen="isMobile" width="50%">
 	    <v-card>
 		<v-card-text>
-		    <photo-map :location="location" :zoom="zoom"></photo-map>
+		    <photo-map :googleApiKey="googleApiKey" :location="location" :zoom="zoom"></photo-map>
 		</v-card-text>
 		<v-card-actions>
 		    <v-btn size="large" @click="showMap = false">

package/src/views/ThumbnailsPage.vue

@@ -2,7 +2,7 @@
     import { inject, ref, shallowRef, computed, onMounted, StyleValue } from 'vue';
     import { useRouter, useRoute } from 'vue-router';
     import { IAppState, appStateSymbol, IAppConfig, appConfigSymbol, EDevice, Helper } from '@christianriedl/utils';
-    import { IRestResult, IValueResult } from '@christianriedl/rest';
+    import { IRestResult, IValueResult, authorizeSymbol } from '@christianriedl/rest';
     import { EOrientation, EMediaType, IMediaFolder, IPictureFile, IMediaService, IMediaAppConfig,
              EPictureFlags, getMediaBinSymbol, MediaHelper, IPhotoRegion, IPhotoMarker
     } from '@christianriedl/media';
@@ -13,7 +13,10 @@
     const appConfig = inject(appConfigSymbol)!;
     const mediaAppConfig = appConfig as unknown as IMediaAppConfig;
     const getMediaService = inject(getMediaBinSymbol)!;
-    const mediaService = getMediaService() ;
+    const mediaService = getMediaService();
+    const authorize = inject(authorizeSymbol)!;
+    const googleApiKey = authorize.keyGoogleMaps;
+
     const heightStyle = computed<StyleValue>(() => { return { height: appState.bodyHeight.value + 'px', overflowY: 'auto' } });
     const isMobile = appState.isMobile && appState.device !== EDevice.iPad;
     const router = useRouter();
@@ -299,7 +302,7 @@
     <v-dialog v-model="showMap">
         <v-card>
             <v-card-text>
-                <photo-map :location="center" :zoom="zoom" :selectRegion="selectedRegion" :fotos="foundFotos" @select="onGpsSelect"></photo-map>
+                <photo-map :googleApiKey="googleApiKey" :location="center" :zoom="zoom" :selectRegion="selectedRegion" :fotos="foundFotos" @select="onGpsSelect"></photo-map>
             </v-card-text>
             <v-card-actions>
                 <v-btn size="large" @click="onCloseGps">