2008年11月03日

●Spreadsheetsのデータを簡単にJavaScriptで読み込む

Google Docsのスプレッドシートにあるデータを簡単に読み込むJavaScriptを作りました。
これで、サーバサイドのプログラムをまったく使わずにJavaScirptだけでデータなりを読み込んで表示することが簡単になります。
あと、Spreadsheets自体はExcelなど多様のフォーマットに対応してますので、あまりWebの知識がない人でも簡単にデータを保持してサイトで表示することができるようになります。

読み込み専用
http://wakasa.org/project/jquery/gspreadsheets.js

Postも対応
http://wakasa.org/project/jquery/jquery.gspreadsheets.js
※非同期通信部分でjQueryを利用しているので、jQueryのプラグインになります

使い方は以下の感じで。


- 取得 -

※jQuery版の例なので、単体版の場合は$.を削除してください。

$.gspreadsheets.load("[Spreadsheetsのkey]","[シート名]",[読み込んだデータを返す時のfunction]);

まずSpreadsheetsの設定で右上にある「共有」から「ウェブページとして公開」を選んで公開します。
$.gspreadsheets.load("pUueo43_joGIIz68KkRF-Tw","default",getDataEnd);

とした場合に
http://spreadsheets.google.com/ccc?key=pUueo43_joGIIz68KkRF-Tw&hl=ja
のdefault指定したシートを読み込んで、getDataEndに返します。
シート名は、通常1番目がdefaultになりますが公開設定によりいろいろかわります。
シート番号に関しては1シート目は[od6]、2シート目は[od7]....というルールで名前がつくようです。どうして6スタートなのかは不明です。
このシート番号は「ウェブページとして公開」の「公開の詳細設定」で見る事ができます。
返ってくる内容は1列目に名前を付けたものがkeyになってるオブジェクトが配列になって返ってきます。
[
{"タイムスタンプ":"","name":"","lat":"","lng":"","address":"","explanation":""},
{"タイムスタンプ":"","name":"","lat":"","lng":"","address":"","explanation":""}
]



- 送信 -

$.gspreadsheets.post("[Spreadsheetsのkey]",[送信データ],[送信データとの関連づけ],[送信後に呼び出されるfunction]);
これに関しては少々トリッキーな方法で、Spreadsheetsをまずフォーム化します。 Spreadsheetsの上部に「フォーム」とあるので、それでアンケートフォームを作成します。 で、フォームが完成後、フォームのソースを見て、[entry.0.single]などの文字列を探して、それと1行目の名前の関連付けをメモします。 http://spreadsheets.google.com/viewform?key=pUueo43_joGIIz68KkRF-Tw&hl=ja だと下記のようになります。
var sendData={}; var typeData = { name:"entry.0.single", lat:"entry.1.single", lng:"entry.2.single", address:"entry.3.single", explanation:"entry.4.single" }; $('input[type="text"]').each(function(){ sendData[this.name] = $(this).val(); }); $.gspreadsheets.post(seetid,sendData,typeData,sendDataEnd);

こっちはトリッキーすぎて使い勝手が激しく悪いのであまり使われないと思いますが、一応作っておきました。

2008年10月27日

●昼飯抽選サイト作ってみました

Googleさんのシステム完全依存ですが、昼飯抽選サイトを作りました。
昼飯を毎度ワンパターンだなーとか思いつつも、結局同じ店に行くあなたへ送るサイトです。

デザインとかアレな感じなのと、緯度経度とれないやつはアラートというショボショボでいじらないといけないですが・・。

http://wakasa.org/project/hirumeshi/
※気に入らない時は上にこっそり、かつ大胆にある次へをクリック

とりあえず、データはGoogleDocsから拾ってきています。
デフォルトは私の勤務先である五反田方面で、データは同僚と更新してますがしょぼいです・・。
まだまだ登録が甘いのでそこはご了承を。
http://spreadsheets.google.com/ccc?key=pUueo43_joGIIz68KkRF-Tw&hl=ja

これだけだとショボなのですが、シートの切り替えが可能にしています。
たとえば、適当ですが立ち食いそばだけチョイスしたシートを作り、それだけを抽選することが可能です。
http://wakasa.org/project/hirumeshi/?pUueo43_joGLlO8N5y-1NMw

なので、自分だけのシート作って自分だけのデータで抽選できます。
データ多すぎて結局ヒットしないとか、カテゴリ絞りたいとかならシート新しく作れ!という男らしい仕様です。絞り込みとか、前に選んだやつ出してくれなんかさせません。(逆切れ)

で、下記に方法書いときます。


  1. シートを[name,lat,lng,address,explanation]で作る。
    ※たぶんnameだけあればいけるはず

  2. 共有をクリックする

  3. ウェブページとして公開

  4. ドキュメントを公開をクリック
    ※変更が加えられると自動的に再公開するにチェックいれると自動公開なので便利

  5. シートのIDがURLにあるので、key=後をコピー

  6. http://wakasa.org/project/hirumeshi/?[ここにkey後を張る]にアクセス

とりあえずまだまだイケテないですが、もうちょっと改善します。
問題があったら教えてくださいませ。

p.s.
本当はフロントからも追加登録できるようになっているんですが、FFでエラーしてしまうので、とりあえず保留状態。

続きを読む "昼飯抽選サイト作ってみました"

2008年06月15日

●jQueryでざわ…を簡単に表示できるようにしました。

福本伸行先生著書の「賭博黙示録カイジ」や「アカギ」などでおなじみの "ざわ…" を表示するjQueryのプラグインを作りました。

http://wakasa.org/project/jquery/zawa/

ざわ…っとなるようなサイトを作った時にぜひご利用ください。

2008年06月11日

●jQueryでコナミコマンドを実装

jQueryでコナミコマンドを簡単に実装できるプラグインを作りました。

http://wakasa.org/project/jquery/konamicmd/

やばい!!明日までに裏コマンドをサイトに実装しないといけない!とかそういう時にぜひ!

2008年01月10日

●AIRのSQLiteでcount取ったりでちょっとはまる。

AIRでSQLiteを使っていたのですが、微妙にはまったところが。
SQLを実行した結果がオブジェクトになって帰ってくるのですが、この中身がどう入ってるのかわからなくなります。
たとえば

SELECT count(*) FROM database;

と実行すれば普通にカウントしてくれるのですが、これが帰ってくるオブジェクト内には
rsArray[0]["count(*)"]

※rsArrayはSQLResultのdataの中身
というような形の名前で保持されて帰ってきます。
なんとなくいただけないので、
SELECT count(*) AS count FROM database;

とか名前をきちんとつけてあげて
rsArray[0].count

というように取得するのが正しいのかなと。
なんとなく配列で帰ってくるような取得方法もほしかったなぁ・・。
あと、返ってくる配列は中身が無かった場合、0個の配列ではなくnullになります。
なのできちんとnull判定が必要となります。
Hibernate的なくるむものを自作してきちんと管理しとかないと思わぬところでnullで落ちたりしそうです。

あと、ローカルにDBファイルが置かれるので、思わぬところでデータの構造が違ったりすることを考えておかないとSQLが実行できないとアラートが出てしまいます。
try catchできっちり実行できなかった場合の処理も書かないとあとで痛い目見そうです。
でも毎回書き込みの度に型チェックするのもばからしいし・・。ここんとこ効率よく解決する必要がありますね。
割り切ってしまえばいいですが。

ちなみにSQLiteの情報をGUIで見るツールを。

SQLite Database Browser
http://sqlitebrowser.sourceforge.net/
ただし、これで開いてるとAIRからアクセスした時にLockされてるから書き込めないといわれるので1回づつ閉じないといけないという問題が・・。

SQLite ControlCenter
http://www.takke.jp/soft/sqliteccj.html
こっちで開いててもLockされない気がします。
ただ、ちょこちょこ叩いてると不意に落ちることが。

2008年01月08日

●Maven2のarchetypeで独自プロジェクトを作ってjettyで起動させてみる

Maven2でarchetypeの独自プロジェクトを作ってみました。
やりたい事は、archetype:createで独自のプロジェクトを自動で作って、jettyで起動させるというところまでです。
サンプル
http://wakasa.org/uploads/sample/mvnarchetypesample.zip
1で作ったものをそのままいれてるので、いらないソースがあったりしますがそれは大目に見てください。
これらはあくまでサンプルで作ったので何か問題が発生したりするかもしれませんので、それは自己責任でお願いします。

1.基本のテンプレートを作る

mvn archetype:create -DgroupId=org.wakasa -DartifactId=testsample -Dversion=0.1 -DarchetypeArtifactId=maven-archetype-archetype

このコマンドをたたくと、今いるフォルダにtestsampleというフォルダができてそこに基本のテンプレートができます。

※参考
[Maven2 Plugin]Archetype -- 独自の archetype を作成する 其ノ壱
http://d.hatena.ne.jp/waman/20071107/1194388042

2.インストールされるプログラムを配置する

src/main/resources/archetype-resources/
配下がインストールされるデータになるので、ここを変更する。 pom.xmlなどもそのまま入る。 ただし、ここ以下はテンプレートのファイル扱いなので${artifactId}など書くと、6のアプリケーション作成時で設定した値が入る。 これはJavaのプログラムファイルにも適応されるので、例えばパッケージ名が package org.wakasa.test; というものにしたい場合は package ${packageName}.test; と書き換える必要があります。 こうしないと、5で指定したパッケージに展開された時にフォルダ階層との不整合が発生します。 なので、archetype-resources以下で動作するものを作って、テキストエディタなどで一気に置換するという方法が良いと思います。

3.インストールするファイルの設定をする

src/main/resources/META-INF/maven/archetype.xml
のファイルを編集します。 sources - ソースの一覧 resources - リソースの一覧 testSources - テスト用ソースの一覧 testResources - テストで使用するリソースの一覧 siteResources - 実行時のsiteで使われるリソースの一覧

で、2で書いた通りに各ファイルはあくまでテンプレートの扱いのため、画像などを一緒に登録しようとすると無理やり開いて置き換えようとするのでそれを防止させるのには
filtered="false"
をつけると、スキップしてくれます。

※参考
[Maven2 Plugin]Archetype -- 独自の archetype を作成する 其ノ弐
http://d.hatena.ne.jp/waman/20071107/1194396903

4.jettyのプラグインが動くようにする

入れたあとにjettyを起動するように設定を追加しておきたいので

src/main/resources/archetype-resources/pom.xml

を開いてbuild部分にjettyのプラグインを登録しておきます。

%lt;plugins%gt;
 %lt;plugin%gt;
  %lt;groupId%gt;org.mortbay.jetty%lt;/groupId%gt;
  %lt;artifactId%gt;maven-jetty-plugin%lt;/artifactId%gt;
 %lt;/plugin%gt;
%lt;/plugins%gt;

5.インストールする

作ってるものの直下で下記のコマンドを叩くとローカルにインストールされます。

mvn install

6.アプリケーションを落としてjettyで実行してブラウザで見る

インストールしたいフォルダに移動して

mvn archetype:create -DgroupId=org.wakasa.ttttest -DartifactId=tttest -DarchetypeGroupId=org.wakasa -DarchetypeArtifactId=testsample -DarchetypeVersion=0.1

とコマンドを叩くと、直下にttttestというフォルダを作ってそこに入れてくれる。
完了したらそのフォルダに移動して
mvn jetty:run
とコマンドで叩くと必要なものをMavenが落としてきてjettyが立ち上がってくる。
それからブラウザで下記のURLにアクセスすると無事に見れる・・はず。
http://localhost:8080/tttest/

2007年08月21日

●FlashPlayerがH.264 + AACサポート

どうやらFlashPlayerのベータでH.264とAACがサポートされたようです。

http://aralbalkan.com/1012
http://labs.adobe.com/technologies/flashplayer9/
※まだ公開されてないようです。(追記)

これによって現状のflv,mp3等のメディアファイルに追加してMP4, M4V, M4A, MOV, Mp4v, 3gp, 3g2などが対応となりました。
動画エンコード系の人たちにとっては1ファイルで複数配信できる利点が出ますね。
ただ、どれくらい負荷が出たりとか手放しで喜べない部分も多々あるとは思いますが、いろいろ楽しいことにはなりそうです。
現状、Flashで動画配信するにはflvにエンコードしなければならないものが、H.264ファイルをアップロードしたら配信されることになるのですから。
極端に言えばAVCHDで撮影された動画をそのままアップロードしてみたいな事もできるってことです。ファイルにきちんと落とせればっていう条件付きですが。
ただ、ものによってはH.264の団体による課金とかが気になってきますが・・。
YouTubeもAppleTVのためだけにH.264対応したわけじゃなかったのですね。

続きを読む "FlashPlayerがH.264 + AACサポート"