| 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" |
|---|
| 2 | "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| 3 | <html> |
|---|
| 4 | <head> |
|---|
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| 6 | <title>twicli - web browser base Twitter light-weight client</title> |
|---|
| 7 | <style><!-- |
|---|
| 8 | li { margin: 4px; } |
|---|
| 9 | --></style> |
|---|
| 10 | </head> |
|---|
| 11 | <body style="background-color: #666;"> |
|---|
| 12 | <div style="width: 800px; padding: 20px; border: 1px solid #333; margin: 4px; background-color: #fff; font-size: small"> |
|---|
| 13 | <img src="screenshot2.png" align="right"> |
|---|
| 14 | <h3>twicliとは</h3> |
|---|
| 15 | twicliはWebブラウザーベースの軽いTwitterクライアントです。 |
|---|
| 16 | <ul> |
|---|
| 17 | <li>Webブラウザ上で動くのでインストール不要です。 |
|---|
| 18 | <li>タイムラインを随時、自動的に取得してアニメーション表示していきます。 |
|---|
| 19 | <li>専用サーバなどは介さず、クロスドメインJavaScriptで直接Twitterにアクセスします。パスワード等がTwitter以外に送信されることはありません。 |
|---|
| 20 | </ul> |
|---|
| 21 | |
|---|
| 22 | ネットカフェで他事しながらTwitterを眺めたいときなどに便利かも。<br> |
|---|
| 23 | 今のところFirefox, Safari, Operaで動いています。<br> |
|---|
| 24 | iPod touch/iPhoneのMobileSafariでもOKです。<br> |
|---|
| 25 | <small>(IEだと他ドメインのスクリプトに送られるCookieが何か変でNG…。)</small> |
|---|
| 26 | <p> |
|---|
| 27 | <div style="margin-left: 100px; padding: 10px; text-align: center; color: #00f; background-color: #cfc; border: 2px solid #393; width: 200px; font-size: large;"><a href="javascript:void(window.open('http://www.geocities.jp/twicli/twicli.html', 'twicli', 'width=280,height=600,menubar=no,toolbar=no,scrollbars=no,location=no,status=no'))">twicliを起動</a></div> |
|---|
| 28 | <p> |
|---|
| 29 | ※現在インターフェースを大幅に改修中です。動作がおかしい場合は以下からsimpleバージョンをご利用ください。 |
|---|
| 30 | <div style="margin-left: 100px; padding: 10px; text-align: center; color: #00f; background-color: #cfc; border: 2px solid #393; width: 200px; font-size: large;"><a href="javascript:void(window.open('http://www.geocities.jp/twicli/twicli_s.html', 'twicli', 'width=280,height=600,menubar=no,toolbar=no,scrollbars=no,location=no,status=no'))">twicli simpleを起動</a></div> |
|---|
| 31 | |
|---|
| 32 | <h3>使い方</h3> |
|---|
| 33 | <ol> |
|---|
| 34 | <li>起動 |
|---|
| 35 | <ul> |
|---|
| 36 | <li><a href="http://twitter.com/">Twitter</a>にログインしておく(「次回から入力を省略」ON推奨) |
|---|
| 37 | <li>上のリンク(bookmarklet)をクリック、またはブックマークにD&Dで登録して選択すると、別窓で起動します。 |
|---|
| 38 | </ul> |
|---|
| 39 | <li>TL(タイムライン表示) |
|---|
| 40 | <ul> |
|---|
| 41 | <li>タイムラインはホイールでスクロール(最大200件) |
|---|
| 42 | <li>ユーザ名をクリックするとユーザ情報や発言を表示 |
|---|
| 43 | <li>ユーザのアイコンをクリックするとプロフィールのWebページへジャンプ(設定されている場合のみ) |
|---|
| 44 | <li>「☞」をクリックすると、返信先を次々と辿っていくことができます。一覧に無い場合も返信先をオーバーレイ表示します。 |
|---|
| 45 | </ul> |
|---|
| 46 | <li>発言/fav |
|---|
| 47 | <ul> |
|---|
| 48 | <li>最上部のフィールドにテキストを入力してenterキーで発言 |
|---|
| 49 | <li>発言本文をクリックすると@〜を自動入力。また@〜を消さない場合、発言の返信先を設定します。 |
|---|
| 50 | <li>twit右の☆をクリックするとfav追加。★を再度クリックでfav解除。 |
|---|
| 51 | <li>初回の発言やfav時に認証を求められた場合は、Twitterのアカウント/パスワードを入力してください。 |
|---|
| 52 | </ul> |
|---|
| 53 | <li>タブ |
|---|
| 54 | <ul> |
|---|
| 55 | <li>TL: タイムライン、reply: 自分宛の返信を表示、ユーザ名: ユーザ情報、direct: ダイレクトメッセージ(未実装)を表示します。 |
|---|
| 56 | <li>TL以外は自動でアップデートされません。更新するには再度タブをクリックしてください。 |
|---|
| 57 | <li>他のタブに切り替えている間もTLは更新されていきます。 |
|---|
| 58 | </ul> |
|---|
| 59 | </ol> |
|---|
| 60 | なお開発途上なので随時アップデートすることがあります。 |
|---|
| 61 | |
|---|
| 62 | <h3>ソース</h3> |
|---|
| 63 | <a href="http://coderepos.org/share/browser/websites/twicli/twicli.html">twicli.html</a>が全てです。現在HTML+CSS+JavaScriptで350行くらい。 |
|---|
| 64 | <br><a href="http://coderepos.org/share/browser/websites/twicli/">CodeRepos</a>にも上げておきます。改造などはご自由に。 |
|---|
| 65 | |
|---|
| 66 | <p><b>作ってる人</b>: <a href="http://twitter.com/NeoCat/">@NeoCat</a> <a href="http://d.hatena.ne.jp/NeoCat/20080819">技術メモ</a> |
|---|
| 67 | |
|---|
| 68 | <br><br><br> |
|---|
| 69 | </body> |
|---|
| 70 | </html> |
|---|