Googleから「Ajaxアプリケーションを簡易に開発するツールキット」という謳い文句でGoogle Web Toolkit ベータ版 (GWT) がリリースされました。
何となく、Yahooが同様に出したライブラリの延長線上のようなものだと思っていて気楽に眺めてみたのですが、とんでもない。ぶっとびました。
GWT は言うなればJavaのSwing/AWTや一部のクラスを完全に置換する、一種のプラットフォームとして開発されています。
そこまでしてAjaxへコミットしたGoogleにやはり脱帽です。
何かはまちちゃんのところとか、はてブのブックマーク数をBlogに表示させるのが流行っているみたいなので、便乗してみます。
# 前にもらったし、トラックバック返しておきますね。
というか、以前にはてブのブックマーク数を任意のページにインライン表示してみるで一度紹介していますが、あの方法ではBlogの記事ページのようにとある1ページのブックマーク数を一つだけしか表示できませんでした。
今回はBlogトップページのように複数のコンテンツがある場合にそれぞれのコンテンツにブックマーク数をインライン表示(シール?)させる方法を紹介してみます。
但し、前回のように単にJavaScriptでwriteするだけだとそこで表示が止まってしまいますし、また毎回APIにアクセスすると全体表示が非常に遅くなってしまうため、CGI経由で複数のブックマーク数をまとめて取得しておいて、後からJavaScriptでインライン表示してみます。
また前回と同じくCGIからJavaScriptオブジェクトやデータを生成して引き渡しますので、クロスサイト・ドメインの制限にはかかりません。
例えばレンタルのBlogサーバーでも別のサーバーのCGIからブックマーク数を取得して表示可能になっています。
多分他の人たちも作られてると思いますが、組んでみたので公開してみます。
自分のPostしたコメントを一覧するのが主な目的なので、コメントを入れていない人にはあまり面白くないかも。
①CGI(Perl)で動作しますので、CGIの動くサーバーが必要です。
またLWPやXML::RSSがインストールされている必要があります。
getMyhetebuComments.cgi
#!/usr/bin/perl
use lib qw(../lib); #←ライブラリは適当に変更して下さい。
use LWP::Simple;
use LWP::UserAgent;
use HTTP::Request::Common;
use XML::RSS;
my $maxcount = 10; #←表示件数です。適当に変更して下さい。
my $yourhatena_id=”ro-ca”; #←はてなのIDです。自分のIDに変更して下さい。
print "Content-Type: text/html\r\n\r\n";
#ヘッダーも適当に変えて下さい。
print "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n";
print "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\r\n";
print "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"ja-JP\" lang=\"ja-JP\">\r\n";
print "<head>\r\n";
print " <link rel=\"stylesheet\" type=\"text/css\" href=\"(CSSファイル名を指定して下さい)\" />\r\n";
print " <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" />\r\n";
print " <meta http-equiv=\"Content-Script-Type\" content=\"text/javascript\" />\r\n";
print " <meta http-equiv=\"Content-Style-Type\" content=\"text/css\" />\r\n";
print "</head>\r\n";
print "<body style=\"background-color: #ffffff;\">\r\n";
my $hbUrl = “http://b.hatena.ne.jp/”.$yourhatena_id.”/rss”;
my $title;
my $link;
my $desc;
my $rss_data = get($hbUrl);
my $rss = new XML::RSS;
$rss->parse($rss_data);
my $cnt = 0;
foreach my $item ( @{$rss->{‘items’}} ) {
if($item->{‘link’} ne “”) {
$title = $item->{‘title’};
$link = $item->{‘link’};
$desc = $item->{‘description’};
print "<a href=\"$link\" style=\"font-size: 0.8em;\" target=\"_blank\">$title</a><a href=\"http://b.hatena.ne.jp/entry/$link\" target=\"_blank\"><img src=\"http://b.hatena.ne.jp/images/entry.gif\" border=\"0\"></a><div style=\"font-size: 0.8em;\">『$desc』</div><br />";
}
$cnt++;
if($cnt >= $maxcount) {
last;
}
}
print "</body></html>\r\n";
②サーバーにアップして、適切な権限を設定しておきます。
③IFRAME内などに呼び出してやればOKです。
例えばSeesaaの場合だと、管理画面から「自由形式」のコンテンツに以下のようなHTMLコードで呼び出せます。
<iframe name="hatebu" width="165" height="500" frameborder="0" src="getMyhetebuComment.cgiへのパス" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="false" scrolling="yes"></iframe>
Seesaaでは直接CGIを置いたりできないのでIFRAMEでの呼び出しにしましたが、SSIが使える環境などであれば、SSIに改造しても綺麗でしょう。
適当に改造して使って下さい。
ここしばらく、はまちちゃんが今度は主にはてなで大暴れ。
(一応、はてなとmixiからはログアウトしてから見た方がいいかも知れません)
http://mxxi.hamachiya.com/2006/02/post_15.html
http://mxxi.hamachiya.com/2006/02/post_14.html
http://mxxi.hamachiya.com/2006/01/post_13.html
http://mxxi.hamachiya.com/2006/01/post_12.html
どれも即座に対応されてしまっているのが笑えます。
絶対、はてなからは常にチェック入ってるんではないかと。
セキュリティが向上して、良かったですね。
今更ですが、GmailをOperaでも利用可能になってますね。
ここでいうOperaは現行の7.54u2です。次バージョンの8(7.6)からXMLHttpRequestサポートに伴って利用可能になる、との話はありましたが、それに関わらず先行して対応されたようです。
確認してみると、IE6やFirefoxではGmail viewというオプションでstandardかbasic HTMLかを選べるのですが、そのうちbasic HTMLのみに固定して使えるようにしてあるようです。
いわゆるAjaxパターンでは無い普通の静的なHTML Webメーラーとしての対応、ということなのでしょう。
そのため、普通にメールを読んだり書いたりは問題ないのですが、Mail Settingsを選ぶと
Settings can only be changed from Gmail’s standard view.
To access standard view, please use a fully supported browser.
と言われてしまい、設定変更できない罠も・・。
まあ、これもそのうち対応してくれるんだろう、と楽観視してますが。
(このあたりに、ブラウザ毎対応の説明がありますね)
# 因みに、ではOpera8(8.0b2)ではどうなのかというと、7.54u2と同様の動作でbasic HTMLにしかならないみたいです。
XMLHttpRequestサポートによるAjax対応はどうなってるのかな？コードを読んでみても複雑すぎてよく分からん・・。
聞いていた話と違うように思いますが、まあまだベータ版だからかも知れず、正式版リリース後にもう一度試してみましょう。
きのうはひまがアサマシするつもりだった？
きのう「ろこ」っていいますが、アサマシするはずだったみたい。
rocaは、
blogeetR094(β)をリリースしました。
今回は変更履歴リストにに編集元TEXTAREA名はHTMLタグの
といってました。
*このエントリは、こうさぎの「「ろこ」っていいます」が書きました。
突然ですが、何となく作ってみたくなったので、Blog投稿画面でHTML入力をサポートするヘルパーアプリを公開してみます。
Blogの記事投稿画面では数種類のHTMLタグ入力しかサポートされないのが普通だと思いますが、blogeetを用いると、右クリックメニューから呼び出して投稿記事を自由にHTMLエディタで編集できるようになります。
実は旅行びと日記のHTMLエディタ機能のサブセットです。ですから自由に自分が使いやすいようにHTMLタグをカスタマイズすることもできますし、編集結果をリアルタイムにプレビュー画面で確認することもできます。
# 他にも同じようなソフトはあるようなのですが、一応Blog特化かつHTMLエディタ一体型ということで。入力できるHTMLタグをカスタマイズできるのも面白いかなぁと思っています。
ほんの二日ほどで旅行びと日記から切り出して作りましたので、いろいろまだ使いにくいとかバグがあるとかあるかも知れませんが、宜しければ使ってみて下さい。
単なる思い付き程度ですが、需要があるようでしたら、継続して開発してみます
旅行びと日記R1.7をリリースしました。
またまたHTML入力ナビの機能拡張です。
リストやテーブルもこれで実装し、カスタマイズも可能となっています。また細かなところで機能追加も行っています。
これでひとまず、HTML入力ナビに関しては固められたかな、という感じです。
またXML-RPC機能のオプションを追加し、何となく、News-Handlerにも大体対応。
でもまだまともにXML-RPC機能を実装してくれないようなので、あまりお勧めはしませんが、どうしてもという方はお試し下さい。問題などあるようであれば、例によって対応できる分には対応しますので。
次版からは少しBlogは離れて、基本機能の方にも手を入れる予定でいます。
さて、前回からの続きです。今回でこのネタシリーズは最終回です。
最後に残った記事作成画面での入力ボタンと対応するHTMLタグの例を見て下さい。これは記事作成画面でのHTML入力支援のためのボタンと、それにより挿入可能なタグ種類です。(但し一部の例です)
気付いてもらえるでしょうか。物理タグ(<b>や<i>)を記事作成時の標準に採用しているサービス事業者が随分と目立ちます。
これは不思議なことで、XHTMLやHTML 4.01を宣言しているのに、何故か物理タグをユーザーに使用させたがっているのです。
物理タグ/論理タグとXHTML/HTML 4.01の関係については別にここではこれ以上言及しませんが、普通標準準拠の意識があれば、極力避けることでしょう。
今回のテストでは簡単なXHTML/HTML 4.01双方にValidな記事を使用しました。つまり、主にテンプレートに対する対応状況のテストだったと言えます。
しかし、例えば非常に高得点だったPwBlogであっても、記事が物理タグや宣言された標準に準拠しないタグ構成を使用すれば、全体として標準準拠とは言えない方向に向かうしかありません。その１でも述べたように、Blogとはテンプレートにユーザーが書いたコンテンツを当てはめて文書を完成させるシステムだからです。
しかし何故ここまで物理タグが幅広く採用されているのでしょうか？
きっかけは、こちらの記事。なかなか面白いことを思いついて試されてます。
但し実際に自分で試してみると、この結果とはかなり点数が変わることにも気付きます。これは当然のことで、日々記事内容も変わりつつある以上、その内容が点数にも影響を及ぼしているからです。中には数十点以上の差異が出ていたり。
Blogで遊び始めた頃から、BlogシステムではXHTMLやHTML4.01などのHTML標準をどこまでコミットされているか興味を持っていました。BlogがCMSや手軽なHTML作成システムとして持てはやされるのであれば、やはりユーザーとしては何も難しいことをしなくても手軽にこうした標準仕様に沿ったコンテンツを作りたいですよね。
また、ブラウザやHTMLエディターなどでは散々言われ続けていることですが、こうした標準に準拠しないシステムによって標準から外れたコンテンツが量産されるという状況は好ましいものではありません。
そこでせっかく触発されたので、各Blogサービスでどの程度XHTMLやHTML 4.01などに対応できているか、若しくは可能なのか調べてみました。
Powered by WordPress.
Template based on praegnanz.de.
![[Atom]](http://www.rocaz.net/pic/feed-icon-blue.png){kind=icon}
![[RDF Site Summary 2.0]](http://www.rocaz.net/pic/feed-icon-red.png){kind=icon}
Recent Comments