diff --git a/resources/assets/js/components/presenter/MixedAlbumPresenter.vue b/resources/assets/js/components/presenter/MixedAlbumPresenter.vue index 817411760..ac98e4622 100644 --- a/resources/assets/js/components/presenter/MixedAlbumPresenter.vue +++ b/resources/assets/js/components/presenter/MixedAlbumPresenter.vue @@ -19,7 +19,7 @@ </video> <div v-else-if="media.type == 'Image'" slot="img" :title="media.description"> - <img :class="media.filter_class + ' d-block img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy"> + <img :class="media.filter_class + ' d-block img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </div> <p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p> @@ -58,7 +58,7 @@ </video> <div v-else-if="media.type == 'Image'" :title="media.description"> - <img :class="media.filter_class + ' img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy"> + <img :class="media.filter_class + ' img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </div> <p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p> diff --git a/resources/assets/js/components/presenter/PhotoAlbumPresenter.vue b/resources/assets/js/components/presenter/PhotoAlbumPresenter.vue index 2771adb03..8628778f2 100644 --- a/resources/assets/js/components/presenter/PhotoAlbumPresenter.vue +++ b/resources/assets/js/components/presenter/PhotoAlbumPresenter.vue @@ -7,7 +7,7 @@ </summary> <carousel ref="carousel" :centerMode="true" :loop="false" :per-page="1" :paginationPosition="'bottom-overlay'" paginationActiveColor="#3897f0" paginationColor="#dbdbdb"> <slide v-for="(img, index) in status.media_attachments" :key="'px-carousel-'+img.id + '-' + index" class="w-100 h-100 d-block mx-auto text-center" :title="img.description"> - <img :class="img.filter_class + ' img-fluid'" :src="img.url" :alt="img.description"> + <img :class="img.filter_class + ' img-fluid'" :src="img.url" :alt="img.description" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </slide> </carousel> </details> @@ -15,7 +15,7 @@ <div v-else class="w-100 h-100 p-0"> <carousel ref="carousel" :centerMode="true" :loop="false" :per-page="1" :paginationPosition="'bottom-overlay'" paginationActiveColor="#3897f0" paginationColor="#dbdbdb" class="p-0 m-0"> <slide v-for="(img, index) in status.media_attachments" :key="'px-carousel-'+img.id + '-' + index" class="" style="background: #000; display: flex;align-items: center;" :title="img.description"> - <img :class="img.filter_class + ' img-fluid w-100 p-0'" style="" :src="img.url" :alt="img.description"> + <img :class="img.filter_class + ' img-fluid w-100 p-0'" style="" :src="img.url" :alt="img.description" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </slide> </carousel> </div> diff --git a/resources/assets/js/components/presenter/PhotoPresenter.vue b/resources/assets/js/components/presenter/PhotoPresenter.vue index 6d1d22777..ac045b99d 100644 --- a/resources/assets/js/components/presenter/PhotoPresenter.vue +++ b/resources/assets/js/components/presenter/PhotoPresenter.vue @@ -6,13 +6,13 @@ <p class="font-weight-light">(click to show)</p> </summary> <div class="max-hide-overflow" :title="status.media_attachments[0].description"> - <img :class="status.media_attachments[0].filter_class + ' card-img-top'" :src="status.media_attachments[0].url" loading="lazy" :alt="status.media_attachments[0].description"> + <img :class="status.media_attachments[0].filter_class + ' card-img-top'" :src="status.media_attachments[0].url" loading="lazy" :alt="status.media_attachments[0].description" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </div> </details> </div> <div v-else> <div :title="status.media_attachments[0].description"> - <img :class="status.media_attachments[0].filter_class + ' card-img-top'" :src="status.media_attachments[0].url" loading="lazy" :alt="status.media_attachments[0].description"> + <img :class="status.media_attachments[0].filter_class + ' card-img-top'" :src="status.media_attachments[0].url" loading="lazy" :alt="status.media_attachments[0].description" onerror="this.onerror=null;this.src='/storage/no-preview.png'"> </div> </div> </template>