javascriptを利用してepgrecの見た目、使い勝手を改善します。スマートフォン等、画面が狭くてもそれなりの情報量を表示できるようになります…多分
このスクリプトは実験的に作成したものです。 epgrec 本体の改造を最小限に、見た目、使い勝手を改善する試みです。現在、番組表、録画一覧のみ対応しています。残りページに対応するかどうかは未定です。
epgrec:SourceForge / epgrec
録画一覧で削除ボタンを押すと、ダイアログが出ることなく削除が実行されます。
IE6、7は対応していません。IE8は動作だけは確認していますが、描画が怪しい箇所がまだ残っています。IE9はまだテストしていません。
epgrec assist は epgrec が出力したhtmlを、javascriptで無理やり書き換えています。ブラウザが一度描画したものを、再度描画しなおすことになり、画面更新に時間がかかるようになります。ページを読み込んだ際に epgrec のオリジナル画面が一瞬表示されることもあります。
ダウンロードしたファイルを解凍し、できたディレクトリ /assist を epgrec のディレクトリ内に配置します。
/ epgrec / assist
epgrec assist を有効にしたいページのテンプレートを修正します。修正方法は共通で、最下行付近の </body>
タグの前にscriptを読み込む1行を挿入します
<script type="text/javascript" src="assist/js/epgrec_assist.js"></script> </body> </html>
ページ、テンプレート対応表
番組表 / epgrec / templates / index.html
録画済一覧 / epgrec / templates / recordedTable.html
検索ページはまだ手をつけていないのですが、epgrec chForm assist と同等の動作をするようになります
検索 / epgrec / templates / programTable.html
epgrec assist の動作を抑制したり、設定を変更できます
/ epgrec / assist / js / epgrec_assist.js の先頭部分に設定が列挙してあります
共通 | ||
---|---|---|
変数 | 初期値 | 解説 |
ASSIST_INI.use_this | 1 | epgrec_assistを有効にする。 epgrecのバージョンアップ等による 不具合が出た場合は 0 にしてください |
ASSIST_INI.time_ap | 1 | 時間表示を12時間表示 (epgrec assistが書き換えた部分のみ有効) |
番組表 | ||
変数 | 初期値 | 解説 |
ASSIST_INI.index | 1 | 番組表で有効にする |
ASSIST_INI.index_nowbar_live | 10 | 現在時刻を示す赤線を自動更新 単位は秒、0で更新しない |
録画済一覧 | ||
変数 | 初期値 | 解説 |
ASSIST_INI.recorded | 1 | 録画済み一覧で有効にする |
ASSIST_INI.recorded_delete_with_file | 0 | 「録画ファイルも削除する」 のチェックボックス初期値 |
最初の公開バージョン
番組の列<tr>
のアトリビュートにdata-dur
があると番組の長さとして表示します
/ epgrec / recordedTable.phpの58行目辺りに番組の長さを割り当てる$arr['duration']
を追加します
$arr['starttime'] = $r->starttime; $arr['endtime'] = $r->endtime; $arr['duration'] = strtotime($r->endtime) - strtotime($r->starttime); $arr['asf'] = "".$settings->install_url."/viewer.php?reserve_id=".$r->id;
/ epgrec / templates / recordedTable.htmlの211行目辺り、番組の長さを番組の列<tr>
のアトリビュートdata-dur
に設定します
{foreach from=$records item=rec } <tr id="resid_{$rec.id}" class="ctg_{$rec.cat}" data-dur="{$rec.duration}"> <td>{$rec.starttime}</td> <td>{$rec.station_name}</td>
javascriptのオブジェクト INISet
に disk_free
、disk_total
プロパティがあると、ディスク容量を表示します
/ epgrec / recordedTable.phpの104行目辺り、$smarty
に disk_free
、disk_total
を設定します
$smarty->assign( "use_thumbs", $settings->use_thumbs ); $smarty->assign( "disk_total", disk_total_space(INSTALL_PATH)); $smarty->assign( "disk_free", disk_free_space(INSTALL_PATH)); $smarty->display("recordedTable.html");
/ epgrec / templates / recordedTable.htmlの203行目辺り、{literal}
に注意して disk_free
、disk_total
を含む4行を追加します
{literal} <script type="text/javascript"> var INISet = { {/literal} disk_total : {$disk_total}, disk_free : {$disk_free}, {literal} prgRecordURL : 'record.php', // 簡易予約 prgRecordPlusURL : 'recordp.php', // 詳細予約 prgCancelURL : 'cancelReservation.php' // 予約キャンセル } </script> {/literal}