2011年11月29日火曜日

YUI3 で非同期通信

YUI3 を使って非同期通信するサンプルを作成。

javascript
YUI().use('io', function(Y) {
Y.one('#getItem').on('click', function(e) {
e.preventDefault();

var url = 'json.php';
Y.io(url, {
method : 'POST',
on : {
success : function(id, o) {
console.log(o.responseText);
},
failure : function() {
alert('io Error');
}
}
});
});
});

php
<html>
<head>
</head>
<title>YUI3.0サンプル</title>
<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>
<script src="/sample.js"></script>
</head>
<body class="yui3-skin-sam">

<a href="" id="getItem">getItem</a></br>

</body>
</html>



これで、geItem リンクをクリックすると非同期通信が起こります。
今回は簡単な json を表示する PHP に対して通信しています。
取得した json を console に出力しています。

リクエスト前


リクエスト後


yuiドキュメント

これで、ページ遷移せずに API からデータを取得して表示などができます。

2011年11月21日月曜日

YUI3 でpanel表示

YUI3 を使って panel を表示するサンプルを作成。

javascript

YUI().use('panel', function(Y) {
var panel = new Y.Panel({
srcNode : '#sPanel',
centered : true,
render : true,
visible : false,
modal : true,
buttons : []
});

Y.one('#sPanelOpen').on('click', function(e) {
e.preventDefault();
panel.show();
});

Y.one('#sPanelClose').on('click', function(e) {
e.preventDefault();
panel.hide();
});
});


php

<html>
<head>
</head>
<title>YUI3.0サンプル</title>
<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>
<script src="/sample.js"></script>
</head>
<body class="yui3-skin-sam">
<a href="" id="sPanelOpen">open</a></br>

<div id="sPanel">
<strong>サンプルパネル</strong></br>
<a href="" id="sPanelClose">close</a></br>
</div>

</body>
</html>


これで、open リンクをクリックすると panel が表示されます。
body に class="yui3-skin-sam" を設定すると panel 表示時に、背景を薄暗くできます。
panel は yui3.4 から利用できるようです。

サンプル画面


yuiドキュメント

自分はフロント系が苦手なので、もう少し js 、html に強くなるため YUI 関連も引き続き調べていこうと思います。

2011年11月14日月曜日

php goto文

PHP5.3からgoto文がサポートされた。
詳しくはマニュアルを
http://www.php.net/manual/ja/control-structures.goto.php

goto文はCやperlでもあります。
goto文はあまり使わないようにとされているようです。
確かに使い方を誤るともの凄くソースが読みづらくなります。
上から下に進んでいくのに、下から上にjumpするように書かれていたりなどしたら、ソースを読む時に処理を追い辛くてしょうがないですね。
エラー時や特定時のみ利用するのがいいみたいです。

特定時のみ使うのであれば有効かと思い、軽くパフォーマンスを見てみました。
結果は以下のようになっています。

goto文

<?php
$j = 0;
for ($i=0;$i<10000000;$i++) {
goto A;

A : {
$j++;
}
}

echo $j;
exit(0);

実行結果

$ time php goto.php
10000000
real 0m1.290s
user 0m1.152s
sys 0m0.036s


関数

<?php
$j = 0;
for ($i=0;$i<10000000;$i++) {
calc($j);
}

echo $j;
exit(0);

function calc(&$j) {
$j++;
}

実行結果

$ time php func.php
10000000
real 0m3.087s
user 0m2.760s
sys 0m0.052s


goto文の方が早いですね。
関数を呼ぶオーバヘッドが無いからかな?

一度の処理で、複数回のエラー処理をしないといけないときなどは、関数化するよりもgoto文を使うのもありかもですね。

2011年11月10日木曜日

ubuntu に apache + php インストール

昨日インストールした vm 上の ubuntu に apache と php をインストールします。

apache インストール

1. sudo apt-get install apache2
→ 途中でインストールするか Y/n で聞かれるので、Y を入力

2. dpkg -l | grep apache (表示内容一部省略)
apache2
apache2-mpm-worker
apache2-utils
apache2.2-bin
apache2.2-common


※ dpkg -L apache2 の結果
/.
/usr
/usr/share
/usr/share/bug
/usr/share/bug/apache2
/usr/share/bug/apache2/control
/usr/share/doc
/usr/share/bug/apache2/script
/usr/share/doc/apache2


3. ブラウザで確認

上記画像の用に表示されれば、apache のインストール完了


php インストール

1. sudo apt-get install php5
→ apache の時と同じく Y を入力

2. dpkg -l | grep php (表示内容一部省略)
libapache2-mod-php5
php5
php5-cli
php5-common


※ dpkg -L php5 の結果
/.
/usr
/usr/share
/usr/share/doc
/usr/share/doc/php5


3. php -v の結果
PHP 5.3.6-13ubuntu3.2 with Suhosin-Patch (cli) (built: Oct 13 2011 23:19:13)
Copyright (c) 1997-2011 The PHP Group
Zend Engine v2.3.0, Copyright (c) 1998-2011 Zend Technologies

php5.3.6 がインストールされるみたいです

4. ブラウザで定番の Hello World 出力
何も設定せずに、ブラウザで開こうとすると、php ファイルをダウンロードしますかみたいに表示される。
yas さんのブログを参考に設定したところ、無事表示されました。
http://perltips.twinkle.cc/linux/ubuntu/apache/php/settings


とりあえず、設定完了。


※ 補足
apache の再起動は以下のコマンドで可能
sudo /etc/init.d/apache2 restart

2011年11月9日水曜日

Ubuntu 11.10 インストール

Ubuntu 11.10 を自宅の Windows Vista にインストールする。
VMWARE PLAYER が 4.0 になっていたので、 3.0 をアンインストールして 4.0 を入れ直して、
心機一転する。
VMWARE PLAYER はユーザー登録をして
http://www.vmware.com/jp/products/desktop_virtualization/player/overview
上記のダウンロードボタンから。

Ubuntu 11.10 の ISO は
http://www.ubuntulinux.jp/News/ubuntu1110-desktop-ja-remix
上記のリンク先からダウンロード。

初回は何も考えずに、ISO を読み込ませていたら、日本語ではないし、インストール画面は GUI だったが、いざ起動したら何故か CUI のみだった。
なので、一度削除してググったところ猫おやじさんのブログがヒット。
猫おやじさんのブログは画像付きで非常に丁寧な解説なので、下記リンクの記事通りの手順を行ったところ、問題なくスムーズにインストール完了しました。
http://itneko.blogspot.com/2011/10/ubuntu-1110-on-vmware-player-4x.html

これにて、セットアップ完了。
時間があるときに、色々といじってみようと思います。