| @技術/プログラミング

自己紹介のページに最近deliciousにブックマークしたものを表示しようと調べてたんですけど、こういうの発見しました。知ってました?

HTML Feeds

HTML feeds are available for users. This is an easy way to add your Delicious links to your blog, and can be used as a simple view of your bookmarks on a mobile device.

delicious/help/html

スゲー。たとえば僕のブックマークだったら http://feeds.delicious.com/html/morygonzalez/ で一覧を取ってこられます。 ? のあとにいろいろパラメーターを指定すると細かく出力内容を調整できるし、タグごとのフィードも吐き出してくれる。しかもHTMLなのがいい。プログラミングはあんまりわからんちんなので、RSSを解析してHTMLとして出力とかできないし。HTMLで提供してもらえるならそれをちょいちょいと読み込んでしまえばいい。HTMLでiframeのなかにぶっ込むのもあり。

僕はPHPに以下のように記述して読み込んでます。ちと時間かかるけど。

// Get delicious Bookmark
ob_start();
readfile('http://feeds.delicious.com/html/morygonzalez/?count=10&tags=no&rssbutton=no');
$delicious  = ob_get_contents();
ob_end_clean();

| @技術/プログラミング

クリックした後にしばらく経ってから続きの部分が表示されるだけだとつまらないから、クリックしてから続きが読み込まれるまでの間にローディングgifが表示されるようにしてみた。参考にさせてもらったのはhysyskさんのブログ。

ローディングgifはこちらで作った。

コードはこんな感じ。よかったらどなたか添削してください。

function readMore(x) {  
  
	// format vars
	var id = x.replace("#", "");
	var loadPath = '/article.php?id=' + id + ' div#wrapper div[class=comment entry-content]';
	var rm = x + ' p.read-more a';  
  
	// hide read-more  
	$(rm).hide();  
  
	// write ajax-loader.gif
	$(x).append('<div id="loading" style="text-align: right; position: relative; top: -28px;"><img src="./images/ajax-loader.gif" width="28" height="28" /></div>');  
  
	// show and hide ajax-loader.gif
	$("#loading").bind("ajaxSend", function() {
		$(this).show();
	}).bind("ajaxComplete", function() {
		$(this).fadeOut("slow");
	});  
  
	// load rest of content
	$(x).load(loadPath);  
  
}

| @技術/プログラミング

jQueryを使って、「もっと読む」をインタラクティブにした。これまでもjQueryを使って細工してたんですけど、slideToggle() で先読みしたものを隠しておいて、クリックで展開するという感じにしてた。まぁこれでも良いんだけど、Ajaxってのに挑戦してみたかったので、「もっと読む」リンクをクリックした後に残りの部分を読み込むような仕掛けにした。どんな風になるかは「もっと読む」をクリックして調べてみてください。 Continue reading...

| @技術/プログラミング

ISBN変換プラグインのProduct Advertising API対応版を公開します(参照 : Amazon AWSからお便り APIが変わるらしい)。ひょっとしたらうまく動かないかも知れないけど、そのときはご連絡下さい。注意点はダウンロードページに書いてあります。

| @技術/プログラミング

はてなダイアリーとかはカテゴリーごとにフィードを生成してて便利だと思ったので真似してみました。たとえば category.php?k=映画 にアクセスしたら、映画のフィードだけにアクセスできる。もう金輪際、僕のチラシの裏的雑記で精神的苦痛を被ることはありません! =-o 読みたいカテゴリーのフィードを選択して時間を有効活用してください。

| @技術/プログラミング

昨日、AmazonのAWSからメールが来てた。英語なので斜め読みしたところ「名前がAWSから "Product Advertising API" に変わるので夜露死苦!」くらいな理解をしてたんだけど、今日届いた日本語のメールを読む限りではAPIが変わるらしい!

  • 今後はAPIを利用するに際し認証が必要になるらしい!
  • 5月11日から3ヶ月を移行期間とし、それ以後は認証付きのリクエストじゃないと受け付けなくなるらしい!
  • つまり、ISBN変換プラグインは動かなくなる!

というわけでちょっろと調べてみた

HMACAuthProcess_You

これまではItemIdの他にAccessKeyIdとAssociateTagとActionを送れば良かったんだけど、今後はAccessKeyIdとActionとTimestampを送る必要があり、ActionとTimestampは "Secret Access Key" でHMAC Calucuration and Encodingして送る必要があるらしい(HMAC calculate and Encodeしたものを "Signature" というらしい)。うへー、なんじゃそれ。

とりあえず参考になりそうな情報をクリップ

新しいISBN変換プラグインが出来たら公開したいと思います。なお、 hash_hmac() というPHP 5.1.2以降で実装された関数を使うので、それ以下のバージョンでは動かなくなりそう。

| @技術/プログラミング

iPhoneに最適化!

やっとiPhoneに最適化されたサイトが出来ました。ユーザーエージェントを見て、iPhone/iPodであれば専用のサイトを表示します。URIはパソコンと同じです。

これまでも一応iPhone対応というか、iPhone用のXHTMLとCSSは用意してあったんですけど、iui.jsを使った本格的なものではありませんでした。今回はiui.jsの埋め込みにトライ。まだ作り込みが甘いですが、iui.jsのページ遷移アクションなどを実装しました。

実はiui.jsの設置は何度も試みてたんですけど、なかなかうまくいかなかった。敗因としては、

  1. P_BLOGのXHTML構造を残したまま実装しようとした。
  2. 同様に既存のCSSを再利用しようとしていた。
  3. iuiのsampleにある通り、<ul>タグでページをデザインしようとしていた。

の三点ですね。既存のファイルの再利用は諦めてiPhone用にXHTMLやCSSは根本からデザインし直した方が手っ取り早かったです。あと、iui.jsのサンプルファイルは<ul>で組んであるんですが、この方法にこだわりすぎると煮詰まってしまってなかなか前に進みません。

今回はONO TAKEHIKOさんというウェブデザイナーの方のサイト(BLOG × WORLD ENDING すごくかっこいい!)を参考にしてみたところわりとうまくいきました。

いまのところ検索が実装できていないことと、グラフィカルなデザインがイマイチなのが今後の課題ですが、それはまたおいおい。