tiarra WEBフロントエンド tiarraMetrotiarra WEBフロントエンド tiarraMetro

機能一覧

現在大幅な機能追加とデザイン変更が行なわれています。

画面は開発中のものであり、実際はもっと素敵な感じになっている可能性があります。

また自分の使用環境でスクリーンショットを撮っている為、一部モザイクがかかっている点は御了承ください。

・チャンネル一覧の表示

未読のないチャンネルは薄く、未読のあるチャンネルは明るく、キーワードヒットのある発言は赤く(ピンク？)表示されます。

IEだとカウント数が四角いですが、

safariなんかでみると角丸です。

チャンネルはクリックで開く事が出来、チャンネル一覧のタブ(上記の例ではch)を選択する事でチャンネル一覧に戻る事が可能です。

またiPhoneなどの場合は横フリックでも遷移が可能です。

チャンネル一覧に戻った際、自動で未読のチャンネルのみの表示に絞られますが、チャンネル一覧のタブをクリックする事で表示を切り替える事が可能です。

・発言の閲覧、アイコンの表示、チャンネルへの投稿

チャンネルを開いた時の画面です。

上記は nick から twitter icon を表示する機能をオンにしてあります。

デフォルトではオフになっていますが、conf.ymlの設定にて表示が可能になります。

またページ上部に表示されているテキストボックスより発言が可能です。

・検索

トップページの下部に検索用のフォームがあります。

こちらからチャンネルを指定しない横断的な検索や、チャンネルを指定した検索などが行なえます。

こちらが結果画面になります。

中身は一般の表示画面にチャンネルの列を追加したものになります。

・過去ログの展開

チャンネルを開いた時、直近の30件が表示されますが、下部のmoreボタンより100postずつ読み込む事ができます。

・キーワードヒットの通知

conf.ymlに通知したいキーワードを指定する事で、growlのようなUIでキーワードにヒットした発言を通知する事ができます。

・URL展開、画像展開

発言内のURLはリンクとして機能します。

また conf.yml で設定する事により、画像の展開も可能になります。

・クイックpost、ポップアップメニュー

Twitter IRC Gateway及びFacebook IRC Gateway向けの機能として、typablemapの補完を行なう機能があります。

この機能はconf.ymlの設定により有効化が可能であり、設定した場合上記の用に発言をタッチした際にメニューが表示されます。

・nick alias機能

twitterとircのnickが一致してないという人は多いのではないでしょうか。

そういう時はアイコン表示をオンにしても意味がなくなってしまう為、それらを置換する機能をつけてあります。

conf.ymlにalias用の設定を追加する事で実現が可能です。

実際の設定は ./misc/conf.yml.fullなどを参考にしてください。

・インフォメーションバー

入力欄の下にある棒は、新着がある場合には青く、キーワードヒットがある場合には赤く変化します。

また色が変化している状態でクリックすると、当該チャンネルに遷移する事が可能です。

また、未読が一切ない状態でクリックした場合に、設定したチャンネルを循環するように切り替える事も可能です。

実際の設定は ./misc/conf.yml.fullなどを参考にしてください。

・キーボードショートカット

confファイルで設定する事により、キーボードショートカットが有効になります。

jk等でチャンネルを選択して開いたり、lhでタブを切り替えたりといった操作が可能です。

また、入力欄での上下キー操作による投稿履歴を利用する事もできます。

具体的なキー設定は ./misc/conf.yml.fullなどを参考にしてください。

・ajax、pjax

またチャンネル一覧での未読件数や、チャンネル表示時の発言はリアルタイムで読み込まれます。

(ブラウザ上でのページ遷移は一切しないようにしてあります)

また、Pjaxに完全対応している為、ページ遷移や読み込みは無いもののURLがリアルタイムに変更されます。

その為 チャンネル表示時にページを更新されても、そのページが維持されるようになっています。

(IE9はhistoryの管理が行なえない為、pjax部分は無視されます。

動作環境

・tiarraが動いている

まず前提条件としてtiarraが動いている必要があります。

tiarraの導入等については適当にググって頑張ってください。

・tiarraからunix socketがオープン可能である

発言の為にsocketを利用しています。

閲覧限定で使うのであれば、これが使えなくてみ見る事はできます。

・MySQL

tiarraのLog::DBIを使ってログをMySQLに流し込みます。

・php 5.3以上 + apache + mod_rewrite + PEAR

開発にはPHPの軽量フレームワーク、Fitzgeraldを利用しています。

また使用しているライブラリの関係上、mbstringとmysqlとmcryptのモジュールは必須となります。

(これらのモジュールが欠けている場合、アクセス時にエラーメッセージが表示されます。

また同梱しているadodbが参照しているのでPEARも必須となります。

apache に関しては標準ではapache を想定してはいますが、nginxやPHP5.4のビルトインサーバー機能で動作したとの報告を受けています。

外部ライブラリ等

WPっぽいpivot表示と挙動には以下のライブラリを使わせてもらっています。

・jqMetro - JQUERY PLUGIN FOR METRO UI CONTROLS

Growl風の通知には以下のライブラリを使わせてもらっています

・stanlemon.net : jgrowl

PHP部分の実装にはFitzgeraldを使わせてもらっています。

・jim/fitzgerald - GitHub

DB部分とのやりとりはadodbを利用しています。

・ADOdb Database Abstraction Library for PHP

yamlの読み込みにはspycを利用しています。

・spyc - A simple YAML loader/dumper class for PHP - Google Project Hosting

phpからのtiarraへの発言にはopenpearのNet_Socket_Tiarraを利用しています。

・Net_Socket_Tiarra \ パッケージ \ Openpear