mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-30 07:48:13 +09:00
Code

Merge pull request #1977 from yarnaimo/embedded-tweet

Browse Source 
ツイートの埋め込み
This commit is contained in:
syuilo 2018-07-26 02:31:00 +09:00 committed by GitHub
commit 8736c9dfe6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 23 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/client/app/common/views/components/url-preview.vue
View File

@ -2,6 +2,9 @@
<iframe v-if="youtubeId" type="text/html" height="250" <iframe v-if="youtubeId" type="text/html" height="250"
:src="`https://www.youtube.com/embed/${youtubeId}?origin=${misskeyUrl}`" :src="`https://www.youtube.com/embed/${youtubeId}?origin=${misskeyUrl}`"
frameborder="0"/> frameborder="0"/>
<blockquote v-else-if="tweetUrl" class="twitter-tweet" ref="tweet">
<a :href="url"></a>
</blockquote>
<div v-else class="mk-url-preview"> <div v-else class="mk-url-preview">
<a :href="url" target="_blank" :title="url" v-if="!fetching"> <a :href="url" target="_blank" :title="url" v-if="!fetching">
<div class="thumbnail" v-if="thumbnail" :style="`background-image: url(${thumbnail})`"></div> <div class="thumbnail" v-if="thumbnail" :style="`background-image: url(${thumbnail})`"></div>
@ -34,6 +37,7 @@ export default Vue.extend({
icon: null, icon: null,
sitename: null, sitename: null,
youtubeId: null, youtubeId: null,
tweetUrl: null,
misskeyUrl misskeyUrl
}; };
}, },
@ -44,6 +48,25 @@ export default Vue.extend({
this.youtubeId = url.searchParams.get('v'); this.youtubeId = url.searchParams.get('v');
} else if (url.hostname == 'youtu.be') { } else if (url.hostname == 'youtu.be') {
this.youtubeId = url.pathname; this.youtubeId = url.pathname;
} else if (url.hostname == 'twitter.com' && /^\/.+\/status(es)?\/\d+/.test(url.pathname)) {
this.tweetUrl = url;
const twttr = (window as any).twttr || {};
const loadTweet = () => twttr.widgets.load(this.$refs.tweet);
if (twttr.widgets) {
Vue.nextTick(loadTweet);
} else {
const wjsId = 'twitter-wjs';
if (!document.getElementById(wjsId)) {
const head = document.getElementsByTagName('head')[0];
const script = document.createElement('script');
script.setAttribute('id', wjsId);
script.setAttribute('src', 'https://platform.twitter.com/widgets.js');
head.appendChild(script);
}
twttr.ready = loadTweet;
(window as any).twttr = twttr;
}
} else { } else {
fetch('/url?url=' + encodeURIComponent(this.url)).then(res => { fetch('/url?url=' + encodeURIComponent(this.url)).then(res => {
res.json().then(info => { res.json().then(info => {