/
index_en.html
154 lines (145 loc) · 11.4 KB
/
index_en.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="description" content="twicli is a web browser-based Twitter client. No need for installation. Automatically fetches timeline, and show with cool animation.">
<title>twicli - A Web Browser-Based Lightweight Twitter Client</title>
<style type="text/css"><!--
body { background-color: #115; margin: 0; padding: 0; }
.whole { width: 800px; padding: 20px; margin: 0; background-color: #fff; font-size: 90%; }
.launch { margin-left: 100px; padding: 10px; text-align: center; color: #00f; background-color: #cfc; border: 2px solid #393; width: 200px; font-size: large; }
.button { cursor:pointer; }
li { margin: 4px; }
h1 { border-bottom: solid 2px red; }
h2 { border-left: solid 1.2em #cf6; padding-left: 4px; }
h3 { border-left: solid 1.2em #fc0; padding-left: 4px; }
img { border: none; }
.language_selection { float:left; margin-left:700px;}
pre { background-color: #ddf; border: 1px solid #66f; }
--></style>
</head>
<body>
<a class="language_selection" href="index.html">Japanese</a>
<div class="whole">
<h1><a name="twicli"><img alt="twicli" src="images/icon_large.png" width="48" height="48"> twicli</a></h1>
<div style="margin: 1em 0; border: red 4px solid; font-size: x-large; padding: 20px;">We have stopped twicli due to the change of Twitter API to charge for data acquisition. Thank you for your long time use.</div>
<table><tr><td>
<p>
twicli is a browser-based Twitter client.
<ul>
<li>No need for installation. All you need is a Web browser.
<li>Automatically fetches timeline, and show with cool animation.
<li>Get tweets from Twitter directly using cross domain JavaScript. No relay server = quick response. <br><small><small>(Your tweets are posted via GAE server to GET responses using JavaScript callback.)</small></small>
</ul>
<p>
Useful when you are in an Internet cafe, doing something else while viewing Twitter timeline.<br>
Works on Firefox, Safari, Opera, IE8 at the moment, as well as
Safari on iPhone/iPod touch<br>
Works on IE7 too, but some parts aren't displayed properly.<br>
<div class="launch"><a onclick="window.open('twicli.html', 'twicli', 'width=280,height=600,menubar=no,toolbar=no,scrollbars=yes,location=no,resizable=yes')" href="javascript:void window.open('https://twicli.neocat.jp/twicli.html', 'twicli', 'width=280,height=600,menubar=no,toolbar=no,scrollbars=yes,location=no,resizable=yes')">Launch twicli</a></div>
</td><td>
<img alt="screenshot" width="331" height="478" src="usage/usage1.png" align="right">
</td></tr></table>
<h2><a name="usage">Usage</a></h2>
<h3><a name="launch">Launch</a></h3>
Just click the link above, or run it as a bookmarklet.<br>
When you get asked for authorization, please follow the instruction on each page.<br><br>
Be careful not to hit <b>API request limit (350 requests per hour)</b> by clicking too much. :-P
</p>
<h3><a name="howto">How to Use</a></h3>
<table width="100%"><tr>
<td width="40"><img alt="prev" onClick="go(-1)" src="images/left.png" class="button"></td>
<td align="center"><img alt="usage" id="usage" width="600" height="480" src="usage/usage2.en.png"></td>
<td width="40"><img alt="next" onClick="go(1)" src="images/right.png" class="button"></td>
</tr></table>
<script type="text/javascript">
var i = 0;
function go(d) {
i = (i + d + 4) % 4;
var usage = document.getElementById("usage");
usage.width = [600,600,480,620][i];
usage.height = [480,480,480,710][i];
usage.src = "usage/usage"+(i+2)+".en.png";
}
</script>
<img alt="usage" src="usage/usage2.en.png" width="1" height="1">
<img alt="usage" src="usage/usage3.en.png" width="1" height="1">
<img alt="usage" src="usage/usage4.en.png" width="1" height="1">
<img alt="usage" src="usage/usage5.en.png" width="1" height="1">
<h2><a name="faq">FAQ</a></h2>
<ul>
<li><b>A "json" file is downloaded on tweets, RT, etc.</b><blockquote> => This can be avoided by turning on the "Tweet via GAE server" option in the settings on the "+" tab and clicking the "Save" button.</blockquote></li>
<li><b>How to send direct messages?</b><blockquote> => Please write "d username message contents" in the tweet field and send it. You can write "d username" more easily by clicking reply button in D tab. You must be followed by the destination user to send direct messages.</blockquote></li>
<li><b>How to hide tweet which contains specified kerwords?</b><blockquote> => Write "-::keyword:1" into "Pickup Pattern" in the "+" tab.</blockquote></li>
<li><b>My tweets are sometimes lost ...</b><blockquote> => Twitter may be too crowded. Try writing just "r" and hit enter to re-post your previous tweet.</blockquote></li>
<li><b>Appearance is poor ...</b><blockquote> => Default appearance isn't decorated at all to display many tweets at once. You can customize twicli's appearance using CSS. Please refer <a href="#customize">"Customize" section</a> below.</blockquote></li>
<li>You can find more information in <a href="http://github.com/NeoCat/twicli/wiki">twicli wiki</a>.</li>
</ul>
<h2><a name="customize">Customize</a></h2>
There are also some information about customizing twicli in <a href="http://github.com/NeoCat/twicli/wiki">twicli wiki</a>.
<h3><a name="css">User Stylesheet</a></h3>
You can add your own CSS in "user stylesheet" section of the "+" tab. For example;
<ul>
<li>to apply corner-rounded and shadowed appearance : <tt> @import url(styles/round.css); </tt>
<li>to hide user icons : <tt> .uicon { display: none; } </tt>
<li>wider lines : <tt> .status { line-height: 1.5; } </tt>
</ul>
There are some guys publishing more stylesheets for twicli (=><a href="https://github.com/NeoCat/twicli/wiki/User-stylesheet">twicli wiki</a>).
<h3><a name="plugins">Plugins</a></h3>
You can register plugins by setting them at the "Preferences" in the "+" tab.<br>
Currently, there are plugins below:
<ul>
<li>Additional plugins<ul>
<li><b>autocomplete.js</b>: Auto-complete user names and hashtags from TL when "@" or "#" is entered. (created by <a href="http://twitter.com/oui_">@oui_</a>)
<li><b>reply_favicon.js</b>: Change favicon(not supported by IE and Safari) and the title when 'Re' is updated. (created by <a href="http://twitter.com/edvakf">@edvakf</a>)
<li><b>sound.js</b>: Play sound when 'TL'/'Re' is updated.
<li><b>insert_hashtag.js</b>: Append the hashtag to your tweets automatically while a tab for the hashtag is opened. (created by <a href="http://twitter.com/_wa_">@_wa_</a>)
<li><b>stream_search.js</b>: Update keyword/hashtag search results on real-time using streaming API.
<li><b>find_rt.js</b>: Find out which tweet is targetted by '>RT'.
<li><b>tweets_around_tw.js</b>: Find tweets around the specified tweet. (created by <a href="http://twitter.com/h0k0r0bi">@h0k0r0bi</a>)
<li><b>notify_desktop.js</b>: Notify various events using desktop notification. (created by <a href="http://twitter.com/oui_">@oui_</a>)
</ul>
<li>Default plugins<ul>
<li><b>regexp.js</b> : Add a tab that extracts timeline that has specific keywords, ID, etc. <a href="http://d.hatena.ne.jp/NeoCat/20090101">Detail(in Japanese)</a>
<li><b>lists.js</b> : Add a tab that shows lists you following. Specify the name of lists to make tab in "+" tab.
<li><b>search.js</b> : Add keyword search by <a href="http://search.twitter.com/">Twitter Search</a> to the "+" tab.
<li><b>followers.js</b> : Colorize tweets of users that you don't follow in blue. To use this, you need to fetch the list of followers by clicking the "Renew" button at the "Color followers" section.
<li><b>translate.js</b> : Choose "translate" from ▼, then the tweet is translated into the language specified in "+" tab > Translate. (Specify "en" for English.)
<li><b>thumbnail.js</b> : Add thumbnails to the URL of some photo sharing services. Currently supports <a href="http://twitpic.com/">twitpic</a>, <a href="http://movapic.com/">movapic</a>, <a href="http://f.hatena.ne.jp/">HatenaFotolife</a>, <a href="http://tumblr.com/">Tumblr</a>, <a href="http://yfrog.com/">yFrog</a>, <a href="http:/plixi.com/">Plixi</a>, <a href="http://img.ly/">img.ly</a>, <a href="http://ow.ly/">Ow.ly</a>, <a href="http://www.flickr.com/">Flickr</a>, <a href="http://instagr.am/">Instagram</a>, <a href="http://picplz.com/">picplz</a>, <a href="http://moby.to/">Mobypicture</a>, <a href="http://via.me/">via.me</a>, <a href="http://www.youtube.com/">YouTube</a>, <a href="http://www.nicovideo.jp/">Nico Nico Douga</a>, and <a href="http://www.slideshare.net/">SlideShare</a>.
<li><b>embedsrc.js</b>: Add a button (<img src="images/jump.png">) to overlay the content of URL in tweets. (created by <a href="http://twitter.com/_wa_">@_wa_</a>)
<li><b>resolve_url.js</b> : Replace short URLs with the originals in the timeline. (created by <a href="http://twitter.com/edvakf">@edvakf</a>)
<li><b>shorten_url.js</b> : Typing a URL in the text area followed by three semicolons (;;;) makes a shortened URL. (created by <a href="http://twitter.com/edvakf">@edvakf</a>)
<li><b>geomap.js</b> : Display inline Google Map by clicking the marker (<img src="images/marker.png">) of tweets with GeoLocation.
<li><b>tweet_url_reply.js</b>: Add a button (<img src="images/jump.png">) to get the content to URL of a tweet. (created by <a href="http://twitter.com/edvakf">@edvakf</a>)
<li><b>mute.js</b>: Add a menu to mute (hide) tweets with specified user or hashtag temporarily (1 hour) in ▼.
<li><b>shortcutkey.js</b>: Enable operation by shortcut keys. (-><a href="https://github.com/NeoCat/twicli/wiki/Shortcutkeys">List of the shortcut keys</a>)
<li><b>multi_account.js</b>: Switch between multiple accounts in '+' tab. Useful with tabbed browsers.
<li><b>notify.js</b>: Display notification from @twicli on startup.
<li><b>tweets_after_rt.js</b>: Find tweets done after retweets of the specified tweet.
</ul>
</ul>
<h2><a name="source">Source</a></h2>
"twicli" is developed at <a href="http://github.com/NeoCat/twicli/">github</a> under <a href="LICENSE.txt">MIT license</a>.
<p>Please report any bugs/wishes to <a href="http://twitter.com/NeoCat">@NeoCat</a>. Your patches are also appreciated.</p>
<h2><a name="link">Links <small><small>(all in Japanese)</small></small></a></h2>
<ul>
<li><a href="http://github.com/NeoCat/twicli/wiki">twicli wiki</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20080819/1219133294">Development Memo</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20110206/1296934235">About API call from JavaScript</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20080819/1219133294">About development of Plugins</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20081121/1227282584">About Outputz plugin</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20090101/1230838882">About Regexp plugin(1)</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20090101/1230913660">About Regexp plugin(2)</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20110119/1295391840">About Regexp plugin(3)</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20090824/1251125679">About Sound plugin</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20091101/1257088158">About Lists plugin</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20100722/1279741190">About Geomap plugin</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20130203/1359845283">About Twitter API 1.1 support</a>
<li><a href="http://d.hatena.ne.jp/NeoCat/20140223/1393110222">About Stream plugin</a>
</ul>
<h2><a name="author">Author</a></h2>
<a href="http://twitter.com/NeoCat">@NeoCat</a>
</div>
</body>
</html>