いろんないみで

はまっちゃた

最近ドットインストールやってるのだが、動画を再生するのにマウスを使うのが面倒なので簡単なユーザースクリプトを作ってみた

までドットインストールは全然やらなかったんだけれど、最近やるようになった。 (なんかイマイチそうだなって勝手に思っていた。)

でもやってみると結構面白いし、気軽にプログラミングを勉強できて意外だった。


分は左にブラウザ(主にchrome)、右にテキストエディタとかターミナルみたいな感じでウインドウを2つ並べて動画を見ながらAlt + Tabとかでウインドウを切り替えながら勉強している。だけど、ブラウザのショートカットキーで動画を再生できないのがちょっと使いにくいなって思っていた。(マウスでクリックするのがちょっとめんどい) 実はショートカットあったりして...


初はブックマークレットを作ってキーボードから動画を再生できるようにしてみた。しかし、「次のレッスンへ」でページを遷移するたびにブックマークレットを読み込まなければいけないので、「ちょっとなぁ」って思た。


ういえば「ユーザースクリプトっていうのがあって~~」ってどこかで見たなって思い出して調べてみた。 すると分かりやすく書いてある記事を見つけた。

ChromeでUserScriptを動かしてみた - 積極的にメモっていく姿勢

chromeへのユーザースクリプトの設定方法はこの記事を見たら簡単にできた。画面キャプチャが豊富でスゴイ分かり易い!!


、書いてみた。自分の場合キーボードの>で再生<で一時停止するようにした。

// ==UserScript==
// @name dotinstall movie controller
// @include http://dotinstall.com/lessons/*/*
// ==/UserScript==
window.addEventListener('load', function() {
    var d = document, s, text, playkey, pausekey;
    //動画を再生するキーのキーコード (自分の場合 「>」)
    playkey = 190;
    //動画を停止するキーのキーコード (自分の場合「<」)
    pausekey = 188;
    text = "document.addEventListener('keyup', function(ev){";
    text += "var e,c;c=(e=ev||event).keyCode;";
    text += "if(c==" + playkey +")return window.HMHM.movie.ytplayer.playVideo();";
    text += "if(c==" + pausekey +")return window.HMHM.movie.ytplayer.pauseVideo();";
    text += "});";
    (s = d.createElement('script')).text = text;
    d.body.appendChild(s);
});

巻き戻しや早送りもできるようにしたいのだけれど、、、YouTubeAPIよくわからないの。