JavaScriptとAjaxで，手軽にかこよくWebアルバム

web

とある友人の結婚式2次会にでかけた。ガンガン写真を撮る。楽しい。で，その日のうちにWebにうp，これ基本。すぐ処理重要。

すこし今風に作ろうとしたら，いろいろ便利だったのでまとめておく。

Lightbox JS v2.0

概要

画像表示に特化したJavaScriptライブラリ。
http://www.huddletogether.com/projects/lightbox2/

上のURLの「Example」にある画像をクリックするとどんなもんだかよくわかる。画像の右側をクリックで次，左側で前。キーボード・ショートカットも効く。NとP。

使い方

必要なスクリプト要素を読み込んだのち，

<a href="images/dsc_6220.jpg" rel="lightbox[hoge]">
<img src="thumnails/dsc_6220.jpg" width="60" height="40" alt="" />
</a>

って感じ。これで万事OK。グレート。作者さんありがとう。

rel="lightbox[hoge]"

の[hoge]は，画像をグループ化するためのタグ。おなじグループにしてあげると，次へ前へが効くと。

感想
  • 設定項目少なくて容易
  • altでいろいろ遊べそう
  • 縮小まわりでcgiとの組み合わせたりすると，とても面白そう

AjaxCom

概要

静的HTMLページに1行コメントを書き込める掲示板。
http://www.kawa.net/works/ajax/ajaxcom/ajaxcom.html

PukiWikiのpcommentみたいな（みたいな言うな）。

動作環境

Perl。とりあえずさくらの5.8.8では無問題で動作

使い方

設定が必要なファイルは以下の三つ

  • 掲示板を置くHTML
  • com/ajaxcom.js
  • com/cgi-lib/ajaxcom-main.pl

HTMLはこんな感じ。

<link rel="stylesheet" type="text/css" href="http://www.example.com/yourdir/com/ajaxcom.css">
<script src="http://www.excample.com/yourdir/com/ajaxcom.js"></script>
<script src="http://www.example.com/yourdir/com/ajaxcom-lang-ja.js" charset="UTF-8"></script>
<div id="ajaxcom_here"></div>
<script>(new AjaxCom("ajaxcom_here")).load();</script>

おー，いまっぽいね。

続いてcom/ajaxcom.jsを編集。

AjaxCom.prototype.url_receive   = 'http://www.example.com/yourdir/com/ajaxcom-data';
AjaxCom.prototype.url_post      = 'http://www.example.com/yourdir/com/ajaxcom.cgi';

URLなことに注意。「/yourdir/com/ajaxcom-data」とかでも動くみたいですが，たいした手間じゃないのでいちいち設定しちゃえと。クロスドメインはややこしいことになりそうなのでアレで。

最後にcom/cgi-lib/ajaxcom-main.plを編集。

my $URL_ROOT     = "http://www.example.com/yourdir/";
my $DOC_ROOT     = "/usr/local/apache/htdocs/yourdir/";

$URL_ROOTにはオレのURL，$DOC_ROOTにはサーバ上でそれがどこ，を書けばOK。

感想

そっか，JS使えばフォームから送信できるし，サーバ上のなにかも動的に表示できると。かしこい。しかも設定簡単。これは便利。

CMSとか面倒くさいから後付でAjaxでちょろっと機能追加って，面倒くさがりのニーズに100%マッチって感じです。作者さんありがとうございます。

ResizeJPG

概要

JPEGファイルを縮小するツール
http://www.vector.co.jp/soft/win95/art/se269386.html

似たツールは大量にあるが，使いやすさ，画質，調整のしやすさなどなどで，これかなと。いや今ならPhotoshopでアクションかもしれませんが。

使い方

起動すればわかる

感想

Windowsネイティブのうまいアプリを作るのって，知識とセンス（ここでいうセンスは先天的な感覚っていうよりも，気づく力みたいな）必要だよなー，と。で，これはその意味で素敵なツール。作者さんありがとうございます。