javascriptでBadApple!!
作品URL
http://matayoshi.nkmr.io/js/badapple/
この記事の作品 https://service.matatsuna.net/badapple-old/
改良版 https://service.matatsuna.net/badapple/
(以上 更新 2018/08/17)
BadApple!!とは?
音楽同人サークル「Alstroemeria Records」による東方アレンジ曲"Bad Apple!! feat. nomico"のPV字コンテをPVにした作品の一つである。
【東方】Bad Apple!! ＰＶ【影絵】 (sm8628149) - ニコニコ大百科
東方の曲のPVを考えて手書きで書いた動画
www.nicovideo.jp
を実際に白黒pvにしてしまった。というお話
www.nicovideo.jp
その動画のパロディ－がたくさん生まれています。
www.nicovideo.jp
実装について
1. 動画をffmpegを使い、1秒10フレームで切り出して2190枚の画像を生成します。
2. processingで画像を読み込んで白黒を判定し、jsで読み込めるように配列形式でテキストに吐き出します。
https://gist.github.com/eb68c1d404ae33f9a47c5c4fa852bf34:tile
3. tableを準備して、その中に配列から読みだしたデータをどんどん追加する処理をsetintervalでfps10で回します。
4. 完成！！
感想
作ってて超楽しかった。重いかな？とか粗すぎて見えないかな？っておもってたのですがしっかりそこそこ見えて感動しました。
ただ、画像をURIスキームを使って入れたとしても、厳しいのは残念でした。（環境にもよるかもしれないが）
参考URL
tableタグで二次配列を取り出す方法
[jQuery] tableの内容を取得する | きほんのき
ffmpegのコマンド
ffmpegで動画から静止画を抜き出す
jsの配列について
JavaScriptプログラミング講座【配列について（Array）】
htmlのaudioタグについて
HTML5 audioタグを使って音声を再生する方法 | TechBooster
etc
togetterをpython3系でスクレーピングしてtsvファイルを作る
togetter とは
Twitterで公開されているツイートをドラッグアンドドロップで選び、1画面にまとめて表示できる。文字の色を替えたり、時系列に並んでいるつぶやきの順序を入れ替えたりもできる。自分で投稿したツイートや他人のツイートから面白いものを抜き出す、イベントなどの実況報告を抜き出す、論争が起きた場合に各論者の立場をわかりやすくするなどの使い方がある。(wikiより)
togetter.com
簡単に言うと、Twitterのまとめサイト的なものです。
Twitterを分析するためにtsvファイルに
大学の授業では発表会が多く、そのたびに実況ツイートをtogetterにまとめて頂いてます。
今回、そのデータを使って、Twitterの分析をすることになり、python3.5でスクレーピングしてtsvファイルを生成することにしました。
ソース
欠点
ただ、上記のコードだと、26番目から50番目のツイートを取得する処理をしてないので、完全なデータではありません。プルリクエストいただけたら嬉しいです。
工夫点
最後のページに来たことを調べるために、各ページの最後のツイートの時間を取得して、比較してます。headerみてリダイレクト処理かかったらででも良かったかもしれません。
久しぶりのpythonで書くのが大変でした。やっぱり慣れないな....
WolframAlpha APIを叩いてみる
以前書いた、記事をさらに掘り下げます。
matatsuna.hatenablog.com
WolframAlphaって知ってますか？
www.wolframalpha.com
wikiには以下のように書いてあります。
Wolfram Alpha（WolframAlphaともWolfram|Alphaとも表記される）はウルフラム・リサーチが開発した質問応答システム。事実についての質問に対して、構造化されたデータを使って計算し、直接答えを返すオンラインサービスである。(wiki)
わからない....
簡単に言うと、どんな計算でも計算してくれる最強のサービスです。
mathematicaを知ってる方も多いと思いますが、それを使って成り立ってます(開発者が一緒)。
よく微分積分や行列などの計算の確認に使ってます。
そんな最強の電卓をslackのbotに返答させたら超最強だ！と思って実装しました。
APIキーを取得する
Wolfram|Alpha: For Developers--API, Customizable Widgetsへ行って、Get startedをクリックし、Sign upから必要な情報を入れてアカウントを作る。
My Appsのタブに行き、右側のGet an AppIDをクリック
名前と目的を入れて Get AppID
そうすると[6桁の英数字-10桁の英数字]のAPPIDが作られます。
アクセスしてみる
サンプルクエリ通りに、アクセス！
http://products.wolframalpha.com/api/documentation.html#4
http://api.wolframalpha.com/v2/query?input=pi&appid=XXXX
ところが、APIキーを取得してすぐだと、badリクエストになる恐れがあります。その場合は、時間をおいてください。5時間ぐらい開ければ動きました。
クエリの細かいのはドキュメントみてください。
slack botはpythonで書いていて、正規表現で全角はドコモのAPIに投げて、半角を今回投げる対象としました。
([ -~｡-ﾟ]+)
この正規表現を使いました。
[正規表現] 半角文字のみ取得 と 全角文字のみ取得 - 続くかな・・・
あとは、srcを上から順にとって、リンクをレスポンスとして返しました。
slackは自動で写真を展開してくれるのでいい具合になりました。
ただ、時間がたつとリンクが切れて表示されなくなってしまうのが少し、残念です。
