ブログ更新を止めないための7つの方法と年の瀬のご挨拶

今年も早いもので大晦日です。

今年の8月から、何度も挫折したブログを再開し、
自分に鞭をうちつつ、なんとか8月から毎日更新を達成できました。

ブログ毎日更新を達成する際に自分に課したルールやTipsなどを
紹介させていただきます。
  1. 時間がある時にまとめて書き上げる
    • bloggerには予約反映の機能があるので活用しましょう
    • 毎日10分、よりも、週1回1時間、の方が楽でした
  2. Twitterをメモ代わりに使う
    • その時思ったことを気軽にTweetしておいて後で見返すと、自分が何を考えていたか思い出すきっかけになります。
  3. ソーシャルブックマークをメモ代わりに使う
    • ブックマークする時にコメントを残しておくと、自分が何を考えていたか思い出すきっかけになります
  4. メール下書き機能を使う
    • 地下鉄に乗ってるとき(電波が届かない時)など、思ったことは携帯メールに打ち込んでメールしておくと、ブログの下書きにためておけます
  5. 勉強したことの復習のつもりで書く
    • その週に学んだことを思い出しながら、正書するつもりで書く。
  6. アクセスログ解析を使い、アクセスしてくれる人の心理を読み取る
    • アクセスがあることを確認できてモチベーションにつながる
    • どういう経路で、なぜ自分のサイトに着てくれたかを考えることは楽しい。特に検索エンジンからの誘導の原因を考えるのは楽しい(自分の知り合いではない可能性が高いから)
  7. 控えめに広告を入れて少量のお金を稼ぐ
    • 収入がずっと0円で更新モチベーションを保つのは困難。
    • 広告だらけにはしない。できるだけ自然に読み手のためになる広告を入れる
    • ブログで大きく稼ぐのは目的にしない。あくまで自分のためのドキュメント置き場という感覚でやる(それが誰かの目に触れて役に立てば本望)
    • 大きく稼ぎたい場合は、別でサイトを構築し、そちらにブログから誘導することで稼ぐ。ブログはあくまで誘導口+宣伝場所とする
思いついたのはこんな感じです。

というわけで、今年1年このブログを見ていただき、ありがとうございました。
来年もごひいきのほど、よろしくおねがいします。

OpenIDでのログイン機能を動かしてみてなんとなくわかった気になる(PHP編)

OpenIDってなんだよ、っていうことは検索すればWikipediaをはじめ、
細かい説明が書いてあるページがたくさん見つかると思うので、
今回は、http://www.openidenabled.com/が提供するPHPライブラリを使って
動作確認できるページをセットアップしてみる。

まずは、XAMPPのセットアップ。
OpenIDでのログインでは、https通信をする必要があるので、
手っ取り早く環境を構築するには、XAMPPが一番だともいます。
XAMPPをインストールしたら忘れずに起動しておきます。

次に、http://www.openidenabled.com/が提供するPHPライブラリを
ダウンロードして、/opt/lampp/htdocs/以下に保存+解凍。
php-openid-*.*.* というディレクトリができるが、
わかりやすくするためバージョン情報をrenameで隠蔽。
$ cd /opt/lampp/htdocs
$ wget http://openidenabled.com/files/php-openid/packages/php-openid-*.*.*.tar.bz2
$ tar jxvf php-openid-*.*.*.tar.bz2
$ mv php-openid-*.*.* phpopenid
次に、自分のホスト名がlocalhostだとOpenID認証サーバ側で怒られる場合があるので、
/etc/hostsを編集して、適当に自分のサーバに名前をつける
$ cat /etc/hosts
127.0.0.1 my.example.com
これで基本的な準備は完了。
http://my.example.com/phpopenid/examples/consumer/
にアクセスしてみて、


このような画面がでたら、OK
Identity URLに以下のものを入力すると、それぞれのプロバイダでログインできる
  • yahoo.co.jp」 と入力
    • Yahoo! Japan IDでログイン
  • yahoo.com」 と入力
    • Yahoo! ID(アメリカのYahoo! ID)でログイン
  • livedoor.com」 と入力
    • ライブドアIDでログイン
  • https://www.google.com/accounts/o8/id」 と入力
    • Google accountでログイン
    • Googleは上記のURLを入力する必要あり
  • mixi.jp」 と入力
ログインに成功すると、「You have successfully verified *****」
というメッセージとともにログインに使われたOpenIDが、緑の枠に表示されます。

動かすだけでなんとなく理解がすすむ気がするので、
興味と時間がある人はおためしください。

以下、はまった点など
  • GoogleのIdentity URLはgoogle.comじゃだめ。http://code.google.com/intl/ja/apis/accounts/docs/OpenID.html 
  • mixi.jpの証明書登録がめんどう
  • XAMPPをhttp://localhostで見ているとOpenIDログインできない
  • XAMPPの場合、/opt/lampp/share/curl/curl-ca-bundle.crtに既存の証明書ファイルがある

google chrome for linux でFlashが見れない問題対策

google chrome on linux がめちゃめちゃ高速で、
本気で乗り換えようかと検討中なのですが、
Ustreamが見れなかったので、なんでだーと思って調査した時のメモ。
  1. 最近iceweaselが重い
  2. でもaddonもあるし、他にブラウザの候補がないので我慢
  3. google chrome on linux のベータ版がリリース
  4. なにこれ早い
  5. 拡張機能も今後できそうだし、本気で乗り換えるかな
  6. Ustream見れない orz ← いまここ
というわけで、検索してみたらあっさりと見つかりました。
http://tanarky.blogspot.com/2009/12/boost.html
これの通りに、
$ sudo mkdir /opt/google/chrome/plugins
$ sudo cp /usr/lib/iceweasel/plugins/libflashplayer.so /opt/google/chrome/plugins/
を実行して、chromeを再起動したら見れるようになれました。

これから、google chromeの拡張機能の作り方を調べたいと思います。

Debianのデフォルト画像ViewerがいまいちだったのでComixをインストール



Debianのデフォルト画像Viewerがいまいちだったので
何かいいものがないかな、と調べていたら、
Ubuntu 7.10で使える画像ビューア
を見つけたのでComixをインストールしてみた。
$ sudo aptitude install comix
でインストール完了。簡単。
あとは、Gnome menuのアプリケーション→グラフィックス
に追加されているはずなので、そこから起動。

いけてるのはZipファイルの中にある画像ファイルを
解凍せずに閲覧できるところ。
Zipで固められた画像ってなんだよ、というつっこみは無しでおねがいします。

Google Chromeもあるし、画像Viewerもあるし、
本当に最近はWIndowsから縁が切れてきました。

jquery-1.4は2010/01/14リリース予定

jquery-1.4は2010/01/14にリリース予定みたいです。
http://ejohn.org/blog/closestarray-in-jquery-14/
We're still on track to push out a new alpha very soon and the final release on January 14th.
このブログエントリーにある、closestってなんだ、と思って
DEMOを触って、サンプルコードを読んでみました。

要は、ul, li のようなliが複数ある配列構造のHTMLでも、
1回だけ、
$(e.target).closest("li").toggleClass("hilight");
と書けば、すべてのliに処理を追加できるすぐれもの、
ということを理解。
これは便利。さすが。
1.4系では、closestのような実験的機能が高速化されて、
正式な機能として提供されるようです。
http://docs.jquery.com/Traversing

Google Chrome for linux ベータ版をDebian lennyにインストール

http://www.google.com/chrome
google chromeのlinux版がでました。
まだベータ版ということらしいです。

インストールする前に、libnssのアップデートが必要みたいなので、
アップデートを実行しました。
sudo aptitude install libnss3-1d
これですね。
というわけで、準備完了したので、chrome本サイトから
ダウンロードしたパッケージファイルを
sudo dpkg -i /home/satoshi/Desktop/google-chrome-beta_current_i386.deb
でインストールできました。
インストール後にフォントをVL Pゴシックに変更しました。



エクステンション開発も公開されたようだし、
iceweaselもまんねり気味になってきたので、
chrome乗り換えを検討したいと思います。

bloggerのテンプレートをカスタマイズしてみる(カスタマイズ前下準備編)

バックアップも終わり、デザインテスト用ブログも作成して
外部ファイル置き場のサーバも確保できたので、
いよいよカスタマイズしていこうと思います。

まずは、レイアウト→新しいテンプレートの選択、で
自分がイメージするブログのデザインに近いテンプレートを選択します。
以下のものは、
  • 全体幅
  • フォントサイズや色
  • カラム数
後で細かくデザイン変更できるので、あまり気にしなくてOKですが、
自分ですべて細かく設定するのは大変なので、できるだけ近いものを
選ぶ方が後々楽です。

基本テンプレートが決まったら、レイアウト→HTMLの編集で
細かい設定をしていきます。この時に、「ウィジェットのテンプレートを展開」
というチェックボックスをONにして編集をしましょう。
これをONにすることで、設定できるすべての項目が表示されるようになります。

bloggerのテンプレートをカスタマイズしてみる(デコレーション編)

前回書いた通り、Bloggerのテンプレートは、1つのXHTMLファイルです。

シンプルでわかりやすいのですが、
以下のようにデザインを変更しようとしたときちょっと困ります。
  • サイトロゴやアイコンなどの画像を追加したいとき
    • 画像置き場は正式に提供されていない
    • 投稿に画像を貼り付けて、それを参照する方法はあるが、めんどくさい
  • 外部のCSSを読み込みたいとき
    • XHTML内に記述することもできるがソースが汚くなる
    • XHTML内でコードを編集するのは大変
  • javascriptを動かしたいとき
    • XHTML内に記述することもできるがダブルクオートのエスケープなど面倒
    • XHTML内でコードを編集するのは大変
というわけで、外部ファイルサーバを用意する方が、
XHTMLはすっきりとした形で書けるので、
よさそうです。

問題はどこのサーバに置くか、ということですが、
まずはFC2においてみます。
国会議事堂
fc2に置いた画像:http://tanarky.web.fc2.com/img/gijido.png
ファイル自体は存在するのですが、外部ドメインのサイトから参照できません。
FC2側でリファラドメインをチェックして、参照をブロックしているようです。

check
geocitesに置いた画像:http://www.geocities.jp/tanarky/blogger/tanarky/img/check.png
は問題なく見れるようです。というわけで、置き場所はとりあえず、geocitiesにしてみます。

JS-Blogger-Client: inserted post

This is the body of the blog post. I can include HTML tags.

WordPress 2.9がリリースされました

wordpress 2.9がリリースされました。
追加された機能は以下の通り。
  • Undoとゴミ箱機能
  • 画像編集機能
  • プラグインの一括アップデートチェック
  • 簡単なEmbedタグの挿入による動画貼り付け機能
だそうです。早速開発マシンにインストールしてみようと思います。

bloggerのテンプレートをカスタマイズしてみる(基礎知識編)

bloggerのテンプレートをカスタマイズする方法を少しずつ学んでみる。

まずは、何はともあれ現状のバックアップから。
  1. bloggerにログインして、
  2. レイアウト→HTMLの編集
  3. テンプレートをすべてダウンロード、からXMLを保存しておく
これでバックアップは完了。

また、現状公開中のブログのデザインを編集すると、
編集中のタイミングで見にきた人に影響がでちゃうので、
それとは別にデザインテスト用のブログを用意することをおすすめします。
自分の場合は、こちらを用意しました。

bloggerのテンプレート+デザインは、結局1つのXHTMLファイルで表現されます。
このXHTMLでは、簡単なプログラミングをすることが可能になっている。
まずはb:***について。
  • b:include
    • 定義済みの共通部品をそこに表示する
  • b:if, b:else
    • 条件分岐
  • b:skin
    • CSS定義?
  • b:widget
    • 不明
  • b:includable
    • includeするための部品を定義する?
次に、data:***について。これは、投稿のタイトルやID、URLなどを
使用したいときに使う。
  • data:post.url
    • 個別記事のURL
  • data:post.id
    • 個別記事のID(一意な数字になるっぽい)
  • data:post.title
    • 個別記事のタイトル
などなど。
他にも色々項目はありそうですが、上記でやりたいことのほとんどを網羅できそうです。
これからもうちょっと細かく調べてみます。


YUI3 Galleryにプログラムを載せる方法3 モジュール追加承認

以前書いた自作のYUI3プラグインをGalleryに登録依頼していたところ
すぐに承認されました。
YUI3 querystring parser

承認までの流れとしては、
  1. サイトにログインしてプラグインについての説明を書く
  2. 待つ
  3. メールが届いて承認完了
という感じでした。
メールは、
Subject:  [Gallery Item Approved] - querystring
Body:
Dav Glass approved your gallery module: querystring
http://yuilibrary.com/gallery/show/45
という内容でした。
Dav Glassってのは、YQLのプラグインを作った人のようです。
このyuilibrary.comのgallery管理もしている人なのかも。
Yahoo!の社員かな?

何はともあれ、Galleryに追加登録されましたが、
まだ、コードをYahoo!が提供するCDNには置けていないので、
そちらに置いてもらえるようにコードを綺麗にしてから
再度申請したいと思います。

祝 世界デビュー

boost勉強会が面白かったのでまとめ

ちょっと前の話になるが、Boost勉強会をUstreamでストリーミングされてました。
土曜日にベッドに寝ながら見てましたが、面白かったので、資料のリンクなどを
まとめてみました。

Ustreamリンク
Boost.勉強会のまとめとか感想とか今後についてとか



Boostは少しだけ使ったことがあるけど、知らない機能ばっかりでした。
使いこなせるようになったら強力だとおもいましたが、
最近はJavascriptばっかり書いてるフロントエンドエンジニアなんで
機会ができたらやってみようっと。

またブログのレイアウトを変えました(Adsense+インタレストマッチ対策)

またブログのレイアウトを変えました。
レイアウトを変えた理由は、アクセス数が下がっているのに、
広告収入がめちゃくちゃ下がってしまったからです。

広告収入が下がった原因は、
レイアウトをフリーのテンプレートに変更したところ
細かい広告設定がBloggerのエラーチェックに引っかかって
変更できなくなってしまったから、と考えました。

特に、広告の位置が悪かったんであろうという考察をしまして、
結局デフォルトのレイアウトからカスタマイズすることに。

やったことは以下
  • 削除していたYahoo!インタレストマッチを復活させた
  • Adsenseのサイズを調整した。ナビに配置した広告は小さく、投稿ごとに表示される広告は大きくした
  • 広告の色を背景色に溶け込ませるようにした。目立たなくなるけど主張しすぎないようにした
  • CSSを若干変更した。blockquoteを点線で囲むようにした
  • 投稿タイトルが目立つようにアイコンをつけてみた
カスタマイズがわかってきたので、Twitterやソーシャルブックマークのリンクが
表示されるようにしてみたい

Twitter APIのドキュメントを読んでみて雑感

ほりえもんのTwiterとamebaなうに対する考察がおもしろい。
芸能人が大挙してTwitterを使い始めたらこまると考え「なう」をオープンさせたのかもしれない。
(略)
一つは、そもそもアメブロの主要コンテンツである芸能人ブログはTwitterの140文字つぶやきと、現状でもほとんど変わらないということ。ページビュー稼ぐために1行毎に行間が数行もあることで見た目を水増ししているにすぎず、きちんと要約してまとめればほとんどのエントリが140文字に収まるはず。
ワロス。amabeなうはうまくやらなければ流行らないのは完全に同意。
芸能人blogのように、アイデア次第である程度のお金を生み出したり、
話題になってある程度の人を集めることは可能かもしれないが、
Twitterには到底およばないと自分は考える。
Twitterが本体のサービスを極限までしぼって、オプションサービスは全てサードパーティに自由にやらせているところである。これが実はTwitterがここまで広まった大きな理由のような気がする。
これも完全に同意。
APIを公開してここまで成功したサービスは他に思い当たらないし、
自分のサイト(の見た目など)を構築する労力を削ってまで、
API+プラットフォームに心血を注いでいるのがTwitterのやり方なのは、
Twitter API Documentを見ればわかる。

例えば、search APIは、
Requires Authentication (about authentication):
false
このAPIを使うのに、認証は不要となっている。
これにはかなり驚いた。
http://search.twitter.com/search?q=%23yshop
このHTMLページと
http://search.twitter.com/search.atom?q=%23yshop
このAPIのレスポンスは等価である、ってこと。
# 2つとも、認証不要で参照できるし、内容も同等だから

おれはデータを集めて簡単に使えるようにするから、
あとはお前らがうまいこと使って面白いもん作ってくれよ、
というスタンス。なんという男前。

限られた人数で世界を驚かせるには
自分たちは何を作るか、と同じくらい、何を作らないか、
ということを明確化するのが大切なんだな、と気づかされました。

ヤフオクにTwitterにつぶやくリンクが表示された件について

ヤフオクの商品詳細ページにTwitterにつぶやくリンクが表示されたようです。
Javascript Offだとリンクが表示されない仕様なようです。

リンクをクリックすると、
RT @8209 - Twitter★「ツイッター」でビジネスが変わる!★格安!!・美品!! http://page13.auctions.yahoo.co.jp/jp/auction/r59740614
といったメッセージが初期表示されます。
@8209は、Yahoo!オークションの公式アカウントのようです。

Twitterボタンが表示されている反応は、こんなかんじ
「ライバルを増やすからTweetしない」という入札側としては正直な意見も。

で、@8209に対する投稿を見てみると、
こんな感じで、なかなかのスピードで投稿されている。
内容を見ると、出品者が自分でTweetしているのかな、と予想される。
出品者としてはいろんな人に注目されたいのでこれまた理解できる行動。

ヤフー側のこれからのサービス展開に期待。

Yahoo!オークションとショッピングのアフィリエイトリンク作成bookmarklet

Yahoo!オークションには
オークション用のアフィリエイトリンク作成ツールがあって、
Yahoo!ショッピングには
ショッピング用のアフィリエイトリンク作成ツールがあり、
作成されるアフィリエイトURLはパラメータの値が微妙に違ってめんどくさい。

2つのブックマークレットを用意するのもいいけど、
使い分けるのがめんどくさいので、
if文で分岐した1つのブックマークレットにした。
javascript:var p,n,l=location.href,e=encodeURIComponent;if(l.search(/shopping\.yahoo/)!=-1){n='shpg';p=877935733}else if(l.search(/auctions\.yahoo/)!=-1){n='auct';p=877775177}else{alert('error');exit}var u='http://atq.ck.valuecommerce.com/servlet/atq/referral?sid=2219441&pid='+p+'&vcptn='+n+e('%2Fp%2FNqNP7flCUN49xU3KOQg-')+'&vc_url='+e(l);done=prompt(n,u);location.href=u;
上記の太字の部分を自分専用に変える必要がある。
自分の文字列を知る手順が以下。

http://special.auctions.yahoo.co.jp/html/affiliate/index.html
から、
URLに「http://auctions.yahoo.co.jp/jp/」といれて、
テキストにはなんでもいいので、文字列をいれて、
リンク作成ボタンを押して遷移したページで、
HTMLソースにある「vcptn=auct*****」の*****部分が
自分のアフィリエイトIDっぽい。

上記のブックマークレットに貼り付ける際には、
auctの部分は取り除いて貼ってください。
auctの部分はショッピングの場合、shpgになるみたい。
# Yahoo IDが同じなら*****の部分は共通

複数のYahooIDでログインして、ツールと格闘して
ようやく仕様を理解するところまでたどり着きました。
ちゃんと明文化して仕様を公開してくれればいいのに。

さて、次は、bitly連携して、アフィリエイトURLを
短くするブックマークレットに挑戦してみます。

YUI3 Galleryにプログラムを載せる方法2 モジュール登録

http://tanarky.blogspot.com/2009/12/javascriptquery-string-parseryui3.html
以前、YUI3のプラグインを書いてみたので、yuilibrary.comが提供するCDNに
登録してもらうように、準備をしてみた。

手順は
http://yuilibrary.com/gallery/developer#pullrequest

まずは、OpenIDでログインしてみて、
My Moduleに登録を開始。

ソースの場所とかを書かないといけないので、
git push origin master
して、
http://github.com/tanarky/yui3-gallery
で見れる状態にしておきました。
(まだコードは整理していないが)

で、登録完了
http://yuilibrary.com/gallery/show/45
登録時点では、pendingとなっているが、
何か審査があるのか、自分の入力が足りないのか謎。

とりあえず、しばらくこのまま待ってみるとするか。

OAuth認証アプリを作るためTwitterにアプリケーション登録をする

OAuth認証を使ったアプリケーションの勉強のために、
Twitterでアプリケーションアカウントを取ったのでメモ。

まず、なぜTwitterにしたか、というと、
Yahoo! JapanでもOAuth用のアプリケーションIDは取得できるが、
なぜか自分のサイトのドメイン認証をしないと
アプリケーションIDが取得出来なかったので、
作りたいものが明確になって環境がそろうまで後回しにしました。

TwitterでアプリケーションIDを取得するには、
まず、http://twitter.com/appsにいって、
 
「Register a new application」をクリックしてフォームページに遷移します。
入力内容は以下の通り
  • Icon: 適当にアップロード。自分はここで選びました
  • Application Name: 適当に入力。testhogehogeとか
  • Description: 適当に入力。テストほげほげ
  • Organization/Website: 空
  • Application Type: ウェブアプリを作ろうと思っているのでBrowserを選択
  • Callback URL: 空。後で変更できる。
  • Default Access Type: write予定はなくても、read/writeで。
  • Use Twitter for login: Yesで。
これで、英単語を入力して保存すればアプリケーションの登録は完了。

Twitterアプリの準備が整ったので、OAuthまわりの調査をして
何か作ってみようと思います。

iPhone 3GS 16G 黒を割賦で購入(実質無料)

http://mb.softbank.jp/mb/iphone/everybody/
2009年12月4日から2010年1月31日まで、
iPhone for everybodyキャンペーンということで、
iPhone 3GSの値下げになったので、
とうとうiPhoneにのりかえることにしました。

ちょうどauの年割のはざまで、お金を取られることなく
au -> softbank へのMNPで乗り換えが完了しました。

といってもauの解約からあわせて、手続きに
2時間以上かかりました。時間がないときは危険。

1週間ほどiPhoneを使ってみた感想は、
携帯の概念が変わりすぎて最初は辛いけど、
なれるとめちゃ快適、です。

今のところ、お気に入りのiPhoneアプリは
Dropboxです。これにPDFを入れまくれば、
電車の中では暇しません。

JavascriptによるQuery String ParserをYUI3のプラグインとして作ってみた

JavascriptでQuery String Parserがほしいな、と思ったので、
Query String ParserをYUI3のプラグインとして作ってみた。

以前、環境は作ったので、ビルドは簡単でした。
手順は↓
http://yuilibrary.com/gallery/setup

問題は、コードですが、Parse部分は
http://adamv.com/dev/javascript/querystring
にあるコードを参考に書いてみました。

プラグインのお作法については、yqlやbitlyのコードを参考に
悪戦苦闘しつつ、なんとかできました。

ビルド後のjavascriptのコードはこちら
http://github.com/tanarky/sample-codes/tree/master/js/yui/htdocs/gallery/gallery-querystring/

プラグインを使ったサンプルコードはこちら
http://www.geocities.jp/tanarky/yui/yui3_qs.html

さて、なんとなく動いているようなので、
あとは公開といきたいところです。
parseコードを公開している人にメールしてみるのと
公開のための手順を調べてみます。

Google App Engineで全文検索

google app engineで全文検索できるようになるライブラリを見つけた

普通、Google App Engineでは、文字列型(String)はインデックスされるが、
文書型(Text)は検索対象外である。Stringの最大長は500バイト。
Textは1Mバイト。

ホームページを見ようとしても、真っ白でみれないが、
googleのキャッシュから判断するに、
スペースやハイフンでTextを分割して、Stringにして
突っ込んでいるような処理に見えた。

英語ってスペースで簡単に単語を区切れるからいいよなー、とちょっと嫉妬。
これに形態素分割機能をつけたら神だな。

YUI3のbitly galleryを使ってショートURLを作成する

bit.lyは、短いURLを発行し、クリック率などを
trackできるようにしてくれるサービスで、
主にTwitterクライアントで採用されていることで有名です。

ショートURLの作成には、APIが公開されているので、
そちらを使うと便利です。

今回は、そのAPIをJavascriptからYUI3のbitlyプラグインを使って叩いてみました。

今回用意したサンプルはこちら

コードの要所部分を解説すると、

    // bitly api の "login" と "apiKey" を設定する
    var b = new Y.bitly({
        username: 'tanarky',
        key: 'R_e0cbd9274f2301ce3f0bc62e45b975f7'
    });
    // 今のURLからショートURLを作成する
    b.shorten(location.href, function(e) {
        Y.one('#bitly').setContent('このページのショートURLは、「'+e.shortUrl+'」です。');
    });

b.shortenのコールバック関数の引数eに対して、
e.shortUrlで簡単に取得できます。

便利な世の中になったなぁー

HTMLのtarget属性とかJavascriptのwindow.openとかブラウザのポップアップブロックとかについて

HTML 4.01 strictではtarget属性が認められていない。
参考:Yahoo知恵袋の質問

一方、HTML5では
The target attribute, if present, must be a valid browsing context name or keyword. It gives the name of the browsing context that will be used. User agents use this name when following hyperlinks.
と認められるらしい。
A valid browsing context name or keyword is any string that is either a valid browsing context name or that is an ASCII case-insensitive match for one of: _blank, _self, _parent, or _top.
また、javascriptでwindow.openするときに、
ブラウザのポップアップブロックされる場合と
されない場合についてあるので、備忘録としてメモ。


これはブロックされる
これはブロックされません

aタグにonclick属性で直接window.openすると、ブロックにはひっかからない、
間接的にwindow.openを呼ぶと、ブロックされる、みたいです。

ブラウザのセキュリティレベルを変更すると、target属性でも警告が出たり
するようになるが、デフォルトでは上記のような挙動になります。

追記:
あれ、、、ブログが公開されて確認してみたら、
両方ともポップアップできました。@ iceweasel-3.0系
もうちょっと確認してみます

jquery-1.4 alpha released

jqueryの1.4 alphaがリリースされました。
http://blog.jquery.com/2009/12/04/jquery-14-alpha-1-released/
satoshi@debian:~/src$ ls -l jquery-*js
-rw-r--r-- 1 satoshi satoshi 57254 2009-11-24 03:54 jquery-1.3.2.js
-rw-r--r-- 1 satoshi satoshi 89994 2009-12-05 02:55 jquery-1.4a1.min.js
サイズがだいぶ大きくなっているようですが、
  • live was drastically overhauled and now supports submit, change, mouseenter, mouseleave, focus, and blur events in all browsers. Also now supports context and data.
  • append, prepend, etc. have been heavily optimized.
  • add has been adjusted to always return elements in document order.
  • find, empty, remove, addClass, removeClass, hasClass, attr, and css have been heavily optimized.
速度の改善と、マウスイベントが追加されたのが主な変更点みたいです。

作者のTwitterに、これから情報がアップされそうなので、
気になる方は、フォローすることをおすすめします。
http://twitter.com/jeresig

はじめてのYUI3 Galleryをビルドしてみる

手順はこちらを参考にやってみた。
名前は、gallery-tanarky としている。
# ビルドにantを使うのでinstall
$ sudo aptitude install ant
# バージョンの確認
$ ant -version
$ java -version

# あらかじめforkしていたyui3-galleryをclone
# forkする手順はhttp://yuilibrary.com/gallery/developer
$ git clone git@github.com:tanarky/yui3-gallery.git
$ cd yui3-gallery/

# ファイルとディレクトリ作成
$ mkdir -p build/gallery-tanarky
$ mkdir -p src/gallery-tanarky/tests
$ mkdir -p sandbox/tanarky/gallery-tanarky
$ mkdir -p src/gallery-tanarky/js
$ touch src/gallery-tanarky/build.xml
$ touch src/gallery-tanarky/build.properties
$ touch src/gallery-tanarky/js/tanarky.js
$ emacs src/gallery-tanarky/build.xml
$ emacs src/gallery-tanarky/build.properties
$ emacs src/gallery-tanarky/js/tanarky.js
$ cd src/gallery-tanarky/

# ビルドする
$ ant all
------
BUILD SUCCESSFUL
Total time: 16 seconds
------
と出力されたので、うまくいったんだろう。
とりあえず、満足。

YUI3 Galleryにプログラムを載せる方法

調べてみた
  1. http://yuilibrary.com/forum/ucp.php?mode=registerでアカウントを取得
  2. githubのアカウントを取得
  3. 寄付募集中というコンテンツをサラッと読んで
  4. http://github.com/yui/yui3-gallery/からforkすれば後は自由に開発
ギャラリーのコードは以下にあるが
http://github.com/yui/yui3-gallery/tree/master/src/
2009年 12/4現在、25個ある。思ってたより少ないかな。

なんか面白そうなのに、
http://github.com/yui/yui3-gallery/tree/master/src/gallery-event-konami/js/
http://en.wikipedia.org/wiki/Konami_Code
こんなものがあった。
なんのために、どこで使えばいいんだ?

もうちょっと色々読んでみて、わかってきたら何か1つ上げてみようとおもう。

YUI Library Gallery が面白そう

YUI Library :: Galleryが面白そう。
意訳すると、
  • 手早く配れて
  • たっぷりの容量で
  • だれでもアクセスできて
  • 簡単に追加+公開できて、
  • BSDライセンスじゃなくても問題無し
という感じでしょうか。
http://yuilibrary.com/gallery/popular
には有名で便利なものがそろっています。
気になったのは
ってところですかね。bitlyまであるなんて、素敵です。
おれも何かつくってアップしてみます。

YUI3を使って、Javascriptから外部ドメインにPOSTリクエストをする

なんでわざわざそんなことをするのかはさておき、
YUI3を使って、Javascriptから外部ドメインにPOSTリクエストをしてみた。

主に障害となるのが、クロスドメイン問題。
この問題を回避するために、色々な手順や準備が必要なので、
備忘録として残しておく。

環境の準備として、用意するのは以下の2つ
  1. APIサーバ
  2. javascriptからデータをPOSTするクライアント
この時、1.と2.は、ドメインが別のサーバにわけておく。
例えば、1.はレンタルサーバ上のWebサーバ(http://example.com/api.php)、
2.は、ローカルにたてたWebサーバ(http://localhost/foo.html)、など。

この環境で、foo.htmlから、api.phpに対してPOSTでデータを送信する。

このときに、foo.htmlの中に、
<form action="http://example.com/api.php" method="post">
とは書いてはいけない、という縛りを設ける。

なんでそんな縛りを設けるか、というと、
http://example.com/api.phpは、データの更新APIという位置づけで、
ページの表示処理をいれたくない。成功か失敗かだけを判定するAPIとして
存在したい。ページの表示処理は、http://localhost/foo.htmlの役割、
http://example.com/api.phpはデータのCRUD操作をする役割として
明確にわけたいからである。

というわけで、foo.htmlからjavascriptをつかって、外部ドメインに対して
データをPOSTしなければいけない、というわけ。

で、結論としては以下の手順でできました。
  1. http://example.com/crossdomain.xmlを設置
  2. http://localhost/以下にYUI3が提供するio.swfを置く
  3. YUI3を用いて、http://localhost/foo.htmlを以下のように記述する
1.に関しては、こちらを参考に。
2.に関しては、YUI3のサンプルページにあるので、ダウンロードしておく。
foo.htmlと同一のドメインから参照できるようにしておかないとだめ。

で、3.のコードはこちらを参考にどうぞ。

セキュリティ?なにそれ、うまいの?
って感じですが、やりたいことが実現できたので、よしとす。

はじめてのGoogle App Engine in python on Debian lenny

はじめてGoogle App Engineを、Debian lenny上で、
pythonを使って遊んでみた履歴です。
あまりに簡単すぎてワロタ。
実行したコマンドは、ガチで、以下のみ。
satoshi@debian:~/tmp/google_appengine$ wget http://googleappengine.googlecode.com/files/google_appengine_1.2.7.zip
satoshi@debian:~/tmp/google_appengine$ unzip google_appengine_1.2.7.zip
satoshi@debian:~/tmp/google_appengine$ cd google_appengine/
satoshi@debian:~/tmp/google_appengine$ ./dev_appserver.py -h | less
satoshi@debian:~/tmp/google_appengine$ mkdir tanargle
satoshi@debian:~/tmp/google_appengine$ cd tanargle/
satoshi@debian:~/tmp/google_appengine$ e app.yml
satoshi@debian:~/tmp/google_appengine$ e tanargle.py
satoshi@debian:~/tmp/google_appengine$ cd ..
satoshi@debian:~/tmp/google_appengine$ ./dev_appserver.py tanargle/
satoshi@debian:~/tmp/google_appengine$ ./appcfg.py update tanargle/
Application: tanargle; version: 1.                                                                                                                          
Server: appengine.google.com.
Scanning files on local disk.
Initiating update.
Email: *****@gmail.com ←自分のgoogleアカウント
Password for *****@gmail.com: ←上で入力したアカウントのパスワード
Cloning 1 application file.
Uploading 1 files and blobs.
Uploaded 1 files and blobs
Deploying new version.
Checking if new version is ready to serve.
Will check again in 1 seconds.
Checking if new version is ready to serve.
Will check again in 2 seconds.
Checking if new version is ready to serve.
Closing update: new version is ready to start serving.
Uploading index definitions.
satoshi@debian:~/tmp/google_appengine$
App Engineのアカウントは以前取得してました。
すっかり忘れていましたが。


というわけで、本番公開完了。これからいじり倒す予定なので、↑のアドレスをみても、
違うページになってるかもしれないので、
はじめて記念にスクリーンショットを貼っておきました。

Debian lennyからのGoogle App Engineは、はちゃめちゃ簡単でした。
ほかのlinux系OSでも同じようなもんだと思います。
興味がある人は、是非どうぞ。

参考:第4回 Google App EngineでPythonプログラムを公開してみる

はじめてのYUI3 > YUI3を実際に使ってみた個人的雑感

YUI3をはじめて使っていろいろなサンプルコードを書いてみたが、
実際にプログラムを書いて、使ってみた感想。
  • YUI2よりもすっきりした文法でかけるようになった
    • より直感的な文法
      • Y.one('#id') // 短い表現
      • YUI().use("node",function(Y){}) // メソッドチェーン
    • グローバル変数としてYAHOOを使っていたが、YUIに変更し、内部でYを使用するルールとすることで、実際のコード量が減った
  • YUI2よりも発展性がありそう
    • jqueryが採用していた外部プラグインという考えを取り込んだことにより、jqueryに対して見劣りしなくなった
    • 公式ブログのネタがYUI3の話が多くて参考になる
  • YQLとの連携が強力すぎる
    • YUIとは別軸で存在するYQLとの親和性が高い(要外部ライブラリ)
    • YQLからみても、YQLを簡単に使える術としてのYUI3は存在価値が高い
Yahoo!の本気度がうかがえる出来栄えで、個人的にかなり満足。
YUI2のコードの冗長さに辟易してjqueryに移ろうか、と思っていたが
これはまたYUIに回帰するかもわからんね。

jqueryも含めた最近のjavascriptをいじっていると、
画面の表示はjavascript+CSSのクライアントサイド処理で
100%できるはずなので、サーバサイドで動く表示系処理って
いらないんじゃないか、と。
サーバサイドに必要なのは、CRUD系のAPIだけ。
こうすることで、デザインとの完全分離が実現できる。

デザイナーという職種が、サイトの絵を描いて、
Web Devという職種が、その絵をHTML/CSS/Javascriptで実装し、
エンジニアという職種が、APIを用意しデータを守る、
という業務分担が個人的に理想だなぁ。

最後の問題は、SEO、ということになるので、
クローラーには頑張ってjavascriptを解読してもらいたいもんです。

はじめてのYUI3 > イベント処理

YUI3でイベント処理をするコードを書いてみた。
イベント処理とは、マウス操作(クリック、ダブルクリック、マウスオーバなど)
があったときに、それが起こったタイミングで何かを実行するコードを書くこと。

デモはこちら

コードはこちら。
YUI().use("console", "console-filters", "dump", "node-base", function (Y) {
    new Y.Console({boundingBox: '#mylogconsole',style:"block"}).render();

    function handle(e, name){
        Y.log("event_type="+ e.type+ ", node="+ name, "info");
    }

    function search(e){
        var q = Y.one("#query");
        Y.log("query="+ q.get('value'), "info");
    }

    Y.on('click',    handle, '#foo', {}, "foo");
    Y.on('dblclick', handle, '#foo', {}, "foo");
    Y.on('click',    handle, '#bar', {}, "bar");
    Y.on('dblclick', handle, '#bar', {}, "bar");
    Y.on('click',    search, '#search');
});
参考にしたページはこちら

基本的に、
Y.on(イベント名, コールバック関数, イベント監視対象)
でイベントを登録できる。

なかなか簡潔で直感的な文法でいけてる。

はじめてのYUI3 > YQLと連携してみる

YUI3を使って、YQLと連携してみる。
JSONPと同様にプラグインが存在するので、
そちらをロードして使う。

デモページはこちら

コードは以下。
// yqlとnodeを使う
YUI().use('yql', "node", function(Y) {
    // flickrから"Cat"を含む画像を最大10件検索する。検索結果はrという変数に格納する
    var q1 = new Y.yql('select * from flickr.photos.search where text="Cat" limit 10', function (r){
        var content = "";
        // 画像のURLを作成してcontent変数に文字列として連結
        for(var i=0;i<r.query.count;i++){
            var p = r.query.results.photo[i];
            content += '<img src="http://farm'+p.farm+'.static.flickr.com/'+p.server+'/'+p.id+'_'+p.secret+'_m.jpg"><br>';
        }
        // idがflickrのタグ内にcontent変数の文字列をHTMLとして展開する
        Y.one("#flickr").setContent(content);
    });
});
Flickrから"Cat"という文字を含む画像を最大10件取得するYQL。
YQLの部分を変えれば、任意の結果が取得できる。
フォームも設置して、動的に画像検索できるようにしようとしたが、
ボタンなどのクリックイベントを取得する方法がまだわからなかったので、
とりあえず、べた書きで今回はよしとしました。

これからそこら辺のイベントまわりを調査します。
何か分かったらまた更新します。

はじめてのYahoo! Developer Network(developer.yahoo.com)

Yahoo! JapanのデベロッパーネットワークIDは取得済みだが、
Yahoo! USのデベロッパーIDを取得していなかったので、
取得した時のメモ。英語はつらいよ。
  1. yahoo.comのyahoo IDを取得する。取得済みの人はログインする
  2. Yahoo! Developer Networkから、「Get an App ID」をクリックする
  3. フォームを入力。「 」 を選択。残りの必須項目は適当に入力。"Required access scopes"は何もチェックをいれなくてOK(というか何もチェックできない)
  4. こちらから、「New Project」 でプロジェクト作成
  5. 「Open Application for the Yahoo! Homepage and My Yahoo!」を選択してフォームを入力。
だいぶ日本のデベロッパーネットワークとは勝手が違うようです。
引き続き調査を続けます。

レンタルサーバーでLOCALEの設定をしたメモ

レンタルサーバーで各種日本語設定をしたときの備忘録メモ

まずは、perlから出力されているっぽい警告メッセージについて対応
http://www.rfs.jp/sb/perl/08/01.html

警告メッセージについて

標準インストールでは、Perlを実行するたびに警告が発せられます。
|perl: warning: Setting locale failed.
|perl: warning: Please check that your locale settings:
| LC_ALL = (unset),
| LANG = "ja_JP.ujis"
| are supported and installed on your system.
|perl: warning: Falling back to the standard locale ("C").
この警告は環境変数 PERL_BADLANG を設定することで抑制することができます。ホームディレクトリにある「.cshrc」ファイルを下記を参考にして編集してください。

csh 系

$ setenv PERL_BADLANG 0

sh 系

$ PERL_BADLANG=0; export PERL_BADLANG
もしくはシェルで 「./Configure -U d_setlocale」 してから make しましょう。
次に、svn up/svn statなどを実行したときに出力される警告メッセージを対応。
http://d.hatena.ne.jp/Tnzk/20090209/1234190869
いまいちUnixロケールっていう仕組みがよくわからないので、適当にググって対処法を探す。
tkoshima.net
# localedef -f UTF-8 -i ja_JP ja_JP.utf8
# localedef -f UTF-8 -i ja_JP ja_JP     
# localedef -f EUC-JP -i ja_JP ja_JP.eucjp
設定。
 これでwarningがでなくなった。
よかったよかった。

追記:
dpkg-reconfigure locales はダメでした?
といわれた。
今度機会があったらやってみる。
感謝
http://twitter.com/akitada/statuses/6140523634

はじめてのYUI3 > JSONP APIから情報取得

YUI3を使って、JSONPでAPI通信を行い、ページにその内容を出力してみた。

まず、JSONPの通信をおこなうため、公式サイトを調べたが、
どうにも面倒だな、と困り果てていたところ、
どうやらYUI3には、外部ライブラリ読み込み機能があるらしい。

JSONPの外部ライブラリはすでにあるようなので、それを読み込んで使ってみた。

サンプルはこちら。

コードはサンプルページのHTMLソースをみてもらえば分かる通り
すごいシンプル。

要所だけ解説すると、
    YUI({
        modules: {
            'gallery-jsonp': {
                fullpath: 'http://yui.yahooapis.com/gallery-2009.10.27/build/gallery-jsonp/gallery-jsonp-min.js',
                requires: ['selector-css3'],
                optional: [],
                supersedes: []
            }

        }
    }).
これで外部のライブラリ(JSONP) を読み込んで、使えるようにしている。
読み込んだ上で、"node"もしっかりuseして、
use('gallery-jsonp', "node", function(Y)
あとは、使うだけ。
use('gallery-jsonp', "node", function(Y) {...}
外部ライブラリがいけてる。
公開できる場所も用意されているみたいなので、
おれも公開して有名になろうかな。

Yahoo! がYUI3に本気すぎワロタ

はじめてのYUI3 > 特定の場所に文字を表示する

前回までで、ログ環境も整ったことなので、
ようやくhello worldしてみる。
<p><div id="message"></div></p>
<script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
<script tyle="text/javascript">
YUI().use("node", function(Y) {
    Y.one("#message").setContent("はろーわーるど");
});
</script>
"node"をuseして、id=messageをみつけて(one)、中身に"はろーわーるど"を
セットする(innerHTML="はろーわーるど"、みたいな処理) をしている、と
文法だけで直感的にわかる。

といっても、one()ってのはなかなか珍しい表現だな、と思う。
ID指定なので1つしかみつから無いので、one、ということかな。

サンプルコードはこちら

まだまだ調査してみて、わかったら報告します。

はじめてのYUI3 > ログコンソールにログ出力

前回、ログコンソールをうまく表示出来たので、
ログコンソールにログを出力してみる。
Y.log("ログレベル:info",'info');
Y.log("ログレベル:warn",'warn');
Y.log("ログレベル:error",'error');
これでログを表示できた。"Y"は、前回説明した通り、main関数に
引数で渡ってくるオブジェクト。
log()が引数を2つ持つのはYUI2と同様。
YUI2よりも、ログコンソールに表示されるデザインが
綺麗になっているような気がする。

サンプルはこちら

引き続き調査+サンプルを書いてみます。

追記:
Y.log()とFireBugのconsoleが連動してることに気がついたので追記。
わざわざページにログコンソールを用意しなくても、FireBugがあれば、
コンソールにログが出力されました。

はじめてのYUI3 > とりあえずログコンソールの表示から

YUI3が9/29に正式リリースされたそうで、
遅ればせながらYUI3を使ってみました。

色々日本語の記事やブログがかかれていますが、
やはりYUI3公式サイトを見るのが一番です。
情報も最新ですし。

Javascriptの場合、ログ環境を整えることから
面倒といえば面倒ですが、それも喜びに感じつつ、
やってみようと思います。

結論から言うと、以下のコードでYUI3のログコンソールが動きました。
(YUI3公式サンプルページ)
<div class="yui-skin-sam"><div id="mylogconsole"></div></div>
<script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
<script tyle="text/javascript">
YUI().use("console", "console-filters", "dd-plugin", function (Y) {
    var basic = new Y.Console({
        boundingBox: '#mylogconsole',
        style: 'block' // keeps the Console in the page flow as a block element                                                                         
    }).render();
});
</script>
まず、1行目のdivタグ。classにYUI2同様"yui-skin-sam"を指定して、
コンソールが格好良く表示されるようにします。また、中のdivタグに
任意のID(今回は"mylogconsole")も指定しておきます。

で、次の行がYUI3の真骨頂(か?)
YUI().use("console", "console-filters", "dd-plugin", function (Y) {...})
javascriptっぽく、メソッドチェーンでつなげられてますが、
PHPっぽく書くと、
$yui = new YUI();
$yui->use(array("console", "console-filters", "dd-plugin"));
$yui->do_function();
って感じですかね。useで必要なライブラリをとってきているっぽいです。
で、function(Y)を実行、かな?

ログコンソールを表示させるサンプル

引き続き調査をすすめます。

ZOOM Guitar Effects Console G9.2tt

ZOOM Guitar Effects Console G9.2tt

imagemagickでハイダイナミックレンジ(hdr)画像加工

ハイダイナミックレンジ加工 - Wikipedia

ハイダイナミックレンジ合成HDRとは、写真技法の一種。
風景のダイナミックレンジ(最も明るい部分と最も暗い部分の明暗の比)は広く、しばしば100デシベルを軽く越える。ダイナミックレンジに着目した特殊な撮影素子では100デシベルを超えるレンジを持つものもあるが、フィルムCCDなどの一般的な記録手段のダイナミックレンジは狭く、せいぜい50~70デシベル程度しかない。そのため、現実の風景などの持つ広いダイナミックレンジをそのまま記録することはできない。
ハイダイナミックレンジ合成は、一般的な記録手段を用いてその問題点を解決し風景が持つ広いダイナミックレンジを記録するために開発された画像合成手法である。
PhotoshopでHDR(ハイダイナミックレンジ)な、ものすごい画像をつくる方法
を読んでみて、PhotoShopでできるならImageMagickでもできるでしょう、
ということで調査したところ、ちゃんとやるには、imagemagickのリコンパイルが
必要っぽいのであきらめかけたのですが、

HOWTO: An HDR-like effect w/ ImageMagick

にHDRっぽくみせるコマンドがのっていたので、ためしてみました。
比較のため、Design Walkerから写真をお借りして、実行してみました。

まずはオリジナル↑


次にPhotoShop版↑


最後におれおれ版↑

ちょっと明るくなりすぎてる感があるけど、
まあまあ鮮やかになってるのでは?

もうちょっとコマンドを改良してみます。

SONY ソニー HDR-CX500V デジタルハイビジョン ハンディカム シルバー HDRCX500VS CX500 HDR-CX500

iPhoneに移行するための準備 その2 auから脱出準備

auショップで現在の契約内容などを確認しにいきました。
  1. 年割の有効期限が2009年11月いっぱいまでらしく、3000円取られてしまうようなので、12月に乗り換えた方がよい、とのこと。ちょうど嫁さんも、12月に乗り換えないと6000円取られるそうなので、12月までは待つことにしました。
  2. auポイントは2000ポイントくらい(2年使ったけど、ほとんど使ってなかった、ということ)、嫁さんは6100ポイント。
  3. ポイントは年割解約の違約金にあてられるらしいけど、あと2週間待てばいいので、待つことにした。
  4. とはいえ、auポイントって現金化はほぼできないらしい
  5. やるとしたら、電池パックをポイントで買って、ヤフオクで売る、くらいしかないそうな。
最近ものいりで、お金が飛んでいくなぁ。
iPhone*2, Mac, 本棚, ダイニングテーブル, プリンタ, 掃除機 etc...

お金ほすぃ。

はじめてのYQL > YQL consoleを使ってみる

アメリカYahoo!が提供するサービス「YQL」をはじめて使ってみた。

YQLは「Yahoo! Query Language」の略で、データベースを
操作するときに使うSQLを文字ってつけられた名前(と思われる)

What is YQL?

The Yahoo! Query Language is an expressive SQL-like language that lets you query, filter, and join data across Web services. With YQL, apps run faster with fewer lines of code and a smaller network footprint.
Yahoo! and other websites across the Internet make much of their structured data available to developers, primarily through Web services. To access and query these services, developers traditionally endure the pain of locating the right URLs and documentation to access and query each Web service.
With YQL, developers can access and shape data across the Internet through one simple language, eliminating the need to learn how to call different APIs.

インターネット上にあるWeb APIに対して、
SQLライクなqueryを投げることにより、
使う側が望む形でデータをfilterし、
任意のフォーマット(XML or JSON)でレスポンスを取得するための
サービスである。(おれおれ意訳)

YQLを知らなかった人は、公式サイトの右ナビにある「Try the console」から
YQLをさわってみて動作イメージを掴んでみるのをおすすめします。

「Your YQL Statement」にqueryを入力してTESTボタンを押せば
 VIEWに結果が表示されます。インデントされてみやすいレスポンスが
FORMATTED VIEWに表示され、階層構造が見やすいレスポンスが、
TREE VIEWに表示されます。

レスポンスはXMLとJSON(callback関数名を指定したJSONP)を
選択可能です。

入力するクエリーについては、画面右にあるExample Queriesに
サンプルYQLクエリーがあるので、まずはそこから適当に選んでみてください。
Example Queriesにある、
select * from flickr.photos.search where text="Cat" limit 10
は、Flickrから、説明文やタイトルに"Cat"という文字を含む写真を
取得するYQLクエリーです。
select id from flickr.photos.search where text="Cat" limit 10
とすると、レスポンスにはidしか含まれなくなります。
SQLを少しでも知っている人には理解しやすいと思います。

また、YQLは、XML->JSONPへの変換にも使えます。
例えば、こちらのようなRSSの場合だと、
select * from rss where url = 'http://shopping.yahoo.co.jp/search/rss?p=vaio'
というYQLでJSONPに変換が出来ます。(JSONのラジオボタンを選択)

XMLのみで、JSONPに対応していないXML APIの場合だと、
以下のようなYQLで変換可能です。
select * from xml where url = 'http://search.yahooapis.jp/WebSearchService/V1/webSearch?appid=vbQglqGxg65YDwPxyXTnUvxZxonbuDAc1Y1griEo2dV8piOpR9nvOJmdP6dHiA--&query=vaio'
これで、Yahoo! JapanのWeb検索APIのレスポンスをJSONに変換できます。

XML->JSONの変換ができる、ということは世の中のGETで取得できるAPIを
javascriptから呼び出せる、ということなので、非常に可能性を感じます。

これから、jqueryや、2009/09に発表されたYUI3を使って、
YQLと連携して遊んで見ようと思います。

Mashup Awardに応募しました 続報

先月末に、Mashup Award 2009に応募しましたが、
11月中旬に応募がしめきられ、応募作品の公開がはじまったようです。

作品No.64 毎日更新!猫好きのための猫カレンダー「猫暦 neko goyomi」

応募して以来、応募したことすらすっかり忘れてたのですが、
サイトのアクセス解析を見ると、昨日急に増えていて、
リファラを調査したところ、ほとんどがmashupaward.jp経由でした。

こりゃ単なる宣伝としても使えますな。
なんでもいいから応募しちゃえばいいじゃん、と思った(来年にでも)

作品No.64ということから判断して、
早く応募する方がより若い番号をゲットできて、
一覧でも1ページ目に表示される(と思う)

来年の分を今から準備しようと思うtanarkyであった。

コマンドラインからFinch経由でメッセージを送信する

FinchPidginのCUI版です。
以下の画像を見るのがわかりやすいと思います。
 
ここまでCUI版でやるか、って感じですが、
X-Windowを起動できないレンタルサーバなどで、メッセンジャーをやりたい
という奇特な要求に応えてくれるものです。

installはPidgin同様、aptitudeでinstallできます
$ sudo aptitude install finch
起動するのも簡単で、
$ finch
で起動できます。終了するときは、Ctrl-Cでダイアログがでるので、[OK] を選択して
Enterを押せば終了できます。
CUIで疑似Windowっぽく表示されるので、Windowを選択するには、Alt-N / Alt-Pで
次のWindowにFocusが移動します。

さて、せっかくCUIでメッセンジャーができるので、コマンドラインからメッセージを
送信したいところです。
いろいろ苦戦してやっとできたので、ここにメモっておきます。
  1. finchを起動する前に「dbus-launch screen」でscreenを起動する
  2. 起動したscreen上で、finchを起動する
  3. screenのタブを1つ新規で追加する
  4. 新規追加したタブで、「purple-remote "***"」 と入力することでfinchに命令を送りメッセージを送信する
という手順です。dbus-launch screenすることがポイントです。
こちらで情報を見つけました。

コマンドラインからメッセンジャーに送信するなんて、日本語ではほとんど情報が
見つかりませんでしたが、なんとか達成できました。

今時、YahooやらMSNやらのメッセンジャーにコマンドラインからデータを送るなんて
要求はないんだろうな。。。Twitter万歳

本棚を整理したので、自分の本棚の中身を晒す( ドラゴンボール Dragon Ball )

昨日、本棚を買ったついでに、本棚を整理していたので、
我が家の本棚の一部を晒そうと思う。



まずは、なんといってもドラゴンボール。
映画は見てないがアレな感じだとは耳にするものの、
やはりこの漫画は何度呼んでも面白いですね。

ふとした折に鳥山明の絵が目に飛び込んでくると、
気がついたら漫画を手に取っている自分がいます。

小学校のころ、毎週ジャンプを買って、
「うおー、ゴクウ急げー!」とか友達と毎週話をしてたのを思い出します。
# VS ナッパあたり

ドラゴンボール改 組立式ハイクオリティDXフィギュア Vol.2  【全2種セット(孫悟飯・ピッコロ)】

隣にあるのは「動物のお医者さん」
どちらも嫁さんの持ち物です。

Object-oriented CSS ( WDE 2009 にて )

縁があって、web directors east (WDE) 2009 に参加してきました。

そこで知ったObject-oriented CSSが面白そうだったのでメモ。
作者(の一人?)は女性でした。
Twitterのアカウントがあったので、早速follow

考え方としては、
Blueprint CSS
YUI CSS
と似た考え方っぽいです。

もうちょっと調査して使ってみてから感想をブログに書こうと思います。

ブログパーツ作りました(ReTweetリンク)

TwitterへのReTweetリンクをいちいち作らなくても
URLとHTMLのタイトルタグから自動で作成してくれる
ブログパーツ(?)を作りました。
詳しくはこちら

せっかくなので、この投稿に対して貼ってみます。
↑ここに表示されているアイコン

$(document).ready()だと表示されるまでに時間がかかるけど、
まあ、マナー的にしょうがないかな、と思う次第。
document.writeで書くのは好きじゃないんですよね。。。

引用:JavaScript 体感速度を上げるいくつかの手のメモ
DOMContentLoaded ですら遅いので、HTML 生成時に script 要素を各所に埋めこんで処理を先走りさせる
  • DCL 前に通信を開始できるなら意味があるかもしれない
  • document.write する script (広告とか) があると DCL が遅延するので価値があがる


コマンドラインからPidgin経由でメッセージを送信する

Pidginとは、メッセンジャークローンです。YahooやMSNなど同時に複数アカウントに
接続できて、便利です。




ようやく出来たので、備忘録的にメモ
  1. Pidgin(GUI版)をインストール
  2. Pidginを起動
  3. メッセンジャーのアカウントを設定する
  4. purple-remoteコマンドでローカルに起動しているdaemonに命令を送る
という手順です。これで、
$ purple-remote 'yahoo:goim?account=自分のアカウント&screenname=送信したいアカウント&message=あいうえお'
と入力することで、コマンドラインから送信できます。

purple-remoteは、すでに起動しているPidginに対して、コマンドラインから
命令を通知するためのコマンドっぽいことがようやくわかりました。

なので、あらかじめPidginをX-Windowで起動している必要があります。

ランキング2位獲得!男のメッセンジャーバッグオールスタイル対応 (MC)【matthew】

ランキング2位獲得!男のメッセンジャーバッグオールスタイル対応 (MC)【matthew】

DebianにPidginメッセンジャーをインストール

Debianからメッセンジャーを起動してみたくなったので、
Pidginをインストールしてみた。
$ sudo aptitude install pidgin
無事に起動できました。

Yahoo! Japanにも接続できます。「拡張」タブから、
「Yahoo! Japanに接続する」チェックボックスをONにすればOK

とりあえず、ひさびさにMSNメッセンジャーにも
ログインしてみました。

メッセンジャーを起動した目的は、
CUI(コマンドライン)からメッセージを送信したいので、
これから調査してみます。

いつでもお金をもらえるようにPayPalリンクをつけてみた

プライベートで書いているプログラムを公開して、
ブログのネタにしながら、勉強をしてるわけですが、
さらにお金ももらちゃおうと欲張ってみました。
  1. PayPalのアカウントを作成する(無料のパーソナルアカウントでOK)
  2. ページ上部のナビから「決済サービス」へ移動
  3. PayPal ウェブペイメントスタンダードの詳細を見るリンクをクリック
  4. 単一商品を「今すぐ作成」
  5. 適当にフォームを入力
  6. でてきたHTMLコードをサイトに貼り付け
これで完成です。
商品名を「寄付」として、とりあえず、一口1050円に設定してみました。
いつか誰かに寄付してもらえるように精進したいと思います。

jqueryサンプル集インデックスページ

ブログパーツ作りました(ランキング風商品検索広告パーツ)

ブログパーツを貼って一儲けしたい人に朗報です。

Yahoo! ショッピングの商品検索APIを使って、
ブログパーツを作りました。

ブログパーツの使い方はこちらにまとめたので、
興味がある方は、是非使って見てください。

使った感想等は、このページの右側にある
gmailのアドレスまでお気軽にどうぞ。

親指シフトキーボード

勝間本を読んでいたら、「親指シフト」と連呼していたので
調査してみた。どうやらキーボード入力が早くなるらしい。

親指シフト - Wikipedia

NICOLA仕様準拠のPC用コンパクト親指シフトキーボード。キーボード最下段中央には親指シフトの象徴とも言える左右の親指シフトキーがあり、その下に変換/無変換キーが位置する。
キーボードの形状からして違うとはおもわなんだ。
個人的なポリシーとして、いついかなる環境で仕事しなければ
いけなくなるかわからないので、あまり特殊な環境には
慣れすぎないようにしている。

やっていることといえば、xkeymacsのインストールと、
capslockキーをcntrlキーに入れ替えることくらいです。

特殊なデバイスをつかわずに、キーボード入力を早くするには
どうすればいいのか誰か教えてください。

Jリーグ ナビスコ杯決勝 東京FC VS 川崎フロンターレを国立競技場で観戦

大学時代の先輩、後輩に誘われて、Jリーグ ナビスコ杯決勝を見に行きました。

後輩がチケットを取ってくれたので、定価の2000円で見れました。ラッキー
# 後で聞いたところ、ヤフオクでは、5000円以上だったらしい。

東京FC側で観戦。


応援前の時点で、自分が知っているFC東京の選手は
  • 今野
  • 平山
  • 石川
などでしたが、入場前に超勉強しました。
試合は、ゴールキーパー権田選手の高セーブ+平山のカウンター攻撃も功を奏して
みごと2-0で勝利。


試合後の川崎フロンターレの選手の態度について問題になっていますが、
http://www.tokyo-np.co.jp/article/national/news/CK2009110602000064.html
http://www.tokyo-np.co.jp/article/kanagawa/20091106/CK2009110602000069.html
リーグ戦ではじめてのタイトルのためがんばってほしいと思います。

あと、国立に入場したときに、山崎ナビスコから、OREOやビスコなどのお菓子詰め合わせ
を観客全員にくばってました。自分もいただいておいしくいただきました。

昔からやってる大きいJリーグの大会に協賛し、
この不況の中で観客にこんなサービスをするナビスコは素敵すぎます。

jquery の jtemplatesプラグインでAdsenseのような広告モジュールを作ってみた

jquery の jtemplatesプラグインでAdsenseのような
商品アフィリエイト広告モジュールを作ってみた。

サンプルURL
jtemplates用テンプレートファイル

幅は590pxでやってみた。
IEでのデザイン対応にはまったけど、すぐできた。
jtemplatesかわゆす。

あとは、広告を貼りたいページに、サンプルURLを
iframeで指定するか、サンプルURLの中に書いてある
Javascriptを直接貼り付けるか、どちらでもいけます。

もうちょっとデザイン要素をカスタマイズできるように
パラメータに切り出すのがいいかな。

書評 「優柔決断のすすめ」古田敦也 著

最近読んだ本「優柔決断のすすめ」が面白かったので紹介。

「優柔決断」のすすめ  /古田敦也/著 [本]

「優柔決断」のすすめ /古田敦也/著 [本]


パ・リーグ楽天元監督の野村の本はよく読むが、
古田の本は初めて読んだ気がする。

野村の考えを自分なりに考え、新たに時代に合わせて
拡張していることがわかる本です。

心に響いたのは以下の2つ
「成長したい」「ステップアップしたい」と思っている割には、なかなかこれまでの自分のやり方を変えようとしない。(略)「このやり方でうまくいった」「このやり方が自分には一番あっている」悪い言い方をすれば過去の栄光にしがみついている。
必死で勉強して身につけた技術や知識も、
新しいステージにいくためにどんどん捨てなければ
成長は無いと思っているし、
そうやって捨てつづけることはすごく難しい。
ところが最近、頭で考えた「予測」にばかりにとらわれて、未来の可能性を自ら狭めている若者が増えてる気がしてならないのです。(略)情報過多で頭でっかちになり、経験する大切さを知らないのです。(略)経験する前から結論が出来上がっていて、それが固定観念となっている。だから、「どうせ無理」「やっても意味がない」などと、挑戦したがらないのです。
いるいる、こういう人って思った。
もちろん、自分もそういうところがないわけじゃない。

Aだから、Bとなり、Cはありえない、みたいなロジックを
主張するが、そもそも「Aだから」の時点で間違っていて、
よくよく話を聞いてみると、Cありき、でAやBを主張している。

これって、ちょっとした油断や慢心、保身から
簡単に口から出てしまうんだなー。
何も考えずに実行してしまうのが一番だと思っています。

野球の話が多いですが、わかりやすく説明されているので、
野球に詳しくない人も、読んでみてはいかがでしょうか?

Javascript > Template Engine > Jtemplates を使ってみる

jquery の Template Engine「jTemplates」を使ってみた。

サンプルHTML
テンプレート
データ(JSON形式)

これにより、デザインとロジックの分離ができるが、
外部ドメインに置いてあるtemplateファイルは読み込めないので
注意が必要。

最後にはまったのは、geocitiesが*.jsonという拡張子のファイルを
アップロードできなかったこと。
ファイル名が不正です、とエラーになった。なんでだろ。

Javascript Template Engines 品定め

JavascriptでTemplate Engineっぽいことを使いたくなったので、
既存のライブラリについて、調査したので、備忘録的にメモ。

要求としては以下の通り。
  • 簡単(理解しやすい、直感的な文法)
  • 軽量
  • ちゃんとメンテナンスされている
  • ドキュメントが豊富
  • Jqueryと競合しない
選択肢としては、以下のライブラリを見つけた。
こんな感じでした。
jqueryを使うので、jTemplatesとChain.jsを使ってみようかな、と思ってます。

また何かわかればBlogで報告する予定。

サービスリリース時にやるべき8つのこと

どこかで見たようなタイトルですが、
猫暦(neko goyomi) を作った経験から、自分なりにアレンジしてみました。
  1. そこそこのクオリティまで作る
    作ろうとしているものが技術的に難しいか否かはまったく関係ない。アイデア勝負。何もないとリリースできないので時間を見つけてひたすら作る。ただ、あんまり作りこみすぎてもだめ。気に食わないことがでてきても、そこそこのクオリティ で区切りをつける。
  2. リリース日を決める
    踏ん切りをつけて、気合いをいれる
  3. 知り合いにサービス内容を説明し、リリース日を告知する
    知り合いに自分が作った物を説明する。うざがられるかも、という雑念を振り払っていろいろな人に説明する。意見をもらったらメモっておいて、後で直す。できるだけサービスリリース日は延ばさない。
  4. リリースの準備をする
    1. Google Analyticsなどのアクセス解析の準備
    2. 広告の設置
    3. Titleやh1タグの文言調整(SEO対策)
  5. リリース時に一気に告知する
    1. はてなブックマークやDelicious、Yahoo!ブックマークなどのブックマーク登録
    2. ブログ更新、mixi日記更新
    3. TwitterにPOST
  6. リリース後の効果を見る
    1. どこから人が来たか
    2. どれくらい人が来たか
  7. 打ち上げをする
    次への英気を養うために、打ち上げをします。開発のつらかったことを思い出しつつ楽しく飲み食いします。
  8. 客観的にサイトを見て反省をする
    1. どこが失敗か
    2. どんな意見をもらえたか、その意見は正しいか
    3. 今サイトに何が足りないか
    4. 次は何をするか(どこから改善するか、新しく何を作るべきか)
こんな感じですかね。
書いてみてわかりましたが、技術的な要素ってほとんどないですね。


次もがんばります。

猫暦( neko goyomi )リリース打ち上げ:自宅ですき焼き

猫暦( neko goyomi) をリリースしたので、
本日はすき焼きで打ち上げです。




嫁さんには、タイトル部分に表示してある
猫のアイコンを作ってもらいました。

というわけで自宅でビール+すき焼きで打ち上げパーリー。
自宅で食べるとすき焼きも実に安上がりです。

この前TVでやっていた、「世にも奇妙な物語」で、
伊藤淳史主演『理想のスキヤキ』を見て以来、すき焼きが
無性に食べたくてしょうがなかったので、実においしく
いただきました。

何かをやったあとの「打ち上げ」って大切ですよね。
またがんばろうって気にさせてくれます。

切り落とし 端っこ 不ぞろい(1キロ1kg)すき焼き 訳あり わけあり 訳有り 和牛 牛丼 牛肉 送料無料 牛 黒毛和牛【500g×2パック】
和牛1kg送料無料2980円

Bloggerのテンプレートを変更した

Bloggerのテンプレートがいけてなかったので、
フリーのテンプレート提供サイトから拝借した。

http://btemplates.com/

手順としては以下の通り。
  1. テンプレート編集用のテストBlogを開設
  2. テンプレートを適用する
  3. 見た目を微調整する(CSSなど)
  4. テンプレートを適用したいサイト(メインサイト)のバックアップを取る(データ+テンプレート)
  5. データをテストBlogにインポートして、期待した見た目になるかテストする
  6. OKなら、テストBlogにインポートしたデータを削除する
  7. メインサイトにテンプレートを適用する
  8. モジュールなど削除された場合は復活させる(AdsenseやAnalyticsなど)
  9. テンプレートをバックアップする
念には念を入れて、上記の手順でやるのがよいと思います。

GA 芸術科アートデザインクラス Vol.1(初回限定版)

GA 芸術科アートデザインクラス Vol.1(初回限定版)

東急HANDSで本棚を1つ追加購入したら容量が3倍になりました

東急HANDSで本棚を1つ追加購入したら
容量が3倍になりました。

何を言ってるか、さっぱりわからないと思いますが、
順を追って、ありのまま話そうと思います。
スリムシエラ CVウッドラック 900W 無塗装
今までは↑の本棚を1つ使っていました。
商品詳細はクリックすれば見れます。

この本棚は、天井まで本を積めることができるので、
天井が255cmある我が家では、スペースが有効活用できて、

また、奥行きも適度に薄いので、廊下が狭くならない程度に
本を収納でき、非常に重宝してます。

今の家に引っ越してきて2年になりますが、
要らない本は処分してきたものの、収納できなくなってきたので、
廊下にはまだ隙間があるので、
もう1つ追加注文することに しました。

その追加注文した本棚が、今日届いたので、早速組み立てを
しようと、説明書をみたところ、
天板の幅分だけ間を離して2つの本棚を設置しすると、
その部分も本棚になります、とのこと。
これは嬉しい誤算。

というわけで、設置してみました。


手前の本が詰まってる部分が、今まで持っていた本棚。
奥にあるのが、今回買った本棚の分。
真ん中につけている2枚の天板は、今回買った本棚についてた分を
設置しました。(未設置の天板があと6枚あり)

天井も高く、2つ分の天板の枚数しかないので、ちょっと隙間がありますが、
追加で天板だけも購入できるので、お得に容量を3倍にできました。

本棚は天井にがっちり突っ張ることができます。


上の段の本棚をはめ込む高さを調整することにより、
普通の家なら天井にぴったり取り付けが可能です。
天井に天板で固定できるので、地震のときも倒れる心配はありません。


ちょっと組み立てが大変ですが、
本の収納に悩んでいる人は、是非参考にしてください。

iPhoneに移行するための準備 その1 予備知識勉強

そろそろ本気でiPhoneに乗り換えるための検討をしています。
考えていることは以下の通り
  • iPhoneアプリの開発をして一山当てたい
  • 電車の中でgitなどのドキュメントを読んで勉強したい
  • 維持費はできるだけ安くすませたい(嫁さんも一緒に乗り換えるのもスコープ内)
  • iPod+携帯両方持ち歩く生活から開放されたい
  • etc
まず、2009年7月の時点の情報から勉強開始。
# 後で調べたが、10月も上記の情報はほぼ変わらないっぽい
ipodの容量も結局2Gくらいなので、容量は16Gもあれば十分だとすると、
キャンペーン適用で6万円弱、2台なら12万円かかるようです。

一見すると、キャンペーン適用の方が、どう考えてもお得な気がしますが、通話をよく利用する人は、ホワイトプランの通話料の高さに注意が必要です。 特に、長年他のキャリアを利用している人は長期契約割引があったと思いますが、ホワイトプランには長期割引が無く、通話料が安くなることはありません。実質、他キャリアでの長期割引を捨てることになります。 通話料が安くなる「Wホワイト」という割引もありますが、オレンジプランやブループランなどを利用した方が、維持費が安くなる人もいるかもしれません。
通話はあまりしませんが、ちょっと電話しただけで料金が跳ね上がるのは
避けたいところです。どうしたものか。
無線LAN限定なら、skypeという選択肢もあるようなので、あまり深く
考えすぎないのがよいのか。
iPhone 3GSの場合は、パケット定額フルと、S!ベーシックパックの加入が必須
最近の携帯は、どこもこのような必須加入技でどんどん料金が上乗せ
されていくのが注意ですよね。 結局、最低で5705円のようです。

現在の携帯料金との比較をしてみて考えてみようと思います

おれも、オンラインストレージ SkyDriveを使ってみた

SkyDrive

その容量なんと


25G

ナニコレww
なにこれこわい。

ということで、久々にhotmailにログインして、パスワードを思い出してから、
ブラウザでSkyDriveにアクセスしてみた。
たしかに、25Gの容量があるらしいが、

 

UIがレトロすぎて吹いたw
1ファイル50Mの制限があるのに、これで25Gもアップロードするって
どんだけ暇人なの、って気がするので、早速、
http://www.forest.impress.co.jp/docs/review/20091030_325502.html
SkyDriveExplorer本家
からダウンロードして、インストールしてみた。
特に問題なし。

一つめんどくさいのは、フォルダごとコピーできない点。
結局1ファイルごとに、Drag and Dropしなければいけない。

手がつります。

お手持ちのむふふファイルの退避場所にでもしようと思ったけど、
今のところ断念。

CROSEU2 裸族のお立ち台eSATAプラス

CROSEU2 裸族のお立ち台eSATAプラス

ajax()を使ってJSONP APIと連携する

最近、jqueryにはまりつつあるので、勉強の備忘録がてらブログを更新。

サンプルはこちら
使用したAPIはこちら

AJAX部分よりも、appendまわりで苦戦しました。
var ele = $("#yshpad").append($("<h2/>").html(json.ResultSet[0].Result.ModuleTitle));
for(var i=0;i<json.ResultSet.totalResultsReturned;i++){
  var e = json.ResultSet[0].Result[i];
  var l = $("<a/>").html(e.Title);
  l.attr('href', e.Url);
  ele.append($("<p/>")).append(l);
}
forよりも、eachを使って書きたかったが、
APIのレスポンスが配列型じゃなかったので
for文で書いた。あとで書き直す。

Yahoo!アフィリエイトIDの確認はこちらからできる。

Amazon Kindleについて調査

Twitter経由でAmazon Kindleに興味がわいたので、調査してみました。

Twitterログ
  1. http://twitter.com/MiCHiLU/status/5147883021
  2. http://twitter.com/atusi/status/5147946541 
  3. http://twitter.com/atusi/status/5147946541 
Kindleを最近購入した人のブログ
Wikipedia アマゾン キンドル
購読しているコンテンツのダウンロードは自動的に行われる。2009年8月時点では対応フォントは英語とギリシア文字のみ。
というものすごい硬派な仕様に目をつぶると、
最大の違いはEV-DO(携帯電話網を利用した高速通信)を利用することで、PCを介さずに電子書籍や新聞記事がダウンロードできる点にある。携帯電話会社との契約は不要で、アマゾン・キンドルのサイトとウィキペディアのサイトであれば無料で接続できる(通信料をAmazon.comが負担する)
というところですね。
USBケーブルでコンピュータと接続してファイルの移動が可能だが、HTMLPDFMicrosoft Wordのドキュメントファイルなどのフォーマットを直接読むことはできないため、Mobipocket社が配布する無料ソフトかアマゾン・キンドルのサイトでの変換が必要になる。
これはめんどい。PDFが直接読めると便利なんだけどなぁ。
やはり、今のところiPhoneには遠く及ばない感じですね。。。

猫好きのための猫カレンダー「猫暦(neko goyomi)」をリリースしました

美女暦を見ていて、ふと思いついたので、猫暦を作ってみました。
興味を持った人はブックマークに登録おねがいします。

毎日更新!猫好きのための猫カレンダー「猫暦 ( neko goyomi )」


猫の画像は、Flickrから厳選したかわいい猫画像を使用しています。
気に入った写真があれば、サムネイルをクリックすると拡大するので、
拡大画像をクリックすればFlickrのサイトに遷移できます。
写真の持ち主にコメントを残しておくと、持ち主もうれしいんじゃないかと思います。

猫暦は、月ごと・週ごと・日ごととそれぞれブログパーツとしても使えます。
ブログやその他のサイトに自由に張っていただければ幸いです。

今後気が向いたら機能拡張しようと思うので、意見などご自由にどうぞ。

FC2ホームページの携帯変換モジュールを非表示にする

最近、FC2ホームページに、携帯変換URLモジュールというのが
自動で挿入されるようになった。
QRコード画像が、ホームページの中央上部に表示されるので、
タイトルなどにかぶってしまい、非常にこまる。

FC2から撤退しないといけないか、と考えていたが、
設定で解除できるようなので、手順を備忘録的に書き残します。
  1. FC2ホームページ管理画面にログイン
  2. 画面上部のナビからアカウント情報画面に遷移
  3. 「QRコードの挿入位置」を無効にする
以上で設定完了。設定後QRコードは表示されなくなります。

デフォルトONであの位置に表示されるってかなりいけてない。

オライリーからJquery Cookbookが発売(英語版)

2009年11月26日にオライリーからJquery Cookbookが発売されるようです。



今のところ、英語版のみのようですが、そのうち日本語版もでるのかな?
http://mashupaward.jp/ の締切りが11/4なので、
間に合わないけど、今後のためにも買っておこうかな。

Yahoo! ジオシティーズのサービス(ジオライト)を使ってみる

FC2での無料ホームページスペースをいままで使っていたが、
他の選択肢を調査したので、備忘録的にメモ。

(自分にとって)一番良さそうだと思ったのは、Yahoo!がやっているサービス
Yahoo!ジオシティーズの「ジオプラス」

有料サービス(ジオプラス、ジオライト)説明ページ
ジオシティーズヘルプページ

自分はYahooBB会員なので、
  • 商用利用可能
  • 自動広告挿入なし
  • FTP接続可
というオプションが無料でついてくることを発見。
FC2だと広告が入ってしまうので、
Yahoo!ジオシティーズの方がうれしいサービス内容。

実際に、FTP接続して、データをアップロードしてみると、
FC2のFTPサーバよりもかなり速度が速いことも判明。

これは、思い切って乗り換えちゃおうかしら

JavascriptのDateオブジェクトで日付の比較を行う

Javascriptで日付Aと日付Bで、どっちが未来日付かを判定したい時は
単純に比較演算子で比較できるようで。
var d1 = new Date(2009, 9, 2); // 2009年10月2日
var d2 = new Date(2010, 9, 1); // 2010年10月1日
if(d1 < d2){
    console.log("correct!"); // こちらを通る
}
else{
    console.log("wrong!");
}
当たり前といえば当たり前ですが、せっかく調べたので
備忘録的にBlog投稿

参考:
新Javascript入門 13 Date

jquery の popupwindow プラグインを使ってウィンドウポップアップ

fancyboxは画像拡大が主な目的だが、
別のHTMLページをポップアップさせたい場合には
jqueryプラグインのpopupwindowを使うのが簡単だと思います。

動作サンプルはこちら
<script type="text/javascript" src="./jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="./jquery.popupwindow.js"></script>
必要なスクリプトを読み込んでから、
<a class="popupwindow" href="http://www.blogger.com/popup.html" rel="profile1">popup.htmlをウィンドウポップアップ表示します</a>
リンクタグを埋め込みます。このときrel属性に任意の名前をつけておきます。
<script>
$(document).ready(function() {
  $(".popupwindow").popupwindow({
    profile1: {
      height:300,
      width:400,
      center:1,
      createnew:0
    }
  });
});
</script>
で、popupwindowクラスに適用します。rel属性がprofile1のリンクに対しては、
高さ300px、幅400px、などの条件でポップアップウィンドウが表示されます。

外部サイトのHTMLをポップアップすることもできます。

エグゼラックス ポップアップテント

エグゼラックス ポップアップテント

Net::FTP::Recursiveをつかってみた( Perl CPANモジュール )

FC2はFTPアップロードができるので、ローカルディレクトリの内容を
一括でアップロードするための手段をさがしているときに
CPANモジュールのNet::FTP::Recursiveを見つけたので、使い方メモ。

サンプルコードは以下。

#!/usr/bin/perl

use strict;
use warnings;
use Data::Dumper;

use Net::FTP::Recursive;

my $ftp = Net::FTP::Recursive->new("***ftphostname***", Debug => 0)
    or die "Cannot connect to some.host.name: $@";

$ftp->login('***username***','***password***')
    or die "Cannot login ", $ftp->message;

$ftp->binary
    or die "Cannot change binary mode ", $ftp->message;

$ftp->cwd('***directory***') or die "Cannot change working directory ", $ftp->message;
$ftp->rput() or die "put failed ", $ftp->message;
$ftp->quit;
rput()でローカルのディレクトリ構造を再帰的に
アップロードしてくれるのだが、
ドキュメントとソースを見たところ、
このスクリプトがあるディレクトリ以下を、uploadするようで、
指定したローカルディレクトリ以下をuploadしたいができなかった

#-------------------------------------------------------------#
#
# read_current_directory()
#
# Used by the _rput() method to retrieve the list of local
# files to send to the remote server.  This eliminates the need
# to use "ls" or "dir" to read the local directory and then parse
# the output from those commands.
#
#-------------------------------------------------------------#
sub read_current_directory {
    opendir THISDIR, '.' or die "Couldn't open ", getcwd();
思いっきり「.」を開いてファイルを見てる。
この仕様はいまいちすぎるのではないか、という印象

まちがってたら誰か教えて。

jquery の fancybox プラグインを使って画像ポップアップ

画像拡大ポップアップを使いたかったので、
jquery の fancybox プラグインを使って実装してみた

動作サンプルはこちら

必要なものを読み込んで

<link rel="stylesheet" href="./fancybox/jquery.fancybox.css" media="screen" type="text/css">
   <script type="text/javascript" src="./jquery/jquery-1.3.2.min.js">script>
<script type="text/javascript" src="./jquery/jquery.easing.1.3.js">script>
   <script type="text/javascript" src="./fancybox/jquery.fancybox-1.2.1.js">script>
から、
<a href="http://www.blogger.com/large.jpg"><img src="./small.jpg" /></a>
大きい画像をリンク先に指定し、サムネイルをimgタグで表示させる。
あとは
<script>
$(document).ready(function() {
    $('a').fancybox();
});
</script>
 で、すべてのaタグにfancyboxを適用させている。

外部のHTMLを読み込んでポップアップさせることもできるが、
FC2だと、強制的に表示されるフッタの表示に使うjavascriptと
干渉して、うまく表示出来なかった。
# 単なる画像拡大はできた

ポップアップトースター PT-850(SB) シルバーブラック

ポップアップトースター PT-850(SB) シルバーブラック

家の網戸にカマキリ発見→格闘→勝利

今はアパート(マンション?)の1階に住んでいるので、
多少の庭、というかスペースがありまして、
草が多いしげっています。

ときどき蜘蛛やら蛾が家に入ってきたりするのですが、
殺生をこのまない自分は、その度に外に逃しています。

最近多いのがカマキリで、今日は、網戸とガラス戸の間に
はさまってるやつが1匹いたので、逃すついでに
写真を1枚とっておきました。


かまきり 久保田 正嘉 作 伝統的工芸品 駿河竹千筋細工

逃すときに、子供のころ以来に触ったのですが、お腹がやわらかくて
すごく気持ち悪かったです。ガキのころは全然余裕で触れたんだけどな。
都会って怖い(意味不明)

カマキリ(螳螂、蟷螂)は、昆虫綱カマキリ目(蟷螂目、Mantodea)に分類される昆虫の総称。前脚が状に変化し、他の小動物を捕食する肉食性の昆虫である。
http://ja.wikipedia.org/wiki/%E3%82%AB%E3%83%9E%E3%82%AD%E3%83%AA

カマキリというと、クワガタやカブトムシに並ぶ「かっこいい昆虫」の
称号をもっている昆虫、という印象です。(おれ調べ)
やっぱりこのカマで獲物をとるさまが、かっこいいっておもわせるんだと
思っています。肉食性っていわれてるくらいだし。

いまやすっかり草食系エンジニアですが(うそ)

種類は、写真から推測するにこれだったかも

ハラビロカマキリ Hierodula patellifera Serville, 1839
体長 : オス45 - 65mm、メス52 - 70mm
分布 : 東南アジアに広く分布する。日本では本州以南
通常緑色型で、前翅に白い斑点がある。鎌の前に3から5ぐらいの突起がある。他のカマキリに比べ前胸が短く、腹部は幅が広く見える。樹上性で、林縁の日当たりの良い木の上や開けた草原の樹上に生息している。
 こんな名前はじめてきいた。

はらドーナッツ目黒店の黒糖きなこ+さとうきびでコーヒーブレイク

1週間分のブログを書いて疲れたので、
はらドーナッツ目黒店で買った
黒糖きな粉ドーナツとさとうきびドーナツで
コーヒーブレイク。




ドーナツの横にころがっているのは、北海道旅行のお土産で買った
ROYCEのチョコレートです。

幸せな土曜日でございます。
これからレイトショーで「しんぼる」を見に行く予定。

【ROYCE' ロイズ】  ロイズコレクション缶