@christianriedl/media 1.0.95 → 1.0.97
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/iMedia.d.ts +2 -0
- package/dist/iMedia.js.map +1 -1
- package/package.json +1 -1
- package/src/views/PhotoAlbumPage.vue +41 -2
package/dist/iMedia.d.ts
CHANGED
|
@@ -25,6 +25,7 @@ export interface IMediaAppConfig {
|
|
|
25
25
|
pictureQuality: EPictureQuality;
|
|
26
26
|
linkDaysValid: number;
|
|
27
27
|
useSatIp: boolean;
|
|
28
|
+
useImagePreload: boolean;
|
|
28
29
|
}
|
|
29
30
|
export declare enum EItemType {
|
|
30
31
|
None = 0,
|
|
@@ -155,6 +156,7 @@ export interface IPictureFile extends IMediaFile {
|
|
|
155
156
|
ThumbHeight: number;
|
|
156
157
|
ThumbWidth: number;
|
|
157
158
|
selected?: boolean;
|
|
159
|
+
blob?: string;
|
|
158
160
|
}
|
|
159
161
|
export interface IAudioFile extends IMediaFile {
|
|
160
162
|
BitRate: number;
|
package/dist/iMedia.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"iMedia.js","sourceRoot":"","sources":["../src/iMedia.ts"],"names":[],"mappings":"AAEA,MAAM,CAAN,IAAY,UASX;AATD,WAAY,UAAU;IAClB,6CAAS,CAAA;IACT,6CAAS,CAAA;IACT,iDAAW,CAAA;IACX,4CAAS,CAAA;IACT,0DAAgB,CAAA;IAChB,iDAAa,CAAA;IACb,6CAAW,CAAA;IACX,mDAAc,CAAA;AAClB,CAAC,EATW,UAAU,KAAV,UAAU,QASrB;AACD,MAAM,CAAN,IAAY,eAWX;AAXD,WAAY,eAAe;IACvB,qDAAiB,CAAA;IACjB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,kEAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,8DAAoB,CAAA;AACxB,CAAC,EAXW,eAAe,KAAf,eAAe,QAW1B;
|
|
1
|
+
{"version":3,"file":"iMedia.js","sourceRoot":"","sources":["../src/iMedia.ts"],"names":[],"mappings":"AAEA,MAAM,CAAN,IAAY,UASX;AATD,WAAY,UAAU;IAClB,6CAAS,CAAA;IACT,6CAAS,CAAA;IACT,iDAAW,CAAA;IACX,4CAAS,CAAA;IACT,0DAAgB,CAAA;IAChB,iDAAa,CAAA;IACb,6CAAW,CAAA;IACX,mDAAc,CAAA;AAClB,CAAC,EATW,UAAU,KAAV,UAAU,QASrB;AACD,MAAM,CAAN,IAAY,eAWX;AAXD,WAAY,eAAe;IACvB,qDAAiB,CAAA;IACjB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,gEAAoB,CAAA;IACpB,kEAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,4DAAoB,CAAA;IACpB,8DAAoB,CAAA;AACxB,CAAC,EAXW,eAAe,KAAf,eAAe,QAW1B;AAQD,MAAM,CAAN,IAAY,SAoDX;AApDD,WAAY,SAAS;IACjB,yCAAQ,CAAA;IACR,mDAAa,CAAA;IACb,uDAAe,CAAA;IACf,uDAAe,CAAA;IACf,6DAAkB,CAAA;IAClB,iEAAoB,CAAA;IACpB,iEAAoB,CAAA;IACpB,iEAAoB,CAAA;IACpB,iEAAoB,CAAA;IACpB,mDAAgB,CAAA;IAChB,6CAAa,CAAA;IACb,4CAAY,CAAA;IACZ,4CAAY,CAAA;IACZ,gDAAc,CAAA;IACd,6DAAoB,CAAA;IACpB,qDAAgB,CAAA;IAChB,yCAAa,CAAA;IACb,mDAA6C,CAAA;IAC7C,oDAA0B,CAAA;IAC1B,wDAAkC,CAAA;IAClC,wDAAkC,CAAA;IAClC,8DAAqC,CAAA;IACrC,sDAAiC,CAAA;IACjC,wDAAkC,CAAA;IAClC,sDAAiC,CAAA;IACjC,0DAAmC,CAAA;IACnC,uEAA0C,CAAA;IAC1C,2EAA8C,CAAA;IAC9C,sDAAkB,CAAA;IAClB,+DAAkC,CAAA;IAClC,oDAA0B,CAAA;IAC1B,wDAAkC,CAAA;IAClC,wDAAkC,CAAA;IAClC,8DAAqC,CAAA;IACrC,4DAAoC,CAAA;IACpC,uEAA0C,CAAA;IAC1C,2EAA8C,CAAA;IAC9C,yEAA+C,CAAA;IAC/C,oDAAiB,CAAA;IACjB,+DAAkC,CAAA;IAClC,wDAA8B,CAAA;IAC9B,4DAAsC,CAAA;IACtC,4DAAsC,CAAA;IACtC,kEAAyC,CAAA;IACzC,gEAAwC,CAAA;IACxC,wDAAoC,CAAA;IACpC,0DAAqC,CAAA;IACrC,wDAAqB,CAAA;IACrB,uDAA+C,CAAA;IAC/C,qDAAgB,CAAA;IAChB,yCAAU,CAAA;AACd,CAAC,EApDW,SAAS,KAAT,SAAS,QAoDpB;AACD,MAAM,CAAN,IAAY,MAUX;AAVD,WAAY,MAAM;IACd,mCAAQ,CAAA;IACR,yDAAsB,CAAA;IACtB,2CAAe,CAAA;IACf,+CAAiB,CAAA;IACjB,qDAAoB,CAAA;IACpB,kDAAkB,CAAA;IAClB,sDAAoB,CAAA;IACpB,0DAAsB,CAAA;IACtB,+DAAwB,CAAA;AAC5B,CAAC,EAVW,MAAM,KAAN,MAAM,QAUjB;AAwDD,MAAM,CAAN,IAAY,YAQX;AARD,WAAY,YAAY;IAEpB,+CAAQ,CAAA;IACR,qDAAW,CAAA;IACX,6DAAe,CAAA;IACf,uDAAY,CAAA;IACZ,2DAAc,CAAA;IACd,yDAAa,CAAA;AACjB,CAAC,EARW,YAAY,KAAZ,YAAY,QAQvB"}
|
package/package.json
CHANGED
|
@@ -28,12 +28,15 @@
|
|
|
28
28
|
const interval = ref(8000);
|
|
29
29
|
const hasCoordinates = ref(false);
|
|
30
30
|
const carousel = ref<ComponentPublicInstance | null>(null);
|
|
31
|
+
const itemName = ref("");
|
|
32
|
+
const albumName = ref("");
|
|
31
33
|
let origUrl = "";
|
|
32
34
|
let gpsLng: number[];
|
|
33
35
|
let gpsLat: number[];
|
|
34
36
|
let mouseDownTime: number = 0;
|
|
35
37
|
let mouseTimer: number = -1;
|
|
36
38
|
let nameTimer: number = -1;
|
|
39
|
+
let nextIndex: number = -1;
|
|
37
40
|
const showName = ref(false);
|
|
38
41
|
|
|
39
42
|
watch([appState.bodyHeight, appState.pageWidth], () => {
|
|
@@ -60,6 +63,7 @@
|
|
|
60
63
|
return false;
|
|
61
64
|
}
|
|
62
65
|
const photos = await mediaService.getPhotos(folder);
|
|
66
|
+
albumName.value = photos.Name;
|
|
63
67
|
if(photos.Files.length > 0) {
|
|
64
68
|
items.splice(0, items.length, ...photos.Files as IPictureFile[]);
|
|
65
69
|
if (route.query.start) {
|
|
@@ -369,6 +373,7 @@
|
|
|
369
373
|
}
|
|
370
374
|
function clearName() { // also called by VImg::loadstart
|
|
371
375
|
showName.value = false;
|
|
376
|
+
itemName.value = "";
|
|
372
377
|
if (nameTimer >= 0) {
|
|
373
378
|
window.clearTimeout(nameTimer);
|
|
374
379
|
nameTimer = -1;
|
|
@@ -378,16 +383,50 @@
|
|
|
378
383
|
infoDialog.value = false;
|
|
379
384
|
clearName();
|
|
380
385
|
const item = items[index.value];
|
|
386
|
+
if (mediaAppConfig.useImagePreload) {
|
|
387
|
+
if (index.value != nextIndex) {
|
|
388
|
+
item.blob = "/pwa/img/Wait.png";
|
|
389
|
+
createBlob(item);
|
|
390
|
+
}
|
|
391
|
+
}
|
|
392
|
+
else {
|
|
393
|
+
item.blob = getUrl(item);
|
|
394
|
+
}
|
|
381
395
|
nameTimer = window.setTimeout(() => { onLoad(item); }, 200);
|
|
382
396
|
}
|
|
383
397
|
function onLoad(item: IPictureFile) { // img loaded or cached
|
|
398
|
+
if (item.blob && item.blob.startsWith("blob")) {
|
|
399
|
+
window.URL.revokeObjectURL(item.blob);
|
|
400
|
+
}
|
|
401
|
+
const next = index.value + 1;
|
|
402
|
+
if (next < items.length && next > nextIndex) {
|
|
403
|
+
nextIndex = next;
|
|
404
|
+
createBlob (items[nextIndex]);
|
|
405
|
+
}
|
|
384
406
|
clearName();
|
|
385
407
|
const idx = item.Url.lastIndexOf('.');
|
|
386
408
|
const name = item.Url.substr(0, idx);
|
|
387
409
|
if (!item.Name.includes(name)) {
|
|
388
410
|
showName.value = true;
|
|
411
|
+
itemName.value = item.Name;
|
|
389
412
|
nameTimer = window.setTimeout(() => { clearName(); }, mediaAppConfig.nameDurationMS);
|
|
390
413
|
}
|
|
414
|
+
else if (item.LocationIdx >= 0) {
|
|
415
|
+
const location = mediaService.getListEntry("Picture.Location", item.LocationIdx);
|
|
416
|
+
if (location && !albumName.value.includes(location)) {
|
|
417
|
+
showName.value = true;
|
|
418
|
+
itemName.value = location;
|
|
419
|
+
nameTimer = window.setTimeout(() => { clearName(); }, mediaAppConfig.nameDurationMS);
|
|
420
|
+
}
|
|
421
|
+
}
|
|
422
|
+
}
|
|
423
|
+
function createBlob (item: IPictureFile) {
|
|
424
|
+
const url = getUrl (item).substr(38); // trim mediaserver url
|
|
425
|
+
mediaService.getImage(url)
|
|
426
|
+
.then((blob) => {
|
|
427
|
+
item.blob = window.URL.createObjectURL(blob);
|
|
428
|
+
});
|
|
429
|
+
|
|
391
430
|
}
|
|
392
431
|
</script>
|
|
393
432
|
|
|
@@ -396,9 +435,9 @@
|
|
|
396
435
|
<v-carousel ref="carousel" hide-delimiters :show-arrows="false" v-model="index"
|
|
397
436
|
:width="width" :height="height" :cycle="cycle" :interval="interval"
|
|
398
437
|
@click="onClick" @mousedown="onMouseDown" @update:modelValue="onUpdate">
|
|
399
|
-
<v-carousel-item v-for="item in items" :key="item.DLNAID" :src="
|
|
438
|
+
<v-carousel-item v-for="item in items" :key="item.DLNAID" :src="item.blob" :alt="item.Name" :width="getWidth(item)" :height="getHeight(item)"
|
|
400
439
|
@load="onLoad(item)" @loadstart="clearName()">
|
|
401
|
-
<h2 v-if="showName" class="imgtext">{{
|
|
440
|
+
<h2 v-if="showName" class="imgtext">{{itemName}}</h2>
|
|
402
441
|
</v-carousel-item>
|
|
403
442
|
</v-carousel>
|
|
404
443
|
<v-dialog v-model="infoDialog" :fullscreen="isMobile" >
|