keith/barkey
1
0
Fork 0
mirror of https://codeberg.org/yeentown/barkey synced 2024-11-25 18:45:13 +00:00
Code Issues Projects Releases Packages Wiki Activity

Embed YouTube

Browse source
This commit is contained in:
syuilo 2018-03-19 02:56:35 +09:00
parent 8164dd0c2b
commit e0ce00bacd
1 changed files with 40 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/web/app/common/views/components/url-preview.vue
View file

@ -1,4 +1,8 @@
<template>
<iframe v-if="youtubeId" type="text/html" height="250"
:src="`http://www.youtube.com/embed/${youtubeId}`"
frameborder="0"/>
<div v-else>
<a class="mk-url-preview" :href="url" target="_blank" :title="url" v-if="!fetching">
<div class="thumbnail" v-if="thumbnail" :style="`background-image: url(${thumbnail})`"></div>
<article>
@ -12,6 +16,7 @@
</footer>
</article>
</a>
</div>
</template>
<script lang="ts">
@ -26,10 +31,18 @@ export default Vue.extend({
description: null,
thumbnail: null,
icon: null,
sitename: null
sitename: null,
youtubeId: null
};
},
created() {
const url = new URL(this.url);
if (url.hostname == 'www.youtube.com') {
this.youtubeId = url.searchParams.get('v');
} else if (url.hostname == 'youtu.be') {
this.youtubeId = url.pathname;
} else {
fetch('/api:url?url=' + this.url).then(res => {
res.json().then(info => {
this.title = info.title;
@ -42,10 +55,14 @@ export default Vue.extend({
});
});
}
}
});
</script>
<style lang="stylus" scoped>
iframe
width 100%
.mk-url-preview
display block
font-size 16px