Kiite Worldやニコニコ動画で再生している動画のなうぷれツイートをワンクリックでコピーするブックマークレット

# 1.概要
 Kiite Worldや、ニコニコ動画で再生中の動画のなうぷれツイートを、たったワンクリックでクリップボードにコピーします。

Kiite Worldでなうぷれしようとすると、新しいタブが開かれるのがうっとうしかったので、作りました。

((ついでにニコ動のなうぷれにも対応させました。))


# 2.ブックマークレット
:::note info
(追記)
2024/1/17のKiite Worldアップデートに対応しました。
アプデの詳細はこちら→https://twitter.com/KiiteJP/status/1747557161394397647
:::

↓2024/1/17~ver
```javascript:
javascript:(function(){const currentURL=window.location.href;if(currentURL.startsWith("https://world.kiite.jp")){const iframeVideo=document.querySelector("iframe");const textVideoId=iframeVideo.parentNode.id;const videoId=textVideoId.substring(13);const elements=document.querySelectorAll(".bgt2.primary--text");const targetElement=elements[0];title=targetElement.textContent.trim().substring(2);const ownerName=document.querySelector('span.kw').parentNode.textContent.trim().split('\n')[0];const worldName=document.querySelector('div.font-size-s.text-center.ellipsis_single').textContent.split('\n')[1].trim();const index=currentURL.indexOf("/map");const worldURL=currentURL.substring(0,index);let tweetText="♪ "+title+" #"+videoId+" #Kiite"+"\n";if(currentURL.startsWith("https://world.kiite.jp/glkw")){tweetText=tweetText+"全曲のKiite Worldできいてます"+"\n";}else{tweetText=tweetText+ownerName+"「"+worldName+"」できいてます"+"\n";}tweetText=tweetText+worldURL+"/intro?s="+videoId+"\n";tweetText=tweetText+"https://nicovideo.jp/watch/"+videoId;navigator.clipboard.writeText(tweetText);}else if(currentURL.startsWith("https://www.nicovideo.jp/watch/")){const videoElement=document.querySelector('link[rel="canonical"]');const videoUrl=videoElement.getAttribute("href");const videoId=videoUrl.substring(31);const videoTitle=document.querySelector(".VideoTitle").innerText;const tweetText=videoTitle+"\n"+videoUrl+"?ref=twitter \n"+"\n"+"#"+videoId+"\n"+"#ニコニコ動画";navigator.clipboard.writeText(tweetText);}else{console.log("Kiite Worldもしくはニコニコ動画を開いていません");}})();
```



↓旧ver
```javascript:
javascript:(function(){const currentURL=window.location.href;if(currentURL.startsWith("https://world.kiite.jp")){const iframeVideo=document.querySelector("iframe");const textVideoId=iframeVideo.parentNode.id;const videoId=textVideoId.substring(13);const elements=document.querySelectorAll(".bgt2.primary--text");const targetElement=elements[0];title=targetElement.textContent.trim().substring(2);const tweetText="♪ "+title+" #"+videoId+" #Kiite"+"\n"+"Kiite World できいてます "+"\n"+"https://world.kiite.jp/glkw/intro?s="+videoId+"\n"+"https://nicovideo.jp/watch/"+videoId;navigator.clipboard.writeText(tweetText)}else if(currentURL.startsWith("https://www.nicovideo.jp/watch/")){const videoElement=document.querySelector('link[rel="canonical"]');const videoUrl=videoElement.getAttribute("href");const videoId=videoUrl.substring(31);const videoTitle=document.querySelector(".VideoTitle").innerText;const tweetText=videoTitle+"\n"+videoUrl+"?ref=twitter \n"+"\n"+"#"+videoId+"\n"+"#ニコニコ動画";navigator.clipboard.writeText(tweetText)}else{console.log("Kiite Worldもしくはニコニコ動画を開いていません");}})();
```
こちらをコピーしてブックマークとして保存してください。

# 3.導入
使っているブラウザがGoogle Chromeの場合、次の手順で導入します。Chrome以外のブラウザでもほとんど同じ方法です。

①上記のコードをコピーします。(コードの枠の右上あたりにコピーボタンがあります。)

②メニューから「ブックマーク」→「ブックマーク バーを表示」にチェックを入れます。
![addde7961ea05ddbed44548b49542691.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638632/d8b8eb0e-c316-377f-801d-907247be32de.png)

③ブックマークバーを右クリックし、「ページを追加...」をクリックします。
![fe615afbf2b42b62c58bee5a0f051a9a.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638632/97f04cb0-74e2-cf43-8236-c98fcddc0336.png)

④URLの欄に、先ほどコピーしたコードをペーストします。名前の欄は自由に入力してください（「なうぷれコピー」など）。
入力が終わったら「保存」します。
![4a8f1abe78836a78deaa4d39534164fd.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638632/7af38b60-bdd1-dcbf-2c7a-80dffeb657b7.png)

⑤ブックマークバーに登録されたら、導入は完了です。
![0cbbee3c45ca7319e1d5718a9cb02147.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638632/4634eef6-86ff-d7f8-6030-cdd5fc278d45.png)

# 4.使い方
## Kiite Worldでの使い方
①Kiite World( https://world.kiite.jp )で動画を再生します。
![4d018a67f6224ff3f019194968931482.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638632/db96e4b9-0ba8-697d-ecaf-372a852342f3.png)
②ブックマークバーにある「なうぷれコピー」をクリックします。

③メモ帳やツイートの入力欄などでCtrl + Vキーを押すと...
>♪ 匿名M / 初音ミク・ARuFa #sm41803605 #Kiite
>Kiite World できいてます 
>https://world.kiite.jp/glkw/intro?s=sm41803605
>https://nicovideo.jp/watch/sm41803605

## ニコニコ動画での使い方
①ニコニコ動画で動画を再生します。
ただし、"https://*www*.nicovideo.jp/watch/"から始まるURLしか対応していません。
②ブックマークバーにある「なうぷれコピー」をクリックすると、同様に、なうぷれツイートがクリップボードにコピーされます。
>新・豪血寺一族 -煩悩解放 - レッツゴー！陰陽師
>https://www.nicovideo.jp/watch/sm9?ref=twitter 
>
>#sm9
>#ニコニコ動画

# 5.ソースコード
2024/1/17~ver
```javascript:naupureCopy.js
javascript:
(function () {
    const currentURL = window.location.href;
    if(currentURL.startsWith("https://world.kiite.jp")){
        const iframeVideo = document.querySelector("iframe");
        const textVideoId = iframeVideo.parentNode.id;
        const videoId = textVideoId.substring(13);
        const elements = document.querySelectorAll(".bgt2.primary--text");
        const targetElement = elements[0];
        title = targetElement.textContent.trim().substring(2);
    	const ownerName=document.querySelector('span.kw').parentNode.textContent.trim().split('\n')[0];
    	const worldName=document.querySelector('div.font-size-s.text-center.ellipsis_single').textContent.split('\n')[1].trim();
        const index = currentURL.indexOf("/map");
        const worldURL = currentURL.substring(0, index);
        let tweetText =
            "♪ " + title + " #" + videoId + " #Kiite" + "\n";
        if(currentURL.startsWith("https://world.kiite.jp/glkw")){
            tweetText = tweetText + "全曲のKiite Worldできいてます" + "\n";
        } else {
            tweetText = tweetText + ownerName + "「" + worldName + "」できいてます" + "\n";
        }
            tweetText = tweetText + worldURL + "/intro?s=" + videoId + "\n";
            tweetText = tweetText + "https://nicovideo.jp/watch/" + videoId;
        navigator.clipboard.writeText(tweetText);
    } else if (currentURL.startsWith("https://www.nicovideo.jp/watch/")){
        const videoElement = document.querySelector('link[rel="canonical"]');
        const videoUrl = videoElement.getAttribute("href");
        const videoId = videoUrl.substring(31);
        const videoTitle = document.querySelector(".VideoTitle").innerText;
        const tweetText =
            videoTitle +"\n" +
            videoUrl + "?ref=twitter \n" +
            "\n" +
            "#" + videoId + "\n" +
            "#ニコニコ動画";
        navigator.clipboard.writeText(tweetText);
    } else {
        console.log("Kiite Worldもしくはニコニコ動画を開いていません");
    }
})();
```

Kiite Worldやニコニコ動画内のHTMLに依存しているので、アップデートによって、正常に動かなくなる可能性があります。
動作確認:2023/12/9