落書き帖  古事記  いろは歌  日 記

ツベの手(TUBENOTE)字幕取得の機能をつけた

2016年03月17日
youtubeの動画から字幕を抜き出したくなったので、その機能を付けてみました。
あと、細かい不具合を修正。

取得できる字幕は、xml形式と、私が読み易い様に時間とセリフだけを整形したtext形式の2種類があります。
字幕の取得は、アプリの画面右下にあるoperateの項目の下から3番目のsubtitlesボタンから可能です。
既にアプリにyoutubeの動画を表示した状態であれば、言語選択画面へ移行します。
そうでない場合は、移行先の画面で、youtubeのURLまたはyoutubeの埋め込みコード、或いは共有コードを入力後applyボタンを押すと言語選択画面へ移行します。
その後、言語選択画面で言語を選択し、sub:xmlかsub:textを選択すると字幕を取得できます。

その他の使い方などは以前のページヘー>ツベの手
スクリプト全文はページ一番下。

ダウンロード ツベの手(TUBENOTE)1.0

☆☆動作テスト☆☆
DEVICE:ANDROID phone
BROWSER:chrome firefox

DEVICE:32bitお年寄りPC
BROWSER:iceweasel midori
☆☆☆☆☆☆☆☆☆

☆☆現在分かっている不具合☆☆
スマホのfirefoxでは、youtubeの履歴画面と字幕の言語選択画面がスクロールしない。
原因:chrome用に画面調整の為、overflowーy:hiddenを使った為だと思う。
スマホでfirefoxはほとんど使ってないので対処するかは不明…。
☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆

  

  


☆☆余談☆☆
今回初めてpromiseって言うのを使ってみた。
いつもニコニコ(借りる時)のあれじゃないですよ…。
javascriptのpromiseです。

今までも存在自体は知ってたんだけど、使い方も使い所もさっぱり知りませんでした。
今回スクリプトを書いてて、何かの処理が終わった後に続けて次の処理をさせたいなって思ったわけなんです。
そこで、我がgoogle師匠に聞いた訳なんです…。
そしたら、師匠は「promise」って言葉をいっぱい吐き出すんですわ…。

最初は見よう見まねで、promiseで簡単な処理を書いてみたんですが…、
中々うまくいきません…。
一から詳しく説明してくれるサイト(もう1人の師匠)があるのでそこを見るんですが、私のおつむでは…。

ちなみに、いつもお世話になってるサイト↓
JavaScript プログラミング講座

それでも、短い処理を何度も書き直しながら、漸く分かったのが…、
と言うか、promiseを初心者から遠ざけている原因は、thenって言う奴じゃないか?
って事でした。

「then」って、「その後で」みたいな意味なんかな?
それで、javascriptのthenも何かの処理の後で実行されるのかな?
って勝手に想像して、その先入観を引きずったまま短い処理でテストしていたんです…。
(結局はそれが間違ってはいないようだけど…)

でもなんか変…。
setTimeoutでテストしてみると、まだ終わってないのに、どんどん次に処理が行っちゃう…。
暫くここで足踏みしました…。

そして気付いたのが…、
thenって結果を受け取って次に渡すんだけど…、
(空のthenを繋げていくと後ろまで最初の値がそのまま渡って行く)
thenの中で独自の関数を使って何か処理をさせたら、その関数の中で次のthenに渡すべき値を渡すべきタイミングできっちり指定してやらないとダメなのね…。

具体的には、thenの中にある関数の中でまたnew Promiseしてpromiseオブジェクトを生成してやるって事…。
そして、setTimeoutなんかの後に処理を次に渡したいなら、そのsetTimeoutの関数の中でタイミングを見計らって次に渡すべき値を指定してやるって事…。

それから…、
昨日promiseを覚えたばかりの素人の戯言なので、あまり鵜呑みにはしないでね…。

いやぁ、でもこのpromise、いいですね…。
thenをつらつらと連ねてるだけなんだけど、とても処理が書きやすかった。

スクリプト全文