おクスリのトラバが鬱陶しいなぁ2008年03月14日 00時30分53秒

ここ数日英語のトラバがやけに増えてる。全部クスリ関係で大半がGoogle Groups。いいかげん飽きてきた。

アサブロの使い方に

「spam」を設定するとそのトラックバックは非公開になります。また、その情報はスパム対策の有効な情報としてASAHIネットで利用することがあります。
とあるので一応即削除せずにいったん「spam」指定して、半日くらい寝かせてから削除しているのだが、これってほんとに使われてるのかなぁ。

ずーっと「spam」にしとかないとスパム対策に使われないんじゃ、管理画面にフィルタ機能でもない限り邪魔なだけで意味ない気がするのだが。

expandimage.jsがSafari for Winに冷たい件2008年03月02日 05時01分54秒

このブログのサイドバーに「最近のブックマーク」というのを貼っている。自分のtumblrのlinkのみをjson apiで抽出して並べる、というものだ。

で、だいたいtumblrにlinkをpostするときは、何についてのページなのかを忘れないように引用をつけたりしていて、「最近のブックマーク」ではその部分の表示をトグル切り替えするようにしている。

さて、本題。

なんとなくのノリで、「最近のブックマーク」をちょっと調整していたのだが、Safari for Winではトグル切り替えがまったく動作しない。

「最近のブックマーク」の独立版であるこちらのページは問題なくトグル切り替えができているし、他のブラウザでも特に問題がない。

トグル切り替え部分のイベント登録には、prototype.jsのEvent.observe()を使っているのだが、そこに登録しているイベントハンドラで、UAがSafariだった場合にalert()するデバッグコードを仕込んだところ、これも実行されない。どうやらEvent.observeでのハンドラ登録がうまくいっていないようだ。

手持ちのSafari for WinはDebug メニューを有効にしてあるので、JavaScript Consoleを表示したところ、

TypeError: Value undefined (result of expression this.attachEvent) is not object.
http://s.asablo.jp/js/expandimage.js  Line: 49

というエラーがでていた。おまえが原因か!

この「expandimage.js」、アサブロの画像表示周りのスクリプトらしい(自分ではあまりアサブロに画像登録をしていない。外部に置いてそっち参照させるので)のだが、この49行目前後を見てみると、

48: HTMLElement.prototype.addEventListener = function(name,func,dir) {
49:  this.attachEvent(name, func);
50: }
 
ってなコードになってる。このHTMLElement.prototypeのメソッド定義は
if (! (document.body && document.body.insertAdjacentHTML) || asablo.noHTMLElement) {

という条件を満たした場合に実行される模様。んで、これらの条件を満たした場合は、
  • HTMLElementオブジェクトが存在しない場合は定義する
  • HTMLElement.prototype.insertAdjacentHTMLの定義
  • HTMLElement.prototype.addEventListenerの定義
を行うと。

...ちょっとひどくないか?

上記の処理の対象となるのは

  • document.body.insertAdjacentHTMLがないブラウザ(=Firefox、Safari)
  • asablo.noHTMLElementがtrueなブラウザ(=IE)
のどちらかの条件に当てはまる場合で、どちらにも当てはまらないのはOperaのみなんですけど。

幸いというか、IEでのinsertAdjacentHTMLの定義はDOMとは無関係なダミーのHTMLElementに対して行われるため問題が起きず、FirefoxでのaddEventListenerの定義は他のDOM要素に(なぜか)影響を与えていないのだが、SafariはがっつりとaddEventListenerの上書きの影響をこうむっちゃっている

こういう処理はもうちょっと丁寧に状況分けしないとまずいでしょ。

「Webページ取得JSONP」でアサブロランキングを取得する2007年10月08日 01時50分12秒

アサブロのランキングを取得してみたり

Mashupediaで、JSONPで指定URLのソースを取得できるWebサービス「Webページ取得JSONP」が紹介されていたので、なんとなくアサブロのランキングを取得するライブラリを作ってみた。例によって、要prototype.jsで、ライセンスはNYSL。

ソース

こんな感じ。

var AsabloRanking = {
	callback : function(source) {
		var result = {};
		var dateMatch = /<div class="left">([\d\/]+)/g.exec( source );
		if( dateMatch ) result.date = dateMatch[1];
		
		var reg = /<div class="no(\d+)">.*?(<div class="ranking-([^"]+)"><\/div>\s*)?<a class="blogtitle" href="([^"]+)">([^<]+)<\/a>/;
		result.ranking = source.match( new RegExp( reg.source, "g" ) ).map( function(data) {
			var match = reg.exec( data );
			return match ? 
			{
				rank : Number( match[1] ),
				title : match[5],
				url : match[4],
				updown : match[3] || "top3"
			} : null;
		} );
		
		this.result = result;
		this.requesting = false;
	},
	request : function(callback) {
		this.requesting = true;
		this.result = null;
		
		var node = document.createElement("script");
		node.src =[
			"http://www.yoshimeux.com/wiss/HttpResponse.ashx",
			"?url=",
			encodeURIComponent("http://dir.asablo.jp/blog/ranking/"),
			"&callback=AsabloRanking.callback&charset=utf-8"
		].join("");
		
		var _self = this;
		
		document.getElementsByTagName("head")[0].appendChild( node );
		
		setTimeout( function() {
			if( _self.requesting ) {
				setTimeout( arguments.callee, 10 );
				return;
			}
			
			callback( _self.result );
		}, 0 );
	}
}

ダウンロードはこちら

使い方

結構シンプルで、AsabloRanking.requestメソッドにコールバックを指定するだけ。コールバックには

{
	date : "2007/10/07",
	ranking : [
		{
			rank : 1,
			title : "いちばんのブログ",
			url : "http://~",
			updown : "top3"
		},
		:
		:
	]
}
みたいなオブジェクトが渡される。

ルートにある「date」は現在確認可能なランキング対象日付の文字列。 rankingはArrayで、各要素は、

  • rank - 順位(1~100)
  • title - ブログタイトル
  • url - ブログURL
  • updown - 順位の変動状況(前日比)
の形式のオブジェクトが1~100位まで格納されてくる。

updownは以下のように定義。

  • top3 - トップ3
  • nochange - 変動なし
  • up1、up2 - 上昇。up1が変動量が大きい
  • down1、down2 - 下落。down1が変動量が大きい
定義ったって、ランキングページのクラス名から拝借してるだけなんだけども。

サンプル

button#get_ranking_071008とdiv#ranking_071008を設置したとして、こんな感じで使ってみる。

$("get_ranking_071008").onclick = function() {
	// updownプロパティの値の変換テーブル
	var updowns = {
		top3 : "☆",
		up1 : "<b>↑</b>",
		up2 : "↑",
		down1 : "<b>↓</b>",
		down2 : "↓",
		nochange : "→"
	};
	
	var target = $("ranking_071008");
	target.innerHTML = "ランキング取得中...";
	
	AsabloRanking.request( function(result) {
		target.innerHTML = "<h3>" + result.date + "</h3>";
		
		result.ranking.each( function(rank) {
			var item = document.createElement("div");
			item.innerHTML = [
				"<div>",
				"<b>" + rank.rank + "</b>",
				" " + updowns[ rank.updown ] + " ",
				"<a href=\"" + rank.url + "\">" + rank.title + "</a>",
				"</div>"
			].join("");
			target.appendChild( item );
		} );
	} );
}

で、こんな感じになる。

このサンプルではそのまま1~100位までを出力しているが、特定のブログの順位を取得してサイドバーに表示したりとかもできたりできなかったり。

なんてものを作ってはみたが

ほとんど需要なかろうて...

AutoPagerizeのアサブロ向けルールを作ってみたり2007年09月22日 16時15分31秒

AutoPagerizeって?

AutoPagerizeは、Firefoxの機能拡張「Greasemonkey」向けのユーザスクリプトで、これを導入していると、対応しているページの「次のページへ」をクリックせずに、自動的に今のページの末尾に追加してくれる、というもの。

たとえばGoogleの検索結果で、ページの最後までスクロールさせると次のページの内容が後ろに追加されるので、ページを移動せずすべての検索結果をだらだらと確認できるというものだ。

ヘンな気持ちよさ

ちょうど、ウノウラボでも記事があがったり、たんぶらうざが対応してたりとちらほらと目にしていたが、tumblrのダッシュボードで使ってみたくて手を出してみたのだが、想像以上に快適。いや、快適というか、なんだかヘンな気持ちよさがある。

特にtumblrなんかは、中身をロクにみないで^^;ただひたすらスクロールさせてだらだらと画像が流し込まれる様を眺めるってなことをついついしてしまう。いや、メモリ消費がすごいんですけど。

どんな感じになるのか

後述するが、このブログ(というかアサブロ)向けのルールを作ってみた。するとこのブログを開くと、こんな感じになる。

対応しているページを開くと、図のような感じでページの右上に小さな四角が表示される。これが表示されないページはAutoPagerize未対応、ってこと。

で、このページを最後までスクロールさせると、さっきから説明しているように次のページが継ぎ足されるのだが、そうすると、このようになる。

強調部分のように、継ぎ足された部分に「page: n」と、元のページへのリンクが追加されるのだ。

こんな調子でだらだらとスクロールさせると、だらだらとコンテンツが追加され、それをだらだらとマウスホイールやスペースキーだけで閲覧できるって寸法。

キーボードのEndキー押しっぱなしとか、無意味に楽しい。

ルール作ってみますた

需要あるかわからんけど、アサブロが未対応だったので、アサブロ向けルールを作ってみた。だれかもうやってるかも知らんけど。

AutoPagerizeのルールってのは、以下の4つのデータでもって定義される。

  • url - このルールを適用するページのURL。正規表現
  • nextLink - 「次へ」のリンクを特定するXPath式
  • insertBefore - 継ぎ足しポイントを指定するXPath式。この式で特定されるノードのにコンテンツがロードされる
  • pageElement - 継ぎ足し対象のコンテンツを指定するXPath式。マッチする要素すべてがコンテンツとしてロードされる

で、これをアサブロの構成に当てはめてみると、こんな感じになる。
{
	url: 'http://.+\.asablo\.jp/blog/?.*',
	nextLink: 'id("navi-bottom")/a[contains(text(), "次")]',
	insertBefore: 'id("navi-bottom")',
	pageElement: '//div[starts-with(@class, "msg")]'
}

これはそのままautopagerize.user.jsのSITEINFOに記述すればそのまま使える。

いちおう、ランキングから無作為にいくつかのブログさんを訪ねてみたが、どれも問題なくだら見ができたので、アサブロ全般でOKだろう。

アサブロはわりと構成がかっちりしてるので、結構簡単に作れた。ただ、nextLinkの「contains(text(), "次")」やpageElementの「starts-with(@class, "msg")」なんかは結構危なっかしい感じなので、ご注意を。

アサブロがいっぱいいっぱいな件2007年09月21日 03時10分14秒

30分ほど前にアサブロにログインしようとしたらレスポンスが帰ってこない。アサブロトップは比較的素直にレスポンスを返してくるところを見ると、cgi周りがあっぷあっぷしてるのか。タグクラウドが表示されるまでヘンな間があったし。

3時直前くらいから普通に接続できるようになったが、ASAHIネットの保守・障害情報を見ると、ここしばらくかなり不安定なようだ。なんで?

なんてことを考えてたら、やはり同じように感じる方もおられるもんだ。

リンク:アサブロのシステムダウン: TAMO’s 朝風呂具

ひょっとして、アクセスランキング公開してからか?

なんにしても、データベース、トンじゃいました。てへ。みたいな事態にならんことを祈る。こんな管理インターフェイスじゃバックアップの取りようがないし。