Tumblr は面白い ご意見、ご感想は、[[♪掲示板 http://kimux.org/index.cgi?talk]] にて。 * API [[tumblr API http://www.tumblr.com/api]]を使ってみよう。 ** JSON output JSON ジェイソン (JavaScript Object Notation) で Tumblr を取り出そう。 ** tumblr_api_read の軽い使用例 [[ウクレレ日記 http://kimux.org/ukulele/]] の頭の数行。 ** tumblr_api_read の例 http://kimux.tumblr.com/api/read/json をブラウザで見てみると（これを書いた当時。改行を適宜入れてます）…… var tumblr_api_read = { "tumblelog": {"title":"kimux", "description":"", "name":"kimux", "timezone":"Asia\/Tokyo", "cname":false, "feeds":[]}, "posts-start":0, "posts-total":"25", "posts-type":"all", "posts":[ { "id":21234761, "url":"http:\/\/kimux.tumblr.com\/post\/21234761", "type":"link", "date":"Tue, 11 Dec 2007 01:03:09", "bookmarklet":1, "mobile":0, "feed-item":"", "from-feed-id":0, "link-text":"kimux（以下省略） }, { "id":21186957, "url":"http:\/\/kimux.tumblr.com\/post\/21186957", "type":"quote", "date":"Mon, 10 Dec 2007 08:33:39",（以下省略） ** tumblr_api_read の読み方 最初にヘッダとして "tumblelog" の説明と記事数についての情報があり、それに続く "posts" の中に複数の記事が入っている。 主なヘッダ情報： ,tumblr_api_read["tumblelog"]["title"]),タイトル ,tumblr_api_read["posts-total"],全記事数 主な記事情報： ,tumblr_api_read["posts"][i]["type"] ,i 番目の記事のタイプ（regular/photo/quote/link/chat/audio/video） ,tumblr_api_read["posts"][i]["regular-title"]],記事のタイプが regular （テキスト）の場合のタイトル ,tumblr_api_read["posts"][i]["photo-caption"],記事のタイプが photo （写真）の場合のキャプション ,tumblr_api_read["posts"][i]["quote-text"],記事のタイプが quote （引用）の場合のテキスト ,tumblr_api_read["posts"][i]["link-text"],記事のタイプが link （リンク）の場合のテキスト ,tumblr_api_read["posts"][i]["（わかりません）"],記事のタイプが chat （チャット）の場合の何か ,tumblr_api_read["posts"][i]["audio-caption"],記事のタイプが audio （音声）の場合のキャプション ,tumblr_api_read["posts"][i]["video-caption"],記事のタイプが video （映像）の場合のキャプション ** HTML に乗せて JavaScript で引用だ！ 方針：主要な文字列だけ引っ張ってきて（画像、映像はこのさい無視）、小さい字で改行せずに表示する。種類ごとに色を変える。 下記の (you) の部分は自分のユーザ名に書き換えてください。 ただし、最新版は [[ウクレレ日記 http://kimux.org/ukulele/]] のソースを直接ご覧下され。(2010-01-24 quote に長文が引用されてしまう問題があるので、長い文字列は一律20文字カットとした。）(2010-01-24 例えば quote が長文だと全文引用されてWebページが埋め尽くされてしまう問題があるため、他のカテゴリーも含めて、長い文字列は一律20文字カットとした。） <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>tum test</title> <style type="text/css"> </style> </head> <body> <p>test start</p> <div style="font-size: small"> <script type="text/javascript" src="http://(you).tumblr.com/api/read/json" ></script> <script type="text/javascript" > nmax = 10; n = tumblr_api_read["posts-total"]; if (n > nmax) n = nmax; for (i = 0; i < n; i++) { switch (tumblr_api_read["posts"][i]["type"]) { case "regular": kind = "text"; label = tumblr_api_read["posts"][i]["regular-title"]; col = "background: #ffcccc"; break; case "photo": kind = "photo"; label = tumblr_api_read["posts"][i]["photo-caption"]; col = "background: #ccffcc"; break; case "quote": kind = "quote"; label = tumblr_api_read["posts"][i]["quote-text"]; col = "background: #ccccff"; break; case "link": kind = "link"; label = tumblr_api_read["posts"][i]["link-text"]; col = "background: #ccccff"; break; case "chat": kind = "chat"; label = ""; col = "background: #ccccff"; break; case "audio": kind = "audio"; label = tumblr_api_read["posts"][i]["audio-caption"]; col = "background: #ccffff"; break; case "video": kind = "video"; label = tumblr_api_read["posts"][i]["video-caption"]; col = "background: #ccffff"; break; } // HTML タグを全て剥ぎ取る label = label.replace(/<[^>]*?>/gi,""); // "(via )" という表記を削除する label = label.replace("(via )",""); /* 2010-12-24 kimux */ if (label.length > 20) label = label.substring(0,20) + "..."; url = tumblr_api_read["posts"][i]["url"]; document.write( '<dev style ="', col, '">', '<a href="', url, '">', i+1, ' [', kind, '] ' , '</a>', label, '</dev>', " | " ); } </script> </div> <p> end of script </p> ** リンク集 ,HTMLタグを削除してテキストフレームに読み込む, http://www.openspc2.org/book/InDesignCS2/hard/013/index.html ,文字列操作の比較表,http://0xcc.net/blog/archives/000137.html ,とほほ,http://www.tohoho-web.com/js/index.htm ,新JavaScript入門 8 文字列,http://homepage3.nifty.com/aya_js/js2/js208.htm
