雨のち晴れ

ダイビングとITな食生活 – kote2の超個人的な日記

さて、ぼちぼちAirもやりますか

米アドビ、RIA実行環境「AIR」の正式版を公開:ITpro
http://itpro.nikkeibp.co.jp/article/NEWS/20080226/294751/

ベータ版がいつまで続くのか分からなくて正直バージョンアップされるたびに動かなくなるアプリにうんざりだったのでほったらかしてたAirですが、ようやく正式版が公開になったのでボチボチ何か作っていこうと思う。

なかなか技術文献がまとまってなかったのですが、FlashBlogのLeeさんのまとめPDF(プレゼン資料)が激しく参考になるので熟読熟読。
http://theflashblog.com/files/AIRConditioning.pdf

The Flash Blog
http://theflashblog.com/

で、相変わらずFlexでの開発じゃなくてFlashを使うつもりですが。ま、どっちでもいいんだけど。慣れてるんで。

WebクリエイティブのためのDOM Scripting

WebクリエイティブのためのDOM Scripting(中村享介 著)
WebクリエイティブのためのDOM Scripting (Web Designing Books)

先日買った本ですが、ザックリ読んだので感想を書こうと思う。

Javascriptの解説書ではなくhtmlコーディングの解説書。Ajaxとかを使ったダイナミックなページが増え始めてJavascriptをちょっと勉強しなおそうかと思ったんですがJavascriptよりもhtmlの組み方が少し変わってきているようなので、先にこちらを学んどこうと思い購入。

Document Object Modelというのはhtmlのツリー構造を意識したコーディング方法なんですが、最近のJavascriptの解説書であればDomScriptingの事は書いてあるけど、この本の場合はそこだけを重点的に解説していた。
以前までのやり方と、現在のやり方を比較してるので理解が深まりとても分かりやすかった。

全ページカラーだし時折あるイラストイメージが記憶に残る書かれ方でいいっすね。オライリーの本とかオレ苦手だしね・・・。

後半ではprotoypeとかdojoとかjQueryなどのフレームワークを使用したサンプルもあるけど、こんなのもあるよー程度の解説。
サンプルの数は少ないけど、これから本格的に勉強するはじめの一歩としては最強だと思う。

Ajaxハッカーズ・プログラミングという本を以前買ったまま放置してたのだけど、これでやっと理解できるかな・・・。

記事内でphpを実行できるExec-PHP(プラグイン)を入れてみた

wordpressのプラグインでexec-phpというのがあるんだけど、こいつをインストールすることで記事上でphpソースコードを実行できるらしいのでやってみた。

■Exec-PHP
Bluesome – Exec-PHP plugin for WordPress

■インストール方法
Exec-PHPのサイトからzipをダウンロード

解凍

Exec-PHPフォルダごとwordpressのプラグイディレクトリにうp

管理画面で有効化

たったこれだけ。

■実行してみる
とりあえず姉妹サイトのねまきから最新の10件をRSS取得、記事のリストを表示してみる。RSSパーサーはMagpieRSS を使ってる。んで

↓実行
require_once("./rss/rss_fetch.inc");
$url2="http://cocolog-hack.cocolog-nifty.com/blog/atom.xml";
$rss2=fetch_rss($url2);
?>

    items as $item){ ?>

  • ‘>

完璧。

つまりこれ何に使えるのかと言うと、自分のブログの最新の10件のリンクを表示しして、ブログっぽくないホームページのようなサイトを作ることが可能と言うわけ。wordpressをCMSとして使って運用できたりするので意外と便利かも。

でも実際やりたかったのはサイドバーに姉妹サイトの最新の10件を表示したかったんだけど、それはできないっぽい。
となるとテンプレートいじるしかないのか。

それはさすがにやらんけど。

追記
今気づいたんだけど、一回保存すると再編集かけたときリッチテキストモードで一回表示してしまうとphpのソースの所々がエスケープされてしまう。投稿設定でリッチテキストモードは常に使用しない設定にしたほうがいいかも。

未来メール完成

wp_017.jpg

金曜に設計した未来メールが完成した。5時間くらいで出来た。これはかなりよい!
いろいろ使いやすくして機能拡張していこうかな。
重要度のフラグもつけようかな。
でもシンプルなのがいいからこれでいいか。

未来メール設計中

未来メールというアプリーケーションを作ろうと思って設計してます。

自宅サーバーに自分専用のwebアプリをいくつか作ってる。
未来メールの他にはid・pass管理とかftp管理。

今回の未来アプリは何のことはない。指定した日時にメールが届くようにするアプリ。メーリングリスト配信とかのアプリと同じですね。

というのもここ最近細かい仕事が多くてたまにやり忘れることがあるので、締め切り直前に未来メールでお知らせしてくれればいいなと思って。
自作しなくたって代替アプリは探せばいくらでもあるけど、ちょっと最近プログラム離れしすぎなので。鍛えなおしたい。

■管理画面
wp_012.jpg

wp_021.jpg

phpでメールの配信はmb_send_mail()で簡単にできるんだけど、指定した日時にっていうのがやったこと無いので調べたら、linuxで言うcronという機能を使えばいいらしい。つまり指定した日時にlinux自身のマシンプログラムを起動させてphpファイルを実行させるやり方。
なんでこんな事やるかっていうと、webアプリはブラウザで開いて初めて起動するものだから。日時指定でメールを送信とかなると、単純に考えるとブラウザで開くとメールを送信するphpを指定日時にブラウザで開かなければならない。でもそれって本末転倒。勝手に配信してほしい。

でももっと問題なのはうちのサーバーWindowsなんですΣ(・ω・´;)
しゃあないのでメール送信用phpをブラウザで開いたままにしてメタリフレッシュを30秒に設定。30秒ごとにメールを送るか確認する。
ええ、こんなやり方ありえないんですけど、自分用なのでいいです。つかそーゆーアプリ欲しいだけなんで。中身は問わない。

あー、でもLinuxはいつか覚えたいな。Fedoracore6はインストールしたんだけどいじってないや。
とりあえずLinuxでwebサーバー・メールサーバー・FTPサーバー・DBを一通り構築できるようになりたい。これさえマスターできれば点と線が繋がるので。部分的には分かるんだけどねー。通してやらないとやっぱよくわからん。

ブログ妖精 ココロ

wp_011.jpg

ブログ妖精 ココロ
http://www.cocolog-nifty.com/cocolo/

ブログパーツ配布予定地
http://blogpartsgarden.jp/cs/blogparts/detail/071206182435/1.html

リリース前にフライング公開で一部アンテナの高いブロガーに記事にされちゃったりしてたココロたん。本日無事にプレオープンしました。
絵師は「ぱんつはいてない」のこつえー先生。
※お尻等下半身のラインがハッキリ出てて下着を着けてないように見えるこつえー先生の独特の芸風

wp_02.jpg

ブログペットのエンジンを利用してるので、勝手にはわゎ~な記事も投稿されます。
ょぅι゛ょの様に見えますが1万101歳だそうです。

【にゅーすとか】
http://headlines.yahoo.co.jp/hl?a=20071206-00000022-inet-inet
http://www.itmedia.co.jp/news/articles/0712/06/news094.html
http://bb.watch.impress.co.jp/cda/news/20323.html?ref=rss
http://internet.watch.impress.co.jp/cda/news/2007/12/06/17767.html
http://ascii.jp/elem/000/000/090/90752/
http://japan.internet.com/wmnews/20071206/3.html

xamppでmysqlが文字化け(windows環境)

最近またプログラミングを始めてて、Rubyに手を出したけどどうもなじめず、phpでRailsのような事が実現できるCakephpというのを学ぼうと思っている。

で、開発環境を用意するために、今まで使ってた自宅のweb鯖をちょっと一新してxamppでリニューアルした。

■xamppとは?
コレを使うとapache・php・pear・mysql・phpMyAdmin・Filezillaなどが一括インストールされてしまうすぐれもの。

apache friends – xampp
http://www.apachefriends.org/jp/xampp.html

phpを使って開発するときは便利。
で、windows環境でこれをインストールするんですが、ほんとにあっという間にできてしまうんですよ。
でもmysqlとか単独でインストールする時って結構いろいろ聞かれたのに何も聞かれないなんてなんか変だ。
案の定、phpMyAdmin起動してみたら文字化けしてますた。

■文字コードを調べる
mysql > show variables like “char%”;
と打ち込むとこんな感じ
+————————–+——————————–+
| Variable_name | Value |
+————————–+——————————–+
| character_set_client | latin1 |
| character_set_connection | latin1 |
| character_set_database | latin1 |
| character_set_filesystem | binary |
| character_set_results | latin1 |
| character_set_server | latin1 |
| character_set_system | latin1 |
| character_sets_dir | C:\xampp\mysql\share\charsets\ |
+————————–+——————————–+

latin1って何だよ?

で、utf8で開発したいのでいろいろ調べて見た結果結構苦労したけど解決したのでメモっときます。

■xampp/mysql/my.cnf内に以下のコードを追加
[mysqld]
init-connect = SET NAMES utf8
character-set-server = utf8
collation-server = utf8_general_ci

[mysqldump]
default-character-set = utf8

[mysql]
default-character-set = utf8

■xampp/phpMyAdmin/config.inc.php内の以下のコードをutf-8に修正
$cfg['DefaultLang'] = ‘utf-8′;
$cfg['DefaultCharset'] = ‘utf-8′;

ここまでできたらテストデータを入れてみます。
ただし、

■データを入れるときはphpMyAdminからInsert、又はphpから
コマンドプロンプトから直接入力するとShift-jisになるため。
データベースを作る時はコマンドプロンプトからでもおk

■phpからmysqlにつなぐとき”set name 文字コード”をクエリ送信し文字コード指定する
mysql4.1以降の場合は必要みたいです。ちなみに最新のxamppだとmysql5.0.45でした。

//————————————————–
//DB接続
//————————————————–
$host = “****”;
$usr = “****”;
$password = “****”;
$select_db = “****”;

if (!$conn = mysql_connect($host, $usr, $password)){
die(“データベース接続エラー.
“);
}

mysql_select_db($select_db, $conn);
mysql_query(“set names utf8″, $conn);

以上で文字化けはなくなりました。

付属のFilezillaというFTPサーバーソフトがあるけど以前使っていたTinyFTPよりも繋がりが早い!
phpもめんどくさいコード書き換えとかいらないもんなー。

これからぼちぼちケーキphpをいじってみます。

fladdict 深津貴之氏のプレゼンメモ-Adobe Max 2007

ActionScript3.0の使い方、2.0との使い分けなど語ってくれた深津氏のプレゼンメモっす。

■2.0の特徴
 ⇒バグを見つけにくい
 ⇒いきなり作成でもおk
 ⇒おせぇ
 ⇒小回り聞くからすぐ作れる

結論:
3.0ほどルールが厳密ではないのですぐに何かを動かせる。ただ複雑な処理を伴う計算が施されているものは3.0に書き換えると激早になる。
2.0で作ってから3.0に書き換えるというのもあり。

■3.0特徴
 ⇒バグを見つけやすい
 ⇒作成前に十分な設計が必要
 ⇒はやい
 ⇒使いまわしクラスで開発スピード短縮可能

結論:
Java並みの厳格なルールがあるのでしっかり設計した上で開発しないとあとで泣くハメに。
計算力は2.0の10倍なので無駄なところにマシンパワーを注げる。表現力もアップする。面白いことやりたければ3.0を選択。

■挙動単位でクラスを分けて使う
 ⇒クラスを切り出してスタディー用のクラスを作る

■パラメーターの外部化
 ⇒いろいろなパラメーターは外部XMLファイルで調整。

■使いまわすクラスは厳格な設計
 ⇒ただし、表示部分など演出面を考慮し柔軟性のある設計

■2.0と比べ10倍以上高速化した計算力を何に使うか
 ⇒×3D物理計算(つまんね) ×エフェクト・フィルター(つまんね) ◎マシンパワーの無駄使い(その発想はなかった的な)

■ByteArrayに注目
 ⇒フォトショファイルやイラレファイルを取り込める。また書き出せる。
(例)
Airで作成したランダムで花の模様が現れるアプリをスペースキーで数値書き込み⇒SVGファイル作成
 ⇒できたSVGをイラレで開くとその模様がベクターデータになっている!!すげぇ

AirでWebcameraを使ってキャプチャ画像をjpg保存

Airでwebcameraを使い、キャプチャ画像をデスクトップに保存するサンプルです。

jpeg画像を作成するには事前に画像作成用のライブラリが必要
↓以下からダウンロード
as3corelib – Google Code
http://code.google.com/p/as3corelib/downloads/list

(zipを解凍したらcorelib-.90/corelib/src/comをflaファイルと同じ階層に入れる。)

こんな風にWebcameraを写せます
wp_013.jpg

画面をクリックするとデスクトップにjpgファイルができる
wp_021.jpg

キャプチャした画像
webcam0.jpg

Source:

//--------------------------------------------------
//import
//--------------------------------------------------
//画像作成関連のパッケージ
import com.adobe.images.PNGEncoder;//pngで書き出す場合
import com.adobe.images.JPGEncoder;//jpgで書き出す場合

//ファイルを扱うパッケージ
import flash.filesystem.File;
import flash.filesystem.FileStream;
import flash.filesystem.FileMode;

//--------------------------------------------------
//settings
//--------------------------------------------------
var cam:Camera = Camera.getCamera();
var video:Video = new Video(320,240);
video.attachCamera(cam);
player.vid.addChild(video);

//--------------------------------------------------
//function
//--------------------------------------------------
player.vid.addEventListener(MouseEvent.MOUSE_DOWN , SaveFile);

var count:int = 0;
function SaveFile(e:MouseEvent){
var bmd:BitmapData = new BitmapData(320,240);
bmd.draw(player.vid);
var jpge:JPGEncoder = new JPGEncoder(80);
var img:ByteArray = jpge.encode(bmd);
var file:File = File.desktopDirectory.resolvePath("webcam" + count++ + ".jpg");
var stream:FileStream = new FileStream();
stream.openAsync(file, FileMode.WRITE);
stream.writeBytes(img);
stream.close();
}

Webcams.air(64kb)
Webcams.fla(640kb)

Airで特定のファイルだけドラッグ&ドロップを許可する方法

wp_011.jpg

解説ちょいまち
Source:

//--------------------------------------------------
//import
//--------------------------------------------------
import flash.desktop.DragManager;
import flash.desktop.ClipboardFormats;
import flash.events.NativeDragEvent;

//--------------------------------------------------
//function
//--------------------------------------------------
/***ファイルのDrag&Drop***/
this.addEventListener(NativeDragEvent.NATIVE_DRAG_ENTER,onDragIn);
this.addEventListener(NativeDragEvent.NATIVE_DRAG_DROP,onDrop);

/*** flvのみDragover許可***/
function onDragIn(e:NativeDragEvent):void{
var files:Object = e.clipboard.getData(ClipboardFormats.FILE_LIST_FORMAT);
if(files[0].extension == "flv"){
DragManager.acceptDragDrop(this);//許可
}
}
/*** flvがドロップされたら再生***/
function onDrop(e:NativeDragEvent):void{
var files:Object = e.clipboard.getData(ClipboardFormats.FILE_LIST_FORMAT);
player.vid.play(files[0].url);
}

FlvPlayer.air(60kb)
FlvPlayer.fla(663kb)