グリマスのボイスを簡単にダウンロードできるブックマークレットを作りました

こんにちは。

今回は、GREEのミリオンライブ!内にあるボイスを

ダウンロードしやすくするための

ブックマークレットを作成しましたので、

ご紹介したいと思います。

これを使えば、

わざわざページのソースからURL抜いて〜みたいなことは

しなくても大丈夫です。

機能説明

1.アイドル詳細のボイス一覧について

2パターン用意しました。

1つ目は、ゲーム内のページに直接音声ファイルを埋め込むもの。

スクリーンショット 2017-10-31 22.48.41

2つ目は、ボイスの音声ファイルを新しいウィンドウで一覧表示するもの。スクリーンショット 2017-10-31 22.48.50.png

アップデート

2.誕生日ボイス・ボイスドラマについて

誕生日ボイスやボイスドラマの音声ファイルを別窓で表示できるものも作りました。

スクリーンショット 2017-11-01 22.01.38.png

そもそもブックマークレットって何?

ざっくりいうと、

ブックマークをポチッと押すだけで

ページ内をあれこれしてくれる

便利なプログラムです。

導入方法

今回はGoogle Chrome(Windows, Mac)で説明します。

他ブラウザでもやり方は同じです。

(他ブラウザでの動作確認はしてませんご了承ください)

1.ブックマークバーで右クリックして、「ページを追加」をクリック

スクリーンショット 2017-10-31 22.40.04

2.下のような画面になります

スクリーンショット 2017-10-31 22.40.54

3.名前はお好みで、URLの部分に以下のコードをそのまま貼り付けてください

コードは以下のリンクから取得します

スクリーンショット 2017-11-18 23.32.04.png

(※途中で改行はしないでください!)

アイドル詳細の1つ目の方のコード

アイドル詳細の2つ目の方のコード

誕生日ボイス・ボイスドラマの方のコード

 


追記3

※無駄な記述部があったため修正しました。

動作には影響ありません。


追記4

コード文が一部欠損しており、

何度修正してもwordpress上で反映されない不具合があったため、

表示方法を変更しました。


4.任意のフォルダやブックマークバーに保存すれば導入完了です


追記

うまく動かない場合はコード中のvar sounds=以降にある

document.getElementById(‘gree-game-container’).firstChild.contentWindow.

の部分を削除してみてください。

MacのSafariの場合はこれで動きました。


追記2

ユーザーエージェントがスマートフォンの場合、

上記「追記」の対策を行ってください。

GoogleChromeやSafariでユーザーエージェントをiPhoneにした場合はそれで動きました。

これはPC版サイトがインラインフレームという外箱みたいなものを用意していて、

その中にスマホ用サイトを埋め込んでいる形をとっているためです。

document.getElementById(‘gree-game-container’).firstChild.contentWindow.

という部分はその外箱を考慮した記述なので、

ユーザーエージェントがスマートフォンの場合はこの部分は要らないということになります。


使い方

アイドル詳細の方

1.まずはPCブラウザ版ミリオンライブ!を開いて、アイドル一覧へ

スクリーンショット 2017-10-31 22.34.20

2.お好きなアイドルを選んで、詳細画面へ

スクリーンショット 2017-10-31 22.35.51

3.下にスクロールするとボイス一覧がありますね

スクリーンショット 2017-10-31 22.36.09

4.この状態で先程作成したブックマークをどちらか1つクリックすると

以下のようにプレーヤーが表示されます。

5.プレーヤー右端の矢印のマークをクリックすれば保存することができます

誕生日ボイス

1.誕生日ボイスの場合は「その他」タブから

スクリーンショット 2017-11-01 22.01.07

2.緑の再生ボタンを押して

スクリーンショット 2017-11-01 22.01.22

3.この状態で先程のブックマークをクリックしましょう

誕生日ボイスは再生ボタンを押さないと音声ファイルのURLが出てこないので、

いちいちアニメーションを再生する形になってしまいます。

ご了承ください。

ボイスドラマの方

1.ボイスドラマのPSL編やキャラバン編、アイドルエピソードを開く

2.再生ボタンを押す

スクリーンショット 2017-11-01 22.29.35

3.この画面で誕生日ボイス同様ブックマークをクリックしましょう

注意点

実は「ボイス」タブではなく「プロフィール」,「その他」を表示した状態でも

この機能を使うことができますが、

違うページへ遷移した場合音声ファイルの埋め込みはリセットされてしまいます。

スクリーンショット 2017-10-31 22.36.09

追記

また、使用するブラウザによって表示されるプレーヤーのデザインが異なります。

スクリーンショット 2017-11-01 1.05.37.png

ダウンロードボタンが見当たらない場合でも

右クリックメニューから別名でダウンロードができるかもしれないで、

おためしください。

(画像はSafariの例)

最後に、あくまでも私的利用の範囲内でお願いします!


不明点や改善点等はコメントかTwitter(@nbleft)までお願いします。

広告

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中