『渋谷･ガーディアンエンジェルズ』みたいな響きです。データの平和はオラが守る！（なぜナマった？）

相変わらず無料サービスと聞くとノンケでも構わずほいほい試しちゃう僕なのですが、先日から始まった『データホテルパトロール』を試してみました。

要するに、自分のWEBサービスがうっかりご臨終したのが判る様に、始終監視してくれるサービスです。

単純な生き死に監視なので、同様のアプリをサーバーに突っ込めばいいのですが、監視と言うタスクの性質上、監視対象のセグメントの外からチェックしなくてはいけないため、こういうサービスは有難いです。

さくらサーバーのようにサーバーをレンタルしている場合、サーバーそのものの生死は、さくらさんがチェックしていますが、その中の個々のサービス（僕で言えばMyMinicityブログパーツとか）は当然監視していません。

今までも何度か、MyMinicityブログパーツが死んだことがあって（主に僕のバグ）、そのたび親切な方にご指摘いただいていたのですが、この際なのでデータホテルパトロールの巡回に加えてみました。

まずはユーザー登録が必要です。

登録したメールアドレスに、エラーメッセージが投げられてきます。

すると、登録メールアドレスにメールがきますので、本文中のリンクに飛べば登録完了。

次に監視項目を設定するのですが、監視するプロトコルも

• ICMP
• TCP
• UDP
• URL(http)
• SMTP

こんだけあります。

僕のようにレンタルサーバーで、こじんまりとしたことしかやっていないのであれば、URL監視だけで問題ないと思われます。

要は、指定したURLにリクエストを投げて200以外の場合エラー、つまり「なんか問題があるっぽいよ？」と判断されるわけです。

僕の場合、監視頻度は５分ごと確認で常時監視、異常感知３回でメール、正常動作1回でアラートメール解除でやっています。

5分ごと、はもう少し長くても良いかなって気もしますが。

監視状態を動作中にすることをお忘れなく。

試しに、エラーをわざと出力するようにして試したところ、ちゃんとメールが送られてきました。おお、すごい。

詳細はわからなくても「死んでる」ということを知らせてさえくれれば、その後はこちらで対応できますので、作る側としても安心です。

「お仕事」としてならば、これだけのチェックじゃ足りませんが、お気楽にやっている立場としては充分過ぎるくらいですね。

これで、いつ（サービスが）死んでも安心です。（不吉な！！）

ザ・ガードマン 1970年度版 DVD-BOX(前編) 宇津井健, 中条静夫, 稲葉義男, 神山繁 スバック 2005-06-15 売り上げランキング : 58232 Amazonで詳しく見る by G-Tools

変更点

・記事リストの上部分に余白を多目に取った（ここにオリジナルなロゴを置いたりするといいと思うよ！）
・TOP10と全記事の切り替えをラジオボタンからタブに切り替えた（わかりやすいね！）
・デザインがちょっとiPodTouch風（COOLだね！）
・背景スキン（gjbg.gif）を透過gifにすれば角丸な形にも（可愛いね！）

うーん、これくらいかな？

gjrank2.zip

上に一式入っています。
背景画像のサイズは160*360ピクセル。
gibj.gifのファイル名でswfと同ディレクトリに置いておけば読み込んで背景に表示するので、変更もOKです。

設置方法はgjrank2_ok.htmlの記述中の

http://hoge.com/gj/gjrank2.swf

の部分は先ほどアップロードしたgjrank2.swfのURLを、

http://hoge.com/gj/log/gj.xml

の部分はあなたのGJ！のログファイル中にあるgj.xmlを指定してください。

それ以外はコピぺでOK！

んで、つけるとこんな感じになります。

当然要Flash9です。お気に召しましたらどうぞ。

Adobe Flex Builder Standard 3.0 日本語版 Windows/Macintosh版
	アドビシステムズ 2008-03-14 売り上げランキング : 2426 Amazonで詳しく見る by G-Tools

mytwitterfeed.js

まず上のファイルを同名で保存します。

んで、

横長表示用CSS

こちらも同じく保存。

必要なファイルは以上。

後はサイト中のつぶやきを表示したい場所に

<link href=”mytwitterfeed160x190.css” type=”text/css” rel=”stylesheet” /><script src=”mytwitterfeed.js” type=”text/javascript”></script></p> <div id=”twitter_wrap”> <div class=”newsslidercontent” id=”newsslider”></div> </div> <script src=”http://twitter.com/statuses/user_timeline/yourname.json?callback=viewTwitter&count=10″ type=”text/javascript”></script>

上記の記述を追加してください。

＊yournameの部分をあなたのtwitterでの名前（僕だとhex68)に変更してください。

MyTwitterFeed

eclipseの重さが我慢ならない。テキステエディタに逆戻りしそうだ。
HEX68 said about 3 hours ago

なんだか憂鬱な日が続きます
HEX68 said 3 days ago

カルアミルクは名曲
HEX68 said 6 days ago

つぶやきを表示するスクリプト書いたけどFirefoxだけうまく動いてる。うむう。
HEX68 said 6 days ago

JQueryをインクルードしたはいいが、まったく使わないことに気がついた。
HEX68 said 6 days ago

widthとheightを素で間違えるとか俺終わってるな
HEX68 said 7 days ago

出先でお腹痛くなると凹むよね
HEX68 said 7 days ago

すると、こんな感じになりますよ。

＊ .cssファイルとmytwitterfeed.jsが別のディレクトリに設置している場合、rel=の部分はcssのurlを正確に記述してください。

CSSを変更することで背景色とか文字色、配置をある程度までは変更できるようになっています。

例えば

縦長表示用CSS

こちらを使うと

こんな感じになります。

CSS自体はすごく単純ですので変更は簡単だと思います。

あと、追加する記述の最終行（あなたのTwitterネームを記述した行）のuser_timelineの部分をfriends_timelineと変更すればタイムラインが表示されます。

例：

<script type=”text/javascript” src=”http://twitter.com/statuses/friends_timeline/hex68.json?callback=viewTwitter&count=10″ ></script>

あと、前回と同じく＠マークがつぶやき中に入っている場合、誰かへのメッセージと判断して表示しないようになっています。

ライブラリとかは一切使ってないので、お好きにいじってください。

あー、やっぱjsonp使えるとお気軽にできていいわー。

twitterコミュニケーション・バイブル―気軽に書ける1行ブログ ブラウザインスタントメッセンジャーケータイ対応 菊地 芳枝

けっこうMyMiniCity側のユーザーごとの認識があいまいで、ぴったりと一致した名前であれば問題ないのですが、まったく同じでなくてもMyMiniCity側で近しい名前に丸め込んでしまう場合があります。
（例：ABという街が無いのにAB.myminicity.comにアクセスした時、本来ABが存在しないので街作成画面に飛ぶはずが、ちょっと似ているABCと言う街を表示してしまったりする場合があります。）

パーツをつけた持ち主が意図した街と、名前の似た違う街に紐付けられてしまったりしまうことが実際に起こってしまっていた為に、ここの判定をMyMiniCity側に任せずに、こちらでも判定を行うように変更をかけました。
おそらくそのタイミングで、厳密に街の名前（url中のcitynameとXML中のname)を比較をしたことで、はじかれてしまっているのが原因と思われます。

ブログにいただいたコメントを引用し、返答させていただきます。

電算担当者様：
>都市名がdensan cityでurlがdensan
知らなかったのですが、都市名の間にスペースがあると、スペースの前まで（電算担当者様の場合densan）がurlとして使用されるみたいですね。ご指摘どおりurlとcitynameの差異に引っかかりました。
ですので、ここの判定方法を若干変更いたしました。
おそらく今までどおりで大丈夫と思います。

雉の素様：
都市名fagiano-fcにあります－（ハイフン）の場合、urlはfagiano-fcとハイフンいりなのですが、XMLのnameはFAGiANO FCとハイフン無しとなるようです。
こちらも同様に変更を加えました。

ご指摘いただいた２名様の都市に関しては、ブログパーツ上で情報が表示できたことをご報告いたします。

＊１　確認した際の都市名（url中のcityname=の部分）は
電算担当者様→densan
雉の素様→fagiano-fc
です。

＊２　電算担当者様はGoogleガジェット版をご使用との事でしたので、もしかしたら変更が反映されるのに若干お時間がかかる可能性がございます。
Google側がデータをキャッシュしている為なのですが、その場合しばらくたてば反映されると思われます。

ご迷惑をおかけして大変申し訳ありませんでした。
アプリケーション改善の為とご容赦いただけますと幸いです。

他にも問題のあった方がいらっしゃいましたら、遠慮なくご連絡いただければと思います。

追記：
もし都市名にスペースを入れている方がいらっしゃいましたら、ブログパーツのcitynameの記述はMyMiniCityのURLの表記にしたがってください。
たとえば
HEX 68（間にスペース入り）
という街の場合、ブログパーツ側にはMyMinicityのアドレスは、http://hex.myminicity.comになると思われます。

MyMiniCityの画面中の立て看板に書いてある街の名前ではなく、アドレスバーのhttp://と.myminicity.comの間の部分を記述してください。

HEX68

 その間何人かの方から暖かい拍手を頂戴いたしました。この場を借りてお礼申し上げます。
 Ｃｈｅｅｒｓのエントリーそのものに拍手をいただいたりして、もしかして期待してもらえてる？なんて舞い上がったりして、その高まったモチベーションでこんなものも作ったりしてました。

このページの左サイドバーに拍手数ランキングってのがあると思いますけど、要するに人気記事ランキングですね。これを作りました。

ウェブＣｈｅｅｒｓにいただいた拍手をカウント、ソートして、それを一覧表示しています。

ここまでPHPで実装して、大きな問題もないようなのでそろそろ公開、なんて考えていたんですけど、全体を見直してすこし気になったことがあって公開をためらっています。それは、

あまりにも設置条件が厳しいこと。それが理由です。

誰かがこの「ウェブCheers」スクリプトを使用したいと考えた場合の必要な環境、条件を以下に記述します。

1. サーバーがPHP4を使用可能であること
2. そのPHPがGDライブラリを組み込んでいること（拍手数とボタン画像の合成に使用）
3. ページを閲覧している人がJavascriptを有効にしていること
4. 設置方法が結構複雑
5. MT以外は使用できるか不明（wordpressは可、要するにテンプレートをいじれるかどうか）

これが嫁探しなら、あんた一生独身だよってくらいの条件の多さ。なんぼだけ間口狭いんだよって話。 

まあMTとかwordpressでブログを書いている人（＝５はクリア）の多くはレンタルサーバーだと思うので、その場合１もクリアしていると思うんだけど、２はどうだろう。GDを組み込んでいないサーバーって結構あると思う。（ロリポップは大丈夫でした）
３はユーザーの好みだからある意味しょうがないけど、ボタンを含めてまるで表示されないってのはうーん。

それもこれも拍手数の動的書き換えにajaxを使ってるからなんだけど、せめて拍手ボタンくらいは表示させたほうが・・・って気もしている。
４については１と５をクリアしている人なら多分大丈夫と思うけど、それにしてももっと簡便にならないものかな・・・ユーザーに強いる負担は低いほうがいいに決まっているんだし。 

一番ユーザーに負担をかけない方法としては、こっちのサーバーで全ての処理（拍手の統計、メッセージの管理）を行って、ユーザーはそれを呼び出して描画するだけって形。

一般的なレンタルですね。MyMiniCityブログパーツなんかもそのやり方です。
ならウェブCheersもそうしたらいいじゃん、とも思ったけれども、このアプリって意外にサーバー負荷が高い。

MyMiniCityブログパーツは基本的には１ブログに対して1個だけ設置していると思うけど、拍手の場合は各エントリーごとに設置する。

トップページに記事が15個表示されていれば、ボタンも１５個。この場合、トップページで１５回サーバー側で描画する必要がでてくるわけだ。

しかもGDライブラリ使用。基本的に描画系ライブラリは負荷が高い。
しかもMyMiniCityブログパーツは描画時に一度呼ばれた後は画面をrefreshしない限りは再度呼ばれることは無い。

それに対して拍手はクリックが発生する（拍手をもらう）度にリクエストが発生する。
これが一人二人ならば問題ないけれど、数十人数百人（数百は無いか）が使用した場合を考えると、ちょっと恐ろしい。

もしそのユーザーたちがことごとくすンばらしい記事をかきあげて、それを見た何千何万の人たちが「ブラボー」「ハラショー」「トレビアン」と拍手喝采雨あられ、鬼のクリック連打を行ったとしたら・・・

場合によっては僕がロリポップからお叱りを受けることにもなりかねない。今のサーバーを追い出されてサーバー難民になったりなんかした日には目もあてられない。

それにユーザーがもらったコメントをこちらで管理するとなると、データを抱え込むストレージのサイズの問題、パスワード管理などの問題がでてくる。できればそのあたりは避けたいのが本音だ。

そこでタイトルなのだが、昔買ったFlashの本を引っ張り出してきた。

PHPの場合描画リクエストがあるごとに動的にページを生成するため負荷が高い。だからFlashである程度作りこんだモノを作ってそれをユーザーに投げるようにすればサーバー負荷は減るんでは？というのが僕の考えだ。また、ランキングをブログパーツ化した場合、ビジュアル的にかっこいいものもできるという副次的効果もある。

とにかくユーザーに対する負担をどこまで減らせるか、いろいろトライしてみたいと思う。 
が、Flashは僕にとって鬼門だ。
正直にいうと、過去に何度か挑戦しているのだが、その度に挫折している。

普通のプログラム言語なら、初めて触るものでも今までの経験から「あーなるほど、ここはあの言語のあれと似てるな」なんて推測ができるんだけど、Flashは全然理解できない。
そもそもFlashはプログラミングではなくオーサリングなのだから（ActionScriptはプログラムになるのか？）、思想もなにも全然違う。演歌とデスメタルくらい違う。
 そもそも、Flashというとプログラマーからみれば完全に「あっち側」の技術だ。

デザイナーとか、広尾のマンションに住んでます（笑）とか、とにかくスマートでモテそうなイメージ（偏見）。
Flash使いな方って、中にはプログラムができる方もいるけど軸足はWeb側って人にしか会ったことが無くて、逆にteratermでtracerouteして経路上のボトルネックを見つけてはニヤニヤしているような人種でFlashの素養がある人って、僕を含めて聞いたことが無い。つまり両者は完全に畑違いな分野なのだ。

そんな僕が、また一からFlashを勉強してみようと考えている。

今度は挫折しないでいけるだろうか。はたまた、再び投げ出してしまうのだろうか。
３５から学ぶＦｌａｓｈ。結果は当ブログ、WebCheersの公開を持ってお知らせしたいと思う。
請うご期待。

なんだか偏頭痛で右側の頭が割れそうなんですけど、自サイトを見るとなんだかいつもよりアクセス数が多い。
なんじゃ？と思ってアクセス解析のログをみてみたんですけど、総アクセスの半分以上が何故か台湾から。

えー、と？

アクセスログを追ってみると、台湾の方が掲示板？のようなところでMyMiniCityブログパーツを紹介してくださっているようで、そこからのお客様のよう。

無性に嬉しくて、思わずその方のMyMiniCityの掲示板に謝辞を書き込んじゃった。
正しいのかどうかもよくわからないけど、エキサイト翻訳で訳した中国語で。

いや、本当にすごいよね、インターネッツ。
一人で、テキストエディタでちょこちょこ作ったアプリに対して、顔も知らない、使う言語も違う誰かが反応してくれたりするんだからさ。

業務ではどちらかと言えば直接ユーザーと接しない、サーバー構築だとか組み込みアプリだとか内部ツールだとかを受け持つことが多いから、ダイレクトに人の意見が伝わってくるのはものすごく刺激的で、たまらなく面白い。
悪いことを書かれるとかなり凹むけどね。まあ、それはそれで。

ウェブ２．０は砂場遊びの楽しさ

 Web2.0なんて死語を今更持ち出すのは酷くこっ恥ずかしいのだけれど、Tim O’reillyのいう「ユーザーの手による情報の自由な整理 」とはとどのつまり「ツッコミの持つ力」だと考えている。
共創的に作り上げるメディアのいいところは、乱暴に言ってしまえばその性質同様「未完成」が許容されるある種の「優しさ」にある気がしている。僕はここにいていいんだ、みたいな。

僕は砂場にお山を作った。砂が積もっただけの小さな山。

「もっと山を高くしたらおもしろいよ」
誰かが山に、砂を盛る。

「トンネルを開けたら電車ごっこができるよ」
誰かが山に、穴を掘る。

「壊したほうが面白いよ」
誰かが山を、蹴飛ばして壊す。

「この道具を使えば、もっと楽に作れるよ」
残った砂粒で、誰かが山を、もう一度作る。

「この砂を使えば、もっと丈夫な山になるよ」

「こっちの山とつなげて大きくしようよ」

最初に作ったのは小さなお山。
それ単体では、恥ずかしいくらいに小さくて低い山。
最終的に高い山になるのか、見る影もなく砂粒に戻ってしまうのかはわからないけれど、誰かと一緒にお山を作りあげる、その面白さを与えられたら、僕はしてやったりな気分になれるんだな。

できるならば僕は、これからも「山」を作っていきたい。
誰かが楽しんでくれることを願って、少しでも高い山を作れるように努力をしながら。少しでも遊びがいのある山を想像しながら。
砂場遊びをもっと面白くするいたずらを、これからも考えていければいいなと思う。

さてタイトル。
もう半分はなにでできているんだろう。
思いつきでつけたタイトルに意味なんて無いさ。けど、なにか面白いものでできていたらいいな。

許可されていない、というか、javascriptが使用できない、iframeも使用できない、Objectも駄目。なるほど、こりゃ無理だわ。完全無欠の鎖国状態。

で、調べているうちに

 ブログパーツ貼り付けタグのまとめ＋Googleガジェット＠はてな(ウノウラボ)

こちらの記事にたどり着いた。
まずはてなダイアリーも結構制限がきついと言うことを初めて知った。iframeって使えないんだ。
むーじゃあはてなも駄目なのかーと落胆しながら記事を読み進めていると、どうやらGoogleガジェット化してやれば設置できるという記述に行き着いた。まじっすか。

GoogleガジェットといえばGoogleさんが提供している、iGoogleというサービス上で使用するちっちゃいソフト群です。
iGoogleってのがブラウザ上にある個人ごとのデスクトップとして、そこにいろいろな機能を持ったガジェットをペタペタ貼り付けて使うものなんですが、このガジェットを外部のブログであるはてななんかにブログパーツみたいに使用できると言う。

前から興味があったんだけど、時間が無くてGoogleガジェットは触ったことが無かったんだけど、ちょうどいい機会だから、ウノウさんの記事と、こちらのサイト（WebOS Goodies）を見ながら小一時間ほどでできました。

え、なにこの簡単さ。目からうろこ。Googleガジェットは革命か、黒船かってくらいに簡単。

簡単に説明すれば、既存のMyMiniCityブログパーツをGoogleガジェットのガワの中で読み込んで表示させているだけです。中身のブログパーツには一切手を加えていません。

試しにはてなダイアリーを作ってはっつけてみました。こちら→はてなダイアリー

現時点ではパーツの横に枠が出てしまってちょっとかっこ悪いんですけど、とりあえずはてなでもパーツの表示はできました（この枠どうやって消すの・・・？わかる方教えて・・・）

設置方法は
http://hmlab.info/minor/public_html/mmc/

こちらに書いてあります。
パラメーターの中のcitynameを引数として渡すことで動的に表示する街を変更しています。

で、Googleガジェットですので、そのままiGoogleにも使用できます。

こちらはiGoogle上から「コンテンツを追加」→「フィードやガジェットを追加」を選択肢、URLを渡すところで僕が作ったガジェットのxmlを指定します。

http://mproblem.googlepages.com/myminicitygadgets.xml

です。

そうするとデスクトップにガジェットが追加されますので、右上の▽を押し、設定からあなたの街の名前を入力すれば機能するようになります。

Googleガジェットは、Googleデスクトップガジェットとしても使用できるということも聞いていたのでそちらも試してみました。

Googleデスクトップのガジェット追加画面から上記URLを指定して・・・

できた！
ゴミ箱の横にブログパーツがくっ付いてるのがわかると思います。うわー、なんか変な感じだ。

正直、ここまで簡単にGoogleガジェット化できるとは思わなかったので驚きです。
中身は今までのWebサービスでも、ガワだけGoogleガジェット化してやればここまで利用範囲が広がるってのは本当に画期的。
うわー、作りたいものがいっぱいでオラ、ワクワクしてきたぞ！

MyMiniCityブログパーツのページ

設置方法や機能説明などこちらにまとめてありますので、こちらを参照してください。

こちらのブログパーツに、いくつか機能追加してみました。

リンク先には既に説明を書いていますが、「街の状態によってのリンク先自動変更」を実装しました。

リンク先自動選択の優先度は

汚染＞犯罪＞輸送＞失業＞人口

で、値に異常（失業率が高いなど）があった場合（値の文字色が赤くなります）、より上位のものを優先して対応するようなURLを自動生成します。

家アイコンをクリックで自動的にそこに飛びます。

あと、意外に要望が多かったので、リンク先に飛んだときは別ウインドウがひらくように変更しました。

今回の変更点～

• 背景スキンをクリスマスから変更
• 時間によって壁紙が変化（朝、昼、夕、夜）
• 「お散歩」リスト登録自動化

背景の時間連動ですが、朝昼夕晩で若干背景が変化します。まあ、ぶっちゃけあまり気がつかないと思います（笑）

「お散歩」リスト登録自動化ですが、いままで僕が手作業でやっていた作業が自動になりました。

ご自分のブログとかサイトのHTMLにパーツを貼り付けて、自分の街の情報を取得すれば自動的に「お散歩リスト」に加わります。

ですので、このブログパーツをつければ、顔も知らないどこかの誰かが、あなたの街に遊びに来てくれるかもしれません。街の発展のお役に立てればよいのですが。

万が一、実在しない街の名前を呼んでしまっても、スクリプト側で街の存在の有無を確認に行くようしていますので、間違えてもリストにも追加されませんです。ご安心を。

ではよいMyMiniCityライフを。