HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

feat: instance ticker fallback and url preview image fallback

Browse source
This commit is contained in:
老周部落 2024-03-06 08:35:08 +08:00
parent f439723843
commit ef25f28c19
No known key found for this signature in database
GPG key ID: C72181CD85C6B738
7 changed files with 61 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
packages/backend/assets/resource-unknown.svg Normal file
View file

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="resource-unknown" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" viewBox="0 0 500 500" style="enable-background:new 0 0 500 500;" xml:space="preserve">
<style type="text/css">
.st0{fill:none;stroke:#FE7E01;stroke-width:10;stroke-miterlimit:10;}
.st1{fill:#FE7E01;}
</style>
<path class="st0" d="M350,450H150c-27.61,0-50-22.39-50-50V100c0-27.61,22.39-50,50-50h200c27.61,0,50,22.39,50,50v300
C400,427.61,377.61,450,350,450z"/>
<g>
<path class="st1" d="M230.62,279.62c-1.17-8-0.59-14.96,1.75-20.88c2.33-5.91,5.5-11.12,9.5-15.62s8.12-8.71,12.38-12.62
c4.25-3.91,7.88-7.88,10.88-11.88s4.5-8.5,4.5-13.5c0-6.83-2-12.12-6-15.88s-9.67-5.62-17-5.62c-5.84,0-11.25,1.29-16.25,3.88
c-5,2.59-9.92,6.54-14.75,11.88l-20.5-19c7-8,15.16-14.41,24.5-19.25c9.33-4.83,19.75-7.25,31.25-7.25
c10.5,0,19.79,1.79,27.88,5.38c8.08,3.59,14.46,8.92,19.12,16c4.66,7.09,7,15.96,7,26.62c0,7.5-1.54,13.92-4.62,19.25
c-3.09,5.34-6.84,10.09-11.25,14.25c-4.42,4.17-8.75,8.29-13,12.38c-4.25,4.09-7.67,8.62-10.25,13.62
c-2.59,5-3.54,11.09-2.88,18.25H230.62z M246.88,346.12c-6.34,0-11.59-2.04-15.75-6.12c-4.17-4.08-6.25-9.38-6.25-15.88
c0-6.66,2.12-12.04,6.38-16.12c4.25-4.08,9.46-6.12,15.62-6.12c6.33,0,11.58,2.04,15.75,6.12c4.16,4.09,6.25,9.46,6.25,16.12
c0,6.5-2.09,11.79-6.25,15.88C258.46,344.08,253.21,346.12,246.88,346.12z"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
packages/client/src/components/MkInstanceCardMini.vue
View file

@ -10,7 +10,7 @@
},
]"
>
<img class="icon" :src="getInstanceIcon(instance)" alt="" />
<img class="icon" :src="getInstanceIcon(instance)" @error="getInstanceIconErrorEvent($event)" alt="" />
<div class="body">
<span class="host">{{ instance.name ?? instance.host }}</span>
<span class="sub _monospace"
@ -37,6 +37,10 @@ function getInstanceIcon(instance: entities.Instance): string {
"/client-assets/dummy.png"
);
}
function getInstanceIconErrorEvent($event) {
$event.target.src = "/client-assets/dummy.png";
}
</script>
<style lang="scss" module>

6
packages/client/src/components/MkInstanceTicker.vue
View file

@ -9,7 +9,7 @@
class="hpaizdrt"
:style="bg"
>
<img class="icon" :src="getInstanceIcon(instance)" aria-hidden="true" />
<img class="icon" :src="getInstanceIcon(instance)" @error="getInstanceIconErrorEvent($event)" aria-hidden="true" />
<span class="name">{{ instance.name }}</span>
</div>
</template>
@ -84,6 +84,10 @@ function getInstanceIcon(instance): string {
"/client-assets/dummy.png"
);
}
function getInstanceIconErrorEvent($event) {
$event.target.src = "/client-assets/dummy.png";
}
</script>
<style lang="scss" scoped>

17
packages/client/src/components/MkUrlPreview.vue
View file

@ -17,7 +17,11 @@
}"
>
<div v-if="thumbnail" class="thumbnail">
<img :src="thumbnail" loading="lazy" />
<img
:src="thumbnail"
loading="lazy"
@error="imageErrorEvent($event)"
/>
<button
v-if="tweetId"
v-tooltip="
@ -55,7 +59,12 @@
<p :title="description">
<span>
<span :title="sitename || undefined">
<img v-if="icon" class="icon" :src="icon" />
<img
v-if="icon"
class="icon"
:src="icon"
@error="imageErrorEvent($event)"
/>
{{ sitename }}
</span>
{{ description }}
@ -181,6 +190,10 @@ function adjustTweetHeight(message: any) {
if (height) tweetHeight.value = height;
}
function imageErrorEvent($event) {
$event.target.src = "/static-assets/resource-unknown.svg";
}
window.addEventListener("message", adjustTweetHeight);
onUnmounted(() => {

5
packages/client/src/ui/_common_/statusbar-federation.vue
View file

@ -19,6 +19,7 @@
<img
class="icon"
:src="getInstanceIcon(instance)"
@error="getInstanceIconErrorEvent($event)"
alt=""
/>
<MkA
@ -82,6 +83,10 @@ function getInstanceIcon(instance): string {
"/client-assets/dummy.png"
);
}
function getInstanceIconErrorEvent($event) {
$event.target.src = "/client-assets/dummy.png";
}
</script>
<style lang="scss" scoped>

6
packages/client/src/widgets/federation.vue
View file

@ -23,7 +23,7 @@
:key="instance.id"
class="instance"
>
<img :src="getInstanceIcon(instance)" alt="" />
<img :src="getInstanceIcon(instance)" @error="getInstanceIconErrorEvent($event)" alt="" />
<div class="body">
<a
class="a"
@ -111,6 +111,10 @@ function getInstanceIcon(instance): string {
);
}
function getInstanceIconErrorEvent($event) {
$event.target.src = "/client-assets/dummy.png";
}
defineExpose<WidgetComponentExpose>({
name,
configure,

5
packages/client/src/widgets/instance-cloud.vue
View file

@ -11,6 +11,7 @@
<img
style="inline-size: 32px"
:src="getInstanceIcon(instance)"
@error="getInstanceIconErrorEvent($event)"
/>
</a>
</li>
@ -88,6 +89,10 @@ function getInstanceIcon(instance): string {
);
}
function getInstanceIconErrorEvent($event) {
$event.target.src = "/client-assets/dummy.png";
}
defineExpose<WidgetComponentExpose>({
name,
configure,