2011-06-21

XMLの名前空間について考察してみる。

SVG JavaScript

普段何気なくコピペしている

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr">

とか
Facebook (OGP) の

<html xmlns:og="http://ogp.me/ns#">

とか

前回SVGでやった

document.createElementNS();

とかについて本気出して考えてみる。

まずXMLの名前空間について
XML名前空間の簡単な説明
 XML in Mozilla

次、用語解説
XML wikipedia
DTD wikipedia
XHTML
OGP created at Facebook...
RDF

それぞれの対応がこんな感じ

あとマイクロフォーマットとかもまとめたい。

次回に続く。

2011-05-17

HTML5 + SVG + JS の練習。　グリッド模様。

SVG JavaScript

HTML5でポリゴンぐるぐる回したいんだ。

動作確認 Crome, Firefox のみ。

とりあえず HTML を普通に用意。

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" />
	<title>JavaScriptでSVGを制御(エレメントの指定)</title>
</head>
<body>
	<h4>HTML5 で作図</h3>
	
	<svg id="svgCanvas" width="500" height="500" version="1.1" xmlns="http://www.w3.org/2000/svg" style="border: solid #000000;">
	</svg>
</body>
</html>

グリッド計算とラインを描画

	function renderGrid(){
		var interval	= 50
			, canvas	= document.getElementById("svgCanvas")
			, toX		= canvas.width.baseVal.value
			, toY		= canvas.height.baseVal.value
			, lineColor = '#DDDDDD'
			, svgns = "http://www.w3.org/2000/svg";
		
		for(var i=0; i<toX/interval; i++ ){
			
			var element	= document.createElementNS(svgns, 'path');
			element.id = 'x' + i;
			
			element.style.stroke	= lineColor;
			element.setAttribute('d', "M" + i*interval + ' 0 L' + i*interval + ' ' + toY + ' Z');
			
			canvas.appendChild(element);
		}
		
		for(var i=0; i<toY/interval; i++ ){
			
			var element	= document.createElementNS(svgns, 'path');
			element.id = 'y' + i;
			
			element.style.stroke	= lineColor;
			element.setAttribute('d', "M0 " + i*interval + ' L' + toY  + ' ' + i*interval + ' Z');
			
			canvas.appendChild(element);
		}
	}
	renderGrid();

するとグリッド模様が描画される。

簡単じゃん！

var svgns = "http://www.w3.org/2000/svg";
var element	= document.createElementNS(svgns, 'path');

この部分は必須のようです。

最初は

var element	= document.createElement('path');

としていたら、何故か表示されませんでした。

ドキュメント読み込み、リファクタリングはこれから ...

2011-05-06

MacのターミナルでJSを走らせる。

JavaScript Mac

最初から JavaScriptCore なるものが用意されているので。

vi .bash_profile に追記

alias jsc="/System/Library/Frameworks/JavaScriptCore.framework/Versions/A/Resources/jsc"

もちろん設定の読み込み

$ source .bash_profile

jsコードを書いて

// runner.js
(function(){
    print("hello world!"); //標準出力は print 関数
}()); // コードは即時関数で実行させる

実行

$ jsc runner.js

そんな感じです。

2011-04-25

リアルタイム Web とか WebSocketsについてメモ。

WebSockets

XMLHttpRequest(Ajax) との違い
サーバー側からプッシュ配信ができる

プロトコル
 http://dev.ariel-networks.com/Members/inoue/websocket/

クライアント実装
http://www.findmebyip.com/litmus/

モダンブラウザの最新はOK。 IEは全滅。
ブラウザ以外の実装はどうなってんだろ？ iPhone SDKとかには入ってそうな気がする。

サーバー実装
http://d.hatena.ne.jp/Ehren/20100830/1283183474

先日の node.js は「イベント駆動」「シングルスレッドモデル」なので相性が良い。
実装だけなら他にもいろいろあるよう。(PHP? 知らんな)

2011-04-11

ZendFW + Smarty3の autoloader 併用

php Zend Framework Smarty

ZendFWとSmartyのautoloader が干渉して画面がエラーだらけになるのだが、
検索して、ようやく回避方々を発見。



Warning: include_once(Smarty\Internal\Data.php)

Warning: include_once(Smarty\Internal\Template.php)

http://karenziv.com/2010/09/zend-framework-and-smarty-3/

問題は、
http://okwave.jp/qa/q6495553.html
と同じ物だけれど、回避方法がちょっと違います。

そんなわけで、Autoloaderの初期化はこうなった。

<?php
// index.php ( 起動スクリプト )
$application->getAutoloader()
		->setFallbackAutoloader(true)
		->pushAutoloader(null,"Smarty_")
		->unregisterNamespace(array('Zend','ZendX'));

pushAutoloader() の callback 関数にnull を入れた際の挙動は

クラス名のプレフィックス "Smarty_" の際に callback 関数のチェックで null が is_callableに渡されて、無視される。

という事なので、Zend_Autoloader の設定を Smarty クラスの呼び出しより先にする必要がある。

他の autoload を使うライブラリがそれ以上増える場合は、Smartyのautoloaderを一度キャンセルし、Zend_Autoloader に明示的に登録

<?php
define("SMARTY_SPL_AUTOLOAD",false);

require_once "Smarty.class.php";
//(略)
	->pushAutoloader("smartyAutoload","Smarty_");

とか。たぶん。

2011-03-25

東京node学園。

JavaScript

とりあえずのメモとブックマークです。

ご挨拶 / 5分でわかるNode.js @meso

プレゼン資料

何故 JavaScript/Node.js なのか？

IOブロックが無い
イベント駆動
シングルスレッドモデル
V8エンジンが早い (Chromeにも使われているGoogleのJSエンジンです)

詳しくは => I am Bad at Math

ECMAScript5時代のJavaScript再入門 @masuidrive

ECMA Script 5th edition ( ブラウザ毎に実装の違うJSの標準化 )
JSONのサポート
map / filter
Object の拡張
strictモード

現状のブラウザでの実装
http://kangax.github.com/es5-compat-table/
IE爆発しろ。

その他
http://web-engineer.buyuden.net/buyuden/2010/12/41masuidrive-appcelerator-inc.html
http://d.hatena.ne.jp/amachang/20080821/1219302804

『非同期プログラミングの改善』のエッセンス @koichik

プレゼン資料

Node.js本を執筆中らしい。
callback での例外処理のエッセンス。
赤いシャツの人。

Nodeにおけるテスト手法 @Jxck_

require('assert') が標準
require('should')
require('expresso')
require('nodeunit')
require('vows')
require('tobi')

その他いろいろ。
JSに限らずテスト駆動開発は大事だな、と。

Kinect + node.js + Audio Data API でテルミンみたいな楽器を作る @hakobera

プレゼン資料

kinect.js とか。
何言ってるのかよくわからない。

node.jsによるマルチプレイヤー ネットワークゲームの可能性」 @ndruger

プレゼン資料

ソースコード

2011-01-25

SNSスパム、ウイルスの記事まとめ。

雑記

ブックマーク的な。

twitterやFacebook経由のウイルス感染に警告〜基本的なウイルス対策
 http://30tx.com/2010/05/twitterfacebook.html

手の込んだFacebookワームウィルス伝染中
http://jp.techcrunch.com/archives/20080807elaborate-facebook-worm-virus-spreading/

「40万人が感染」、グーグルのSNS「Orkut」でウイルスが大流行
http://itpro.nikkeibp.co.jp/article/NEWS/20071220/289969/

SNSを狙うマルウェアやスパムが激増――Sophos報告書
http://www.itmedia.co.jp/news/articles/1002/02/news028.html

2010年にSNSを狙った攻撃が急増、約7割のSNSユーザーがスパムを経験
http://itpro.nikkeibp.co.jp/article/Research/20110120/356284/?ST=security

Possible new Twitter worm
http://isc.sans.edu/diary.html?storyid=10297

Fake anti-virus attack spreads on Twitter via goo.gl links
http://nakedsecurity.sophos.com/2011/01/20/fake-anti-virus-attack-twitter-via-goo-gl-links/

New Twitter worm redirects to Fake AV
http://www.securelist.com/en/blog/11136/New_Twitter_worm_redirects_to_Fake_AV

まず、変なリンクを踏まない事が大事なのだけど、最近はみんな短縮URL使ってるから変なリンクかどうかって見分けがつかないよな。
むしろ、投稿する時に日本語の説明を普段からちゃんと乗せるようにしよう。