AbemaTVChromeExtension AbemaTVに様々な機能を追加

公開 2016.09.23 (金) 更新 2017.10.16 (月)
AbemaTV拡張 10
無料でテレビ番組が見られるインターネットテレビ局"AbemaTV"のサービスが始まってから約半年。コンテンツが充実しても機能的に物足りない部分も多いので拡張で使いやすくしてみる。

主な機能
・番組開始前の通知&自動再生
・コメント欄を透過し、画面サイズが縮小しないようにする
・某動画サイトのように画面上にコメントを流す
・マウスホイールで音量調整
・コメントのNG処理で不快なワードを非表示
・番組の残り時間をゲージで表示




Chrome系列のブラウザはこちらから導入。
_bem_tv ext - Chrome ウェブストア

一応Firefoxでも使えるらしいけどAbemaTV自体がFirefox非推奨とのこと。Chrome前提で開発や動作確認しているそうなので不具合出やすいかも。

それでもFirefoxで使いたい人はGitHub参照。
GitHub - nakayuki805/AbemaTVChromeExtension: AbemaTVをより快適に視聴するためのChrome拡張機能




◆機能 ver0.4.4

上記のGitHubから引用。最初に紹介した主な機能以外にもかなりきめ細かい設定ができる。
上下の黒帯パネルを透明化
コメント欄を透明化(見やすいようにコメントの文字は白抜き黒縁に)し一行表示
コメント欄の新着ボタンを自動クリック(設定で中断可)、非表示
緑の吹き出し非表示
コメント入力欄の外枠クリックでコメント一覧の表示/非表示の切替
画面右の番組移動ボタンの並びに(一時的な)設定ボタンが追加されます
番組表の番組ページから番組開始前通知を設定できます。何分前に通知するかも設定できます。(デフォルト1分前)
(設定で有効)Chromeのウィンドウが横長のときに映像が上下切れることなくウィンドウサイズにフィットするように映像のサイズを変更(デフォルトの状態では映像サイズがウィンドウ幅に合わさって横長のウィンドウでは上下が見えなくなってしまいます。)
(設定で有効)コメントを横に流す
(設定で有効)現在正常に動作しません。→ダブルクリックでフルスクリーン&フルスクリーンボタンをF11と同等のフルスクリーンに割り当て(コメント欄を表示したままフルスクリーンにできます。)
(設定で有効)音量、全画面表示ボタンを非表示
(設定で有効)コメント入力欄を一行にし投稿ボタン等を非表示
(設定で有効)コメント欄を非表示し入力欄を下へ
(設定で有効)矢印キーとマウスホイールでチャンネル変更を無効にする、設定でマウスホイールを音量変更に割り当てられる
(設定で有効)流れるコメントに規定のNG処理を適用する(詳細は後述)
(設定で有効)流れるコメントにあなたが決めたNG単語(書式は後述)が含まれる場合は流さない、追加設定で右のコメント欄にも適用可
(設定で有効)コメント入力欄の端に番組の残り時間とゲージ(設定ボタン)を表示する。ゲージは設定ボタンになっています。表示位置も変更できます。ゲージを非表示にする場合はonairpage.js内の" "を""に変更してください。
(設定で有効)コメント欄を常に表示したままにする。この機能利用中は、画面右下のボタンはコメント一覧の表示/非表示切替ボタンになっています。
(設定で有効)上下黒帯パネルを常に表示したままにする。
(設定で有効)映像を枠に合わせて縮小する。
(設定で有効)番組時間、タイトルを表示
(設定で有効)新着コメントを強調
(設定で有効)番組表の改善(番組タイトルの表示調節、週末青赤着色、放送画面へのリンク設置)
(設定で有効)「Twitterで通知を受け取る」パネル、放送画面の「今日のみどころ」を非表示
コメント欄の文字色や背景色や透過度など見た目を設定できます。
AbemaTVの仕様がちょくちょく変わってるせいか正常に動作しないこともあるので注意。

そういうときは一旦不具合の原因になっている機能をオフにでもして拡張の更新まで気長に待つべし。



◆設定画面

▼映像・表示・操作関連設定

AbemaTV拡張 01
「マウスホイール及び上下矢印キーによる番組移動を無効化する」は最近のAbemaTV自体の仕様変更で必要なくなった。

AbemaTV拡張 16
「マウスホイールで音量を操作する」は"▼番組時間・タイトル表示関連設定"で設定した位置に表示される。


▼コメント欄関連設定
AbemaTV拡張 02
よくコメントする人は「コメント入力欄を下へ」にチェック入れると良いかも。

赤枠は画面上で常にコメントを流すのに必要な設定その1。その2は次の"▼コメント流し関連設定"で。

AbemaTV拡張 11
視聴中のNG処理の手順
1.コメント欄にある不快な文章(単語)をクリック。
2.コメント入力枠でNGできるようになるので文章をNGしやすく適当に編集。
3.NGボタンを1回クリックで一時保存(その番組の視聴中のみ)、ダブルクリックで永久保存。

永久保存したコメントは以下の"▼コメント流し関連設定"でNGワードに保存される。


▼コメント流し関連設定
AbemaTV拡張 03
赤枠は画面上で常にコメントを流すのに必要な設定その2。コメント多すぎると重くなるので同時表示上限を各自調整。

「流れるコメントから規定の単語を除去」「一般的な文字以外を全て削除する」はコメント見る場合ほぼ必須。これがあるだけで荒らしにはかなり有効。

「以下で設定した単語が含まれるコメントは流さない」は要は自分で設定できるNGワード。目障りなものを1行ずつ入れる。


▼番組時間・タイトル表示関連設定
AbemaTV拡張 04
「番組残り時間を表示」は番組見ながら大体の今見ている話数や終了時間が分かって地味に便利。

AbemaTV拡張 12
一挙放送見てると話数に合わせて区切ってあればもっと見やすいのにと思う。


▼番組通知関連設定
AbemaTV拡張 05
Chromeを起動していれば◯秒前に自動で放送画面を開く。30~60秒ぐらいが目安だろうか。

AbemaTV拡張 08
各番組内容のページだけでなく、番組検索からまとめて通知登録できるのが良いところ。ボタンが正しく表示されないときは個別ページから通知登録。

AbemaTV拡張 09
通知登録した番組は設定画面の上の方にあるリンク(拡張機能の通知登録番組一覧)から確認。このリンクをブックマークしておくと使いやすい。


▼番組表関連設定
AbemaTV拡張 06
番組検索で通知登録してるせいであまり番組表見ないけど一応設定。


▼コメント色関連設定
AbemaTV拡張 07
コメント色はかなり適当。透明度の調整したぐらいか。


▼黒帯パネル開閉設定
AbemaTV拡張 14
ここは上のメニューを全部「非表示」、他全部を「マウスに反応」にした方が使いやすかった。上のメニューは番組検索でしか使ってないし、それならTOPページか番組表からで良いっていう。


全ての設定が終わったら"保存"で完了。



◆視聴画面

AbemaTV拡張 13
設定を全て済ました視聴画面はこんな感じ。改めて見るとコメント入力欄は右下の方が良い気がする。

AbemaTV拡張 12
画面にコメントを流すけどコメント欄は要らない場合、マウスオーバーで表示される画面右下の吹き出しアイコンをクリックするとコメント欄が消せる。

AbemaTV拡張 15
マウスオーバーで表示される画面右の歯車アイコンからは「拡張機能一時設定画面」が開ける。一時設定は実際の画面と見比べながらやるものが中心で調整しやすい。
関連記事

コメント
管理者にだけ表示を許可する
 
back-to-top