Big Sky

追記
os0xさんが、マルチプラットフォームで動くしかもブックマークレットで起動出来るAutoPagerize for IE6公開されておられます。
「できた！」とほぼ同時にtwitterに書き込んでたのが笑った。
確かに、iframeを使えばXHRを使った場合と違ってresponseTextからcreateContextualFragment等で苦労する事無く、同じドメイン内のiframeだからDOM操作が出来ると...
諦め所がXPath(responseTextからcreateDocumentが出来ないという意味で)でなく、XHRを諦めるべきだったかも。

でけれた。
AutoPagerizeとか、oAutoPagerizeとか、jAutoPagerizeとかをベースに改造しようかと思ったけど、結局XPathでつまづいた。
AutoPagerizeを実現するには、カレントのdocumentとは別のdocumentに読み込んだHTMLを入れてページ部を抽出する必要があるんだけど、IE6ではカレントdocumentにappencChildしないとXPathセレクタが動かない(amachangのJavaScript-XPathで検証)。また、createRange/createContextualFragmentも動かないだろうし、どちみち駄目。
つまり、XPathは実現出来ない事になる。
諦めて、mala氏が作ったオリジナル、「GoogleAutoPager」をベースに作り直した。
で、最初はGoogleだけでいいかと思ったけど、欲が出てtwitterやtumblr、d.hatena.ne.jp、b.hatena.ne.jpでも動かせるようにした。

アイコンとかはありません。ダブルクリックで起動です。
但し、セレクタとしてはCSSセレクタを使ってるので、特殊な調べ方は出来ない。しかもIE6なのでCSSのバージョンが低い。

セレクタライブラリとしてはjQueryを使用しています。動かす為にはTrixieが必要です。Trixieをインストール後
C:¥Program Files¥Bhelpuri¥Trixie¥Scripts¥
に以下のリンクにあるiAutoPagerize.user.jsを放り込めばインストールは完了。現状、SITEINFOはベタ打ちです。今後SITEINFOサーバを用意するつもりもありません。ただ、codereposに置いておくので誰でも修正出来る様にしておきます。

ネーミングは、「OperaのがoAutoPagerize」なら「IEはiAutoPagerize？」くらいの思考能力で付けた名前です。

よろしかったらどうぞ。

iAutoPagerize

昨日kuさんが頑張って探してたのはなんだったんだろう...苦笑
朝起きたらAPIが出来てました。確か昨日「/api」にアクセスしても無かったのになぁ。

FriendFeed Blog: FriendFeed API: Extend and improve FriendFeed

We are very excited to announce the launch of the FriendFeed API, which enables developers to interact with the FriendFeed site programmatically. It's designed to make it possible for anyone to improve FriendFeed or integrate FriendFeed into other applications. You can develop a FriendFeed interface for a mobile phone, build a FriendFeed widget for your blog, or develop an application that makes it easy to post photos to your feed from your iPhone.

さっそく使ってみました。APIはJSON、XML、RSS、ATOMで提供されており、クライアントライブラリとしてPHPとpythonのライブラリが用意されています。
つまり、XMLフォーマットを使っているgtktwitterを改造してgtkfriendfeedなんて事も出来る訳ですね。

ApiDocumentation - friendfeed-api - Google Code
friendfeed-api - Google Code

twitterと同じくprivateでなければ認証無しでアクセス出来ます。
認証が必要な場合は、「remotekey」と呼ばれるアプリケーションキーを取得する必要があります。remotekeyは

FriendFeed - Remote Key

で取得出来ます。認証方法はBasic認証です。今日は認証を使わない例ですが、javascriptからjsonで私と、kuさんと、otsuneさんのフィードをミックス表示する例をサンプルとして上げておきます。
まずコード
<style type="text/css"><!--
#mattn_friendfeed {
    margin: 1em;
    font-family: Verdana;
    width: 400px;
}
#mattn_friendfeed a {
    color: blue;
}
.friendfeed-line {
    padding-bottom: 1em;
}
.friendfeed-link {
    font-size: small;
}
--></style>
<script type="text/javascript"><!--
function mattn_friendfeed_callback(data) {
    var container = document.createElement('div');
    for(var n = 0; n < data.entries.length; n++) {
        var user = document.createElement('a');
        var link = document.createElement('a');
        var line = document.createElement('div');
        var icon = document.createElement('img');
        var br = document.createElement('br');
        user.href = data.entries[n].user.profileUrl;
        link.className = 'friendfeed-link';
        link.href = data.entries[n].link;
        link.appendChild(document.createTextNode(link.href));
        icon.src = user.href + '/picture?size=small';
        icon.setAttribute('align', 'left');
        user.appendChild(icon);
        br.setAttribute('clear', 'all');
        line.className = 'friendfeed-line';
        line.appendChild(user);
        line.appendChild(document.createTextNode(' ' + data.entries[n].title + ' '));
        line.appendChild(document.createElement('br'));
        line.appendChild(link);
        line.appendChild(br);
        container.appendChild(line);
    }
    document.getElementById('mattn_friendfeed').innerHTML = container.innerHTML;
}
function show_mattn_friendfeed() {
    document.getElementById('mattn_friendfeed').innerHTML = '<img src="http://mattn.kaoriya.net/images/ajax-loader.gif">';
    var s = document.createElement('script');
    s.charset = 'utf-8';
    s.src = 'http://friendfeed.com/api/feed/user?nickname=mattn,otsune,ku0522&callback=mattn_friendfeed_callback';
    document.body.appendChild(s);
}
--></script>
<input type="button" value="mattnのfriendfeedエントリを表示" onclick="show_mattn_friendfeed();" />
<br />
<em>mattnと、ku0522さんと、otsuneさんのmix表示</em><br />
<div id="mattn_friendfeed"></div>

そして実行例

続きを読む...

たしかにコレ、やばいっす。

spreadsheetとつながってるってやばいじゃんこれspreadsheetをバックエンドdbにしていろいろできるってことでしょ
ku's post on twitter

使い方次第では、結構強力な物になりそうな気がする。
ちなみに

F's Garage：iPhone SDKを読み解くのに必須！ Google AJAX Language APIを使ったブックマークWidget作った。
Google AJAX Language APIは、document.writeで翻訳機能読み込みのscript要素コードを出力するようにできており、ブックマークレットには必須の遅延ロードができないようなので、なんだかいろいろ苦労しちゃいました。

多分以下の様にすれば行けるはず。(jsapiのクエリパラメータ「callback」と、loadの第三引数「callback」)
wikiも確かに管理しやすいかもしれないけど、Google SpreadSheetも可能性があると思う。
ちなみに今回作ったSITEINFOは簡単な物なので、「ネタフル」と「IDEA * IDEA」くらいしかない。

あと、クエリのfrom区には「sheet1」とか使えるのが分かった。
以下、Google SpreadSheetからSITEINFOを読み込むサンプル
var siteinfo = [];
function handleQueryResponse(response) {
    var data = response.getDataTable();
    if (!data || response.isError()) {
        alert(response.getMessage() + ':' + response.getDetailedMessage());
        return;
    }
    for (var row = 0; row < data.getNumberOfRows(); row++) {
        siteinfo.push({
            'name'  : data.getFormattedValue(row, 0),
            'link'  : data.getFormattedValue(row, 1),
            'url'   : data.getFormattedValue(row, 2),
            'xpath' : data.getFormattedValue(row, 3),
            'base'  : data.getFormattedValue(row, 4)
        });
    }
    var html = '';
    for (var n = 0; n < siteinfo.length; n++) {
        html += '<b><a href="' + siteinfo[n].link + '">' + siteinfo[n].name + '</a></b><br />'
            html += '<blockquote' + '><' + 'pre>';
        html += '<b>url</b>:' + siteinfo[n].url + '<br />';
        html += '<b>xpath</b>:' + siteinfo[n].xpath + '<br />';
        html += '<b>base</b>:' + siteinfo[n].base + '<br />';
        html += '<' + '/pre></' + 'blockquote>';
    }
    document.getElementById('ExampleSITEINFO').innerHTML = html;
}

function querySITEINFO() {
    var query = new google.visualization.Query(
            "http://spreadsheets.google.com/tq?key=psdg8ZffuCtcsEuIuzzd1Mw&pub=1");
    query.setQuery("select A, B, C, D, E from sheet1 order by A desc");
    query.send(handleQueryResponse);
}

function jsapi_loaded() {
    google.load("visualization", "1", {"callback" : querySITEINFO});
}

function loadExampleSITEINFO() {
    var s = document.createElement('script');
    s.charset = 'utf-8';
    s.src = 'http://www.google.com/jsapi?callback=jsapi_loaded';
    document.body.appendChild(s);
}
とその実行結果。
IE6、Firefox、Safari3、Opera9.50bで動作確認。

続きを読む...