地方紙注目記事をいじった

Posted on by

「地方紙注目記事」なるものを今まで公開していましたが、Yahoo!Pipesで「地方紙注目記事」を作ってみたよでも書いているように、pubdateの書式をうまく制御できていなかったのと、劇重なのはどうにかしたいなあとおぼろげに思っていて…

仕事で、staticHTMLにRSSを表示させる必要があっていろいろ調べていたところでふと思いついて、仕事そっちのけでｗ「地方紙注目記事」を手を入れてみました。

RSSをstaticHTMLに表示させるのにはいろいろ方法があるんですが、私が一番簡単そうだなーと思ったのは、RSSを読み込んで表示するjavascriptを探してくればいんじゃねってことでした。
それっぽいキーワードで検索すると事例やサンプルコードはいろいろ出てくるんですが、敷居が高かったり、逆に物足りなかったり…

結局、Google AJAX Feed APIを使うことにしました。存在は知ってはいたんですが敷居高そうだなーって感じで食わず嫌いだったんですが、APIkeyを取得してとりあえずサンプルコード動かしてみると案外あっさりうまくいったので、拍子抜けでした。

やりたかったのは…

  • 複数のRSSを取得してマージ
  • pubdateで降順に並べる
  • 日付をYYYY/MM/DD HH:mm形式で表示させる

複数のRSSをまとめて扱うのはやっぱりYahoo!Pipesが簡単だよねーということで、そっちでまとめて取得・ソートしておいて、それをGoogle AJAX Feed APIでたたいて取得して表示、日時表示もちょこっと整形、で現在の地方紙注目記事になりました。

コードは書けないのでひたすら検索で使えそうなコード＆ヒントを探すということを繰り返したので、３日くらいかかっちゃいましたが、できてしまえばやっぱりあいかわらずどうってことないやｗ　

見た目すっきりしたのと、やっぱり応答がちょっと速くなっているのがいいですね。自画自賛。
自分のメモもかねて、長くなるけどコードも張っておこう。

var url="http://pipes.yahoo.com/pipes/pipe.run?_id=87e9a13c4a347e0c4f364e31f8028f44&_render=rss";
var num=50;//表示する件数
google.load("feeds", "1");
function initRSSFeed() {
    var feed = new google.feeds.Feed(url);
    feed.setNumEntries(num);
    feed.load(onComplete);
}
function onComplete(result){
    if (!result.error) {
        var container = document.getElementById("feed");
        var temp = '<ul style="margin:1em;">';
        for (var i = 0; i < result.feed.entries.length; i++) {
            var entry = result.feed.entries[i];
            temp += '<li style="list-style-type:none;">' + changeDate(entry.publishedDate) + "&nbsp;" + changeTime(entry.publishedDate) + '&nbsp;&nbsp;';
        	temp += '<a href="' + entry.link + '">' + entry.title + '</a>';
        	temp += '<a href="' + 'http://b.hatena.ne.jp/entry/' + entry.link + '">';
        	temp += '<img src="http://b.hatena.ne.jp/entry/image/' + entry.link + '" style="border:0;" /></a>';
            temp += '</li>';
        }
        temp += '</ul>';
        container.innerHTML = temp;
    }
}
//日付表記を変換
function changeDate(str){
    var myDate=new Date(str);
    var YYYY=myDate.getFullYear();
    var MM=myDate.getMonth()+1;
    if(MM<10){MM="0"+MM;}
    var DD=myDate.getDate();
    if(DD<10){DD="0"+DD;}
    var date=YYYY+"/"+MM+"/"+DD;
    return date;
}
//時刻表記を変換
function changeTime(str){
    var myTime=new Date(str);
//	myHour=myTime-9;
    myHour=new String(myTime.getHours());
//	myHour=parseInt(myHour)-7;
//	myHour=String(myHour);
    if (eval(myHour)<10)myHour="0"+myHour;
    myMinute=new String(myTime.getMinutes());
    if (eval(myMinute)<10)myMinute="0"+myMinute;
    var time=myHour+":"+myMinute;
	return time;
}
google.setOnLoadCallback(initRSSFeed);

表示させたいエントリーやページに 

<div id="feed"></div>

って書けば、そこに表示されます。
地方紙注目記事のためだけにheadタグ内へjavascriptを仕込んでおくのもなんかスマートじゃないなーとは思うんだけど、地方紙注目記事かどうか調べてから表示するのもおいしいの？それ、って感じだし。
この間、Head CleanerというWordPressの高速化プラグインを入れてjavascriptやcssがだいぶ軽量化できているので、根本的な解決をどうするかは先送りにするｗ

Comments are closed.