Hatena-TubeをPlaggerで

Plagger

http://www.fladdict.net/app/hatenatube/ Hatena-Tube 面白い。
願わくば、データを JSON で扱ってくれたりすると「それPlaggerで(ry」ということになって、PlaggerLDR のような面白いことができるんだけど……ということで、

という方針でやってみる。

Plaggerで Feed -> JSON

どうすればいいのかな。とりあえず適当にでっち上げ。

package Plagger::Plugin::Publish::JSON;
use strict;
use base qw( Plagger::Plugin::Publish::JavaScript );

use File::Spec;
use JSON::Syck;

sub register {
    my($self, $context) = @_;
    $context->register_hook(
        $self,
        'publish.feed' => \&feed,
    );
}

sub feed {
    my($self, $context, $args) = @_;

    my $dir = $self->conf->{dir};
    unless (-e $dir && -d _) {
        mkdir $dir, 0755 or $context->error("mkdir $dir: $!");
    }

    my $file = $self->gen_filename($args->{feed});
    my $path = File::Spec->catfile($dir, $file);
    $context->log(info => "writing output to $path");

    foreach my $entry( $args->{feed}->entries ){
        $entry->{date} = $entry->{date}. '';  # as text
    }
    my $body = JSON::Syck::Dump($args->{feed});

    open my $out, ">", $path or $context->error("$path: $!");
    print $out $body;
    close $out;
}
1;

Jemplate

video.tmpl として下記ファイルを作り、jemplate -c video.tmpl > video.tmpl.js でコンパイル。

[% FOREACH e = entries %]
  [% FOREACH enc = e.enclosures %]
    [% JAVASCRIPT %]
       stash.set('vId',    stash.get('enc').url.match(/video_id=([^&]+)/)[1]);
       stash.set('vTitle', stash.get('e').title.replace("'", "\\'"));
    [% END %]
    <div class="video">
      <div class="video_thumbnail" style="background-image: url([% e.icon.url %]);">
        <div class="video_foreground">
          <a class="link_thumbnail" href="javascript:(TB_clicked('[% vTitle %]','[% vId %]'))" title="[% e.title %]">
          </a>
        </div>
      </div>
      <h3><a class="thickbox" href="javascript:(TB_clicked('[% vTitle %]','[% vId %]'))" title="[% e.title  %]">
          [% e.title %]
      </a></h3>
    </div>
  [% END %]
[% END %]

index.html

[追記]この作業をGM化 → http://d.hatena.ne.jp/sfujiwara/20060524/1148504297
Hatena-Tube の HTML を取ってきて index.html として保存。

$ wget -O index.html http://www.fladdict.net/app/hatenatube/
  • <div id="main"> から <div id="footer"> の直前までをざっくり削除
  • <div id="main"> の直後に <div id="video_container"></div> を記述
  • 以下の patch を当てる
  • Jemplate.js と video.tmpl.js も同じディレクトリに置く
--- index.html.orig     2006-05-25 02:20:44.000000000 +0900
+++ index.html  2006-05-25 02:30:12.000000000 +0900
@@ -4,10 +4,19 @@
 <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>HATENA-TUBE</title>
-       <link href="site-styles.css" rel="stylesheet" type="text/css"/>
-       <script language="javascript" src="js/jquery.js"></script>
-       <script language="javascript" src="js/global.js"></script>
-       <script language="javascript" src="js/thickbox.js"></script>
+       <link href="http://www.fladdict.net/app/hatenatube/site-styles.css" rel="stylesheet" type="text/css"/>
+       <script language="javascript" src="http://www.fladdict.net/app/hatenatube/js/jquery.js"></script>
+       <script language="javascript" src="http://www.fladdict.net/app/hatenatube/js/global.js"></script>
+       <script language="javascript" src="http://www.fladdict.net/app/hatenatube/js/thickbox.js"></script>
+        <script type="text/javascript" src="Jemplate.js"></script>
+        <script type="text/javascript" src="video.tmpl.js"></script>
+        <script type="text/javascript">
+        <!--
+            window.onload = function(){
+                Jemplate.process('video.tmpl', 'data.js', '#video_container');
+            }
+        //-->
+        </script>
 </head>
 <body>
        <div id="preloader"></div>
@@ -33,513 +42,8 @@

plagger で YouTube から feed を取ってくる

plugins:
  - module: CustomFeed::YouTube
    config:
      query: macbook
      sort: video_date_uploaded
      page: 1

  - module: Publish::JSON
    config:
      dir: /path/to/index
      filename: data.js

data.js の保存先は index.html とおなじに。

これで完成。お好きな YouTube 動画を Hatena-Tube の UI で見られます。
Filter::FindEnclosures で feed を作ると icon が付かないのがちょっと残念。(YouTube 専用じゃないから仕方ないが)