OSDN Git Service

Merge branch 'v05dev' of git.sourceforge.jp:/gitroot/pettanr/pettanr into v05
[pettanr/pettanr.git] / app / assets / javascripts / system.js
index d14200b..e637257 100644 (file)
-/*
- * pettanR system.js
- *   version 0.5.46
- *
- * gadgetOS
- *   author:
- *     itozyun
- *   licence:
- *     3-clause BSD
- */
-
-( function( window, document, undefined ){
-       
-       var body           = document.getElementsByTagName( 'body' )[ 0 ]; //( document.compatMode || '' ) !== 'CSS1Compat' ? document.body : document.documentElement;// 
-       var SERVICE_LIST   = [];
-       var SUPER_USER_KEY = { getUID: function(){ return 0; }};
-       var API_USER_LIST  = [ SUPER_USER_KEY ];
-       var numApiUser     = 1;
-       
-       function EMPTY_FUNCTION(){};
-       
-       function isApiUser( _user ){
-               return _user === SUPER_USER_KEY ||
-                       File.isDriver( _user ) === true ||
-                       Application.isApplicationInstance( _user ) === true;
-       };
-       
-       var Const = {
-               FILE: {
-                       TYPE: {
-                               UNKNOWN:        0,
-                               FOLDER:         1,
-                               IMAGE:          2,
-                               TEXT:           3,
-                               HTML:           4,
-                               CSV:            5,
-                               JSON:           6,
-                               XML:            7
-                       },
-                       STATE: {
-                               UNKNOWN:        0,
-                               OK:                     1,
-                               LOADING:        2,
-                               ERROR:          3,
-                               BROKEN:         4
-                       },
-                       UPDATE_POLICY: {
-                               _____:          parseInt( '00000', 2 ),
-                               ____C:          parseInt( '00001', 2 ), // hasCreateMenu
-                               ___W_:          parseInt( '00010', 2 ), // isWritable
-                               ___WC:          parseInt( '00011', 2 ), // isWritable
-                               __R__:          parseInt( '00100', 2 ), // isRenamable
-                               __R_C:          parseInt( '00101', 2 ), // hasCreateMenu
-                               __RW_:          parseInt( '00110', 2 ), // isWritable
-                               __RWC:          parseInt( '00111', 2 ), // isWritable
-                               _S___:          parseInt( '01000', 2 ), // childrenIsSortable
-                               _S__C:          parseInt( '01001', 2 ),
-                               _S_W_:          parseInt( '01010', 2 ),
-                               _S_WC:          parseInt( '01011', 2 ),
-                               _SR__:          parseInt( '01100', 2 ),
-                               _SR_C:          parseInt( '01101', 2 ),
-                               _SRW_:          parseInt( '01110', 2 ),
-                               _SRWC:          parseInt( '01111', 2 ),
-                               D____:          parseInt( '10000', 2 ),
-                               D___C:          parseInt( '10001', 2 ), // hasCreateMenu
-                               D__W_:          parseInt( '10010', 2 ), // isWritable
-                               D__WC:          parseInt( '10011', 2 ), // isWritable
-                               D_R__:          parseInt( '10100', 2 ), // isRenamable
-                               D_R_C:          parseInt( '10101', 2 ), // hasCreateMenu
-                               D_RW_:          parseInt( '10110', 2 ), // isWritable
-                               D_RWC:          parseInt( '10111', 2 ), // isWritable
-                               DS___:          parseInt( '11000', 2 ), // childrenIsSortable
-                               DS__C:          parseInt( '11001', 2 ),
-                               DS_W_:          parseInt( '11010', 2 ),
-                               DS_WC:          parseInt( '11011', 2 ),
-                               DSR__:          parseInt( '11100', 2 ),
-                               DSR_C:          parseInt( '11101', 2 ),
-                               DSRW_:          parseInt( '11110', 2 ),
-                               DSRWC:          parseInt( '11111', 2 ),
-                               CREATE:         1,
-                               WRAITE:         2,
-                               RENAME:         4,
-                               SORT:           8,
-                               DELETE:         16
-                       },
-                       EVENT: {
-                               UPDATE_ATTRIVUTE:       'onFileUpdate',
-                               GET_SEQENTIAL_FILES:'gotSeqentilFiles'
-                       },
-                       DATA_PROPERTY_RESERVED: [
-                               'children', 'driver', 'state', 'type'
-                       ]                       
-               },
-               TREE: {
-                       EVENT: {
-                               UPDATE:                         'onTreeUpdate'
-                       }
-               },
-               KEY: {
-                       EVENT: {
-                               KEY_DOWN:                       'keydown',
-                               KEY_UP:                         'keyup',
-                               KEY_CHANGE:                     'keychange',
-                               CURSOL:                         'cursol'
-                       }
-               },
-               APP: {
-                       TYPE: {
-                               GENERAL : 0,
-                               OVERLAY : 1,
-                               PAGE    : 2
-                       }
-               }
-       };
-
-/**
- * Class を定義し システムの管理下に置く.
- * 全てのクラスと pool が有効の場合インスタンスへの参照が保持される.
- *  1. Class.create( def, opt_final, opt_pool, opt_abstract ) でクラスを登録.
- *  2. コンストラクタ となるメソッドは、Constructor : function( arg ){ ... }, に書く.
- *  3. 通常通り new で インスタンス生成
- *  4. kill() でオブジェクトをクリーンして削除、pool が有効の場合は pool される.
- *  5. pool が有効の場合、new で pool されたインスタンスが返される.
- *  6. 
- * 
- */
-var Class = ( function(){
-       var CLASS_LIST         = [],
-               DEF_LIST           = [],
-               PRIVATE_CLASS_LIST = [],
-               PRIVATE_DEF_LIST   = [],
-               CONSTRUCTOR        = 'Constructor',
-               GET_INDEX          = Util.getIndex,
-               killPrivateFlag    = false,
-               dataUser           = null,
-               traits             = null,
-               f                  = true,
-               copyArray          = Util.copyArray;
-       
-       function getClass( instance ){
-               var cList    = CLASS_LIST,
-                       i        = cList.length,
-                       klass;
-               for( ; i; ){
-                       klass = cList[ --i ];
-                       if( instance instanceof klass ) return klass;
-               };
-               cList = PRIVATE_CLASS_LIST;
-               i     = cList.length;
-               for( ; i; ){
-                       klass = cList[ --i ];
-                       if( instance instanceof klass ) return klass;
-               };
-               
-               if( GET_INDEX( cList, instance ) !== -1 ) return instance;
-               if( GET_INDEX( CLASS_LIST, instance ) !== -1 ) return instance;
-       };
-       
-       function getClassDef( KlassOrInstance ){
-               var getIndex = GET_INDEX,
-                       i        = getIndex( CLASS_LIST, KlassOrInstance );
-               if( i === -1 ) i = getIndex( CLASS_LIST, getClass( KlassOrInstance ) );
-               if( i !== -1 ) return DEF_LIST[ i ];
-               
-               i = getIndex( PRIVATE_CLASS_LIST, KlassOrInstance );
-               if( i === -1 ) i = getIndex( PRIVATE_CLASS_LIST, getClass( KlassOrInstance ) );
-               if( i !== -1 ) return PRIVATE_DEF_LIST[ i ];
-               
-               if( GET_INDEX( DEF_LIST, KlassOrInstance ) !== -1 ) return KlassOrInstance;
-               if( GET_INDEX( PRIVATE_DEF_LIST, KlassOrInstance ) !== -1 ) return KlassOrInstance;
-       };
-       
-       /* over のプロパティを target にコピーする.ただし target の プロパティが優先, force で解除 */
-       function override( target, over, force ){
-               for( var p in over ){
-                       if( force === true || typeof target[ p ] === 'undefined' ){
-                               target[ p ] = over[ p ];
-                       };
-               };
-               return target;
-       };
-       
-       /* サブクラスを作るメソッド  
-        * var subClass = superClass.inherits( ... ) 
-        * http://d.hatena.ne.jp/m-hiyama/20051018/1129605002
-        */
-       function inherits( /* displayName, classSetting, opt_PrivateClass, props */ ){
-               var args        = copyArray( arguments ),
-                       params      = [],
-                       Super       = this,
-                       superDef    = getClassDef( Super ),
-                       displayName = args[ 0 ],
-                       classSetting,
-                       opt_super,
-                       klass;
-               if( superDef.Final === true ) throw new Error( 'Class is final!' );
-               
-               if( Type.isString( displayName ) === true ){
-                       args.shift();
-               } else {
-                       displayName = 'SubClass of ' + superDef.displayName;
-               };
-               params.push( displayName );
-               
-               classSetting = args[ 0 ];
-               if( Type.isNumber( classSetting ) === true ){
-                       if( superDef.isPrivate === true ) classSetting = classSetting | Class.PRIVATE_DATA;
-                       opt_super = !!( classSetting & Class.SUPER_ACCESS );
-                       params.push( classSetting );
-                       args.shift();
-               };
-               if( getClass( args[ 0 ] ) ){
-                       params.push( args.shift() );
-               } else
-               if( superDef.privateClass ){
-                       params.push( superDef.privateClass );
-               };
-               params.push( args[ 0 ] ); /* props */
-               f      = false;
-               traits = new Super();
-               f      = true;
-               klass  = Class.create.apply( Class, params );
-               traits = null;
-               if( opt_super === true ) getClassDef( klass ).Super = Super.prototype;
-               return klass;
-       };
-       
-       /* Class.create で作られたクラスのインスタンスが共通で備えるメソッド */
-       var CommonProps = {
-               kill : function(){
-                       var instance = this,
-                               klass    = getClass( instance ),
-                               def      = getClassDef( klass ),
-                               data, p, i;
-                       if( def.isPrivate === true && killPrivateFlag === false ){
-                               throw new Error( 'PrivateInstance.kill() work in PrivateUser.kill().' );
-                       };
-                       Type.isFunction( instance.onKill ) === true && instance.onKill();
-                       for( p in instance ){
-                               if( instance.hasOwnProperty && !instance.hasOwnProperty( p ) ) continue;
-                               delete instance[ p ];
-                       };
-                       if( def.pool ){
-                               def.live && def.live.splice( GET_INDEX( def.live, instance ), 1 );
-                               def.pool.push( instance );
-                       };
-                       if( def.privateClass ){
-                               i = GET_INDEX( def.userList, instance );
-                               if( i !== -1 ){
-                                       data            = klass.getPrivateData( instance );
-                                       killPrivateFlag = true;
-                                       data.kill();
-                                       killPrivateFlag = false;
-                                       def.dataList.splice( i, 1 );
-                                       def.userList.splice( i, 1 );
-                               };
-                       };
-                       // myCallback の削除
-                       // myCallback を受け取った API への通知
-               },
-               getMyCallback : function( callback ){
-                       var def       = getClassDef( this ),
-                               iList     = def.callbackInstanceList,
-                               rList     = def.callbackRegisterList,
-                               i, cList, myCallback;
-                       if( !iList ){
-                               iList = def.callbackInstanceList = [];
-                               rList = def.callbackRegisterList = [];
-                       };
-                       i = GET_INDEX( iList, this );
-                       if( i === -1 ){
-                               cList = [];
-                               iList.push( this );
-                               rList.push( cList );
-                       } else {
-                               cList = rList[ i ];
-                               for( i = cList.length; i; ){
-                                       if( cList[ --i ].callback === callback ) return cList[ i ];
-                               };
-                       };
-                       myCallback = new Callback( this, callback );
-                       cList.push( myCallback );
-                       return myCallback;
-               },
-               releaseMyCallback : function( callback ){
-                       var def   = getClassDef( this ),
-                               iList = def.callbackInstanceList,
-                               rList = def.callbackRegisterList,
-                               i, _i, cList;
-                       if( !iList ) return;
-                       i = GET_INDEX( iList, this );
-                       if( i === -1 ) return;
-                       cList = rList[ i ];
-                       _i    = GET_INDEX( cList, callback );
-                       if( _i === -1 ) return;
-                       cList.splice( _i, 1 );
-                       callback.kill();
-                       if( cList.length !== 0 ) return;
-                       iList.splice( i, 1 );
-                       rList.splice( i, 1 );
-                       if( iList.length !== 0 ) return;
-                       delete def.callbackInstanceList;
-                       delete def.callbackRegisterList;
-               }
-       };
-
-       /* privateDataclass をもつクラスに追加されるメソッド */
-       function newPrivateData( /* instance, args */ ){
-               var args         = copyArray( arguments ),
-                       user         = args.shift(),
-                       def          = getClassDef( user ),
-                       privateClass = def.privateClass,
-                       privateDef   = getClassDef( privateClass ),
-                       i            = -1,
-                       data;
-               if( def.userList ){
-                       i = GET_INDEX( def.userList, user );
-               } else {
-                       def.userList = [];
-                       def.dataList = [];
-               };
-               if( i !== -1 ){
-                       throw new Error( 'PrivateData already exist!' );
-               };
-               dataUser  = user;
-               data      = new privateClass( args );
-               data.User = user;
-               dataUser  = null;       
-               return data;
-       };
-       function getPrivateData( instance ){
-               var def = getClassDef( instance ),
-                       i   = GET_INDEX( def.userList, instance );
-               if( i !== -1 ) return def.dataList[ i ];
-       };
-       
-       /*
-        * new の実体.コンストラクタの機能は instance.Constructor に書く.
-        * これにより pool された オブジェクト(破棄されたインスタンス) を再利用できる
-        */
-       /* Constructor Real for GeneralClass */
-       function C( args ){
-               var klass = this,
-                       def   = getClassDef( klass ),   
-                       instance,
-                       userDef;
-               if( def.Abstract === true ){
-                       throw new Error( 'AbstractClass!' );
-               };
-               if( def.isPrivate === true && dataUser === null ){
-                       throw new Error( 'use myClass.newPrivateData( instance, ...args )!' );
-               };
-               f = false;
-               instance = def.pool && def.pool.length > 0 ? def.pool.shift() : instance = new klass();
-               f = true;
-               if( def.Super && !instance.Super ) instance.Super = def.Super;
-               if( def.isPrivate === true ){
-                       userDef = getClassDef( dataUser );
-                       userDef.dataList.push( instance );
-                       userDef.userList.push( dataUser );
-               } else {
-                       def.live && def.live.push( instance );
-                       args = copyArray( arguments );
-               };
-               def[ CONSTRUCTOR ] && def[ CONSTRUCTOR ].apply( instance, args );
-               return instance;
-       };
-       
-       return {
-               POOL_OBJECT  : 1,
-               ABSTRACT     : 2,
-               FINAL        : 4,
-               SUPER_ACCESS : 8,
-               PRIVATE_DATA : 16,
-               create : function( /* displayName, classSetting, opt_PrivateClass, props */ ){
-                       var args        = copyArray( arguments ),
-                               displayName = args[ 0 ],
-                               classSetting,
-                               opt_pool, opt_abstract, opt_final, opt_private,
-                               privateDef,
-                               props,
-                               klass,
-                               classDef = {};
-                       if( Type.isString( displayName ) === true ){
-                               classDef.displayName = displayName;
-                               args.shift();
-                       };
-                       classSetting = args[ 0 ];
-                       if( Type.isNumber( classSetting ) === true ){
-                               opt_pool     = !!( classSetting & Class.POOL_OBJECT  );
-                               opt_abstract = !!( classSetting & Class.ABSTRACT     );
-                               opt_final    = !!( classSetting & Class.FINAL        );
-                               opt_private  = !!( classSetting & Class.PRIVATE_DATA );
-                               if( opt_final === true && opt_abstract === true ){
-                                       throw new Error( 'final & Abstract!' );
-                               };                              
-                               args.shift();
-                       };
-                       
-                       if( GET_INDEX( PRIVATE_CLASS_LIST, args[ 0 ] ) !== -1 ){
-                               privateDef = getClassDef( args[ 0 ] );
-                               if( privateDef.isPrivate !== true ){
-                                       throw new Error( 'PrivateClass not found! please, Class.create( Class.PRIVATE, {...} ).' );
-                               } else
-                               if( privateDef.Abstract === true ){
-                                       throw new Error( 'PrivateClass is Abstract!' );
-                               };
-                               classDef.privateClass = args.shift();
-                       };
-                       props = args[ 0 ];
-                       if( props === null || Type.isObject( props ) === false ){
-                               throw new Error( 'No Class Def!' );
-                       };
-                       
-                       if( Type.isFunction( props[ CONSTRUCTOR ] ) === true ){
-                               classDef[ CONSTRUCTOR ] = props[ CONSTRUCTOR ];
-                       };
-                       
-                       klass = function(){ var a = arguments; if( f ) return C.apply( a.callee, a )};
-                       klass.prototype = override( override( traits || {}, props, true ), CommonProps, false );
-                       
-                       if( opt_abstract === true ){
-                               classDef.Abstract = true;
-                       } else
-                       if( opt_pool === true ){
-                               classDef.pool = [];
-                               if( opt_private === false )classDef.live = [];
-                       };                      
-                       if( opt_final === true ){
-                               classDef.Final = true;
-                       } else {
-                               klass.inherits = inherits;
-                       };                      
-                       if( opt_private === true ){
-                               if( classDef.privateClass ){
-                                       throw new Error( 'Private Data Class has no PrivateClass!' );
-                               };
-                               classDef.isPrivate = true;
-                               PRIVATE_CLASS_LIST.push( klass );
-                               PRIVATE_DEF_LIST.push( classDef );
-                       } else {
-                               if( classDef.privateClass ){
-                                       klass.newPrivateData = newPrivateData;
-                                       klass.getPrivateData = getPrivateData;  
-                               };
-                               CLASS_LIST.push( klass );
-                               DEF_LIST.push( classDef );                              
-                       };
-                       return klass;
-               },
-               onShutdown : function(){
-                       
-               },
-               getClass : function( instance ){
-                       return getClass( instance );
-               },
-               getClassDef : function(){
-                       
-               }
-       };
-})();
-
-/**
- * Callback 時に thisObject や args を指定したい場合に使用. 
- */
-var Callback = Class.create(
-       Class.POOL_OBJECT | Class.FINAL, {
-       Constructor : function( thisObject, callback, opt_args ){
-               if( Type.isFunction( callback ) === false ){
-                       throw new Error( 'Not function!' );
-               };
-               this.callback = callback;
-               if( thisObject ) this.thisObject = thisObject;
-               if( Type.isArray( opt_args ) === true ){
-                       this.args = opt_args;
-               } else
-               if( opt_args !== undefined ){
-                       this.arg = opt_args;
-               };
-       },
-       fire : function( /* args */ ){
-               var thisObject = this.thisObject || window,
-                       args       = Util.copyArray( arguments );
-               if( 0 < args.length ){
-                       if( this.args !== undefined ){
-                               args.push.apply( args, this.args );
-                       } else
-                       if( this.arg !== undefined ){
-                               args.push( this.arg );
-                       };
-                       this.callback.apply( thisObject, args );
-               } else {
-                       if( this.args !== undefined ){
-                               this.callback.apply( thisObject, this.args );
-                       } else
-                       if( this.arg !== undefined ){
-                               this.callback.call( thisObject, this.arg );
-                       } else {
-                               this.callback.call( thisObject );
-                       };
-               };
-       },
-       registerUser : function( user ){
-               if( !this.userList ){
-                       this.userList = [ user ];
-               } else {
-                       Util.getIndex( this.userList, user ) === -1 && this.userList.push( user );
-               };
-       },
-       onKill : function(){
-               var instance = this.thisObject;
-               this.userList && Class.getClass( instance ) && instance.releaseMyCalllback( this );
-       }
-});
-
-
-/* --------------------------------------------------------------
- * System Timer
- * 
- */
-
-var SystemTimer = ( function(){
-       var setTimeout    = window.setTimeout;
-       var clearTimeout  = window.clearTimeout;
-       var INTERVAL_TIME = 16;
-       var TICKET_LIST   = [];
-       var timerId       = undefined;
-       var next          = 0;
-       
-       function loop(){
-               var i    = 0,
-                       list = TICKET_LIST;
-           for( i = 0; i < list.length; ){
-               if( list[ i ].fire( next ) !== false ) ++i;
-           };
-           timerId = undefined;
-           update();
-       };
-       function update(){
-               var list = TICKET_LIST,
-                       l    = list.length,
-                       n    = 99999999,
-                       c;
-               if( l === 0 ){
-                       timerId !== undefined && clearTimeout( timerId );
-                       timerId = undefined;
-                       return;
-               };
-           for( ; l; ){
-               c = list[ --l ].count;
-               if( n > c ) n = c;
-           };
-           if( next > n || timerId === undefined ){
-               timerId !== undefined && clearTimeout( timerId );
-               timerId = setTimeout( loop, INTERVAL_TIME * n );
-               next = n;
-           };
-       };
-       
-       var TimerTicket = Class.create(
-               Class.POOL_OBJECT, {
-                       Constructor : function( apiuser, callback, time, once, opt_thisObject ){
-                               this.apiuser  = apiuser;
-                               this.callback = callback;
-                               this.time     = time;
-                               this.count    = time;
-                               if( once ) this.once = once;
-                               this.thisObj  = opt_thisObject || apiuser;
-                       },
-                       fire : function( c ){
-                               this.count -= c;
-                               if( 0 < this.count ) return;
-                               this.callback.call( this.thisObj );
-                               if( this.once === true ){
-                                       this.destroy();
-                                       TICKET_LIST.splice( Util.getIndex( TICKET_LIST, this ), 1 );
-                                       return false;
-                               } else {
-                                       this.count = this.time;
-                               };
-                       },
-                       destroy : function( apiuser, callback ){
-                               if( apiuser  && apiuser  !== this.apiuser )  return false;
-                               if( callback && callback !== this.callback ) return false;
-                               
-                               this.kill();
-                               return true;
-                       }
-               }
-       );
-       
-       return {
-               add: function( _apiuser, _handler, _time, _once, opt_thisObject ){
-                       if( Type.isNumber( _time ) === false || _time < INTERVAL_TIME ) _time = INTERVAL_TIME;
-                       
-                   var _ticket = new TimerTicket( _apiuser, _handler, Math.ceil( _time / INTERVAL_TIME ), _once, opt_thisObject );
-                   TICKET_LIST.push( _ticket );
-                   
-                   update();
-               },
-               remove: function( _apiuser, _handler ){
-                       var _ticket,
-                               i = 0;
-                       while( _ticket = TICKET_LIST[ i ] ){
-                               if( _ticket.destroy( _apiuser, _handler ) === true ){
-                                       TICKET_LIST.splice( i, 1 );
-                               } else {
-                                       ++i;
-                               };
-                       };
-                   update();
-               }
-       };
-})();
-
-/* --------------------------------------------------------------
- * Async Callback
- * 
- */
-var AsyncCall = ( function(){
-       var CALLBACK_LIST = [];
-       
-       var CallbackTicket = Class.create(
-               Class.POOL_OBJECT, {
-               Constructor : function( apiuser, callback, args, thisObject ){
-                       this.apiuser  = apiuser;
-                       this.callback = callback;
-                       this.args     = args;
-                       this.thisObj  = thisObject || apiuser;
-               },
-               fire : function(){
-                       var f = this.callback,
-                               a = this.args,
-                               t = this.thisObj;
-                       this.destroy();
-                       if( Type.isArray( a ) === true ){
-                               f.apply( t, a );
-                       } else {
-                               f.call( t, a );
-                       };
-               },
-               destroy : function( apiuser, callback ){
-                       if( apiuser  && apiuser  !== this.apiuser ) return false;
-                       if( callback && callback !== this.callback ) return false;
-                       
-                       this.kill();
-                       return true;
-               }
-       });
-
-       function dispatch(){
-               var _ticket = CALLBACK_LIST.shift();
-               if( _ticket ){
-                       _ticket.fire();
-                       CALLBACK_LIST.length !== 0 && SystemTimer.add( SUPER_USER_KEY, dispatch, 1, true );
-               };
-       };
-
-       return {
-               add: function( _apiuser, _callback, _argments, _thisObject ){
-                       CALLBACK_LIST.length === 0 && SystemTimer.add( SUPER_USER_KEY, dispatch, 1, true );
-                       CALLBACK_LIST.push( new CallbackTicket( _apiuser, _callback, _argments, _thisObject ) );
-               },
-               remove: function( _apiuser, _callback ){
-                       var _ticket,
-                               i = 0;
-                       while( _ticket = CALLBACK_LIST[ i ] ){
-                               if( _ticket.destroy( _apiuser, _callback ) === true ){
-                                       CALLBACK_LIST.splice( i, 1 );
-                               } else {
-                                       ++i;
-                               };
-                       };
-               }
-       };
-})();
-
-/* -----------------------------------------------------------
- * 画像一覧は
- *     お気に入り画像一覧 > tag:ペン次郎 > ペン次郎:笑う
- *  最近アップロードされた画像 > images
- *  最近使われた画像 > images
- *  キャラクター画像庫 > アニマル系 > tag:ペン次郎 > ペン次郎:笑う
- *  風景画像庫 >
- *  効果画像庫 >
- *  アイテム画像庫 >
- *  
- * 画像一覧を読み込むタイミング
- */
-var File = ( function(){
-       var DRIVER_LIST             = [];
-       
-       var FILE_TYPE_IS_FOLDER     = Const.FILE.TYPE.FOLDER,
-               numFileType             = Const.FILE.TYPE.XML,
-               FILEDATA_RESITER        = [],                   // store all of fileData( json object )
-               FILEDATA_ACCESS         = [],                   // file operations for Kernel only ! hide from Out of File
-               FILE_OBJECT_POOL        = [],
-               EVENT_LISTENER_REGISTER = [],
-               TREE_ARRAY              = [],
-               TREE_ACCESS_ARRAY       = [];
-       
-       var REQUEST_CONTROLER = ( function(){
-               var REQUEST_TICKET_RESISTER = [],
-                       currentTicket           = null,
-                       currentData             = null,
-                       DATA_TYPE_ARRAY         = 'json,xml,html,text'.split( ',' ),
-                       DATA_IS_JSON            = 0,
-                       DATA_IS_XML             = 1,
-                       DATA_IS_HTML            = 2,
-                       DATA_IS_TEXT            = 3,
-                       numError                = 0;
-               
-               var RequestTicket = Class.create(
-                       Class.POOL_OBJECT, {
-                       Constructor : function( apiuser, type, data, url, onLoad, onError ){
-                               this.apiuser = apiuser;
-                               this.type    = type;
-                               this.data    = data;
-                               this.url     = url;
-                               this.onLoad  = onLoad;
-                               this.onError = onError;
-                               this.state   = 0;
-                       },
-                       load : function( data ){
-                               AsyncCall.add( this.apiuser, this.onLoad, [ this.data, data ] );
-                       },
-                       error : function(){
-                               AsyncCall.add( this.apiuser, this.onError, this.data );
-                       }
-               });
-               
-               function request(){
-                       if( currentTicket !== null || REQUEST_TICKET_RESISTER.length === 0 ) return;
-                       currentTicket = REQUEST_TICKET_RESISTER.shift();
-                       $.ajax({
-                               url:            currentTicket.url,
-                               dataType:       DATA_TYPE_ARRAY[ currentTicket.type ],
-                               success:        onSuccess,
-                               error:          onError
-                       });
-               };
-               function onSuccess( _data ){
-                       currentTicket.load( _data );
-                       currentTicket.kill();
-                       currentTicket = null;
-                       request();
-               };
-               function onError(){
-                       ++numError;
-                       currentTicket.error();
-                       currentTicket.kill(); // retry
-                       currentTicket = null;
-                       request();
-               };
-
-               return {
-                       getNumTask: function(){
-                               return REQUEST_TICKET_RESISTER.length;
-                       },
-                       getNumError: function(){
-                               return numError;
-                       },
-                       getJson: function( _apiuser, _data, _url, _onLoad, _onError ){
-                               REQUEST_TICKET_RESISTER.push( new RequestTicket( _apiuser, DATA_IS_JSON, _data, _url, _onLoad, _onError ));
-                               currentTicket === null && request();
-                       }
-               };
-       })();
-
-       var FILE_CONTROLER = {
-               createTree: function( _apiuser, _rootFileData ){
-                       var _tree = new TreeClass( _apiuser, _rootFileData );
-                       TREE_ARRAY.push( _tree );
-                       return _tree;
-               },
-               getFileUID: function( FILEDATAorFILE ){
-                       if( FILEDATAorFILE instanceof FileClass ){
-                               return FILEDATAorFILE.getUID();
-                       };
-                       
-                       var uid = Util.getIndex( FILEDATA_RESITER, FILEDATAorFILE );
-                       if( uid === -1 ){
-                               uid = FILEDATA_RESITER.length;
-                               FILEDATA_RESITER.push( FILEDATAorFILE );
-                       };
-                       return uid;
-               },
-               getFileDataAccess: function( UIDorFILEorFILEDATA ){
-                       var _uid, _data = FILE_CONTROLER.getFileData( UIDorFILEorFILEDATA ), _access;
-
-                       if( _data === null || typeof _data !== 'object' ) return null;
-                       for( var i=0, l = FILEDATA_ACCESS.length; i<l; ++i ){
-                               _access = FILEDATA_ACCESS[ i ];
-                               if( _access.DATA === _data ) return _access;
-                       };
-                       return null;
-               },      
-               getFileData: function( UIDorFILEorFILEDATA ){
-                       if( typeof UIDorFILEorFILEDATA === 'number' ){
-                               return FILEDATA_RESITER[ UIDorFILEorFILEDATA ] || null;
-                       } else
-                       if( UIDorFILEorFILEDATA instanceof FileClass ){
-                               return FILEDATA_RESITER[ UIDorFILEorFILEDATA.getUID() ] || null;
-                       } else
-                       if( Util.getIndex( FILEDATA_RESITER, UIDorFILEorFILEDATA ) !== -1 ){
-                               return UIDorFILEorFILEDATA;
-                       };
-                       return null;
-               },
-               getChildren: function( UIDorFILEorFILEDATA ){
-                       var _data = FILE_CONTROLER.getFileData( UIDorFILEorFILEDATA );
-                       return _data !== null ? _data.children || null : null;
-               },
-               getDriver: function( _file ){
-                       var _data = FILE_CONTROLER.getFileData( _file );
-                       return _data !== null && _data.driver ? _data.driver : BASE_DRIVER;
-               },
-               getUpdateFlag: function( _file, _bit ){
-                       var _driver = FILE_CONTROLER.getDriver( _file ),
-                               _policy;
-                       if( typeof _driver.getUpdatePolicy === 'function' ){
-                               _policy = _driver.getUpdatePolicy( _file );
-                               
-                       }
-                       if( typeof _policy !== 'number' ) {
-                               _policy = BASE_DRIVER.getUpdatePolicy( _file )
-                       }
-                       return _policy % ( _bit * 2 ) >= _bit;
-               },
-               move: function( _prentUID, _targetfile, _newFolder, _newIndex, _opt_callback ){
-                       var _parentData = FILE_CONTROLER.getFileDataAccess( _prentUID ),
-                               _parentType = _parentData.TYPE,
-                               _targetData = FILE_CONTROLER.getFileDataAccess( _targetfile ),
-                               _targetType = _targetData.TYPE;
-               },
-               replace: function( _uid, _file, _newIndex ){
-                       
-               },
-               addEventListener: function( FILEorNULL, _eventType, _callback, opt_thisObject ){
-                       var _uid = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL;
-                       EVENT_LISTENER_REGISTER.push( new FileEventTicket( _uid, _eventType, _callback, opt_thisObject ));
-               },
-               removeEventListener: function( FILEorNULL, eventType, callback ){
-                       var uid  = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL,
-                               list = EVENT_LISTENER_REGISTER,
-                               i    = 0,
-                               ticket;
-                       for( ; i < list.length; ){
-                               ticket = list[ i ];
-                               if( ticket.fileUID === uid && ticket.eventType === eventType && ticket.callBack === callback ){
-                                       list.splice( i, 1 );
-                                       ticket.kill();
-                               } else {
-                                       ++i;
-                               };
-                       };
-               },
-               getTreeAccess: function(){
-                       
-               },
-               fileEventRellay: function( _uid, _event ){
-                       var _fileAccess = FILE_CONTROLER.getFileDataAccess( _uid );
-                       if( _fileAccess === null ) return;
-                       var _treeUID    =  _fileAccess.TREE.getUID(),
-                               _treeAccess = TREE_ACCESS_ARRAY[ _treeUID ],
-                               _data       = _fileAccess.DATA,
-                               _tree;
-                       if( !_treeAccess ) return;
-                       _treeAccess.dispatchFileEvent( _event );
-                       for( var i=0, l = TREE_ARRAY.length; i<l; ++i ){
-                               if( i !== _treeUID ){
-                                       _tree = TREE_ARRAY[ i ];
-                                       if( FILE_CONTROLER.getFileData( _tree.getCurrentFile() ) === _data ){
-                                               _treeAccess = TREE_ACCESS_ARRAY[ _tree.getUID() ];
-                                               _treeAccess && _treeAccess.dispatchFileEvent( _event );
-                                       };
-                               };
-                       };
-               }
-       };
-       
-       var TreeClass = function( apiuser, rootFileData ){
-               var PARENT_FILE_RESITER = [],
-                       ACCESS = {
-                               apiuser          : apiuser,
-                               dispatchFileEvent: dispatchFileEvent
-                       },
-                       EVENT_LISTENER_ARRAY = [],
-                       instance             = this,
-                       rootFile             = new FileClass( instance, null, rootFileData ),
-                       currentFile          = rootFile;
-               
-               currentFile.getSeqentialFiles();
-               TREE_ACCESS_ARRAY.push( ACCESS );
-               
-               function dispatchFileEvent( e ){
-                       var _eventType  = e.eventType,
-                               _targetFile = e.targetFile,
-                               _uid        = _targetFile.getUID(),
-                               _ticket, _type, _callback;
-                       for( var i=0, l = EVENT_LISTENER_REGISTER.length; i<l; ++i ){
-                               _ticket   = EVENT_LISTENER_REGISTER[ i ];
-                               _type     = _ticket.eventType;
-                               _callback = _ticket.callBack;
-                               if( _eventType === _type && _uid === _ticket.fileUID ){
-                                       AsyncCall.add( apiuser, _callback, [ _eventType, _targetFile, e.key, e.value ], _ticket.thisObject || _targetFile );
-                               } else
-                               if( _type === Const.TREE.EVENT.UPDATE && _eventType === Const.FILE.EVENT.GET_SEQENTIAL_FILES ){
-                                       //_callback( _eventType, _targetFile );
-                                       AsyncCall.add( apiuser, _callback, [ _eventType, _targetFile ], _ticket.thisObject || instance );
-                               };
-                       };
-               };
-               
-               this.getUID = function(){
-                       return Util.getIndex( TREE_ACCESS_ARRAY, ACCESS );
-               };
-               this.getRootFile = function(){
-                       return rootFile;
-               };
-               this.getCurrentFile = function(){
-                       return currentFile;
-               };
-               this.hierarchy = function(){
-                       return PARENT_FILE_RESITER.length;
-               };
-               this.getParentFileAt = function( _index ){
-                       var l = PARENT_FILE_RESITER.length;
-                       if( typeof _index !== 'number' || _index < 0 || _index >= l ) return null;
-                       return PARENT_FILE_RESITER[ l -1 -_index ];
-               };
-               this.down = function( _index ){
-                       if( typeof _index !== 'number' || _index < 0 || _index >= currentFile.getChildFileLength()) return;
-                       PARENT_FILE_RESITER.unshift( currentFile );
-                       currentFile = currentFile.getChildFileAt( _index );
-                       currentFile.getSeqentialFiles();
-                       return currentFile;
-               };
-               this.up = function( _index ){
-                       var l = PARENT_FILE_RESITER.length;
-                       if( l === 0 ) return null;
-                       
-                       if( currentFile ){
-                               var _currentFile = currentFile;
-                               currentFile = null;
-                               _currentFile.destroy();
-                       };
-                       if( typeof _index === 'number' ){
-                               if( _index >= l ) return null;
-                               currentFile = this.getParentFileAt( _index );
-                               PARENT_FILE_RESITER.splice( 0, l -_index);
-                       } else {
-                               currentFile = PARENT_FILE_RESITER.shift();
-                       };
-                       currentFile.getSeqentialFiles();
-                       return currentFile;     
-               };
-               this.addTreeEventListener = function( _eventType, _callback, opt_thisObject ){
-                       FILE_CONTROLER.addEventListener( null, _eventType, _callback, opt_thisObject );
-               };
-               this.removeTreeEventListener = function( _eventType, _callback ){
-                       FILE_CONTROLER.removeEventListener( null, _eventType, _callback );
-               };
-               this.destroy = function( _apiuser ){
-                       if( _apiuser && apiuser !== _apiuser ) return false;
-                       // removeEvent
-                       var _currentFile = currentFile;
-                       currentFile = rootFile = rootFileData = null;
-                       // currentFile, rootFile を null にしないと .File.destroy() ができない.
-                       _currentFile.destroy();
-                       while( PARENT_FILE_RESITER.length > 0 ){
-                               _currentFile = PARENT_FILE_RESITER.shift();
-                               _currentFile.destroy();
-                       };
-                       
-                       AsyncCall.remove( apiuser );
-                       instance = apiuser = null;
-                       return true;
-               };
-       };
-       
-       var FileEventTicket = Class.create(
-               Class.POOL_OBJECT, {
-               Constructor : function( uid, eventType, callback, opt_thisObject ){
-                       this.fileUID    = uid;
-                       this.eventType  = eventType;
-                       this.callBack   = callback;
-                       this.thisObject = opt_thisObject;
-               }       
-       });
-       
-       var FileEventClass = function( eventType, file, key, value ){
-               this.eventType        = eventType;
-               this.targetFile       = file;
-               this.updatedAttribute = key;
-               this.updatedValue     = value;
-       };
-
-/*
- * file の data は object で保持している。
- * File の外からファイルをみるときは、FileClassを通して操作する。
- * fileの変更、それに付随して追加されたイベントは、TreeClassで管理される。
- * treeがdestryされると、fileのイベントリスナーも全て削除される。
- * 他の tree も data の共通する currentFile に対してのみは、file の変更イベントを受け取って流す.
- * 
- */
-       
-       var FileClass = function( tree, parentData, data ){
-               var uid = FILE_CONTROLER.getFileUID( data );
-               
-               FILEDATA_ACCESS.push( {
-                       TREE:                           tree,
-                       parentData:                     parentData,
-                       DATA:                           data
-               } );
-               
-               tree = parentData = data = null;
-
-               this.getUID = function(){
-                       return uid;
-               };
-       };
-       
-       FileClass.prototype = {
-               isChildFile: function( _FILEorFILEDATA ){
-                       return this.getChildFileIndex( _FILEorFILEDATA) !== -1;
-               },
-               getSeqentialFiles: function(){
-                       var _driver = FILE_CONTROLER.getDriver( this );
-                       if( _driver !== null && typeof _driver.getSeqentialFiles === 'function' ){
-                               _driver.getSeqentialFiles( this );
-                       }
-               },
-               addEventListener: function( _eventType, _callback ){
-                       FILE_CONTROLER.addEventListener( this, _eventType, _callback );
-               },
-               removeEventListener: function( _eventType, _callback ){
-                       FILE_CONTROLER.removeEventListener( this, _eventType, _callback );
-               },
-               dispatchEvent: function( e ){
-                       e instanceof FileEventClass && FILE_CONTROLER.fileEventRellay( this.getUID(), e );
-               },
-               getChildFileLength: function(){
-                       var children = FILE_CONTROLER.getChildren( this );
-                       return Type.isArray( children ) === true ? children.length : -1;
-               },
-               getChildFileIndex: function( _FILEorFILEDATA ){
-                       var children = FILE_CONTROLER.getChildren( this );
-                       if( Type.isArray( children ) === false ) return -1;
-                       var l = children.length,
-                               _fileData = FILE_CONTROLER.getFileData( _FILEorFILEDATA );
-                       if( _fileData === null ) return -1;
-                       for( var i=0; i<l; ++i ){
-                               if( children[ i ] === _fileData ) return i;
-                       }
-                       return -1;
-               },
-               getChildFileAt: function( _index ){
-                       var _access = FILE_CONTROLER.getFileDataAccess( this ),
-                               _children = FILE_CONTROLER.getChildren( this );
-                       if( typeof _index !== 'number' || _index < 0 || Type.isArray( _children ) === false || _index >= _children.length ) return null;
-                       var _file = new FileClass( _access.TREE, _access.DATA, _children[ _index ]);
-                       // _file.init();
-                       return _file;
-               },
-               getName: function(){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.getName === 'function'){
-                               return driver.getName( this );
-                       }
-                       return BASE_DRIVER.getName( this );
-               },
-               getThumbnail: function(){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.getThumbnail === 'function'){
-                               return driver.getThumbnail( this );
-                       }
-                       return BASE_DRIVER.getThumbnail( this );
-               },
-               getType: function(){
-                       var _data = FILE_CONTROLER.getFileData( this );
-                       return typeof _data.type === 'number' ? _data.type : Const.FILE.TYPE.UNKNOWN;
-               },
-               getState: function(){
-                       var _data = FILE_CONTROLER.getFileData( this );
-                       return typeof _data.state === 'number' ? _data.state : Const.FILE.STATE.OK;
-               },
-               getSummary: function(){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.getSummary === 'function'){
-                               return driver.getSummary( this );
-                       }
-                       return BASE_DRIVER.getSummary( this );
-               },
-               isWritable: function(){
-                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.WRITE );
-               },
-               isSortable: function(){
-                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.SORT );
-               },              
-               isCreatable: function(){
-                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.CREATE );
-               },
-               isRenamable: function(){
-                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.RENAME );
-               },
-               isDeletable: function(){
-                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.DELETE );
-               },
-               read: function(){
-                       // simpleDeepCopy
-                       var driver = FILE_CONTROLER.getDriver( this ),
-                               data;
-                       if( Type.isFunction( driver.read ) === true ){
-                                data = driver.read( this );
-                       };
-                       return BASE_DRIVER.read( data || this );
-               },
-               write: function( _newData, _onUpdateFunction ){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.write === 'function' ){
-                               return driver.write( this, _newData, _onUpdateFunction );
-                       };
-                       return BASE_DRIVER.write( this, _newData, _onUpdateFunction );
-               },
-               viewerApplicationList: function(){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.viewerApplicationList === 'function' ){
-                               return driver.viewerApplicationList( this );
-                       };
-                       return BASE_DRIVER.viewerApplicationList( this );
-               },
-               editorApplicationList: function(){
-                       var driver = FILE_CONTROLER.getDriver( this );
-                       if( typeof driver.editorApplicationList === 'function' ){
-                               return driver.editorApplicationList( this );
-                       };
-                       return BASE_DRIVER.viwerApps( this );
-               },
-               create: function(){
-                       
-               },
-               sort: function(){
-                       
-               },
-               onCopy: function(){
-                       
-               },
-               onDelete: function(){
-                       
-               },
-               move: function( _newFolder, _newIndex, opt_callback ){
-                       var _access = FILE_CONTROLER.getFileDataAccess( this );
-                       _access.TREE.move( _access.parentData, this.getUID(), _newFolder, _newIndex, opt_callback );
-               },
-               replace: function( _newIndex, opt_callback ){
-                       var _access = FILE_CONTROLER.getFileDataAccess( this );
-                       _access.TREE.replace( _access.parentData, this.getUID(), _newIndex, opt_callback);
-               },
-               /**
-                * サーチ
-                * 探しているファイルの属性と値を指定.一致する child の index を配列で返す.
-                */
-               search: function( obj, rule ){
-                       var _children = FILE_CONTROLER.getChildren( this ),
-                               _child,
-                               ret = [], k, c;
-                       for( var i=0, l=_children.length; i<l; ++i ){
-                               _child = _children[ i ];
-                               c = true;
-                               for( k in obj ){
-                                       if( obj[ k ] !== _child[ k ] ){
-                                               c = false;
-                                               break;
-                                       }
-                               }
-                               c === true && ret.push( i );
-                       }
-                       return ret;
-               },
-               destroy: function(){
-                       var _access = FILE_CONTROLER.getFileDataAccess( this );
-                       var _tree = _access.TREE;
-                       if( _tree.getCurrentFile() === this ) return;
-                       if( _tree.getRootFile() === this ) return;
-                       for( var i=0, l = _tree.hierarchy(); i<l; ++i ){
-                               if( _tree.getParentFileAt( i ) === this ){
-                                       return;
-                               }
-                       }
-                       var _index = Util.getIndex( FILEDATA_ACCESS, _access );
-                       if( _index === -1 ) return;
-                       // event の 削除
-                       FILEDATA_ACCESS.splice( _index, 1 );
-                       delete _access.DATA;
-                       delete _access.TREE;
-                       delete _access.parentData;
-               }
-       };
-
-       /*
-        * FileDriverBase
-        */
-       var FileDriverBase = function( driverClass ){
-               this.getUID = function(){
-                       return Util.getIndex( API_USER_LIST, driverClass );
-               };
-               this.getSeqentialFiles = function( _file ){
-               };
-               this.getName = function( _file ){
-                       var _data = FILE_CONTROLER.getFileData( _file );
-                       return _data.name || 'No Name';
-               };
-               this.getThumbnail = function( _file ){
-                       var _data = FILE_CONTROLER.getFileData( _file ),
-                               _type = _data.type,
-                               _className = '';
-                       if( _type === Const.FILE.TYPE.FOLDER ){
-                               _className = 'folder';
-                       } else
-                       if( _type === Const.FILE.TYPE.IMAGE ){
-                               
-                       } else
-                       if( _type === Const.FILE.TYPE.TEXT ){
-                               
-                       } else
-                       if( _type === Const.FILE.TYPE.HTML ){
-                               
-                       } else
-                       if( _type === Const.FILE.TYPE.CSV ){
-                               
-                       } else
-                       if( _type === Const.FILE.TYPE.JSON ){
-                               
-                       } else
-                       if( _type === Const.FILE.TYPE.XML ){
-                               
-                       };
-                       return {
-                               image:          null,
-                               className:      ' file-type-' + _className
-                       };
-               };
-               this.getSummary = function( _file ){
-                       var _data = FILE_CONTROLER.getFileData( _file ),
-                               _type = _data.type;
-                       if( _type === Const.FILE.TYPE.FOLDER ){
-                               return 'folder';
-                       } else
-                       if( _type === Const.FILE.TYPE.IMAGE ){
-                               return 'image file';
-                       } else
-                       if( _type === Const.FILE.TYPE.TEXT ){
-                               return 'text file';
-                       } else
-                       if( _type === Const.FILE.TYPE.HTML ){
-                               return 'html document file';
-                       } else
-                       if( _type === Const.FILE.TYPE.CSV ){
-                               return 'csv daat file';
-                       } else
-                       if( _type === Const.FILE.TYPE.JSON ){
-                               return 'json data file';
-                       } else
-                       if( _type === Const.FILE.TYPE.XML ){
-                               return 'xml data file';
-                       }
-                       return '';
-               };
-               this.getUpdatePolicy = function( _file ){
-                       // debug用 全てのメニューを許可
-                       return Const.FILE.UPDATE_POLICY.DSRWC;
-               };
-               this.read = function( FILEorDATA ){
-                       var data,
-                               protects = Const.FILE.DATA_PROPERTY_RESERVED,
-                               objSrc   = [],
-                               objCopy  = [],
-                               getIndex = Util.getIndex;                       
-                       if( FILEorDATA instanceof FileClass ){
-                               data = FILE_CONTROLER.getFileData( FILEorDATA )
-                       } else {
-                               data = FILEorDATA;
-                       };
-                       
-                       function clone( src ) {
-                               var ret, i, key;
-                               if( Type.isArray( src ) === true ){
-                                       i = getIndex( objSrc, src );
-                                       if( i !== -1 ) return objCopy[ i ];
-                                       ret = [];
-                                       objSrc[ objSrc.length ]   = src;
-                                       objCopy[ objCopy.length ] = ret;
-                               } else
-                               if( Type.isObject( src ) === true ){
-                                       i = getIndex( objSrc, src );
-                                       if( i !== -1 ) return objCopy[ i ];
-                                       ret = {};
-                                       objSrc[ objSrc.length ]   = src;
-                                       objCopy[ objCopy.length ] = ret;
-                               } else
-                               if( Type.isNumber( src ) === true || Type.isString( src ) === true || Type.isBoolean( src ) === true ){
-                                       return src;
-                               } else {
-                                       return src;
-                               };
-                               for( key in src ){
-                                       if( getIndex( protects, key ) === -1 ){
-                                               ret[ key ] = clone( src[ key ]);
-                                       };
-                               };
-                               return ret;
-                       };                              
-                       return clone( data );
-               };
-               this.write = function( _file, _newData, _onUpdateFunction ){
-                       var _data = FILE_CONTROLER.getFileData( _file ),
-                               _type = _data.type;
-                       return false;
-               };
-               this.viewerApplicationList = function(){
-                       return [];
-               };
-               this.editorApplicationList = function(){
-                       return [];
-               };
-               this.onCreate = function(){
-                       
-               };
-               this.onSort = function(){
-                       
-               };
-               this.onCopy = function(){
-                       
-               };
-               this.onDelete = function(){
-                       
-               };
-       };
-       
-       var BASE_DRIVER   = new FileDriverBase();
-       
-       var ROOT_FILEDATA = {
-                       name:           'system root',
-                       type:           FILE_TYPE_IS_FOLDER,
-                       children:       []
-               },
-               SYSTEM_TREE = FILE_CONTROLER.createTree( SUPER_USER_KEY, ROOT_FILEDATA ),
-               ROOT_FILE   = SYSTEM_TREE.getRootFile();
-
-       function createFileTypeID(){
-               return ++numFileType;
-       };
-       
-       var FileAPIClass = function( driver ){
-               var constObject;
-               this.createFolderUnderRoot = function( _fileData ){
-                       if( _fileData !== null && Type.isObject( _fileData ) === true ){
-                               ROOT_FILEDATA.children.push( _fileData );
-                               ROOT_FILE.dispatchEvent( new FileEventClass( Const.FILE.EVENT.GET_SEQENTIAL_FILES, ROOT_FILE, 'children', null ));
-                       }
-               };
-               this.createFileEvent   = function( _eventType, _file, _key, _value ){
-                       return new FileEventClass( _eventType, _file, _key, _value );
-               };
-               this.createFileTypeID  = createFileTypeID;
-               this.getFileDataAccess = FILE_CONTROLER.getFileDataAccess;
-               this.getFileData       = FILE_CONTROLER.getFileData;
-               this.getJson           = function( _data, _url, _onLoad, _onError ){
-                       REQUEST_CONTROLER.getJson( driver, _data, _url, _onLoad, _onError );
-               };
-               this.createTree        = function( _rootFile ){
-                       return FILE_CONTROLER.createTree( driver, _rootFile );
-               };
-               this.isTreeInstance    = function( _tree ){
-                       return _tree instanceof TreeClass;
-               };
-               this.isFileInstance    = function( _file ){
-                       return _file instanceof FileClass;
-               };
-               this.isFileEvent       = function( _event ){
-                       return _event instanceof FileEventClass;
-               };
-               this.getConst          = function(){
-                       return Const; // constObject = constObject || clone( Const )
-               };
-       };
-       
-       return {
-               registerDriver: function( _class ){
-                       _class.prototype = new FileDriverBase( _class );
-                       var _driver = new _class();
-                       
-                       DRIVER_LIST.push( _driver );
-                       API_USER_LIST.push( _class );
-
-                       return new FileAPIClass( _driver );
-               },
-               isDriver: function( _driver ){
-                       return _driver instanceof FileDriverBase;
-               },
-               isTreeInstance: function( _tree ){
-                       return _tree instanceof TreeClass;
-               },
-               isFileInstance: function( _file ){
-                       return _file instanceof FileClass;
-               }
-       }
-})();
-
-
-/* ----------------------------------------------------
- * ApplicationManager
- * window resize event, overlayApplication currentAplication に流す
- */    
-
-var APPLICATION_LIST = [];
-
-var ApplicationPrivateData = function(){};
-ApplicationPrivateData.prototype = {
-       appClass      : null,
-       application   : null,
-       displayName   : null,
-       isOverlay     : false,
-       rootElement   : null,
-       bgColor       : '#C1CACF',
-       uiList        : null,
-       formList      : null,
-       finderList    : null,
-       styleCursor   : null,
-       eventRoot     : null,
-       fetchResource : 0,
-       bootParams    : null,
-       phase         : 0,
-       cursor        : '',
-       w             : 0,
-       h             : 0,
-       init          : function( appClass, displayName, isOverlay ){
-               this.appClass    = appClass;
-               // this.application = app;
-               this.displayName = displayName;
-               this.isOverlay   = isOverlay;
-               this.rootElement = document.createElement( 'div' );
-               this.styleCursor = this.rootElement.style;
-               ApplicationPrivateData.list.push( this );
-       },
-       detect : function(){
-               if( this.rootElement.firstChild && this.fetchResource === 0 ){
-                       SystemTimer.remove( this.application, this.detect );
-                       this.onOpen();
-               };
-       },
-       onOpen : function(){
-               this.rootElement.style.display = '';
-               
-               // this.layer !== null && this.layer.onResize( this.w, this.h );
-               
-               if( this.application.MIN_WIDTH > this.w || this.application.MIN_HEIGHT > this.h ){
-                       if( Type.isHTMLElement( this.rootElement ) === true ){
-                               // 小さすぎる!、と表示
-                       };
-               };
-               if( this.bootParams.length > 2 ){
-                       this.application.onOpen.apply( this.application, this.bootParams );
-               } else {
-                       this.application.onOpen( this.w, this.h );
-               };
-               this.phase = 4; 
-       },
-       fetchResourceComplete : function(){
-               --this.fetchResource;
-       }
-};
-ApplicationPrivateData.list = [];
-ApplicationPrivateData.get = function( app ){
-       var list = ApplicationPrivateData.list,
-               i    = list.length;
-       for( ; i; ){
-               if( app instanceof list[ --i ].appClass ) return list[ i ];
-       };
-       return null;
-};
-
-var AbstractApplication = function( appClass, displayName, isOverlay ){
-       ( new ApplicationPrivateData() ).init( appClass, displayName, isOverlay );
-};
-AbstractApplication.prototype = {
-       getUID : function(){
-               var data = ApplicationPrivateData.get( this );
-               return Util.getIndex( API_USER_LIST, data.appClass );
-       },
-       init : function(){
-               var data = ApplicationPrivateData.get( this );
-               // this.rootElement = data.rootElement;
-               // data.application = this;
-               data.phase = 1;
-               data.appClass === Page.appClass && Page.show();
-               this.onInit();
-               data.phase = 2;
-       },
-       open : function( w, h /*, _option */ ){
-               var data = ApplicationPrivateData.get( this );
-               data.phase      = 3;
-               data.bootParams = Util.copyArray( arguments );
-               data.w          = w;
-               data.h          = h;
-               if( data.rootElement.innerHTML && data.rootElement.innerHTML.length > 0 ){
-                       SystemTimer.add( this, data.detect, 16, false, data );
-               } else {
-                       data.onOpen();
-               };
-       },
-       resize : function( w, h ){
-               var data = ApplicationPrivateData.get( this );
-               if( data.phase !== 4 ) return;
-               if( this.MIN_WIDTH > w || this.MIN_HEIGHT > h ){
-                       if( Type.isHTMLElement( this.rootElement ) === true ){
-                               // 小さすぎる!、と表示
-                       };
-                       return;
-               };
-               this.onPaneResize( w, h );
-       },
-       close : function(){
-               var data = ApplicationPrivateData.get( this );
-               data.phase = 5;
-               if( this.onClose() === false ){
-                       return false;
-               };
-               if( data.uiList ){ 
-                       while( data.uiList.length > 0 ) data.uiList.shift().destroy();
-               };
-               if( data.finderList ){
-                       while( data.finderList.length > 0 ) data.finderList.shift().destroy();
-               };              
-               
-               data.eventRoot && PointingDeviceEventTree.destroyTree( data.eventRoot );
-               MouseEvent.remove( this );
-               KeyEvent.remove( this );
-               SystemTimer.remove( this );
-               AsyncCall.remove( this );
-               StyleSheet.unload( this );
-
-               var elm = this.rootElement;
-               Util.removeAllChildren( elm );
-               elm.parentNode.removeChild( elm );
-               
-               Application.shutdown( this, data.isOverlay );
-               
-               data.appClass === Page.appClass && Page.hide();
-
-               data.phase = 6;
-               
-               var list = ApplicationPrivateData.list;
-               list.splice( Util.getIndex( list, data ), 1 );
-       },
-       createUIGroup : function( node ){
-               var data = ApplicationPrivateData.get( this ),
-                       ui = UI.createUIGroup( this, node );
-               if( data.uiList === null ) data.uiList = [];
-               data.uiList.push( ui );
-               return ui;
-       },
-       createUIForm : function( nodeOrElm, opt_elmForm ){
-               var data = ApplicationPrivateData.get( this ),
-                       form = UIForm.createForm( this, nodeOrElm, opt_elmForm );
-               if( data.formList === null ) data.formList = [];
-               data.formList.push( form );
-               return form;
-       },
-       createFinder : function( _elmTarget, _tree, _onSelect, _viewerOption, _editorOption ){
-               var data   = ApplicationPrivateData.get( this ),
-                       finder = Finder.create( this, _elmTarget, _tree, _onSelect, _viewerOption, _editorOption );
-               if( data.finderList === null ) data.finderList = [];
-               data.finderList.push( finder );
-               return finder;
-       },
-       createDHTML : function( _elm ){
-               return DHTML.create( this, _elm );
-       },
-       addEventListener : function( element, eventType, handler, opt_thisObject ){
-               MouseEvent.add( this, element, eventType, handler, opt_thisObject );
-       },
-       removeEventListener : function( element, eventType, handler ){
-               MouseEvent.remove( this, element, eventType, handler );
-       },
-       getPointingDeviceEventTreeRoot : function(){
-               var data = ApplicationPrivateData.get( this );
-               if( data.phase === 1 ){
-                       data.eventRoot   = PointingDeviceEventTree.create( this );
-                       data.styleCursor = PointingDeviceEventTree._getNodePrivateData( data.eventRoot ).elmMouseCatch.style;
-               };              
-               return data.eventRoot;
-       },
-       updateCoursor : function( _cursor ){
-               var data = ApplicationPrivateData.get( this );
-               if( data.cursor !== _cursor ){
-                       data.styleCursor.cursor = data.cursor = _cursor;
-               };
-       },
-       fetchCSS : function( url, opt_onload, opt_onerror ){
-               var data = ApplicationPrivateData.get( this );
-               if( data.phase === 1 ){
-                       ++data.fetchResource;
-                       StyleSheet.load( this, url, data.fetchResourceComplete, data.fetchResourceComplete, data );
-               };
-       },
-       onInit : function(){},
-       onOpen : function(){},
-       onClose : function(){ return true; },
-       onPaneResize : function( w, h ){},
-       addKeyEventListener : function( _eventType, _handler, _keyCode, _shift, _ctrl ){
-               KeyEvent.add( this, _eventType, _handler, _keyCode, _shift, _ctrl );
-       },
-       removeKeyEventListener : function( _eventType, _handler, _keyCode, _shift, _ctrl ){
-               KeyEvent.remove( this, _eventType, _handler, _keyCode, _shift, _ctrl );
-       },
-       shiftEnabled : function(){
-               return KeyEvent.shiftEnabled;
-       },
-       ctrlEnabled : function(){
-               return KeyEvent.ctrlEnabled;
-       },
-       addTimer : function( handler, time, once ){
-               SystemTimer.add( this, handler, time, !!once );
-       },
-       removeTimer : function( handler ){
-               SystemTimer.remove( this, handler );
-       },
-       addAsyncCall : function( _callback, _argments, _thisObject ){
-               AsyncCall.add( this, _callback, _argments, _thisObject );
-       },
-       removeAsyncCall : function( _callback ){
-               AsyncCall.remove( this, _callback );
-       },
-       fetchHTMLElement : function( id ){
-               var elm = document.getElementById( id );
-               if( elm ){
-                       elm.removeAttribute( 'id' );
-                       elm.parentNode.removeChild( elm );
-                       return elm;
-               };
-       }
-};
-
-var PointingDeviceEventTree = ( function(){
-       var ROOT_LIST       = [],
-               currentRootData = null,
-               targetNodeData  = null,
-               forceNodeData   = null,
-               hoverList       = [];
-       
-       function eventRellay( e ){
-               var data = forceNodeData, // || targetNodeData,
-                       x    = e.clientX,
-                       y    = e.clientY,
-                       type = e.type,
-                       list = hoverList,
-                       i    = 0,
-                       ret, systemOnly = false, addClass, removeClass,
-                       parent;
-               if( data && data.dispatchEvent( e, type, true ) === true ) return false;
-               if( currentRootData === null ) return;
-               targetNodeData = currentRootData;
-               currentRootData._capcher( x, y );
-               targetNodeData.apiuser.updateCoursor( targetNodeData._cursor );
-               data = targetNodeData;
-               while( data ){
-                       ret = data.dispatchEvent( e, type, true, systemOnly );
-                       if( ret === true || ret === false ) break; // systemOnly = true;
-                       data = data.parentData;
-               };
-               
-               addClass    = Util.addClass;
-               removeClass = Util.removeClass;
-               for( ; i < list.length; ){
-                       parent = data = list[ i ];
-                       while( parent.parentData && parent === parent.parentData.hitChild ){
-                               parent = parent.parentData;
-                       };
-                       if( parent !== currentRootData ){
-                               data.hover === true && removeClass( data.elm, data.hoverClass );
-                               delete data.isHover;
-                               data.events && data.events.mouseout && data.fire( e, 'mouseout', false );
-                               delete data.hitSelf;
-                               list.splice( i, 1 );
-                               continue;
-                       };
-                       if( data.hover === true && data.isHover === false ){
-                               addClass( data.elm, data.hoverClass );
-                               data.isHover = true;
-                       };
-                       if( data.hitSelf === false ){
-                               data.events && data.events.mouseover && data.fire( e, 'mouseover', true );
-                               data.hitSelf = true;
-                       };
-                       ++i;
-               };
-               return false;
-       };      
-       
-       var NodeClass = function( apiuser, rootData, /*parentLayer,*/ parentData, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop ){
-               ( new NodePrivateData() ).init( apiuser, rootData, /*parentLayer,*/ parentData, this, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop );
-       };
-       NodeClass.prototype = {
-               createNode : function( rangeOrElmData, through, clip, hover, cursor, scroll, dragdrop ){
-                       var data = NodePrivateData.get( this ),
-                               elm;
-                       if( Type.isHTMLElement( rangeOrElmData ) === true ){
-                               elm = rangeOrElmData;
-                       } else
-                       if( Type.isString( rangeOrElmData ) === true ){
-                               elm = document.getElementById( rangeOrElmData );
-                               if( !elm ){
-                                       elm = Util.pullHtmlAsTemplete( rangeOrElmData );
-                               };
-                               if( !elm || Type.isHTMLElement( elm ) === false || elm.nodeType !== 1 ){
-                                       throw new Error( "invalid HTMLElement." );
-                               };
-                       } else
-                       if( Type.isObject( rangeOrElmData ) === false || Type.isFinite( rangeOrElmData.x ) === false || Type.isFinite( rangeOrElmData.y ) === false ){
-                               throw new Error( "No range" );
-                       };
-                       
-                       if( elm && data.elm === null ){
-                               throw new Error( "MetaLayer don't containe HTMLElement-Layer." );
-                       };
-                       if( data.elm && data.elm.style.hasLayout === false ){
-                               throw new Error( "[ie] OffsetParent is hasLayout === false." );
-                       };
-                       
-                       var newNode = new NodeClass( data.apiuser, data.rootData, data, elm || rangeOrElmData, through, clip, hover, cursor, scroll, dragdrop ),
-                               newData = NodePrivateData.get( newNode );
-                       
-                       if( data.childData === null ) data.childData = [];
-                       data.childData.push( newData );
-                       return newNode;
-               },
-               createNodeAt : function(){
-               },
-               remove : function(){
-                       NodePrivateData.get( this ).remove();
-               },
-               nodeIndex : function( v ){
-                       return NodePrivateData.get( this ).nodeIndex( v );
-               },
-               numNode : function(){
-                       return NodePrivateData.get( this ).numNode();
-               },
-               disabled : function( v ){
-                       return NodePrivateData.get( this ).disabled( v );
-               },
-               childrenDisabled : function( v ){
-                       return NodePrivateData.get( this ).disabled( v );
-               },
-               mesure : function(){
-                       NodePrivateData.get( this ).mesure();
-               },
-               mesureChildren : function(){
-                       NodePrivateData.get( this ).mesureChildren();
-               },
-               update : function( x, y, w, h ){
-                       NodePrivateData.get( this ).update( x, y, w, h );
-               },
-               setPosition : function( x, y ){
-                       NodePrivateData.get( this ).setPosition( x, y );
-               },
-               setSize : function( w, h ){
-                       NodePrivateData.get( this ).setSize( w, h );
-               },
-               cursor : function( v ){
-                       return NodePrivateData.get( this ).cursor( v );
-               },
-               x : function( x ){
-                       return NodePrivateData.get( this ).positionX( x );
-               },
-               y : function( y ){
-                       return NodePrivateData.get( this ).positionY( y );
-               },
-               width : function( w ){
-                       return NodePrivateData.get( this ).width( w );
-               },
-               height : function( h ){
-                       return NodePrivateData.get( this ).height( h );
-               },
-               getAbsolutePositionX : function(){
-                       return NodePrivateData.get( this ).getAbsolutePositionX();
-               },
-               getAbsolutePositionY : function(){
-                       return NodePrivateData.get( this ).getAbsolutePositionY();
-               },
-               addEventListener : function( type, handler, opt_thisObject ){
-                       NodePrivateData.get( this ).addEventListener( type, handler, opt_thisObject );
-               },
-               removeEventListener : function( type, handler ){
-                       NodePrivateData.get( this ).removeEventListener( type, handler );
-               },
-               scrollTo : function( x, y ){
-                       NodePrivateData.get( this ).scrollTo( x, y );
-               },
-               scrollX : function( v ){
-                       return NodePrivateData.get( this ).scrollX( v );
-               },
-               scrollY : function( v ){
-                       return NodePrivateData.get( this ).scrollY( v );
-               },
-               invalidateScrollbar : function(){
-                       ScrollBarManager.update( NodePrivateData.get( this ) );
-               }
-       };
-
-       /**
-        * clip : true の場合、子ノードの変更によってヒットエリアを変化させない.elm には overflow:hidden としておくのが通常.
-        */
-       var NodePrivateData = function(){};
-       NodePrivateData.prototype = {
-               elmMouseCatch : null, // rootData only
-               eventCounter  : null, // rootData only
-               cursorStyle   : null, // rootData only
-               node          : null,
-               apiuser       : null,
-               rootData      : null,
-               elm           : null, // resizeTarget
-               elmScroll     : null,
-               elmScroller   : null,
-               elmScrollbar  : null,
-               x             : 0,
-               y             : 0,
-               w             : 0,
-               h             : 0,
-               t             : 0, // top
-               l             : 0, // left
-               b             : 0, // bottom
-               r             : 0, // right
-               absoluteX     : 0,
-               absoluteY     : 0,
-               _scrollX      : 0,
-               _scrollY      : 0,
-               scrollingX    : 0,
-               scrollingY    : 0,
-               _cursor       : '',
-               // parentLayer   : null,
-               parentData    : null,
-               childData     : null,
-               events        : null,
-               hitChild      : null,
-               hitSelf       : false,
-               _disabled     : false,
-               _childDisabled: false,
-               layoutManager : null,
-               through       : false,
-               clip          : false,
-               hover         : false,
-               hoverClass    : null,
-               isHover       : false,
-               scroll        : false,
-               dragdrop      : false,
-               tooltip       : null,
-               init: function( apiuser, rootData, /*parentLayer,*/ parentData, node, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop ){
-                       this.apiuser     = apiuser;
-                       this.rootData    = rootData || this;
-                       // this.parentLayer = parentLayer;
-                       this.parentData  = parentData;
-                       this.node        = node;
-                       this.through     = through;
-                       this.clip        = !!clip;
-                       if( cursor ) this._cursor = cursor;   
-
-                       if( Type.isHTMLElement( rangeOrElm ) === true ){
-                               this.elm        = rangeOrElm;
-                               this.hover      = !!hover;
-                               this.hoverClass = hover;
-                               this.scroll     = clip && scroll;                               
-                               this.mesure();
-                               this.scroll === true && ScrollBarManager.register( this );
-                       } else {
-                               this.update( rangeOrElm.x, rangeOrElm.y, rangeOrElm.w, rangeOrElm.h );
-                       };
-                       
-                       NodePrivateData.dataList.push( this );
-               },
-               mesure : function(){
-                       var x, y, w, h, parent, _this, _parent;
-                       if( this.elm ){
-                               w = this.elm.offsetWidth;
-                               h = this.elm.offsetHeight;
-                               _this   = Position.cumulativeOffset( this.elm );
-                               _parent = this.parentData ? Position.cumulativeOffset( this.parentData.elm ) : [ 0, 0 ];
-                               x  = _this[ 0 ] - _parent[ 0 ];
-                               y  = _this[ 1 ] - _parent[ 1 ];                         
-                               if( this.x !== x || this.y !== y || this.w !== w || this.h !== h ){
-                                       this.x = x;
-                                       this.y = y;
-                                       this.w = w;
-                                       this.h = h;
-                                       parent = this.parentData;
-                                       parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );
-                                       this._updateRectangle();
-                               };                      
-                       } else {
-                               this._updateRectangle();
-                       };
-               },
-               mesureChildren : function(){
-                       var nodes, i;
-                       if( nodes = this.childData ){
-                               for( i = nodes.length; i; ){
-                                       nodes[ --i ].mesure();
-                               };
-                       };
-               },
-               update : function( x, y, w, h ){
-                       var updateXY = false,
-                               _this, _parent,
-                               parent;
-                       
-                       if( this.elm ){
-                               // width
-                               if( Type.isFinite( w ) === true ){
-                                       this.elm.style.width = w + 'px';
-                               } else
-                               if( Type.isString( w ) === true ){
-                                       this.elm.style.width = w;
-                                       w = this.elm.offsetWidth;
-                               };
-                               //update = this.w !== w;
-       
-                               // height
-                               if( Type.isFinite( h ) === true ){
-                                       this.elm.style.height = h + 'px';
-                               } else
-                               if( Type.isString( h ) === true ){
-                                       this.elm.style.height = w;
-                                       h = this.elm.offsetHeight;
-                               };
-                               //update = update || this.h !== h;
-                               
-                               // x
-                               if( Type.isFinite( x ) === true ){
-                                       this.elm.style.left = x + 'px';
-                               } else
-                               if( Type.isString( x ) === true ){
-                                       this.elm.style.left = x;
-                                       updateXY = true;
-                               } else {
-                                       updateXY = true;
-                               };
-                               
-                               // y
-                               if( Type.isFinite( y ) === true ){
-                                       this.elm.style.top = y + 'px';
-                               } else
-                               if( Type.isString( y ) === true ){
-                                       this.elm.style.top = y;
-                                       updateXY = true;
-                               } else {
-                                       updateXY = true;
-                               };
-                               if( updateXY === true ){
-                                       _this   = Position.cumulativeOffset( this.elm );
-                                       _parent = this.parentData ? Position.cumulativeOffset( this.parentData.elm ) : [ 0, 0 ];
-                                       x       = _this[ 0 ] - _parent[ 0 ];
-                                       y       = _this[ 1 ] - _parent[ 1 ];
-                               };
-                               //update = update || this.x !== x;
-                               //update = update || this.y !== y;
-                               
-                               //update === true && this._updateRectangle();
-                               // return;
-                       };
-                       x = Type.isFinite( x ) === true ? x : this.x;
-                       y = Type.isFinite( y ) === true ? y : this.y;
-                       w = Type.isFinite( w ) === true ? w : this.w;
-                       h = Type.isFinite( h ) === true ? h : this.h;
-                       if( this.x !== x || this.y !== y ){
-                               this.x = x;
-                               this.y = y;
-                               //console.log( 'xy  ' + ( this.elm ? this.elm.id : '' ) + ' x:' + x + ' y:' + y + ' w:' + w + ' h:' + h + ' absX:' + this.parentData.absoluteX )
-                               parent = this.parentData;
-                               parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );
-                               this.w === w && this.h === h && this._updateRectangle();
-                       };
-                       if( this.w !== w || this.h !== h ){
-                               this.w = w;
-                               this.h = h;
-                               //console.log( 'wh  ' + ( this.elm ? this.elm.id : '' ) + ' x:' + x + ' y:' + y + ' w:' + w + ' h:' + h )
-                               this._updateRectangle();
-                       };
-                       
-                       ScrollBarManager.update( this );
-               },
-               _updateAbsoluteXY : function( x, y, sX, sY ){
-                       var nodes, i;
-                       this.absoluteX = x = this.x + x;
-                       this.absoluteY = y = this.y + y;
-                       if( nodes = this.childData ){
-                               for( i = nodes.length; i; ){
-                                       nodes[ --i ]._updateAbsoluteXY( x, y, this.scrollingX, this.scrollingY );
-                               };
-                       };
-               },
-               _updateRectangle : function(){
-                       var w = this.w,
-                               h = this.h,
-                               x = this.x,
-                               y = this.y,
-                               l = x,
-                               t = y,
-                               r = x + w,
-                               b = y + h,
-                               nodes = this.childData,
-                               i, node;
-                       // self;
-                       // childnodes
-                       if( this.clip === false && nodes ){
-                               for( i = nodes.length; i; ){
-                                       node = nodes[ --i ];
-                                       if( node.l + x < l ) l = x + node.l;
-                                       if( node.t + y < t ) t = y + node.t;
-                                       if( r < node.r + x ) r = x + node.r;
-                                       if( b < node.b + y ) b = y + node.b;
-                               };
-                       };
-                       // update
-                       if( b !== this.b || r !== this.r || t !== this.t || l !== this.l ){
-                               this.l = l;
-                               this.t = t;
-                               this.r = r;
-                               this.b = b;
-                               // this.w = r - x;
-                               // this.h = b - y;
-                               this.parentData && this.parentData.clip === false && this.parentData._updateRectangle();
-                               return true;
-                       };
-               },
-               setPosition : function( x, y ){
-                       this.update( x, y );
-               },
-               setSize : function( w, h ){
-                       this.update( undefined, undefined, w, h );
-               },
-               positionX : function( x ){
-                       x !== undefined && this.update( x );
-                       return this.x;
-               },
-               positionY : function( y ){
-                       y !== undefined && this.update( undefined, y );
-                       return this.y;
-               },
-               width : function( w ){
-                       w !== undefined && this.update( undefined, undefined, w );
-                       return this.w;
-               },
-               height : function( h ){
-                       h !== undefined && this.update( undefined, undefined, undefined, h );
-                       return this.h;
-               },
-               getAbsolutePositionX : function(){
-                       return this.absoluteX;
-               },
-               getAbsolutePositionY : function(){
-                       return this.absoluteY;
-               },
-               cursor : function( v ){
-                       if( Type.isString( v ) === true ){
-                               this._cursor = v;
-                               this === targetNodeData && this.apiuser.updateCoursor( v );
-                       };
-                       return this._cursor;
-               },
-               addEventListener : function( eventType, handler, opt_thisObject ){
-                       var node    = this.node,
-                               counter = this.rootData.eventCounter,
-                               list, i;
-                       if( this.events === null ) this.events = {};
-                       list = this.events[ eventType ];
-                       if( !list ){
-                               list = this.events[ eventType ] = [];
-                       } else {
-                               for( i = list.length; i; ){
-                                       if( list[ --i ].match( eventType, handler ) === true ){
-                                               return;
-                                       };
-                               };                              
-                       };
-                       list.push( new EventTicketClass( this.node, eventType, handler, opt_thisObject ) );
-                       if( eventType !== 'mouseout' && eventType !== 'mouseover' ){
-                               if( counter[ eventType ] ){
-                                       ++counter[ eventType ];
-                               } else {
-                                       //console.log( eventType );
-                                       counter[ eventType ] = 1;
-                                       MouseEvent.add( this.apiuser, this.rootData.elmMouseCatch, eventType, eventRellay );
-                               };                              
-                       };
-               },
-               removeEventListener : function( eventType, handler ){
-                       var events  = this.events,
-                               counter = this.rootData.eventCounter,
-                               type, list, i = 0;
-                       if( events === null ) return;
-                       console.log( ' *** remove ' + eventType );
-                       for( type in events ){
-                               list = events[ type ];
-                               if( eventType && eventType !== type ) continue;
-                               for( ; i < list.length; ){
-                                       if( list[ i ].destroy( type, handler ) === true ){
-                                               console.log( ' *** removed! ' + type );
-                                               list.splice( i, 1 );
-                                       } else {
-                                               ++i;
-                                       };
-                               };
-                               if( list.length === 0 ){
-                                       // delete this[ type ];
-                                       delete events[ type ];
-                               };
-                               if( counter[ type ] ){
-                                       --counter[ type ];
-                                       if( counter[ type ] === 0 ){
-                                               MouseEvent.remove( this.apiuser, this.rootData.elmMouseCatch, type, eventRellay );
-                                               delete counter[ type ];
-                                       };
-                               };
-                       };
-               },
-               _capcher : function( x, y ){
-                       var t = this, nodes, child, _x, _y, hit, i;
-                       if( t._disabled === true ) return false;
-                       delete t.hitChild;
-                       x -= t.x;
-                       y -= t.y;
-                       if( nodes = t.childData ){
-                               _x = x - t.scrollingX;
-                               _y = y - t.scrollingY;
-                               for( i = nodes.length; i; ){
-                                       child = nodes[ --i ];
-                                       if( child._disabled === false && child.l <= _x && _x < child.r && child.t <= _y && _y < child.b && child._capcher( _x, _y ) === true ){
-                                               t.hitChild = child;
-                                               break;
-                                       };
-                               };
-                       };
-                       if( t.through === true ){
-                               t.hitChild && t.hitSelf === false && hoverList.push( t );
-                               return !!t.hitChild;
-                       };
-                       hit = 0 <= x && x < t.w && 0 <= y && y < t.h;
-                       ( t.hitChild || hit ) && t.hitSelf === false && hoverList.push( t );
-                       if( hit === true && t.hitChild === null ) targetNodeData = t;
-                       return hit || !!t.hitChild;
-               },
-               fire : function( e, eventType, hit ){
-                       var list = this.events[ eventType ],
-                               i    = list.length;
-                       e = NodePrivateData.createEvent( e, eventType, this, hit );
-                       for( ; i; ) list[ --i ].fire( e );
-                       // console.log( eventType + ' x:' + x + ' y:' + y );
-               },
-               dispatchEvent : function( e, eventType, hit ){
-                       var ret, list, i, p, child;
-                       if( !this.events || !( list = this.events[ eventType ] ) ) return;
-                       
-                       child = !!this.hitChild;
-                       e = NodePrivateData.createEvent( e, eventType, this, hit );
-                       for( i = list.length; i; ){
-                               ret = list[ --i ].fire( e );
-                               if( ret === true && child === false ){
-                                       forceNodeData = this;
-                                       return true;
-                               };
-                               if( ret === false ) return false;
-                       };
-                       forceNodeData  = null;
-               },
-               scrollTo : function( x, y ){
-                       this._scrollX = x;
-                       this._scrollY = y;
-                       ScrollBarManager.update( this );
-               },
-               scrollX : function( v ){
-                       if( Type.isFinite( v ) === true ){
-                               this._scrillX = v;
-                               ScrollBarManager.update( this );
-                       };
-                       return this.scrollingX; // this._scrollX;
-               },
-               scrollY : function( v ){
-                       if( Type.isFinite( v ) === true ){
-                               this._scrillY = v;
-                               ScrollBarManager.update( this );
-                       };
-                       return this.scrollingY; // this._scrollY;
-               },
-               nodeIndex : function( v ){
-                       var list, i;
-                       if( !this.parentData ) return 0;
-                       
-                       list = this.parentData.childData;
-                       i    = Util.getIndex( list, this );
-                       if( Type.isFinite( v ) === false || i === v && v < 0 && list.length <= v ) return i;
-                       
-                       list.splice( i, 1 );
-                       list.length === v ? list.push( this ) : list.splice( v, 0, this );
-                       this._free();
-                       return v;
-               },
-               _free : function(){
-                       if( this.parentData.hitChild === this ){
-                               this.parentData.hitChild = null;
-                               this.isHover === true && hoverList.splice( Util.getIndex( hoverList, this ), 1 ) && Util.removeClass( this.elm, this.hoverClass );
-                               this.isHover = false;
-                               if( forceNodeData === this ) forceNodeData = null;
-                               if( targetNodeData  === this ) targetNodeData  = null;
-                       };                      
-               },
-               numNode : function(){
-                       return this.childData ? this.childData.length : 0;
-               },
-               disabled : function( v ){
-                       if( Type.isBoolean( v ) === true ){
-                               this._disabled = v;
-                               if( v === false ){
-                                       this._free();
-                               };
-                       };
-                       return this._disabled;
-               },
-               childrenDisabled : function( v ){
-                       if( Type.isBoolean( v ) === true ){
-                               this._childDisabled = v;
-                       };
-                       return this._childDisabled;
-               },
-               remove : function(){
-                       if( this === this.rootData ) return;
-                       var parent = this.parentData,
-                               nodes  = parent.childData;
-                       this._destroy();
-                       if( parent.hitChild === this ) delete parent.hitChild;
-                       nodes.splice( Util.getIndex( nodes, this ), 1 );
-                       if( nodes.length === 0 ) delete parent.childData;       
-                       parent.clip === false && parent._updateRectangle();
-               },
-               _destroy : function(){
-                       var nodes = this.childData,
-                               list  = NodePrivateData.dataList,
-                               node;
-                       this.removeEventListener();
-                       ScrollBarManager.remove( this );
-                       if( nodes ){
-                               while( node = nodes.shift() ) node._destroy();
-                               delete this.childData;
-                       };
-                       list.splice( Util.getIndex( list, this ), 1 );
-               }
-       };
-       NodePrivateData.dataList = [];
-       NodePrivateData.get = function( node ){
-               // if( node instanceof NodePrivateData ) return node;
-               // return NodePrivateData.dataList[ layer._getUID() ];
-               var list = NodePrivateData.dataList;
-               for( var i = list.length; i; ){
-                       if( list[ --i ].node === node ) return list[ i ];
-               };
-               return null;
-       };
-       NodePrivateData.createEvent = function( e, eventType, data, hit ){
-               var _e = {
-                       layerX      : e.clientX - data.absoluteX,
-                       layerY      : e.clientY - data.absoluteY,
-                       clientX     : e.clientX,
-                       clientY     : e.clientY,
-                       dragOffsetX : e.dragOffsetX,
-                       dragOffsetY : e.dragOffsetY,
-                       dragPhase   : e.dragPhase,                                      
-                       eventType   : eventType,
-                       hit         : hit,
-                       node        : data.node,
-                       wheelDelta  : e.wheelDelta,
-                       target      : forceNodeData ? forceNodeData.node : targetNodeData ? targetNodeData.node : null
-               };
-               return _e;
-       };
-       
-       var EventTicketClass = function( node, eventType, handler, opt_thisObject ){
-               this.node    = node;
-               this.type    = eventType;
-               this.handler = handler;
-               this.thisObj = opt_thisObject || node;
-       };
-       EventTicketClass.prototype = {
-               match : function( eventType, handler ){
-                       if( handler && this.handler !== handler ) return false;
-                       if( eventType && this.type !== eventType ) return false;
-                       return true;
-               },
-               destroy : function( eventType, handler ){
-                       if( this.match( eventType, handler ) === false ) return false;
-                       delete this.node;
-                       delete this.type;
-                       delete this.handler;
-                       delete this.thisObj;
-                       return true;
-               },
-               fire : ( function(){
-                       if( Function.prototype.call ){
-                               return function( e ){
-                                       return this.handler.call( this.thisObj, e );
-                               };                              
-                       };
-                       return function( e ){
-                               var ret;
-                               this.thisObj._currentHandler = this.handler;
-                               ret = this.thisObj._currentHandler( e );
-                               delete this.thisObj._currentHandler;
-                               return ret;                                     
-                       };
-               })()
-       };
-       
-/*-------------------------------------
- *  StayHelper
- */
-       var StayEventTicketClass = function( node, data, stayhandler, opt_thisObject ){
-               node.addEventListener( 'mouseover', this.mouseoverHandler, this );
-               this.node       = node;
-               this.data       = data;
-               this.handler    = stayhandler;
-               this.thisObject = opt_thisObject;
-       };
-       StayEventTicketClass.prototype = Util.extend( new EventTicketClass( null, 'mousestay' ), {
-               // type : 'mousestay',
-               e    : null,
-               mouseoverHandler : function( e ){
-                       this.e = NodePrivateData.createEvent( e, this.type, this.data, true );
-                       this.node.addEventListener( 'mouseout',  this.mousestayHandler, this );
-                       this.node.addEventListener( 'mousemove', this.mousemoveHandler, this );
-                       SystemTimer.add( this.data.apiuser, this.timeoutHandler, null, this );
-               },
-               timeoutHandler : function(){
-                       this.mouseoutHandler();
-                       return this.fire( this.e );
-               },
-               mousemoveHandler : function( e ){
-                       this.e = NodePrivateData.createEvent( e, this.type, this.data, true );
-                       SystemTimer.remove( this.data.apiuser, this.timeoutHandler );
-                       SystemTimer.add( this.data.apiuser, this.timeoutHandler, null, this );
-               },
-               mouseoutHandler : function( e ){
-                       this.node.removeEventListener( 'mouseout', this.mousestayHandler );
-                       this.node.removeEventListener( 'mousemove', this.mousemoveHandler );
-                       SystemTimer.remove( this.data.apiuser, this.timeoutHandler );
-                       delete this.e;
-               }
-       });
-       
-       var ScrollBarManager = ( function(){
-               var elmScroller     = document.createElement( 'div' ),
-                       elmBar          = document.createElement( 'div' ),
-                       smoothList      = [],
-                       dragPhase       = 2,
-                       dragOut         = false,
-                       currentNodeData = null,
-                       dragStartY      = 0,
-                       currentEvent;
-               
-               function tick(){
-                       var list = smoothList,
-                               i, data, y;
-                       for( i = 0; i < list.length; ){
-                               data = list[ i ];
-                               if( data.scrollingY !== data._scrollY ){
-                                       y = data.scrollingY += data.smoothY;
-                                       if( data.smoothY < 0 ){
-                                               y = y < data._scrollY ? data._scrollY : y;
-                                       } else {
-                                               y = data._scrollY < y ? data._scrollY : y;
-                                       };
-                                       data.scrollingY    = y;
-                                       data.elm.scrollTop = -y;
-                                       data.events && data.events.scroll && data.fire( currentEvent, 'scroll', true );
-                               };
-                               if( data.scrollingY === data._scrollY ){
-                                       list.splice( i, 1 );
-                                       // data.events && data.events.scroll && data.fire( currentEvent, 'scroll', true );
-                               } else {
-                                       ++i;
-                               };
-                       };
-                       list.length === 0 && SystemTimer.remove( SUPER_USER_KEY, tick );
-                       currentEvent.type = 'updateAfterScroll';
-                       AsyncCall.add( data.apiuser, eventRellay, currentEvent ); // スクロール後の更新        
-               };
-               
-               function scrollReady( e ){
-                       var data = this;
-                       
-                       dragOut = false;
-                       if( data === currentNodeData || dragPhase !== 2 ) return; // Drag中の場合は 他にスクロールを作らない
-                       currentNodeData && scrollRelease();
-
-                       dragPhase = 2;
-                       data.elm.parentNode.appendChild( elmScroller );
-                       elmScroller.appendChild( data.elm );
-                       
-                       elmScroller.style.cssText = 'position:absolute;left:0;top:0;';
-                       elmScroller.appendChild( elmBar );      
-                       
-                       data.elm.scrollTop = -data.scrollingY;
-                       data.rootData.addEventListener( 'mousewheel', onMouseWheelScroll, data );
-                       data.rootData.addEventListener( 'mousedrag',  onMouseDragScroll, data );
-                       data.addEventListener( 'mouseout',   onMouseOut, data );
-                       currentNodeData = data;
-                       ScrollBarManager.update( data );
-               };
-               function scrollRelease(){
-                       var data   = currentNodeData;
-                       var parent = elmScroller.parentNode;
-                       parent.appendChild( currentNodeData.elm );
-                       parent.removeChild( elmScroller );
-                       currentNodeData.elm.scrollTop = -data.scrollingY;
-                       
-                       data.rootData.removeEventListener( 'mousewheel', onMouseWheelScroll, data );
-                       data.rootData.removeEventListener( 'mousedrag',  onMouseDragScroll, data );
-                       data.removeEventListener( 'mouseout',   onMouseOut, data );
-                       currentNodeData = null;
-               };
-               function onMouseOut( e ){
-                       dragOut = true;
-                       console.log( 'mouseOut ' + dragPhase );
-                       dragPhase === 2 && scrollRelease(); // Dragしてのアウトの場合, scroll をリリースしない
-               };
-               function onMouseWheelScroll( e ){
-                       var data = this;
-                       this._scrollY += e.wheelDelta;
-                       ScrollBarManager.update( this );
-                       currentEvent = e;
-                       return true;
-               };
-               function onMouseDragScroll( e ){
-                       var data = this;
-                       //e.dragOffsetY;
-                       currentEvent = e;
-                       dragPhase = e.dragPhase;
-                       switch( dragPhase ){
-                               case 0:
-                                       dragStartY = this.scrollingY;
-                                       data.rootData.removeEventListener( 'mousewheel', onMouseWheelScroll, data );
-                               case 1:
-                                       this._scrollY = dragStartY + e.dragOffsetY;
-                                       ScrollBarManager.update( this );                                
-                                       return true;
-                               case 2:
-                                       dragOut === true ? scrollRelease() : data.rootData.addEventListener( 'mousewheel', onMouseWheelScroll, data );
-                                       return false;
-                       };
-               };
-               
-               return {
-                       register : function( data ){
-                               data.addEventListener( 'mouseover', scrollReady, data );
-                       },
-                       update : function( data ){
-                               // if( data !== currentNodeData ) return;
-                               var isCurrent = data === currentNodeData;
-                               
-                               var contentH = data._scrollH = data.elm.scrollHeight,
-                                       clipH    = data.h,
-                                       offsetH  = contentH - clipH,
-                                       scrollY  = data._scrollY = 0 < data._scrollY ? 0 : ( data._scrollY < -offsetH ? -offsetH : data._scrollY ),
-                                       barH, barY;
-                               if( isCurrent === true ){
-                                       elmScroller.style.width  = data.w + 'px';
-                                       elmScroller.style.height = clipH + 'px';                                        
-                               };
-                               
-                               if( offsetH < 1 ){
-                                       data._scrollY = scrollY = 0;
-                                       if( isCurrent === true ) elmBar.style.display = 'none';
-                               } else
-                               if( isCurrent === true ){
-                                       barH     = Math.floor( clipH * ( clipH / contentH ) );
-                                       barY     = Math.floor( ( clipH - barH ) * - scrollY / offsetH );
-                                       elmBar.style.cssText = [
-                                               'position:absolute;',
-                                               'width:10px;',
-                                               'background-color:#333;',
-                                               'right:2px;',
-                                               'font-size:0;line-height:0;',
-                                               'height:', barH, 'px;',
-                                               'top:', data.y + barY, 'px;'
-                                       ].join( '' );                                   
-                               };
-                               data.smoothY = ( scrollY - data.scrollingY ) / 10;
-                               if( data.scrollingY !== scrollY && Util.getIndex( smoothList, data ) === -1 ){
-                                       smoothList.length === 0 && SystemTimer.add( SUPER_USER_KEY, tick, 16 );
-                                       smoothList.push( data );
-                               };
-                       },
-                       remove : function( data ){
-                               var list = smoothList,
-                                       i    = Util.getIndex( list, data );
-                               data === currentNodeData && scrollRelease();
-                               i !== -1 && list.splice( i, 1 );
-                       }
-               };
-       })();
-       
-       return {
-               create : function( apiuser ){
-                       var     elm  = document.createElement( 'div' ),
-                               root, data;
-                       body.appendChild( elm );
-                       
-                       root = new NodeClass( apiuser, null, null, elm );
-                       data = NodePrivateData.get( root );
-                       
-                       // elm.style.cssText = 'position:absolute;top:0;left:0;height:100%;';
-                       elm.className      = 'mouse-operation-catcher';
-                       elm.unselectable   = 'on';
-                       data.elmMouseCatch = elm;
-                       
-                       data.eventCounter  = {};
-                       ROOT_LIST.push( data );
-                       currentRootData    = data;
-                       targetNodeData     = null;
-                       forceNodeData      = null;
-                       
-                       MouseEvent.add( apiuser, elm, 'mousemove', eventRellay );
-                       return root;
-               },
-               onCurrentApplicationChange : function( _application ){
-                       currentRootData    = null;
-                       targetNodeData     = null;
-                       forceNodeData      = null;
-                       for( var i = ROOT_LIST.length; i; ){
-                               if( ROOT_LIST[ --i ].apiuser === _application ){
-                                       currentRootData = ROOT_LIST[ i ];
-                                       return;
-                               };
-                       };
-               },
-               destroyTree : function( root ){
-                       var data = NodePrivateData.get( root );
-                       MouseEvent.remove( data.apiuser, data.elmMouseCatch, 'mousemove', eventRellay );
-                       body.removeChild( data.elmMouseCatch );
-                       data._destroy();
-                       ROOT_LIST.splice( Util.getIndex( ROOT_LIST, data ), 1 );
-                       if( currentRootData === data ){
-                               currentRootData    = null;
-                               targetNodeData     = null;
-                               forceNodeData      = null;      
-                       };
-               },
-               onSystemShutdown : function(){
-                       
-               },
-               isNodeInstance : function( node ){
-                       return node instanceof NodeClass;
-               },
-               _getNodePrivateData : function( node ){ // system only
-                       return NodePrivateData.get( node );
-               }
-       };
-})();
-
-var Application = ( function(){
-       
-       var LIVE_APPLICATION_LIST = [];
-       
-       var currentApplication    = null,
-               coveredApplication    = null,
-               winW                  = 0,
-               winH                  = 0;
-       
-       var ApplicationReference = function( appClass, isOverlay, displayName, id, thumbnailUrl, tailColor ){
-               var self          = this;
-               var application   = null;
-               this.id           = id;
-               this.displayName  = displayName;
-               this.thumbnailUrl = thumbnailUrl;
-               this.tailColor    = tailColor;
-               
-               function asyncBoot(){
-                       application = Application.boot( appClass, displayName, self.getUID(), isOverlay, Util.copyArray( arguments ) );
-               };
-               this.getUID = function(){
-                       return Util.getIndex( API_USER_LIST, appClass );
-               };
-               this.getDisplayName = function(){
-                       return this.displayName;
-               };
-               this.boot = function( /* _option */ ){
-                       AsyncCall.add( this, asyncBoot, Util.copyArray( arguments ) );
-               };
-               this.shutdown = function(){
-                       if( !application ) return false;
-                       
-                       AsyncCall.add( application, ( isOverlay === true ? Overlay.hide : application.close ) );
-               };
-       };
-       
-       function asyncBootHome(){
-               currentApplication === null && Home.boot();
-       };
-       function asyncOpen( /* arguments */ ){
-               var _arg = Util.copyArray( arguments );
-               _arg.unshift( winW, winH );
-               currentApplication.open.apply( currentApplication, _arg );
-       };
-       return {
-               register: function( _class, _overlay, _tail, _displayName, _id, _thumbnailUrl, _tailColor ){
-                       APPLICATION_LIST.push( _class );
-                       API_USER_LIST.push( _class );
-                       var _ref = new ApplicationReference( _class, _overlay, _displayName, _id, _thumbnailUrl, _tailColor );
-                       _tail === true && Home.add( _ref );
-                       return _ref;
-               },
-               isApplicationInstance: function( app ){
-                       return ApplicationPrivateData.get( app ) !== null;
-               },
-               isApplicationReference: function( _reference ){
-                       return _reference instanceof ApplicationReference;
-               },
-               isCurrentAppplication: function( app ){
-                       return app === currentApplication;
-               },
-               boot: function( appClass, displayName, uid, isOverlay, arg ){
-                       if( currentApplication ){
-                               if( currentApplication.getUID() === uid ) return null;
-                               if( isOverlay === false && currentApplication.close() === false ) return null;
-                       };
-
-                       appClass.prototype = new AbstractApplication( appClass, displayName, isOverlay );
-                       
-                       var application = new appClass(),
-                               data = ApplicationPrivateData.get( application );
-                       
-                       application.rootElement = data.rootElement;
-                       data.application = application;
-                       
-                       coveredApplication = isOverlay === true ? currentApplication : null;
-                       
-                       Application.onCurrentApplicationChange( application );
-                       
-                       if( isOverlay === false ){
-                               body.style.backgroundColor = application.bgColor;
-                               
-                               body.appendChild( data.rootElement );
-                               data.rootElement.style.display = 'none';
-                               application.init();
-
-                               application.addAsyncCall( asyncOpen, arg );
-                       } else {
-                               Overlay.show( application, arg );
-                       };
-                       
-                       return application;
-               },
-               shutdown: function( _application, isOverlay ){
-                       if( isOverlay === false ){
-                               currentApplication = null;
-                               AsyncCall.add( SUPER_USER_KEY, asyncBootHome );
-                       } else {
-                               Application.onCurrentApplicationChange( coveredApplication );
-                               coveredApplication = null;
-                       };
-               },
-               onCurrentApplicationChange: function( _application ){
-                       if( Application.isApplicationInstance( _application ) === false ) return;
-                       if( currentApplication === _application ) return;
-                       currentApplication = _application;
-                       MouseEvent.onCurrentApplicationChange( _application );
-                       PointingDeviceEventTree.onCurrentApplicationChange( _application );
-                       KeyEvent.updateCurrentListener( _application );
-                       // InteractiveLayer.onCurrentApplicationChange( _application );
-               },
-               onApplicationShutdown: function( _application ){
-                       LIVE_APPLICATION_LIST.splice( Util.getIndex(  LIVE_APPLICATION_LIST, _application ) );
-               },
-               onWindowResize: function( w, h ){
-                       winW = w;
-                       winH = h;
-                       currentApplication && currentApplication.resize( w, h );
-                       Overlay.onWindowResize( w, h );
-                       UI.onWindowResize( w, h );
-               },
-               onSystemShutdown: function(){
-                       
-               }
-       }
-})();
-
-/* --------------------------------------------------------------
- * Home
- * 
- */
-       var Home = ( function(){
-               var APP_REF_LIST    = [];
-               var ELM_TAIL_ORIGIN = ( function(){
-                       var ret = document.createElement( 'div' ),
-                               h2  = document.createElement( 'h2' );
-                       ret.className = 'tail-wrapper';
-                       ret.appendChild( h2 );
-                       h2.appendChild( document.createTextNode( 'appName' ) );
-                       return ret;
-               })();
-               
-               var TailClass = function( appRef ){
-                       this.elm = ELM_TAIL_ORIGIN.cloneNode( true );
-                       this.destroy = function(){
-                               appRef = self = elmName = null;
-                       };                      
-                       
-                       var self    = this,
-                               elmName = this.elm.getElementsByTagName( 'h2' )[ 0 ].firstChild;
-                       
-                       this.elm.style.backgroundColor = appRef.tailColor;
-                       elmName.data = appRef.displayName;
-               };
-               
-               var ref = Application.register( function(){
-                       var self     = this,
-                               winW     = 0,
-                               winH     = 0,
-                               tailList = [],
-                               elmContainer, elmHeader;
-                       
-                       function draw(){
-                               var tail, elm;
-                               for( var i=0, l=APP_REF_LIST.length; i<l; ++i ){
-                                       tail = new TailClass( APP_REF_LIST[ i ] );
-                                       tailList.push( tail );
-                                       elm  = tail.elm;
-                                       elmContainer.appendChild( elm );
-                                       self.addEventListener( elm, 'click', onTailClick );
-                               };
-                       };
-                       
-                       function onTailClick( e ){
-                               var _children = elmContainer.getElementsByTagName( 'div' );
-                               for( var i=0, l=_children.length; i<l; ++i ){
-                                       if( this === _children[ i ] ){
-                                               APP_REF_LIST[ i ].boot();
-                                               break;
-                                       };
-                               };
-                       };
-                       
-                       this.bgColor     = '#0F6D39';
-                       this.MIN_WIDTH   = 320;
-                       this.MIN_HEIGHT  = 320;
-                       this.onInit = function(){
-                               self.rootElement.id = 'home-root';
-                               
-                               elmContainer        = document.createElement( 'div' );
-                               self.rootElement.appendChild( elmContainer );
-                               elmContainer.id     = 'home-tail-container';
-                               
-                               elmHeader           = document.createElement( 'div' );
-                               self.rootElement.appendChild( elmHeader );
-                               elmHeader.id        = 'home-header';
-                       };
-                       this.onOpen = function( _w, _h ){
-                               winW = _w;
-                               winH = _h;
-                               draw();
-                       };
-                       this.onPaneResize = function( _w, _h ){
-                               
-                       };
-                       this.onClose = function(){
-                               self.removeEventListener();
-                               while( tailList.length > 0 ){
-                                       tailList.shift().destroy();
-                               }
-                               self = tailList = elmContainer = null;
-                       };
-               }, false, false, 'home', 'home', null );
-               
-               return {
-                       add: function( _appRef ){
-                               if( Application.isApplicationReference( _appRef ) === false ) return;
-                               Util.getIndex( APP_REF_LIST, _appRef ) === -1 && APP_REF_LIST.push( _appRef );
-                       },
-                       boot: function(){
-                               ref.boot();
-                       }
-               }
-       })();
-
-       var Page = ( function(){
-               var pageNodes = [],
-                       appClass, ref,
-                       ignoreTagList = [ 'script', 'noscript', 'style' ];
-               
-               var MemoryClass = function( node ){
-                       this.node = node;
-               };
-               MemoryClass.prototype = {
-                       init: function(){
-                               var node      = this.node,
-                                       _nodeType = node.nodeType;
-                               if( _nodeType === 1 && Util.getIndex( ignoreTagList, node.tagName.toLowerCase() ) === -1 ){
-                                       this.type    = _nodeType;
-                                       this.display = node.style.display;
-                               } else
-                               if( _nodeType === 3 ){
-                                       if( node.data.replace( /\s/g, '' ).length !== 0 ){
-                                               this.type    = _nodeType;
-                                               this.before  = pageNodes.length === 0 ? null : pageNodes[ pageNodes.length - 1 ].node;
-                                       } else {
-                                               body.removeChild( node );
-                                               return false;
-                                       }
-                               } else {
-                                       // body.removeChild( node );
-                                       return false;
-                               };
-                       },
-                       show: function(){
-                               if( this.type === 1 ){
-                                       if( this.display ){
-                                               this.node.style.display = this.display;
-                                       } else {
-                                               this.node.style.display = '';
-                                       }
-                               } else {
-                                       if( this.before ){
-                                               body.insertBefore( this.node, this.before );
-                                       } else {
-                                               body.appendChild( this.node );
-                                       };
-                               };
-                       },
-                       hide: function(){
-                               if( !this.node.parentNode ){
-                                       return;
-                               };
-                               if( this.type === 1 ){
-                                       this.node.style.display = 'none';
-                               } else {
-                                       body.removeChild( this.node );
-                               };
-                       }
-               };
-               
-               return {
-                       onReady: function(){
-                               var _children = Util.copyArray( body.childNodes ),
-                                       _mem;
-                               for( var i = 0, l = _children.length; i<l; ++i ){
-                                       _mem = new MemoryClass( _children[ i ] );
-                                       _mem.init() !== false && pageNodes.push( _mem );
-                               };
-                               if( pageNodes.length !== 0 ){
-                                       if( Type.isFunction( gOS.PageApplicationClass ) === true ){
-                                               Page.appClass = gOS.PageApplicationClass;
-                                               Page.appClass.bgColor    = Page.appClass.bgColor;
-                                               Page.appClass.MIN_WIDTH  = Page.appClass.MIN_WIDTH  || 240;
-                                               Page.appClass.MIN_HEIGHT = Page.appClass.MIN_HEIGHT || 240;
-                                       } else {
-                                               Page.appClass = function(){
-                                                       var self     = this;
-                                                       
-                                                       this.bgColor      = '#ffffff';
-                                                       this.MIN_WIDTH    = 200;
-                                                       this.MIN_HEIGHT   = 200;
-                                                       this.onInit       = function(){};
-                                                       this.onOpen       = function( _w, _h ){
-                                                               KeyEvent.add( self, Const.KEY.EVENT.KEY_DOWN, ref.shutdown, 27 ); // 27.esc
-                                                       };
-                                                       this.onPaneResize = function( _w, _h ){};
-                                                       this.onClose      = function(){};
-                                               };
-                                       };
-                                       ref = Application.register( Page.appClass, false, true, document.title, 'page', null, Page.appClass.tailColor || '#999999' );
-                                       if( Type.isFunction( gOS.PageApplicationClass ) === true ){
-                                               gOS.PageApplicationRef = ref;
-                                       }; 
-                               };
-                               delete Page.onReady;
-                       },
-                       show: function(){
-                               for( var i = pageNodes.length; i; ){
-                                       pageNodes[ --i ].show();
-                               };
-                       },
-                       hide: function(){
-                               for( var i = pageNodes.length; i; ){
-                                       pageNodes[ --i ].hide();
-                               };                              
-                       },
-                       boot: function(){
-                               ref && ref.boot();
-                       },
-                       registered: function(){
-                               return !!ref;
-                       },
-                       appClass: null
-               }
-       })();
-
-/* --------------------------------------------------------------
- * Event
- * 
- *  screenX
- *  スクリーン座標は、コンピュータのディスプレイの左上を原点とする座標系である。screenX, screenY属性で取得できる。Javascritpでは、同名のプロパティとして実装されている。
- *  しかし、これは、現実的には、何の役に立たない。ブラウザ自体がディスプレイのどの位置にいるのかがわからないので、画面上の位置を知ったところで、何にもならないからだ。 
- * 
- *  clientX
- *  ウインドウ座標とは、現在のブラウザのウインドウの、ドキュメントを表示している部分の左上原点とした座標である。
- *  問題は、ウインドウは、必ずしもドキュメント全体を表示するとは限らない。スクロールと呼ばれるUIによって、ドキュメントの一部だけを表示しているかもしれない。
- */
-       var XBrowserEvent = ( function(){
-               var wrappedHandlerClass,
-                       wrappedEventClass,
-                       tmp;
-               
-               if( window.addEventListener ){
-                       wrappedHandlerClass = function( ticket ){
-                               this.handler = function( e ){
-                                       if( ticket.fire( e ) !== false ) return;
-                                       e.preventDefault();
-                                       e.stopPropagation();
-                                       return false;
-                               };
-                               this.destroy = function(){
-                                       ticket = null;
-                                       delete this.handler;
-                                       delete this.destroy;
-                               };
-                       };
-               } else {
-                       wrappedEventClass = function( e, element ){
-                               this._event        = e;
-                               this.type          = e.type;
-                               this.target        = e.srcElement;
-                               this.currentTarget = element;
-                               this.relatedTarget = e.formElement ? e.formElement : e.toElement;
-                               this.eventPhase    = e.srcElement === element ? 2: 3;
-                               
-                               this.clientX       = e.clientX;
-                               this.clientY       = e.clientY;
-                               this.screenX       = e.screenX;
-                               this.screenY       = e.screenY;
-                               
-                               this.keyCode       = e.keyCode;
-                               this.altKey        = e.altKey;
-                               this.ctrlKey       = e.ctrlKey;
-                               this.shiftKey      = e.shiftKey;
-                               
-                               this.wheelDelta    = e.wheelDelta;
-                       };
-                       wrappedEventClass.prototype.stopPropagation = function(){
-                               this._event.cancelBubble = true;
-                       };
-                       wrappedEventClass.prototype.preventDefault  = function(){
-                               this._event.returnValue = false;
-                       };
-
-                       if( document.attachEvent ){
-                               wrappedHandlerClass = function( ticket ){
-                                       this.handler = function(){
-                                               if( ticket === null ) alert( window.event.type )
-                                               if( ticket.fire( new wrappedEventClass( window.event, ticket.element ) ) !== false ) return;
-                                               // e.preventDefault();
-                                               // e.stopPropagation();
-                                               window.event.cancelBubble = true;
-                                               window.event.returnValue  = false;
-                                               return false;
-                                       };
-                                       this.destroy = function(){
-                                               ticket = null;
-                                               delete this.handler;
-                                               delete this.destroy;
-                                       };
-                               };
-                       } else {
-                               tmp = {
-                                       list: [],
-                                       find: function( _ticket ){
-                                               for( var i=0, l= tmp.list.length, _item; i<l; ++i ){
-                                                       _item = tmp.list[ i ];
-                                                       if( _item.element === _ticket.element && _item.eventType === _ticket.eventType ){
-                                                               return _item;
-                                                       };
-                                               };
-                                               return null;
-                                       }
-                               };
-                               tmp.TicketClass = function( _ticket ){
-                                       var self = this;
-                                       this.element   = _ticket.element;
-                                       this.eventType = _ticket.eventType;
-                                       this.tickets   = [ _ticket ];
-                                       this.onDestroy = function(){ self = null; };
-                                       
-                                       this.element[ 'on' + this.eventType ] = function( e ){ return self.fire( e );};
-                                       _ticket = null;
-                               };
-                               tmp.TicketClass.prototype = {
-                                       add: function( _ticket ){
-                                               Util.getIndex( this.tickets, ticket ) === -1 && this.tickets.push( _ticket );
-                                       },
-                                       remove: function( _ticket ){
-                                               var i = Util.getIndex( this.tickets, _ticket );
-                                               i !== -1 && this.tickets.splice( i, 1 );
-                                               this.tickets.length === 0 && this.destroy();
-                                       },
-                                       fire: function( e ){
-                                               e = e || new wrappedEventClass( window.event, this.element );
-                                               var i = this.tickets.length,
-                                                       cancel;
-                                               for( ; i; ){
-                                                       if( this.tickets[ --i ].fire( e ) === false ) cancel = false;
-                                               };
-                                               return cancel;
-                                       },
-                                       destroy: function(){
-                                               this.onDestroy();
-                                               this.element[ 'on' + this.eventType ] = '';
-                                               tmp.list.splice( Util.getIndex( tmp.list, this ), 1 );
-                                               delete this.element;
-                                               delete this.eventType;
-                                               delete this.tickets;
-                                               delete this.onDestroy;
-                                       }
-                               };
-                       };
-               };
-
-               return {
-                       add: function( _ticket ){
-                               if( document.addEventListener ){
-                                       XBrowserEvent.add = function( _ticket ){
-                                               _ticket.wrappedHandler = new wrappedHandlerClass( _ticket );
-                                               _ticket.element.addEventListener( _ticket.eventType, _ticket.wrappedHandler.handler, false );
-                                       };
-                               } else
-                               if( document.attachEvent ){
-                                       XBrowserEvent.add = function( _ticket ){
-                                               _ticket.wrappedHandler = new wrappedHandlerClass( _ticket );
-                                               _ticket.element.attachEvent( 'on' + _ticket.eventType, _ticket.wrappedHandler.handler );
-                                       };
-                               } else {
-                                       XBrowserEvent.add = function( _ticket ){
-                                               var t = tmp.find( _ticket );
-                                               if( t !== null ){
-                                                       t.add( _ticket );
-                                               } else {
-                                                       tmp.list.push( new tmp.TicketClass( _ticket ) );
-                                               };
-                                       };
-                               };
-                               
-                               XBrowserEvent.add( _ticket );
-                       },
-                       remove: function( _ticket ){
-                               if( document.removeEventListener ){
-                                       XBrowserEvent.remove = function( _ticket ){
-                                               _ticket.element.removeEventListener( _ticket.eventType, _ticket.wrappedHandler.handler, false );
-                                               _ticket.wrappedHandler.destroy();
-                                       };
-                               } else
-                               if( document.detachEvent ){
-                                       XBrowserEvent.remove = function( _ticket ){
-                                               _ticket.element.detachEvent( 'on' + _ticket.eventType, _ticket.wrappedHandler.handler );
-                                               _ticket.wrappedHandler.destroy();
-                                       };
-                               } else {
-                                       XBrowserEvent.remove = function( _ticket ){
-                                               var t = tmp.find( _ticket );
-                                               if( t !== null ){
-                                                       t.remove( _ticket );
-                                               };
-                                       };
-                               };
-                               
-                               XBrowserEvent.remove( _ticket );
-                       }
-               }
-       })();
-
-/*
- * EventTicketClass
- */
-       var EventTicketClass = function( _element, _eventType, _handler, opt_thisObject ){
-               this.element        = _element;
-               this.eventType      = _eventType;
-               this.handler        = _handler;
-               this.wrappedHandler = null;
-               this.thisObject     = opt_thisObject;
-               XBrowserEvent.add( this );
-       };
-       EventTicketClass.prototype = {
-               fire : ( function(){
-                       if( Function.prototype.call ){
-                               return function( e ){
-                                       return this.handler.call( this.thisObject || this.element, e );
-                               };                              
-                       };
-                       return function( e ){
-                               var thisObj = this.thisObject || this.element,
-                                       ret;
-                               thisObj._currentHandler = this.handler;
-                               ret = thisObj._currentHandler( e );
-                               delete thisObj._currentHandler;
-                               return ret;                                     
-                       };
-               })(),
-               match: function( _element, _eventType, _handler ){
-                       if( _handler   && _handler   !== this.handler )   return false;
-                       if( _eventType && _eventType !== this.eventType ) return false;
-                       if( _element   && _element   !== this.element )   return false;
-                       
-                       return true;
-               },
-               destroy: function( _element, _eventType, _handler ){
-                       if( this.match( _element, _eventType, _handler ) === false ) return false;
-                       
-                       XBrowserEvent.remove( this );
-                       
-                       delete this.element;
-                       delete this.eventType;
-                       delete this.handler;
-                       delete this.wrappedHandler;
-                       delete this.thisObject;
-                       return true;
-               }
-       };
-
-var ReadyEvent = ( function(){
-       var ticketReady,
-               ticketLoad;
-
-       function webkitDetect(){
-               var state = document.readyState;
-               if( state === 'loaded' || state === 'complete' ){
-                       SystemTimer.remove( SUPER_USER_KEY, webkitDetect );
-                       timer = null;
-                       onReady();
-               };
-       };
-       function ieDetect(){
-               if( this.readyState === 'complete' ){ // this.readyState === 'loaded' || 
-                       this.onreadystatechange = new Function();
-                       this.onreadystatechange = null;
-                       AsyncCall.remove( SUPER_USER_KEY, ieScroll );
-                       onReady();
-               };
-       };
-       function ieScroll(){
-               try {
-                       document.documentElement.doScroll( 'left' );
-               } catch( e ){
-                       AsyncCall.add( SUPER_USER_KEY, ieScroll );
-                       return;
-               };
-               // no errors, fire
-               document.onreadystatechange = new Function();
-               document.onreadystatechange = null;
-               onReady();              
-       };
-               
-       function onReady(){
-               ticketReady && ticketReady.destroy();
-               ticketLoad  && ticketLoad.destroy();
-               ticketReady = ticketLoad = null;
-               Page.onReady();
-               if( Page.registered() === true ){
-                       Page.boot();
-               } else {
-                       Home.boot();
-               };
-       };
-       
-       // Apple WebKit (Safari, OmniWeb, ...)
-       if( document.readyState && !!UA.WEBKIT ){
-               SystemTimer.add( SUPER_USER_KEY, webkitDetect, 50 );
-       /* } else
-               if( document.readyState && UA.isIE && UA.ieVersion < 9 ){
-               ieScroll();
-               document.onreadystatechange = ieDetect; */
-       } else {
-               ticketReady = new EventTicketClass( document, 'DOMContentLoaded', onReady );
-               ticketLoad  = new EventTicketClass( window, 'load', onReady );
-       };
-})();
-
-
-
-
-/* =====================================================
- *  ResizeEvent
- * 
- */
-
-var ResizeEvent = ( function(){
-       var _globalLock = 0;
-       var _resize;
-       var root = window;
-       var w = 0, h = 0;
-       
-       function getInnerSize(){
-               return {
-                       w : root.innerWidth || root.clientWidth,
-                       h : root.innerHeight || root.clientHeight
-               };
-       }
-       function unlock(){
-               _globalLock = 0;
-       }
-       
-       if( document.uniqueID ){
-               _resize = function(){
-                       root = (document.compatMode || "") !== "CSS1Compat" ? document.body : document.documentElement;
-
-                       // resize agent
-                       function loop(){
-                               if( !_globalLock++ ){
-                                       var size = getInnerSize();
-                                       if( w !== size.w || h !== size.h ){// resized
-                                               w = size.w;
-                                               h = size.h;
-                                               // update
-                                               Application.onWindowResize( w, h );
-                                       }
-                                       window.setTimeout( unlock, 0 );
-                                       // delay unlock
-                               }
-                               window.setTimeout( loop, 100 );
-                       }
-                       loop();
-               };
-       } else {
-               _resize = function(){
-                       new EventTicketClass( window, 'resize', onResize );
-                       
-                       function onResize(){
-                               if( !_globalLock++ ) {
-                                       var size = getInnerSize();
-                                       if( w !== size.w || h !== size.h ){// resized
-                                               w = size.w;
-                                               h = size.h;
-                                               // update
-                                               Application.onWindowResize( w, h );
-                                       }
-                                       window.setTimeout( unlock, 0 );
-                               }
-                       }
-                       onResize();
-               };
-       }
-       AsyncCall.add( SUPER_USER_KEY, _resize );
-       
-       return {
-               getSize: getInnerSize,
-               onSystemShutdown: function(){
-                       
-               }
-       }
-})();
-
-
-/* =====================================================
- *  MouseEvent
- * 
- */
-       var MouseEvent = ( function(){
-               var CLICK_OFFSET   = 2 * 2,
-                       DRAG_OFFSET    = 4 * 4;         
-               
-               var EVENT_LIST_MAP = [],
-                       TMP = {},
-                       currentEventList;
-       /*-------------------------------------
-        * ClickHelper
-        * mousedown, mouseup, の移動距離を調べて clickハンドラ を呼ぶ
-        */
-               var ClickEventTicketClass = function( element, clickhandler, opt_thisObject ){
-                       this.mousedownTicket = new EventTicketClass( element, 'mousedown', this.mousedownHandler, this );
-                       this.element         = element;
-                       this.handler         = clickhandler;
-                       this.thisObject      = opt_thisObject;
-               };
-               ClickEventTicketClass.prototype = {
-                       element          : null,
-                       handler          : null,
-                       thisObject       : null,
-                       startX           : 0,
-                       startY           : 0,
-                       mousedownTicket  : null,
-                       mousemoveTicket  : null,
-                       mouseupTicket    : null,
-                       mouseoutTicket   : null,
-                       eventType        : 'click',
-                       fire             : EventTicketClass.prototype.fire,
-                       match            : EventTicketClass.prototype.match,
-                       mousedownHandler : function( e ){
-                               this.startX = e.clientX;
-                               this.startY = e.clientY;
-                               
-                               this.mousemoveTicket = new EventTicketClass( this.element, 'mousemove', this.mousemoveHandler, this );
-                               this.mouseupTicket   = new EventTicketClass( this.element, 'mouseup',   this.mouseupHandler,   this );
-                               this.mouseoutTicket  = new EventTicketClass( this.element, 'mouseout',  this.mouseoutHandler,  this );
-                               return false;                   
-                       },
-                       mousemoveHandler : function( e ){
-                               var offsetX = e.clientX - this.startX,
-                                       offsetY = e.clientY - this.startY;                              
-                               offsetX * offsetX + offsetY * offsetY >= CLICK_OFFSET && this.mouseoutHandler();
-                               return false;
-                       },
-                       mouseupHandler : function( e ){
-                               this.mouseoutHandler();
-                               return this.fire( ClickEventTicketClass.createEvent( e ) );
-                       },
-                       mouseoutHandler : function( e ){
-                               this.mousemoveTicket && this.mousemoveTicket.destroy();
-                               this.mouseupTicket   && this.mouseupTicket.destroy();
-                               this.mouseoutTicket  && this.mouseoutTicket.destroy();
-                               if( this.mousemoveTicket ) delete this.mousemoveTicket;
-                               if( this.mouseupTicket  )  delete this.mouseupTicket;
-                               if( this.mouseoutTicket )  delete this.mouseoutTicket;
-                               return false;
-                       },
-                       destroy : function( _element, _eventType, _handler ){
-                               if( this.match( _element, _eventType, _handler ) === false ) return false;
-                               
-                               this.mouseoutHandler();
-                               this.mousedownTicket.destroy();
-
-                               delete this.element;
-                               delete this.handler;
-                               delete this.thisObject;
-                               delete this.mousedownTicket;    
-                               return true;
-                       }
-               };
-               if( document.createEvent ){
-                       ClickEventTicketClass.createEvent = function( e ){
-                               var _e = document.createEvent( 'MouseEvents' );
-                               _e.initMouseEvent(
-                                       'click' , false, true, e.view, 
-                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, 
-                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, 
-                                       e.button, e.relatedTarget
-                               );
-                               return _e;
-                       };                                      
-               } else
-               if( document.attachEvent ){
-                       ClickEventTicketClass.createEvent = function( e ){
-                               e.type = 'click';
-                               return e;
-                       };
-               } else {
-                       
-               };
-               
-       /*-------------------------------------
-        *  WheelHelper
-        */
-               var WheelEventTicketClass = ( function(){
-                       if( UA.GECKO ){
-                               return function( element, wheelhandler, opt_thisObject ){
-                                       this.wheelTicket = new EventTicketClass( element, 'DOMMouseScroll', this.onGeckoWheel, this );
-                                       this.element     = element;
-                                       this.handler     = wheelhandler;
-                                       this.thisObject  = opt_thisObject;
-                               };
-                       } else
-                       if( true || UA.isIE ){
-                               return function( element, wheelhandler, opt_thisObject ){
-                                       this.wheelTicket = new EventTicketClass( element, this.eventType, wheelhandler );
-                                       this.element     = element;
-                                       this.handler     = wheelhandler;
-                                       this.thisObject  = opt_thisObject;
-                               };
-                       } else {
-                               TMP.wheelHandlerList = [];
-                               TMP.wheelThisObjList = [];
-                               //TMP.wheelLegacy = undefined;
-                               TMP.onWheel   = function( e ){
-                                       e = e || window.event;
-                                       var cancel = true,
-                                               f = TMP.wheelLegacy;
-                                       if( f ) cancel = f.call( this, e );
-                                       
-                                       for( i = TMP.wheelHandlerList.length; i; ){
-                                               if( TMP.wheelHandlerList[ --i ].call( TMP.wheelThisObjList[ i ] || this, e ) === false ) cancel = false;
-                                       };
-                                       return cancel;
-                               };
-                               return function( element, wheelhandler, opt_thisObject ){
-                                       this.element     = element;
-                                       this.handler     = wheelhandler;
-                                       this.thisObject  = opt_thisObject;
-                                       
-                                       if( TMP.wheelHandlerList.length === 0 ){
-                                               //TMP.wheelLegacy     = Type.isFunction( window.onmousewheel ) === true ? window.onmousewheel : undefined;
-                                               element.onmousewheel = TMP.onWheel;
-                                       };
-                                       TMP.wheelHandlerList.push( wheelhandler );
-                                       TMP.wheelThisObjList.push( opt_thisObject )
-                               };
-                       };
-               })();
-               WheelEventTicketClass.prototype = {
-                       eventType : 'mousewheel',
-                       match     : EventTicketClass.prototype.match,
-                       destroy   : function( _element, _eventType, _handler ){
-                               if( this.match( _element, _eventType, _handler ) === false ) return false;
-                               
-                               this.wheelTicket && this.wheelTicket.destroy();
-                               
-                               delete this.wheelTicket;
-                               delete this.element;
-                               delete this.handler;
-                               delete this.thisObject;
-                               
-                               this.onDestroy && this.onDestroy();
-                               return true;
-                       }
-               };
-               if( UA.GECKO ){
-                       WheelEventTicketClass.prototype.onGeckoWheel = function( e ){
-                               var _e = document.createEvent( 'MouseEvents' );
-                               _e.initMouseEvent(
-                                       'mousewheel' , false, true, e.view, 
-                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, 
-                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, 
-                                       e.button, e.relatedTarget
-                               );
-                               _e.wheelDelta = e.detail * -40;
-                               return this.handler.call( this.thisObject || this.element, _e );
-                       };
-               } else
-               if( true || UA.isIE ){
-
-               } else {
-                       WheelEventTicketClass.prototype.onDestroy = function(){
-                               TMP.wheelHandlerList.splice( Util.getIndex( TMP.wheelHandlerList, this.handler ), 1 );
-                               TMP.wheelThisObjList.splice( Util.getIndex( TMP.wheelThisObjList, this.handler ), 1 );
-                               if( TMP.wheelHandlerList.length === 0 ) this.element.onmousewheel = '';
-                       };                      
-               };
-               
-       /*-------------------------------------
-        *  DragHelper
-        */
-               var DragEventTicketClass = function( element, draghandler, opt_thisObject ){
-                       this.mousedownTicket = new EventTicketClass( element, 'mousedown', this.mousedownHandler, this );
-                       this.element         = element;
-                       this.handler         = draghandler;
-                       this.thisObject      = opt_thisObject;
-               };
-               DragEventTicketClass.prototype = {
-                       element         : null,
-                       handler         : null,
-                       thisObject      : null,
-                       startX          : 0,
-                       startY          : 0,
-                       dragging        : false,
-                       mousedownTicket : null,
-                       mousemoveTicket : null,
-                       mouseupTicket   : null,
-                       mouseoutTicket  : null,
-                       eventType       : 'mousedrag',
-                       fire            : EventTicketClass.prototype.fire,
-                       match           : EventTicketClass.prototype.match,
-                       mousedownHandler: function( e ){
-                               this.startX = e.clientX;
-                               this.startY = e.clientY;
-                               
-                               this.mousemoveTicket = new EventTicketClass( this.element, 'mousemove', this.dragMoveHandler, this );
-                               this.mouseupTicket   = new EventTicketClass( this.element, 'mouseup',   this.dragEndHandler,  this );
-                               this.mouseoutTicket  = new EventTicketClass( this.element, 'mouseout',  this.dragEndHandler,  this );                                   
-                       
-                               return false;
-                       },
-                       dragMoveHandler : function( e ){
-                               var offsetX = e.clientX - this.startX,
-                                       offsetY = e.clientY - this.startY;
-                               if( this.dragging === false ){
-                                       if( offsetX * offsetX + offsetY * offsetY < DRAG_OFFSET ) return;
-                                       console.log( 'Drag start' );
-                                       // dragStart
-                                       this.dragging = true;
-                                       return this.fire( DragEventTicketClass.createEvent( e, offsetX, offsetY, 0 ) );
-                               };
-                               return this.fire( DragEventTicketClass.createEvent( e, offsetX, offsetY, 1 ) );
-                       },
-                       dragEndHandler  : function( e ){
-                               if( this.dragging === true ){
-                                       console.log( 'Drag End ' + e.type );
-                                       this.removeEvents();
-                                       // dragEnd
-                                       return this.fire( DragEventTicketClass.createEvent( e, e.clientX - this.startX, e.clientY - this.startY, 2 ) );
-                               };
-                               this.removeEvents();
-                               return false;
-                       },
-                       removeEvents : function(){
-                               this.dragging = false;
-                               if( this.mousemoveTicket ){
-                                       this.mousemoveTicket.destroy();
-                                       delete this.mousemoveTicket;
-                               };
-                               if( this.mouseupTicket ){
-                                       this.mouseupTicket.destroy();
-                                       delete this.mouseupTicket;
-                               };
-                               if( this.mouseoutTicke ){
-                                       this.mouseoutTicket.destroy();
-                                       delete this.mouseoutTicket;
-                               };                              
-                       },
-                       destroy : function( _element, _eventType, _handler ){
-                               if( this.match( _element, _eventType, _handler ) === false ) return false;
-                               
-                               this.removeEvents();
-                               this.mousedownTicket.destroy();
-
-                               delete this.element;
-                               delete this.handler;
-                               delete this.thisObject;
-                               delete this.mousedownTicket;    
-                               return true;
-                       }
-               };
-               if( document.createEvent ){
-                       DragEventTicketClass.createEvent = function( e, offsetX, offsetY, dragPhase ){
-                               var _e = document.createEvent( 'MouseEvents' );
-                               _e.initMouseEvent(
-                                       DragEventTicketClass.prototype.eventType , false, true, e.view, 
-                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, 
-                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, 
-                                       e.button, e.relatedTarget
-                               );
-                               _e.dragPhase   = dragPhase;
-                               _e.dragOffsetX = offsetX;
-                               _e.dragOffsetY = offsetY;
-                               return _e;
-                       };                                      
-               } else
-               if( document.attachEvent ){
-                       DragEventTicketClass.createEvent = function( e, offsetX, offsetY, dragPhase ){
-                               e.type        = DragEventTicketClass.prototype.eventType;
-                               e.dragPhase   = dragPhase;
-                               e.dragOffsetX = offsetX;
-                               e.dragOffsetY = offsetY;
-                               return e;
-                       };
-               } else {
-                       
-               };
-
-               return {
-                       add: function( _apiuser, _element, _eventType, _handler, opt_thisObject ){
-                               if( isApiUser( _apiuser ) === true &&
-                                       ( Type.isHTMLElement( _element ) === true || _element === window || _element === document ) &&
-                                       Type.isString( _eventType ) === true &&
-                                       Type.isFunction( _handler ) === true
-                               ){
-                                       var _uid    = _apiuser.getUID(),
-                                               _events = EVENT_LIST_MAP[ _uid ];
-                                       if( Type.isArray( _events ) === false ){
-                                               _events = EVENT_LIST_MAP[ _uid ] = [];
-                                       } else {
-                                               // 2重登録の禁止
-                                               for( var i=0, l=_events.length; i<l; ++i ){
-                                                       if( _events[ i ].match( _element, _eventType, _handler ) === true ) return;
-                                               };
-                                       };
-                                       switch( _eventType ){
-                                               case 'click':
-                                                       _events.push( new ClickEventTicketClass( _element, _handler, opt_thisObject ) );
-                                                       break;
-                                               case 'mousewheel':
-                                                       _events.push( new WheelEventTicketClass( _element, _handler, opt_thisObject ) );
-                                                       break;
-                                               case 'mousedrag':
-                                                       _events.push( new DragEventTicketClass( _element, _handler, opt_thisObject ) );
-                                                       break;
-                                               default:
-                                                       _events.push( new EventTicketClass( _element, _eventType, _handler, opt_thisObject ) );
-                                       };
-                               };
-                       },
-                       remove: function( apiuser, element, eventType, handler ){
-                               if( isApiUser( apiuser ) === true ){
-                                       var uid  = apiuser.getUID(),
-                                               list = EVENT_LIST_MAP[ uid ],
-                                               i    = 0;
-                                       if( Type.isArray( list ) === false ) return;
-                                       for( ;i < list.length; ){
-                                               if( list[ i ].destroy( element, eventType, handler ) === true ){
-                                                       list.splice( i, 1 );
-                                               } else {
-                                                       ++i;
-                                               };
-                                       };
-                                       if( list.length === 0 ){
-                                               EVENT_LIST_MAP[ uid ] = null;
-                                       };
-                               };
-                       },
-                       onCurrentApplicationChange: function(){
-                               
-                       },
-                       onApplicationShutdown: function(){
-                               
-                       },
-                       onSystemShutdown: function(){
-                               
-                       }
-               }
-       })();
-
-/* ----------------------------------------
- * KEY
- * 
- *  - EDITABLE_TEXT_CONTROL
- * 
- *    .SHIFT_DOWN_EVENT:       'shiftDown',
- *    .SHIFT_UP_EVENT:         'shiftUp',
- *    .CTRL_DOWN_EVENT:                'ctrlDown',
- *    .CTRL_UP_EVENT:          'ctrlUp',
- *    .SPACE_DOWN_EVENT:       'spaceDown',
- *    .SPACE_UP_EVENT:         'spaceUp',
- *    .init:                           function,
- *    .addKeyDownEvent:                function,
- *    .keyEventDispatcher:     function,
- * 
- * ショートカットキーの監視とテキスト入力(input, textarea)、チェックボックスを管理する。
- * キー入力はdocumentで受けて、テキスト編集中(input, textarea)はそちらにキーイベント流す。
- * 
- */
-var KeyEvent = ( function(){
-       var EVENT_LIST_MAP = [],
-               LOCK_UP        = [],
-               LOCK_DOWN      = [],
-               application    = null,
-               currentList    = null;
-
-       window.focus();
-       
-       var focusTicket    = null,
-               keydownTicket  = null,
-               keyupTicket    = null,
-               keyPress       = null,
-               keypressTicket = null;
-       
-       function unlock( lock, key ){
-               lock.splice( Util.getIndex( lock, key ), 1 );
-       };
-       
-       function onKeyChange( e ){
-               var cancel         = false,
-                       type           = e.type,
-                       key            = e.keyCode, // || e.which,
-                       shift          = Type.isBoolean( e.shiftKey ) === true ? e.shiftKey : ( e.modifiers & Event.SHIFT_MASK ),
-                       ctrl           = Type.isBoolean( e.ctrlKey  ) === true ? e.ctrlKey  : ( e.modifiers & Event.CONTROL_MASK ),
-                       lock           = type === 'keyup' ? LOCK_UP : LOCK_DOWN,
-                       i, t;
-                       
-               // block chattering
-               if( Util.getIndex( lock, key ) !== -1 ) return;
-               lock.push( key );
-               AsyncCall.add( SUPER_USER_KEY, unlock, [ lock, key ] );
-               
-               if( key === 16 || shift === true ){
-                       KeyEvent.shiftEnabled = type !== 'keyup';
-               };
-               if( key === 17 || ctrl === true ){
-                       KeyEvent.ctrlEnabled  = type !== 'keyup';
-               };
-               for( i = currentList.length; i; ){
-                       t = currentList[ --i ];
-                       if( Type.isFunction( t[ type ] ) === true && t.keyCode === key && ( t.shift === undefined || t.shift === shift ) && ( t.ctrl === undefined || t.ctrl === ctrl )){
-                               if( t[ type ].call( t.apiuser, e ) === false ){
-                                       cancel = true;
-                                       break;
-                               };
-                       };
-               };
-               if( cancel === true || key === 18 || key === 9 || key === 27 || e.altKey === true ){ // 13.enter 18.esc 9.tab 27.esc   || ( key === 13 && overlayEnabled === false)
-                       return false;
-               };
-       };
-       
-       if( UA.isIE === true && UA.ieRenderingVersion < 9 ){
-               keyPress = function( e ){
-                       var key = e.keyCode;
-                       if( key === 13 || key === 27 ){
-                               e.type = 'keydown';
-                               return onKeyChange( e );
-                       };
-               };
-       };
-       
-       var KeyEventTicketClass = function( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ){
-               this.apiuser = _apiuser;
-               this.type    = _type;
-               this.keydown = _onKeydown;
-               this.keyup   = _onKeyup;                
-               this.keyCode = _keyCode;
-               this.shift   = _shift;
-               this.ctrl    = _ctrl;
-               _apiuser = _onKeydown = _onKeyup = null;
-       }
-       KeyEventTicketClass.prototype = {
-               match: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){
-                       if( _apiuser  && _apiuser  !== this.apiuser ) return false;
-                       if( _type     && _type     !== this.type )    return false;
-                       if( _handler ){
-                               if( this.type === 'keydown' ){
-                                       if( _handler !== this.keydown ) return false;
-                               } else {
-                                       if( _handler !== this.keyup )   return false;
-                               };
-                       };
-                       if( _keyCode  && _keyCode  !== this.keyCode ) return false;
-                       if( _shift    && _shift    !== this.shift )   return false;
-                       if( _ctrl     && _ctrl     !== this.ctrl )    return false;
-                       return true;
-               },
-               destroy: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){
-                       if( this.match( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ) === false ) return false;
-                       
-                       delete this.apiuser;
-                       delete this.keydown;
-                       delete this.keyup;
-                       
-                       return true;
-               }
-       };
-       
-       function registerEvent( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ){
-               var _uid  = _apiuser.getUID(),
-                       _list = EVENT_LIST_MAP[ _uid ];
-               if( Type.isArray( _list ) === false ){
-                       _list = EVENT_LIST_MAP[ _uid ] = [];
-               }
-               for( var i=0, l=_list.length; i<l; ++i ){
-                       if( _list[ i ].match( _apiuser, _type, _onKeydown || _onKeyup, _keyCode, _shift, _ctrl ) === true ) return;
-               }
-               _list.push( new KeyEventTicketClass( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ));
-               
-               if( _apiuser === application ) KeyEvent.updateCurrentListener( _apiuser );
-       };
-       
-       return {
-               add: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){
-                       if( _type === 'keydown' ){
-                               registerEvent( _apiuser, _type, _handler, null, _keyCode, _shift, _ctrl );
-                       } else
-                       if( _type === 'keyup' ){
-                               registerEvent( _apiuser, _type, null, _handler, _keyCode, _shift, _ctrl );
-                       } else
-                       if( _type === 'keychange' ){
-                               registerEvent( _apiuser, _type, _handler, _handler, _keyCode, _shift, _ctrl );
-                       } else
-                       if( _type === 'cursol' ){
-                               
-                       };
-               },
-               remove: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){
-                       var _list = EVENT_LIST_MAP[ _apiuser.getUID() ],
-                               i = 0;
-                       if( Type.isArray( _list ) === true ){
-                               while( i < _list.length ){
-                                       if( _list[ i ].destroy( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ) === true ){
-                                               _list.splice( i, 1 );
-                                       } else {
-                                               ++i;
-                                       }
-                               }
-                       }
-                       if( _apiuser === application ) KeyEvent.updateCurrentListener( _apiuser );
-               },
-               shiftEnabled: false,
-               ctrlEnabled:  false,
-               /*
-                * currentListener
-                *  currrentApplication ( overlay Application ) or
-                *  superuser ( UI )
-                */
-               updateCurrentListener: function( _apiuser ){
-                       application = _apiuser;
-                       var _uid    = _apiuser.getUID();
-                       currentList = EVENT_LIST_MAP[ _uid ] || ( EVENT_LIST_MAP[ _uid ] = [] );
-                       
-                       var _ticket,
-                               _down = false,
-                               _up   = false;
-                       for( var i=currentList.length; _ticket = currentList[ --i ]; ){
-                               if( _down === false ) _down = !!_ticket.keydown;
-                               if( _up   === false ) _up   = !!_ticket.keyup;
-                               if( _down && _up ) break;
-                       }
-                       if( _down === true ){
-                               keydownTicket = new EventTicketClass( document, 'keydown', onKeyChange );
-                               keypressTicket = keyPress !== null ? new EventTicketClass( document, 'keypress', keyPress ) : null;
-                       } else {
-                               keydownTicket && keydownTicket.destroy();
-                               keypressTicket && keypressTicket.destroy();
-                               keydownTicket = keypressTicket = null;
-                       }
-                       if( _up === true ){
-                               keyupTicket   = new EventTicketClass( document, 'keyup', onKeyChange );
-                       } else {
-                               keyupTicket && keyupTicket.destroy();
-                               keyupTicket = null;
-                       }
-                       
-                       if( _down === true || _up === true ){
-                               focusTicket   = new EventTicketClass( document, 'mouseenter', window.focus );
-                       } else {
-                               focusTicket && focusTicket.destroy();
-                               focusTicket = null;
-                       }
-               },
-               onApplicationShutdown: function( _apiuser ){
-                       KeyEvent.remove( _apiuser );
-               },
-               onSystemShutdown: function(){
-                       
-               }
-       }
-})();
-
-/**
- * 
- * http://thudjs.tumblr.com/post/637855087/stylesheet-onload-or-lack-thereof
- */
-
-var StyleSheet = ( function(){
-       var head = document.getElementsByTagName( 'head' )[ 0 ];
-       
-       var TICKET_LIST = [];
-       var STATE_LIST  = 'loaded,complete,uninitialized'.split( ',' );
-       
-       var cssRules, sheet;
-       
-       var FetchCssTicketClass = function( _apiuser, _url, _elm, _onload, _onerror, opt_thisObject ){
-               this.apiusers = [ _apiuser ];
-               this.url      = _url;
-               this.elm      = _elm;
-               this.onload   = [ _onload ];
-               this.onerror  = [ _onerror ];
-               this.thisObj  = [ opt_thisObject ];
-               this.time     = 0;
-       };
-       FetchCssTicketClass.prototype = {
-               match: function( _apiuser, _url ){
-                       if( _apiuser  && Util.getIndex( this.apiusers, _apiuser ) === -1 ) return false;
-                       if( _url      && _url      !== this.url     ) return false;
-                       return true;
-               },
-               destroy: function( _apiuser, _url ){
-                       if( this.match( _apiuser, _url ) === false ) return false;
-                       
-                       var i = Util.getIndex( this.apiusers, _apiuser );
-                       
-                       this.apiusers.splice( i, 1 );
-                       this.onload.splice( i, 1 );
-                       this.onerror.splice( i, 1 );
-                       this.thisObj.splice( i, 1 );
-                       
-                       if( this.apiusers.length !== 0 ) return false;
-                       
-                       head.removeChild( this.elm );
-                       this.elm.onreadystatechange = new Function();
-                       this.elm.onload = null;
-                       
-                       delete this.apiusers;
-                       delete this.url;
-                       delete this.elm;
-                       delete this.onload;
-                       delete this.onerror;
-                       delete this.thisObj;
-                       delete this.time;
-                       
-                       return true;
-               },
-               loaded: function(){
-               for( var i = this.onload.length, f; i; ){
-                       f = this.onload[ --i ];
-                       Type.isFunction( f ) === true && AsyncCall.add( this.apiusers[ i ], f, this.url, this.thisObj[ i ] || this.apiusers[ i ] );
-                       this.onload[ i ] = this.onerror[ i ] = null;
-               };
-               },
-               error: function(){
-               for( var i = this.onerror.length, f; i; ){
-                       f = this.onerror[ --i ];
-                       Type.isFunction( f ) === true && AsyncCall.add( this.apiusers[ i ], f, this.url, this.thisObj[ i ] || this.apiusers[ i ] );
-                       this.onload[ i ] = this.onerror[ i ] = null;
-               };
-               },
-               check: function(){
-                       var el = this.elm;
-                       try {
-                               return el[ sheet ] && el[ sheet ][ cssRules ].length > 0;
-                       } catch( e ){
-                               return false;
-                       };
-               },
-               done: false
-       };
-       
-       function getTicket( elm ){
-               for( var i = TICKET_LIST.length, t; i; ){
-                       t = TICKET_LIST[ --i ];
-                       if( t.elm === elm ) return t;
-               };
-       };
-       
-       function detect(){
-               var t = getTicket( this ), rs = this.readyState, c;
-               if( t && t.done === false && ( !rs || Util.getIndex( STATE_LIST, rs ) !== -1 ) ){
-                       t.done = true;
-               t.loaded();
-               this.onreadystatechange = new Function();
-               this.onload = null;
-               };
-       };
-       
-       function checkTimer(){
-               var l = TICKET_LIST.length,
-                       n = 0;
-               for( var i = 0; i < l; ++i ){
-                       t = TICKET_LIST[ i ];
-                       ++t.time;
-                       if( t.check() === true ){
-                               t.loaded();
-                               ++n;
-                       } else
-                       if( t.time > 99 ){
-                               t.error();
-                       } else {
-                               
-                       };
-               };
-               l === n && SystemTimer.remove( SUPER_USER_KEY, checkTimer );
-       };
-       
-       return {
-               load: function( _apiuser, _url, opt_onload, opt_onerror, opt_thisObject ){
-                       _url = Util.getAbsolutePath( _url );
-                       var t;
-                       for( var i=TICKET_LIST.length; i; ){
-                               t = TICKET_LIST[ --i ];
-                               if( t.match( null, _url ) === true ){
-                                       if( t.match( _apiuser, _url ) === false ){
-                                               t.apiusers.push( _apiuser );
-                                               t.onload.push( opt_onload );
-                                               t.onerror.push( opt_onerror );
-                                               t.thisObj.push( opt_thisObject );
-                                       };
-                                       SystemTimer.add( SUPER_USER_KEY, checkTimer, 333 );
-                                       return;
-                               };
-                       };
-                       var elm = document.createElement( 'link' );
-                       head.appendChild( elm );
-                       elm.rel  = 'stylesheet';
-                       elm.type = 'text\/css';
-                       elm.onreadystatechange = elm.onload = detect;
-                       elm.href = _url;
-                       
-                       if( !sheet ){ // only assign these once
-                               cssRules = 'cssRules';
-                               sheet    = 'sheet';
-                               if ( !( sheet in elm ) ) { // MSIE uses non-standard property names
-                                       cssRules = 'rules';
-                                       sheet    = 'styleSheet';
-                               };
-                       };
-                       
-                       TICKET_LIST.push( new FetchCssTicketClass( _apiuser, _url, elm, opt_onload, opt_onerror, opt_thisObject ) );
-                       
-                       SystemTimer.add( SUPER_USER_KEY, checkTimer, 333 );
-               },
-               unload: function( _apiuser, _url ){
-                       _url = _url ? Util.getAbsolutePath( _url ) : null;
-                       for( var i = 0; i < TICKET_LIST.length; ){
-                               t = TICKET_LIST[ i ];
-                               if( t.destroy( _apiuser, _url ) === true ){
-                                       TICKET_LIST.splice( i, 1 );
-                               } else {
-                                       ++i;
-                               }
-                       };
-                       if( TICKET_LIST.length === 0 ){
-                               SystemTimer.remove( SUPER_USER_KEY, checkTimer );
-                       }
-               }
-       }
-})();
-
-/*
- * AssetLoader
- * fetchCSS
- * fetchJson
- * fetchHtml
- * fetchImage
- * fetchLocalFile
- * fetchLocalStorage
- */
-
-var Image = ( function(){
-       var TASK_LIST = [];
-       /* 
-        * FetchClass original is
-        * 
-        * LICENSE: MIT?
-        *  URL: http://d.hatena.ne.jp/uupaa/20080413/1208067631
-        *  AUTHOR: uupaa.js@gmail.com
-        * 
-        */
-       function detect(){
-               for( var i=0, t; i < TASK_LIST.length; ){
-                       t = TASK_LIST[ i ];
-                       if( t.complete() === true ){
-                               TASK_LIST.splice( i, 1 );
-                       } else {
-                               ++i;
-                       };
-               };
-               TASK_LIST.length === 0 && SystemTimer.remove( SUPER_USER_KEY, detect );
-       };
-       function getTask( img ){
-               for( var i = TASK_LIST.length; i; ){
-                       if( TASK_LIST[ --i ].img === img ) return TASK_LIST[ i ];
-               };
-       };
-       function onError(){
-               var task = getTask( this );
-               if( task.finish === true ) return;
-               task.finish = true;
-               AsyncCall.add( task.apiuser, task.asyncCallback, null, task );
-       };
-       function onLoad(){
-               // if( finish === true ) return; // これがあると firefox3.6 で駄目、、、
-               // if( timer ) return; // これがあると safari3.2 で駄目、、、
-               var task = getTask( this );
-               task.finish = true;
-               TASK_LIST.splice( Util.getIndex( TASK_LIST, task ), 1 );
-               if( window.opera && !task.img.complete ){
-                       AsyncCall.add( task.apiuser, task.asyncCallback, null, task );
-                       return;
-               };
-               task.size = Util.getImageSize( this );
-               AsyncCall.add( task.apiuser, task.asyncCallback, null, task );
-       };
-
-
-       var FetchClass = function( apiuser, abspath, onLoadCallback, onErrorCallback, timeout ){
-               this.apiuser         = apiuser;
-               this.abspath         = abspath;
-               this.onLoadCallback  = onLoadCallback;
-               this.onErrorCallback = onErrorCallback;
-               this.timeout         = timeout;
-               this.tick            = 0;
-       };
-       FetchClass.prototype = {
-               img: null,
-               size: null,
-               tick: 0,
-               finish: false,
-               load: function(){
-                       var img     = this.img = document.createElement( 'img' ); //var img = new Image(); ではieでimgのsizeが取れない、、、removeChildも失敗し、imgSizeGetterにimgが残る
-                       img.onabort = img.onerror = onError;
-                       img.onload  = onLoad;
-                       img.src     = this.abspath;
-               },
-               complete: function(){
-                       if( this.finish === true ) return true;
-                       if( this.img.complete ){
-                               this.finish = true;
-                               if( this.img.width ) return true;
-                               AsyncCall.add( this.apiuser, this.asyncCallback, null, this );
-                               return true;
-                       };
-                       if( ( this.tick += 250 ) > this.timeout ){
-                               this.finish = true;
-                               AsyncCall.add( this.apiuser, this.asyncCallback, null, this );
-                               return true;
-                       };
-               },
-               asyncCallback: function(){
-                       this.size ? this.onLoadCallback( this.abspath, this.size.width, this.size.height ) : this.onErrorCallback( this.abspath );
-                       this.destroy();
-               },
-               destroy: function(){
-                       this.finish  = true;
-                       this.img.src = this.img.onload = this.img.onabort = this.img.onerror = '';
-                       delete this.img;
-                       delete this.size;
-                       delete this.onLoadCallback;
-                       delete this.onErrorCallback;
-               },
-               stop: function(){
-                       timer !== null && window.clearTimeout( timer );
-                       destroy();
-               }
-       };
-       
-       return {
-               load: function( URLorELM, onLoad, onError, opt_timeout ){
-                       var src, fetch;
-                       if( Type.isString( URLorELM ) === true ){
-                               src = URLorELM;
-                       } else
-                       if( Type.isHTMLElement( URLorELM ) === true && URLorELM.tagName.toLowerCase() === 'img' ){
-                               src = URLorELM.src;
-                       } else {
-                               return;
-                       };
-                       
-                       fetch = new FetchClass(
-                               Util.getAbsolutePath( src ),
-                               onLoad, onError,
-                               Type.isFinite( opt_timeout ) === true ? opt_timeout : undefined
-                       );
-                       TASK_LIST.push( fetch );
-                       
-                       SystemTimer.add( SUPER_USER_KEY, detect, 250 );
-               },
-               unload: function(  ){
-                       
-               }
-       };
-})();
-
-
-/* ----------------------------------------
- * 
- */
-
-var Overlay = ( function(){
-       var elmContainer, elmShadow, elmCloseButton,
-               bootParams,
-               application    = null,
-               visible        = false,
-               bodyOverflow   = '',
-               windowW, windowH;
-
-       function onCloseClick( e ){
-               Overlay.hide();
-               return false;
-       };
-       function asyncInit( /* arguments */ ){
-               application.init();
-               //application.rootElement.style.display = 'none';
-               
-               elmContainer.style.cssText = "top:" + body.scrollTop + 'px;display:none;';
-               $( elmContainer ).stop().fadeIn( onFadeInComplete );            
-       };
-       function asyncOpen( /* arguments */ ){
-
-               
-               
-       };
-       function onFadeInComplete(){
-               KeyEvent.add( application, Const.KEY.EVENT.KEY_DOWN, Overlay.hide, 27 ); // 27.esc
-               MouseEvent.add( application, elmCloseButton, 'click', onCloseClick );
-               
-               var _arg = bootParams; //Util.copyArray( arguments );
-               _arg.unshift( windowW, windowH );
-               application.open.apply( application, _arg );            
-       };
-       function onFadeOutComplete(){   
-               Util.removeAllChildren( elmContainer );
-               body.removeChild( elmContainer );
-               elmContainer = elmShadow = elmCloseButton = null;
-       };
-       return {
-               show: function( _application, _bootParams ){
-                       if( visible === true && application === _application ) return;
-                       if( Application.isApplicationInstance( _application ) === false ) return;
-                       
-                       elmContainer = document.createElement( 'div' );
-                       body.appendChild( elmContainer );
-                       
-                       elmContainer.id = 'overlay-container';
-                       
-                       bodyOverflow        = body.style.overflow;
-                       body.style.overflow = 'hidden';
-                       
-                       elmShadow = document.createElement( 'div' );
-                       elmContainer.appendChild( elmShadow );
-                       elmShadow.id = 'overlay-shadow';
-                       
-                       elmCloseButton  = document.createElement( 'div' );
-                       elmContainer.appendChild( elmCloseButton );
-                       elmCloseButton.id = 'overlay-close-button';
-                       elmCloseButton.appendChild( document.createTextNode( 'x' ) );
-                       
-                       elmContainer.style.display = 'none'; // hide for fadeIn
-                       
-                       visible     = true;
-                       application = _application;
-                       
-                       //asyncInit();
-                       elmContainer.insertBefore( application.rootElement, elmCloseButton );
-                       _application.addAsyncCall( asyncInit );
-                       // _application.addAsyncCall( asyncOpen,  );
-                       
-                       bootParams = _bootParams;                       
-               },
-               hide: function(){
-                       if( visible === false ) return;
-                       if( application.close() === false ) return false;
-                       
-                       body.style.overflow = bodyOverflow;
-                       
-                       $( elmContainer ).stop().css( {
-                               filter:         '',
-                               opacity:        ''
-                       }).fadeOut( onFadeOutComplete );
-                       visible = false;
-                       
-                       application = null;
-               },
-               onWindowResize: function( _windowW, _windowH ){
-                       windowW = _windowW;
-                       windowH = _windowH;                     
-                       
-                       if( application === null ) return;
-                       
-                       elmContainer.style.height = _windowH + 'px';
-                       elmContainer.style.top    = body.scrollTop + 'px';
-
-                       elmShadow.style.height = _windowH + 'px';
-
-                       AsyncCall.add( application, application.resize, [ _windowW, _windowH ] );
-               }
-       }
-})();
-
-/* ----------------------------------------
- * UI
- * 
- * keyEventRellay
- *  form -> overlay -> view
- * 
- */
-
-var UI = ( function(){
-       var UI_LIST     = [],
-               currentUser = null,
-               currentList = null,
-               currentUi   = null,
-               currentItem = null,
-               windowW     = 0,
-               windowH     = 0;
-
-       var CLASSNAME_COMBOBOX_OPTION = 'combobox-option',
-               CLASSNAME_COMBOBOX_OPTION_CURRENT = CLASSNAME_COMBOBOX_OPTION + ' combobox-option-current',
-               ELM_COMBOBOX = ( function(){
-                       var ret       = document.createElement( 'a' ),
-                               elmToggle = document.createElement( 'span' ),
-                               elmValue  = document.createElement( 'span' );
-                       ret.href = '#';
-                       ret.appendChild( elmToggle );
-                       ret.appendChild( elmValue );
-                       elmToggle.className = 'combobox-toggle';
-                       elmValue.className  = 'combobox-value';
-                       
-                       elmToggle.appendChild( document.createTextNode( '▼' ));
-                       elmValue.appendChild( document.createTextNode( 'null' ));
-                       return ret;
-               })();
-       
-       var UIItemPrivateData = function(){};
-       UIItemPrivateData.prototype = {
-               groupData   : null,
-               item        : null,
-               elm         : null,
-               node        : null,
-               focus       : false,
-               visible     : true,
-               enabled     : true,
-               value       : null,
-               onUpdate    : null,
-               validator   : null,
-               elmValue    : null,
-               elmBox      : null,
-               elmA        : null,
-               elmToggle   : null,
-               elmValue    : null,
-               selectIndex : 0,
-               optionList  : null,
-               init    : function( groupData, item, elm, value, onUpdate, validator, focus, visible, enabled ){
-                       this.groupData = groupData;
-                       this.item      = item;
-                       this.elm       = elm;
-                       this.value     = value;
-                       this.onUpdate  = onUpdate;
-                       this.validator = validator;                     
-                       this.focus     = !!focus;
-                       this.visible   = !!visible;
-                       this.enabled   = !!enabled;
-                       UIItemPrivateData.list.push( this );
-               },
-               destroy : function(){
-                       var list = UIItemPrivateData.list;
-                       list.splice( Util.getIndex( list, this ), 1 );
-                       
-                       list = this.groupData.itemList;
-                       var i = Util.getIndex( list, this.item );
-                       i !== -1 && list.splice( i, 1 );
-                       
-                       this.node && this.node.remove();
-               }
-       };
-       UIItemPrivateData.list = [];
-       UIItemPrivateData.get = function( item ){
-               var list = UIItemPrivateData.list;
-               for( i = list.length; i; ){
-                       if( list[ --i ].item === item ) return list[ i ];
-               };
-               return null;
-       };
-       
-/* --------------------------------
- * TextInputManager
- */
-       var TextInputManager = ( function(){
-               var elmInput = ( function(){
-                       var ret  = document.createElement( 'input' );
-                       ret.type = 'text';
-                       ret.id   = 'ui-textinput';
-                       return ret;
-               })();
-               var currentData;
-               
-               function updateWrapperPosition(){
-                       var p = Position.cumulativeOffset( currentData.elmValue ),
-                               w = currentData.elmValue.offsetWidth - 2,
-                               _w;             
-                       elmInput.style.cssText = [
-                               'left:',   p[ 0 ], 'px;',
-                               'top:',    p[ 1 ], 'px;',//,
-                               'width:',  w, 'px;'//,
-                               //'height:', data.elmValue.offsetHeight, 'px;',
-                               //'position:absolute;'
-                       ].join( '' );
-                       
-                       //_w = elmInput.offsetWidth;
-                       //if( w !== _w ) elmInput.style.width = ( w - ( _w - w ) ) + 'px;';     
-               };
-               
-               return {
-                       show: function( data ){
-                               // this.groupData.node.addEventListener( 'mouseout' );
-                               currentData = data;
-
-                               body.appendChild( elmInput );
-                               elmInput.value = data.value;
-                               updateWrapperPosition();
-                               
-                               elmInput.focus();
-                               elmInput.select();
-                               
-                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );
-                       },
-                       hide : function( data ){
-                               if( currentData !== data ) return;
-                               currentData = null;
-                               body.removeChild( elmInput );
-                               var ret = elmInput.value;
-                               elmInput.value = '';
-                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition );
-                               return ret;
-                       },
-                       update : function( data ){
-                               elmInput.value = data.value;
-                       },
-                       onWindowResize: function( _w, _h ){
-                               AsyncCall.add( currentUser, updateWrapperPosition );
-                       }
-               };
-       })();
-       
-       var TextInputClass = function( groupData, elmWrapper, elmValue, onUpdate, validater ){
-               var data = new UIItemPrivateData();
-               data.init( groupData, this, elmWrapper, elmValue.innerHTML, onUpdate, validater, false, true, true );
-               Util.addClass( elmValue, 'editable-text' );
-               data.elmValue = elmValue;
-               this.value( data.value );
-               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
-               data.node.addEventListener( 'click', this.focus, this );
-               //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', instance.focus );
-       };
-       TextInputClass.prototype = {
-               value : function( value ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isString( value ) === true || Type.isNumber( value ) === true ){
-                               data.elmValue.innerHTML = data.value = '' + value;
-                               data.focus === true && TextInputManager.update( data );
-                       };
-                       data.focus === true && this.blur();
-                       return data.value;
-               },
-               focus : function( e ){
-                       var data = UIItemPrivateData.get( this );
-                       data.focus = true;
-                       start( data );
-                       TextInputManager.show( data );
-                       return false;
-               },
-               blur : function( keep ){
-                       var data = UIItemPrivateData.get( this ),
-                               newValue;
-                       if( data.focus === false ) return;
-                       newValue = TextInputManager.hide( data );
-                       newValue = keep !== 27 ? ( data.validater ? '' + data.validater( newValue ) : newValue ) : data.value; // 27:ESC
-
-                       data.elmValue.innerHTML = newValue;
-                       
-                       data.onUpdate && newValue !== data.value && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ newValue, data.value ], this );
-                       
-                       data.value = newValue;
-                       data.focus = false;
-                       finish( data );
-               },
-               enabled : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.enabled !== v ){
-                               Util.toggleClass( data.elm, 'ui-textinput-disabled', !v );
-                               if( data.focus === true && v === false ) this.blur();
-                               data.enabled = v;
-                               data.node.disabled( !( data.visible && v ) );
-                       };
-                       return data.enabled;
-               },
-               visible : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.visible !== v ){
-                               data.elm.style.display = v ? '' : 'none';
-                               if( data.focus === true && v === false ) this.blur();
-                               data.visible = v;
-                               data.node.disabled( !( data.enabled && v ) );
-                       };
-                       return data.visible;
-               },
-               destroy : function(){
-                       var data = UIItemPrivateData.get( this );
-                       data.focus === true && TextInputManager.hide( data );
-                       data.destroy();
-               }
-       };
-
-/* --------------------------------
- * TextInputManager
- */
-       var FileInputManager = ( function(){
-               var currentData,
-                       elmForm,
-                       elmFileInput,
-                       elmWrap,
-                       evt;
-               
-               function updateWrapperPosition(){
-                       var p = Position.cumulativeOffset( currentData.elmValue ),
-                               w = currentData.elmValue.offsetWidth,
-                               _w;             
-                       elmWrap.style.cssText = [
-                               'left:',   p[ 0 ], 'px;',
-                               'top:',    p[ 1 ], 'px;',//,
-                               'width:',  w, 'px;'//,
-                               //'height:', data.elmValue.offsetHeight, 'px;',
-                               //'position:absolute;'
-                       ].join( '' );
-                       
-                       _w = elmWrap.offsetWidth;
-                       if( w !== _w ) elmWrap.style.width = ( w - ( _w - w ) ) + 'px'; 
-               };
-               
-               function change( e ){
-                       var data = currentData,
-                               file = data.elmFileInputReal.value;
-                       file = file.split( '\\' );
-                       file = file[ file.length - 1 ];
-                       if( data.value !== file ){
-                               data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ file, data.value ], this );
-                               data.elmValue.innerHTML = data.value = file;
-                       };
-                       currentData.item.blur();
-               };
-               function asyncMouseout(){
-                       currentData && currentData.item.blur();
-               };
-               function onClick(){
-                       MouseEvent.remove( currentUser, elmFileInput, 'mouseout', asyncMouseout );
-                       MouseEvent.remove( currentUser, elmFileInput, 'click', onClick );       
-               };
-               return {
-                       show : function( data ){
-                               currentData = data;
-                               
-                               elmFileInput = data.elmFileInputReal;
-                               elmWrap      = elmFileInput.parentNode;
-                               // 
-                               
-                               updateWrapperPosition();
-                               elmFileInput.focus();
-                               //data.node.addEventListener( 'change', change, data );
-                               evt = new EventTicketClass( elmFileInput, 'change', change );
-                               MouseEvent.add( currentUser, elmFileInput, 'mouseout', asyncMouseout );
-                               MouseEvent.add( currentUser, elmFileInput, 'click', onClick );
-                               // currentData.elmFileInputReal.onchange = change;
-                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );
-                       },
-                       hide : function( data ){
-                               if( currentData !== data ) return;
-                               // data.node.removeEventListener( 'change', change );
-                               evt.destroy();
-                               // MouseEvent.remove( currentUser, elmFileInput, 'mouseout', asyncMouseout );
-                               onClick();
-                               //currentData.elmFileInputReal.onchange = null;
-                               elmWrap.style.display = 'none';
-                               currentData = elmFileInput = null;
-                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition );
-                       },
-                       onWindowResize: function( _w, _h ){
-                               AsyncCall.add( currentUser, updateWrapperPosition );
-                       }
-               };
-       })();
-       
-       var FileInputClass = function( groupData, elmWrapper, onUpdate, validater, elmFileInputReal, elmValue ){
-               var data = new UIItemPrivateData();
-               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
-               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-fileinput-hover', 'pointer' );
-               data.elmValue = elmValue;
-               data.elmFileInputReal = elmFileInputReal;
-               data.node.addEventListener( 'mouseover', this.focus, this );
-       };
-       FileInputClass.prototype = {
-               value : function(){
-                       return data.value;
-               },
-               focus : function(){
-                       var data = UIItemPrivateData.get( this );
-                       data.focus = true;
-                       Util.addClass( data.elm, 'fileinput-has-focus' );
-                       start( data );
-                       FileInputManager.show( data );
-               },
-               blur : function( keyCode ){
-                       var data = UIItemPrivateData.get( this );
-                       Util.removeClass( data.elm, 'fileinput-has-focus' );
-                       data.focus = false;
-                       FileInputManager.hide( data );
-                       finish( data );
-               },
-               enabled : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.enabled !== v ){
-                               if( data.focus === true && v === false ) this.blur();
-                               Util.toggleClass( data.elm, 'fileinput-disabled', !v );
-                               data.enabled = v;
-                               data.node.disabled( !( data.visible && v ) );
-                       };
-                       return data.enabled;
-               },
-               visible : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.visible !== v ){
-                               if( data.focus === true && v === false ) this.blur();
-                               data.elm.style.display = v ? '' : 'none';
-                               data.visible = v;
-                               data.node.disabled( !( data.enabled && v ) );
-                       };
-                       return data.visible;
-               },
-               destroy : function(){
-                       var data = UIItemPrivateData.get( this );
-                       data.focus === true && FileInputManager.hide( data );
-                       data.destroy();
-               }
-       };
-       
-       var ButtonClass = function( groupData, elmWrapper, onUpdate ){
-               var data = new UIItemPrivateData();
-               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
-               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-button-hover', 'pointer' );
-               data.node.addEventListener( 'click', onUpdate );
-               //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', onUpdate );
-       };
-       ButtonClass.prototype = {
-               focus : function(){
-                       var data = UIItemPrivateData.get( this );
-                       data.focus = true;
-                       Util.addClass( data.elm, 'button-has-focus' );
-                       start( data );
-               },
-               blur : function( keyCode ){
-                       var data = UIItemPrivateData.get( this );
-                       keyCode === 13 && data.onUpdate && data.onUpdate();
-                       Util.removeClass( data.elm, 'button-has-focus' );
-                       data.focus = false;
-                       finish( data );
-               },
-               enabled : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.enabled !== v ){
-                               Util.toggleClass( data.elm, 'button-disabled', !v );
-                               data.enabled = v;
-                               data.node.disabled( !( data.visible && v ) );
-                       };
-                       return data.enabled;
-               },
-               visible : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.visible !== v ){
-                               data.elm.style.display = v ? '' : 'none';
-                               data.visible = v;
-                               data.node.disabled( !( data.enabled && v ) );
-                       };
-                       return data.visible;
-               },
-               destroy : function(){
-                       var data = UIItemPrivateData.get( this );
-                       // MouseEvent.remove( data.groupData.apiuser, data.elm );
-                       data.destroy();
-               }
-       };
-
-       var ComboBoxClass = function( groupData, elmWrapper, onUpdate ){
-               var elmA   = ELM_COMBOBOX.cloneNode( true ),
-                       data   = new UIItemPrivateData();
-               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
-               
-               data.elmBox      = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ];
-               data.elmBox.appendChild( elmA );
-               data.elmA        = elmA;
-               data.elmToggle   = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ];
-               data.elmValue    = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild;
-               data.selectIndex = 0;
-               data.optionList  = [];
-
-               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-combobox-hover', 'pointer' );
-               data.node.addEventListener( 'click', this.focus, this );
-       };
-       ComboBoxClass.prototype = {
-               focus : function( e ){
-                       var data = UIItemPrivateData.get( this );
-                       data.node.removeEventListener( 'click', this.focus );
-                       data.focus = true;
-                       data.elmA.className = 'combobox-has-focus';
-                       start( data );
-                       OptionControl.show( data );
-                       return false;
-               },
-               blur : function( keyCode ){
-                       var data = UIItemPrivateData.get( this );
-                       OptionControl.hide( this );
-                       data.focus = false;
-                       data.elmA.className = '';
-                       finish( data );
-                       data.node.addEventListener( 'click', this.focus, this );
-               },
-               enabled : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.enabled !== v ){
-                               Util.toggleClass( data.elm, 'ui-combobox-disabled', !v );
-                               if( data.focus === true && v === false ) this.blur();
-                               data.enabled = v;
-                               data.node.disabled( !( data.visible && v ) );
-                       };
-                       return data.enabled;
-               },
-               visible : function( v ){
-                       var data = UIItemPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.visible !== v ){
-                               data.elm.style.display = v ? '' : 'none';
-                               if( data.focus === true && v === false ) this.blur();
-                               data.visible = v;
-                               data.node.disabled( !( data.enabled && v ) );
-                       };
-                       return data.visible;
-               },
-               value : function( _value ){
-                       var data = UIItemPrivateData.get( this ),
-                               i    = 0,
-                               list = data.optionList,
-                               l    = list.length,
-                               _option;
-                       if( Type.isString( _value ) === true && data.value !== _value ){
-                               for( ; i < l; ++i ){
-                                       _option = list[ i ];
-                                       if( _value === _option.value ){
-                                               data.value = _value;
-                                               data.index = i;
-                                               data.elmValue.data = _option.displayValue;
-                                               if( data.focus === true ){
-                                                       OptionControl.update( this, _value );
-                                               };
-                                               data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, _value, this );
-                                               break;
-                                       };
-                               };
-                       };
-                       return data.value;
-               },
-               selectIndex : function(){
-                       var data = UIItemPrivateData.get( this );
-                       return data.selectIndex;
-               },
-               createOption : function( _displayValue, _value, _isSelected ){
-                       var data   = UIItemPrivateData.get( this ),
-                               option = null,
-                               list   = data.optionList,
-                               i      = list.length,
-                               _option, i;
-                       _value      = _value || _displayValue;
-                       _isSelected = !!_isSelected;
-                       for( ; i; ){
-                               _option = list[ --i ];
-                               if( _value === _option.value ){
-                                       option = _option;
-                                       break;
-                               };
-                       };
-                       if( _isSelected === true ){
-                               data.selectIndex   = list.length;
-                               data.elmValue.data = _displayValue;
-                       };                      
-                       option === null && list.push( new OptionDataClass( _displayValue, _value, _isSelected ) );
-               },
-               destroy : function(){
-                       var data   = UIItemPrivateData.get( this );
-                       data.focus === true && OptionControl.hide( this );
-                       // this.blur();
-                       // MouseEvent.remove( data.groupData.apiuser, data.elm );
-                       data.optionList.length = 0;
-                       data.destroy();
-               }
-       };
-       var OptionDataClass = function( displayValue, value, isCurrent ){
-               this.displayValue = displayValue;
-               this.value        = value || displayValue;
-               this.current      = isCurrent;
-               displayValue = value = null;
-       };
-
-       var OptionControl = ( function(){
-               var ELM_OPTION_WRAPPER = ( function(){
-                               var ret = document.createElement( 'div' );
-                               ret.className = 'option-container';
-                               return ret;
-                       })(),
-                       ELM_OPTION_ORIGIN = ( function(){
-                               var ret = document.createElement( 'a' );
-                               ret.appendChild( document.createTextNode( 'option' ) );
-                               ret.href = '#';
-                               return ret;
-                       })();
-
-               var OptionClass = function( option ){
-                       this.elm     = ELM_OPTION_ORIGIN.cloneNode( true );
-                       this.data    = option;
-                       this.init();
-               };
-               OptionClass.prototype = {
-                       init: function(){
-                               ELM_OPTION_WRAPPER.appendChild( this.elm );
-                               this.elm.firstChild.data = this.data.displayValue;
-                               this.current( this.data.current );
-                               MouseEvent.add( SUPER_USER_KEY, this.elm, 'mousedown', onOptionSelect );// onclick では 選択ボックス 隠すように body に設定した onmouseup が先に動いてしまう!
-                       },
-                       current: function( _current ){
-                               this.elm.className = _current === true ? CLASSNAME_COMBOBOX_OPTION_CURRENT : CLASSNAME_COMBOBOX_OPTION;
-                               this.data.current  = _current;
-                               currentOption      = _current === true ? this : currentOption;
-                       },
-                       destroy: function(){
-                               MouseEvent.remove( SUPER_USER_KEY, this.elm );
-                               Util.removeAllChildren( this.elm );
-                               ELM_OPTION_WRAPPER.removeChild( this.elm );
-                               delete this.elm;
-                               delete this.data;
-                       }
-               };
-               
-               function onOptionSelect( e ){
-                       var i = 0,
-                               l = OPTION_LIST.length,
-                               _option;
-                       for( ; i < l; ++i ){
-                               _option = OPTION_LIST[ i ];
-                               if( this === _option.elm ){
-                                       updateCurrrentOption( _option.data.value, true );
-                                       currentCombobox.blur();
-                                       break;
-                               };
-                       };
-                       return false;
-               };
-               
-               var OPTION_LIST     = [],
-                       currentCombobox = null,
-                       apiuser,
-                       elm,
-                       currentOption,
-                       currentIndex;
-               
-               function updateCurrrentOption( _value, _updateCombobox ){
-                       var _option,
-                               i = OPTION_LIST.length;
-                       for( ; i; ){
-                               _option = OPTION_LIST[ --i ];
-                               if( _value === _option.data.value ){
-                                       currentOption && currentOption.current( false );
-                                       _option.current( true );
-                                       currentOption = _option;
-                                       currentIndex  = i;
-                                       _updateCombobox === true && currentCombobox.value( _value );
-                                       break;
-                               };
-                       };
-               };
-               function bodyMouseupHandler(){
-                       currentCombobox.blur();
-                       OptionControl.hide( currentCombobox );
-               };
-               function updateWrapperPosition(){
-                       var position = Util.getAbsolutePosition( elm );
-
-                       ELM_OPTION_WRAPPER.style.cssText = [
-                               'width:', elm.offsetWidth - 2, 'px;',
-                               'left:',  position.x, 'px;',
-                               'top:',   position.y + elm.offsetHeight, 'px;'
-                       ].join( '' );
-               };
-               function change( e ){
-                       var l   = OPTION_LIST.length,
-                               i   = currentIndex + ( e.keyCode === 40 ? -1 : 1 );
-                       if( currentCombobox === null || l < 2 ) return;
-                       i = i < 0 ?
-                                       l - 1 :
-                                       i < l ? i : 0;
-                       updateCurrrentOption( OPTION_LIST[ i ].data.value, true );
-                       return false;
-               };
-               return {
-                       show: function( data ){
-                               var combobox = data.item,
-                                       list     = data.optionList,
-                                       i        = 0,
-                                       l        = list.length;
-                               if( currentItem !== combobox || currentCombobox === combobox ) return;
-                               currentCombobox && currentCombobox.blur();
-                               
-                               apiuser         = data.groupData.apiuser;
-                               currentCombobox = combobox;
-                               elm             = data.elmBox;
-                               
-                               for( ; i < l; ++i ){
-                                       OPTION_LIST.unshift( new OptionClass( list[ i ] ) );
-                               };
-                               MouseEvent.add( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );
-                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 38 );
-                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 40 );
-                               //KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onEnter, 13 );
-                               //KeyEvent.updateCurrentListener( SUPER_USER_KEY );
-                               
-                               body.appendChild( ELM_OPTION_WRAPPER );
-                               
-                               updateCurrrentOption( combobox.value(), false );
-                               updateWrapperPosition();
-                               
-                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );
-                       },
-                       hide: function( _combobox ){
-                               if( currentCombobox !== _combobox || currentCombobox === null ) return;
-
-                               var _option;
-                               while( _option = OPTION_LIST.shift() ){
-                                       _option.destroy();
-                               };
-                               
-                               body.removeChild( ELM_OPTION_WRAPPER );
-                               
-                               MouseEvent.remove( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );
-                               KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change );
-                               KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change );
-                               //KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onEnter );
-                               //KeyEvent.updateCurrentListener( apiuser );
-                               
-                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition, 500 );
-                               
-                               apiuser         = null;
-                               currentCombobox = null;
-                               currentOption   = null;
-                               currentIndex    = 0;                            
-                       },
-                       onEnter: function(){
-                               currentCombobox.value( currentOption.data.value );
-                               //currentCombobox.blur();
-                               //OptionControl.hide( currentCombobox );
-                       },
-                       update: function( data, _value ){
-                               if( currentCombobox !== data.item || currentItem !== data.item ) return;
-                               if( currentOption.data.value === _value ) return;
-                               updateCurrrentOption( _value, true );
-                       },
-                       onWindowResize: function( _w, _h ){
-                               currentCombobox && AsyncCall.add( apiuser, updateWrapperPosition );
-                       }
-               };
-       })();
-       
-       var UIGroupPrivateData = function(){};
-       UIGroupPrivateData.prototype = {
-               apiuser  : null,
-               node     : null,
-               uigroup  : null,
-               itemList : null,
-               visible  : true,
-               enabled  : true,
-               init     : function( apiuser, node, uigroup ){
-                       this.apiuser  = apiuser;
-                       this.node     = node;
-                       this.uigroup  = uigroup;
-                       this.itemList = [];
-                       UIGroupPrivateData.list.push( this );
-               },
-               destroy  : function(){
-                       
-               }
-       };
-       UIGroupPrivateData.list = [];
-       UIGroupPrivateData.get  = function( uigroup ){
-               var list = UIGroupPrivateData.list,
-                       i    = list.length;
-               for( ; i; ){
-                       if( list[ --i ].uigroup === uigroup ) return list[ i ];
-               };
-               return null;
-       };
-       
-       var UIGroupClass = function( apiuser, node ){
-               ( new UIGroupPrivateData() ).init( apiuser, node, this );
-       };
-       UIGroupClass.prototype = {
-               focus : function( _value ){
-                       var data = UIGroupPrivateData.get( this );
-                       /*
-                       if( _value === true ){
-                               if( currentItem ){
-                                       start( apiuser, self, currentItem );
-                               } else
-                               if( itemList.length > 0 ){
-                                       start( apiuser, self, itemList[ 0 ] );
-                               };
-                       } else
-                       if( _value === false ){
-                               finish( apiuser, self, currentItem );
-                       } else
-                       */
-                       if( _value && Util.getIndex( data.itemList, _value ) !== -1 ){
-                               // currentItem = _value;
-                               currentList = data.itemList;
-                       };
-                       return currentUi === this; 
-               },
-               blur : function(){
-                       var data = UIGroupPrivateData.get( this );
-                       if( currentList === data.itemList ){
-                               currentList = null;
-                       };
-               },
-               createInputText : function( elmWrapper, onUpdate, validater ){
-                       var data     = UIGroupPrivateData.get( this ),
-                               elmValue = Util.getElementsByClassName( elmWrapper, 'editable-value' )[ 0 ],
-                               ret;
-                       if( elmValue ){
-                               ret = new TextInputClass( data, elmWrapper, elmValue, onUpdate, validater );
-                               data.itemList.push( ret );
-                               return ret;
-                       };
-                       alert( 'error createInputText' );
-               },
-               createButton : function( elm, onClick ){
-                       var data = UIGroupPrivateData.get( this ),
-                               ret  = new ButtonClass( data, elm, onClick );
-                       data.itemList.push( ret );
-                       return ret;
-               },
-               createFileInput : function( elm, onUpdate, validater, elmFileInputReal ){
-                       var data     = UIGroupPrivateData.get( this ),
-                               elmValue = Util.getElementsByClassName( elm, 'fileinput-value' )[ 0 ],
-                               ret;
-                       if( elmValue ){
-                               ret = new FileInputClass( data, elm, onUpdate, validater, elmFileInputReal, elmValue );
-                               data.itemList.push( ret );
-                               return ret;
-                       };
-                       return ret;
-               },
-               createCombobox : function( elm, onUpdate, optionList ){
-                       var data = UIGroupPrivateData.get( this ),
-                               ret  = new ComboBoxClass( data, elm, onUpdate, optionList );
-                       data.itemList.push( ret );
-                       return ret;
-               },
-               createCheckBox : function(){
-                       
-               },
-               createRadio : function(){
-                       
-               },
-               createSlider : function(){
-                       
-               },
-               visible : function( v ){
-                       var data = UIGroupPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.visible !== v ){
-                               for( var i = data.itemList.length; i; ){
-                                       data.itemList[ --i ].visible( v );
-                               };
-                               data.visible = v;
-                               data.node.disabled( !( data.enabled && v ) );
-                       };
-                       return data.visible;
-               },
-               enabled : function( v ){
-                       var data = UIGroupPrivateData.get( this );
-                       if( Type.isBoolean( v ) === true && data.enabled !== v ){
-                               for( var i = data.itemList.length; i; ){
-                                       data.itemList[ --i ].enabled( v );
-                               };
-                               data.enabled = v;
-                               data.node.disabled( !( data.visible && v ) );
-                       };
-                       return data.enabled;
-               },
-               destroy : function(){
-                       var data = UIGroupPrivateData.get( this ),
-                               _item;
-                       if( currentUi === this ){
-                               currentItem.blur();
-                               // finish( UIItemPrivateData.get( currentItem ) );
-                       };                      
-                       while( _item = data.itemList.shift() ){
-                               _item.destroy();
-                       };
-                       data.destroy();
-               }
-       };
-       
-       function start( data ){
-               if( currentItem !== data.item ){
-                       currentUi !== data.groupData.uigroup && currentUi && currentUi.blur();
-                       
-                       currentItem !== null && currentItem.blur();
-                       
-                       currentUser = data.groupData.apiuser;
-                       currentUi   = data.groupData.uigroup;
-                       currentItem = data.item;
-                       
-                       currentUi.focus( currentItem );
-                       
-                       // if( currentUser !== _apiuser ) {
-                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );
-                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );
-                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown,  9 );
-                               KeyEvent.updateCurrentListener( SUPER_USER_KEY );
-                       // };
-               };
-       }
-       function finish( data ){
-               if( currentItem === data.item ){
-                       currentUi.blur();
-                       
-                       currentUser = null;
-                       currentUi   = null;
-                       currentItem = null;
-                       currentList = null;
-                       
-                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );
-                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );
-                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown,  9 );
-                       KeyEvent.updateCurrentListener( data.groupData.apiuser );
-               };
-       };
-
-       function onKeyDown( e ){
-               if( currentItem === null ) return true;
-               var keyCode = e.keyCode,
-                       index   = Util.getIndex( currentList, currentItem );
-               if( keyCode === 13 || keyCode === 27 || keyCode === 9 || keyCode === 18 || e.altKey === true ){ // 13.return 27.esc 9.tab 18.alt
-                       keyCode === 9  && tabShift( index, e.shiftKey === true ? -1 : 1 );
-                       keyCode === 13 && currentItem instanceof ComboBoxClass && OptionControl.onEnter();
-                       keyCode === 13 && tabShift( index, 1 );                 
-                       currentItem && currentItem.blur( keyCode );
-                       return false;
-               };
-       };
-
-       function tabShift( index, way ){
-               var l = currentList.length,
-                       i = index + way,
-                       item;
-               if( l < 2 ) return;
-               while( i !== index ){
-                       i = i < 0 ?
-                               l - 1 :
-                               i < l ? i : 0; // 0 < i < l
-                       item = currentList[ i ];
-                       if( item.enabled() === true && item.visible() === true ){
-                               AsyncCall.add( currentUser, item.focus, null, item );
-                               return;
-                       };
-                       i += way;
-               };
-       };
-       
-       return {
-               createUIGroup: function( apiuser, node ){
-                       var uid  = apiuser.getUID(),
-                               list = UI_LIST[ uid ],
-                               ui   = new UIGroupClass( apiuser, node );
-                       if( Type.isArray( list ) === false ){
-                               list = UI_LIST[ uid ] = [];
-                       };
-                       list.push( ui );
-                       return ui;
-               },
-               onWindowResize: function( w, h ){
-                       windowW = w;
-                       windowH = h;
-                       currentItem instanceof ComboBoxClass && OptionControl.onWindowResize( w, h );
-                       currentItem instanceof TextInputClass && TextInputManager.onWindowResize( w, h );
-                       currentItem instanceof FileInputClass && FileInputManager.onWindowResize( w, h );
-               },
-               onCurrentApplicationChange: function( _apiuser ){
-                       currentList = UI_LIST[ _apiuser.getUID() ];
-               },
-               onApplicationShutdown: function( _apiuser ){
-                       KeyEvent.remove( _apiuser );
-               },
-               onSystemShutdown: function(){
-                       
-               }
-       };
-})();
-
-var UIForm = ( function(){
-       var FORM_LIST           = [];
-       var CLASSNAME_FORM      = 'uiform-invisible';
-       var CLASSNAME_FILE_WRAP = 'ui-fileinput-wrapper';
-       var FormItemData = function(){};
-       FormItemData.prototype = {
-               formData : null,
-               uiItem   : null,
-               init : function( formData, uiItem ){
-                       this.formData = formData;
-                       this.uiItem   = uiItem;
-               },
-               onUpdate : function( v ){
-                       // var index = Util.getIndex( this.formData.itemList, this );
-               }
-       };
-       
-       var FormPrivateData = function(){};
-       FormPrivateData.prototype = {
-               apiuser  : null,
-               node     : null,
-               form     : null,
-               elmForm  : null,
-               itemList : null,
-               visible  : true,
-               enabled  : true,
-               init     : function( apiuser, from, node, elm, elmForm ){
-                       this.apiuser      = apiuser;
-                       this.form         = form;
-                       this.ui           = apiuser.createUIGroup( node );
-                       this.node         = node;
-                       this.elm          = elm;
-                       this.elmForm      = elmForm;
-                       this.itemList     = [];
-                       elmForm.className = CLASSNAME_FORM;
-                       FormPrivateData.list.push( this );
-                       
-                       var forms = Util.copyArray( elmForm.getElementsByTagName( '*' ) ),
-                               l     = forms.length,
-                               i     = 0,
-                               items = 'input,select,textarea,button',
-                               form, data, el, wrap;
-                       for( ; i<l; ++i ){
-                               form = forms[ i ];
-                               if( form.nodeType !== 1 ) continue;
-                               switch( form.tagName.toLowerCase() ){
-                                       case 'input':
-                                               switch( form.type.toLowerCase() ){
-                                                       case 'text':
-                                                               break;
-                                                       case 'file':
-                                                               el = document.createElement( 'div' );
-                                                               el.className = 'uiform-file-container';
-                                                               el.appendChild( document.createElement( 'div' ) );
-                                                               el.appendChild( document.createElement( 'div' ) );
-                                                               el.firstChild.className = 'uiform-label';
-                                                               el.lastChild.className  = 'uiform-file fileinput-value';
-                                                               // opera9 don't work for opera9;
-                                                               //el = Util.pullHtmlAsTemplete( '<div class="uiform-file-container"><div class="uiform-label"></div><div class="uiform-file fileinput-value"></div></div>' );
-                                                               elm.appendChild( el );
-                                                               data = new FormItemData();
-                                                               wrap = document.createElement( 'div' );
-                                                               form.parentNode.insertBefore( wrap, form );
-                                                               wrap.className = CLASSNAME_FILE_WRAP;
-                                                               wrap.appendChild( form );
-                                                               data.init( this, this.ui.createFileInput( el, data.onUpdate, null, form ) );
-                                                               this.itemList.push( data );
-                                                               break;
-                                                       case 'button':
-                                                               break;
-                                                       default:
-                                                               continue;
-                                               };
-                                               break;
-                                       case 'select':
-                                               break;
-                                       case 'button':
-                                               break;
-                                       case 'textarea':
-                                               break;
-                                       default:
-                                               continue;
-                               };
-                       };
-               },
-               destroy  : function(){
-                       
-               }
-       };
-       FormPrivateData.list = [];
-       FormPrivateData.get  = function( from ){
-               var list = FormPrivateData.list,
-                       i    = list.length;
-               for( ; i; ){
-                       if( list[ --i ].form === form ) return list[ i ];
-               };
-               return null;
-       };
-       
-       var FormClass = function( apiuser, node, elm, elmForm ){
-               ( new FormPrivateData() ).init( apiuser, this, node, elm, elmForm );
-       };
-       FormClass.prototype = {
-               createTextInput : function(){
-                       
-               },
-               createMultiLineInput : function(){
-                       
-               },
-               createFileInput : function(){
-                       
-               },
-               createButton : function(){
-                       
-               },
-               createComboBox : function(){
-                       
-               },
-               submit : function(){
-                       
-               }
-       };
-       
-       return {
-               createForm: function( apiuser, nodeOrElm, opt_elmForm ){
-                       var uid  = apiuser.getUID(),
-                               list = FORM_LIST[ uid ],
-                               node, elm, form;
-                       if( PointingDeviceEventTree.isNodeInstance( nodeOrElm ) === true ){
-                               node = nodeOrElm;
-                               elm  = PointingDeviceEventTree._getNodePrivateData( nodeOrElm ).elm;
-                       } else {
-                               // App が eventTree を持っている?
-                               // App が eventTree を持っていない
-                               elm  = nodeOrElm;
-                       };  
-                       form = new FormClass( apiuser, node, elm, opt_elmForm );
-                       if( Type.isArray( list ) === false ){
-                               list = FORM_LIST[ uid ] = [];
-                       };
-                       list.push( form );
-                       return form;
-               },
-               onWindowResize: function( w, h ){
-                       windowW = w;
-                       windowH = h;
-                       currentItem instanceof ComboBoxClass && OptionControl.onWindowResize( w, h );
-                       currentItem instanceof TextInputClass && TextInputManager.onWindowResize( w, h );
-                       currentItem instanceof FileInputClass && FileInputManager.onWindowResize( w, h );
-               },
-               onCurrentApplicationChange: function( _apiuser ){
-               },
-               onApplicationShutdown: function( _apiuser ){
-               },
-               onSystemShutdown: function(){
-                       
-               }
-       };
-})();
-
-var Finder = ( function(){
-       var FINDER_LIST              = [],
-               ELM_ORIGIN_LOCATION_ITEM = Util.pullHtmlAsTemplete( '<div class="finder-location-item"></div>' ),
-               HTML_FINDER_ICON = ( function(){
-                       return ( UA.isIE === true && UA.ieVersion < 8 ?
-                       [
-                               '<div class="finder-icon fnder-icon-ie7">',
-                                       '<div class="finder-icon-handle"></div>',
-                                       '<div class="file-icon"><div></div></div>',
-                                       '<span class="finder-icon-cell finder-icon-ie-filename">',
-                                               '<span class="finder-icon-vertical-middle-outer">',
-                                                       '<span class="finder-icon-vertical-middle-inner">',
-                                                               '<span class="finder-icon-filename break-word">file name</span>',
-                                                       '</span>',
-                                               '</span>',
-                                       '</span>',
-                                       '<span class="finder-icon-cell finder-icon-ie-summary">',
-                                               '<span class="finder-icon-vertical-middle-outer">',
-                                                       '<span class="finder-icon-vertical-middle-inner">',
-                                                               '<span class="finder-icon-summary break-word">file descriptiion</span>',
-                                                       '</span>',
-                                               '</span>',
-                                       '</span>',
-                                       '<div class="finder-icon-down"></div>',
-                               '</div>'
-                       ] :
-                       [
-                               '<div class="finder-icon fnder-icon-modern">',
-                                       '<div class="finder-icon-handle"></div>',
-                                       '<div class="file-icon"><div></div></div>',
-                                       '<div class="finder-icon-filename break-word">file name</div>',
-                                       '<div class="finder-icon-summary break-word">file descriptiion</div>',
-                                       '<div class="finder-icon-down">&gt;</div>',
-                               '</div>'
-                       ] ).join( '' );
-               })(),
-               ELM_ORIGIN_FINDER_ICON = Util.pullHtmlAsTemplete( HTML_FINDER_ICON ),
-               ICON_HEIGHT            = Util.getElementSize( ELM_ORIGIN_FINDER_ICON ).height;
-       
-       // t : 時間
-    // b : 開始の値(開始時の座標やスケールなど)
-    // c : 開始と終了の値の差分
-    // d : Tween(トゥイーン)の合計時間
-
-       function easeOutQuad( t, b, c, d ){
-               t /= d;
-               return -c * t*( t-2 ) + b;
-       };
-       
-/**
- * FinderIconClass
- */
-       var FinderIconClass = function(){};
-       FinderIconClass.prototype = {
-               finderData       : null,
-               file             : null,
-               elm              : null,
-               node             : null,
-               _index           : -1,
-               _style           : -1,
-               init : function( page, file, w, index, style ){
-                       if( !this.elm ) this.elm  = ELM_ORIGIN_FINDER_ICON.cloneNode( true );
-
-                       if( this.page !== page ){
-                               this.page = page;
-                               page.elm.appendChild( this.elm );
-                               this.node && this.node.remove();
-                               this.node = page.node.createNode( this.elm, false, true, 'finder-icon-hover', '' );
-                       };
-                       if( this.file !== file ){
-                               this.file && this.file.destroy();
-                               this.file   = file;
-                               this._index = index;
-                               this.draw( w );
-                               return;
-                       };
-                       if( this._index !== index ){
-                               this._index = index;
-                               this.resize( w );
-                       };
-               },
-               index : function( _index ){     
-                       return this._index;
-               },
-               style : function( _style ){
-                       return this._style;
-               },
-               draw : function( w ){
-                       var file       = this.file,
-                               elm        = this.elm,
-                               thumb      = file.getThumbnail(),
-                               elmThumb   = Util.getElementsByClassName( elm, 'file-icon' )[ 0 ].firstChild,
-                               elmName    = Util.getElementsByClassName( elm, 'finder-icon-filename' )[ 0 ],
-                               elmDesc    = Util.getElementsByClassName( elm, 'finder-icon-summary' )[ 0 ];
-                       if( thumb.image ){
-                               elmThumb.className = 'has-thumbnail';
-                               elmThumb.style.backgroundImage = [ 'url(', thumb.image, ')' ].join( '' );
-                       } else {
-                               elmThumb.className = thumb.className;
-                               elmThumb.style.backgroundImage = '';
-                       };
-                       
-                       elmName.firstChild.data = file.getName();
-                       elmDesc.firstChild.data = file.getSummary();
-                       
-                       this.resize( w );
-               },
-               resize : function( w ){
-                       this.node.update( 0, this._index * ICON_HEIGHT, w );
-               },
-               onEditorClick : function( e ){
-                       this.onEditorCallback && this.onEditorCallback( this.file, this.file.editorApplicationList()[ 0 ] );
-                       return false;
-               },
-               onViwerClick : function( e ){
-                       this.onViewerCallback && this.onViewerCallback( this.file, this.file.viewerApplicationList()[ 0 ] );
-                       return false;
-               },
-               onActionClick : function( e ){
-                       this.onActionCallback && this.onActionCallback( this.file );
-                       return false;
-               },
-               destroy : function(){
-                       this.elm && this.elm.parentNode.removeChild( this.elm );
-                       this.file && this.file.destroy();
-                       this.node && this.node.remove();
-                       delete this.page;
-                       delete this.file;
-                       delete this.node;
-                       delete this._index;
-                       delete this._style;
-                       FinderIconClass.pool.push( this );
-               }       
-       };
-       FinderIconClass.pool = [];
-       FinderIconClass.get = function( page, file, w, index, style ){
-               var _icon = FinderIconClass.pool.length > 0 ? FinderIconClass.pool.shift() : new FinderIconClass();
-               _icon.init( page, file, w, index, style );
-               return _icon;
-       };
-
-/**
- * PathClass
- */
-       var PathClass = function(){};
-       PathClass.prototype = {
-               finderData : null,
-               elm        : null,
-               node       : null,
-               file       : null,
-               _index     : null,
-               w          : 0,
-               init : function( finderData, file, index ){
-                       if( !this.elm ) this.elm  = ELM_ORIGIN_LOCATION_ITEM.cloneNode( true );
-                       
-                       if( this.finderData !== finderData ){
-                               this.finderData = finderData;
-                               finderData.elmPath.appendChild( this.elm );
-                               this.node && this.node.remove();
-                               delete this.node;
-                       };
-                       if( this.file !== file ){
-                               this.file = file;
-                               this.draw();
-                       };
-                       this._index = index;
-                       if( !this.node ) this.node = finderData.nodePath.createNode( this.elm, false, true, 'finder-path-hover', 'pointer' );
-               },
-               draw  : function(){
-                       this.elm.className = 'file-icon-' + this.file.getType();
-                       this.elm.innerHTML = this.file.getName();                       
-               },
-               textWidth : function(){
-                       this.elm.style.width = 'auto';
-                       var ret = this.elm.offsetWidth;
-                       this.elm.style.width = '';
-                       return ret + 15;
-               },
-               update : function( x, w ){
-                       this.node.update( x - 15, undefined, w );
-               },
-               index : function( _index ){
-                       return this._index;
-               },
-               destroy : function(){
-                       this.finderData.elmPath.removeChild( this.elm );
-                       this.node && this.node.remove();
-                       
-                       delete this.finderData;
-                       delete this.elm;
-                       delete this.node;
-                       delete this.file;
-                       delete this._index;
-                       PathClass.pool.push( this );
-               }
-       };
-       PathClass.pool = [];
-       PathClass.get  = function( finderData, file, index ){
-               var _bread = PathClass.pool.length > 0 ? PathClass.pool.shift() : new PathClass();
-               _bread.init( finderData, file, index );
-               return _bread;
-       };
-       
-       
-       /**
-        * Page
-        */
-       var PageClass = function(){};
-       PageClass.prototype = {
-               nodeRoot     : null,
-               elmRoot      : null,
-               elmScroll    : null,
-               elm          : null,
-               node         : null,
-               folder       : null,
-               iconList     : null,
-               sliding      : false,
-               currentX     : 0,
-               panTime      : 0,
-               startX       : 0,
-               offsetX      : 0,
-               panTotalTime : 0,
-               isPanOut     : false,
-               init : function( nodeRoot, elmRoot, elmScroll ){
-                       this.nodeRoot  = nodeRoot;
-                       this.elmRoot   = elmRoot;
-                       this.elmScroll = elmScroll;
-                       
-                       if( this.elm === null ){
-                               this.elm = document.createElement( 'div' );
-                       };
-                       elmScroll.appendChild( this.elm );
-                       this.elm.style.cssText = 'position:absolute;top:0;';
-                       // this.elm.style.display = 'none';
-                       this.node = this.nodeRoot.createNode( this.elm, true, false );
-                       if( this.iconList === null ){
-                               this.iconList = [];
-                       };
-               },
-               panInReady : function( way ){
-                       this.elm.style.display = '';
-                       var x = this.sliding === true ? this.currentX : way * this.nodeRoot.width();
-                       this.startX       = this.currentX = x;
-                       this.targetX      = 0;
-                       this.offsetX      = -x;
-                       this.panTime      = 0;
-                       this.panTotalTime = 20;
-                       this.sliding      = true;
-                       this.isPanOut     = false;
-                       // this.elm.style.left = x + 'px';
-                       this.node.x( x );
-               },
-               panOutReady : function( way ){
-                       var x = -way * this.nodeRoot.width();
-                       this.startX       = this.currentX || 0;
-                       this.targetX      = x;
-                       this.offsetX      = x - this.startX;
-                       this.panTime      = 0;
-                       this.panTotalTime = 20;
-                       this.sliding      = true;
-                       this.isPanOut     = true;
-               },
-               pan : function(){
-                       var page = this,
-                               x    = page.currentX = easeOutQuad( page.panTime, page.startX, page.offsetX, page.panTotalTime );
-                       // page.elm.style.left = x + 'px';
-                       this.node.x( x );
-                       if( page.panTotalTime < ++page.panTime ){
-                               delete page.panTime;
-                               delete page.startX;
-                               delete page.offsetX;                                    
-                               delete page.panTotalTime;
-                               delete page.sliding;
-                               if( this.isPanOut === true ) this.elm.style.display = 'none';
-                       };
-               },
-               draw : function( folder ){
-                       _w = this.nodeRoot.width();
-                       this.folder = folder;
-                       var data     = this,
-                               iconList = data.iconList,
-                               i        = 0,
-                               j        = 0,
-                               l        = folder.getChildFileLength(),
-                               m        = iconList.length,
-                               scrollY  = -this.nodeRoot.scrollY(),
-                               rootH    = scrollY + this.nodeRoot.height(),
-                               icon;
-
-                       for( ; i < l; ++i ){
-                               if( ( i + 1 ) * ICON_HEIGHT < scrollY || rootH < i * ICON_HEIGHT ) continue;
-                               if( j < m ){
-                                       iconList[ j ].init( this, folder.getChildFileAt( i ), _w, i, data.style );
-                               } else {
-                                       iconList.push( FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );
-                               };
-                               j++;
-                       };
-                       data.elmRoot.className    = folder.getState() === Const.FILE.STATE.LOADING ? 'finder-body loading' : 'finder-body';
-                       // data.elmRoot.style.height = ( data.h - data.headH ) + 'px';
-                       
-                       while( j < iconList.length ) iconList.pop().destroy();
-                       data.elmScroll.style.height = ( l * ICON_HEIGHT ) + 'px';
-               },
-               onScroll : function(){
-                       var _w       = this.nodeRoot.width();
-                       
-                       var data     = this,
-                               iconList = data.iconList,
-                               folder   = this.folder,
-                               i        = 0,
-                               j        = 0,
-                               l        = folder.getChildFileLength(),
-                               scrollY  = -this.nodeRoot.scrollY(),
-                               rootH    = scrollY + this.nodeRoot.height(),
-                               startIndex = 0 < iconList.length ? iconList[ 0 ]._index : 0,
-                               icon;
-                       
-                       // console.log( ' > ' + scrollY + ' , ' + rootH )
-                       for( ; i < l; ++i ){
-                               if( ( i + 1 ) * ICON_HEIGHT < scrollY || rootH < i * ICON_HEIGHT ){
-                                       if( iconList.length <= j ) continue;
-                                       icon = iconList[ j ];
-                                       if( icon._index !== i ) continue;
-                                       icon.destroy();
-                                       iconList.splice( j, 1 );
-                                       continue;
-                               };
-                               if( iconList.length <= j || iconList[ j ]._index !== i ){
-                                       if( i < startIndex ){
-                                               iconList.splice( j, 0, FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );                    
-                                       } else
-                                       if( startIndex + iconList.length <= i ){
-                                               iconList.push( FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );                    
-                                       };                                      
-                               };
-                               ++j;
-                       };
-                       
-                       //while( j < iconList.length ) iconList.pop().destroy();
-               },
-               resize : function( w ){
-                       var list = this.iconList,
-                               i    = list.length;
-                       for( ; i; ) list[ --i ].resize( w );
-               },
-               destroy : function(){
-                       var icon;
-                       while( icon = this.iconList.shift() ) icon.destroy();
-                       
-                       this.elm.parentNode.removeChild( this.elm );
-               }
-       };
-       
-       var ApplicationButton = function(){};
-       ApplicationButton.prototype = {
-               elm     : null,
-               button  : null,
-               app     : null,
-               file    : null,
-               fileUID : -1,
-               init    : function( ui, elmParent, app, file ){
-                       if( this.elm === null ){
-                               this.elm = document.createElement( 'div' );
-                       };
-                       elmParent.appendChild( this.elm );
-                       this.elm.className = 'button';
-                       this.elm.innerHTML = app.getDisplayName();
-                       
-                       var that = this;
-                       this.button = ui.createButton( this.elm, function(){
-                               that.onClick();
-                               // that = null;
-                       } );
-                       
-                       this.app     = app;
-                       this.file    = file;
-                       this.fileUID = file.getUID();
-               },
-               onClick : function(){
-                       this.app.boot( this.file );
-                       return false;
-               },
-               destroy : function(){
-                       var elm = this.elm;
-                       elm.parentNode.removeChild( elm );
-                       
-                       this.button.destroy();
-                       //this.kill()
-                       //this.elm = elm;
-               }
-       };
-       
-       var DetailPageClass = function(){};
-       DetailPageClass.prototype = Util.extend( new PageClass(), {
-               appButtons : null,
-               init : function( finderData ){
-                       this.finderData = finderData;
-                       this.apiuser    = finderData.apiuser;
-                       this.nodeRoot   = finderData.nodeRoot;
-                       this.elmRoot    = finderData.elmRoot;
-                       this.elmScroll  = finderData.elmScroll;
-                       
-                       if( this.elm === null ){
-                               this.elm = Util.pullHtmlAsTemplete( [
-                                       '<div class="finder-detail">',
-                                               '<div class="file-icon"><div></div></div>',
-                                               '<div class="finder-detail-filename break-word">file name</div>',
-                                               '<div class="finder-detail-summary break-word">file descriptiion</div>',
-                                               '<div>View this file</div>',
-                                               '<div class="viewer-apps"></div>',                                              
-                                               '<div>Edit this file</div>',
-                                               '<div class="editor-apps"></div>',
-                                       '</div>'
-                               ].join( '' ) );
-                       };
-                       this.elm.style.display = 'none';
-                       this.elmScroll.appendChild( this.elm );
-                       this.node = this.nodeRoot.createNode( this.elm, true, false );
-                       
-                       this.ui = this.apiuser.createUIGroup( this.node );
-                       this.appButtons = [];
-               },
-               draw : function( file ){
-                       var elm        = this.elm,
-                               thumb      = file.getThumbnail(),
-                               elmThumb   = Util.getElementsByClassName( elm, 'file-icon' )[ 0 ].firstChild,
-                               elmName    = Util.getElementsByClassName( elm, 'finder-detail-filename' )[ 0 ],
-                               elmDesc    = Util.getElementsByClassName( elm, 'finder-detail-summary' )[ 0 ],
-                               tmpButtons = Util.copyArray( this.appButtons ),
-                               apps, app, elmContainer;
-                       if( thumb.image ){
-                               elmThumb.className = 'has-thumbnail';
-                               elmThumb.style.backgroundImage = [ 'url(', thumb.image, ')' ].join( '' );
-                       } else {
-                               elmThumb.className = thumb.className;
-                               elmThumb.style.backgroundImage = '';
-                       };
-                       
-                       elmName.firstChild.data = file.getName();
-                       elmDesc.firstChild.data = file.getSummary();
-                       this.node.width( this.nodeRoot.width() );
-                       this.node.height( this.nodeRoot.height() );
-                       
-                       this.appButtons.length = 0;
-                       
-                       apps         = file.viewerApplicationList();
-                       elmContainer = Util.getElementsByClassName( elm, 'viewer-apps' )[ 0 ];
-                       for( i = 0; i < apps.length; ++i ){
-                               button = 0 < tmpButtons.length ? tmpButtons.shift() : new ApplicationButton();
-                               button.init( this.ui, elmContainer, apps[ i ], file );
-                               this.appButtons.push( button );
-                       };
-                       apps         = file.editorApplicationList();
-                       elmContainer = Util.getElementsByClassName( elm, 'editor-apps' )[ 0 ];
-                       for( i = 0; i < apps.length; ++i ){
-                               button = 0 < tmpButtons.length ? tmpButtons.shift() : new ApplicationButton();
-                               button.init( this.ui, elmContainer, apps[ i ], file );
-                               this.appButtons.push( button );
-                       };
-                       
-                       while( button = tmpButtons.shift() ) button.destroy();
-                       
-                       this.resize();
-               },
-               pan : function(){
-                       var page = this,
-                               x    = page.currentX = easeOutQuad( page.panTime, page.startX, page.offsetX, page.panTotalTime );
-                       // page.elm.style.left = x + 'px';
-                       this.node.x( x );
-                       if( page.panTotalTime < ++page.panTime ){
-                               delete page.panTime;
-                               delete page.startX;
-                               delete page.offsetX;                                    
-                               delete page.panTotalTime;
-                               delete page.sliding;
-                               if( this.isPanOut === true ) this.elm.style.display = 'none';
-                       };
-               },
-               onScroll : function(){
-                       
-               },
-               resize : function(){
-                       this.elmScroll.style.height = this.nodeRoot.height() + 'px';
-               },
-               destroy : function(){
-                       var button;
-                       while( button = this.appButtons.shift() ) button.destroy();
-                       this.ui.destroy();
-                       this.node.remove();
-               }
-       });
-       
-/**
- * FinderPrivateData
- */
-       var FinderPrivateData = Class.create(
-               Class.PRIVATE_DATA, {
-               finder       : null,
-               apiuser      : null,
-               elmRoot      : null,
-               nodeRoot     : null,
-               elmScroll    : null,
-               elmPath      : null,
-               nodePath     : null,
-               tree         : null,
-               onSelect     : null,
-               viewerOption : null,
-               editorOption : null,
-               pathList     : null,
-               headH        : 0,
-               iconW        : 0,
-               iconH        : 0,
-               style        : 0,
-               pageIcons1   : null,
-               pageIcons2   : null,
-               panInPage    : null,
-               panOutPage   : null,
-               pageDetail   : null,
-               currentFile  : null,
-               Constructor : function( finder, apiuser, elm, tree, onSelect, viewerOption, editorOption ){
-                       this.finder       = finder;
-                       this.apiuser      = apiuser;
-                       if( PointingDeviceEventTree.isNodeInstance( elm ) === true ){
-                               this.nodeRoot = elm;
-                               this.elmRoot  = PointingDeviceEventTree._getNodePrivateData( elm ).elm;
-                       } else {
-                               // App が eventTree を持っている?
-                               // App が eventTree を持っていない
-                               this.elmRoot  = elm;
-                       };
-                       this.nodeRoot.addEventListener( 'click', this.onIconClick, this );
-                       this.nodeRoot.addEventListener( 'scroll', this.onScroll, this );
-                       
-                       this.elmScroll    = document.createElement( 'div' );
-                       this.elmRoot.appendChild( this.elmScroll );
-                       this.elmScroll.className     = 'finder-elm-scroll';
-                       this.elmScroll.style.cssText = 'width:100%;overflow:hidden;';
-                       
-                       this.tree         = tree;
-                       this.onSelect     = onSelect;
-                       this.viewerOption = viewerOption;
-                       this.editorOption = editorOption;
-                       
-                       var size          = Util.getElementSize( ELM_ORIGIN_FINDER_ICON );
-                       this.iconW        = size.width;
-                       this.iconH        = size.height;
-                       
-                       tree.addTreeEventListener( Const.TREE.EVENT.UPDATE, this.draw, this );
-                       Util.addClass( this.elmRoot, 'finder-body' );
-                       
-                       if( this.panInPage === null ){
-                               this.pageIcons1 = new PageClass();
-                               this.pageIcons2 = new PageClass();
-                               this.pageDetail = new DetailPageClass();
-                       };
-                       this.pageIcons1.init( this.nodeRoot, this.elmRoot, this.elmScroll );
-                       this.pageIcons2.init( this.nodeRoot, this.elmRoot, this.elmScroll );
-                       this.pageDetail.init( this );
-               },
-               onIconClick : function( e ){
-                       if( this.panInPage === this.pageDetail ) return;
-                       
-                       var target = e.target,
-                               list   = this.panInPage.iconList,
-                               i, icon,
-                               file;
-                       if( target === this.nodeRoot ) return;
-                       for( i = list.length; i; ){
-                               icon = list[ --i ];
-                               if( icon.node === target ){
-                                       i = icon._index;
-                                       file = this.currentFile.getChildFileAt( i );
-                                       if( target.width() - 30 < e.layerX ){
-                                               this.tree.down( i );
-                                               this.draw( this.w, this.h, 1, true );
-                                       } else
-                                       if( file.getChildFileLength() !== -1 || file.getType() === Const.FILE.TYPE.FOLDER ){
-                                               this.tree.down( i );
-                                               this.draw( this.w, this.h, 1 );
-                                       } else
-                                       if( Type.isFunction( this.onSelect ) === true ){ /* && this.onSelect( file ) === true */
-                                               this.onSelect( file );
-                                       } else {
-                                               this.tree.down( i );
-                                               this.draw( this.w, this.h, 1 );
-                                       };
-                                       file.destroy();
-                                       break;
-                               };
-                       };
-               },
-               onScroll : function( e ){
-                       this.panInPage.onScroll( e );
-               },
-               onPathClick : function( e ){
-                       var target = e.target,
-                               i      = target.nodeIndex();
-                       if( target === this.nodePath || this.nodePath.numNode() - 1 === i ) return;
-                       this.tree.up( i );
-                       this.draw( this.w, this.h, -1 );
-               },
-               draw : function( w, h, way, showDetail ){
-                       var data = this, page;
-                       data.w = w = Type.isFinite( w ) === true ? w : data.w;
-                       data.h = h = Type.isFinite( h ) === true ? h : data.h;
-                       
-                       var file     = this.currentFile = this.tree.getCurrentFile(),
-                               isFolder = showDetail !== true && ( file.getChildFileLength() !== -1 || file.getType() === Const.FILE.TYPE.FOLDER );
-                       
-                       data.elmPath && data.drawPath( w );
-                       page = this.panInPage;
-                       if( Type.isNumber( way ) === true ){
-                               if( page.sliding === false ){
-                                       if( isFolder === true ){
-                                               this.panInPage = page === this.pageIcons1 ? this.pageIcons2 : ( page === this.pageIcons2 ? this.pageIcons1 : this.panOutPage );
-                                       } else {
-                                               this.panInPage = this.pageDetail;
-                                       };
-                                       this.panOutPage = page;
-                               };
-                               this.panInPage.panInReady( way );
-                               //this.panInPage.elm.className = 'panIN';
-                               this.panOutPage.panOutReady( way );
-                               //this.panOutPage.elm.className = 'panOut';
-                               this.nodeRoot.disabled( true );
-                               SystemTimer.add( this.apiuser, this.tick, 16, false, this );
-                       } else {
-                               if( isFolder === true ){
-                                       this.panInPage = page === null ? this.pageIcons1 : page;
-                               } else {
-                                       this.panInPage = this.pageDetail;
-                               };
-                       };
-                       this.panInPage.draw( file );
-                       
-                       data.nodeRoot.invalidateScrollbar();
-               },
-               tick : function(){
-                       if( this.panInPage.sliding === false && this.panOutPage.sliding === false ){
-                               SystemTimer.remove( this.apiuser, this.tick );
-                               this.nodeRoot.disabled( false );
-                               this.nodeRoot.invalidateScrollbar();
-                               return;
-                       };
-                       this.panInPage.sliding === true && this.panInPage.pan();
-                       this.panOutPage.sliding  === true && this.panOutPage.pan();
-               },
-               drawPath : function( w ){
-                       if( !this.elmPath.parentNode ) return;
-                       w = this.nodePath.width();
-                       var data      = this,
-                               tree      = data.tree,
-                               pathList  = data.pathList,
-                               i         = 0,
-                               l         = tree.hierarchy() + 1,
-                               m         = pathList.length,
-                               wList     = [],
-                               totalW    = 0,
-                               minW      = FinderPrivateData.MIN_PATH_WIDTH,
-                               file, path, pathW, offset, remove, pathX = 0, fit = false;
-                       
-                       for( ; i < l; ++i ){
-                               file = i !== l - 1 ? tree.getParentFileAt( i ) : this.currentFile;
-                               if( i < m ){
-                                       pathList[ i ].init( this, file, i );
-                               } else {
-                                       pathList.push( PathClass.get( this, file, i ) );
-                               };
-                       };
-                       while( l < pathList.length ) pathList.pop().destroy();
-                       
-                       for( i = l; i; ){
-                               pathW = pathList[ --i ].textWidth();
-                               wList.push( pathW );
-                               totalW += pathW;
-                       };
-                       
-                       //if( minW * ( l + 1 ) * 1.2 < w ){
-                               console.log( totalW + ' , ' + w )
-                               while( true ){
-                                       if( fit === true ) break;
-                                       for( i = 0; i < l; ++i ){
-                                               offset = totalW - w;
-                                               if( offset <= 0 ){
-                                                       fit = true;
-                                                       break;
-                                               };
-                                               remove = l - i;
-                                               remove = offset < remove ? offset : remove;
-                                               pathW  = wList[ i ];
-                                               if( pathW - remove < minW ){
-                                                       totalW -= ( pathW - minW );
-                                                       wList[ i ] = minW;
-                                               } else {
-                                                       wList[ i ] = pathW - remove;
-                                                       totalW -= remove;
-                                               };
-                                       };
-                               };
-                               for( i = 0; i < l; ++i ){
-                                       path  = pathList[ i ];
-                                       pathW = wList[ i ];
-                                       path.update( pathX, pathW );
-                                       pathX += pathW;
-                               };                      
-                       //} else {
-                               
-                       //};
-               },
-               createPath : function( node ){
-                       if( this.elmPath ) return;
-                       
-                       if( PointingDeviceEventTree.isNodeInstance( node ) === true ){
-                               this.nodePath = node;
-                               this.elmPath  = PointingDeviceEventTree._getNodePrivateData( node ).elm;
-                               
-                               node.addEventListener( 'click', this.onPathClick, this );
-                               Util.addClass( this.elmPath, 'finder-path' );
-                               // this.elmPath  = document.createElement( 'div' );
-                               // this.elmPath.className = ;
-                               this.pathList = [];
-                               // this.headH    = 0;
-                               AsyncCall.add( this.apiuser, this.draw, null, this );
-                       };
-               },
-               onKill : function(){
-                       this.tree.removeTreeEventListener( Const.TREE.EVENT.UPDATE, this.draw );
-
-                       if( this.pathList ){
-                               while( this.pathList.length > 0 ) this.pathList.shift().destroy();
-                       };
-                       
-                       this.pageIcons1.destroy();
-                       this.pageIcons2.destroy();
-                       this.pageDetail.destroy();
-                       this.nodeRoot.remove();
-                       
-                       FINDER_LIST.splice( Util.getIndex( FINDER_LIST, this.finder ), 1 );
-                       var data = ApplicationPrivateData.get( this.apiuser ),
-                               list = data.finderList,
-                               i    = Util.getIndex( list, this.finder );
-                       i !== -1 && list.splice( i, 1 );
-               }
-       });
-       FinderPrivateData.MIN_PATH_WIDTH = 25;
-
-/**
- * FinderClass
- */
-       var Finder = Class.create(
-               FinderPrivateData, {
-               Constructor : function( application, elmRoot, tree, onSelect, viewerOption, editorOption ){
-                       Finder.newPrivateData( this, this, application, elmRoot, tree, onSelect, viewerOption, editorOption );
-               },
-               MIN_WIDTH  : 200,
-               MIN_HEIGHT : 200,
-               resize : function( w, h ){
-                       var data = Finder.getPrivateData( this );
-                       data.panInPage && data.panInPage.resize( w );
-               },
-               createPath : function( node ){
-                       return Finder.getPrivateData( this ).createPath( node );
-               },
-               destroy : function(){
-                       this.kill();
-               }
-       });
-
-       return {
-               init: function(){
-                       
-               },
-               create: function( application, elmTarget, tree, onSelect, viewerOption, editorOption ){
-                       //if( Application.isApplicationInstance( _application ) === false ) return;
-                       
-                       var finder = new Finder( application, elmTarget, tree, onSelect, viewerOption, editorOption );
-                       FINDER_LIST.push( finder );
-                       return finder;
-               },
-               registerFinderHead: function(){
-                       
-               },
-               registerFinderPane: function( _finderPane ){
-                       
-               },
-               isFinderInstance: function( _finder ){
-                       return _finder instanceof Finder;
-               },
-               isFinderPaneInstance: function(){
-                       
-               },
-               isFinderHeadInstance: function(){
-               }
-       };
-})();
-
-
-/*
- * -- len, %
- * marginBottom, marginLeft, marginRight, marginTop, margin
- * padding, paddingBottom, paddingLeft, paddingRight, paddingTop
- * fontSize, textIndent
- * height, width
- * bottom, left, right, top                    (len, %)
- *
- * -- len
- * borderBottomWidth, borderLeftWidth, borderRightWidth, borderTopWidth, borderWidth,
- * letterSpacing
- *
- * -- color
- * backgroundColor
- * borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, borderColor
- * color
- *
- * -- special
- * clip                        rect(0px, 40px, 40px, 0px);
- * backgroundPosition  (len, %)
- * opacity
- * lineHeight          (len, %, num)
- * zIndex                      ( order )
- */
-
-var DHTML = ( function(){
-       
-       var TICKET_ARRAY = [],
-               fpms         = 50,
-               round        = Math.round,
-               cround       = function( v ){ return round( v * 100 ) / 100 };
-       
-       function startAnimation( _elm, _cssObject, _onComplete, _onEnterFrame, _numFrames ){
-               var _ticket, i = TICKET_ARRAY.length;
-               for( ; i; ){
-                       _ticket = TICKET_ARRAY[ --i ];
-                       if( _ticket.elm === _elm ){
-                               return;
-                       };
-               };
-               
-               var _currentValues     = [],
-                       _offsetValues      = [],
-                       _endValues         = [],
-                       _targetProperties  = [],
-                       _units             = [];
-               var target, current,
-                       inlineStyle    = CSS.getInlineStyle( _elm ),
-                       currentStyle   = CSS.getWrappedStyle( _elm ),
-                       targetStyle    = CSS.getWrappedStyle( _elm, _cssObject );
-                       targetStyle.pxPerEm = currentStyle.get( 'fontSize' )._toPx();
-               for( var p in _cssObject ){
-                       p       = Util.camelize( p );
-                       target  = targetStyle.get( p );
-                       current = currentStyle.get( p );
-
-                       if( target.isValid() === false || current.isValid() === false || current.equal( target ) !== false ){
-                               target.clear();
-                               current.clear();
-                               continue;
-                       };
-                       
-                       current.convert( target );
-                       // alert( current.getValue() + ' , ' + target.getValue() )
-                       _currentValues.push( current.getValue() );
-                       _offsetValues.push( current.getOffset( target ) );
-                       _endValues.push( target.getValue() );
-                       _targetProperties.push( p );
-                       _units.push( target.getUnit() );
-
-                       // IE has trouble with opacity if it does not have layout
-                       // Force it by setting the zoom level                   
-                       if( p === 'opacity' && SPECIAL.hasLayout ){
-                               if( SPECIAL.hasLayout( _elm ) === false ) inlineStyle.zoom = 1;
-                               inlineStyle.filter = current.getValueText();
-                       } else {
-                               inlineStyle[ p ]   = current.getValueText();
-                       };
-                       
-                       target.clear();
-                       current.clear();
-               };
-               
-               var i, cssTexts = [];
-               for( i = 0; i < _numFrames; ++i ){
-                       if( i < _numFrames - 1 ){
-                               tickValue( _currentValues, _offsetValues, _numFrames );
-                               cssTexts.push( createCssText( _currentValues, _targetProperties, targetStyle, inlineStyle ) );
-                       } else {
-                               cssTexts.push( createCssText( _endValues, _targetProperties, targetStyle, inlineStyle ) );
-                       };
-               };
-               
-               TICKET_ARRAY.push( new AnimationTaskClass(
-                       _elm, cssTexts,
-                       Type.isFunction( _onComplete ) === true   ? _onComplete   : null,
-                       Type.isFunction( _onEnterFrame ) === true ? _onEnterFrame : null,
-                       _numFrames
-               ) );
-               
-               currentStyle.clear();
-               targetStyle.clear();            
-               SystemTimer.add( SUPER_USER_KEY, onEnterFrame, 1000 / fpms );
-       };
-       
-       function tickValue( current, offset, numFrames ){
-               if( Type.isArray( current ) === true ){
-                       var ret, i = current.length;
-                       for( ; i; ){
-                               --i;
-                               ret = tickValue( current[ i ], offset[ i ], numFrames );
-                               if( Type.isNumber( ret ) === true ) current[ i ] = ret;
-                       };
-               } else {
-                       return current + offset / numFrames;
-               };
-       };
-       function createCssText( update, props, style, inline ){
-               var prop;
-               for( var i = props.length; i; ){
-                       prop = style.get( props[ --i ] );
-                       prop.setValue( update[ i ] );
-                       inline[ Util.uncamelize( prop.name ) ] = prop.getValueText();
-                       //if( prop.name === 'backgroundColor' ) alert( prop.getValueText() + '|' + update[ i ].join( ',') )
-                       prop.clear();
-               };
-               return CSS.toCssText( inline );
-       };
-       
-       function onEnterFrame(){
-               var _ticket, l,
-                       i = 0;
-               while( i < TICKET_ARRAY.length ){
-                       _ticket = TICKET_ARRAY[ i ];
-                       l       = _ticket.cssTexts.length;
-                       _ticket.elm.style.cssText = _ticket.cssTexts.shift();
-                       if( l === 1 ){
-                               _ticket.onComplete && _ticket.onComplete();
-                               delete _ticket.elm;
-                               delete _ticket.cssTexts;
-                               delete _ticket.onComplete;
-                               delete _ticket.onEnterFrame;
-                               delete _ticket.numFrame;
-                               TICKET_ARRAY.splice( i, 1 );
-                       } else {
-                               _ticket.onEnterFrame && _ticket.onEnterFrame( l / _ticket.numFrame );
-                               ++i;
-                       };
-               };
-               if( TICKET_ARRAY.length === 0 ){
-                       SystemTimer.remove( SUPER_USER_KEY, onEnterFrame );
-               };
-       };
-       
-       var AnimationTaskClass = function( elm, cssTexts, onEnterFrame, onComplete, numFrame ){
-               this.elm          = elm;
-               this.cssTexts     = cssTexts;
-               this.onEnterFrame = onEnterFrame;
-               this.onComplete   = onComplete;
-               this.numFrame     = numFrame;
-       };
-       
-       var VisualEffectClass = function( elm ){
-               this.elm = elm;
-       };
-       VisualEffectClass.prototype = {
-               anime : function( _cssObject, _onComplete, _onEnterFrame, _time ){
-                       var _numFrames = Math.floor( _time / fpms );
-                       startAnimation( this.elm, _cssObject, _onComplete, _onEnterFrame, _numFrames );
-               },
-               fadeIn : function(){
-                       
-               },
-               fadeOut : function(){
-                       
-               },
-               update : function( x, y, w, h ){
-                       var _cssText = this.elm.style.cssText;
-               }
-       };
-       
-       return {
-               create: function( application, _elm ){
-                       return new VisualEffectClass( _elm );
-               },
-               isInstanceOfVisualEffect: function( _instance){
-                       return _instance instanceof VisualEffectClass;
-               }
-       }
-})();
-
-
-/* --------------------------------------------
- * 
- */
-
-       Application.onCurrentApplicationChange( SUPER_USER_KEY );
-       
-       SERVICE_LIST.push( MouseEvent );
-       
-       new EventTicketClass( window, 'unload', function(){
-               var _service;
-               while( SERVICE_LIST.length > 0 ){
-                       _service = SERVICE_LIST.shift();
-                       Type.isFunction( _service.onSystemShutdown ) === true && _service.onSystemShutdown();
-               }
-       });
-       // beforeunload
-
-
-/* ---------------------------------------------
- * broadcast to global
- */
-       window.gOS = {};
-       
-       gOS.registerApplication = Application.register;
-       gOS.registerDriver      = File.registerDriver;
-       
-var BoxModel
-
-var DOM = ( function( window, document ){
-       var DIV_LIST  = [],
-               SPAN_LIST = [],
-               TEXT_LIST = [];
-       
-       var elmTextSize;
-       
-       function correctNodes( node ){
-               var child;
-               if( node && node.parentNode ){
-                       while( node.lastChild ) correctNodes( node.lastChild );
-                       node.parentNode.removeChild( node );
-                       if( node.nodeType === 1 ){
-                               switch( node.tagName ){
-                                       case 'DIV':
-                                               DIV_LIST.push( node );
-                                               break;
-                                       case 'SPAN':
-                                               SPAN_LIST.push( node );
-                                               break;
-                                       
-                               };
-                               node.removeAttribute( 'className' );
-                               node.removeAttribute( 'style' );
-                               node.removeAttribute( 'id' );
-                       } else
-                       if( node.nodeType === 3 ){
-                               node.data = '';
-                               TEXT_LIST.push( node );
-                       };
-               };
-       };
-       
-       return {
-               createDiv : function(){
-                       return 0 < DIV_LIST.length ? DIV_LIST.shift() : document.createElement( 'div' );
-               },
-               createSpan : function(){
-                       
-               },
-               createText : function(){
-                       
-               },
-               getTextSize : function( elm, content ){
-                       var span = DOM.createSpan(),
-                               text = DOM.createText(),
-                               w, h;
-                       elm.appendChild( span );
-                       span.style.cssText = 'visibility:hidden;position:absolute;';
-                       span.appendChild( text );
-                       text.data = content;
-                       w = span.offsetWidth;
-                       h = span.offsetHeight;
-                       DOM.correctNodes( span );
-                       return [ w, h ];
-               },
-               correctNodes : function( node ){
-                       var child;
-                       if( node && node.parentNode ){
-                               while( node.lastChild ) DOM.correctNodes( node.lastChild );
-                               node.parentNode.removeChild( node );
-                               if( node.nodeType === 1 ){
-                                       switch( node.tagName ){
-                                               case 'DIV':
-                                                       DIV_LIST.push( node );
-                                                       break;
-                                               case 'SPAN':
-                                                       SPAN_LIST.push( node );
-                                                       break;
-                                               
-                                       };
-                                       node.removeAttribute( 'className' );
-                                       node.removeAttribute( 'style' );
-                                       node.removeAttribute( 'id' );
-                               } else
-                               if( node.nodeType === 3 ){
-                                       node.data = '';
-                                       TEXT_LIST.push( node );
-                               };
-                       };
-               }
-       }
-})( window, document );
-
-var XBrowserStyle = ( function(){
-       var     EMPTY          = '',
-               CORON          = ':',
-               SEMICORON      = ';',
-               SPACE          = ' ',
-               UNITS          = 'px,cm,mm,in,pt,pc,em,%'.split( ',' ),
-               CLIP_SEPARATOR = UA.isIE === true && UA.ieVersion < 8 ? ' ' : ',';
-
-       var SPECIAL = ( function(){
-               var special = {};
-               if( UA.isIE === true && UA.ieVersion < 9 ){
-                       if( UA.ACTIVEX === true ){
-                               // special.opacity    = 'ActiveXOpacity';
-                               special.setFilters = function( style ){
-                                       var filters = ( style.filter || '' ).split( ') ' ),
-                                               data    = {},
-                                               i       = filters.length,
-                                               filter, names, props, prop, j, l, key, v;
-                                       for( ; i; ){
-                                               filter   = filters[ --i ].split( ' ' ).join( '' ).split( '(' );
-                                               if( filter.length !== 2 ) continue;
-                                               names    = filter[ 0 ].split( '.' ); // progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9)
-                                               props    = filter[ 1 ].split( ',' ); // 
-                                               filter   = {};
-                                               for( j = 0, l = props.length; j < l; ++j ){
-                                                       prop = props[ j ].split( '=' );
-                                                       key  = prop[ 0 ].toLowerCase();
-                                                       v    = prop[ 1 ];
-                                                       filter[ key ] = v; //v.charAt( 0 ) === '#' ? v : parseInt( v );
-                                               };
-                                               data[ names[ names.length - 1 ] ] = filter;
-                                       };
-                                       
-                                       style.filter  = data;
-                                       style.opacity = data.alpha && data.alpha.opacity ? data.alpha.opacity / 100 : 1;
-                               };
-                               special.hasLayout = function( elm ){
-                                       return elm.currentStyle.hasLayout;
-                               };
-                       } else {
-                               special.opacity = null;
-                       };
-               } else {
-                       var style = document.documentElement.style;
-                       special.opacity = style.opacity           !== undefined ? 'opacity' : 
-                                                       style.MozOpacity          !== undefined ? 'MozOpacity' :
-                                                       style.KhtmlOpacity        !== undefined ? 'KhtmlOpacity' :
-                                                       style[ '-khtml-opacity' ] !== undefined ? 'KhtmlOpacity' : null;
-
-                       // if( style.backgroundPositionX === undefined ){
-                               special.setBackgroundPositionXY = function( style ){
-                                       var bgp = ( style.backgroundPosition || '' ).split( ' ' );
-                                       style.backgroundPositionX = bgp[ 0 ] || 0;
-                                       style.backgroundPositionY = bgp[ 1 ] || 0;
-                               };
-                       // };
-                       if( style.clipTop === undefined && style[ 'clip-top' ] === undefined ){
-                               special.setClipTopRightBottomLeft = function( style ){
-                                       var clip = style.clip;
-                                       if( !cliop || clip.indexOf( 'rect(' ) === -1 ){
-                                               style.clipTop    = 0;
-                                               style.clipRight  = 0;
-                                               style.clipBottom = 0;
-                                               style.clipLeft   = 0;
-                                               return;
-                                       };
-                                       clip = clip.split( '(' )[ 1 ].split( ')' )[ 0 ].split( clip.indexOf( ',' ) !== -1 ? ',' : ' ' );
-                                       ret.clipTop    = clip[ 0 ];
-                                       ret.clipRight  = clip[ 1 ];
-                                       ret.clipBottom = clip[ 2 ];
-                                       ret.clipLeft   = clip[ 3 ];
-                               };
-                       };
-               };
-               return special;
-       })();
-       
-       function cssToObject( css ){
-               var ret      = {}, i, nv, n, v,
-                       parse    = Util.parse,
-                       isNumber = Type.isNumber,
-                       camelize = Util.camelize;
-               if( Type.isString( css ) === true ){
-                       css = css.split( SEMICORON );
-                       for( i = css.length; i; ){
-                               nv = css[ --i ].split( CORON ); // filter の場合, progid: がくる
-                               n  = nv.shift();
-                               if( isNumber( parse( n ) ) === true ) continue;
-                               v  = nv.join( EMPTY );
-                               while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );
-                               ret[ camelize( n ) ] = parse( v );
-                       };
-               } else {
-                       for( n in css ){
-                               if( Type.isNumber( parse( n ) ) === false ) ret[ n ] = parse( css[ n ] );
-                       };
-               };
-
-               if( SPECIAL.setFilters ){
-                       SPECIAL.setFilters( ret );
-               } else {
-                       ret.opacity = SPECIAL.opacity !== null ? ret[ SPECIAL.opacity ] : 1;
-               };
-               
-               SPECIAL.setBackgroundPositionXY && SPECIAL.setBackgroundPositionXY( ret );
-               SPECIAL.setClipTopRightBottomLeft && SPECIAL.setClipTopRightBottomLeft( ret );
-               
-               return ret;
-       };
-
-       var COLOR = ( function(){
-               var ret = {}, v, name,
-                       list = [
-                               '0', 'BLACK',
-                               'FF0000', 'RED',
-                               '00FF00', 'LIME',
-                               '0000FF', 'BLUE',
-                               'FFFF00', 'YELLOW',
-                               '00FFFF', 'AQUA',
-                               '00FFFF', 'CYAN',
-                               'FF00FF', 'MAGENTA',
-                               'FF00FF', 'FUCHSIA',
-                               'FFFFFF', 'WHITE',
-                               '008000', 'GREEN',
-                               '800080', 'PURPLE',
-                               '800000', 'MAROON',
-                               '000080', 'NAVY',
-                               '808000', 'OLIVE',
-                               '008080', 'TEAL',
-                               '808080', 'GRAY',
-                               'C0C0C0', 'SILVER',
-                               '696969', 'DIMGRAY',
-                               '708090', 'SLATEGRAY',
-                               'A9A9A9', 'DARKGRAY',
-                               'DCDCDC', 'GAINSBORO',
-                               '191970', 'MIDNIGHTBLUE',
-                               '6A5ACD', 'SLATEBLUE',
-                               '0000CD', 'MEDIUMBLUE',
-                               '4169E1', 'ROYALBLUE',
-                               '1E90FF', 'DODGERBLUE',
-                               '87CEEB', 'SKYBLUE',
-                               '4682B4', 'STEELBLUE',
-                               'ADD8E6', 'LIGHTBLUE',
-                               'AFEEEE', 'PALETURQUOISE',
-                               '40E0D0', 'TURQUOISE',
-                               'E0FFFF', 'LIGHTCYAN',
-                               '7FFFD4', 'AQUAMARINE',
-                               '006400', 'DARKGREEN',
-                               '2E8B57', 'SEAGREEN',
-                               '90EE90', 'LIGHTGREEN',
-                               '7FFF00', 'CHARTREUSE',
-                               'ADFF2F', 'GREENYELLOW',
-                               '32CD32', 'LIMEGREEN',
-                               '9ACD32', 'YELLOWGREEN',
-                               '6B8E23', 'OLIVEDRAB',
-                               'BCB76B', 'DARKKHAKI',
-                               'EEE8AA', 'PALEGOLDENROD',
-                               'FFFFE0', 'LIGHTYELLOW',
-                               'FFD700', 'GOLD',
-                               'DAA520', 'GOLDENROD',
-                               'B8860B', 'DARKGOLDENROD',
-                               'BC8F8F', 'ROSYBROWN',
-                               'CD5C5C', 'INDIANRED',
-                               '8B4513', 'SADDLEBROWN',
-                               'A0522D', 'SIENNA',
-                               'CD853F', 'PERU',
-                               'DEB887', 'BURLYWOOD',
-                               'F5F5DC', 'BEIGE',
-                               'F5DEB3', 'WHEAT',
-                               'F4A460', 'SANDYBROWN',
-                               'D2B48C', 'TAN',
-                               'D2691E', 'CHOCOLATE',
-                               'B22222', 'FIREBRICK',
-                               'A52A2A', 'BROWN',
-                               'FA8072', 'SALMON',
-                               'FFA500', 'ORANGE',
-                               'FF7F50', 'CORAL',
-                               'FF6347', 'TOMATO',
-                               'FF69B4', 'HOTPINK',
-                               'FFC0CB', 'PINK',
-                               'FF1493', 'DEEPPINK',
-                               'DB7093', 'PALEVIOLETRED',
-                               'EE82EE', 'VIOLET',
-                               'DDA0DD', 'PLUM',
-                               'DA70D6', 'ORCHILD',
-                               '9400D3', 'DARKVIOLET',
-                               '8A2BE2', 'BLUEVIOLET',
-                               '9370DB', 'MEDIUMPURPLE',
-                               'D8BFD8', 'THISTLE',
-                               'E6E6FA', 'LAVENDER',
-                               'FFE4E1', 'MISTYROSE',
-                               'FFFFF0', 'IVORY',
-                               'FFFACD', 'LEMONCHIFFON'
-                       ];
-               for( i = list.length; i; ){
-                       v    = list[ --i ];
-                       name = list[ --i ];
-                       ret[ name ] = parseInt( v, 16 );
-               };
-               return ret;
-       })();
-       
-       var PARAMS = ( function(){
-               var ret = {};
-               register( ret.percent = {},
-                       'marginBottom,marginLeft,marginRight,marginTop,paddingBottom,paddingLeft,paddingRight,paddingTop,fontSize,textIndent'
-               );
-               register( ret.offset = {},
-                       'height,width,bottom,left,right,top'
-               );              
-               register( ret.size = {},
-                       'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth,letterSpacing'
-               );
-               register( ret.color = {},
-                       'backgroundColor,borderBottomColor,borderLeftColor,borderRightColor,borderTopColor,color'
-               );
-               register( ret.region = {},
-                       'margin,padding,borderWidth,borderColor'
-               );              
-               register( ret.special = {},
-                       'clip,backgroundPosition,opacity,lineHeight,zIndex'
-               );
-               register( ret.unit = {}, 'px,cm,mm,in,pt,pc,em,%' );
-               
-               register( ret.margin = {}, 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom' );
-               register( ret.padding = {}, 'paddingBottom,paddingLeft,paddingRight,paddingTop' );
-               register( ret.borderWidth = {}, 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth' );
-               register( ret.borderColor = {}, 'borderBottomColor,borderLeftColor,borderRightColor,borderTopColor' );
-               
-               function register( obj, params ){
-                       params = params.split( ',' );
-                       for( var i=params.length; i; ) obj[ params[ --i ] ] = true;
-               };
-               return ret;
-       })();
-       
-       /*
-        * 
-        */
-       var Property = Class.create(
-               'Property',
-               Class.POOL_OBJECT,
-               {
-                       Constructor : function( name, value, unit, pxPerEm ){
-                               this.name    = name;
-                               this.value   = value;
-                               this.unit    = unit;
-                               this.pxPerEm = pxPerEm; // XXpx = 1em;
-                       },
-                       name    : '',
-                       value   : 0,
-                       pxPerEm : 12, // 1em === ??px
-                       unit    : '',
-                       equal : function( prop ){
-                               if( this.unit === prop.unit ){
-                                       return this.value === prop.value;
-                               };
-                               return Math.abs( this.toPx() - prop.toPx() ) < 1;
-                       },
-                       convert: function( prop ){
-                               var u = prop.unit, v;
-                               if( this.unit === u ) return;
-                               this.value = v = this.toPx();
-                               this.unit  = u;
-                               if( u !== px ){
-                                       this.value = u === 'em' ? v / this.pxPerEm : Util.pxTo( v, u );
-                               };
-                       },
-                       setValue: function( v ){
-                               this.value = v;
-                       },
-                       getValue: function(){
-                               return this.value;
-                       },
-                       getOffset: function( prop ){
-                               return prop.value - this.value;
-                       },
-                       getUnit: function(){
-                               return this.unit;
-                       },
-                       getValueText: function(){
-                               return this.value === 0 ? '0' : this.value + this.unit;
-                       },
-                       toPx: function(){
-                               var v = this.value, u = this.unit;
-                               if( u === px )   return v;
-                               if( u === 'em' ) return v * this.pxPerEm;
-                               if( u === '' && this.name === 'lineHeight' ) return v * this.pxPerEm;
-                               return Util.toPx( v, u );
-                       },
-                       isValid: function( t ){
-                               t = t || this;
-                               var n = t.name,
-                                       v = t.value,
-                                       u = t.unit,
-                                       z = u !== '' ? true : v === 0;
-                               if( PARAMS.percent[ n ] === true ) return z;
-                               if( PARAMS.offset[ n ] === true  ) return z;
-                               if( PARAMS.size[ n ] === true  )   return z && u !== '%';
-                               if( PARAMS.special[ n ] === true  ){
-                                       if( n === 'lineHeight' ) return true;
-                                       if( n === 'opacity' )    return 0 <= v && v <= 1 && u === '';
-                                       if( n === 'zIndex'  )    return u === '';
-                               };
-                               return false;
-                       }
-               }
-       );
-       
-       /**
-        * backgroundPosition, clip
-        */
-       var PropertyGroup = Class.create(
-               'PropertyGroup',
-               Class.POOL_OBJECT,
-               {
-                       Constructor : function( name ){
-                               this.name  = name;
-                               this.props = [];
-                               for( var i = 1, l = arguments.length; i<l; ++i ){
-                                       this.props.push( arguments[ i ] );
-                               };
-                       },
-                       name  : '',
-                       equal : function( prop ){
-                               var ps = this.props, i = ps.length;
-                               for( ; i; ){
-                                       --i;
-                                       if( ps[ i ].equal( prop[ i ] ) === false ) return false;
-                               };
-                               return true;
-                       },
-                       convert : function( prop ){
-                               var ps = this.props, i = ps.length;
-                               for( ; i; ){
-                                       --i;
-                                       ps[ i ].convert( prop[ i ] );
-                               };
-                       },
-                       setValue : function( ary ){
-                               var ps = this.props, i = 0, l = ps.length;
-                               for( ; i<l; ++i ){
-                                       ps[ i ].setValue( ary[ i ] );
-                               };
-                       },
-                       getValue : function(){
-                               var ret = [], ps = this.props, i = 0, l = ps.length;
-                               for( ; i<l; ++i ){
-                                       ret.push( ps[ i ].getValue() );
-                               };
-                               return ret;
-                       },
-                       getOffset : function( prop ){
-                               var ret = [],
-                                       ps  = this.props,
-                                       _ps = prop.props,
-                                       i   = 0,
-                                       l = ps.length;
-                               for( ; i<l; ++i ){
-                                       ret.push( ps[ i ].getOffset( _ps[ i ] ) );
-                               };
-                               return ret;
-                       },
-                       getUnit : function(){
-                               var ret = [], ps = this.props, i = 0, l = ps.length;
-                               for( ; i<l; ++i ){
-                                       ret.push( ps[ i ].getUnit() );
-                               };
-                               return ret;
-                       },
-                       getValueText : function(){
-                               var ret = [], ps = this.props, i = 0, l = ps.length;
-                               for( ; i<l; ++i ){
-                                       ret.push( ps[ i ].getValueText() );
-                               };                      
-                               if( this.name === 'clip' ){
-                                       return 'rect(' + ret.join( CLIP_SEPARATOR ) + ')';
-                               };
-                               return ret.join( ' ' );
-                       },
-                       onKill : function(){
-                               var ps = this.props, i = ps.length;
-                               for( ; i; ){
-                                       ps[ --i ].kill();
-                               };
-                       },
-                       isValid : function( t ){
-                               t = t || this;
-                               var ps = t.props, i = ps.length;
-                               for( ; i; ){
-                                       if( ps[ --i ].isValid() === false ) return false;
-                               };
-                               return true;
-                       }
-               }
-       );
-       
-       /**
-        * margin, padding, borderWidth, borderColor
-        */
-       var FrexibleProperty = PropertyGroup.inherits(
-               'FrexibleProperty',
-               Class.POOL_OBJECT, {
-                       Constructor : function( name ){
-                               this.name  = name;
-                               this.props = [];
-                               for( var i = 1, l = arguments.length; i<l; ++i ){
-                                       this.props.push( arguments[ i ] );
-                               };
-                               // top, bottom, left, right, topbottom, leftright, all                          
-                       }
-               }
-       );
-
-       var ColorProperty = Class.create(
-               'ColorProperty',
-               Class.POOL_OBJECT, {
-                       Constructor : function( name, r, g, b, pct ){
-                               this.name = name;
-                               this.r    = r;
-                               this.g    = g;
-                               this.b    = b;
-                               this.pct  = pct;
-                       },
-                       name  : '',
-                       equal : function( prop ){
-                               if( this.pct === prop.pct ){
-                                       return this.r === prop.r && this.g === prop.g && this.b === prop.b;
-                               };
-                               var rgb  = this._toPct(),
-                                       _rgb = prop._toPct(),
-                                       i    = rgb.length;
-                               for( ; i; ){
-                                       --i;
-                                       if( Math.abs( rgb[ i ] - _rgb[ i ] ) > 1 ) return false;
-                               };
-                               return true;
-                       },
-                       convert : function( prop ){
-                               var u = prop.pct, x;
-                               if( this.pct === u ) return;
-                               x = u === true ? 100 / 255 : 2.55;
-                               this.r  *= x;
-                               this.g  *= x;
-                               this.b  *= x;
-                               this.pct = u;
-                       },
-                       setValue : function( rgb ){
-                               this.r = rgb[ 0 ];
-                               this.g = rgb[ 1 ];
-                               this.b = rgb[ 2 ];
-                       },
-                       getValue : function(){
-                               return [ this.r, this.g, this.b ];
-                       },
-                       getOffset : function( prop ){
-                               return [ prop.r - this.r, prop.g - this.g, prop.b - this.b ];
-                       },
-                       getUnit : function(){
-                               return this.pct === true ? '%' : '';
-                       },
-                       getValueText : function(){
-                               if( this.pct === true ){
-                                       return [ 'rgb(', this.r, '%,', this.g, '%,', this.b, '%)' ].join( '' );
-                               };
-                               var round = Math.round;
-                               //return [ 'rgb(', round( this.r ), ',', round( this.g ), ',', round( this.b ), ')' ].join( '' );
-                               
-                               var rgb   = '00000' + ( ( round( this.r ) << 16 ) + ( round( this.g ) << 8 ) + round( this.b ) ).toString( 16 );
-                               return '#' + rgb.substr( rgb.length - 6 );
-                       },
-                       _toPct : function(){
-                               if( this.pct === true ) return [ this.r, this.g, this.b ];
-                               return [ this.r / 2.55, this.g / 2.55, this.b / 2.55 ];
-                       },
-                       isValid : function( t ){
-                               var isFinite = window.isFinite;
-                               if( !isFinite( this.r ) || !isFinite( this.g ) || !isFinite( this.b ) ) return false;
-                               if( 0 > this.r || 0 > this.g || 0 > this.b ) return false;
-                               if( this.pct === true ) return this.r <= 100 && this.g <= 100 && this.b <= 100;
-                               return this.r <= 255 && this.g <= 255 && this.b <= 255;
-                       }
-               }
-       );
-       
-       var isString       = Type.isString,
-               isNumber       = Type.isNumber;
-       var REG_UINIT      = /.*\d(\w{1,2})?/,
-               $1             = '$1',
-               px             = 'px',
-               REG_XXXXXX     = /^#[\da-fA-F]{6}?/,
-               REG_XXX        = /^#[\da-fA-F]{3}?/;
-       
-       var WrappedStyle = Class.create(
-               'WrappedStyle',
-               Class.POOL_OBJECT,
-               {
-                       Constructor : function( style ){
-                               this.style   = style;
-                               var fontsize = this.get( 'fontSize' );
-                               this.pxPerEm = fontsize.toPx();
-                               fonstsize.kill();
-                       },
-                       get: function( p ){
-                               if( PARAMS.special[ p ] === true || PARAMS.region[ p ] === true ){
-                                       if( p === 'clip' )        return this.getClip();
-                                       if( p === 'margin' )      return this.getMarginPaddingBorder( p, '' );
-                                       if( p === 'padding' )     return this.getMarginPaddingBorder( p, '' );
-                                       if( p === 'borderWidth' ) return this.getMarginPaddingBorder( 'border', 'Width' );
-                                       if( p === 'borderColor' ) return this.getBorderColor( 'borderColor' );
-                                       if( p === 'backgroundPosition' ) return this.getBackgroundPosition( p );
-                                       // opacity, zindex, lineHeight
-                                       return new Property( p, this.getValue( x ), this.getUnit( x ), this.pxPerEm );
-                               };
-                               var x = this.style[ p ], e, v, u;
-                               if( PARAMS.offset[ p ] === true ){
-                                       return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );
-                                       /*
-                                       e = this.elm;
-                                       if( p === 'width'  ) v = e.offsetWidth;
-                                       if( p === 'height' ) v = e.offsetHeight;
-                                       if( p === 'top'    ) v = e.offsetTop;
-                                       if( p === 'bottom' ) v = e.offsetBottom;
-                                       if( p === 'left'   ) v = e.offsetLeft;
-                                       if( p === 'right'  ) v = e.offsetRight;
-                                       u = this.getUnit( x, p );
-                                       // alert( p + this.pxTo( v, u ) + u )
-                                       return new Property( p, this.pxTo( v, u ), u, this.pxPerEm ); */
-                               };
-                               if( p === 'fontSize' ){ // xx-small 等
-                                       v = Util.absoluteFontSizeToPx( x );
-                                       if( v !== 0 ){
-                                               return new Property( p, v, px, this.pxPerEm );
-                                       };
-                               };                      
-                               if( PARAMS.percent[ p ] === true ){
-                                       // alert( p + ' , ' + x + ' , ' + this.getUnit( x, p ) )
-                                       return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );
-                               };
-                               if( PARAMS.size[ p ] === true ){
-                                       return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );
-                               };
-                               if( PARAMS.color[ p ] === true ){
-                                       return this.getColor( x, p );
-                               };
-                       },
-                       pxTo: function( px, unit ){
-                               if( unit === 'em' ) return px / this.pxPerEm;
-                               return Util.pxTo( px, unit );
-                       },
-                       getValue: function( x ){
-                               return isString( x ) === true ? parseInt( x ) :
-                                      isNumber( x ) === true ? x : 0;
-                       },
-                       getUnit: function( x, p ){
-                               var u;
-                               if( isString( x ) === true ){
-                                       u = x.replace( REG_UINIT, $1 );
-                                       if( p === 'lineHeight' ) return u;
-                                       if( PARAMS.unit[ u ] !== true ) return px;
-                                       return u;
-                               };
-                               return px;
-                       },
-                       getColor: function( x, p ){
-                               var rgb = COLOR[ x.toUpperCase() ],
-                                       pct = false,
-                                       r   = 0,
-                                       g   = 0,
-                                       b   = 0;
-                               if( isNumber( rgb ) === true ){
-                                       r = ( rgb & 0xff0000 ) >> 16;
-                                       g = ( rgb & 0xff00 ) >> 8;
-                                       b = ( rgb & 0xff );
-                               } else
-                               if( x.match( REG_XXXXXX ) ){
-                                       r = parseInt( x.charAt( 1 ) + x.charAt( 2 ), 16 );
-                                       g = parseInt( x.charAt( 3 ) + x.charAt( 4 ), 16 );
-                                       b = parseInt( x.charAt( 5 ) + x.charAt( 6 ), 16 );
-                                       //alert( x + ' g: ' + g )
-                               } else                  
-                               if( x.match( REG_XXX ) ){
-                                       r = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );
-                                       g = parseInt( x.charAt( 2 ) + x.charAt( 2 ), 16 );
-                                       b = parseInt( x.charAt( 3 ) + x.charAt( 3 ), 16 );
-                               } else
-                               if( x.indexOf( 'rgb(' ) === 0 ){
-                                       rgb = x.substr( 4 ).split( ',' );
-                                       r = parseFloat( rgb[ 0 ] );
-                                       g = parseFloat( rgb[ 1 ] );
-                                       b = parseFloat( rgb[ 2 ] );
-                                       if( x.indexOf( '%' ) !== -1 ) pct = true;
-                               } else {
-                                       r = 255;
-                                       g = 255;
-                                       b = 255;
-                               };
-                               return new ColorProperty( p, r, g, b, pct );
-                       },
-                       getClip: function( name ){
-                               // rect(...)    クリップします。<top>, <bottom> は上端からの、 <right>, <left> は左端からのオフセットで指定します。Internet Explorer 4~7 では、カンマの代わりにスペースで区切る必要があります。
-                               // position:absolute または position:fixed を適用した要素に対してのみ有効です。
-                               var top    = this.get( name + 'Top' ),
-                                       right  = this.get( name + 'Right' ),
-                                       bottom = this.get( name + 'Bottom' ),
-                                       left   = this.get( name + 'Left' ),
-                                       ret    = new PropertyGroup( name, top, right, bottom, left );
-                               if( ret.isValid() === true ) return ret;
-                               ret.kill();
-                               all    = this.style[ name ].split( '(' )[ 1 ].split( ')' )[ 0 ].split( CLIP_SEPARATOR );
-                               return new PropertyGroup( name,
-                                       new Property( name + 'Top',    all[ 0 ], px, this.pxPerEm ),
-                                       new Property( name + 'Right',  all[ 1 ], px, this.pxPerEm ),
-                                       new Property( name + 'Bottom', all[ 2 ], px, this.pxPerEm ),
-                                       new Property( name + 'Left',   all[ 3 ], px, this.pxPerEm )
-                               );
-                       },
-                       getBackgroundPosition: function( name ){
-                               var x   = this.get( name + 'X' ),
-                                       y   = this.get( name + 'Y' ),
-                                       ret = new PropertyGroup( name, x, y ),
-                                       xy;
-                               if( ret.isValid() === true ) return ret;
-                               ret.kill();
-                               xy  = this.style[ name ].split( ' ' );
-                               return new PropertyGroup( name,
-                                       new Property( name + 'X', this.getValue( xy[ 0 ] ), this.getUnit( xy[ 0 ] ), this.pxPerEm ),
-                                       new Property( name + 'Y', this.getValue( xy[ 1 ] ), this.getUnit( xy[ 1 ] ), this.pxPerEm )
-                               );
-                       },
-                       getMarginPaddingBorder: function( name, width ){
-                               var props  = [ name + 'Top'    + width,
-                                                  name + 'Right'  + width,
-                                                  name + 'Bottom' + width,
-                                                  name + 'Left'   + width ],
-                                       top    = this.get( props[ 0 ] ),
-                                       right  = this.get( props[ 1 ] ),
-                                       bottom = this.get( props[ 2 ] ),
-                                       left   = this.get( props[ 3 ] ),
-                                       ret    = new FrexibleProperty( name, top, right, bottom, left ),
-                                       klass, pxPerEm, getValue, getUnit,
-                                       all, _0, _1, _2, _3, v, u;
-                               if( ret.isValid() === true ) return ret;
-                               ret.kill();
-                               klass    = Property;
-                               pxPerEm  = this.pxPerEm;
-                               getValue = this.getValue;
-                               getUnit  = this.getUnit;
-                               all = this.style[ name + width ].split( ' ' );
-                               _0 = all[ 0 ];
-                               _1 = all[ 1 ];
-                               _2 = all[ 2 ];
-                               _3 = all[ 3 ];
-                               v  = getValue( _0 );
-                               u  = getUnit( _0 );
-                               switch( all.length ){
-                                       case 1 :
-                                               top    = new klass( props[ 0 ], v, u, pxPerEm );
-                                               right  = new klass( props[ 1 ], v, u, pxPerEm );
-                                               bottom = new klass( props[ 2 ], v, u, pxPerEm );
-                                               left   = new klass( props[ 3 ], v, u, pxPerEm );
-                                               break;
-                                       case 2 :
-                                               top    = new klass( props[ 0 ], v, u, pxPerEm );
-                                               bottom = new klass( props[ 2 ], v, u, pxPerEm );
-                                               v  = getValue( _1 );
-                                               u  = getUnit( _1 );
-                                               right  = new klass( props[ 1 ], v, u, pxPerEm );
-                                               left   = new klass( props[ 3 ], v, u, pxPerEm );
-                                               break;
-                                       case 3 :
-                                               top    = new klass( props[ 0 ], v, u, pxPerEm );
-                                               v  = getValue( _1 );
-                                               u  = getUnit( _1 );
-                                               right  = new klass( props[ 1 ], v, u, pxPerEm );
-                                               left   = new klass( props[ 3 ], v, u, pxPerEm );
-                                               bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );
-                                               break;
-                                       case 4 :
-                                               top    = new klass( props[ 0 ], v, u, pxPerEm );
-                                               right  = new klass( props[ 1 ], getValue( _1 ), getUnit( _1 ), pxPerEm );
-                                               bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );
-                                               left   = new klass( props[ 3 ], getValue( _3 ), getUnit( _3 ), pxPerEm );
-                                               break;
-                               };
-                               return new FrexibleProperty( name, top, right, bottom, left );
-                       },
-                       getBorderColor: function( name ){
-                               var props    = 'borderTopColor,borderRightColor,borderBottomColor,borderLeftColor'.split( ',' ),
-                                       top      = this.get( props[ 0 ] ),
-                                       right    = this.get( props[ 1 ] ),
-                                       bottom   = this.get( props[ 2 ] ),
-                                       left     = this.get( props[ 3 ] ),
-                                       ret      = new FrexibleProperty( name, top, right, bottom, left ),
-                                       all, _0, _1, getColor;
-                               if( ret.isValid() === true ) return ret;
-                               ret.kill();
-                               getColor = this.getColor;
-                               all = this.style[ name ].split( ' ' );
-                               _0  = all[ 0 ];
-                               _1  = all[ 1 ];
-                               switch( all.length ){
-                                       case 1 :
-                                               top    = getColor( _0, props[ 0 ] );
-                                               right  = getColor( _0, props[ 1 ] );
-                                               bottom = getColor( _0, props[ 2 ] );
-                                               left   = getColor( _0, props[ 3 ] );
-                                               break;
-                                       case 2 :
-                                               top    = getColor( _0, props[ 0 ] );
-                                               right  = getColor( _1, props[ 1 ] );
-                                               bottom = getColor( _0, props[ 2 ] );
-                                               left   = getColor( _1, props[ 3 ] );
-                                               break;
-                                       case 3 :
-                                               top    = getColor( _0,       props[ 0 ] );
-                                               right  = getColor( _1,       props[ 1 ] );
-                                               bottom = getColor( all[ 2 ], props[ 2 ] );
-                                               left   = getColor( _1,       props[ 3 ] );
-                                               break;
-                                       case 4 :
-                                               top    = getColor( _0,       props[ 0 ] );
-                                               right  = getColor( _1,       props[ 1 ] );
-                                               bottom = getColor( all[ 2 ], props[ 2 ] );
-                                               left   = getColor( all[ 3 ], props[ 3 ] );
-                                               break;
-                               };
-                               return new FrexibleProperty( name, top, right, bottom, left );
-                       }
-               }
-       );
-       function camelizeHash( obj ){
-               var p, _p, came = Util.camelize;
-               for( p in obj ){
-                       _p = came( p );
-                       if( _p === p ) continue;
-                       obj[ _p ] = obj[ _p ] || obj[ p ];
-                       delete obj[ p ];
-               };
-       };      
-       return {
-               create: function( css ){
-                       return new WrappedStyle( camelizeHash( p ) );
-               }
-       };
-})();
-
-var XDocument = ( function( window, document ){
-       
-       var getIndex  = Util.getIndex;
-       var ROOT_LIST = [];
-       var DEF_ATTRS = {};
-       var AUTO      = undefined;
-       var FULL      = DEF_ATTRS; // something unigue value;
-       var FLOOR     = Math.floor;
-       
-       DEF_ATTRS.LENGTH            =  1;
-       DEF_ATTRS.PERCENT           =  2;
-       DEF_ATTRS.COLOR             =  4;
-       DEF_ATTRS.U_DECIMAL         =  8;
-       DEF_ATTRS.NUMERICAL         = 16;
-       DEF_ATTRS.BOOLEAN           = 32;
-       DEF_ATTRS.QUARTET           = 64;
-       DEF_ATTRS.URL               = 128;
-       DEF_ATTRS.FONT_NAME         = 256;
-       DEF_ATTRS.LIST              = 512;
-       DEF_ATTRS.AUTO              = 1024;
-       DEF_ATTRS.COMBI             = 2048;
-       DEF_ATTRS.BORDER_STYLE      = 'none,hidden,dotted,dashed,solid,double,groove,ridge,inset,outset'.split(',');
-       DEF_ATTRS.POSITION_X        = 'left,center,right'.split(',');
-       DEF_ATTRS.POSITION_Y        = 'top,center,bottom'.split(',');
-       DEF_ATTRS.ALIGN             = 'left,center,right,justify'.split(',');
-       DEF_ATTRS.TEXT_DECORATION   = 'none,underline,overline,line-through,blink'.split(',');
-       DEF_ATTRS.TEXT_TRANSFORM    = 'none,capitalize,lowercase,uppercase'.split(',');
-       DEF_ATTRS.WIDTH_HEIGHT      = 'auto'.split(',');
-       DEF_ATTRS.BOX_SIZING        = 'content-box,padding-box,border-box,margin-box'.split(',');
-       DEF_ATTRS.PAINT             = 1; // 再描画のみ必要
-       DEF_ATTRS.REFLOW            = 2; // レイアウトの再計算が必要
-       
-       DEF_ATTRS.borderWidth    = [ DEF_ATTRS.REFLOW,  0, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH      ]; // em [ top, right, bottom, left ]
-       DEF_ATTRS.borderColor    = [ DEF_ATTRS.PAINT,   4, DEF_ATTRS.QUARTET | DEF_ATTRS.DEF_COLOR   ]; // color [ top, right, bottom, left ]
-       DEF_ATTRS.borderStyle    = [ DEF_ATTRS.REFLOW,  8, DEF_ATTRS.QUARTET | DEF_ATTRS.LIST, DEF_ATTRS.BORDER_STYLE ]; // string [ top, right, bottom, left ]
-       DEF_ATTRS.cornerRadius   = [ DEF_ATTRS.PAINT,  12, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ]; // em, px [ top, right, bottom, left ]
-       DEF_ATTRS.bgColor        = [ DEF_ATTRS.PAINT,  16, DEF_ATTRS.COLOR     ]; // color
-       DEF_ATTRS.bgAlpha        = [ DEF_ATTRS.PAINT,  17, DEF_ATTRS.U_DECIMAL ]; // 0 - 1
-       DEF_ATTRS.bgImgUrl       = [ DEF_ATTRS.PAINT,  18, DEF_ATTRS.URL       ]; // url
-       DEF_ATTRS.bgImgRepeatX   = [ DEF_ATTRS.PAINT,  19, DEF_ATTRS.BOOLEAN   ]; // true / false
-       DEF_ATTRS.bgImgRepeatY   = [ DEF_ATTRS.PAINT,  20, DEF_ATTRS.BOOLEAN   ]; // true / false
-       DEF_ATTRS.bgImgPositionX = [ DEF_ATTRS.PAINT,  21, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.LIST, DEF_ATTRS.POSITION_X ]; // em %, px, string
-       DEF_ATTRS.bgImgPositionY = [ DEF_ATTRS.PAINT,  22, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.LIST, DEF_ATTRS.POSITION_Y ]; // em %, px, string
-       DEF_ATTRS.shadowColor    = [ DEF_ATTRS.PAINT,  23, DEF_ATTRS.COLOR     ]; // color
-       DEF_ATTRS.shadowAlpha    = [ DEF_ATTRS.PAINT,  24, DEF_ATTRS.U_DECIMAL ]; // 0 - 1
-       DEF_ATTRS.shadowOffsetX  = [ DEF_ATTRS.PAINT,  25, DEF_ATTRS.LENGTH    ]; // em
-       DEF_ATTRS.shadowOffsetY  = [ DEF_ATTRS.PAINT,  26, DEF_ATTRS.LENGTH    ]; // em
-       DEF_ATTRS.shadowBlur     = [ DEF_ATTRS.PAINT,  27, DEF_ATTRS.LENGTH    ]; // em
-       DEF_ATTRS.shadowSpread   = [ DEF_ATTRS.PAINT,  28, DEF_ATTRS.LENGTH    ]; // em
-       DEF_ATTRS.shadowInset    = [ DEF_ATTRS.PAINT,  29, DEF_ATTRS.BOOLEAN   ]; // true / false
-       
-       DEF_ATTRS.color          = [ DEF_ATTRS.PAINT,  30, DEF_ATTRS.COLOR     ]; // color
-       DEF_ATTRS.fontFamily     = [ DEF_ATTRS.REFLOW, 31, DEF_ATTRS.FONT_NAME ]; // string
-       DEF_ATTRS.fontSize       = [ DEF_ATTRS.REFLOW, 32, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ]; // em, %
-       DEF_ATTRS.bold           = [ DEF_ATTRS.REFLOW, 33, DEF_ATTRS.BOOLEAN   ]; // true / false
-       DEF_ATTRS.italic         = [ DEF_ATTRS.REFLOW, 34, DEF_ATTRS.BOOLEAN   ]; // true / false
-       DEF_ATTRS.lineHeight     = [ DEF_ATTRS.REFLOW, 35, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.NUMERICAL ]; // em, %, 
-       DEF_ATTRS.letterSpacing  = [ DEF_ATTRS.REFLOW, 36, DEF_ATTRS.LENGTH    ]; // em
-       DEF_ATTRS.wordSpacing    = [ DEF_ATTRS.REFLOW, 37, DEF_ATTRS.LENGTH    ];
-       DEF_ATTRS.align          = [ DEF_ATTRS.REFLOW, 38, DEF_ATTRS.LIST, DEF_ATTRS.ALIGN           ];
-       DEF_ATTRS.decoration     = [ DEF_ATTRS.PAINT,  39, DEF_ATTRS.LIST, DEF_ATTRS.TEXT_DECORATION ];
-       DEF_ATTRS.transform      = [ DEF_ATTRS.REFLOW, 40, DEF_ATTRS.LIST, DEF_ATTRS.TEXT_TRANSFORM  ];
-       DEF_ATTRS.shadowColor    = [ DEF_ATTRS.PAINT,  41, DEF_ATTRS.COLOR     ];
-       DEF_ATTRS.shadowOffsetX  = [ DEF_ATTRS.PAINT,  42, DEF_ATTRS.LENGTH    ];
-       DEF_ATTRS.shadowOffsetY  = [ DEF_ATTRS.PAINT,  43, DEF_ATTRS.LENGTH    ];
-       DEF_ATTRS.shadowBlur     = [ DEF_ATTRS.PAINT,  44, DEF_ATTRS.LENGTH    ];
-       
-       DEF_ATTRS.width              = [ DEF_ATTRS.REFLOW, 45, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT, DEF_ATTRS.WIDTH_HEIGHT ];
-       DEF_ATTRS.minWidth           = [ DEF_ATTRS.REFLOW, 46, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.maxWidth           = [ DEF_ATTRS.REFLOW, 47, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.height             = [ DEF_ATTRS.REFLOW, 48, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT, DEF_ATTRS.WIDTH_HEIGHT ];
-       DEF_ATTRS.minHeight          = [ DEF_ATTRS.REFLOW, 49, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.maxHeight          = [ DEF_ATTRS.REFLOW, 50, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.padding            = [ DEF_ATTRS.REFLOW, 51, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.margin             = [ DEF_ATTRS.REFLOW, 55, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.sizing             = [ DEF_ATTRS.REFLOW, 59, DEF_ATTRS.LIST, DEF_ATTRS.BOX_SIZING ];
-       DEF_ATTRS.pageBox            = [ DEF_ATTRS.REFLOW, 60, DEF_ATTRS.BOOLEAN   ]; // true / false
-       DEF_ATTRS.x = DEF_ATTRS.left = [ DEF_ATTRS.REFLOW, 61, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.y = DEF_ATTRS.top  = [ DEF_ATTRS.REFLOW, 62, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.bottom             = [ DEF_ATTRS.REFLOW, 63, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       DEF_ATTRS.right              = [ DEF_ATTRS.REFLOW, 64, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];
-       
-       /**
-        * 再計算と再描画
-        * redraw 再描画はパラメータ変更後に setTimeout で
-        * reflow 再計算は値が get された場合 invalidate が サイズだったら
-        * または再描画前に invalidate がサイズなフラグが足っていたら 
-        */
-       
-       var BasicLayoutManager = Class.create(
-               'BasicLayoutManager',
-               Class.POOL_OBJECT,
-               {
-                       Constructor : function(){
-                               
-                       },
-                       redraw : function( nodeData ){
-                               var root = nodeData.__root;
-                               root.dirty === DEF_ATTRS.REFLOW && this.reflow( root );
-                               
-                               // draw
-                       },
-                       reflow : function( nodeData ){
-                               var parent   = nodeData.__parent,
-                                       allowW   = parent.contentWidth,
-                                       allowH   = parent.contentHeight,
-                                       autoW    = parent.autoWidth,
-                                       autoH    = parent.autoHeight,
-                                       offsetX  = parent.offsetX,
-                                       offsetY  = parent.offsetY,
-                                       children = nodeData.children,                                   
-                                       style    = nodeData.__style,                            
-                                       x, y, w, minW, maxW, h, minH, maxH,
-                                       contentW, contentH, boxW, boxH,
-                                       autoSize, sizing, page,
-                                       paddingT, paddingR, paddingB, paddingL,
-                                       borderT, borderR, borderB, borderL,
-                                       marginT, marginR, marginB, marginL,
-                                       childW   = 0,
-                                       childH   = 0,
-                                       styles, child, calc, i;
-
-                               if( style ){
-                                       styles   = style.data;
-                                       calc     = BasicLayoutManager.calcValue;
-                                       sizing   = styles[ 53 ];
-                                       page     = styles[ 54 ];                                
-                                       x        = calc( styles[ 55 ], allowW );
-                                       y        = calc( styles[ 56 ], page === true ? allowH : allowW );
-                                       w        = styles[ 45 ];
-                                       minW     = styles[ 46 ];
-                                       maxW     = styles[ 47 ];
-                                       contentW = BasicLayoutManager.finalValue( w, minW, maxW, allowW );
-                                       h        = styles[ 48 ];
-                                       minW     = styles[ 49 ];
-                                       maxW     = styles[ 50 ];
-                                       contentH = BasicLayoutManager.finalValue( h, minW, maxW, allowH );
-                                       autoSize = w === AUTO || h === AUTO;
-                                       paddingT = calc( styles[ 51 ], page === true ? allowH : allowW );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
-                                       paddingR = calc( styles[ 52 ], allowW );
-                                       paddingT = calc( styles[ 53 ], page === true ? allowH : allowW );
-                                       paddingL = calc( styles[ 54 ], allowW, autoW );
-                                       borderT  = styles[  0 ];
-                                       borderR  = styles[  1 ];
-                                       borderB  = styles[  2 ];
-                                       borderL  = styles[  3 ];
-                                       marginT  = calc( styles[ 55 ], page === true ? allowH : allowW );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して
-                                       marginR  = calc( styles[ 56 ], allowW );
-                                       marginB  = calc( styles[ 57 ], page === true ? allowH : allowW );
-                                       marginL  = calc( styles[ 58 ], allowW );
-                                       boxW     = contentW;
-                                       boxH     = contentH;
-                                       switch( sizing ){
-                                               case 3 : // margin-box
-                                                        contentW -= ( marginR + marginL );
-                                                        contentH -= ( marginT + marginR );
-                                                        
-                                               case 2 : // border-box
-                                                        contentW -= ( borderR + borderL );
-                                                        contentH -= ( borderT + borderR );
-                                               case 1 : // padding-box
-                                                        contentW -= ( paddingR + paddingL );
-                                                        contentH -= ( paddingT + paddingR );
-                                               // case 0 : // content-box
-                                       };              
-                               } else {
-                                       boxW     = contentW = w        = allowW;
-                                       boxH     = contentH = h        = allowH;
-                                       minW     = minH     = 0;
-                                       maxW     = maxH     = Infinity;
-                                       autoSize = false;
-                               };
-                               
-                               if( nodeData.contentWidth !== contentW || nodeData.contentHeight === contentH ){
-                                       if( autoSize === false ){
-                                               nodeData.updateLayout();
-                                               nodeData.contentWidth  = contentW;
-                                               nodeData.contentHeight = contentH;
-                                               nodeData.boxWidth      = boxW;
-                                               nodeData.boxHeight     = boxH;                                          
-                                       };
-                                       if( node instanceof LayoutBoxPrivate ){
-                                               nodeData.Super.reflow.call( nodeData );
-                                       } else {
-                                               node.reflow();
-                                       };
-                               };
-
-                               if( children ){
-                                       for( i = children.length; i; ){
-                                               child = children[ --i ];
-                                               if( child instanceof LayoutBoxPrivate ){
-                                                       child.layoutManager.reflow( child );
-                                               } else {
-                                                       child.reflow();
-                                               };
-                                               if( autoSize === false ) continue;
-                                               if( childW < child.rectRight  ) childW = child.rectRight;
-                                               if( childH < child.rectBottom ) childH = child.rectBottom;                                              
-                                       };
-                                       if( autoSize === true ){
-                                               if( w === AUTO && childW < contentW ) contentW = childW;
-                                               if( h === AUTO && childH < contentH ) contentH = childH;
-                                               if( contentW < minW ) contentW = minW;
-                                               if( maxW < contentW ){
-                                                       nodeData.scrollWidth = contentW;
-                                                       contentW = maxW;
-                                               };
-                                               if( contentH < minH ) contentH = minH;
-                                               if( maxH < contentH ){
-                                                       nodeData.scrollHeight = contentH;
-                                                       contentH = maxH;
-                                               };
-                                               nodeData.contentWidth  = boxW = contentW;
-                                               nodeData.contentHeight = boxH = contentH;
-                                               switch( sizing ){
-                                                       case 3 : // margin-box
-                                                                boxW += ( marginR + marginL );
-                                                                boxH += ( marginT + marginR );
-                                                       case 2 : // border-box
-                                                                boxW += ( borderR + borderL );
-                                                                boxH += ( borderT + borderR );
-                                                       case 1 : // padding-box
-                                                                boxW += ( paddingR + paddingL );
-                                                                boxH += ( paddingT + paddingR );
-                                                       // case 0 : // content-box
-                                               };
-                                               nodeData.boxWidth  = boxW;
-                                               nodeData.boxHeight = boxH;
-                                       };                                      
-                               };
-                               delete nodeData.dirty;
-                       }
-               }
-       );
-       BasicLayoutManager.finalValue = function( styleValue, styleMin, styleMax, srcValue ){
-               var calc = BasicLayoutManager.calcValue,
-                       v    = calc( styleValue, srcValue ),
-                       min  = calc( styleMin,   srcValue ),
-                       max  = calc( styleMax,   srcValue );
-               if( v < min ) return min;
-               if( max < v ) return max;
-               return v;
-       };
-       BasicLayoutManager.calcValue = function( styleValue, srcValue ){
-               if( styleValue === 0 ) return 0;
-               // 100%
-               if( styleValue === FULL || styleValue === AUTO ) return srcValue;
-               if( 1 <= styleValue  ) return styleValue; // legth
-               if( -1 < styleValue  ) return FLOOR( srcValue * styleValue ); // %
-               return styleValue; // - length
-       };
-       
-       var NodeStylePrivate = Class.create(
-               Class.PRIVATE_DATA | Class.POOL_OBJECT,
-               {
-                       colorCssText  : null,
-                       layoutCssText : null,
-                       Constructor : function(){
-                               this.data  = [];
-                               this.dirty = 0;
-                       },
-                       register : function( node ){
-                               var root  = node.__root,
-                                       roots = this.rootList,
-                                       nodes = this.nodeList;
-                               if( !roots ){
-                                       this.rootList = [ root ];
-                               } else
-                               if( getIndex( roots, root ) === -1 ) roots[ roots.length ] = root;
-                               
-                               if( !nodes ){
-                                       this.nodeList = [ node ];
-                                       return;
-                               };
-                               if( getIndex( nodes, node ) === -1 ) nodes[ nodes.length ] = node;
-                       },
-                       unRegister : function( node ){
-                               var nodes = this.nodeList,
-                                       i     = getIndex( nodes, node ),
-                                       root  = node._root,
-                                       roots = this.rootList,
-                                       j     = getIndex( roots, root );
-                               if( i !== -1 && nodes.splice( i, 1 ) && nodes.length === 0 ) delete this.nodeList;
-                               if( j !== -1 && roots.splice( j, 1 ) && roots.length === 0 ) delete this.rootList;
-                       },
-                       clone : function(){
-                               var styleClass = Class.getClass( this.User ),
-                                       dataClass  = Class.getClass( this );
-                       },
-                       attr : function( prop, v ){
-                               var update    = prop[ 0 ],
-                                       propID    = prop[ 1 ],
-                                       type      = prop[ 2 ],
-                                       list      = prop[ 3 ],
-                                       length    = !!( type & DEF_ATTRS.LENGTH    ),
-                                       percent   = !!( type & DEF_ATTRS.PERCENT   ),
-                                       color     = !!( type & DEF_ATTRS.COLOR     ),
-                                       uDecimal  = !!( type & DEF_ATTRS.U_DECIMAL ),
-                                       numerical = !!( type & DEF_ATTRS.NUMERICAL ),
-                                       flag      = !!( type & DEF_ATTRS.BOOLEAN   ),
-                                       quartet   = !!( type & DEF_ATTRS.QUARTET   ),
-                                       url       = !!( type & DEF_ATTRS.URL       ),
-                                       fontName  = !!( type & DEF_ATTRS.FONT_NAME ),
-                                       //list      = !!( type & DEF_ATTRS.LIST      ),
-                                       combi     = !!( type & DEF_ATTRS.COMBI     ),
-                                       data      = this.data,
-                                       _v        = -1,
-                                       i, l, nodes, root;
-                               /*
-                                * Setter
-                                */
-                               if( v !== undefined ){
-                                       if( Type.isNumber( v ) === true ){
-                                               if( numerical === false ){
-                                                       if( uDecimal === false || v < 0 || 1 < v ) throw new Error( '' );
-                                               };
-                                       } else
-                                       if( Type.isBoolean( v ) === true ){
-                                               if( flag === false ) throw new Error( '' );
-                                       } else
-                                       if( Type.isString( v ) === true ){
-                                               if( url === false && fontName === false ){
-                                                       if( v.indexOf( ' ' ) !== -1 ){
-                                                               v = v.split( ' ' );
-                                                       } else {
-                                                               if( length === false && percent === false && color === false ) throw new Error( '' );
-                                                       };
-                                               };
-                                       };                                      
-                                       if( Type.isArray( v ) === true ){
-                                               if( v.length <= 4 && quartet === true ){
-                                                       type ^= DEF_ATTRS.QUARTET;
-                                               } else
-                                               if( v.length === 2 && combi === true ){
-                                                       type ^= DEF_ATTRS.COMBI;
-                                               } else {
-                                                       throw new Error( '' );
-                                               };
-                                               switch( v.length ){
-                                                       case 1 :
-                                                               this.attr( [ propID  , type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 0 ] );
-                                                               break;
-                                                       case 2 :
-                                                               this.attr( [ propID  , type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 1 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 1 ] );
-                                                               break;
-                                                       case 3 :
-                                                               this.attr( [ propID  , type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 1 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 2 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 1 ] );
-                                                               break;
-                                                       case 4 :
-                                                               this.attr( [ propID  , type, list ], v[ 0 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 1 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 2 ] );
-                                                               this.attr( [ ++propID, type, list ], v[ 3 ] );
-                                                               break;
-                                                       default :
-                                               };
-                                               return this.User;
-                                       };
-                                       if( update === DEF_ATTRS.REFLOW ){
-                                               delete this.layoutCssText;
-                                       } else {
-                                               delete this.colorCssText;
-                                       };
-                                       if( this.dirty < update ){
-                                               this.dirty = update;
-                                               roots = this.rootList;
-                                               for( i = 0, l = roots.length; i < l; ++i ){
-                                                       root = roots[ i ];
-                                                       if( root.dirty < update ) root.dirty = update;
-                                               };
-                                       };
-                                       
-                                       if( list ) _v = Util.getIndex( list, v );
-                                       data[ propID ] = _v !== -1 ? _v : v;
-                                       return this.User;
-                               };
-                               /*
-                                * Getter
-                                */
-                               if( this.dirty === DEF_ATTRS.REFLOW ){
-                                       roots = this.rootList;
-                                       if( roots ){
-                                               for( i = 0, l = roots.length; i < l; ++i ){
-                                                       roots[ i ].reflow();
-                                               };
-                                       };
-                               };
-                               v = data[ propID ];
-                               if( quartet === true ) return [ v, data[ ++propID ], data[ ++propID ], data[ ++propID ] ];
-                               if( combi === true ) return [ v, data[ ++propID ] ];
-                               if( list && Type.isNumber( v ) === true ) return list[ v ];
-                               return v;
-                       },
-                       cssText : function(){
-                               if( this.colorCssText  === null ) this.colorCssText  = this.createColorCssText();
-                               if( this.layoutCssText === null ) this.layoutCssText = this.createLayoutCssText();
-                               return this.colorCssText + ';' + this.layoutCssText;
-                       },
-                       createColorCssText : function(){
-                               
-                       },
-                       createLayoutCssText : function(){
-                               
-                       }
-               }
-       );
-       
-       var NodeStyle = Class.create(
-               'NodeStyle',
-               Class.POOL_OBJECT,
-               NodeStylePrivate,
-               {
-                       Constructor : function(){
-                               NodeStyle.newPrivateData( this );
-                       },
-                       borderWidth : function( v ){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderWidth, v );
-                       },
-                       borderColor : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderColor, v );
-                       },
-                       borderStyle : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderStyle, v );
-                       },
-                       cornerRadius : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.cornerRadius, v );
-                       },
-                       bgColor : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgColor, v );
-                       },
-                       bgAlpha : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgAlpha, v );
-                       },
-                       bgImgUrl : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgUrl, v );
-                       },
-                       bgImgRepeatX : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgRepeatX, v );
-                       },
-                       bgImgRepeatY : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgRepeatY, v );
-                       },
-                       bgImgPositionX : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgPositionX, v );
-                       },
-                       bgImgPositionY : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgPositionY, v );
-                       },
-                       shadowColor : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowColor, v );
-                       },
-                       shadowAlpha : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowAlpha, v );
-                       },
-                       shadowOffsetX : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetX, v );
-                       },
-                       shadowOffsetY : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetY, v );
-                       },
-                       shadowBlur : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowBlur, v );
-                       },
-                       shadowSpread : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowSpread, v );
-                       },
-                       shadowInset : function(){
-                               return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowInset, v );
-                       },
-                       color : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.color, v );
-                       },
-                       fontFamily : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.fontFamily, v );
-                       },
-                       fontSize : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.fontSize, v );
-                       },
-                       bold : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.bold, v );
-                       },
-                       italic : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.italic, v );
-                       },
-                       lineHeight : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.lineHeight, v );
-                       },
-                       letterSpacing : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.letterSpacing, v );
-                       },
-                       wordSpacing : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.wordSpacing, v );
-                       },
-                       align : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.align, v );
-                       },
-                       decoration : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.decoration, v );
-                       },
-                       transform : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.transform, v );
-                       },
-                       shadowColor : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowColor, v );
-                       },
-                       shadowOffsetX : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetX, v );
-                       },
-                       shadowOffsetY : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetY, v );
-                       },
-                       shadowBlur : function( v ){
-                               return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowBlur, v );
-                       },
-                       cssText : function(){
-                               return TypoStyle.getPrivateData( this ).cssText();
-                       }
-               }
-       );
-
-       var NodePrivate = Class.create(
-               'NodePrivate',
-               Class.PRIVATE_DATA | Class.POOL_OBJECT,
-               {
-                       elmWrap       : null,
-                       textNode      : null,
-                       autoWidth     : false,
-                       autoHeight    : false,
-                       autoSize      : false,
-                       boxX          : 0,
-                       boxY          : 0,
-                       boxWidth      : 0,
-                       boxHeight     : 0,
-                       boxRight      : 0,
-                       boxBottom     : 0,
-                       contentX      : 0,
-                       contentY      : 0,                      
-                       contentWidth  : 0,
-                       contentHeight : 0,
-                       Constructor   : function( __root, __parent ){
-                               this.__root   = __root;
-                               if( __parent ) this.__parent = __parent;
-                       },
-                       style : function( v ){
-                               if( v instanceof NodeStyle ){
-                                       this.__style && this.__style.unRegister( this );
-                                       this._style = v;
-                                       this.__style = StylePrivate.getPrivateData( v );                                        
-                                       this.__style.register( this );
-                                       return this.User;
-                               } else
-                               if( v === null ){
-                                       this.__style && this.__style.unRegister( this );
-                                       delete this._style;
-                                       delete this.__style;
-                                       return this.User;
-                               };
-                               return this._style;
-                       },
-                       /**
-                        * 1. 要素の追加・削除
-                        * 2. auto 指定時は要素の高さ取得.
-                        * 3. 親の許す子の最大サイズと自信のスタイル指定から、自身の位置とサイズを計算
-                        * 4. 描画更新リストに追加
-                        */
-                       reflow : function(){
-                               var content = this._textContent,
-                                       style   = this.__style,
-                                       parent  = this.__parent,
-                                       size, data, w, h;
-                               
-                               if( content || ( style && style.hasPaint === true ) ){
-                                       if( !this.elmWrap ){
-                                               this.elmWrap = DOM.createDiv();
-                                               parent.addDisplayElement( this );
-                                       };
-                                       if( style && style.hasStyle === true ){
-                                               this.elmWrap.style.cssText = style.cssText();
-                                       };                              
-                                       if( content ){
-                                               if( !this.textNode ){
-                                                       this.textNode = DOM.cerateText();
-                                                       this.elmWrap.appendChild( this.textNode );
-                                               };
-                                               if( style && ( style.autoWidth === true || style.autoHeight === true ) ){
-                                                       size = DOM.getTextSize( this.elmWrap, content );
-                                                       this.contentWidth  = size[ 0 ];
-                                                       this.conetntHeight = size[ 1 ];
-                                               };
-                                               this.textNode.data = content;
-                                       } else
-                                       if( this.textNode ){
-                                               DOM.correct( this.textNode );
-                                               delete this.textNode;
-                                               delete this.contentWidth;
-                                               delete this.conetntHeight;
-                                       };
-                                       this.boxWidth  = this.elmWrap.offsetWidth;
-                                       this.boxHeight = this.elmWrap.offsetHeight;                                     
-                               } else
-                               if( this.elmWrap ){
-                                       parent.removeDisplayElement( this );
-                               };
-                       },
-                       preSizing : function(){
-                               var parent   = nodeData.__parent,
-                                       allowW   = parent.contentWidth,
-                                       allowH   = parent.contentHeight,                
-                                       style    = nodeData.__style,                            
-                                       x, y, w, minW, maxW, h, minH, maxH,
-                                       contentW, contentH,
-                                       page,
-                                       paddingT, paddingR, paddingB, paddingL,
-                                       borderT, borderR, borderB, borderL,
-                                       marginT, marginR, marginB, marginL,
-                                       styles, calc;
-
-                               if( style ){
-                                       styles   = style.data;
-                                       calc     = BasicLayoutManager.calcValue;
-                                       page     = styles[ 54 ] === true ? allowH : allowW ;
-                                       w        = styles[ 45 ];
-                                       minW     = styles[ 46 ];
-                                       maxW     = styles[ 47 ];
-                                       contentW = BasicLayoutManager.finalValue( w, minW, maxW, allowW );
-                                       h        = styles[ 48 ];
-                                       minW     = styles[ 49 ];
-                                       maxW     = styles[ 50 ];
-                                       contentH = BasicLayoutManager.finalValue( h, minW, maxW, allowH );
-                                       paddingT = calc( styles[ 51 ], page );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
-                                       paddingR = calc( styles[ 52 ], allowW );
-                                       paddingB = calc( styles[ 53 ], page );
-                                       paddingL = calc( styles[ 54 ], allowW );
-                                       borderT  = styles[  0 ];
-                                       borderR  = styles[  1 ];
-                                       borderB  = styles[  2 ];
-                                       borderL  = styles[  3 ];
-                                       marginT  = calc( styles[ 55 ], page );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して
-                                       marginR  = calc( styles[ 56 ], allowW );
-                                       marginB  = calc( styles[ 57 ], page );
-                                       marginL  = calc( styles[ 58 ], allowW );
-                                       this.boxWidth      = contentW;
-                                       this.boxHeight     = contentH;
-                                       switch( styles[ 53 ] ){
-                                               case 3 : // margin-box
-                                                        contentW -= ( marginR + marginL );
-                                                        contentH -= ( marginT + marginR );
-                                                        
-                                               case 2 : // border-box
-                                                        contentW -= ( borderR + borderL );
-                                                        contentH -= ( borderT + borderR );
-                                               case 1 : // padding-box
-                                                        contentW -= ( paddingR + paddingL );
-                                                        contentH -= ( paddingT + paddingR );
-                                               // case 0 : // content-box
-                                       };
-                                       this.contentX      = marginL + borderL + paddingL;
-                                       this.contentY      = marginT + borderT + paddingT;                                      
-                                       this.contentWidth  = contentW;
-                                       this.contentHeight = contentH;
-                                       this.autoHeight    = h === AUTO;
-                                       this.autoWidth     = w === AUTO;
-                                       this.autoSize      = this.autoWidth || this.autoHeight;
-                               } else {
-                                       this.boxWidth  = this.contentWidth  = allowW;
-                                       this.boxHeight = this.contentHeight = allowH;
-                                       delete this.contentX;
-                                       delete this.contentY;                                           
-                                       delete this.autoSize;
-                                       delete this.autoWidth;
-                                       delete this.autoHeight;
-                               };
-                       },
-                       addDisplayElement : function( nodeData ){
-                               
-                       },
-                       removeDisplayElement : function( nodeData ){
-                               DOM.correct( nodeData.elmWrap );
-                               delete nodeData.elmWrap;
-                               delete nodeData.textNode;
-                               delete nodeData.contentWidth;
-                               delete nodeData.conetntHeight;
-                               delete nodeData.currentWidth;
-                               delete nodeData.currentHeight;                  
-                       }
-               }
-       );
-       var Node = Class.create(
-               'Node',
-               Class.POOL_OBJECT,
-               NodePrivate,
-               {
-                       Constructor : function( root, parent ){
-                               Node.newPrivateData( this,  LayoutBox.getPrivateData( root ), parent ? LayoutBox.getPrivateData( parent ) : undefined, this );
-                       },
-                       style : function( v ){
-                               return Node.getPrivateData( this ).paint( v );
-                       },
-                       remove : function(){
-                               Node.getPrivateData( this ).remove();
-                       },
-                       nodeIndex : function( v ){
-                               return Node.getPrivateData( this ).nodeIndex( v );
-                       },
-                       displayIndex : function(){
-                               
-                       },
-                       disabled : function( v ){
-                               return Node.getPrivateData( this ).disabled( v );
-                       },
-                       cursor : function( v ){
-                               return Node.getPrivateData( this ).cursor( v );
-                       },
-                       getAbsolutePositionX : function(){
-                               return Node.getPrivateData( this ).getAbsolutePositionX();
-                       },
-                       getAbsolutePositionY : function(){
-                               return Node.getPrivateData( this ).getAbsolutePositionY();
-                       },
-                       addEventListener : function( type, handler, opt_thisObject ){
-                               Node.getPrivateData( this ).addEventListener( type, handler, opt_thisObject );
-                       },
-                       removeEventListener : function( type, handler ){
-                               Node.getPrivateData( this ).removeEventListener( type, handler );
-                       },
-                       scrollTo : function( x, y ){
-                               Node.getPrivateData( this ).scrollTo( x, y );
-                       },
-                       scrollX : function( v ){
-                               return Node.getPrivateData( this ).scrollX( v );
-                       },
-                       scrollY : function( v ){
-                               return Node.getPrivateData( this ).scrollY( v );
-                       }
-               }
-       );
-       
-       var LayoutBoxPrivate = NodePrivate.inherits(
-               'LayoutBoxPrivate',
-               Class.POOL_OBJECT | Class.SUPER_ACCESS,
-               {
-                       Constructor : function( layoutManager, root, parent ){
-                               this.layoutManager = layoutManager;
-                               this._root         = _root;
-                               if( _parent ) this._parent = _parent;
-                       },
-                       reflow : function(){
-                               this.layoutManager.reflow( this );
-                       }
-               }
-       );
-       
-       var LayoutBox = Node.inherits(
-               'LayoutBox',
-               Class.POOL_OBJECT,
-               LayoutBoxPrivate,
-               {
-                       Constructor : function( layoutManager, root, parent ){
-                               LayoutBox.newPrivateData( this, layoutManager, LayoutBox.getPrivateData( root ), parent ? LayoutBox.getPrivateData( parent ) : undefined );
-                       },
-                       layoutManager : function( v ){
-                               
-                       },
-                       createLayoutBox : function(){
-                               
-                       },
-                       createContentBox : function(){
-                               
-                       }
-               }
-       );
-       
-})( window, document );
-       
-})( window, document );
+/*\r
+ * pettanR system.js\r
+ *   version 0.5.48\r
+ *\r
+ * gadgetOS\r
+ *   author:\r
+ *     itozyun\r
+ *   licence:\r
+ *     3-clause BSD\r
+ */\r
+\r
+( function( window, document, undefined ){\r
+       \r
+       var body           = document.getElementsByTagName( 'body' )[ 0 ]; //( document.compatMode || '' ) !== 'CSS1Compat' ? document.body : document.documentElement;// \r
+       var SERVICE_LIST   = [];\r
+       var SUPER_USER_KEY = { getUID: function(){ return 0; }};\r
+       var API_USER_LIST  = [ SUPER_USER_KEY ];\r
+       var numApiUser     = 1;\r
+       \r
+       function EMPTY_FUNCTION(){};\r
+       \r
+       function isApiUser( _user ){\r
+               return _user === SUPER_USER_KEY ||\r
+                       File.isDriver( _user ) === true ||\r
+                       Application.isApplicationInstance( _user ) === true;\r
+       };\r
+       \r
+       var Const = {\r
+               FILE: {\r
+                       TYPE: {\r
+                               UNKNOWN:        0,\r
+                               FOLDER:         1,\r
+                               IMAGE:          2,\r
+                               TEXT:           3,\r
+                               HTML:           4,\r
+                               CSV:            5,\r
+                               JSON:           6,\r
+                               XML:            7\r
+                       },\r
+                       STATE: {\r
+                               UNKNOWN:        0,\r
+                               OK:                     1,\r
+                               LOADING:        2,\r
+                               ERROR:          3,\r
+                               BROKEN:         4\r
+                       },\r
+                       UPDATE_POLICY: {\r
+                               _____:          parseInt( '00000', 2 ),\r
+                               ____C:          parseInt( '00001', 2 ), // hasCreateMenu\r
+                               ___W_:          parseInt( '00010', 2 ), // isWritable\r
+                               ___WC:          parseInt( '00011', 2 ), // isWritable\r
+                               __R__:          parseInt( '00100', 2 ), // isRenamable\r
+                               __R_C:          parseInt( '00101', 2 ), // hasCreateMenu\r
+                               __RW_:          parseInt( '00110', 2 ), // isWritable\r
+                               __RWC:          parseInt( '00111', 2 ), // isWritable\r
+                               _S___:          parseInt( '01000', 2 ), // childrenIsSortable\r
+                               _S__C:          parseInt( '01001', 2 ),\r
+                               _S_W_:          parseInt( '01010', 2 ),\r
+                               _S_WC:          parseInt( '01011', 2 ),\r
+                               _SR__:          parseInt( '01100', 2 ),\r
+                               _SR_C:          parseInt( '01101', 2 ),\r
+                               _SRW_:          parseInt( '01110', 2 ),\r
+                               _SRWC:          parseInt( '01111', 2 ),\r
+                               D____:          parseInt( '10000', 2 ),\r
+                               D___C:          parseInt( '10001', 2 ), // hasCreateMenu\r
+                               D__W_:          parseInt( '10010', 2 ), // isWritable\r
+                               D__WC:          parseInt( '10011', 2 ), // isWritable\r
+                               D_R__:          parseInt( '10100', 2 ), // isRenamable\r
+                               D_R_C:          parseInt( '10101', 2 ), // hasCreateMenu\r
+                               D_RW_:          parseInt( '10110', 2 ), // isWritable\r
+                               D_RWC:          parseInt( '10111', 2 ), // isWritable\r
+                               DS___:          parseInt( '11000', 2 ), // childrenIsSortable\r
+                               DS__C:          parseInt( '11001', 2 ),\r
+                               DS_W_:          parseInt( '11010', 2 ),\r
+                               DS_WC:          parseInt( '11011', 2 ),\r
+                               DSR__:          parseInt( '11100', 2 ),\r
+                               DSR_C:          parseInt( '11101', 2 ),\r
+                               DSRW_:          parseInt( '11110', 2 ),\r
+                               DSRWC:          parseInt( '11111', 2 ),\r
+                               CREATE:         1,\r
+                               WRAITE:         2,\r
+                               RENAME:         4,\r
+                               SORT:           8,\r
+                               DELETE:         16\r
+                       },\r
+                       EVENT: {\r
+                               UPDATE_ATTRIVUTE:       'onFileUpdate',\r
+                               GET_SEQENTIAL_FILES:'gotSeqentilFiles'\r
+                       },\r
+                       DATA_PROPERTY_RESERVED: [\r
+                               'children', 'driver', 'state', 'type'\r
+                       ]                       \r
+               },\r
+               TREE: {\r
+                       EVENT: {\r
+                               UPDATE:                         'onTreeUpdate'\r
+                       }\r
+               },\r
+               KEY: {\r
+                       EVENT: {\r
+                               KEY_DOWN:                       'keydown',\r
+                               KEY_UP:                         'keyup',\r
+                               KEY_CHANGE:                     'keychange',\r
+                               CURSOL:                         'cursol'\r
+                       }\r
+               },\r
+               APP: {\r
+                       TYPE: {\r
+                               GENERAL : 0,\r
+                               OVERLAY : 1,\r
+                               PAGE    : 2\r
+                       }\r
+               }\r
+       };\r
+\r
+/**\r
+ * Class を定義し システムの管理下に置く.\r
+ * 全てのクラスと pool が有効の場合インスタンスへの参照が保持される.\r
+ *  1. Class.create( def, opt_final, opt_pool, opt_abstract ) でクラスを登録.\r
+ *  2. コンストラクタ となるメソッドは、Constructor : function( arg ){ ... }, に書く.\r
+ *  3. 通常通り new で インスタンス生成\r
+ *  4. kill() でオブジェクトをクリーンして削除、pool が有効の場合は pool される.\r
+ *  5. pool が有効の場合、new で pool されたインスタンスが返される.\r
+ *  6. \r
+ * \r
+ */\r
+var Class = ( function(){\r
+       var CLASS_LIST         = [],\r
+               DEF_LIST           = [],\r
+               PRIVATE_CLASS_LIST = [],\r
+               PRIVATE_DEF_LIST   = [],\r
+               CONSTRUCTOR        = 'Constructor',\r
+               GET_INDEX          = Util.getIndex,\r
+               killPrivateFlag    = false,\r
+               dataUser           = null,\r
+               traits             = null,\r
+               f                  = true,\r
+               copyArray          = Util.copyArray;\r
+       \r
+       function getClass( instance ){\r
+               var cList    = CLASS_LIST,\r
+                       i        = cList.length,\r
+                       klass;\r
+               for( ; i; ){\r
+                       klass = cList[ --i ];\r
+                       if( instance instanceof klass ) return klass;\r
+               };\r
+               cList = PRIVATE_CLASS_LIST;\r
+               i     = cList.length;\r
+               for( ; i; ){\r
+                       klass = cList[ --i ];\r
+                       if( instance instanceof klass ) return klass;\r
+               };\r
+               \r
+               if( GET_INDEX( cList, instance ) !== -1 ) return instance;\r
+               if( GET_INDEX( CLASS_LIST, instance ) !== -1 ) return instance;\r
+       };\r
+       \r
+       function getClassDef( KlassOrInstance ){\r
+               var getIndex = GET_INDEX,\r
+                       i        = getIndex( CLASS_LIST, KlassOrInstance );\r
+               if( i === -1 ) i = getIndex( CLASS_LIST, getClass( KlassOrInstance ) );\r
+               if( i !== -1 ) return DEF_LIST[ i ];\r
+               \r
+               i = getIndex( PRIVATE_CLASS_LIST, KlassOrInstance );\r
+               if( i === -1 ) i = getIndex( PRIVATE_CLASS_LIST, getClass( KlassOrInstance ) );\r
+               if( i !== -1 ) return PRIVATE_DEF_LIST[ i ];\r
+               \r
+               if( GET_INDEX( DEF_LIST, KlassOrInstance ) !== -1 ) return KlassOrInstance;\r
+               if( GET_INDEX( PRIVATE_DEF_LIST, KlassOrInstance ) !== -1 ) return KlassOrInstance;\r
+       };\r
+       \r
+       /* over のプロパティを target にコピーする.ただし target の プロパティが優先, force で解除 */\r
+       function override( target, over, force ){\r
+               for( var p in over ){\r
+                       if( force === true || typeof target[ p ] === 'undefined' ){\r
+                               target[ p ] = over[ p ];\r
+                       };\r
+               };\r
+               return target;\r
+       };\r
+       \r
+       /* サブクラスを作るメソッド  \r
+        * var subClass = superClass.inherits( ... ) \r
+        * http://d.hatena.ne.jp/m-hiyama/20051018/1129605002\r
+        */\r
+       function inherits( /* displayName, classSetting, opt_PrivateClass, props */ ){\r
+               var args        = copyArray( arguments ),\r
+                       params      = [],\r
+                       Super       = this,\r
+                       superDef    = getClassDef( Super ),\r
+                       displayName = args[ 0 ],\r
+                       classSetting,\r
+                       opt_super,\r
+                       klass;\r
+               if( superDef.Final === true ) throw new Error( 'Class is final!' );\r
+               \r
+               if( Type.isString( displayName ) === true ){\r
+                       args.shift();\r
+               } else {\r
+                       displayName = 'SubClass of ' + superDef.displayName;\r
+               };\r
+               params.push( displayName );\r
+               \r
+               classSetting = args[ 0 ];\r
+               if( Type.isNumber( classSetting ) === true ){\r
+                       if( superDef.isPrivate === true ) classSetting = classSetting | Class.PRIVATE_DATA;\r
+                       opt_super = !!( classSetting & Class.SUPER_ACCESS );\r
+                       params.push( classSetting );\r
+                       args.shift();\r
+               };\r
+               if( getClass( args[ 0 ] ) ){\r
+                       params.push( args.shift() );\r
+               } else\r
+               if( superDef.privateClass ){\r
+                       params.push( superDef.privateClass );\r
+               };\r
+               params.push( args[ 0 ] ); /* props */\r
+               f      = false;\r
+               traits = new Super();\r
+               f      = true;\r
+               klass  = Class.create.apply( Class, params );\r
+               traits = null;\r
+               if( opt_super === true ) getClassDef( klass ).Super = Super.prototype;\r
+               return klass;\r
+       };\r
+       \r
+       /* Class.create で作られたクラスのインスタンスが共通で備えるメソッド */\r
+       var CommonProps = {\r
+               kill : function(){\r
+                       var instance = this,\r
+                               klass    = getClass( instance ),\r
+                               def      = getClassDef( klass ),\r
+                               data, p, i;\r
+                       if( def.isPrivate === true && killPrivateFlag === false ){\r
+                               throw new Error( 'PrivateInstance.kill() work in PrivateUser.kill().' );\r
+                       };\r
+                       Type.isFunction( instance.onKill ) === true && instance.onKill();\r
+                       for( p in instance ){\r
+                               if( instance.hasOwnProperty && !instance.hasOwnProperty( p ) ) continue;\r
+                               delete instance[ p ];\r
+                       };\r
+                       if( def.pool ){\r
+                               def.live && def.live.splice( GET_INDEX( def.live, instance ), 1 );\r
+                               def.pool.push( instance );\r
+                       };\r
+                       if( def.privateClass ){\r
+                               i = GET_INDEX( def.userList, instance );\r
+                               if( i !== -1 ){\r
+                                       data            = klass.getPrivateData( instance );\r
+                                       killPrivateFlag = true;\r
+                                       data.kill();\r
+                                       killPrivateFlag = false;\r
+                                       def.dataList.splice( i, 1 );\r
+                                       def.userList.splice( i, 1 );\r
+                               };\r
+                       };\r
+                       // myCallback の削除\r
+                       // myCallback を受け取った API への通知\r
+               },\r
+               getMyCallback : function( callback ){\r
+                       var def       = getClassDef( this ),\r
+                               iList     = def.callbackInstanceList,\r
+                               rList     = def.callbackRegisterList,\r
+                               i, cList, myCallback;\r
+                       if( !iList ){\r
+                               iList = def.callbackInstanceList = [];\r
+                               rList = def.callbackRegisterList = [];\r
+                       };\r
+                       i = GET_INDEX( iList, this );\r
+                       if( i === -1 ){\r
+                               cList = [];\r
+                               iList.push( this );\r
+                               rList.push( cList );\r
+                       } else {\r
+                               cList = rList[ i ];\r
+                               for( i = cList.length; i; ){\r
+                                       if( cList[ --i ].callback === callback ) return cList[ i ];\r
+                               };\r
+                       };\r
+                       myCallback = new Callback( this, callback );\r
+                       cList.push( myCallback );\r
+                       return myCallback;\r
+               },\r
+               releaseMyCallback : function( callback ){\r
+                       var def   = getClassDef( this ),\r
+                               iList = def.callbackInstanceList,\r
+                               rList = def.callbackRegisterList,\r
+                               i, _i, cList;\r
+                       if( !iList ) return;\r
+                       i = GET_INDEX( iList, this );\r
+                       if( i === -1 ) return;\r
+                       cList = rList[ i ];\r
+                       _i    = GET_INDEX( cList, callback );\r
+                       if( _i === -1 ) return;\r
+                       cList.splice( _i, 1 );\r
+                       callback.kill();\r
+                       if( cList.length !== 0 ) return;\r
+                       iList.splice( i, 1 );\r
+                       rList.splice( i, 1 );\r
+                       if( iList.length !== 0 ) return;\r
+                       delete def.callbackInstanceList;\r
+                       delete def.callbackRegisterList;\r
+               },\r
+               listenTo : function( eventDispatcher, eventType, callback ){\r
+                       //if( eventDispatcher instanceof EventDsipatcher ){\r
+                               eventDispatcher.listen( eventType, this, callback );\r
+                       //}\r
+               },\r
+               unListenTo : function( eventDispatcher, eventType, callback ){\r
+                       //if( eventDispatcher instanceof EventDsipatcher ){\r
+                               eventDispatcher.unListen( eventType, this, callback );\r
+                       //}\r
+               }\r
+       };\r
+\r
+       /* privateDataclass をもつクラスに追加されるメソッド */\r
+       function newPrivateData( /* instance, args */ ){\r
+               var args         = copyArray( arguments ),\r
+                       user         = args.shift(),\r
+                       def          = getClassDef( user ),\r
+                       privateClass = def.privateClass,\r
+                       privateDef   = getClassDef( privateClass ),\r
+                       i            = -1,\r
+                       data;\r
+               if( def.userList ){\r
+                       i = GET_INDEX( def.userList, user );\r
+               } else {\r
+                       def.userList = [];\r
+                       def.dataList = [];\r
+               };\r
+               if( i !== -1 ){\r
+                       throw new Error( 'PrivateData already exist!' );\r
+               };\r
+               dataUser  = user;\r
+               data      = new privateClass( args );\r
+               data.User = user;\r
+               dataUser  = null;       \r
+               return data;\r
+       };\r
+       function getPrivateData( instance ){\r
+               var def = getClassDef( instance ),\r
+                       i   = GET_INDEX( def.userList, instance );\r
+               if( i !== -1 ) return def.dataList[ i ];\r
+       };\r
+       \r
+       /*\r
+        * new の実体.コンストラクタの機能は instance.Constructor に書く.\r
+        * これにより pool された オブジェクト(破棄されたインスタンス) を再利用できる\r
+        */\r
+       /* Constructor Real for GeneralClass */\r
+       function C( args ){\r
+               var klass = this,\r
+                       def   = getClassDef( klass ),   \r
+                       instance,\r
+                       userDef;\r
+               if( def.Abstract === true ){\r
+                       throw new Error( 'AbstractClass!' );\r
+               };\r
+               if( def.isPrivate === true && dataUser === null ){\r
+                       throw new Error( 'use myClass.newPrivateData( instance, ...args )!' );\r
+               };\r
+               f = false;\r
+               instance = def.pool && def.pool.length > 0 ? def.pool.shift() : instance = new klass();\r
+               f = true;\r
+               if( def.Super && !instance.Super ) instance.Super = def.Super;\r
+               if( def.isPrivate === true ){\r
+                       userDef = getClassDef( dataUser );\r
+                       userDef.dataList.push( instance );\r
+                       userDef.userList.push( dataUser );\r
+               } else {\r
+                       def.live && def.live.push( instance );\r
+                       args = copyArray( arguments );\r
+               };\r
+               def[ CONSTRUCTOR ] && def[ CONSTRUCTOR ].apply( instance, args );\r
+               return instance;\r
+       };\r
+       \r
+       return {\r
+               POOL_OBJECT  : 1,\r
+               ABSTRACT     : 2,\r
+               FINAL        : 4,\r
+               SUPER_ACCESS : 8,\r
+               PRIVATE_DATA : 16,\r
+               create : function( /* displayName, classSetting, opt_PrivateClass, props */ ){\r
+                       var args        = copyArray( arguments ),\r
+                               displayName = args[ 0 ],\r
+                               classSetting,\r
+                               opt_pool, opt_abstract, opt_final, opt_private,\r
+                               privateDef,\r
+                               props,\r
+                               klass,\r
+                               classDef = {};\r
+                       if( Type.isString( displayName ) === true ){\r
+                               classDef.displayName = displayName;\r
+                               args.shift();\r
+                       };\r
+                       classSetting = args[ 0 ];\r
+                       if( Type.isNumber( classSetting ) === true ){\r
+                               opt_pool     = !!( classSetting & Class.POOL_OBJECT  );\r
+                               opt_abstract = !!( classSetting & Class.ABSTRACT     );\r
+                               opt_final    = !!( classSetting & Class.FINAL        );\r
+                               opt_private  = !!( classSetting & Class.PRIVATE_DATA );\r
+                               if( opt_final === true && opt_abstract === true ){\r
+                                       throw new Error( 'final & Abstract!' );\r
+                               };                              \r
+                               args.shift();\r
+                       };\r
+                       \r
+                       if( GET_INDEX( PRIVATE_CLASS_LIST, args[ 0 ] ) !== -1 ){\r
+                               privateDef = getClassDef( args[ 0 ] );\r
+                               if( privateDef.isPrivate !== true ){\r
+                                       throw new Error( 'PrivateClass not found! please, Class.create( Class.PRIVATE, {...} ).' );\r
+                               } else\r
+                               if( privateDef.Abstract === true ){\r
+                                       throw new Error( 'PrivateClass is Abstract!' );\r
+                               };\r
+                               classDef.privateClass = args.shift();\r
+                       };\r
+                       props = args[ 0 ];\r
+                       if( props === null || Type.isObject( props ) === false ){\r
+                               throw new Error( 'No Class Def!' );\r
+                       };\r
+                       \r
+                       if( Type.isFunction( props[ CONSTRUCTOR ] ) === true ){\r
+                               classDef[ CONSTRUCTOR ] = props[ CONSTRUCTOR ];\r
+                       };\r
+                       \r
+                       klass = function(){ var a = arguments; if( f ) return C.apply( a.callee, a )};\r
+                       klass.prototype = override( override( traits || {}, props, true ), CommonProps, false );\r
+                       \r
+                       if( opt_abstract === true ){\r
+                               classDef.Abstract = true;\r
+                       } else\r
+                       if( opt_pool === true ){\r
+                               classDef.pool = [];\r
+                               if( opt_private === false )classDef.live = [];\r
+                       };                      \r
+                       if( opt_final === true ){\r
+                               classDef.Final = true;\r
+                       } else {\r
+                               klass.inherits = inherits;\r
+                       };                      \r
+                       if( opt_private === true ){\r
+                               if( classDef.privateClass ){\r
+                                       throw new Error( 'Private Data Class has no PrivateClass!' );\r
+                               };\r
+                               classDef.isPrivate = true;\r
+                               PRIVATE_CLASS_LIST.push( klass );\r
+                               PRIVATE_DEF_LIST.push( classDef );\r
+                       } else {\r
+                               if( classDef.privateClass ){\r
+                                       klass.newPrivateData = newPrivateData;\r
+                                       klass.getPrivateData = getPrivateData;  \r
+                               };\r
+                               CLASS_LIST.push( klass );\r
+                               DEF_LIST.push( classDef );                              \r
+                       };\r
+                       return klass;\r
+               },\r
+               onShutdown : function(){\r
+                       \r
+               },\r
+               getClass : function( instance ){\r
+                       return getClass( instance );\r
+               },\r
+               getClassDef : function(){\r
+                       \r
+               }\r
+       };\r
+})();\r
+\r
+/**\r
+ * Callback 時に thisObject や args を指定したい場合に使用. \r
+ */\r
+var Callback = Class.create(\r
+       Class.POOL_OBJECT | Class.FINAL, {\r
+       Constructor : function( thisObject, callback, opt_args ){\r
+               if( Type.isFunction( callback ) === false ){\r
+                       throw new Error( 'Not function!' );\r
+               };\r
+               this.callback = callback;\r
+               if( thisObject ) this.thisObject = thisObject;\r
+               if( Type.isArray( opt_args ) === true ){\r
+                       this.args = opt_args;\r
+               } else\r
+               if( opt_args !== undefined ){\r
+                       this.arg = opt_args;\r
+               };\r
+       },\r
+       fire : function( /* args */ ){\r
+               var thisObject = this.thisObject || window,\r
+                       args       = Util.copyArray( arguments );\r
+               if( 0 < args.length ){\r
+                       if( this.args !== undefined ){\r
+                               args.push.apply( args, this.args );\r
+                       } else\r
+                       if( this.arg !== undefined ){\r
+                               args.push( this.arg );\r
+                       };\r
+                       this.callback.apply( thisObject, args );\r
+               } else {\r
+                       if( this.args !== undefined ){\r
+                               this.callback.apply( thisObject, this.args );\r
+                       } else\r
+                       if( this.arg !== undefined ){\r
+                               this.callback.call( thisObject, this.arg );\r
+                       } else {\r
+                               this.callback.call( thisObject );\r
+                       };\r
+               };\r
+       },\r
+       registerUser : function( user ){\r
+               if( !this.userList ){\r
+                       this.userList = [ user ];\r
+               } else {\r
+                       Util.getIndex( this.userList, user ) === -1 && this.userList.push( user );\r
+               };\r
+       },\r
+       onKill : function(){\r
+               var instance = this.thisObject;\r
+               this.userList && Class.getClass( instance ) && instance.releaseMyCalllback( this );\r
+       }\r
+});\r
+\r
+\r
+/* --------------------------------------------------------------\r
+ * System Timer\r
+ * \r
+ */\r
+\r
+var SystemTimer = ( function(){\r
+       var setTimeout    = window.setTimeout;\r
+       var clearTimeout  = window.clearTimeout;\r
+       var INTERVAL_TIME = 16;\r
+       var TICKET_LIST   = [];\r
+       var timerId       = undefined;\r
+       var next          = 0;\r
+       \r
+       function loop(){\r
+               var i    = 0,\r
+                       list = TICKET_LIST;\r
+           for( i = 0; i < list.length; ){\r
+               if( list[ i ].fire( next ) !== false ) ++i;\r
+           };\r
+           timerId = undefined;\r
+           update();\r
+       };\r
+       function update(){\r
+               var list = TICKET_LIST,\r
+                       l    = list.length,\r
+                       n    = 99999999,\r
+                       c;\r
+               if( l === 0 ){\r
+                       timerId !== undefined && clearTimeout( timerId );\r
+                       timerId = undefined;\r
+                       return;\r
+               };\r
+           for( ; l; ){\r
+               c = list[ --l ].count;\r
+               if( n > c ) n = c;\r
+           };\r
+           if( next > n || timerId === undefined ){\r
+               timerId !== undefined && clearTimeout( timerId );\r
+               timerId = setTimeout( loop, INTERVAL_TIME * n );\r
+               next = n;\r
+           };\r
+       };\r
+       \r
+       var TimerTicket = Class.create(\r
+               Class.POOL_OBJECT, {\r
+                       Constructor : function( apiuser, callback, time, once, opt_thisObject ){\r
+                               this.apiuser  = apiuser;\r
+                               this.callback = callback;\r
+                               this.time     = time;\r
+                               this.count    = time;\r
+                               if( once ) this.once = once;\r
+                               this.thisObj  = opt_thisObject || apiuser;\r
+                       },\r
+                       fire : function( c ){\r
+                               this.count -= c;\r
+                               if( 0 < this.count ) return;\r
+                               this.callback.call( this.thisObj );\r
+                               if( this.once === true ){\r
+                                       this.destroy();\r
+                                       TICKET_LIST.splice( Util.getIndex( TICKET_LIST, this ), 1 );\r
+                                       return false;\r
+                               } else {\r
+                                       this.count = this.time;\r
+                               };\r
+                       },\r
+                       destroy : function( apiuser, callback ){\r
+                               if( apiuser  && apiuser  !== this.apiuser )  return false;\r
+                               if( callback && callback !== this.callback ) return false;\r
+                               \r
+                               this.kill();\r
+                               return true;\r
+                       }\r
+               }\r
+       );\r
+       \r
+       return {\r
+               add: function( _apiuser, _handler, _time, _once, opt_thisObject ){\r
+                       if( Type.isNumber( _time ) === false || _time < INTERVAL_TIME ) _time = INTERVAL_TIME;\r
+                       \r
+                   var _ticket = new TimerTicket( _apiuser, _handler, Math.ceil( _time / INTERVAL_TIME ), _once, opt_thisObject );\r
+                   TICKET_LIST.push( _ticket );\r
+                   \r
+                   update();\r
+               },\r
+               remove: function( _apiuser, _handler ){\r
+                       var _ticket,\r
+                               i = 0;\r
+                       while( _ticket = TICKET_LIST[ i ] ){\r
+                               if( _ticket.destroy( _apiuser, _handler ) === true ){\r
+                                       TICKET_LIST.splice( i, 1 );\r
+                               } else {\r
+                                       ++i;\r
+                               };\r
+                       };\r
+                   update();\r
+               }\r
+       };\r
+})();\r
+\r
+/* --------------------------------------------------------------\r
+ * Async Callback\r
+ * \r
+ */\r
+var AsyncCall = ( function(){\r
+       var CALLBACK_LIST = [];\r
+       \r
+       var CallbackTicket = Class.create(\r
+               Class.POOL_OBJECT, {\r
+               Constructor : function( apiuser, callback, args, thisObject ){\r
+                       this.apiuser  = apiuser;\r
+                       this.callback = callback;\r
+                       this.args     = args;\r
+                       this.thisObj  = thisObject || apiuser;\r
+               },\r
+               fire : function(){\r
+                       var f = this.callback,\r
+                               a = this.args,\r
+                               t = this.thisObj;\r
+                       this.destroy();\r
+                       if( Type.isArray( a ) === true ){\r
+                               f.apply( t, a );\r
+                       } else {\r
+                               f.call( t, a );\r
+                       };\r
+               },\r
+               destroy : function( apiuser, callback ){\r
+                       if( apiuser  && apiuser  !== this.apiuser ) return false;\r
+                       if( callback && callback !== this.callback ) return false;\r
+                       \r
+                       this.kill();\r
+                       return true;\r
+               }\r
+       });\r
+\r
+       function dispatch(){\r
+               var _ticket = CALLBACK_LIST.shift();\r
+               if( _ticket ){\r
+                       _ticket.fire();\r
+                       CALLBACK_LIST.length !== 0 && SystemTimer.add( SUPER_USER_KEY, dispatch, 1, true );\r
+               };\r
+       };\r
+\r
+       return {\r
+               add: function( _apiuser, _callback, _argments, _thisObject ){\r
+                       CALLBACK_LIST.length === 0 && SystemTimer.add( SUPER_USER_KEY, dispatch, 1, true );\r
+                       CALLBACK_LIST.push( new CallbackTicket( _apiuser, _callback, _argments, _thisObject ) );\r
+               },\r
+               remove: function( _apiuser, _callback ){\r
+                       var _ticket,\r
+                               i = 0;\r
+                       while( _ticket = CALLBACK_LIST[ i ] ){\r
+                               if( _ticket.destroy( _apiuser, _callback ) === true ){\r
+                                       CALLBACK_LIST.splice( i, 1 );\r
+                               } else {\r
+                                       ++i;\r
+                               };\r
+                       };\r
+               }\r
+       };\r
+})();\r
+\r
+/* -----------------------------------------------------------\r
+ * 画像一覧は\r
+ *     お気に入り画像一覧 > tag:ペン次郎 > ペン次郎:笑う\r
+ *  最近アップロードされた画像 > images\r
+ *  最近使われた画像 > images\r
+ *  キャラクター画像庫 > アニマル系 > tag:ペン次郎 > ペン次郎:笑う\r
+ *  風景画像庫 >\r
+ *  効果画像庫 >\r
+ *  アイテム画像庫 >\r
+ *  \r
+ * 画像一覧を読み込むタイミング\r
+ */\r
+var File = ( function(){\r
+       var DRIVER_LIST             = [];\r
+       \r
+       var FILE_TYPE_IS_FOLDER     = Const.FILE.TYPE.FOLDER,\r
+               numFileType             = Const.FILE.TYPE.XML,\r
+               FILEDATA_RESITER        = [],                   // store all of fileData( json object )\r
+               FILEDATA_ACCESS         = [],                   // file operations for Kernel only ! hide from Out of File\r
+               FILE_OBJECT_POOL        = [],\r
+               EVENT_LISTENER_REGISTER = [],\r
+               TREE_ARRAY              = [],\r
+               TREE_ACCESS_ARRAY       = [];\r
+       \r
+       var REQUEST_CONTROLER = ( function(){\r
+               var REQUEST_TICKET_RESISTER = [],\r
+                       currentTicket           = null,\r
+                       currentData             = null,\r
+                       DATA_TYPE_ARRAY         = 'json,xml,html,text'.split( ',' ),\r
+                       DATA_IS_JSON            = 0,\r
+                       DATA_IS_XML             = 1,\r
+                       DATA_IS_HTML            = 2,\r
+                       DATA_IS_TEXT            = 3,\r
+                       numError                = 0;\r
+               \r
+               var RequestTicket = Class.create(\r
+                       Class.POOL_OBJECT, {\r
+                       Constructor : function( apiuser, type, data, url, onLoad, onError ){\r
+                               this.apiuser = apiuser;\r
+                               this.type    = type;\r
+                               this.data    = data;\r
+                               this.url     = url;\r
+                               this.onLoad  = onLoad;\r
+                               this.onError = onError;\r
+                               this.state   = 0;\r
+                       },\r
+                       load : function( data ){\r
+                               AsyncCall.add( this.apiuser, this.onLoad, [ this.data, data ] );\r
+                       },\r
+                       error : function(){\r
+                               AsyncCall.add( this.apiuser, this.onError, this.data );\r
+                       }\r
+               });\r
+               \r
+               function request(){\r
+                       if( currentTicket !== null || REQUEST_TICKET_RESISTER.length === 0 ) return;\r
+                       currentTicket = REQUEST_TICKET_RESISTER.shift();\r
+                       $.ajax({\r
+                               url:            currentTicket.url,\r
+                               dataType:       DATA_TYPE_ARRAY[ currentTicket.type ],\r
+                               success:        onSuccess,\r
+                               error:          onError\r
+                       });\r
+               };\r
+               function onSuccess( _data ){\r
+                       currentTicket.load( _data );\r
+                       currentTicket.kill();\r
+                       currentTicket = null;\r
+                       request();\r
+               };\r
+               function onError(){\r
+                       ++numError;\r
+                       currentTicket.error();\r
+                       currentTicket.kill(); // retry\r
+                       currentTicket = null;\r
+                       request();\r
+               };\r
+\r
+               return {\r
+                       getNumTask: function(){\r
+                               return REQUEST_TICKET_RESISTER.length;\r
+                       },\r
+                       getNumError: function(){\r
+                               return numError;\r
+                       },\r
+                       getJson: function( _apiuser, _data, _url, _onLoad, _onError ){\r
+                               REQUEST_TICKET_RESISTER.push( new RequestTicket( _apiuser, DATA_IS_JSON, _data, _url, _onLoad, _onError ));\r
+                               currentTicket === null && request();\r
+                       }\r
+               };\r
+       })();\r
+\r
+       var FILE_CONTROLER = {\r
+               createTree: function( _apiuser, _rootFileData ){\r
+                       var _tree = new TreeClass( _apiuser, _rootFileData );\r
+                       TREE_ARRAY.push( _tree );\r
+                       return _tree;\r
+               },\r
+               getFileUID: function( FILEDATAorFILE ){\r
+                       if( FILEDATAorFILE instanceof FileClass ){\r
+                               return FILEDATAorFILE.getUID();\r
+                       };\r
+                       \r
+                       var uid = Util.getIndex( FILEDATA_RESITER, FILEDATAorFILE );\r
+                       if( uid === -1 ){\r
+                               uid = FILEDATA_RESITER.length;\r
+                               FILEDATA_RESITER.push( FILEDATAorFILE );\r
+                       };\r
+                       return uid;\r
+               },\r
+               getFileDataAccess: function( UIDorFILEorFILEDATA ){\r
+                       var _uid, _data = FILE_CONTROLER.getFileData( UIDorFILEorFILEDATA ), _access;\r
+\r
+                       if( _data === null || typeof _data !== 'object' ) return null;\r
+                       for( var i=0, l = FILEDATA_ACCESS.length; i<l; ++i ){\r
+                               _access = FILEDATA_ACCESS[ i ];\r
+                               if( _access.DATA === _data ) return _access;\r
+                       };\r
+                       return null;\r
+               },      \r
+               getFileData: function( UIDorFILEorFILEDATA ){\r
+                       if( typeof UIDorFILEorFILEDATA === 'number' ){\r
+                               return FILEDATA_RESITER[ UIDorFILEorFILEDATA ] || null;\r
+                       } else\r
+                       if( UIDorFILEorFILEDATA instanceof FileClass ){\r
+                               return FILEDATA_RESITER[ UIDorFILEorFILEDATA.getUID() ] || null;\r
+                       } else\r
+                       if( Util.getIndex( FILEDATA_RESITER, UIDorFILEorFILEDATA ) !== -1 ){\r
+                               return UIDorFILEorFILEDATA;\r
+                       };\r
+                       return null;\r
+               },\r
+               getChildren: function( UIDorFILEorFILEDATA ){\r
+                       var _data = FILE_CONTROLER.getFileData( UIDorFILEorFILEDATA );\r
+                       return _data !== null ? _data.children || null : null;\r
+               },\r
+               getDriver: function( _file ){\r
+                       var _data = FILE_CONTROLER.getFileData( _file );\r
+                       return _data !== null && _data.driver ? _data.driver : BASE_DRIVER;\r
+               },\r
+               getUpdateFlag: function( _file, _bit ){\r
+                       var _driver = FILE_CONTROLER.getDriver( _file ),\r
+                               _policy;\r
+                       if( typeof _driver.getUpdatePolicy === 'function' ){\r
+                               _policy = _driver.getUpdatePolicy( _file );\r
+                               \r
+                       }\r
+                       if( typeof _policy !== 'number' ) {\r
+                               _policy = BASE_DRIVER.getUpdatePolicy( _file )\r
+                       }\r
+                       return _policy % ( _bit * 2 ) >= _bit;\r
+               },\r
+               move: function( _prentUID, _targetfile, _newFolder, _newIndex, _opt_callback ){\r
+                       var _parentData = FILE_CONTROLER.getFileDataAccess( _prentUID ),\r
+                               _parentType = _parentData.TYPE,\r
+                               _targetData = FILE_CONTROLER.getFileDataAccess( _targetfile ),\r
+                               _targetType = _targetData.TYPE;\r
+               },\r
+               replace: function( _uid, _file, _newIndex ){\r
+                       \r
+               },\r
+               addEventListener: function( FILEorNULL, _eventType, _callback, opt_thisObject ){\r
+                       var _uid = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL;\r
+                       EVENT_LISTENER_REGISTER.push( new FileEventTicket( _uid, _eventType, _callback, opt_thisObject ));\r
+               },\r
+               removeEventListener: function( FILEorNULL, eventType, callback ){\r
+                       var uid  = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL,\r
+                               list = EVENT_LISTENER_REGISTER,\r
+                               i    = 0,\r
+                               ticket;\r
+                       for( ; i < list.length; ){\r
+                               ticket = list[ i ];\r
+                               if( ticket.fileUID === uid && ticket.eventType === eventType && ticket.callBack === callback ){\r
+                                       list.splice( i, 1 );\r
+                                       ticket.kill();\r
+                               } else {\r
+                                       ++i;\r
+                               };\r
+                       };\r
+               },\r
+               getTreeAccess: function(){\r
+                       \r
+               },\r
+               fileEventRellay: function( _uid, _event ){\r
+                       var _fileAccess = FILE_CONTROLER.getFileDataAccess( _uid );\r
+                       if( _fileAccess === null ) return;\r
+                       var _treeUID    =  _fileAccess.TREE.getUID(),\r
+                               _treeAccess = TREE_ACCESS_ARRAY[ _treeUID ],\r
+                               _data       = _fileAccess.DATA,\r
+                               _tree;\r
+                       if( !_treeAccess ) return;\r
+                       _treeAccess.dispatchFileEvent( _event );\r
+                       for( var i=0, l = TREE_ARRAY.length; i<l; ++i ){\r
+                               if( i !== _treeUID ){\r
+                                       _tree = TREE_ARRAY[ i ];\r
+                                       if( FILE_CONTROLER.getFileData( _tree.getCurrentFile() ) === _data ){\r
+                                               _treeAccess = TREE_ACCESS_ARRAY[ _tree.getUID() ];\r
+                                               _treeAccess && _treeAccess.dispatchFileEvent( _event );\r
+                                       };\r
+                               };\r
+                       };\r
+               }\r
+       };\r
+       \r
+       var TreeClass = function( apiuser, rootFileData ){\r
+               var PARENT_FILE_RESITER = [],\r
+                       ACCESS = {\r
+                               apiuser          : apiuser,\r
+                               dispatchFileEvent: dispatchFileEvent\r
+                       },\r
+                       EVENT_LISTENER_ARRAY = [],\r
+                       instance             = this,\r
+                       rootFile             = new FileClass( instance, null, rootFileData ),\r
+                       currentFile          = rootFile;\r
+               \r
+               currentFile.getSeqentialFiles();\r
+               TREE_ACCESS_ARRAY.push( ACCESS );\r
+               \r
+               function dispatchFileEvent( e ){\r
+                       var _eventType  = e.eventType,\r
+                               _targetFile = e.targetFile,\r
+                               _uid        = _targetFile.getUID(),\r
+                               _ticket, _type, _callback;\r
+                       for( var i=0, l = EVENT_LISTENER_REGISTER.length; i<l; ++i ){\r
+                               _ticket   = EVENT_LISTENER_REGISTER[ i ];\r
+                               _type     = _ticket.eventType;\r
+                               _callback = _ticket.callBack;\r
+                               if( _eventType === _type && _uid === _ticket.fileUID ){\r
+                                       AsyncCall.add( apiuser, _callback, [ _eventType, _targetFile, e.key, e.value ], _ticket.thisObject || _targetFile );\r
+                               } else\r
+                               if( _type === Const.TREE.EVENT.UPDATE && _eventType === Const.FILE.EVENT.GET_SEQENTIAL_FILES ){\r
+                                       //_callback( _eventType, _targetFile );\r
+                                       AsyncCall.add( apiuser, _callback, [ _eventType, _targetFile ], _ticket.thisObject || instance );\r
+                               };\r
+                       };\r
+               };\r
+               \r
+               this.getUID = function(){\r
+                       return Util.getIndex( TREE_ACCESS_ARRAY, ACCESS );\r
+               };\r
+               this.getRootFile = function(){\r
+                       return rootFile;\r
+               };\r
+               this.getCurrentFile = function(){\r
+                       return currentFile;\r
+               };\r
+               this.hierarchy = function(){\r
+                       return PARENT_FILE_RESITER.length;\r
+               };\r
+               this.getParentFileAt = function( _index ){\r
+                       var l = PARENT_FILE_RESITER.length;\r
+                       if( typeof _index !== 'number' || _index < 0 || _index >= l ) return null;\r
+                       return PARENT_FILE_RESITER[ l -1 -_index ];\r
+               };\r
+               this.down = function( _index ){\r
+                       if( typeof _index !== 'number' || _index < 0 || _index >= currentFile.getChildFileLength()) return;\r
+                       PARENT_FILE_RESITER.unshift( currentFile );\r
+                       currentFile = currentFile.getChildFileAt( _index );\r
+                       currentFile.getSeqentialFiles();\r
+                       return currentFile;\r
+               };\r
+               this.up = function( _index ){\r
+                       var l = PARENT_FILE_RESITER.length;\r
+                       if( l === 0 ) return null;\r
+                       \r
+                       if( currentFile ){\r
+                               var _currentFile = currentFile;\r
+                               currentFile = null;\r
+                               _currentFile.destroy();\r
+                       };\r
+                       if( typeof _index === 'number' ){\r
+                               if( _index >= l ) return null;\r
+                               currentFile = this.getParentFileAt( _index );\r
+                               PARENT_FILE_RESITER.splice( 0, l -_index);\r
+                       } else {\r
+                               currentFile = PARENT_FILE_RESITER.shift();\r
+                       };\r
+                       currentFile.getSeqentialFiles();\r
+                       return currentFile;     \r
+               };\r
+               this.addTreeEventListener = function( _eventType, _callback, opt_thisObject ){\r
+                       FILE_CONTROLER.addEventListener( null, _eventType, _callback, opt_thisObject );\r
+               };\r
+               this.removeTreeEventListener = function( _eventType, _callback ){\r
+                       FILE_CONTROLER.removeEventListener( null, _eventType, _callback );\r
+               };\r
+               this.destroy = function( _apiuser ){\r
+                       if( _apiuser && apiuser !== _apiuser ) return false;\r
+                       // removeEvent\r
+                       var _currentFile = currentFile;\r
+                       currentFile = rootFile = rootFileData = null;\r
+                       // currentFile, rootFile を null にしないと .File.destroy() ができない.\r
+                       _currentFile.destroy();\r
+                       while( PARENT_FILE_RESITER.length > 0 ){\r
+                               _currentFile = PARENT_FILE_RESITER.shift();\r
+                               _currentFile.destroy();\r
+                       };\r
+                       \r
+                       AsyncCall.remove( apiuser );\r
+                       instance = apiuser = null;\r
+                       return true;\r
+               };\r
+       };\r
+       \r
+       var FileEventTicket = Class.create(\r
+               Class.POOL_OBJECT, {\r
+               Constructor : function( uid, eventType, callback, opt_thisObject ){\r
+                       this.fileUID    = uid;\r
+                       this.eventType  = eventType;\r
+                       this.callBack   = callback;\r
+                       this.thisObject = opt_thisObject;\r
+               }       \r
+       });\r
+       \r
+       var FileEventClass = function( eventType, file, key, value ){\r
+               this.eventType        = eventType;\r
+               this.targetFile       = file;\r
+               this.updatedAttribute = key;\r
+               this.updatedValue     = value;\r
+       };\r
+\r
+/*\r
+ * file の data は object で保持している。\r
+ * File の外からファイルをみるときは、FileClassを通して操作する。\r
+ * fileの変更、それに付随して追加されたイベントは、TreeClassで管理される。\r
+ * treeがdestryされると、fileのイベントリスナーも全て削除される。\r
+ * 他の tree も data の共通する currentFile に対してのみは、file の変更イベントを受け取って流す.\r
+ * \r
+ */\r
+       \r
+       var FileClass = function( tree, parentData, data ){\r
+               var uid = FILE_CONTROLER.getFileUID( data );\r
+               \r
+               FILEDATA_ACCESS.push( {\r
+                       TREE:                           tree,\r
+                       parentData:                     parentData,\r
+                       DATA:                           data\r
+               } );\r
+               \r
+               tree = parentData = data = null;\r
+\r
+               this.getUID = function(){\r
+                       return uid;\r
+               };\r
+       };\r
+       \r
+       FileClass.prototype = {\r
+               isChildFile: function( _FILEorFILEDATA ){\r
+                       return this.getChildFileIndex( _FILEorFILEDATA) !== -1;\r
+               },\r
+               getSeqentialFiles: function(){\r
+                       var _driver = FILE_CONTROLER.getDriver( this );\r
+                       if( _driver !== null && typeof _driver.getSeqentialFiles === 'function' ){\r
+                               _driver.getSeqentialFiles( this );\r
+                       }\r
+               },\r
+               addEventListener: function( _eventType, _callback ){\r
+                       FILE_CONTROLER.addEventListener( this, _eventType, _callback );\r
+               },\r
+               removeEventListener: function( _eventType, _callback ){\r
+                       FILE_CONTROLER.removeEventListener( this, _eventType, _callback );\r
+               },\r
+               dispatchEvent: function( e ){\r
+                       e instanceof FileEventClass && FILE_CONTROLER.fileEventRellay( this.getUID(), e );\r
+               },\r
+               getChildFileLength: function(){\r
+                       var children = FILE_CONTROLER.getChildren( this );\r
+                       return Type.isArray( children ) === true ? children.length : -1;\r
+               },\r
+               getChildFileIndex: function( _FILEorFILEDATA ){\r
+                       var children = FILE_CONTROLER.getChildren( this );\r
+                       if( Type.isArray( children ) === false ) return -1;\r
+                       var l = children.length,\r
+                               _fileData = FILE_CONTROLER.getFileData( _FILEorFILEDATA );\r
+                       if( _fileData === null ) return -1;\r
+                       for( var i=0; i<l; ++i ){\r
+                               if( children[ i ] === _fileData ) return i;\r
+                       }\r
+                       return -1;\r
+               },\r
+               getChildFileAt: function( _index ){\r
+                       var _access = FILE_CONTROLER.getFileDataAccess( this ),\r
+                               _children = FILE_CONTROLER.getChildren( this );\r
+                       if( typeof _index !== 'number' || _index < 0 || Type.isArray( _children ) === false || _index >= _children.length ) return null;\r
+                       var _file = new FileClass( _access.TREE, _access.DATA, _children[ _index ]);\r
+                       // _file.init();\r
+                       return _file;\r
+               },\r
+               getName: function(){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.getName === 'function'){\r
+                               return driver.getName( this );\r
+                       }\r
+                       return BASE_DRIVER.getName( this );\r
+               },\r
+               getThumbnail: function(){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.getThumbnail === 'function'){\r
+                               return driver.getThumbnail( this );\r
+                       }\r
+                       return BASE_DRIVER.getThumbnail( this );\r
+               },\r
+               getType: function(){\r
+                       var _data = FILE_CONTROLER.getFileData( this );\r
+                       return typeof _data.type === 'number' ? _data.type : Const.FILE.TYPE.UNKNOWN;\r
+               },\r
+               getState: function(){\r
+                       var _data = FILE_CONTROLER.getFileData( this );\r
+                       return typeof _data.state === 'number' ? _data.state : Const.FILE.STATE.OK;\r
+               },\r
+               getSummary: function(){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.getSummary === 'function'){\r
+                               return driver.getSummary( this );\r
+                       }\r
+                       return BASE_DRIVER.getSummary( this );\r
+               },\r
+               isWritable: function(){\r
+                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.WRITE );\r
+               },\r
+               isSortable: function(){\r
+                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.SORT );\r
+               },              \r
+               isCreatable: function(){\r
+                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.CREATE );\r
+               },\r
+               isRenamable: function(){\r
+                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.RENAME );\r
+               },\r
+               isDeletable: function(){\r
+                       return FILE_CONTROLER.getUpdateFlag( this, Const.FILE.UPDATE_POLICY.DELETE );\r
+               },\r
+               read: function(){\r
+                       // simpleDeepCopy\r
+                       var driver = FILE_CONTROLER.getDriver( this ),\r
+                               data;\r
+                       if( Type.isFunction( driver.read ) === true ){\r
+                                data = driver.read( this );\r
+                       };\r
+                       return BASE_DRIVER.read( data || this );\r
+               },\r
+               write: function( _newData, _onUpdateFunction ){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.write === 'function' ){\r
+                               return driver.write( this, _newData, _onUpdateFunction );\r
+                       };\r
+                       return BASE_DRIVER.write( this, _newData, _onUpdateFunction );\r
+               },\r
+               viewerApplicationList: function(){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.viewerApplicationList === 'function' ){\r
+                               return driver.viewerApplicationList( this );\r
+                       };\r
+                       return BASE_DRIVER.viewerApplicationList( this );\r
+               },\r
+               editorApplicationList: function(){\r
+                       var driver = FILE_CONTROLER.getDriver( this );\r
+                       if( typeof driver.editorApplicationList === 'function' ){\r
+                               return driver.editorApplicationList( this );\r
+                       };\r
+                       return BASE_DRIVER.viwerApps( this );\r
+               },\r
+               create: function(){\r
+                       \r
+               },\r
+               sort: function(){\r
+                       \r
+               },\r
+               onCopy: function(){\r
+                       \r
+               },\r
+               onDelete: function(){\r
+                       \r
+               },\r
+               move: function( _newFolder, _newIndex, opt_callback ){\r
+                       var _access = FILE_CONTROLER.getFileDataAccess( this );\r
+                       _access.TREE.move( _access.parentData, this.getUID(), _newFolder, _newIndex, opt_callback );\r
+               },\r
+               replace: function( _newIndex, opt_callback ){\r
+                       var _access = FILE_CONTROLER.getFileDataAccess( this );\r
+                       _access.TREE.replace( _access.parentData, this.getUID(), _newIndex, opt_callback);\r
+               },\r
+               /**\r
+                * サーチ\r
+                * 探しているファイルの属性と値を指定.一致する child の index を配列で返す.\r
+                */\r
+               search: function( obj, rule ){\r
+                       var _children = FILE_CONTROLER.getChildren( this ),\r
+                               _child,\r
+                               ret = [], k, c;\r
+                       for( var i=0, l=_children.length; i<l; ++i ){\r
+                               _child = _children[ i ];\r
+                               c = true;\r
+                               for( k in obj ){\r
+                                       if( obj[ k ] !== _child[ k ] ){\r
+                                               c = false;\r
+                                               break;\r
+                                       }\r
+                               }\r
+                               c === true && ret.push( i );\r
+                       }\r
+                       return ret;\r
+               },\r
+               destroy: function(){\r
+                       var _access = FILE_CONTROLER.getFileDataAccess( this );\r
+                       var _tree = _access.TREE;\r
+                       if( _tree.getCurrentFile() === this ) return;\r
+                       if( _tree.getRootFile() === this ) return;\r
+                       for( var i=0, l = _tree.hierarchy(); i<l; ++i ){\r
+                               if( _tree.getParentFileAt( i ) === this ){\r
+                                       return;\r
+                               }\r
+                       }\r
+                       var _index = Util.getIndex( FILEDATA_ACCESS, _access );\r
+                       if( _index === -1 ) return;\r
+                       // event の 削除\r
+                       FILEDATA_ACCESS.splice( _index, 1 );\r
+                       delete _access.DATA;\r
+                       delete _access.TREE;\r
+                       delete _access.parentData;\r
+               }\r
+       };\r
+\r
+       /*\r
+        * FileDriverBase\r
+        */\r
+       var FileDriverBase = function( driverClass ){\r
+               this.getUID = function(){\r
+                       return Util.getIndex( API_USER_LIST, driverClass );\r
+               };\r
+               this.getSeqentialFiles = function( _file ){\r
+               };\r
+               this.getName = function( _file ){\r
+                       var _data = FILE_CONTROLER.getFileData( _file );\r
+                       return _data.name || 'No Name';\r
+               };\r
+               this.getThumbnail = function( _file ){\r
+                       var _data = FILE_CONTROLER.getFileData( _file ),\r
+                               _type = _data.type,\r
+                               _className = '';\r
+                       if( _type === Const.FILE.TYPE.FOLDER ){\r
+                               _className = 'folder';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.IMAGE ){\r
+                               \r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.TEXT ){\r
+                               \r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.HTML ){\r
+                               \r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.CSV ){\r
+                               \r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.JSON ){\r
+                               \r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.XML ){\r
+                               \r
+                       };\r
+                       return {\r
+                               image:          null,\r
+                               className:      ' file-type-' + _className\r
+                       };\r
+               };\r
+               this.getSummary = function( _file ){\r
+                       var _data = FILE_CONTROLER.getFileData( _file ),\r
+                               _type = _data.type;\r
+                       if( _type === Const.FILE.TYPE.FOLDER ){\r
+                               return 'folder';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.IMAGE ){\r
+                               return 'image file';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.TEXT ){\r
+                               return 'text file';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.HTML ){\r
+                               return 'html document file';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.CSV ){\r
+                               return 'csv daat file';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.JSON ){\r
+                               return 'json data file';\r
+                       } else\r
+                       if( _type === Const.FILE.TYPE.XML ){\r
+                               return 'xml data file';\r
+                       }\r
+                       return '';\r
+               };\r
+               this.getUpdatePolicy = function( _file ){\r
+                       // debug用 全てのメニューを許可\r
+                       return Const.FILE.UPDATE_POLICY.DSRWC;\r
+               };\r
+               this.read = function( FILEorDATA ){\r
+                       var data,\r
+                               protects = Const.FILE.DATA_PROPERTY_RESERVED,\r
+                               objSrc   = [],\r
+                               objCopy  = [],\r
+                               getIndex = Util.getIndex;                       \r
+                       if( FILEorDATA instanceof FileClass ){\r
+                               data = FILE_CONTROLER.getFileData( FILEorDATA )\r
+                       } else {\r
+                               data = FILEorDATA;\r
+                       };\r
+                       \r
+                       function clone( src ) {\r
+                               var ret, i, key;\r
+                               if( Type.isArray( src ) === true ){\r
+                                       i = getIndex( objSrc, src );\r
+                                       if( i !== -1 ) return objCopy[ i ];\r
+                                       ret = [];\r
+                                       objSrc[ objSrc.length ]   = src;\r
+                                       objCopy[ objCopy.length ] = ret;\r
+                               } else\r
+                               if( Type.isObject( src ) === true ){\r
+                                       i = getIndex( objSrc, src );\r
+                                       if( i !== -1 ) return objCopy[ i ];\r
+                                       ret = {};\r
+                                       objSrc[ objSrc.length ]   = src;\r
+                                       objCopy[ objCopy.length ] = ret;\r
+                               } else\r
+                               if( Type.isNumber( src ) === true || Type.isString( src ) === true || Type.isBoolean( src ) === true ){\r
+                                       return src;\r
+                               } else {\r
+                                       return src;\r
+                               };\r
+                               for( key in src ){\r
+                                       if( getIndex( protects, key ) === -1 ){\r
+                                               ret[ key ] = clone( src[ key ]);\r
+                                       };\r
+                               };\r
+                               return ret;\r
+                       };                              \r
+                       return clone( data );\r
+               };\r
+               this.write = function( _file, _newData, _onUpdateFunction ){\r
+                       var _data = FILE_CONTROLER.getFileData( _file ),\r
+                               _type = _data.type;\r
+                       return false;\r
+               };\r
+               this.viewerApplicationList = function(){\r
+                       return [];\r
+               };\r
+               this.editorApplicationList = function(){\r
+                       return [];\r
+               };\r
+               this.onCreate = function(){\r
+                       \r
+               };\r
+               this.onSort = function(){\r
+                       \r
+               };\r
+               this.onCopy = function(){\r
+                       \r
+               };\r
+               this.onDelete = function(){\r
+                       \r
+               };\r
+       };\r
+       \r
+       var BASE_DRIVER   = new FileDriverBase();\r
+       \r
+       var ROOT_FILEDATA = {\r
+                       name:           'system root',\r
+                       type:           FILE_TYPE_IS_FOLDER,\r
+                       children:       []\r
+               },\r
+               SYSTEM_TREE = FILE_CONTROLER.createTree( SUPER_USER_KEY, ROOT_FILEDATA ),\r
+               ROOT_FILE   = SYSTEM_TREE.getRootFile();\r
+\r
+       function createFileTypeID(){\r
+               return ++numFileType;\r
+       };\r
+       \r
+       var FileAPIClass = function( driver ){\r
+               var constObject;\r
+               this.createFolderUnderRoot = function( _fileData ){\r
+                       if( _fileData !== null && Type.isObject( _fileData ) === true ){\r
+                               ROOT_FILEDATA.children.push( _fileData );\r
+                               ROOT_FILE.dispatchEvent( new FileEventClass( Const.FILE.EVENT.GET_SEQENTIAL_FILES, ROOT_FILE, 'children', null ));\r
+                       }\r
+               };\r
+               this.createFileEvent   = function( _eventType, _file, _key, _value ){\r
+                       return new FileEventClass( _eventType, _file, _key, _value );\r
+               };\r
+               this.createFileTypeID  = createFileTypeID;\r
+               this.getFileDataAccess = FILE_CONTROLER.getFileDataAccess;\r
+               this.getFileData       = FILE_CONTROLER.getFileData;\r
+               this.getJson           = function( _data, _url, _onLoad, _onError ){\r
+                       REQUEST_CONTROLER.getJson( driver, _data, _url, _onLoad, _onError );\r
+               };\r
+               this.createTree        = function( _rootFile ){\r
+                       return FILE_CONTROLER.createTree( driver, _rootFile );\r
+               };\r
+               this.isTreeInstance    = function( _tree ){\r
+                       return _tree instanceof TreeClass;\r
+               };\r
+               this.isFileInstance    = function( _file ){\r
+                       return _file instanceof FileClass;\r
+               };\r
+               this.isFileEvent       = function( _event ){\r
+                       return _event instanceof FileEventClass;\r
+               };\r
+               this.getConst          = function(){\r
+                       return Const; // constObject = constObject || clone( Const )\r
+               };\r
+       };\r
+       \r
+       return {\r
+               registerDriver: function( _class ){\r
+                       _class.prototype = new FileDriverBase( _class );\r
+                       var _driver = new _class();\r
+                       \r
+                       DRIVER_LIST.push( _driver );\r
+                       API_USER_LIST.push( _class );\r
+\r
+                       return new FileAPIClass( _driver );\r
+               },\r
+               isDriver: function( _driver ){\r
+                       return _driver instanceof FileDriverBase;\r
+               },\r
+               isTreeInstance: function( _tree ){\r
+                       return _tree instanceof TreeClass;\r
+               },\r
+               isFileInstance: function( _file ){\r
+                       return _file instanceof FileClass;\r
+               }\r
+       }\r
+})();\r
+\r
+\r
+/* ----------------------------------------------------\r
+ * ApplicationManager\r
+ * window resize event, overlayApplication currentAplication に流す\r
+ */    \r
+\r
+var APPLICATION_LIST = [];\r
+\r
+var ApplicationPrivateData = function(){};\r
+ApplicationPrivateData.prototype = {\r
+       appClass      : null,\r
+       application   : null,\r
+       displayName   : null,\r
+       isOverlay     : false,\r
+       rootElement   : null,\r
+       bgColor       : '#C1CACF',\r
+       uiList        : null,\r
+       formList      : null,\r
+       finderList    : null,\r
+       styleCursor   : null,\r
+       eventRoot     : null,\r
+       fetchResource : 0,\r
+       bootParams    : null,\r
+       phase         : 0,\r
+       cursor        : '',\r
+       w             : 0,\r
+       h             : 0,\r
+       init          : function( appClass, displayName, isOverlay ){\r
+               this.appClass    = appClass;\r
+               // this.application = app;\r
+               this.displayName = displayName;\r
+               this.isOverlay   = isOverlay;\r
+               this.rootElement = document.createElement( 'div' );\r
+               this.styleCursor = this.rootElement.style;\r
+               ApplicationPrivateData.list.push( this );\r
+       },\r
+       detect : function(){\r
+               if( this.rootElement.firstChild && this.fetchResource === 0 ){\r
+                       SystemTimer.remove( this.application, this.detect );\r
+                       this.onOpen();\r
+               };\r
+       },\r
+       onOpen : function(){\r
+               this.rootElement.style.display = '';\r
+               \r
+               // this.layer !== null && this.layer.onResize( this.w, this.h );\r
+               \r
+               if( this.application.MIN_WIDTH > this.w || this.application.MIN_HEIGHT > this.h ){\r
+                       if( Type.isHTMLElement( this.rootElement ) === true ){\r
+                               // 小さすぎる!、と表示\r
+                       };\r
+               };\r
+               if( this.bootParams.length > 2 ){\r
+                       this.application.onOpen.apply( this.application, this.bootParams );\r
+               } else {\r
+                       this.application.onOpen( this.w, this.h );\r
+               };\r
+               this.phase = 4; \r
+       },\r
+       fetchResourceComplete : function(){\r
+               --this.fetchResource;\r
+       }\r
+};\r
+ApplicationPrivateData.list = [];\r
+ApplicationPrivateData.get = function( app ){\r
+       var list = ApplicationPrivateData.list,\r
+               i    = list.length;\r
+       for( ; i; ){\r
+               if( app instanceof list[ --i ].appClass ) return list[ i ];\r
+       };\r
+       return null;\r
+};\r
+\r
+var AbstractApplication = function( appClass, displayName, isOverlay ){\r
+       ( new ApplicationPrivateData() ).init( appClass, displayName, isOverlay );\r
+};\r
+AbstractApplication.prototype = {\r
+       getUID : function(){\r
+               var data = ApplicationPrivateData.get( this );\r
+               return Util.getIndex( API_USER_LIST, data.appClass );\r
+       },\r
+       init : function(){\r
+               var data = ApplicationPrivateData.get( this );\r
+               // this.rootElement = data.rootElement;\r
+               // data.application = this;\r
+               data.phase = 1;\r
+               data.appClass === Page.appClass && Page.show();\r
+               this.onInit();\r
+               data.phase = 2;\r
+       },\r
+       open : function( w, h /*, _option */ ){\r
+               var data = ApplicationPrivateData.get( this );\r
+               data.phase      = 3;\r
+               data.bootParams = Util.copyArray( arguments );\r
+               data.w          = w;\r
+               data.h          = h;\r
+               if( data.rootElement.innerHTML && data.rootElement.innerHTML.length > 0 ){\r
+                       SystemTimer.add( this, data.detect, 16, false, data );\r
+               } else {\r
+                       data.onOpen();\r
+               };\r
+       },\r
+       resize : function( w, h ){\r
+               var data = ApplicationPrivateData.get( this );\r
+               if( data.phase !== 4 ) return;\r
+               if( this.MIN_WIDTH > w || this.MIN_HEIGHT > h ){\r
+                       if( Type.isHTMLElement( this.rootElement ) === true ){\r
+                               // 小さすぎる!、と表示\r
+                       };\r
+                       return;\r
+               };\r
+               this.onPaneResize( w, h );\r
+       },\r
+       close : function(){\r
+               var data = ApplicationPrivateData.get( this );\r
+               data.phase = 5;\r
+               if( this.onClose() === false ){\r
+                       return false;\r
+               };\r
+               if( data.uiList ){ \r
+                       while( data.uiList.length > 0 ) data.uiList.shift().destroy();\r
+               };\r
+               if( data.finderList ){\r
+                       while( data.finderList.length > 0 ) data.finderList.shift().destroy();\r
+               };              \r
+               \r
+               data.eventRoot && PointingDeviceEventTree.destroyTree( data.eventRoot );\r
+               MouseEvent.remove( this );\r
+               KeyEvent.remove( this );\r
+               SystemTimer.remove( this );\r
+               AsyncCall.remove( this );\r
+               StyleSheet.unload( this );\r
+\r
+               var elm = this.rootElement;\r
+               Util.removeAllChildren( elm );\r
+               elm.parentNode.removeChild( elm );\r
+               \r
+               Application.shutdown( this, data.isOverlay );\r
+               \r
+               data.appClass === Page.appClass && Page.hide();\r
+\r
+               data.phase = 6;\r
+               \r
+               var list = ApplicationPrivateData.list;\r
+               list.splice( Util.getIndex( list, data ), 1 );\r
+       },\r
+       createUIGroup : function( node ){\r
+               var data = ApplicationPrivateData.get( this ),\r
+                       ui = UI.createUIGroup( this, node );\r
+               if( data.uiList === null ) data.uiList = [];\r
+               data.uiList.push( ui );\r
+               return ui;\r
+       },\r
+       createUIForm : function( nodeOrElm, opt_elmForm ){\r
+               var data = ApplicationPrivateData.get( this ),\r
+                       form = UIForm.createForm( this, nodeOrElm, opt_elmForm );\r
+               if( data.formList === null ) data.formList = [];\r
+               data.formList.push( form );\r
+               return form;\r
+       },\r
+       createFinder : function( _elmTarget, _tree, _onSelect, _viewerOption, _editorOption ){\r
+               var data   = ApplicationPrivateData.get( this ),\r
+                       finder = Finder.create( this, _elmTarget, _tree, _onSelect, _viewerOption, _editorOption );\r
+               if( data.finderList === null ) data.finderList = [];\r
+               data.finderList.push( finder );\r
+               return finder;\r
+       },\r
+       createDHTML : function( _elm ){\r
+               return DHTML.create( this, _elm );\r
+       },\r
+       addEventListener : function( element, eventType, handler, opt_thisObject ){\r
+               MouseEvent.add( this, element, eventType, handler, opt_thisObject );\r
+       },\r
+       removeEventListener : function( element, eventType, handler ){\r
+               MouseEvent.remove( this, element, eventType, handler );\r
+       },\r
+       getPointingDeviceEventTreeRoot : function(){\r
+               var data = ApplicationPrivateData.get( this );\r
+               if( data.phase === 1 ){\r
+                       data.eventRoot   = PointingDeviceEventTree.create( this );\r
+                       data.styleCursor = PointingDeviceEventTree._getNodePrivateData( data.eventRoot ).elmMouseCatch.style;\r
+               };              \r
+               return data.eventRoot;\r
+       },\r
+       updateCoursor : function( _cursor ){\r
+               var data = ApplicationPrivateData.get( this );\r
+               if( data.cursor !== _cursor ){\r
+                       data.styleCursor.cursor = data.cursor = _cursor;\r
+               };\r
+       },\r
+       fetchCSS : function( url, opt_onload, opt_onerror ){\r
+               var data = ApplicationPrivateData.get( this );\r
+               if( data.phase === 1 ){\r
+                       ++data.fetchResource;\r
+                       StyleSheet.load( this, url, data.fetchResourceComplete, data.fetchResourceComplete, data );\r
+               };\r
+       },\r
+       onInit : function(){},\r
+       onOpen : function(){},\r
+       onClose : function(){ return true; },\r
+       onPaneResize : function( w, h ){},\r
+       addKeyEventListener : function( _eventType, _handler, _keyCode, _shift, _ctrl ){\r
+               KeyEvent.add( this, _eventType, _handler, _keyCode, _shift, _ctrl );\r
+       },\r
+       removeKeyEventListener : function( _eventType, _handler, _keyCode, _shift, _ctrl ){\r
+               KeyEvent.remove( this, _eventType, _handler, _keyCode, _shift, _ctrl );\r
+       },\r
+       shiftEnabled : function(){\r
+               return KeyEvent.shiftEnabled;\r
+       },\r
+       ctrlEnabled : function(){\r
+               return KeyEvent.ctrlEnabled;\r
+       },\r
+       addTimer : function( handler, time, once ){\r
+               SystemTimer.add( this, handler, time, !!once );\r
+       },\r
+       removeTimer : function( handler ){\r
+               SystemTimer.remove( this, handler );\r
+       },\r
+       addAsyncCall : function( _callback, _argments, _thisObject ){\r
+               AsyncCall.add( this, _callback, _argments, _thisObject );\r
+       },\r
+       removeAsyncCall : function( _callback ){\r
+               AsyncCall.remove( this, _callback );\r
+       },\r
+       fetchHTMLElement : function( id ){\r
+               var elm = document.getElementById( id );\r
+               if( elm ){\r
+                       elm.removeAttribute( 'id' );\r
+                       elm.parentNode.removeChild( elm );\r
+                       return elm;\r
+               };\r
+       }\r
+};\r
+\r
+var PointingDeviceEventTree = ( function(){\r
+       var ROOT_LIST       = [],\r
+               currentRootData = null,\r
+               targetNodeData  = null,\r
+               forceNodeData   = null,\r
+               hoverList       = [];\r
+       \r
+       function eventRellay( e ){\r
+               var data = forceNodeData, // || targetNodeData,\r
+                       x    = e.clientX,\r
+                       y    = e.clientY,\r
+                       type = e.type,\r
+                       list = hoverList,\r
+                       i    = 0,\r
+                       ret, systemOnly = false, addClass, removeClass,\r
+                       parent;\r
+               if( data && data.dispatchEvent( e, type, true ) === true ) return false;\r
+               if( currentRootData === null ) return;\r
+               targetNodeData = currentRootData;\r
+               currentRootData._capcher( x, y );\r
+               targetNodeData.apiuser.updateCoursor( targetNodeData._cursor );\r
+               data = targetNodeData;\r
+               while( data ){\r
+                       ret = data.dispatchEvent( e, type, true, systemOnly );\r
+                       if( ret === true || ret === false ) break; // systemOnly = true;\r
+                       data = data.parentData;\r
+               };\r
+               \r
+               addClass    = Util.addClass;\r
+               removeClass = Util.removeClass;\r
+               for( ; i < list.length; ){\r
+                       parent = data = list[ i ];\r
+                       while( parent.parentData && parent === parent.parentData.hitChild ){\r
+                               parent = parent.parentData;\r
+                       };\r
+                       if( parent !== currentRootData ){\r
+                               data.hover === true && removeClass( data.elm, data.hoverClass );\r
+                               delete data.isHover;\r
+                               data.events && data.events.mouseout && data.fire( e, 'mouseout', false );\r
+                               delete data.hitSelf;\r
+                               list.splice( i, 1 );\r
+                               continue;\r
+                       };\r
+                       if( data.hover === true && data.isHover === false ){\r
+                               addClass( data.elm, data.hoverClass );\r
+                               data.isHover = true;\r
+                       };\r
+                       if( data.hitSelf === false ){\r
+                               data.events && data.events.mouseover && data.fire( e, 'mouseover', true );\r
+                               data.hitSelf = true;\r
+                       };\r
+                       ++i;\r
+               };\r
+               return false;\r
+       };      \r
+       \r
+       var NodeClass = function( apiuser, rootData, /*parentLayer,*/ parentData, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop ){\r
+               ( new NodePrivateData() ).init( apiuser, rootData, /*parentLayer,*/ parentData, this, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop );\r
+       };\r
+       NodeClass.prototype = {\r
+               createNode : function( rangeOrElmData, through, clip, hover, cursor, scroll, dragdrop ){\r
+                       var data = NodePrivateData.get( this ),\r
+                               elm;\r
+                       if( Type.isHTMLElement( rangeOrElmData ) === true ){\r
+                               elm = rangeOrElmData;\r
+                       } else\r
+                       if( Type.isString( rangeOrElmData ) === true ){\r
+                               elm = document.getElementById( rangeOrElmData );\r
+                               if( !elm ){\r
+                                       elm = Util.pullHtmlAsTemplete( rangeOrElmData );\r
+                               };\r
+                               if( !elm || Type.isHTMLElement( elm ) === false || elm.nodeType !== 1 ){\r
+                                       throw new Error( "invalid HTMLElement." );\r
+                               };\r
+                       } else\r
+                       if( Type.isObject( rangeOrElmData ) === false || Type.isFinite( rangeOrElmData.x ) === false || Type.isFinite( rangeOrElmData.y ) === false ){\r
+                               throw new Error( "No range" );\r
+                       };\r
+                       \r
+                       if( elm && data.elm === null ){\r
+                               throw new Error( "MetaLayer don't containe HTMLElement-Layer." );\r
+                       };\r
+                       if( data.elm && data.elm.style.hasLayout === false ){\r
+                               throw new Error( "[ie] OffsetParent is hasLayout === false." );\r
+                       };\r
+                       \r
+                       var newNode = new NodeClass( data.apiuser, data.rootData, data, elm || rangeOrElmData, through, clip, hover, cursor, scroll, dragdrop ),\r
+                               newData = NodePrivateData.get( newNode );\r
+                       \r
+                       if( data.childData === null ) data.childData = [];\r
+                       data.childData.push( newData );\r
+                       return newNode;\r
+               },\r
+               createNodeAt : function(){\r
+               },\r
+               remove : function(){\r
+                       NodePrivateData.get( this ).remove();\r
+               },\r
+               nodeIndex : function( v ){\r
+                       return NodePrivateData.get( this ).nodeIndex( v );\r
+               },\r
+               numNode : function(){\r
+                       return NodePrivateData.get( this ).numNode();\r
+               },\r
+               disabled : function( v ){\r
+                       return NodePrivateData.get( this ).disabled( v );\r
+               },\r
+               childrenDisabled : function( v ){\r
+                       return NodePrivateData.get( this ).disabled( v );\r
+               },\r
+               mesure : function(){\r
+                       NodePrivateData.get( this ).mesure();\r
+               },\r
+               mesureChildren : function(){\r
+                       NodePrivateData.get( this ).mesureChildren();\r
+               },\r
+               update : function( x, y, w, h ){\r
+                       NodePrivateData.get( this ).update( x, y, w, h );\r
+               },\r
+               setPosition : function( x, y ){\r
+                       NodePrivateData.get( this ).setPosition( x, y );\r
+               },\r
+               setSize : function( w, h ){\r
+                       NodePrivateData.get( this ).setSize( w, h );\r
+               },\r
+               cursor : function( v ){\r
+                       return NodePrivateData.get( this ).cursor( v );\r
+               },\r
+               x : function( x ){\r
+                       return NodePrivateData.get( this ).positionX( x );\r
+               },\r
+               y : function( y ){\r
+                       return NodePrivateData.get( this ).positionY( y );\r
+               },\r
+               width : function( w ){\r
+                       return NodePrivateData.get( this ).width( w );\r
+               },\r
+               height : function( h ){\r
+                       return NodePrivateData.get( this ).height( h );\r
+               },\r
+               getAbsolutePositionX : function(){\r
+                       return NodePrivateData.get( this ).getAbsolutePositionX();\r
+               },\r
+               getAbsolutePositionY : function(){\r
+                       return NodePrivateData.get( this ).getAbsolutePositionY();\r
+               },\r
+               addEventListener : function( type, handler, opt_thisObject ){\r
+                       NodePrivateData.get( this ).addEventListener( type, handler, opt_thisObject );\r
+               },\r
+               removeEventListener : function( type, handler ){\r
+                       NodePrivateData.get( this ).removeEventListener( type, handler );\r
+               },\r
+               scrollTo : function( x, y ){\r
+                       NodePrivateData.get( this ).scrollTo( x, y );\r
+               },\r
+               scrollX : function( v ){\r
+                       return NodePrivateData.get( this ).scrollX( v );\r
+               },\r
+               scrollY : function( v ){\r
+                       return NodePrivateData.get( this ).scrollY( v );\r
+               },\r
+               invalidateScrollbar : function(){\r
+                       ScrollBarManager.update( NodePrivateData.get( this ) );\r
+               }\r
+       };\r
+\r
+       /**\r
+        * clip : true の場合、子ノードの変更によってヒットエリアを変化させない.elm には overflow:hidden としておくのが通常.\r
+        */\r
+       var NodePrivateData = function(){};\r
+       NodePrivateData.prototype = {\r
+               elmMouseCatch : null, // rootData only\r
+               eventCounter  : null, // rootData only\r
+               cursorStyle   : null, // rootData only\r
+               node          : null,\r
+               apiuser       : null,\r
+               rootData      : null,\r
+               elm           : null, // resizeTarget\r
+               elmScroll     : null,\r
+               elmScroller   : null,\r
+               elmScrollbar  : null,\r
+               x             : 0,\r
+               y             : 0,\r
+               w             : 0,\r
+               h             : 0,\r
+               t             : 0, // top\r
+               l             : 0, // left\r
+               b             : 0, // bottom\r
+               r             : 0, // right\r
+               absoluteX     : 0,\r
+               absoluteY     : 0,\r
+               _scrollX      : 0,\r
+               _scrollY      : 0,\r
+               scrollingX    : 0,\r
+               scrollingY    : 0,\r
+               _cursor       : '',\r
+               // parentLayer   : null,\r
+               parentData    : null,\r
+               childData     : null,\r
+               events        : null,\r
+               hitChild      : null,\r
+               hitSelf       : false,\r
+               _disabled     : false,\r
+               _childDisabled: false,\r
+               layoutManager : null,\r
+               through       : false,\r
+               clip          : false,\r
+               hover         : false,\r
+               hoverClass    : null,\r
+               isHover       : false,\r
+               scroll        : false,\r
+               dragdrop      : false,\r
+               tooltip       : null,\r
+               init: function( apiuser, rootData, /*parentLayer,*/ parentData, node, rangeOrElm, through, clip, hover, cursor, scroll, dragdrop ){\r
+                       this.apiuser     = apiuser;\r
+                       this.rootData    = rootData || this;\r
+                       // this.parentLayer = parentLayer;\r
+                       this.parentData  = parentData;\r
+                       this.node        = node;\r
+                       this.through     = through;\r
+                       this.clip        = !!clip;\r
+                       if( cursor ) this._cursor = cursor;   \r
+\r
+                       if( Type.isHTMLElement( rangeOrElm ) === true ){\r
+                               this.elm        = rangeOrElm;\r
+                               this.hover      = !!hover;\r
+                               this.hoverClass = hover;\r
+                               this.scroll     = clip && scroll;                               \r
+                               this.mesure();\r
+                               this.scroll === true && ScrollBarManager.register( this );\r
+                       } else {\r
+                               this.update( rangeOrElm.x, rangeOrElm.y, rangeOrElm.w, rangeOrElm.h );\r
+                       };\r
+                       \r
+                       NodePrivateData.dataList.push( this );\r
+               },\r
+               mesure : function(){\r
+                       var x, y, w, h, parent, _this, _parent;\r
+                       if( this.elm ){\r
+                               w = this.elm.offsetWidth;\r
+                               h = this.elm.offsetHeight;\r
+                               _this   = Position.cumulativeOffset( this.elm );\r
+                               _parent = this.parentData ? Position.cumulativeOffset( this.parentData.elm ) : [ 0, 0 ];\r
+                               x  = _this[ 0 ] - _parent[ 0 ];\r
+                               y  = _this[ 1 ] - _parent[ 1 ];                         \r
+                               if( this.x !== x || this.y !== y || this.w !== w || this.h !== h ){\r
+                                       this.x = x;\r
+                                       this.y = y;\r
+                                       this.w = w;\r
+                                       this.h = h;\r
+                                       parent = this.parentData;\r
+                                       parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );\r
+                                       this._updateRectangle();\r
+                               };                      \r
+                       } else {\r
+                               this._updateRectangle();\r
+                       };\r
+               },\r
+               mesureChildren : function(){\r
+                       var nodes, i;\r
+                       if( nodes = this.childData ){\r
+                               for( i = nodes.length; i; ){\r
+                                       nodes[ --i ].mesure();\r
+                               };\r
+                       };\r
+               },\r
+               update : function( x, y, w, h ){\r
+                       var updateXY = false,\r
+                               _this, _parent,\r
+                               parent;\r
+                       \r
+                       if( this.elm ){\r
+                               // width\r
+                               if( Type.isFinite( w ) === true ){\r
+                                       this.elm.style.width = w + 'px';\r
+                               } else\r
+                               if( Type.isString( w ) === true ){\r
+                                       this.elm.style.width = w;\r
+                                       w = this.elm.offsetWidth;\r
+                               };\r
+                               //update = this.w !== w;\r
+       \r
+                               // height\r
+                               if( Type.isFinite( h ) === true ){\r
+                                       this.elm.style.height = h + 'px';\r
+                               } else\r
+                               if( Type.isString( h ) === true ){\r
+                                       this.elm.style.height = w;\r
+                                       h = this.elm.offsetHeight;\r
+                               };\r
+                               //update = update || this.h !== h;\r
+                               \r
+                               // x\r
+                               if( Type.isFinite( x ) === true ){\r
+                                       this.elm.style.left = x + 'px';\r
+                               } else\r
+                               if( Type.isString( x ) === true ){\r
+                                       this.elm.style.left = x;\r
+                                       updateXY = true;\r
+                               } else {\r
+                                       updateXY = true;\r
+                               };\r
+                               \r
+                               // y\r
+                               if( Type.isFinite( y ) === true ){\r
+                                       this.elm.style.top = y + 'px';\r
+                               } else\r
+                               if( Type.isString( y ) === true ){\r
+                                       this.elm.style.top = y;\r
+                                       updateXY = true;\r
+                               } else {\r
+                                       updateXY = true;\r
+                               };\r
+                               if( updateXY === true ){\r
+                                       _this   = Position.cumulativeOffset( this.elm );\r
+                                       _parent = this.parentData ? Position.cumulativeOffset( this.parentData.elm ) : [ 0, 0 ];\r
+                                       x       = _this[ 0 ] - _parent[ 0 ];\r
+                                       y       = _this[ 1 ] - _parent[ 1 ];\r
+                               };\r
+                               //update = update || this.x !== x;\r
+                               //update = update || this.y !== y;\r
+                               \r
+                               //update === true && this._updateRectangle();\r
+                               // return;\r
+                       };\r
+                       x = Type.isFinite( x ) === true ? x : this.x;\r
+                       y = Type.isFinite( y ) === true ? y : this.y;\r
+                       w = Type.isFinite( w ) === true ? w : this.w;\r
+                       h = Type.isFinite( h ) === true ? h : this.h;\r
+                       if( this.x !== x || this.y !== y ){\r
+                               this.x = x;\r
+                               this.y = y;\r
+                               //console.log( 'xy  ' + ( this.elm ? this.elm.id : '' ) + ' x:' + x + ' y:' + y + ' w:' + w + ' h:' + h + ' absX:' + this.parentData.absoluteX )\r
+                               parent = this.parentData;\r
+                               parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );\r
+                               this.w === w && this.h === h && this._updateRectangle();\r
+                       };\r
+                       if( this.w !== w || this.h !== h ){\r
+                               this.w = w;\r
+                               this.h = h;\r
+                               //console.log( 'wh  ' + ( this.elm ? this.elm.id : '' ) + ' x:' + x + ' y:' + y + ' w:' + w + ' h:' + h )\r
+                               this._updateRectangle();\r
+                       };\r
+                       \r
+                       ScrollBarManager.update( this );\r
+               },\r
+               _updateAbsoluteXY : function( x, y, sX, sY ){\r
+                       var nodes, i;\r
+                       this.absoluteX = x = this.x + x;\r
+                       this.absoluteY = y = this.y + y;\r
+                       if( nodes = this.childData ){\r
+                               for( i = nodes.length; i; ){\r
+                                       nodes[ --i ]._updateAbsoluteXY( x, y, this.scrollingX, this.scrollingY );\r
+                               };\r
+                       };\r
+               },\r
+               _updateRectangle : function(){\r
+                       var w = this.w,\r
+                               h = this.h,\r
+                               x = this.x,\r
+                               y = this.y,\r
+                               l = x,\r
+                               t = y,\r
+                               r = x + w,\r
+                               b = y + h,\r
+                               nodes = this.childData,\r
+                               i, node;\r
+                       // self;\r
+                       // childnodes\r
+                       if( this.clip === false && nodes ){\r
+                               for( i = nodes.length; i; ){\r
+                                       node = nodes[ --i ];\r
+                                       if( node.l + x < l ) l = x + node.l;\r
+                                       if( node.t + y < t ) t = y + node.t;\r
+                                       if( r < node.r + x ) r = x + node.r;\r
+                                       if( b < node.b + y ) b = y + node.b;\r
+                               };\r
+                       };\r
+                       // update\r
+                       if( b !== this.b || r !== this.r || t !== this.t || l !== this.l ){\r
+                               this.l = l;\r
+                               this.t = t;\r
+                               this.r = r;\r
+                               this.b = b;\r
+                               // this.w = r - x;\r
+                               // this.h = b - y;\r
+                               this.parentData && this.parentData.clip === false && this.parentData._updateRectangle();\r
+                               return true;\r
+                       };\r
+               },\r
+               setPosition : function( x, y ){\r
+                       this.update( x, y );\r
+               },\r
+               setSize : function( w, h ){\r
+                       this.update( undefined, undefined, w, h );\r
+               },\r
+               positionX : function( x ){\r
+                       x !== undefined && this.update( x );\r
+                       return this.x;\r
+               },\r
+               positionY : function( y ){\r
+                       y !== undefined && this.update( undefined, y );\r
+                       return this.y;\r
+               },\r
+               width : function( w ){\r
+                       w !== undefined && this.update( undefined, undefined, w );\r
+                       return this.w;\r
+               },\r
+               height : function( h ){\r
+                       h !== undefined && this.update( undefined, undefined, undefined, h );\r
+                       return this.h;\r
+               },\r
+               getAbsolutePositionX : function(){\r
+                       return this.absoluteX;\r
+               },\r
+               getAbsolutePositionY : function(){\r
+                       return this.absoluteY;\r
+               },\r
+               cursor : function( v ){\r
+                       if( Type.isString( v ) === true ){\r
+                               this._cursor = v;\r
+                               this === targetNodeData && this.apiuser.updateCoursor( v );\r
+                       };\r
+                       return this._cursor;\r
+               },\r
+               addEventListener : function( eventType, handler, opt_thisObject ){\r
+                       var node    = this.node,\r
+                               counter = this.rootData.eventCounter,\r
+                               list, i;\r
+                       if( this.events === null ) this.events = {};\r
+                       list = this.events[ eventType ];\r
+                       if( !list ){\r
+                               list = this.events[ eventType ] = [];\r
+                       } else {\r
+                               for( i = list.length; i; ){\r
+                                       if( list[ --i ].match( eventType, handler ) === true ){\r
+                                               return;\r
+                                       };\r
+                               };                              \r
+                       };\r
+                       list.push( new EventTicketClass( this.node, eventType, handler, opt_thisObject ) );\r
+                       if( eventType !== 'mouseout' && eventType !== 'mouseover' ){\r
+                               if( counter[ eventType ] ){\r
+                                       ++counter[ eventType ];\r
+                               } else {\r
+                                       //console.log( eventType );\r
+                                       counter[ eventType ] = 1;\r
+                                       MouseEvent.add( this.apiuser, this.rootData.elmMouseCatch, eventType, eventRellay );\r
+                               };                              \r
+                       };\r
+               },\r
+               removeEventListener : function( eventType, handler ){\r
+                       var events  = this.events,\r
+                               counter = this.rootData.eventCounter,\r
+                               type, list, i = 0;\r
+                       if( events === null ) return;\r
+                       console.log( ' *** remove ' + eventType );\r
+                       for( type in events ){\r
+                               list = events[ type ];\r
+                               if( eventType && eventType !== type ) continue;\r
+                               for( ; i < list.length; ){\r
+                                       if( list[ i ].destroy( type, handler ) === true ){\r
+                                               console.log( ' *** removed! ' + type );\r
+                                               list.splice( i, 1 );\r
+                                       } else {\r
+                                               ++i;\r
+                                       };\r
+                               };\r
+                               if( list.length === 0 ){\r
+                                       // delete this[ type ];\r
+                                       delete events[ type ];\r
+                               };\r
+                               if( counter[ type ] ){\r
+                                       --counter[ type ];\r
+                                       if( counter[ type ] === 0 ){\r
+                                               MouseEvent.remove( this.apiuser, this.rootData.elmMouseCatch, type, eventRellay );\r
+                                               delete counter[ type ];\r
+                                       };\r
+                               };\r
+                       };\r
+               },\r
+               _capcher : function( x, y ){\r
+                       var t = this, nodes, child, _x, _y, hit, i;\r
+                       if( t._disabled === true ) return false;\r
+                       delete t.hitChild;\r
+                       x -= t.x;\r
+                       y -= t.y;\r
+                       if( nodes = t.childData ){\r
+                               _x = x - t.scrollingX;\r
+                               _y = y - t.scrollingY;\r
+                               for( i = nodes.length; i; ){\r
+                                       child = nodes[ --i ];\r
+                                       if( child._disabled === false && child.l <= _x && _x < child.r && child.t <= _y && _y < child.b && child._capcher( _x, _y ) === true ){\r
+                                               t.hitChild = child;\r
+                                               break;\r
+                                       };\r
+                               };\r
+                       };\r
+                       if( t.through === true ){\r
+                               t.hitChild && t.hitSelf === false && hoverList.push( t );\r
+                               return !!t.hitChild;\r
+                       };\r
+                       hit = 0 <= x && x < t.w && 0 <= y && y < t.h;\r
+                       ( t.hitChild || hit ) && t.hitSelf === false && hoverList.push( t );\r
+                       if( hit === true && t.hitChild === null ) targetNodeData = t;\r
+                       return hit || !!t.hitChild;\r
+               },\r
+               fire : function( e, eventType, hit ){\r
+                       var list = this.events[ eventType ],\r
+                               i    = list.length;\r
+                       e = NodePrivateData.createEvent( e, eventType, this, hit );\r
+                       for( ; i; ) list[ --i ].fire( e );\r
+                       // console.log( eventType + ' x:' + x + ' y:' + y );\r
+               },\r
+               dispatchEvent : function( e, eventType, hit ){\r
+                       var ret, list, i, p, child;\r
+                       if( !this.events || !( list = this.events[ eventType ] ) ) return;\r
+                       \r
+                       child = !!this.hitChild;\r
+                       e = NodePrivateData.createEvent( e, eventType, this, hit );\r
+                       for( i = list.length; i; ){\r
+                               ret = list[ --i ].fire( e );\r
+                               if( ret === true && child === false ){\r
+                                       forceNodeData = this;\r
+                                       return true;\r
+                               };\r
+                               if( ret === false ) return false;\r
+                       };\r
+                       forceNodeData  = null;\r
+               },\r
+               scrollTo : function( x, y ){\r
+                       this._scrollX = x;\r
+                       this._scrollY = y;\r
+                       ScrollBarManager.update( this );\r
+               },\r
+               scrollX : function( v ){\r
+                       if( Type.isFinite( v ) === true ){\r
+                               this._scrillX = v;\r
+                               ScrollBarManager.update( this );\r
+                       };\r
+                       return this.scrollingX; // this._scrollX;\r
+               },\r
+               scrollY : function( v ){\r
+                       if( Type.isFinite( v ) === true ){\r
+                               this._scrillY = v;\r
+                               ScrollBarManager.update( this );\r
+                       };\r
+                       return this.scrollingY; // this._scrollY;\r
+               },\r
+               nodeIndex : function( v ){\r
+                       var list, i;\r
+                       if( !this.parentData ) return 0;\r
+                       \r
+                       list = this.parentData.childData;\r
+                       i    = Util.getIndex( list, this );\r
+                       if( Type.isFinite( v ) === false || i === v && v < 0 && list.length <= v ) return i;\r
+                       \r
+                       list.splice( i, 1 );\r
+                       list.length === v ? list.push( this ) : list.splice( v, 0, this );\r
+                       this._free();\r
+                       return v;\r
+               },\r
+               _free : function(){\r
+                       if( this.parentData.hitChild === this ){\r
+                               this.parentData.hitChild = null;\r
+                               this.isHover === true && hoverList.splice( Util.getIndex( hoverList, this ), 1 ) && Util.removeClass( this.elm, this.hoverClass );\r
+                               this.isHover = false;\r
+                               if( forceNodeData === this ) forceNodeData = null;\r
+                               if( targetNodeData  === this ) targetNodeData  = null;\r
+                       };                      \r
+               },\r
+               numNode : function(){\r
+                       return this.childData ? this.childData.length : 0;\r
+               },\r
+               disabled : function( v ){\r
+                       if( Type.isBoolean( v ) === true ){\r
+                               this._disabled = v;\r
+                               if( v === false ){\r
+                                       this._free();\r
+                               };\r
+                       };\r
+                       return this._disabled;\r
+               },\r
+               childrenDisabled : function( v ){\r
+                       if( Type.isBoolean( v ) === true ){\r
+                               this._childDisabled = v;\r
+                       };\r
+                       return this._childDisabled;\r
+               },\r
+               remove : function(){\r
+                       if( this === this.rootData ) return;\r
+                       var parent = this.parentData,\r
+                               nodes  = parent.childData;\r
+                       this._destroy();\r
+                       if( parent.hitChild === this ) delete parent.hitChild;\r
+                       nodes.splice( Util.getIndex( nodes, this ), 1 );\r
+                       if( nodes.length === 0 ) delete parent.childData;       \r
+                       parent.clip === false && parent._updateRectangle();\r
+               },\r
+               _destroy : function(){\r
+                       var nodes = this.childData,\r
+                               list  = NodePrivateData.dataList,\r
+                               node;\r
+                       this.removeEventListener();\r
+                       ScrollBarManager.remove( this );\r
+                       if( nodes ){\r
+                               while( node = nodes.shift() ) node._destroy();\r
+                               delete this.childData;\r
+                       };\r
+                       list.splice( Util.getIndex( list, this ), 1 );\r
+               }\r
+       };\r
+       NodePrivateData.dataList = [];\r
+       NodePrivateData.get = function( node ){\r
+               // if( node instanceof NodePrivateData ) return node;\r
+               // return NodePrivateData.dataList[ layer._getUID() ];\r
+               var list = NodePrivateData.dataList;\r
+               for( var i = list.length; i; ){\r
+                       if( list[ --i ].node === node ) return list[ i ];\r
+               };\r
+               return null;\r
+       };\r
+       NodePrivateData.createEvent = function( e, eventType, data, hit ){\r
+               var _e = {\r
+                       layerX      : e.clientX - data.absoluteX,\r
+                       layerY      : e.clientY - data.absoluteY,\r
+                       clientX     : e.clientX,\r
+                       clientY     : e.clientY,\r
+                       dragOffsetX : e.dragOffsetX,\r
+                       dragOffsetY : e.dragOffsetY,\r
+                       dragPhase   : e.dragPhase,                                      \r
+                       eventType   : eventType,\r
+                       hit         : hit,\r
+                       node        : data.node,\r
+                       wheelDelta  : e.wheelDelta,\r
+                       target      : forceNodeData ? forceNodeData.node : targetNodeData ? targetNodeData.node : null\r
+               };\r
+               return _e;\r
+       };\r
+       \r
+       var EventTicketClass = function( node, eventType, handler, opt_thisObject ){\r
+               this.node    = node;\r
+               this.type    = eventType;\r
+               this.handler = handler;\r
+               this.thisObj = opt_thisObject || node;\r
+       };\r
+       EventTicketClass.prototype = {\r
+               match : function( eventType, handler ){\r
+                       if( handler && this.handler !== handler ) return false;\r
+                       if( eventType && this.type !== eventType ) return false;\r
+                       return true;\r
+               },\r
+               destroy : function( eventType, handler ){\r
+                       if( this.match( eventType, handler ) === false ) return false;\r
+                       delete this.node;\r
+                       delete this.type;\r
+                       delete this.handler;\r
+                       delete this.thisObj;\r
+                       return true;\r
+               },\r
+               fire : ( function(){\r
+                       if( Function.prototype.call ){\r
+                               return function( e ){\r
+                                       return this.handler.call( this.thisObj, e );\r
+                               };                              \r
+                       };\r
+                       return function( e ){\r
+                               var ret;\r
+                               this.thisObj._currentHandler = this.handler;\r
+                               ret = this.thisObj._currentHandler( e );\r
+                               delete this.thisObj._currentHandler;\r
+                               return ret;                                     \r
+                       };\r
+               })()\r
+       };\r
+       \r
+/*-------------------------------------\r
+ *  StayHelper\r
+ */\r
+       var StayEventTicketClass = function( node, data, stayhandler, opt_thisObject ){\r
+               node.addEventListener( 'mouseover', this.mouseoverHandler, this );\r
+               this.node       = node;\r
+               this.data       = data;\r
+               this.handler    = stayhandler;\r
+               this.thisObject = opt_thisObject;\r
+       };\r
+       StayEventTicketClass.prototype = Util.extend( new EventTicketClass( null, 'mousestay' ), {\r
+               // type : 'mousestay',\r
+               e    : null,\r
+               mouseoverHandler : function( e ){\r
+                       this.e = NodePrivateData.createEvent( e, this.type, this.data, true );\r
+                       this.node.addEventListener( 'mouseout',  this.mousestayHandler, this );\r
+                       this.node.addEventListener( 'mousemove', this.mousemoveHandler, this );\r
+                       SystemTimer.add( this.data.apiuser, this.timeoutHandler, null, this );\r
+               },\r
+               timeoutHandler : function(){\r
+                       this.mouseoutHandler();\r
+                       return this.fire( this.e );\r
+               },\r
+               mousemoveHandler : function( e ){\r
+                       this.e = NodePrivateData.createEvent( e, this.type, this.data, true );\r
+                       SystemTimer.remove( this.data.apiuser, this.timeoutHandler );\r
+                       SystemTimer.add( this.data.apiuser, this.timeoutHandler, null, this );\r
+               },\r
+               mouseoutHandler : function( e ){\r
+                       this.node.removeEventListener( 'mouseout', this.mousestayHandler );\r
+                       this.node.removeEventListener( 'mousemove', this.mousemoveHandler );\r
+                       SystemTimer.remove( this.data.apiuser, this.timeoutHandler );\r
+                       delete this.e;\r
+               }\r
+       });\r
+       \r
+       var ScrollBarManager = ( function(){\r
+               var elmScroller     = document.createElement( 'div' ),\r
+                       elmBar          = document.createElement( 'div' ),\r
+                       smoothList      = [],\r
+                       dragPhase       = 2,\r
+                       dragOut         = false,\r
+                       currentNodeData = null,\r
+                       dragStartY      = 0,\r
+                       currentEvent;\r
+               \r
+               function tick(){\r
+                       var list = smoothList,\r
+                               i, data, y;\r
+                       for( i = 0; i < list.length; ){\r
+                               data = list[ i ];\r
+                               if( data.scrollingY !== data._scrollY ){\r
+                                       y = data.scrollingY += data.smoothY;\r
+                                       if( data.smoothY < 0 ){\r
+                                               y = y < data._scrollY ? data._scrollY : y;\r
+                                       } else {\r
+                                               y = data._scrollY < y ? data._scrollY : y;\r
+                                       };\r
+                                       data.scrollingY    = y;\r
+                                       data.elm.scrollTop = -y;\r
+                                       data.events && data.events.scroll && data.fire( currentEvent, 'scroll', true );\r
+                               };\r
+                               if( data.scrollingY === data._scrollY ){\r
+                                       list.splice( i, 1 );\r
+                                       // data.events && data.events.scroll && data.fire( currentEvent, 'scroll', true );\r
+                               } else {\r
+                                       ++i;\r
+                               };\r
+                       };\r
+                       list.length === 0 && SystemTimer.remove( SUPER_USER_KEY, tick );\r
+                       currentEvent.type = 'updateAfterScroll';\r
+                       AsyncCall.add( data.apiuser, eventRellay, currentEvent ); // スクロール後の更新        \r
+               };\r
+               \r
+               function scrollReady( e ){\r
+                       var data = this;\r
+                       \r
+                       dragOut = false;\r
+                       if( data === currentNodeData || dragPhase !== 2 ) return; // Drag中の場合は 他にスクロールを作らない\r
+                       currentNodeData && scrollRelease();\r
+\r
+                       dragPhase = 2;\r
+                       data.elm.parentNode.appendChild( elmScroller );\r
+                       elmScroller.appendChild( data.elm );\r
+                       \r
+                       elmScroller.style.cssText = 'position:absolute;left:0;top:0;';\r
+                       elmScroller.appendChild( elmBar );      \r
+                       \r
+                       data.elm.scrollTop = -data.scrollingY;\r
+                       data.rootData.addEventListener( 'mousewheel', onMouseWheelScroll, data );\r
+                       data.rootData.addEventListener( 'mousedrag',  onMouseDragScroll, data );\r
+                       data.addEventListener( 'mouseout',   onMouseOut, data );\r
+                       currentNodeData = data;\r
+                       ScrollBarManager.update( data );\r
+               };\r
+               function scrollRelease(){\r
+                       var data   = currentNodeData;\r
+                       var parent = elmScroller.parentNode;\r
+                       parent.appendChild( currentNodeData.elm );\r
+                       parent.removeChild( elmScroller );\r
+                       currentNodeData.elm.scrollTop = -data.scrollingY;\r
+                       \r
+                       data.rootData.removeEventListener( 'mousewheel', onMouseWheelScroll, data );\r
+                       data.rootData.removeEventListener( 'mousedrag',  onMouseDragScroll, data );\r
+                       data.removeEventListener( 'mouseout',   onMouseOut, data );\r
+                       currentNodeData = null;\r
+               };\r
+               function onMouseOut( e ){\r
+                       dragOut = true;\r
+                       console.log( 'mouseOut ' + dragPhase );\r
+                       dragPhase === 2 && scrollRelease(); // Dragしてのアウトの場合, scroll をリリースしない\r
+               };\r
+               function onMouseWheelScroll( e ){\r
+                       var data = this;\r
+                       this._scrollY += e.wheelDelta;\r
+                       ScrollBarManager.update( this );\r
+                       currentEvent = e;\r
+                       return true;\r
+               };\r
+               function onMouseDragScroll( e ){\r
+                       var data = this;\r
+                       //e.dragOffsetY;\r
+                       currentEvent = e;\r
+                       dragPhase = e.dragPhase;\r
+                       switch( dragPhase ){\r
+                               case 0:\r
+                                       dragStartY = this.scrollingY;\r
+                                       data.rootData.removeEventListener( 'mousewheel', onMouseWheelScroll, data );\r
+                               case 1:\r
+                                       this._scrollY = dragStartY + e.dragOffsetY;\r
+                                       ScrollBarManager.update( this );                                \r
+                                       return true;\r
+                               case 2:\r
+                                       dragOut === true ? scrollRelease() : data.rootData.addEventListener( 'mousewheel', onMouseWheelScroll, data );\r
+                                       return false;\r
+                       };\r
+               };\r
+               \r
+               return {\r
+                       register : function( data ){\r
+                               data.addEventListener( 'mouseover', scrollReady, data );\r
+                       },\r
+                       update : function( data ){\r
+                               // if( data !== currentNodeData ) return;\r
+                               var isCurrent = data === currentNodeData;\r
+                               \r
+                               var contentH = data._scrollH = data.elm.scrollHeight,\r
+                                       clipH    = data.h,\r
+                                       offsetH  = contentH - clipH,\r
+                                       scrollY  = data._scrollY = 0 < data._scrollY ? 0 : ( data._scrollY < -offsetH ? -offsetH : data._scrollY ),\r
+                                       barH, barY;\r
+                               if( isCurrent === true ){\r
+                                       elmScroller.style.width  = data.w + 'px';\r
+                                       elmScroller.style.height = clipH + 'px';                                        \r
+                               };\r
+                               \r
+                               if( offsetH < 1 ){\r
+                                       data._scrollY = scrollY = 0;\r
+                                       if( isCurrent === true ) elmBar.style.display = 'none';\r
+                               } else\r
+                               if( isCurrent === true ){\r
+                                       barH     = Math.floor( clipH * ( clipH / contentH ) );\r
+                                       barY     = Math.floor( ( clipH - barH ) * - scrollY / offsetH );\r
+                                       elmBar.style.cssText = [\r
+                                               'position:absolute;',\r
+                                               'width:10px;',\r
+                                               'background-color:#333;',\r
+                                               'right:2px;',\r
+                                               'font-size:0;line-height:0;',\r
+                                               'height:', barH, 'px;',\r
+                                               'top:', data.y + barY, 'px;'\r
+                                       ].join( '' );                                   \r
+                               };\r
+                               data.smoothY = ( scrollY - data.scrollingY ) / 10;\r
+                               if( data.scrollingY !== scrollY && Util.getIndex( smoothList, data ) === -1 ){\r
+                                       smoothList.length === 0 && SystemTimer.add( SUPER_USER_KEY, tick, 16 );\r
+                                       smoothList.push( data );\r
+                               };\r
+                       },\r
+                       remove : function( data ){\r
+                               var list = smoothList,\r
+                                       i    = Util.getIndex( list, data );\r
+                               data === currentNodeData && scrollRelease();\r
+                               i !== -1 && list.splice( i, 1 );\r
+                       }\r
+               };\r
+       })();\r
+       \r
+       return {\r
+               create : function( apiuser ){\r
+                       var     elm  = document.createElement( 'div' ),\r
+                               root, data;\r
+                       body.appendChild( elm );\r
+                       \r
+                       root = new NodeClass( apiuser, null, null, elm );\r
+                       data = NodePrivateData.get( root );\r
+                       \r
+                       // elm.style.cssText = 'position:absolute;top:0;left:0;height:100%;';\r
+                       elm.className      = 'mouse-operation-catcher';\r
+                       elm.unselectable   = 'on';\r
+                       data.elmMouseCatch = elm;\r
+                       \r
+                       data.eventCounter  = {};\r
+                       ROOT_LIST.push( data );\r
+                       currentRootData    = data;\r
+                       targetNodeData     = null;\r
+                       forceNodeData      = null;\r
+                       \r
+                       MouseEvent.add( apiuser, elm, 'mousemove', eventRellay );\r
+                       return root;\r
+               },\r
+               onCurrentApplicationChange : function( _application ){\r
+                       currentRootData    = null;\r
+                       targetNodeData     = null;\r
+                       forceNodeData      = null;\r
+                       for( var i = ROOT_LIST.length; i; ){\r
+                               if( ROOT_LIST[ --i ].apiuser === _application ){\r
+                                       currentRootData = ROOT_LIST[ i ];\r
+                                       return;\r
+                               };\r
+                       };\r
+               },\r
+               destroyTree : function( root ){\r
+                       var data = NodePrivateData.get( root );\r
+                       MouseEvent.remove( data.apiuser, data.elmMouseCatch, 'mousemove', eventRellay );\r
+                       body.removeChild( data.elmMouseCatch );\r
+                       data._destroy();\r
+                       ROOT_LIST.splice( Util.getIndex( ROOT_LIST, data ), 1 );\r
+                       if( currentRootData === data ){\r
+                               currentRootData    = null;\r
+                               targetNodeData     = null;\r
+                               forceNodeData      = null;      \r
+                       };\r
+               },\r
+               onSystemShutdown : function(){\r
+                       \r
+               },\r
+               isNodeInstance : function( node ){\r
+                       return node instanceof NodeClass;\r
+               },\r
+               _getNodePrivateData : function( node ){ // system only\r
+                       return NodePrivateData.get( node );\r
+               }\r
+       };\r
+})();\r
+\r
+var Application = ( function(){\r
+       \r
+       var LIVE_APPLICATION_LIST = [];\r
+       \r
+       var currentApplication    = null,\r
+               coveredApplication    = null,\r
+               winW                  = 0,\r
+               winH                  = 0;\r
+       \r
+       var ApplicationReference = function( appClass, isOverlay, displayName, id, thumbnailUrl, tailColor ){\r
+               var self          = this;\r
+               var application   = null;\r
+               this.id           = id;\r
+               this.displayName  = displayName;\r
+               this.thumbnailUrl = thumbnailUrl;\r
+               this.tailColor    = tailColor;\r
+               \r
+               function asyncBoot(){\r
+                       application = Application.boot( appClass, displayName, self.getUID(), isOverlay, Util.copyArray( arguments ) );\r
+               };\r
+               this.getUID = function(){\r
+                       return Util.getIndex( API_USER_LIST, appClass );\r
+               };\r
+               this.getDisplayName = function(){\r
+                       return this.displayName;\r
+               };\r
+               this.boot = function( /* _option */ ){\r
+                       AsyncCall.add( this, asyncBoot, Util.copyArray( arguments ) );\r
+               };\r
+               this.shutdown = function(){\r
+                       if( !application ) return false;\r
+                       \r
+                       AsyncCall.add( application, ( isOverlay === true ? Overlay.hide : application.close ) );\r
+               };\r
+       };\r
+       \r
+       function asyncBootHome(){\r
+               currentApplication === null && Home.boot();\r
+       };\r
+       function asyncOpen( /* arguments */ ){\r
+               var _arg = Util.copyArray( arguments );\r
+               _arg.unshift( winW, winH );\r
+               currentApplication.open.apply( currentApplication, _arg );\r
+       };\r
+       return {\r
+               register: function( _class, _overlay, _tail, _displayName, _id, _thumbnailUrl, _tailColor ){\r
+                       APPLICATION_LIST.push( _class );\r
+                       API_USER_LIST.push( _class );\r
+                       var _ref = new ApplicationReference( _class, _overlay, _displayName, _id, _thumbnailUrl, _tailColor );\r
+                       _tail === true && Home.add( _ref );\r
+                       return _ref;\r
+               },\r
+               isApplicationInstance: function( app ){\r
+                       return ApplicationPrivateData.get( app ) !== null;\r
+               },\r
+               isApplicationReference: function( _reference ){\r
+                       return _reference instanceof ApplicationReference;\r
+               },\r
+               isCurrentAppplication: function( app ){\r
+                       return app === currentApplication;\r
+               },\r
+               boot: function( appClass, displayName, uid, isOverlay, arg ){\r
+                       if( currentApplication ){\r
+                               if( currentApplication.getUID() === uid ) return null;\r
+                               if( isOverlay === false && currentApplication.close() === false ) return null;\r
+                       };\r
+\r
+                       appClass.prototype = new AbstractApplication( appClass, displayName, isOverlay );\r
+                       \r
+                       var application = new appClass(),\r
+                               data = ApplicationPrivateData.get( application );\r
+                       \r
+                       application.rootElement = data.rootElement;\r
+                       data.application = application;\r
+                       \r
+                       coveredApplication = isOverlay === true ? currentApplication : null;\r
+                       \r
+                       Application.onCurrentApplicationChange( application );\r
+                       \r
+                       if( isOverlay === false ){\r
+                               body.style.backgroundColor = application.bgColor;\r
+                               \r
+                               body.appendChild( data.rootElement );\r
+                               data.rootElement.style.display = 'none';\r
+                               application.init();\r
+\r
+                               application.addAsyncCall( asyncOpen, arg );\r
+                       } else {\r
+                               Overlay.show( application, arg );\r
+                       };\r
+                       \r
+                       return application;\r
+               },\r
+               shutdown: function( _application, isOverlay ){\r
+                       if( isOverlay === false ){\r
+                               currentApplication = null;\r
+                               AsyncCall.add( SUPER_USER_KEY, asyncBootHome );\r
+                       } else {\r
+                               Application.onCurrentApplicationChange( coveredApplication );\r
+                               coveredApplication = null;\r
+                       };\r
+               },\r
+               onCurrentApplicationChange: function( _application ){\r
+                       if( Application.isApplicationInstance( _application ) === false ) return;\r
+                       if( currentApplication === _application ) return;\r
+                       currentApplication = _application;\r
+                       MouseEvent.onCurrentApplicationChange( _application );\r
+                       PointingDeviceEventTree.onCurrentApplicationChange( _application );\r
+                       KeyEvent.updateCurrentListener( _application );\r
+                       // InteractiveLayer.onCurrentApplicationChange( _application );\r
+               },\r
+               onApplicationShutdown: function( _application ){\r
+                       LIVE_APPLICATION_LIST.splice( Util.getIndex(  LIVE_APPLICATION_LIST, _application ) );\r
+               },\r
+               onWindowResize: function( w, h ){\r
+                       winW = w;\r
+                       winH = h;\r
+                       currentApplication && currentApplication.resize( w, h );\r
+                       Overlay.onWindowResize( w, h );\r
+                       UI.onWindowResize( w, h );\r
+               },\r
+               onSystemShutdown: function(){\r
+                       \r
+               }\r
+       }\r
+})();\r
+\r
+/* --------------------------------------------------------------\r
+ * Home\r
+ * \r
+ */\r
+       var Home = ( function(){\r
+               var APP_REF_LIST    = [];\r
+               var ELM_TAIL_ORIGIN = ( function(){\r
+                       var ret = document.createElement( 'div' ),\r
+                               h2  = document.createElement( 'h2' );\r
+                       ret.className = 'tail-wrapper';\r
+                       ret.appendChild( h2 );\r
+                       h2.appendChild( document.createTextNode( 'appName' ) );\r
+                       return ret;\r
+               })();\r
+               \r
+               var TailClass = function( appRef ){\r
+                       this.elm = ELM_TAIL_ORIGIN.cloneNode( true );\r
+                       this.destroy = function(){\r
+                               appRef = self = elmName = null;\r
+                       };                      \r
+                       \r
+                       var self    = this,\r
+                               elmName = this.elm.getElementsByTagName( 'h2' )[ 0 ].firstChild;\r
+                       \r
+                       this.elm.style.backgroundColor = appRef.tailColor;\r
+                       elmName.data = appRef.displayName;\r
+               };\r
+               \r
+               var ref = Application.register( function(){\r
+                       var self     = this,\r
+                               winW     = 0,\r
+                               winH     = 0,\r
+                               tailList = [],\r
+                               elmContainer, elmHeader;\r
+                       \r
+                       function draw(){\r
+                               var tail, elm;\r
+                               for( var i=0, l=APP_REF_LIST.length; i<l; ++i ){\r
+                                       tail = new TailClass( APP_REF_LIST[ i ] );\r
+                                       tailList.push( tail );\r
+                                       elm  = tail.elm;\r
+                                       elmContainer.appendChild( elm );\r
+                                       self.addEventListener( elm, 'click', onTailClick );\r
+                               };\r
+                       };\r
+                       \r
+                       function onTailClick( e ){\r
+                               var _children = elmContainer.getElementsByTagName( 'div' );\r
+                               for( var i=0, l=_children.length; i<l; ++i ){\r
+                                       if( this === _children[ i ] ){\r
+                                               APP_REF_LIST[ i ].boot();\r
+                                               break;\r
+                                       };\r
+                               };\r
+                       };\r
+                       \r
+                       this.bgColor     = '#0F6D39';\r
+                       this.MIN_WIDTH   = 320;\r
+                       this.MIN_HEIGHT  = 320;\r
+                       this.onInit = function(){\r
+                               self.rootElement.id = 'home-root';\r
+                               \r
+                               elmContainer        = document.createElement( 'div' );\r
+                               self.rootElement.appendChild( elmContainer );\r
+                               elmContainer.id     = 'home-tail-container';\r
+                               \r
+                               elmHeader           = document.createElement( 'div' );\r
+                               self.rootElement.appendChild( elmHeader );\r
+                               elmHeader.id        = 'home-header';\r
+                       };\r
+                       this.onOpen = function( _w, _h ){\r
+                               winW = _w;\r
+                               winH = _h;\r
+                               draw();\r
+                       };\r
+                       this.onPaneResize = function( _w, _h ){\r
+                               \r
+                       };\r
+                       this.onClose = function(){\r
+                               self.removeEventListener();\r
+                               while( tailList.length > 0 ){\r
+                                       tailList.shift().destroy();\r
+                               }\r
+                               self = tailList = elmContainer = null;\r
+                       };\r
+               }, false, false, 'home', 'home', null );\r
+               \r
+               return {\r
+                       add: function( _appRef ){\r
+                               if( Application.isApplicationReference( _appRef ) === false ) return;\r
+                               Util.getIndex( APP_REF_LIST, _appRef ) === -1 && APP_REF_LIST.push( _appRef );\r
+                       },\r
+                       boot: function(){\r
+                               ref.boot();\r
+                       }\r
+               }\r
+       })();\r
+\r
+       var Page = ( function(){\r
+               var pageNodes = [],\r
+                       appClass, ref,\r
+                       ignoreTagList = [ 'script', 'noscript', 'style' ];\r
+               \r
+               var MemoryClass = function( node ){\r
+                       this.node = node;\r
+               };\r
+               MemoryClass.prototype = {\r
+                       init: function(){\r
+                               var node      = this.node,\r
+                                       _nodeType = node.nodeType;\r
+                               if( _nodeType === 1 && Util.getIndex( ignoreTagList, node.tagName.toLowerCase() ) === -1 ){\r
+                                       this.type    = _nodeType;\r
+                                       this.display = node.style.display;\r
+                               } else\r
+                               if( _nodeType === 3 ){\r
+                                       if( node.data.replace( /\s/g, '' ).length !== 0 ){\r
+                                               this.type    = _nodeType;\r
+                                               this.before  = pageNodes.length === 0 ? null : pageNodes[ pageNodes.length - 1 ].node;\r
+                                       } else {\r
+                                               body.removeChild( node );\r
+                                               return false;\r
+                                       }\r
+                               } else {\r
+                                       // body.removeChild( node );\r
+                                       return false;\r
+                               };\r
+                       },\r
+                       show: function(){\r
+                               if( this.type === 1 ){\r
+                                       if( this.display ){\r
+                                               this.node.style.display = this.display;\r
+                                       } else {\r
+                                               this.node.style.display = '';\r
+                                       }\r
+                               } else {\r
+                                       if( this.before ){\r
+                                               body.insertBefore( this.node, this.before );\r
+                                       } else {\r
+                                               body.appendChild( this.node );\r
+                                       };\r
+                               };\r
+                       },\r
+                       hide: function(){\r
+                               if( !this.node.parentNode ){\r
+                                       return;\r
+                               };\r
+                               if( this.type === 1 ){\r
+                                       this.node.style.display = 'none';\r
+                               } else {\r
+                                       body.removeChild( this.node );\r
+                               };\r
+                       }\r
+               };\r
+               \r
+               return {\r
+                       onReady: function(){\r
+                               var _children = Util.copyArray( body.childNodes ),\r
+                                       _mem;\r
+                               for( var i = 0, l = _children.length; i<l; ++i ){\r
+                                       _mem = new MemoryClass( _children[ i ] );\r
+                                       _mem.init() !== false && pageNodes.push( _mem );\r
+                               };\r
+                               if( pageNodes.length !== 0 ){\r
+                                       if( Type.isFunction( gOS.PageApplicationClass ) === true ){\r
+                                               Page.appClass = gOS.PageApplicationClass;\r
+                                               Page.appClass.bgColor    = Page.appClass.bgColor;\r
+                                               Page.appClass.MIN_WIDTH  = Page.appClass.MIN_WIDTH  || 240;\r
+                                               Page.appClass.MIN_HEIGHT = Page.appClass.MIN_HEIGHT || 240;\r
+                                       } else {\r
+                                               Page.appClass = function(){\r
+                                                       var self     = this;\r
+                                                       \r
+                                                       this.bgColor      = '#ffffff';\r
+                                                       this.MIN_WIDTH    = 200;\r
+                                                       this.MIN_HEIGHT   = 200;\r
+                                                       this.onInit       = function(){};\r
+                                                       this.onOpen       = function( _w, _h ){\r
+                                                               KeyEvent.add( self, Const.KEY.EVENT.KEY_DOWN, ref.shutdown, 27 ); // 27.esc\r
+                                                       };\r
+                                                       this.onPaneResize = function( _w, _h ){};\r
+                                                       this.onClose      = function(){};\r
+                                               };\r
+                                       };\r
+                                       ref = Application.register( Page.appClass, false, true, document.title, 'page', null, Page.appClass.tailColor || '#999999' );\r
+                                       if( Type.isFunction( gOS.PageApplicationClass ) === true ){\r
+                                               gOS.PageApplicationRef = ref;\r
+                                       }; \r
+                               };\r
+                               delete Page.onReady;\r
+                       },\r
+                       show: function(){\r
+                               for( var i = pageNodes.length; i; ){\r
+                                       pageNodes[ --i ].show();\r
+                               };\r
+                       },\r
+                       hide: function(){\r
+                               for( var i = pageNodes.length; i; ){\r
+                                       pageNodes[ --i ].hide();\r
+                               };                              \r
+                       },\r
+                       boot: function(){\r
+                               ref && ref.boot();\r
+                       },\r
+                       registered: function(){\r
+                               return !!ref;\r
+                       },\r
+                       appClass: null\r
+               }\r
+       })();\r
+\r
+/* --------------------------------------------------------------\r
+ * Event\r
+ * \r
+ *  screenX\r
+ *  スクリーン座標は、コンピュータのディスプレイの左上を原点とする座標系である。screenX, screenY属性で取得できる。Javascritpでは、同名のプロパティとして実装されている。\r
+ *  しかし、これは、現実的には、何の役に立たない。ブラウザ自体がディスプレイのどの位置にいるのかがわからないので、画面上の位置を知ったところで、何にもならないからだ。 \r
+ * \r
+ *  clientX\r
+ *  ウインドウ座標とは、現在のブラウザのウインドウの、ドキュメントを表示している部分の左上原点とした座標である。\r
+ *  問題は、ウインドウは、必ずしもドキュメント全体を表示するとは限らない。スクロールと呼ばれるUIによって、ドキュメントの一部だけを表示しているかもしれない。\r
+ * \r
+ * var f = eval('function(){var a=arguments,f=a.callee;f.a=a;f.c(f)}');\r
+ */\r
+       var XBrowserEvent = ( function(){\r
+               var wrappedHandlerClass,\r
+                       wrappedEventClass,\r
+                       tmp;\r
+               \r
+               if( window.addEventListener ){\r
+                       wrappedHandlerClass = function( ticket ){\r
+                               this.handler = function( e ){\r
+                                       if( ticket.fire( e ) !== false ) return;\r
+                                       e.preventDefault();\r
+                                       e.stopPropagation();\r
+                                       return false;\r
+                               };\r
+                               this.destroy = function(){\r
+                                       ticket = null;\r
+                                       delete this.handler;\r
+                                       delete this.destroy;\r
+                               };\r
+                       };\r
+               } else {\r
+                       wrappedEventClass = function( e, element ){\r
+                               this._event        = e;\r
+                               this.type          = e.type;\r
+                               this.target        = e.srcElement;\r
+                               this.currentTarget = element;\r
+                               this.relatedTarget = e.formElement ? e.formElement : e.toElement;\r
+                               this.eventPhase    = e.srcElement === element ? 2: 3;\r
+                               \r
+                               this.clientX       = e.clientX;\r
+                               this.clientY       = e.clientY;\r
+                               this.screenX       = e.screenX;\r
+                               this.screenY       = e.screenY;\r
+                               \r
+                               this.keyCode       = e.keyCode;\r
+                               this.altKey        = e.altKey;\r
+                               this.ctrlKey       = e.ctrlKey;\r
+                               this.shiftKey      = e.shiftKey;\r
+                               \r
+                               this.wheelDelta    = e.wheelDelta;\r
+                       };\r
+                       wrappedEventClass.prototype.stopPropagation = function(){\r
+                               this._event.cancelBubble = true;\r
+                       };\r
+                       wrappedEventClass.prototype.preventDefault  = function(){\r
+                               this._event.returnValue = false;\r
+                       };\r
+\r
+                       if( document.attachEvent ){\r
+                               wrappedHandlerClass = function( ticket ){\r
+                                       this.handler = function(){\r
+                                               if( ticket === null ) alert( window.event.type )\r
+                                               if( ticket.fire( new wrappedEventClass( window.event, ticket.element ) ) !== false ) return;\r
+                                               // e.preventDefault();\r
+                                               // e.stopPropagation();\r
+                                               window.event.cancelBubble = true;\r
+                                               window.event.returnValue  = false;\r
+                                               return false;\r
+                                       };\r
+                                       this.destroy = function(){\r
+                                               ticket = null;\r
+                                               delete this.handler;\r
+                                               delete this.destroy;\r
+                                       };\r
+                               };\r
+                       } else {\r
+                               tmp = {\r
+                                       list: [],\r
+                                       find: function( _ticket ){\r
+                                               for( var i=0, l= tmp.list.length, _item; i<l; ++i ){\r
+                                                       _item = tmp.list[ i ];\r
+                                                       if( _item.element === _ticket.element && _item.eventType === _ticket.eventType ){\r
+                                                               return _item;\r
+                                                       };\r
+                                               };\r
+                                               return null;\r
+                                       }\r
+                               };\r
+                               tmp.TicketClass = function( _ticket ){\r
+                                       var self = this;\r
+                                       this.element   = _ticket.element;\r
+                                       this.eventType = _ticket.eventType;\r
+                                       this.tickets   = [ _ticket ];\r
+                                       this.onDestroy = function(){ self = null; };\r
+                                       \r
+                                       this.element[ 'on' + this.eventType ] = function( e ){ return self.fire( e );};\r
+                                       _ticket = null;\r
+                               };\r
+                               tmp.TicketClass.prototype = {\r
+                                       add: function( _ticket ){\r
+                                               Util.getIndex( this.tickets, ticket ) === -1 && this.tickets.push( _ticket );\r
+                                       },\r
+                                       remove: function( _ticket ){\r
+                                               var i = Util.getIndex( this.tickets, _ticket );\r
+                                               i !== -1 && this.tickets.splice( i, 1 );\r
+                                               this.tickets.length === 0 && this.destroy();\r
+                                       },\r
+                                       fire: function( e ){\r
+                                               e = e || new wrappedEventClass( window.event, this.element );\r
+                                               var i = this.tickets.length,\r
+                                                       cancel;\r
+                                               for( ; i; ){\r
+                                                       if( this.tickets[ --i ].fire( e ) === false ) cancel = false;\r
+                                               };\r
+                                               return cancel;\r
+                                       },\r
+                                       destroy: function(){\r
+                                               this.onDestroy();\r
+                                               this.element[ 'on' + this.eventType ] = '';\r
+                                               tmp.list.splice( Util.getIndex( tmp.list, this ), 1 );\r
+                                               delete this.element;\r
+                                               delete this.eventType;\r
+                                               delete this.tickets;\r
+                                               delete this.onDestroy;\r
+                                       }\r
+                               };\r
+                       };\r
+               };\r
+\r
+               return {\r
+                       add: function( _ticket ){\r
+                               if( document.addEventListener ){\r
+                                       XBrowserEvent.add = function( _ticket ){\r
+                                               _ticket.wrappedHandler = new wrappedHandlerClass( _ticket );\r
+                                               _ticket.element.addEventListener( _ticket.eventType, _ticket.wrappedHandler.handler, false );\r
+                                       };\r
+                               } else\r
+                               if( document.attachEvent ){\r
+                                       XBrowserEvent.add = function( _ticket ){\r
+                                               _ticket.wrappedHandler = new wrappedHandlerClass( _ticket );\r
+                                               _ticket.element.attachEvent( 'on' + _ticket.eventType, _ticket.wrappedHandler.handler );\r
+                                       };\r
+                               } else {\r
+                                       XBrowserEvent.add = function( _ticket ){\r
+                                               var t = tmp.find( _ticket );\r
+                                               if( t !== null ){\r
+                                                       t.add( _ticket );\r
+                                               } else {\r
+                                                       tmp.list.push( new tmp.TicketClass( _ticket ) );\r
+                                               };\r
+                                       };\r
+                               };\r
+                               \r
+                               XBrowserEvent.add( _ticket );\r
+                       },\r
+                       remove: function( _ticket ){\r
+                               if( document.removeEventListener ){\r
+                                       XBrowserEvent.remove = function( _ticket ){\r
+                                               _ticket.element.removeEventListener( _ticket.eventType, _ticket.wrappedHandler.handler, false );\r
+                                               _ticket.wrappedHandler.destroy();\r
+                                       };\r
+                               } else\r
+                               if( document.detachEvent ){\r
+                                       XBrowserEvent.remove = function( _ticket ){\r
+                                               _ticket.element.detachEvent( 'on' + _ticket.eventType, _ticket.wrappedHandler.handler );\r
+                                               _ticket.wrappedHandler.destroy();\r
+                                       };\r
+                               } else {\r
+                                       XBrowserEvent.remove = function( _ticket ){\r
+                                               var t = tmp.find( _ticket );\r
+                                               if( t !== null ){\r
+                                                       t.remove( _ticket );\r
+                                               };\r
+                                       };\r
+                               };\r
+                               \r
+                               XBrowserEvent.remove( _ticket );\r
+                       }\r
+               }\r
+       })();\r
+\r
+/*\r
+ * EventTicketClass\r
+ */\r
+       var EventTicketClass = function( _element, _eventType, _handler, opt_thisObject ){\r
+               this.element        = _element;\r
+               this.eventType      = _eventType;\r
+               this.handler        = _handler;\r
+               this.wrappedHandler = null;\r
+               this.thisObject     = opt_thisObject;\r
+               XBrowserEvent.add( this );\r
+       };\r
+       EventTicketClass.prototype = {\r
+               fire : ( function(){\r
+                       if( Function.prototype.call ){\r
+                               return function( e ){\r
+                                       return this.handler.call( this.thisObject || this.element, e );\r
+                               };                              \r
+                       };\r
+                       return function( e ){\r
+                               var thisObj = this.thisObject || this.element,\r
+                                       ret;\r
+                               thisObj._currentHandler = this.handler;\r
+                               ret = thisObj._currentHandler( e );\r
+                               delete thisObj._currentHandler;\r
+                               return ret;                                     \r
+                       };\r
+               })(),\r
+               match: function( _element, _eventType, _handler ){\r
+                       if( _handler   && _handler   !== this.handler )   return false;\r
+                       if( _eventType && _eventType !== this.eventType ) return false;\r
+                       if( _element   && _element   !== this.element )   return false;\r
+                       \r
+                       return true;\r
+               },\r
+               destroy: function( _element, _eventType, _handler ){\r
+                       if( this.match( _element, _eventType, _handler ) === false ) return false;\r
+                       \r
+                       XBrowserEvent.remove( this );\r
+                       \r
+                       delete this.element;\r
+                       delete this.eventType;\r
+                       delete this.handler;\r
+                       delete this.wrappedHandler;\r
+                       delete this.thisObject;\r
+                       return true;\r
+               }\r
+       };\r
+\r
+var ReadyEvent = ( function(){\r
+       var ticketReady,\r
+               ticketLoad,\r
+        timer;\r
+\r
+       function webkitDetect(){\r
+               var state = document.readyState;\r
+               if( state === 'loaded' || state === 'complete' ){\r
+                       SystemTimer.remove( SUPER_USER_KEY, webkitDetect );\r
+                       timer = null;\r
+                       onReady();\r
+               };\r
+       };\r
+       function ieDetect(){\r
+               if( this.readyState === 'complete' ){ // this.readyState === 'loaded' || \r
+                       this.onreadystatechange = new Function();\r
+                       this.onreadystatechange = null;\r
+                       AsyncCall.remove( SUPER_USER_KEY, ieScroll );\r
+                       onReady();\r
+               };\r
+       };\r
+       function ieScroll(){\r
+               try {\r
+                       document.documentElement.doScroll( 'left' );\r
+               } catch( e ){\r
+                       AsyncCall.add( SUPER_USER_KEY, ieScroll );\r
+                       return;\r
+               };\r
+               // no errors, fire\r
+               document.onreadystatechange = new Function();\r
+               document.onreadystatechange = null;\r
+               onReady();              \r
+       };\r
+               \r
+       function onReady(){\r
+               ticketReady && ticketReady.destroy();\r
+               ticketLoad  && ticketLoad.destroy();\r
+               ticketReady = ticketLoad = null;\r
+               Page.onReady();\r
+               if( Page.registered() === true ){\r
+                       Page.boot();\r
+               } else {\r
+                       Home.boot();\r
+               };\r
+       };\r
+       \r
+       // Apple WebKit (Safari, OmniWeb, ...)\r
+       if( document.readyState && !!UA.WEBKIT ){\r
+               SystemTimer.add( SUPER_USER_KEY, webkitDetect, 50 );\r
+       /* } else\r
+               if( document.readyState && UA.isIE && UA.ieVersion < 9 ){\r
+               ieScroll();\r
+               document.onreadystatechange = ieDetect; */\r
+       } else {\r
+               ticketReady = new EventTicketClass( document, 'DOMContentLoaded', onReady );\r
+               ticketLoad  = new EventTicketClass( window, 'load', onReady );\r
+       };\r
+})();\r
+\r
+\r
+\r
+\r
+/* =====================================================\r
+ *  ResizeEvent\r
+ * \r
+ */\r
+\r
+var ResizeEvent = ( function(){\r
+       var _globalLock = 0;\r
+       var _resize;\r
+       var root = window;\r
+       var w = 0, h = 0;\r
+       \r
+       function getInnerSize(){\r
+               return {\r
+                       w : root.innerWidth || root.clientWidth,\r
+                       h : root.innerHeight || root.clientHeight\r
+               };\r
+       }\r
+       function unlock(){\r
+               _globalLock = 0;\r
+       }\r
+       \r
+       if( document.uniqueID ){\r
+               _resize = function(){\r
+                       root = (document.compatMode || "") !== "CSS1Compat" ? document.body : document.documentElement;\r
+\r
+                       // resize agent\r
+                       function loop(){\r
+                               if( !_globalLock++ ){\r
+                                       var size = getInnerSize();\r
+                                       if( w !== size.w || h !== size.h ){// resized\r
+                                               w = size.w;\r
+                                               h = size.h;\r
+                                               // update\r
+                                               Application.onWindowResize( w, h );\r
+                                       }\r
+                                       window.setTimeout( unlock, 0 );\r
+                                       // delay unlock\r
+                               }\r
+                               window.setTimeout( loop, 100 );\r
+                       }\r
+                       loop();\r
+               };\r
+       } else {\r
+               _resize = function(){\r
+                       new EventTicketClass( window, 'resize', onResize );\r
+                       \r
+                       function onResize(){\r
+                               if( !_globalLock++ ) {\r
+                                       var size = getInnerSize();\r
+                                       if( w !== size.w || h !== size.h ){// resized\r
+                                               w = size.w;\r
+                                               h = size.h;\r
+                                               // update\r
+                                               Application.onWindowResize( w, h );\r
+                                       }\r
+                                       window.setTimeout( unlock, 0 );\r
+                               }\r
+                       }\r
+                       onResize();\r
+               };\r
+       }\r
+       AsyncCall.add( SUPER_USER_KEY, _resize );\r
+       \r
+       return {\r
+               getSize: getInnerSize,\r
+               onSystemShutdown: function(){\r
+                       \r
+               }\r
+       }\r
+})();\r
+\r
+\r
+/* =====================================================\r
+ *  MouseEvent\r
+ * \r
+ */\r
+       var MouseEvent = ( function(){\r
+               var CLICK_OFFSET   = 2 * 2,\r
+                       DRAG_OFFSET    = 4 * 4;         \r
+               \r
+               var EVENT_LIST_MAP = [],\r
+                       TMP = {},\r
+                       currentEventList;\r
+       /*-------------------------------------\r
+        * ClickHelper\r
+        * mousedown, mouseup, の移動距離を調べて clickハンドラ を呼ぶ\r
+        */\r
+               var ClickEventTicketClass = function( element, clickhandler, opt_thisObject ){\r
+                       this.mousedownTicket = new EventTicketClass( element, 'mousedown', this.mousedownHandler, this );\r
+                       this.element         = element;\r
+                       this.handler         = clickhandler;\r
+                       this.thisObject      = opt_thisObject;\r
+               };\r
+               ClickEventTicketClass.prototype = {\r
+                       element          : null,\r
+                       handler          : null,\r
+                       thisObject       : null,\r
+                       startX           : 0,\r
+                       startY           : 0,\r
+                       mousedownTicket  : null,\r
+                       mousemoveTicket  : null,\r
+                       mouseupTicket    : null,\r
+                       mouseoutTicket   : null,\r
+                       eventType        : 'click',\r
+                       fire             : EventTicketClass.prototype.fire,\r
+                       match            : EventTicketClass.prototype.match,\r
+                       mousedownHandler : function( e ){\r
+                               this.startX = e.clientX;\r
+                               this.startY = e.clientY;\r
+                               \r
+                               this.mousemoveTicket = new EventTicketClass( this.element, 'mousemove', this.mousemoveHandler, this );\r
+                               this.mouseupTicket   = new EventTicketClass( this.element, 'mouseup',   this.mouseupHandler,   this );\r
+                               this.mouseoutTicket  = new EventTicketClass( this.element, 'mouseout',  this.mouseoutHandler,  this );\r
+                               return false;                   \r
+                       },\r
+                       mousemoveHandler : function( e ){\r
+                               var offsetX = e.clientX - this.startX,\r
+                                       offsetY = e.clientY - this.startY;                              \r
+                               offsetX * offsetX + offsetY * offsetY >= CLICK_OFFSET && this.mouseoutHandler();\r
+                               return false;\r
+                       },\r
+                       mouseupHandler : function( e ){\r
+                               this.mouseoutHandler();\r
+                               return this.fire( ClickEventTicketClass.createEvent( e ) );\r
+                       },\r
+                       mouseoutHandler : function( e ){\r
+                               this.mousemoveTicket && this.mousemoveTicket.destroy();\r
+                               this.mouseupTicket   && this.mouseupTicket.destroy();\r
+                               this.mouseoutTicket  && this.mouseoutTicket.destroy();\r
+                               if( this.mousemoveTicket ) delete this.mousemoveTicket;\r
+                               if( this.mouseupTicket  )  delete this.mouseupTicket;\r
+                               if( this.mouseoutTicket )  delete this.mouseoutTicket;\r
+                               return false;\r
+                       },\r
+                       destroy : function( _element, _eventType, _handler ){\r
+                               if( this.match( _element, _eventType, _handler ) === false ) return false;\r
+                               \r
+                               this.mouseoutHandler();\r
+                               this.mousedownTicket.destroy();\r
+\r
+                               delete this.element;\r
+                               delete this.handler;\r
+                               delete this.thisObject;\r
+                               delete this.mousedownTicket;    \r
+                               return true;\r
+                       }\r
+               };\r
+               if( document.createEvent ){\r
+                       ClickEventTicketClass.createEvent = function( e ){\r
+                               var _e = document.createEvent( 'MouseEvents' );\r
+                               _e.initMouseEvent(\r
+                                       'click' , false, true, e.view, \r
+                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, \r
+                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, \r
+                                       e.button, e.relatedTarget\r
+                               );\r
+                               return _e;\r
+                       };                                      \r
+               } else\r
+               if( document.attachEvent ){\r
+                       ClickEventTicketClass.createEvent = function( e ){\r
+                               e.type = 'click';\r
+                               return e;\r
+                       };\r
+               } else {\r
+                       \r
+               };\r
+               \r
+       /*-------------------------------------\r
+        *  WheelHelper\r
+        */\r
+               var WheelEventTicketClass = ( function(){\r
+                       if( UA.GECKO ){\r
+                               return function( element, wheelhandler, opt_thisObject ){\r
+                                       this.wheelTicket = new EventTicketClass( element, 'DOMMouseScroll', this.onGeckoWheel, this );\r
+                                       this.element     = element;\r
+                                       this.handler     = wheelhandler;\r
+                                       this.thisObject  = opt_thisObject;\r
+                               };\r
+                       } else\r
+                       if( true || UA.isIE ){\r
+                               return function( element, wheelhandler, opt_thisObject ){\r
+                                       this.wheelTicket = new EventTicketClass( element, this.eventType, wheelhandler );\r
+                                       this.element     = element;\r
+                                       this.handler     = wheelhandler;\r
+                                       this.thisObject  = opt_thisObject;\r
+                               };\r
+                       } else {\r
+                               TMP.wheelHandlerList = [];\r
+                               TMP.wheelThisObjList = [];\r
+                               //TMP.wheelLegacy = undefined;\r
+                               TMP.onWheel   = function( e ){\r
+                                       e = e || window.event;\r
+                                       var cancel = true,\r
+                                               f = TMP.wheelLegacy, i;\r
+                                       if( f ) cancel = f.call( this, e );\r
+                                       \r
+                                       for( i = TMP.wheelHandlerList.length; i; ){\r
+                                               if( TMP.wheelHandlerList[ --i ].call( TMP.wheelThisObjList[ i ] || this, e ) === false ) cancel = false;\r
+                                       };\r
+                                       return cancel;\r
+                               };\r
+                               return function( element, wheelhandler, opt_thisObject ){\r
+                                       this.element     = element;\r
+                                       this.handler     = wheelhandler;\r
+                                       this.thisObject  = opt_thisObject;\r
+                                       \r
+                                       if( TMP.wheelHandlerList.length === 0 ){\r
+                                               //TMP.wheelLegacy     = Type.isFunction( window.onmousewheel ) === true ? window.onmousewheel : undefined;\r
+                                               element.onmousewheel = TMP.onWheel;\r
+                                       };\r
+                                       TMP.wheelHandlerList.push( wheelhandler );\r
+                                       TMP.wheelThisObjList.push( opt_thisObject )\r
+                               };\r
+                       };\r
+               })();\r
+               WheelEventTicketClass.prototype = {\r
+                       eventType : 'mousewheel',\r
+                       match     : EventTicketClass.prototype.match,\r
+                       destroy   : function( _element, _eventType, _handler ){\r
+                               if( this.match( _element, _eventType, _handler ) === false ) return false;\r
+                               \r
+                               this.wheelTicket && this.wheelTicket.destroy();\r
+                               \r
+                               delete this.wheelTicket;\r
+                               delete this.element;\r
+                               delete this.handler;\r
+                               delete this.thisObject;\r
+                               \r
+                               this.onDestroy && this.onDestroy();\r
+                               return true;\r
+                       }\r
+               };\r
+               if( UA.GECKO ){\r
+                       WheelEventTicketClass.prototype.onGeckoWheel = function( e ){\r
+                               var _e = document.createEvent( 'MouseEvents' );\r
+                               _e.initMouseEvent(\r
+                                       'mousewheel' , false, true, e.view, \r
+                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, \r
+                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, \r
+                                       e.button, e.relatedTarget\r
+                               );\r
+                               _e.wheelDelta = e.detail * -40;\r
+                               return this.handler.call( this.thisObject || this.element, _e );\r
+                       };\r
+               } else\r
+               if( true || UA.isIE ){\r
+\r
+               } else {\r
+                       WheelEventTicketClass.prototype.onDestroy = function(){\r
+                               TMP.wheelHandlerList.splice( Util.getIndex( TMP.wheelHandlerList, this.handler ), 1 );\r
+                               TMP.wheelThisObjList.splice( Util.getIndex( TMP.wheelThisObjList, this.handler ), 1 );\r
+                               if( TMP.wheelHandlerList.length === 0 ) this.element.onmousewheel = '';\r
+                       };                      \r
+               };\r
+               \r
+       /*-------------------------------------\r
+        *  DragHelper\r
+        */\r
+               var DragEventTicketClass = function( element, draghandler, opt_thisObject ){\r
+                       this.mousedownTicket = new EventTicketClass( element, 'mousedown', this.mousedownHandler, this );\r
+                       this.element         = element;\r
+                       this.handler         = draghandler;\r
+                       this.thisObject      = opt_thisObject;\r
+               };\r
+               DragEventTicketClass.prototype = {\r
+                       element         : null,\r
+                       handler         : null,\r
+                       thisObject      : null,\r
+                       startX          : 0,\r
+                       startY          : 0,\r
+                       dragging        : false,\r
+                       mousedownTicket : null,\r
+                       mousemoveTicket : null,\r
+                       mouseupTicket   : null,\r
+                       mouseoutTicket  : null,\r
+                       eventType       : 'mousedrag',\r
+                       fire            : EventTicketClass.prototype.fire,\r
+                       match           : EventTicketClass.prototype.match,\r
+                       mousedownHandler: function( e ){\r
+                               this.startX = e.clientX;\r
+                               this.startY = e.clientY;\r
+                               \r
+                               this.mousemoveTicket = new EventTicketClass( this.element, 'mousemove', this.dragMoveHandler, this );\r
+                               this.mouseupTicket   = new EventTicketClass( this.element, 'mouseup',   this.dragEndHandler,  this );\r
+                               this.mouseoutTicket  = new EventTicketClass( this.element, 'mouseout',  this.dragEndHandler,  this );                                   \r
+                       \r
+                               return false;\r
+                       },\r
+                       dragMoveHandler : function( e ){\r
+                               var offsetX = e.clientX - this.startX,\r
+                                       offsetY = e.clientY - this.startY;\r
+                               if( this.dragging === false ){\r
+                                       if( offsetX * offsetX + offsetY * offsetY < DRAG_OFFSET ) return;\r
+                                       console.log( 'Drag start' );\r
+                                       // dragStart\r
+                                       this.dragging = true;\r
+                                       return this.fire( DragEventTicketClass.createEvent( e, offsetX, offsetY, 0 ) );\r
+                               };\r
+                               return this.fire( DragEventTicketClass.createEvent( e, offsetX, offsetY, 1 ) );\r
+                       },\r
+                       dragEndHandler  : function( e ){\r
+                               if( this.dragging === true ){\r
+                                       console.log( 'Drag End ' + e.type );\r
+                                       this.removeEvents();\r
+                                       // dragEnd\r
+                                       return this.fire( DragEventTicketClass.createEvent( e, e.clientX - this.startX, e.clientY - this.startY, 2 ) );\r
+                               };\r
+                               this.removeEvents();\r
+                               return false;\r
+                       },\r
+                       removeEvents : function(){\r
+                               this.dragging = false;\r
+                               if( this.mousemoveTicket ){\r
+                                       this.mousemoveTicket.destroy();\r
+                                       delete this.mousemoveTicket;\r
+                               };\r
+                               if( this.mouseupTicket ){\r
+                                       this.mouseupTicket.destroy();\r
+                                       delete this.mouseupTicket;\r
+                               };\r
+                               if( this.mouseoutTicke ){\r
+                                       this.mouseoutTicket.destroy();\r
+                                       delete this.mouseoutTicket;\r
+                               };                              \r
+                       },\r
+                       destroy : function( _element, _eventType, _handler ){\r
+                               if( this.match( _element, _eventType, _handler ) === false ) return false;\r
+                               \r
+                               this.removeEvents();\r
+                               this.mousedownTicket.destroy();\r
+\r
+                               delete this.element;\r
+                               delete this.handler;\r
+                               delete this.thisObject;\r
+                               delete this.mousedownTicket;    \r
+                               return true;\r
+                       }\r
+               };\r
+               if( document.createEvent ){\r
+                       DragEventTicketClass.createEvent = function( e, offsetX, offsetY, dragPhase ){\r
+                               var _e = document.createEvent( 'MouseEvents' );\r
+                               _e.initMouseEvent(\r
+                                       DragEventTicketClass.prototype.eventType , false, true, e.view, \r
+                                       e.detail, e.screenX, e.screenY, e.clientX, e.clientY, \r
+                                       e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, \r
+                                       e.button, e.relatedTarget\r
+                               );\r
+                               _e.dragPhase   = dragPhase;\r
+                               _e.dragOffsetX = offsetX;\r
+                               _e.dragOffsetY = offsetY;\r
+                               return _e;\r
+                       };                                      \r
+               } else\r
+               if( document.attachEvent ){\r
+                       DragEventTicketClass.createEvent = function( e, offsetX, offsetY, dragPhase ){\r
+                               e.type        = DragEventTicketClass.prototype.eventType;\r
+                               e.dragPhase   = dragPhase;\r
+                               e.dragOffsetX = offsetX;\r
+                               e.dragOffsetY = offsetY;\r
+                               return e;\r
+                       };\r
+               } else {\r
+                       \r
+               };\r
+\r
+               return {\r
+                       add: function( _apiuser, _element, _eventType, _handler, opt_thisObject ){\r
+                               if( isApiUser( _apiuser ) === true &&\r
+                                       ( Type.isHTMLElement( _element ) === true || _element === window || _element === document ) &&\r
+                                       Type.isString( _eventType ) === true &&\r
+                                       Type.isFunction( _handler ) === true\r
+                               ){\r
+                                       var _uid    = _apiuser.getUID(),\r
+                                               _events = EVENT_LIST_MAP[ _uid ];\r
+                                       if( Type.isArray( _events ) === false ){\r
+                                               _events = EVENT_LIST_MAP[ _uid ] = [];\r
+                                       } else {\r
+                                               // 2重登録の禁止\r
+                                               for( var i=0, l=_events.length; i<l; ++i ){\r
+                                                       if( _events[ i ].match( _element, _eventType, _handler ) === true ) return;\r
+                                               };\r
+                                       };\r
+                                       switch( _eventType ){\r
+                                               case 'click':\r
+                                                       _events.push( new ClickEventTicketClass( _element, _handler, opt_thisObject ) );\r
+                                                       break;\r
+                                               case 'mousewheel':\r
+                                                       _events.push( new WheelEventTicketClass( _element, _handler, opt_thisObject ) );\r
+                                                       break;\r
+                                               case 'mousedrag':\r
+                                                       _events.push( new DragEventTicketClass( _element, _handler, opt_thisObject ) );\r
+                                                       break;\r
+                                               default:\r
+                                                       _events.push( new EventTicketClass( _element, _eventType, _handler, opt_thisObject ) );\r
+                                       };\r
+                               };\r
+                       },\r
+                       remove: function( apiuser, element, eventType, handler ){\r
+                               if( isApiUser( apiuser ) === true ){\r
+                                       var uid  = apiuser.getUID(),\r
+                                               list = EVENT_LIST_MAP[ uid ],\r
+                                               i    = 0;\r
+                                       if( Type.isArray( list ) === false ) return;\r
+                                       for( ;i < list.length; ){\r
+                                               if( list[ i ].destroy( element, eventType, handler ) === true ){\r
+                                                       list.splice( i, 1 );\r
+                                               } else {\r
+                                                       ++i;\r
+                                               };\r
+                                       };\r
+                                       if( list.length === 0 ){\r
+                                               EVENT_LIST_MAP[ uid ] = null;\r
+                                       };\r
+                               };\r
+                       },\r
+                       onCurrentApplicationChange: function(){\r
+                               \r
+                       },\r
+                       onApplicationShutdown: function(){\r
+                               \r
+                       },\r
+                       onSystemShutdown: function(){\r
+                               \r
+                       }\r
+               }\r
+       })();\r
+\r
+/* ----------------------------------------\r
+ * KEY\r
+ * \r
+ *  - EDITABLE_TEXT_CONTROL\r
+ * \r
+ *    .SHIFT_DOWN_EVENT:       'shiftDown',\r
+ *    .SHIFT_UP_EVENT:         'shiftUp',\r
+ *    .CTRL_DOWN_EVENT:                'ctrlDown',\r
+ *    .CTRL_UP_EVENT:          'ctrlUp',\r
+ *    .SPACE_DOWN_EVENT:       'spaceDown',\r
+ *    .SPACE_UP_EVENT:         'spaceUp',\r
+ *    .init:                           function,\r
+ *    .addKeyDownEvent:                function,\r
+ *    .keyEventDispatcher:     function,\r
+ * \r
+ * ショートカットキーの監視とテキスト入力(input, textarea)、チェックボックスを管理する。\r
+ * キー入力はdocumentで受けて、テキスト編集中(input, textarea)はそちらにキーイベント流す。\r
+ * \r
+ */\r
+var KeyEvent = ( function(){\r
+       var EVENT_LIST_MAP = [],\r
+               LOCK_UP        = [],\r
+               LOCK_DOWN      = [],\r
+               application    = null,\r
+               currentList    = null;\r
+\r
+       window.focus();\r
+       \r
+       var focusTicket    = null,\r
+               keydownTicket  = null,\r
+               keyupTicket    = null,\r
+               keyPress       = null,\r
+               keypressTicket = null;\r
+       \r
+       function unlock( lock, key ){\r
+               lock.splice( Util.getIndex( lock, key ), 1 );\r
+       };\r
+       \r
+       function onKeyChange( e ){\r
+               var cancel         = false,\r
+                       type           = e.type,\r
+                       key            = e.keyCode, // || e.which,\r
+                       shift          = Type.isBoolean( e.shiftKey ) === true ? e.shiftKey : ( e.modifiers & Event.SHIFT_MASK ),\r
+                       ctrl           = Type.isBoolean( e.ctrlKey  ) === true ? e.ctrlKey  : ( e.modifiers & Event.CONTROL_MASK ),\r
+                       lock           = type === 'keyup' ? LOCK_UP : LOCK_DOWN,\r
+                       i, t;\r
+                       \r
+               // block chattering\r
+               if( Util.getIndex( lock, key ) !== -1 ) return;\r
+               lock.push( key );\r
+               AsyncCall.add( SUPER_USER_KEY, unlock, [ lock, key ] );\r
+               \r
+               if( key === 16 || shift === true ){\r
+                       KeyEvent.shiftEnabled = type !== 'keyup';\r
+               };\r
+               if( key === 17 || ctrl === true ){\r
+                       KeyEvent.ctrlEnabled  = type !== 'keyup';\r
+               };\r
+               for( i = currentList.length; i; ){\r
+                       t = currentList[ --i ];\r
+                       if( Type.isFunction( t[ type ] ) === true && t.keyCode === key && ( t.shift === undefined || t.shift === shift ) && ( t.ctrl === undefined || t.ctrl === ctrl )){\r
+                               if( t[ type ].call( t.apiuser, e ) === false ){\r
+                                       cancel = true;\r
+                                       break;\r
+                               };\r
+                       };\r
+               };\r
+               if( cancel === true || key === 18 || key === 9 || key === 27 || e.altKey === true ){ // 13.enter 18.esc 9.tab 27.esc   || ( key === 13 && overlayEnabled === false)\r
+                       return false;\r
+               };\r
+       };\r
+       \r
+       if( UA.isIE === true && UA.ieRenderingVersion < 9 ){\r
+               keyPress = function( e ){\r
+                       var key = e.keyCode;\r
+                       if( key === 13 || key === 27 ){\r
+                               e.type = 'keydown';\r
+                               return onKeyChange( e );\r
+                       };\r
+               };\r
+       };\r
+       \r
+       var KeyEventTicketClass = function( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ){\r
+               this.apiuser = _apiuser;\r
+               this.type    = _type;\r
+               this.keydown = _onKeydown;\r
+               this.keyup   = _onKeyup;                \r
+               this.keyCode = _keyCode;\r
+               this.shift   = _shift;\r
+               this.ctrl    = _ctrl;\r
+               _apiuser = _onKeydown = _onKeyup = null;\r
+       }\r
+       KeyEventTicketClass.prototype = {\r
+               match: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){\r
+                       if( _apiuser  && _apiuser  !== this.apiuser ) return false;\r
+                       if( _type     && _type     !== this.type )    return false;\r
+                       if( _handler ){\r
+                               if( this.type === 'keydown' ){\r
+                                       if( _handler !== this.keydown ) return false;\r
+                               } else {\r
+                                       if( _handler !== this.keyup )   return false;\r
+                               };\r
+                       };\r
+                       if( _keyCode  && _keyCode  !== this.keyCode ) return false;\r
+                       if( _shift    && _shift    !== this.shift )   return false;\r
+                       if( _ctrl     && _ctrl     !== this.ctrl )    return false;\r
+                       return true;\r
+               },\r
+               destroy: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){\r
+                       if( this.match( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ) === false ) return false;\r
+                       \r
+                       delete this.apiuser;\r
+                       delete this.keydown;\r
+                       delete this.keyup;\r
+                       \r
+                       return true;\r
+               }\r
+       };\r
+       \r
+       function registerEvent( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ){\r
+               var _uid  = _apiuser.getUID(),\r
+                       _list = EVENT_LIST_MAP[ _uid ];\r
+               if( Type.isArray( _list ) === false ){\r
+                       _list = EVENT_LIST_MAP[ _uid ] = [];\r
+               }\r
+               for( var i=0, l=_list.length; i<l; ++i ){\r
+                       if( _list[ i ].match( _apiuser, _type, _onKeydown || _onKeyup, _keyCode, _shift, _ctrl ) === true ) return;\r
+               }\r
+               _list.push( new KeyEventTicketClass( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ));\r
+               \r
+               if( _apiuser === application ) KeyEvent.updateCurrentListener( _apiuser );\r
+       };\r
+       \r
+       return {\r
+               add: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){\r
+                       if( _type === 'keydown' ){\r
+                               registerEvent( _apiuser, _type, _handler, null, _keyCode, _shift, _ctrl );\r
+                       } else\r
+                       if( _type === 'keyup' ){\r
+                               registerEvent( _apiuser, _type, null, _handler, _keyCode, _shift, _ctrl );\r
+                       } else\r
+                       if( _type === 'keychange' ){\r
+                               registerEvent( _apiuser, _type, _handler, _handler, _keyCode, _shift, _ctrl );\r
+                       } else\r
+                       if( _type === 'cursol' ){\r
+                               \r
+                       };\r
+               },\r
+               remove: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){\r
+                       var _list = EVENT_LIST_MAP[ _apiuser.getUID() ],\r
+                               i = 0;\r
+                       if( Type.isArray( _list ) === true ){\r
+                               while( i < _list.length ){\r
+                                       if( _list[ i ].destroy( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ) === true ){\r
+                                               _list.splice( i, 1 );\r
+                                       } else {\r
+                                               ++i;\r
+                                       }\r
+                               }\r
+                       }\r
+                       if( _apiuser === application ) KeyEvent.updateCurrentListener( _apiuser );\r
+               },\r
+               shiftEnabled: false,\r
+               ctrlEnabled:  false,\r
+               /*\r
+                * currentListener\r
+                *  currrentApplication ( overlay Application ) or\r
+                *  superuser ( UI )\r
+                */\r
+               updateCurrentListener: function( _apiuser ){\r
+                       application = _apiuser;\r
+                       var _uid    = _apiuser.getUID();\r
+                       currentList = EVENT_LIST_MAP[ _uid ] || ( EVENT_LIST_MAP[ _uid ] = [] );\r
+                       \r
+                       var _ticket,\r
+                               _down = false,\r
+                               _up   = false;\r
+                       for( var i=currentList.length; _ticket = currentList[ --i ]; ){\r
+                               if( _down === false ) _down = !!_ticket.keydown;\r
+                               if( _up   === false ) _up   = !!_ticket.keyup;\r
+                               if( _down && _up ) break;\r
+                       }\r
+                       if( _down === true ){\r
+                               keydownTicket = new EventTicketClass( document, 'keydown', onKeyChange );\r
+                               keypressTicket = keyPress !== null ? new EventTicketClass( document, 'keypress', keyPress ) : null;\r
+                       } else {\r
+                               keydownTicket && keydownTicket.destroy();\r
+                               keypressTicket && keypressTicket.destroy();\r
+                               keydownTicket = keypressTicket = null;\r
+                       }\r
+                       if( _up === true ){\r
+                               keyupTicket   = new EventTicketClass( document, 'keyup', onKeyChange );\r
+                       } else {\r
+                               keyupTicket && keyupTicket.destroy();\r
+                               keyupTicket = null;\r
+                       }\r
+                       \r
+                       if( _down === true || _up === true ){\r
+                               focusTicket   = new EventTicketClass( document, 'mouseenter', window.focus );\r
+                       } else {\r
+                               focusTicket && focusTicket.destroy();\r
+                               focusTicket = null;\r
+                       }\r
+               },\r
+               onApplicationShutdown: function( _apiuser ){\r
+                       KeyEvent.remove( _apiuser );\r
+               },\r
+               onSystemShutdown: function(){\r
+                       \r
+               }\r
+       }\r
+})();\r
+\r
+/**\r
+ * \r
+ * http://thudjs.tumblr.com/post/637855087/stylesheet-onload-or-lack-thereof\r
+ */\r
+\r
+var StyleSheet = ( function(){\r
+       var head = document.getElementsByTagName( 'head' )[ 0 ];\r
+       \r
+       var TICKET_LIST = [];\r
+       var STATE_LIST  = 'loaded,complete,uninitialized'.split( ',' );\r
+       \r
+       var cssRules, sheet;\r
+       \r
+       var FetchCssTicketClass = function( _apiuser, _url, _elm, _onload, _onerror, opt_thisObject ){\r
+               this.apiusers = [ _apiuser ];\r
+               this.url      = _url;\r
+               this.elm      = _elm;\r
+               this.onload   = [ _onload ];\r
+               this.onerror  = [ _onerror ];\r
+               this.thisObj  = [ opt_thisObject ];\r
+               this.time     = 0;\r
+       };\r
+       FetchCssTicketClass.prototype = {\r
+               match: function( _apiuser, _url ){\r
+                       if( _apiuser  && Util.getIndex( this.apiusers, _apiuser ) === -1 ) return false;\r
+                       if( _url      && _url      !== this.url     ) return false;\r
+                       return true;\r
+               },\r
+               destroy: function( _apiuser, _url ){\r
+                       if( this.match( _apiuser, _url ) === false ) return false;\r
+                       \r
+                       var i = Util.getIndex( this.apiusers, _apiuser );\r
+                       \r
+                       this.apiusers.splice( i, 1 );\r
+                       this.onload.splice( i, 1 );\r
+                       this.onerror.splice( i, 1 );\r
+                       this.thisObj.splice( i, 1 );\r
+                       \r
+                       if( this.apiusers.length !== 0 ) return false;\r
+                       \r
+                       head.removeChild( this.elm );\r
+                       this.elm.onreadystatechange = new Function();\r
+                       this.elm.onload = null;\r
+                       \r
+                       delete this.apiusers;\r
+                       delete this.url;\r
+                       delete this.elm;\r
+                       delete this.onload;\r
+                       delete this.onerror;\r
+                       delete this.thisObj;\r
+                       delete this.time;\r
+                       \r
+                       return true;\r
+               },\r
+               loaded: function(){\r
+               for( var i = this.onload.length, f; i; ){\r
+                       f = this.onload[ --i ];\r
+                       Type.isFunction( f ) === true && AsyncCall.add( this.apiusers[ i ], f, this.url, this.thisObj[ i ] || this.apiusers[ i ] );\r
+                       this.onload[ i ] = this.onerror[ i ] = null;\r
+               };\r
+               },\r
+               error: function(){\r
+               for( var i = this.onerror.length, f; i; ){\r
+                       f = this.onerror[ --i ];\r
+                       Type.isFunction( f ) === true && AsyncCall.add( this.apiusers[ i ], f, this.url, this.thisObj[ i ] || this.apiusers[ i ] );\r
+                       this.onload[ i ] = this.onerror[ i ] = null;\r
+               };\r
+               },\r
+               check: function(){\r
+                       var el = this.elm;\r
+                       try {\r
+                               return el[ sheet ] && el[ sheet ][ cssRules ].length > 0;\r
+                       } catch( e ){\r
+                               return false;\r
+                       };\r
+               },\r
+               done: false\r
+       };\r
+       \r
+       function getTicket( elm ){\r
+               for( var i = TICKET_LIST.length, t; i; ){\r
+                       t = TICKET_LIST[ --i ];\r
+                       if( t.elm === elm ) return t;\r
+               };\r
+       };\r
+       \r
+       function detect(){\r
+               var t = getTicket( this ), rs = this.readyState, c;\r
+               if( t && t.done === false && ( !rs || Util.getIndex( STATE_LIST, rs ) !== -1 ) ){\r
+                       t.done = true;\r
+               t.loaded();\r
+               this.onreadystatechange = new Function();\r
+               this.onload = null;\r
+               };\r
+       };\r
+       \r
+       function checkTimer(){\r
+               var l = TICKET_LIST.length,\r
+                       n = 0, t;\r
+               for( var i = 0; i < l; ++i ){\r
+                       t = TICKET_LIST[ i ];\r
+                       ++t.time;\r
+                       if( t.check() === true ){\r
+                               t.loaded();\r
+                               ++n;\r
+                       } else\r
+                       if( t.time > 99 ){\r
+                               t.error();\r
+                       } else {\r
+                               \r
+                       };\r
+               };\r
+               l === n && SystemTimer.remove( SUPER_USER_KEY, checkTimer );\r
+       };\r
+       \r
+       return {\r
+               load: function( _apiuser, _url, opt_onload, opt_onerror, opt_thisObject ){\r
+                       _url = Util.getAbsolutePath( _url );\r
+                       var t;\r
+                       for( var i=TICKET_LIST.length; i; ){\r
+                               t = TICKET_LIST[ --i ];\r
+                               if( t.match( null, _url ) === true ){\r
+                                       if( t.match( _apiuser, _url ) === false ){\r
+                                               t.apiusers.push( _apiuser );\r
+                                               t.onload.push( opt_onload );\r
+                                               t.onerror.push( opt_onerror );\r
+                                               t.thisObj.push( opt_thisObject );\r
+                                       };\r
+                                       SystemTimer.add( SUPER_USER_KEY, checkTimer, 333 );\r
+                                       return;\r
+                               };\r
+                       };\r
+                       var elm = document.createElement( 'link' );\r
+                       head.appendChild( elm );\r
+                       elm.rel  = 'stylesheet';\r
+                       elm.type = 'text\/css';\r
+                       elm.onreadystatechange = elm.onload = detect;\r
+                       elm.href = _url;\r
+                       \r
+                       if( !sheet ){ // only assign these once\r
+                               cssRules = 'cssRules';\r
+                               sheet    = 'sheet';\r
+                               if ( !( sheet in elm ) ) { // MSIE uses non-standard property names\r
+                                       cssRules = 'rules';\r
+                                       sheet    = 'styleSheet';\r
+                               };\r
+                       };\r
+                       \r
+                       TICKET_LIST.push( new FetchCssTicketClass( _apiuser, _url, elm, opt_onload, opt_onerror, opt_thisObject ) );\r
+                       \r
+                       SystemTimer.add( SUPER_USER_KEY, checkTimer, 333 );\r
+               },\r
+               unload: function( _apiuser, _url ){\r
+                       _url = _url ? Util.getAbsolutePath( _url ) : null;\r
+            var t;\r
+                       for( var i = 0; i < TICKET_LIST.length; ){\r
+                               t = TICKET_LIST[ i ];\r
+                               if( t.destroy( _apiuser, _url ) === true ){\r
+                                       TICKET_LIST.splice( i, 1 );\r
+                               } else {\r
+                                       ++i;\r
+                               }\r
+                       };\r
+                       if( TICKET_LIST.length === 0 ){\r
+                               SystemTimer.remove( SUPER_USER_KEY, checkTimer );\r
+                       }\r
+               }\r
+       }\r
+})();\r
+\r
+/*\r
+ * AssetLoader\r
+ * fetchCSS\r
+ * fetchJson\r
+ * fetchHtml\r
+ * fetchImage\r
+ * fetchLocalFile\r
+ * fetchLocalStorage\r
+ */\r
+\r
+var Image = ( function(){\r
+       var TASK_LIST = [];\r
+       /* \r
+        * FetchClass original is\r
+        * \r
+        * LICENSE: MIT?\r
+        *  URL: http://d.hatena.ne.jp/uupaa/20080413/1208067631\r
+        *  AUTHOR: uupaa.js@gmail.com\r
+        * \r
+        */\r
+       function detect(){\r
+               for( var i=0, t; i < TASK_LIST.length; ){\r
+                       t = TASK_LIST[ i ];\r
+                       if( t.complete() === true ){\r
+                               TASK_LIST.splice( i, 1 );\r
+                       } else {\r
+                               ++i;\r
+                       };\r
+               };\r
+               TASK_LIST.length === 0 && SystemTimer.remove( SUPER_USER_KEY, detect );\r
+       };\r
+       function getTask( img ){\r
+               for( var i = TASK_LIST.length; i; ){\r
+                       if( TASK_LIST[ --i ].img === img ) return TASK_LIST[ i ];\r
+               };\r
+       };\r
+       function onError(){\r
+               var task = getTask( this );\r
+               if( task.finish === true ) return;\r
+               task.finish = true;\r
+               AsyncCall.add( task.apiuser, task.asyncCallback, null, task );\r
+       };\r
+       function onLoad(){\r
+               // if( finish === true ) return; // これがあると firefox3.6 で駄目、、、\r
+               // if( timer ) return; // これがあると safari3.2 で駄目、、、\r
+               var task = getTask( this );\r
+               task.finish = true;\r
+               TASK_LIST.splice( Util.getIndex( TASK_LIST, task ), 1 );\r
+               if( window.opera && !task.img.complete ){\r
+                       AsyncCall.add( task.apiuser, task.asyncCallback, null, task );\r
+                       return;\r
+               };\r
+               task.size = Util.getImageSize( this );\r
+               AsyncCall.add( task.apiuser, task.asyncCallback, null, task );\r
+       };\r
+\r
+\r
+       var FetchClass = function( apiuser, abspath, onLoadCallback, onErrorCallback, timeout ){\r
+               this.apiuser         = apiuser;\r
+               this.abspath         = abspath;\r
+               this.onLoadCallback  = onLoadCallback;\r
+               this.onErrorCallback = onErrorCallback;\r
+               this.timeout         = timeout;\r
+               this.tick            = 0;\r
+       };\r
+       FetchClass.prototype = {\r
+               img: null,\r
+               size: null,\r
+               tick: 0,\r
+               finish: false,\r
+               load: function(){\r
+                       var img     = this.img = document.createElement( 'img' ); //var img = new Image(); ではieでimgのsizeが取れない、、、removeChildも失敗し、imgSizeGetterにimgが残る\r
+                       img.onabort = img.onerror = onError;\r
+                       img.onload  = onLoad;\r
+                       img.src     = this.abspath;\r
+               },\r
+               complete: function(){\r
+                       if( this.finish === true ) return true;\r
+                       if( this.img.complete ){\r
+                               this.finish = true;\r
+                               if( this.img.width ) return true;\r
+                               AsyncCall.add( this.apiuser, this.asyncCallback, null, this );\r
+                               return true;\r
+                       };\r
+                       if( ( this.tick += 250 ) > this.timeout ){\r
+                               this.finish = true;\r
+                               AsyncCall.add( this.apiuser, this.asyncCallback, null, this );\r
+                               return true;\r
+                       };\r
+               },\r
+               asyncCallback: function(){\r
+                       this.size ? this.onLoadCallback( this.abspath, this.size.width, this.size.height ) : this.onErrorCallback( this.abspath );\r
+                       this.destroy();\r
+               },\r
+               destroy: function(){\r
+                       this.finish  = true;\r
+                       this.img.src = this.img.onload = this.img.onabort = this.img.onerror = '';\r
+                       delete this.img;\r
+                       delete this.size;\r
+                       delete this.onLoadCallback;\r
+                       delete this.onErrorCallback;\r
+               },\r
+               stop: function(){\r
+                       timer !== null && window.clearTimeout( timer );\r
+                       destroy();\r
+               }\r
+       };\r
+       \r
+       return {\r
+               load: function( URLorELM, onLoad, onError, opt_timeout ){\r
+                       var src, fetch;\r
+                       if( Type.isString( URLorELM ) === true ){\r
+                               src = URLorELM;\r
+                       } else\r
+                       if( Type.isHTMLElement( URLorELM ) === true && URLorELM.tagName.toLowerCase() === 'img' ){\r
+                               src = URLorELM.src;\r
+                       } else {\r
+                               return;\r
+                       };\r
+                       \r
+                       fetch = new FetchClass(\r
+                               Util.getAbsolutePath( src ),\r
+                               onLoad, onError,\r
+                               Type.isFinite( opt_timeout ) === true ? opt_timeout : undefined\r
+                       );\r
+                       TASK_LIST.push( fetch );\r
+                       \r
+                       SystemTimer.add( SUPER_USER_KEY, detect, 250 );\r
+               },\r
+               unload: function(  ){\r
+                       \r
+               }\r
+       };\r
+})();\r
+\r
+\r
+/* ----------------------------------------\r
+ * \r
+ */\r
+\r
+var Overlay = ( function(){\r
+       var elmContainer, elmShadow, elmCloseButton,\r
+               bootParams,\r
+               application    = null,\r
+               visible        = false,\r
+               bodyOverflow   = '',\r
+               windowW, windowH;\r
+\r
+       function onCloseClick( e ){\r
+               Overlay.hide();\r
+               return false;\r
+       };\r
+       function asyncInit( /* arguments */ ){\r
+               application.init();\r
+               //application.rootElement.style.display = 'none';\r
+               \r
+               elmContainer.style.cssText = "top:" + body.scrollTop + 'px;display:none;';\r
+               $( elmContainer ).stop().fadeIn( onFadeInComplete );            \r
+       };\r
+       function asyncOpen( /* arguments */ ){\r
+\r
+               \r
+               \r
+       };\r
+       function onFadeInComplete(){\r
+               KeyEvent.add( application, Const.KEY.EVENT.KEY_DOWN, Overlay.hide, 27 ); // 27.esc\r
+               MouseEvent.add( application, elmCloseButton, 'click', onCloseClick );\r
+               \r
+               var _arg = bootParams; //Util.copyArray( arguments );\r
+               _arg.unshift( windowW, windowH );\r
+               application.open.apply( application, _arg );            \r
+       };\r
+       function onFadeOutComplete(){   \r
+               Util.removeAllChildren( elmContainer );\r
+               body.removeChild( elmContainer );\r
+               elmContainer = elmShadow = elmCloseButton = null;\r
+       };\r
+       return {\r
+               show: function( _application, _bootParams ){\r
+                       if( visible === true && application === _application ) return;\r
+                       if( Application.isApplicationInstance( _application ) === false ) return;\r
+                       \r
+                       elmContainer = document.createElement( 'div' );\r
+                       body.appendChild( elmContainer );\r
+                       \r
+                       elmContainer.id = 'overlay-container';\r
+                       \r
+                       bodyOverflow        = body.style.overflow;\r
+                       body.style.overflow = 'hidden';\r
+                       \r
+                       elmShadow = document.createElement( 'div' );\r
+                       elmContainer.appendChild( elmShadow );\r
+                       elmShadow.id = 'overlay-shadow';\r
+                       \r
+                       elmCloseButton  = document.createElement( 'div' );\r
+                       elmContainer.appendChild( elmCloseButton );\r
+                       elmCloseButton.id = 'overlay-close-button';\r
+                       elmCloseButton.appendChild( document.createTextNode( 'x' ) );\r
+                       \r
+                       elmContainer.style.display = 'none'; // hide for fadeIn\r
+                       \r
+                       visible     = true;\r
+                       application = _application;\r
+                       \r
+                       //asyncInit();\r
+                       elmContainer.insertBefore( application.rootElement, elmCloseButton );\r
+                       _application.addAsyncCall( asyncInit );\r
+                       // _application.addAsyncCall( asyncOpen,  );\r
+                       \r
+                       bootParams = _bootParams;                       \r
+               },\r
+               hide: function(){\r
+                       if( visible === false ) return;\r
+                       if( application.close() === false ) return false;\r
+                       \r
+                       body.style.overflow = bodyOverflow;\r
+                       \r
+                       $( elmContainer ).stop().css( {\r
+                               filter:         '',\r
+                               opacity:        ''\r
+                       }).fadeOut( onFadeOutComplete );\r
+                       visible = false;\r
+                       \r
+                       application = null;\r
+               },\r
+               onWindowResize: function( _windowW, _windowH ){\r
+                       windowW = _windowW;\r
+                       windowH = _windowH;                     \r
+                       \r
+                       if( application === null ) return;\r
+                       \r
+                       elmContainer.style.height = _windowH + 'px';\r
+                       elmContainer.style.top    = body.scrollTop + 'px';\r
+\r
+                       elmShadow.style.height = _windowH + 'px';\r
+\r
+                       AsyncCall.add( application, application.resize, [ _windowW, _windowH ] );\r
+               }\r
+       }\r
+})();\r
+\r
+/* ----------------------------------------\r
+ * UI\r
+ * \r
+ * keyEventRellay\r
+ *  form -> overlay -> view\r
+ * \r
+ */\r
+\r
+var UI = ( function(){\r
+       var UI_LIST     = [],\r
+               currentUser = null,\r
+               currentList = null,\r
+               currentUi   = null,\r
+               currentItem = null,\r
+               windowW     = 0,\r
+               windowH     = 0;\r
+\r
+       var CLASSNAME_COMBOBOX_OPTION = 'combobox-option',\r
+               CLASSNAME_COMBOBOX_OPTION_CURRENT = CLASSNAME_COMBOBOX_OPTION + ' combobox-option-current',\r
+               ELM_COMBOBOX = ( function(){\r
+                       var ret       = document.createElement( 'a' ),\r
+                               elmToggle = document.createElement( 'span' ),\r
+                               elmValue  = document.createElement( 'span' );\r
+                       ret.href = '#';\r
+                       ret.appendChild( elmToggle );\r
+                       ret.appendChild( elmValue );\r
+                       elmToggle.className = 'combobox-toggle';\r
+                       elmValue.className  = 'combobox-value';\r
+                       \r
+                       elmToggle.appendChild( document.createTextNode( '▼' ));\r
+                       elmValue.appendChild( document.createTextNode( 'null' ));\r
+                       return ret;\r
+               })();\r
+       \r
+       var UIItemPrivateData = function(){};\r
+       UIItemPrivateData.prototype = {\r
+               groupData   : null,\r
+               item        : null,\r
+               elm         : null,\r
+               node        : null,\r
+               focus       : false,\r
+               visible     : true,\r
+               enabled     : true,\r
+               value       : null,\r
+               onUpdate    : null,\r
+               validator   : null,\r
+               elmValue    : null,\r
+               elmBox      : null,\r
+               elmA        : null,\r
+               elmToggle   : null,\r
+               elmValue    : null,\r
+               selectIndex : 0,\r
+               optionList  : null,\r
+               init    : function( groupData, item, elm, value, onUpdate, validator, focus, visible, enabled ){\r
+                       this.groupData = groupData;\r
+                       this.item      = item;\r
+                       this.elm       = elm;\r
+                       this.value     = value;\r
+                       this.onUpdate  = onUpdate;\r
+                       this.validator = validator;                     \r
+                       this.focus     = !!focus;\r
+                       this.visible   = !!visible;\r
+                       this.enabled   = !!enabled;\r
+                       UIItemPrivateData.list.push( this );\r
+               },\r
+               destroy : function(){\r
+                       var list = UIItemPrivateData.list;\r
+                       list.splice( Util.getIndex( list, this ), 1 );\r
+                       \r
+                       list = this.groupData.itemList;\r
+                       var i = Util.getIndex( list, this.item );\r
+                       i !== -1 && list.splice( i, 1 );\r
+                       \r
+                       this.node && this.node.remove();\r
+               }\r
+       };\r
+       UIItemPrivateData.list = [];\r
+       UIItemPrivateData.get = function( item ){\r
+               var list = UIItemPrivateData.list;\r
+               for( i = list.length; i; ){\r
+                       if( list[ --i ].item === item ) return list[ i ];\r
+               };\r
+               return null;\r
+       };\r
+       \r
+/* --------------------------------\r
+ * TextInputManager\r
+ */\r
+       var TextInputManager = ( function(){\r
+               var elmInput = ( function(){\r
+                       var ret  = document.createElement( 'input' );\r
+                       ret.type = 'text';\r
+                       ret.id   = 'ui-textinput';\r
+                       return ret;\r
+               })();\r
+               var currentData;\r
+               \r
+               function updateWrapperPosition(){\r
+                       var p = Position.cumulativeOffset( currentData.elmValue ),\r
+                               w = currentData.elmValue.offsetWidth - 2,\r
+                               _w;             \r
+                       elmInput.style.cssText = [\r
+                               'left:',   p[ 0 ], 'px;',\r
+                               'top:',    p[ 1 ], 'px;',//,\r
+                               'width:',  w, 'px;'//,\r
+                               //'height:', data.elmValue.offsetHeight, 'px;',\r
+                               //'position:absolute;'\r
+                       ].join( '' );\r
+                       \r
+                       //_w = elmInput.offsetWidth;\r
+                       //if( w !== _w ) elmInput.style.width = ( w - ( _w - w ) ) + 'px;';     \r
+               };\r
+               \r
+               return {\r
+                       show: function( data ){\r
+                               // this.groupData.node.addEventListener( 'mouseout' );\r
+                               currentData = data;\r
+\r
+                               body.appendChild( elmInput );\r
+                               elmInput.value = data.value;\r
+                               updateWrapperPosition();\r
+                               \r
+                               elmInput.focus();\r
+                               elmInput.select();\r
+                               \r
+                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );\r
+                       },\r
+                       hide : function( data ){\r
+                               if( currentData !== data ) return;\r
+                               currentData = null;\r
+                               body.removeChild( elmInput );\r
+                               var ret = elmInput.value;\r
+                               elmInput.value = '';\r
+                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition );\r
+                               return ret;\r
+                       },\r
+                       update : function( data ){\r
+                               elmInput.value = data.value;\r
+                       },\r
+                       onWindowResize: function( _w, _h ){\r
+                               AsyncCall.add( currentUser, updateWrapperPosition );\r
+                       }\r
+               };\r
+       })();\r
+       \r
+       var TextInputClass = function( groupData, elmWrapper, elmValue, onUpdate, validater ){\r
+               var data = new UIItemPrivateData();\r
+               data.init( groupData, this, elmWrapper, elmValue.innerHTML, onUpdate, validater, false, true, true );\r
+               Util.addClass( elmValue, 'editable-text' );\r
+               data.elmValue = elmValue;\r
+               this.value( data.value );\r
+               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );\r
+               data.node.addEventListener( 'click', this.focus, this );\r
+               //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', instance.focus );\r
+       };\r
+       TextInputClass.prototype = {\r
+               value : function( value ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isString( value ) === true || Type.isNumber( value ) === true ){\r
+                               data.elmValue.innerHTML = data.value = '' + value;\r
+                               data.focus === true && TextInputManager.update( data );\r
+                       };\r
+                       data.focus === true && this.blur();\r
+                       return data.value;\r
+               },\r
+               focus : function( e ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.focus = true;\r
+                       start( data );\r
+                       TextInputManager.show( data );\r
+                       return false;\r
+               },\r
+               blur : function( keep ){\r
+                       var data = UIItemPrivateData.get( this ),\r
+                               newValue;\r
+                       if( data.focus === false ) return;\r
+                       newValue = TextInputManager.hide( data );\r
+                       newValue = keep !== 27 ? ( data.validater ? '' + data.validater( newValue ) : newValue ) : data.value; // 27:ESC\r
+\r
+                       data.elmValue.innerHTML = newValue;\r
+                       \r
+                       data.onUpdate && newValue !== data.value && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ newValue, data.value ], this );\r
+                       \r
+                       data.value = newValue;\r
+                       data.focus = false;\r
+                       finish( data );\r
+               },\r
+               enabled : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.enabled !== v ){\r
+                               Util.toggleClass( data.elm, 'ui-textinput-disabled', !v );\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               data.enabled = v;\r
+                               data.node.disabled( !( data.visible && v ) );\r
+                       };\r
+                       return data.enabled;\r
+               },\r
+               visible : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.visible !== v ){\r
+                               data.elm.style.display = v ? '' : 'none';\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               data.visible = v;\r
+                               data.node.disabled( !( data.enabled && v ) );\r
+                       };\r
+                       return data.visible;\r
+               },\r
+               destroy : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.focus === true && TextInputManager.hide( data );\r
+                       data.destroy();\r
+               }\r
+       };\r
+\r
+/* --------------------------------\r
+ * TextInputManager\r
+ */\r
+       var FileInputManager = ( function(){\r
+               var currentData,\r
+                       elmForm,\r
+                       elmFileInput,\r
+                       elmWrap,\r
+                       evt;\r
+               \r
+               function updateWrapperPosition(){\r
+                       var p = Position.cumulativeOffset( currentData.elmValue ),\r
+                               w = currentData.elmValue.offsetWidth,\r
+                               _w;             \r
+                       elmWrap.style.cssText = [\r
+                               'left:',   p[ 0 ], 'px;',\r
+                               'top:',    p[ 1 ], 'px;',//,\r
+                               'width:',  w, 'px;'//,\r
+                               //'height:', data.elmValue.offsetHeight, 'px;',\r
+                               //'position:absolute;'\r
+                       ].join( '' );\r
+                       \r
+                       _w = elmWrap.offsetWidth;\r
+                       if( w !== _w ) elmWrap.style.width = ( w - ( _w - w ) ) + 'px'; \r
+               };\r
+               \r
+               function change( e ){\r
+                       var data = currentData,\r
+                               file = data.elmFileInputReal.value;\r
+                       file = file.split( '\\' );\r
+                       file = file[ file.length - 1 ];\r
+                       if( data.value !== file ){\r
+                               data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ file, data.value ], this );\r
+                               data.elmValue.innerHTML = data.value = file;\r
+                       };\r
+                       currentData.item.blur();\r
+               };\r
+               function asyncMouseout(){\r
+                       currentData && currentData.item.blur();\r
+               };\r
+               function onClick(){\r
+                       MouseEvent.remove( currentUser, elmFileInput, 'mouseout', asyncMouseout );\r
+                       MouseEvent.remove( currentUser, elmFileInput, 'click', onClick );       \r
+               };\r
+               return {\r
+                       show : function( data ){\r
+                               currentData = data;\r
+                               \r
+                               elmFileInput = data.elmFileInputReal;\r
+                               elmWrap      = elmFileInput.parentNode;\r
+                               // \r
+                               \r
+                               updateWrapperPosition();\r
+                               elmFileInput.focus();\r
+                               //data.node.addEventListener( 'change', change, data );\r
+                               evt = new EventTicketClass( elmFileInput, 'change', change );\r
+                               MouseEvent.add( currentUser, elmFileInput, 'mouseout', asyncMouseout );\r
+                               MouseEvent.add( currentUser, elmFileInput, 'click', onClick );\r
+                               // currentData.elmFileInputReal.onchange = change;\r
+                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );\r
+                       },\r
+                       hide : function( data ){\r
+                               if( currentData !== data ) return;\r
+                               // data.node.removeEventListener( 'change', change );\r
+                               evt.destroy();\r
+                               // MouseEvent.remove( currentUser, elmFileInput, 'mouseout', asyncMouseout );\r
+                               onClick();\r
+                               //currentData.elmFileInputReal.onchange = null;\r
+                               elmWrap.style.display = 'none';\r
+                               currentData = elmFileInput = null;\r
+                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition );\r
+                       },\r
+                       onWindowResize: function( _w, _h ){\r
+                               AsyncCall.add( currentUser, updateWrapperPosition );\r
+                       }\r
+               };\r
+       })();\r
+       \r
+       var FileInputClass = function( groupData, elmWrapper, onUpdate, validater, elmFileInputReal, elmValue ){\r
+               var data = new UIItemPrivateData();\r
+               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );\r
+               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-fileinput-hover', 'pointer' );\r
+               data.elmValue = elmValue;\r
+               data.elmFileInputReal = elmFileInputReal;\r
+               data.node.addEventListener( 'mouseover', this.focus, this );\r
+       };\r
+       FileInputClass.prototype = {\r
+               value : function(){\r
+                       return data.value;\r
+               },\r
+               focus : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.focus = true;\r
+                       Util.addClass( data.elm, 'fileinput-has-focus' );\r
+                       start( data );\r
+                       FileInputManager.show( data );\r
+               },\r
+               blur : function( keyCode ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       Util.removeClass( data.elm, 'fileinput-has-focus' );\r
+                       data.focus = false;\r
+                       FileInputManager.hide( data );\r
+                       finish( data );\r
+               },\r
+               enabled : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.enabled !== v ){\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               Util.toggleClass( data.elm, 'fileinput-disabled', !v );\r
+                               data.enabled = v;\r
+                               data.node.disabled( !( data.visible && v ) );\r
+                       };\r
+                       return data.enabled;\r
+               },\r
+               visible : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.visible !== v ){\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               data.elm.style.display = v ? '' : 'none';\r
+                               data.visible = v;\r
+                               data.node.disabled( !( data.enabled && v ) );\r
+                       };\r
+                       return data.visible;\r
+               },\r
+               destroy : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.focus === true && FileInputManager.hide( data );\r
+                       data.destroy();\r
+               }\r
+       };\r
+       \r
+       var ButtonClass = function( groupData, elmWrapper, onUpdate ){\r
+               var data = new UIItemPrivateData();\r
+               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );\r
+               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-button-hover', 'pointer' );\r
+               data.node.addEventListener( 'click', onUpdate );\r
+               //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', onUpdate );\r
+       };\r
+       ButtonClass.prototype = {\r
+               focus : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.focus = true;\r
+                       Util.addClass( data.elm, 'button-has-focus' );\r
+                       start( data );\r
+               },\r
+               blur : function( keyCode ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       keyCode === 13 && data.onUpdate && data.onUpdate();\r
+                       Util.removeClass( data.elm, 'button-has-focus' );\r
+                       data.focus = false;\r
+                       finish( data );\r
+               },\r
+               enabled : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.enabled !== v ){\r
+                               Util.toggleClass( data.elm, 'button-disabled', !v );\r
+                               data.enabled = v;\r
+                               data.node.disabled( !( data.visible && v ) );\r
+                       };\r
+                       return data.enabled;\r
+               },\r
+               visible : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.visible !== v ){\r
+                               data.elm.style.display = v ? '' : 'none';\r
+                               data.visible = v;\r
+                               data.node.disabled( !( data.enabled && v ) );\r
+                       };\r
+                       return data.visible;\r
+               },\r
+               destroy : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       // MouseEvent.remove( data.groupData.apiuser, data.elm );\r
+                       data.destroy();\r
+               }\r
+       };\r
+\r
+       var ComboBoxClass = function( groupData, elmWrapper, onUpdate ){\r
+               var elmA   = ELM_COMBOBOX.cloneNode( true ),\r
+                       data   = new UIItemPrivateData();\r
+               data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );\r
+               \r
+               data.elmBox      = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ];\r
+               data.elmBox.appendChild( elmA );\r
+               data.elmA        = elmA;\r
+               data.elmToggle   = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ];\r
+               data.elmValue    = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild;\r
+               data.selectIndex = 0;\r
+               data.optionList  = [];\r
+\r
+               data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-combobox-hover', 'pointer' );\r
+               data.node.addEventListener( 'click', this.focus, this );\r
+       };\r
+       ComboBoxClass.prototype = {\r
+               focus : function( e ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       data.node.removeEventListener( 'click', this.focus );\r
+                       data.focus = true;\r
+                       data.elmA.className = 'combobox-has-focus';\r
+                       start( data );\r
+                       OptionControl.show( data );\r
+                       return false;\r
+               },\r
+               blur : function( keyCode ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       OptionControl.hide( this );\r
+                       data.focus = false;\r
+                       data.elmA.className = '';\r
+                       finish( data );\r
+                       data.node.addEventListener( 'click', this.focus, this );\r
+               },\r
+               enabled : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.enabled !== v ){\r
+                               Util.toggleClass( data.elm, 'ui-combobox-disabled', !v );\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               data.enabled = v;\r
+                               data.node.disabled( !( data.visible && v ) );\r
+                       };\r
+                       return data.enabled;\r
+               },\r
+               visible : function( v ){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.visible !== v ){\r
+                               data.elm.style.display = v ? '' : 'none';\r
+                               if( data.focus === true && v === false ) this.blur();\r
+                               data.visible = v;\r
+                               data.node.disabled( !( data.enabled && v ) );\r
+                       };\r
+                       return data.visible;\r
+               },\r
+               value : function( _value ){\r
+                       var data = UIItemPrivateData.get( this ),\r
+                               i    = 0,\r
+                               list = data.optionList,\r
+                               l    = list.length,\r
+                               _option;\r
+                       if( Type.isString( _value ) === true && data.value !== _value ){\r
+                               for( ; i < l; ++i ){\r
+                                       _option = list[ i ];\r
+                                       if( _value === _option.value ){\r
+                                               data.value = _value;\r
+                                               data.index = i;\r
+                                               data.elmValue.data = _option.displayValue;\r
+                                               if( data.focus === true ){\r
+                                                       OptionControl.update( this, _value );\r
+                                               };\r
+                                               data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, _value, this );\r
+                                               break;\r
+                                       };\r
+                               };\r
+                       };\r
+                       return data.value;\r
+               },\r
+               selectIndex : function(){\r
+                       var data = UIItemPrivateData.get( this );\r
+                       return data.selectIndex;\r
+               },\r
+               createOption : function( _displayValue, _value, _isSelected ){\r
+                       var data   = UIItemPrivateData.get( this ),\r
+                               option = null,\r
+                               list   = data.optionList,\r
+                               i      = list.length,\r
+                               _option, i;\r
+                       _value      = _value || _displayValue;\r
+                       _isSelected = !!_isSelected;\r
+                       for( ; i; ){\r
+                               _option = list[ --i ];\r
+                               if( _value === _option.value ){\r
+                                       option = _option;\r
+                                       break;\r
+                               };\r
+                       };\r
+                       if( _isSelected === true ){\r
+                               data.selectIndex   = list.length;\r
+                               data.elmValue.data = _displayValue;\r
+                       };                      \r
+                       option === null && list.push( new OptionDataClass( _displayValue, _value, _isSelected ) );\r
+               },\r
+               destroy : function(){\r
+                       var data   = UIItemPrivateData.get( this );\r
+                       data.focus === true && OptionControl.hide( this );\r
+                       // this.blur();\r
+                       // MouseEvent.remove( data.groupData.apiuser, data.elm );\r
+                       data.optionList.length = 0;\r
+                       data.destroy();\r
+               }\r
+       };\r
+       var OptionDataClass = function( displayValue, value, isCurrent ){\r
+               this.displayValue = displayValue;\r
+               this.value        = value || displayValue;\r
+               this.current      = isCurrent;\r
+               displayValue = value = null;\r
+       };\r
+\r
+       var OptionControl = ( function(){\r
+               var ELM_OPTION_WRAPPER = ( function(){\r
+                               var ret = document.createElement( 'div' );\r
+                               ret.className = 'option-container';\r
+                               return ret;\r
+                       })(),\r
+                       ELM_OPTION_ORIGIN = ( function(){\r
+                               var ret = document.createElement( 'a' );\r
+                               ret.appendChild( document.createTextNode( 'option' ) );\r
+                               ret.href = '#';\r
+                               return ret;\r
+                       })();\r
+\r
+               var OptionClass = function( option ){\r
+                       this.elm     = ELM_OPTION_ORIGIN.cloneNode( true );\r
+                       this.data    = option;\r
+                       this.init();\r
+               };\r
+               OptionClass.prototype = {\r
+                       init: function(){\r
+                               ELM_OPTION_WRAPPER.appendChild( this.elm );\r
+                               this.elm.firstChild.data = this.data.displayValue;\r
+                               this.current( this.data.current );\r
+                               MouseEvent.add( SUPER_USER_KEY, this.elm, 'mousedown', onOptionSelect );// onclick では 選択ボックス 隠すように body に設定した onmouseup が先に動いてしまう!\r
+                       },\r
+                       current: function( _current ){\r
+                               this.elm.className = _current === true ? CLASSNAME_COMBOBOX_OPTION_CURRENT : CLASSNAME_COMBOBOX_OPTION;\r
+                               this.data.current  = _current;\r
+                               currentOption      = _current === true ? this : currentOption;\r
+                       },\r
+                       destroy: function(){\r
+                               MouseEvent.remove( SUPER_USER_KEY, this.elm );\r
+                               Util.removeAllChildren( this.elm );\r
+                               ELM_OPTION_WRAPPER.removeChild( this.elm );\r
+                               delete this.elm;\r
+                               delete this.data;\r
+                       }\r
+               };\r
+               \r
+               function onOptionSelect( e ){\r
+                       var i = 0,\r
+                               l = OPTION_LIST.length,\r
+                               _option;\r
+                       for( ; i < l; ++i ){\r
+                               _option = OPTION_LIST[ i ];\r
+                               if( this === _option.elm ){\r
+                                       updateCurrrentOption( _option.data.value, true );\r
+                                       currentCombobox.blur();\r
+                                       break;\r
+                               };\r
+                       };\r
+                       return false;\r
+               };\r
+               \r
+               var OPTION_LIST     = [],\r
+                       currentCombobox = null,\r
+                       apiuser,\r
+                       elm,\r
+                       currentOption,\r
+                       currentIndex;\r
+               \r
+               function updateCurrrentOption( _value, _updateCombobox ){\r
+                       var _option,\r
+                               i = OPTION_LIST.length;\r
+                       for( ; i; ){\r
+                               _option = OPTION_LIST[ --i ];\r
+                               if( _value === _option.data.value ){\r
+                                       currentOption && currentOption.current( false );\r
+                                       _option.current( true );\r
+                                       currentOption = _option;\r
+                                       currentIndex  = i;\r
+                                       _updateCombobox === true && currentCombobox.value( _value );\r
+                                       break;\r
+                               };\r
+                       };\r
+               };\r
+               function bodyMouseupHandler(){\r
+                       currentCombobox.blur();\r
+                       OptionControl.hide( currentCombobox );\r
+               };\r
+               function updateWrapperPosition(){\r
+                       var position = Util.getAbsolutePosition( elm );\r
+\r
+                       ELM_OPTION_WRAPPER.style.cssText = [\r
+                               'width:', elm.offsetWidth - 2, 'px;',\r
+                               'left:',  position.x, 'px;',\r
+                               'top:',   position.y + elm.offsetHeight, 'px;'\r
+                       ].join( '' );\r
+               };\r
+               function change( e ){\r
+                       var l   = OPTION_LIST.length,\r
+                               i   = currentIndex + ( e.keyCode === 40 ? -1 : 1 );\r
+                       if( currentCombobox === null || l < 2 ) return;\r
+                       i = i < 0 ?\r
+                                       l - 1 :\r
+                                       i < l ? i : 0;\r
+                       updateCurrrentOption( OPTION_LIST[ i ].data.value, true );\r
+                       return false;\r
+               };\r
+               return {\r
+                       show: function( data ){\r
+                               var combobox = data.item,\r
+                                       list     = data.optionList,\r
+                                       i        = 0,\r
+                                       l        = list.length;\r
+                               if( currentItem !== combobox || currentCombobox === combobox ) return;\r
+                               currentCombobox && currentCombobox.blur();\r
+                               \r
+                               apiuser         = data.groupData.apiuser;\r
+                               currentCombobox = combobox;\r
+                               elm             = data.elmBox;\r
+                               \r
+                               for( ; i < l; ++i ){\r
+                                       OPTION_LIST.unshift( new OptionClass( list[ i ] ) );\r
+                               };\r
+                               MouseEvent.add( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );\r
+                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 38 );\r
+                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 40 );\r
+                               //KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onEnter, 13 );\r
+                               //KeyEvent.updateCurrentListener( SUPER_USER_KEY );\r
+                               \r
+                               body.appendChild( ELM_OPTION_WRAPPER );\r
+                               \r
+                               updateCurrrentOption( combobox.value(), false );\r
+                               updateWrapperPosition();\r
+                               \r
+                               SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );\r
+                       },\r
+                       hide: function( _combobox ){\r
+                               if( currentCombobox !== _combobox || currentCombobox === null ) return;\r
+\r
+                               var _option;\r
+                               while( _option = OPTION_LIST.shift() ){\r
+                                       _option.destroy();\r
+                               };\r
+                               \r
+                               body.removeChild( ELM_OPTION_WRAPPER );\r
+                               \r
+                               MouseEvent.remove( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );\r
+                               KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change );\r
+                               KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change );\r
+                               //KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onEnter );\r
+                               //KeyEvent.updateCurrentListener( apiuser );\r
+                               \r
+                               SystemTimer.remove( SUPER_USER_KEY, updateWrapperPosition, 500 );\r
+                               \r
+                               apiuser         = null;\r
+                               currentCombobox = null;\r
+                               currentOption   = null;\r
+                               currentIndex    = 0;                            \r
+                       },\r
+                       onEnter: function(){\r
+                               currentCombobox.value( currentOption.data.value );\r
+                               //currentCombobox.blur();\r
+                               //OptionControl.hide( currentCombobox );\r
+                       },\r
+                       update: function( data, _value ){\r
+                               if( currentCombobox !== data.item || currentItem !== data.item ) return;\r
+                               if( currentOption.data.value === _value ) return;\r
+                               updateCurrrentOption( _value, true );\r
+                       },\r
+                       onWindowResize: function( _w, _h ){\r
+                               currentCombobox && AsyncCall.add( apiuser, updateWrapperPosition );\r
+                       }\r
+               };\r
+       })();\r
+       \r
+       var UIGroupPrivateData = function(){};\r
+       UIGroupPrivateData.prototype = {\r
+               apiuser  : null,\r
+               node     : null,\r
+               uigroup  : null,\r
+               itemList : null,\r
+               visible  : true,\r
+               enabled  : true,\r
+               init     : function( apiuser, node, uigroup ){\r
+                       this.apiuser  = apiuser;\r
+                       this.node     = node;\r
+                       this.uigroup  = uigroup;\r
+                       this.itemList = [];\r
+                       UIGroupPrivateData.list.push( this );\r
+               },\r
+               destroy  : function(){\r
+                       \r
+               }\r
+       };\r
+       UIGroupPrivateData.list = [];\r
+       UIGroupPrivateData.get  = function( uigroup ){\r
+               var list = UIGroupPrivateData.list,\r
+                       i    = list.length;\r
+               for( ; i; ){\r
+                       if( list[ --i ].uigroup === uigroup ) return list[ i ];\r
+               };\r
+               return null;\r
+       };\r
+       \r
+       var UIGroupClass = function( apiuser, node ){\r
+               ( new UIGroupPrivateData() ).init( apiuser, node, this );\r
+       };\r
+       UIGroupClass.prototype = {\r
+               focus : function( _value ){\r
+                       var data = UIGroupPrivateData.get( this );\r
+                       /*\r
+                       if( _value === true ){\r
+                               if( currentItem ){\r
+                                       start( apiuser, self, currentItem );\r
+                               } else\r
+                               if( itemList.length > 0 ){\r
+                                       start( apiuser, self, itemList[ 0 ] );\r
+                               };\r
+                       } else\r
+                       if( _value === false ){\r
+                               finish( apiuser, self, currentItem );\r
+                       } else\r
+                       */\r
+                       if( _value && Util.getIndex( data.itemList, _value ) !== -1 ){\r
+                               // currentItem = _value;\r
+                               currentList = data.itemList;\r
+                       };\r
+                       return currentUi === this; \r
+               },\r
+               blur : function(){\r
+                       var data = UIGroupPrivateData.get( this );\r
+                       if( currentList === data.itemList ){\r
+                               currentList = null;\r
+                       };\r
+               },\r
+               createInputText : function( elmWrapper, onUpdate, validater ){\r
+                       var data     = UIGroupPrivateData.get( this ),\r
+                               elmValue = Util.getElementsByClassName( elmWrapper, 'editable-value' )[ 0 ],\r
+                               ret;\r
+                       if( elmValue ){\r
+                               ret = new TextInputClass( data, elmWrapper, elmValue, onUpdate, validater );\r
+                               data.itemList.push( ret );\r
+                               return ret;\r
+                       };\r
+                       alert( 'error createInputText' );\r
+               },\r
+               createButton : function( elm, onClick ){\r
+                       var data = UIGroupPrivateData.get( this ),\r
+                               ret  = new ButtonClass( data, elm, onClick );\r
+                       data.itemList.push( ret );\r
+                       return ret;\r
+               },\r
+               createFileInput : function( elm, onUpdate, validater, elmFileInputReal ){\r
+                       var data     = UIGroupPrivateData.get( this ),\r
+                               elmValue = Util.getElementsByClassName( elm, 'fileinput-value' )[ 0 ],\r
+                               ret;\r
+                       if( elmValue ){\r
+                               ret = new FileInputClass( data, elm, onUpdate, validater, elmFileInputReal, elmValue );\r
+                               data.itemList.push( ret );\r
+                               return ret;\r
+                       };\r
+                       return ret;\r
+               },\r
+               createCombobox : function( elm, onUpdate, optionList ){\r
+                       var data = UIGroupPrivateData.get( this ),\r
+                               ret  = new ComboBoxClass( data, elm, onUpdate, optionList );\r
+                       data.itemList.push( ret );\r
+                       return ret;\r
+               },\r
+               createCheckBox : function(){\r
+                       \r
+               },\r
+               createRadio : function(){\r
+                       \r
+               },\r
+               createSlider : function(){\r
+                       \r
+               },\r
+               visible : function( v ){\r
+                       var data = UIGroupPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.visible !== v ){\r
+                               for( var i = data.itemList.length; i; ){\r
+                                       data.itemList[ --i ].visible( v );\r
+                               };\r
+                               data.visible = v;\r
+                               data.node.disabled( !( data.enabled && v ) );\r
+                       };\r
+                       return data.visible;\r
+               },\r
+               enabled : function( v ){\r
+                       var data = UIGroupPrivateData.get( this );\r
+                       if( Type.isBoolean( v ) === true && data.enabled !== v ){\r
+                               for( var i = data.itemList.length; i; ){\r
+                                       data.itemList[ --i ].enabled( v );\r
+                               };\r
+                               data.enabled = v;\r
+                               data.node.disabled( !( data.visible && v ) );\r
+                       };\r
+                       return data.enabled;\r
+               },\r
+               destroy : function(){\r
+                       var data = UIGroupPrivateData.get( this ),\r
+                               _item;\r
+                       if( currentUi === this ){\r
+                               currentItem.blur();\r
+                               // finish( UIItemPrivateData.get( currentItem ) );\r
+                       };                      \r
+                       while( _item = data.itemList.shift() ){\r
+                               _item.destroy();\r
+                       };\r
+                       data.destroy();\r
+               }\r
+       };\r
+       \r
+       function start( data ){\r
+               if( currentItem !== data.item ){\r
+                       currentUi !== data.groupData.uigroup && currentUi && currentUi.blur();\r
+                       \r
+                       currentItem !== null && currentItem.blur();\r
+                       \r
+                       currentUser = data.groupData.apiuser;\r
+                       currentUi   = data.groupData.uigroup;\r
+                       currentItem = data.item;\r
+                       \r
+                       currentUi.focus( currentItem );\r
+                       \r
+                       // if( currentUser !== _apiuser ) {\r
+                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );\r
+                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );\r
+                               KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown,  9 );\r
+                               KeyEvent.updateCurrentListener( SUPER_USER_KEY );\r
+                       // };\r
+               };\r
+       }\r
+       function finish( data ){\r
+               if( currentItem === data.item ){\r
+                       currentUi.blur();\r
+                       \r
+                       currentUser = null;\r
+                       currentUi   = null;\r
+                       currentItem = null;\r
+                       currentList = null;\r
+                       \r
+                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );\r
+                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );\r
+                       KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown,  9 );\r
+                       KeyEvent.updateCurrentListener( data.groupData.apiuser );\r
+               };\r
+       };\r
+\r
+       function onKeyDown( e ){\r
+               if( currentItem === null ) return true;\r
+               var keyCode = e.keyCode,\r
+                       index   = Util.getIndex( currentList, currentItem );\r
+               if( keyCode === 13 || keyCode === 27 || keyCode === 9 || keyCode === 18 || e.altKey === true ){ // 13.return 27.esc 9.tab 18.alt\r
+                       keyCode === 9  && tabShift( index, e.shiftKey === true ? -1 : 1 );\r
+                       keyCode === 13 && currentItem instanceof ComboBoxClass && OptionControl.onEnter();\r
+                       keyCode === 13 && tabShift( index, 1 );                 \r
+                       currentItem && currentItem.blur( keyCode );\r
+                       return false;\r
+               };\r
+       };\r
+\r
+       function tabShift( index, way ){\r
+               var l = currentList.length,\r
+                       i = index + way,\r
+                       item;\r
+               if( l < 2 ) return;\r
+               while( i !== index ){\r
+                       i = i < 0 ?\r
+                               l - 1 :\r
+                               i < l ? i : 0; // 0 < i < l\r
+                       item = currentList[ i ];\r
+                       if( item.enabled() === true && item.visible() === true ){\r
+                               AsyncCall.add( currentUser, item.focus, null, item );\r
+                               return;\r
+                       };\r
+                       i += way;\r
+               };\r
+       };\r
+       \r
+       return {\r
+               createUIGroup: function( apiuser, node ){\r
+                       var uid  = apiuser.getUID(),\r
+                               list = UI_LIST[ uid ],\r
+                               ui   = new UIGroupClass( apiuser, node );\r
+                       if( Type.isArray( list ) === false ){\r
+                               list = UI_LIST[ uid ] = [];\r
+                       };\r
+                       list.push( ui );\r
+                       return ui;\r
+               },\r
+               onWindowResize: function( w, h ){\r
+                       windowW = w;\r
+                       windowH = h;\r
+                       currentItem instanceof ComboBoxClass && OptionControl.onWindowResize( w, h );\r
+                       currentItem instanceof TextInputClass && TextInputManager.onWindowResize( w, h );\r
+                       currentItem instanceof FileInputClass && FileInputManager.onWindowResize( w, h );\r
+               },\r
+               onCurrentApplicationChange: function( _apiuser ){\r
+                       currentList = UI_LIST[ _apiuser.getUID() ];\r
+               },\r
+               onApplicationShutdown: function( _apiuser ){\r
+                       KeyEvent.remove( _apiuser );\r
+               },\r
+               onSystemShutdown: function(){\r
+                       \r
+               }\r
+       };\r
+})();\r
+\r
+var UIForm = ( function(){\r
+       var FORM_LIST           = [];\r
+       var CLASSNAME_FORM      = 'uiform-invisible';\r
+       var CLASSNAME_FILE_WRAP = 'ui-fileinput-wrapper';\r
+       var FormItemData = function(){};\r
+    var windowW, windowH;\r
+       FormItemData.prototype = {\r
+               formData : null,\r
+               uiItem   : null,\r
+               init : function( formData, uiItem ){\r
+                       this.formData = formData;\r
+                       this.uiItem   = uiItem;\r
+               },\r
+               onUpdate : function( v ){\r
+                       // var index = Util.getIndex( this.formData.itemList, this );\r
+               }\r
+       };\r
+       \r
+       var FormPrivateData = function(){};\r
+       FormPrivateData.prototype = {\r
+               apiuser  : null,\r
+               node     : null,\r
+               form     : null,\r
+               elmForm  : null,\r
+               itemList : null,\r
+               visible  : true,\r
+               enabled  : true,\r
+               init     : function( apiuser, from, node, elm, elmForm ){\r
+                       this.apiuser      = apiuser;\r
+                       this.form         = form;\r
+                       this.ui           = apiuser.createUIGroup( node );\r
+                       this.node         = node;\r
+                       this.elm          = elm;\r
+                       this.elmForm      = elmForm;\r
+                       this.itemList     = [];\r
+                       elmForm.className = CLASSNAME_FORM;\r
+                       FormPrivateData.list.push( this );\r
+                       \r
+                       var forms = Util.copyArray( elmForm.getElementsByTagName( '*' ) ),\r
+                               l     = forms.length,\r
+                               i     = 0,\r
+                               items = 'input,select,textarea,button',\r
+                               form, data, el, wrap;\r
+                       for( ; i<l; ++i ){\r
+                               form = forms[ i ];\r
+                               if( form.nodeType !== 1 ) continue;\r
+                               switch( form.tagName.toLowerCase() ){\r
+                                       case 'input':\r
+                                               switch( form.type.toLowerCase() ){\r
+                                                       case 'text':\r
+                                                               break;\r
+                                                       case 'file':\r
+                                                               el = document.createElement( 'div' );\r
+                                                               el.className = 'uiform-file-container';\r
+                                                               el.appendChild( document.createElement( 'div' ) );\r
+                                                               el.appendChild( document.createElement( 'div' ) );\r
+                                                               el.firstChild.className = 'uiform-label';\r
+                                                               el.lastChild.className  = 'uiform-file fileinput-value';\r
+                                                               // opera9 don't work for opera9;\r
+                                                               //el = Util.pullHtmlAsTemplete( '<div class="uiform-file-container"><div class="uiform-label"></div><div class="uiform-file fileinput-value"></div></div>' );\r
+                                                               elm.appendChild( el );\r
+                                                               data = new FormItemData();\r
+                                                               wrap = document.createElement( 'div' );\r
+                                                               form.parentNode.insertBefore( wrap, form );\r
+                                                               wrap.className = CLASSNAME_FILE_WRAP;\r
+                                                               wrap.appendChild( form );\r
+                                                               data.init( this, this.ui.createFileInput( el, data.onUpdate, null, form ) );\r
+                                                               this.itemList.push( data );\r
+                                                               break;\r
+                                                       case 'button':\r
+                                                               break;\r
+                                                       default:\r
+                                                               continue;\r
+                                               };\r
+                                               break;\r
+                                       case 'select':\r
+                                               break;\r
+                                       case 'button':\r
+                                               break;\r
+                                       case 'textarea':\r
+                                               break;\r
+                                       default:\r
+                                               continue;\r
+                               };\r
+                       };\r
+               },\r
+               destroy  : function(){\r
+                       \r
+               }\r
+       };\r
+       FormPrivateData.list = [];\r
+       FormPrivateData.get  = function( from ){\r
+               var list = FormPrivateData.list,\r
+                       i    = list.length;\r
+               for( ; i; ){\r
+                       if( list[ --i ].form === form ) return list[ i ];\r
+               };\r
+               return null;\r
+       };\r
+       \r
+       var FormClass = function( apiuser, node, elm, elmForm ){\r
+               ( new FormPrivateData() ).init( apiuser, this, node, elm, elmForm );\r
+       };\r
+       FormClass.prototype = {\r
+               createTextInput : function(){\r
+                       \r
+               },\r
+               createMultiLineInput : function(){\r
+                       \r
+               },\r
+               createFileInput : function(){\r
+                       \r
+               },\r
+               createButton : function(){\r
+                       \r
+               },\r
+               createComboBox : function(){\r
+                       \r
+               },\r
+               submit : function(){\r
+                       \r
+               }\r
+       };\r
+       \r
+       return {\r
+               createForm: function( apiuser, nodeOrElm, opt_elmForm ){\r
+                       var uid  = apiuser.getUID(),\r
+                               list = FORM_LIST[ uid ],\r
+                               node, elm, form;\r
+                       if( PointingDeviceEventTree.isNodeInstance( nodeOrElm ) === true ){\r
+                               node = nodeOrElm;\r
+                               elm  = PointingDeviceEventTree._getNodePrivateData( nodeOrElm ).elm;\r
+                       } else {\r
+                               // App が eventTree を持っている?\r
+                               // App が eventTree を持っていない\r
+                               elm  = nodeOrElm;\r
+                       };  \r
+                       form = new FormClass( apiuser, node, elm, opt_elmForm );\r
+                       if( Type.isArray( list ) === false ){\r
+                               list = FORM_LIST[ uid ] = [];\r
+                       };\r
+                       list.push( form );\r
+                       return form;\r
+               },\r
+               onWindowResize: function( w, h ){\r
+                       windowW = w;\r
+                       windowH = h;\r
+                       currentItem instanceof ComboBoxClass && OptionControl.onWindowResize( w, h );\r
+                       currentItem instanceof TextInputClass && TextInputManager.onWindowResize( w, h );\r
+                       currentItem instanceof FileInputClass && FileInputManager.onWindowResize( w, h );\r
+               },\r
+               onCurrentApplicationChange: function( _apiuser ){\r
+               },\r
+               onApplicationShutdown: function( _apiuser ){\r
+               },\r
+               onSystemShutdown: function(){\r
+                       \r
+               }\r
+       };\r
+})();\r
+\r
+var Finder = ( function(){\r
+       var FINDER_LIST              = [],\r
+               ELM_ORIGIN_LOCATION_ITEM = Util.pullHtmlAsTemplete( '<div class="finder-location-item"></div>' ),\r
+               HTML_FINDER_ICON = ( function(){\r
+                       return ( UA.isIE === true && UA.ieVersion < 8 ?\r
+                       [\r
+                               '<div class="finder-icon fnder-icon-ie7">',\r
+                                       '<div class="finder-icon-handle"></div>',\r
+                                       '<div class="file-icon"><div></div></div>',\r
+                                       '<span class="finder-icon-cell finder-icon-ie-filename">',\r
+                                               '<span class="finder-icon-vertical-middle-outer">',\r
+                                                       '<span class="finder-icon-vertical-middle-inner">',\r
+                                                               '<span class="finder-icon-filename break-word">file name</span>',\r
+                                                       '</span>',\r
+                                               '</span>',\r
+                                       '</span>',\r
+                                       '<span class="finder-icon-cell finder-icon-ie-summary">',\r
+                                               '<span class="finder-icon-vertical-middle-outer">',\r
+                                                       '<span class="finder-icon-vertical-middle-inner">',\r
+                                                               '<span class="finder-icon-summary break-word">file descriptiion</span>',\r
+                                                       '</span>',\r
+                                               '</span>',\r
+                                       '</span>',\r
+                                       '<div class="finder-icon-down"></div>',\r
+                               '</div>'\r
+                       ] :\r
+                       [\r
+                               '<div class="finder-icon fnder-icon-modern">',\r
+                                       '<div class="finder-icon-handle"></div>',\r
+                                       '<div class="file-icon"><div></div></div>',\r
+                                       '<div class="finder-icon-filename break-word">file name</div>',\r
+                                       '<div class="finder-icon-summary break-word">file descriptiion</div>',\r
+                                       '<div class="finder-icon-down">&gt;</div>',\r
+                               '</div>'\r
+                       ] ).join( '' );\r
+               })(),\r
+               ELM_ORIGIN_FINDER_ICON = Util.pullHtmlAsTemplete( HTML_FINDER_ICON ),\r
+               ICON_HEIGHT            = Util.getElementSize( ELM_ORIGIN_FINDER_ICON ).height;\r
+       \r
+       // t : 時間\r
+    // b : 開始の値(開始時の座標やスケールなど)\r
+    // c : 開始と終了の値の差分\r
+    // d : Tween(トゥイーン)の合計時間\r
+\r
+       function easeOutQuad( t, b, c, d ){\r
+               t /= d;\r
+               return -c * t*( t-2 ) + b;\r
+       };\r
+       \r
+/**\r
+ * FinderIconClass\r
+ */\r
+       var FinderIconClass = function(){};\r
+       FinderIconClass.prototype = {\r
+               finderData       : null,\r
+               file             : null,\r
+               elm              : null,\r
+               node             : null,\r
+               _index           : -1,\r
+               _style           : -1,\r
+               init : function( page, file, w, index, style ){\r
+                       if( !this.elm ) this.elm  = ELM_ORIGIN_FINDER_ICON.cloneNode( true );\r
+\r
+                       if( this.page !== page ){\r
+                               this.page = page;\r
+                               page.elm.appendChild( this.elm );\r
+                               this.node && this.node.remove();\r
+                               this.node = page.node.createNode( this.elm, false, true, 'finder-icon-hover', '' );\r
+                       };\r
+                       if( this.file !== file ){\r
+                               this.file && this.file.destroy();\r
+                               this.file   = file;\r
+                               this._index = index;\r
+                               this.draw( w );\r
+                               return;\r
+                       };\r
+                       if( this._index !== index ){\r
+                               this._index = index;\r
+                               this.resize( w );\r
+                       };\r
+               },\r
+               index : function( _index ){     \r
+                       return this._index;\r
+               },\r
+               style : function( _style ){\r
+                       return this._style;\r
+               },\r
+               draw : function( w ){\r
+                       var file       = this.file,\r
+                               elm        = this.elm,\r
+                               thumb      = file.getThumbnail(),\r
+                               elmThumb   = Util.getElementsByClassName( elm, 'file-icon' )[ 0 ].firstChild,\r
+                               elmName    = Util.getElementsByClassName( elm, 'finder-icon-filename' )[ 0 ],\r
+                               elmDesc    = Util.getElementsByClassName( elm, 'finder-icon-summary' )[ 0 ];\r
+                       if( thumb.image ){\r
+                               elmThumb.className = 'has-thumbnail';\r
+                               elmThumb.style.backgroundImage = [ 'url(', thumb.image, ')' ].join( '' );\r
+                       } else {\r
+                               elmThumb.className = thumb.className;\r
+                               elmThumb.style.backgroundImage = '';\r
+                       };\r
+                       \r
+                       elmName.firstChild.data = file.getName();\r
+                       elmDesc.firstChild.data = file.getSummary();\r
+                       \r
+                       this.resize( w );\r
+               },\r
+               resize : function( w ){\r
+                       this.node.update( 0, this._index * ICON_HEIGHT, w );\r
+               },\r
+               onEditorClick : function( e ){\r
+                       this.onEditorCallback && this.onEditorCallback( this.file, this.file.editorApplicationList()[ 0 ] );\r
+                       return false;\r
+               },\r
+               onViwerClick : function( e ){\r
+                       this.onViewerCallback && this.onViewerCallback( this.file, this.file.viewerApplicationList()[ 0 ] );\r
+                       return false;\r
+               },\r
+               onActionClick : function( e ){\r
+                       this.onActionCallback && this.onActionCallback( this.file );\r
+                       return false;\r
+               },\r
+               destroy : function(){\r
+                       this.elm && this.elm.parentNode.removeChild( this.elm );\r
+                       this.file && this.file.destroy();\r
+                       this.node && this.node.remove();\r
+                       delete this.page;\r
+                       delete this.file;\r
+                       delete this.node;\r
+                       delete this._index;\r
+                       delete this._style;\r
+                       FinderIconClass.pool.push( this );\r
+               }       \r
+       };\r
+       FinderIconClass.pool = [];\r
+       FinderIconClass.get = function( page, file, w, index, style ){\r
+               var _icon = FinderIconClass.pool.length > 0 ? FinderIconClass.pool.shift() : new FinderIconClass();\r
+               _icon.init( page, file, w, index, style );\r
+               return _icon;\r
+       };\r
+\r
+/**\r
+ * PathClass\r
+ */\r
+       var PathClass = function(){};\r
+       PathClass.prototype = {\r
+               finderData : null,\r
+               elm        : null,\r
+               node       : null,\r
+               file       : null,\r
+               _index     : null,\r
+               w          : 0,\r
+               init : function( finderData, file, index ){\r
+                       if( !this.elm ) this.elm  = ELM_ORIGIN_LOCATION_ITEM.cloneNode( true );\r
+                       \r
+                       if( this.finderData !== finderData ){\r
+                               this.finderData = finderData;\r
+                               finderData.elmPath.appendChild( this.elm );\r
+                               this.node && this.node.remove();\r
+                               delete this.node;\r
+                       };\r
+                       if( this.file !== file ){\r
+                               this.file = file;\r
+                               this.draw();\r
+                       };\r
+                       this._index = index;\r
+                       if( !this.node ) this.node = finderData.nodePath.createNode( this.elm, false, true, 'finder-path-hover', 'pointer' );\r
+               },\r
+               draw  : function(){\r
+                       this.elm.className = 'file-icon-' + this.file.getType();\r
+                       this.elm.innerHTML = this.file.getName();                       \r
+               },\r
+               textWidth : function(){\r
+                       this.elm.style.width = 'auto';\r
+                       var ret = this.elm.offsetWidth;\r
+                       this.elm.style.width = '';\r
+                       return ret + 15;\r
+               },\r
+               update : function( x, w ){\r
+                       this.node.update( x - 15, undefined, w );\r
+               },\r
+               index : function( _index ){\r
+                       return this._index;\r
+               },\r
+               destroy : function(){\r
+                       this.finderData.elmPath.removeChild( this.elm );\r
+                       this.node && this.node.remove();\r
+                       \r
+                       delete this.finderData;\r
+                       delete this.elm;\r
+                       delete this.node;\r
+                       delete this.file;\r
+                       delete this._index;\r
+                       PathClass.pool.push( this );\r
+               }\r
+       };\r
+       PathClass.pool = [];\r
+       PathClass.get  = function( finderData, file, index ){\r
+               var _bread = PathClass.pool.length > 0 ? PathClass.pool.shift() : new PathClass();\r
+               _bread.init( finderData, file, index );\r
+               return _bread;\r
+       };\r
+       \r
+       \r
+       /**\r
+        * Page\r
+        */\r
+       var PageClass = function(){};\r
+       PageClass.prototype = {\r
+               nodeRoot     : null,\r
+               elmRoot      : null,\r
+               elmScroll    : null,\r
+               elm          : null,\r
+               node         : null,\r
+               folder       : null,\r
+               iconList     : null,\r
+               sliding      : false,\r
+               currentX     : 0,\r
+               panTime      : 0,\r
+               startX       : 0,\r
+               offsetX      : 0,\r
+               panTotalTime : 0,\r
+               isPanOut     : false,\r
+               init : function( nodeRoot, elmRoot, elmScroll ){\r
+                       this.nodeRoot  = nodeRoot;\r
+                       this.elmRoot   = elmRoot;\r
+                       this.elmScroll = elmScroll;\r
+                       \r
+                       if( this.elm === null ){\r
+                               this.elm = document.createElement( 'div' );\r
+                       };\r
+                       elmScroll.appendChild( this.elm );\r
+                       this.elm.style.cssText = 'position:absolute;top:0;';\r
+                       // this.elm.style.display = 'none';\r
+                       this.node = this.nodeRoot.createNode( this.elm, true, false );\r
+                       if( this.iconList === null ){\r
+                               this.iconList = [];\r
+                       };\r
+               },\r
+               panInReady : function( way ){\r
+                       this.elm.style.display = '';\r
+                       var x = this.sliding === true ? this.currentX : way * this.nodeRoot.width();\r
+                       this.startX       = this.currentX = x;\r
+                       this.targetX      = 0;\r
+                       this.offsetX      = -x;\r
+                       this.panTime      = 0;\r
+                       this.panTotalTime = 20;\r
+                       this.sliding      = true;\r
+                       this.isPanOut     = false;\r
+                       // this.elm.style.left = x + 'px';\r
+                       this.node.x( x );\r
+               },\r
+               panOutReady : function( way ){\r
+                       var x = -way * this.nodeRoot.width();\r
+                       this.startX       = this.currentX || 0;\r
+                       this.targetX      = x;\r
+                       this.offsetX      = x - this.startX;\r
+                       this.panTime      = 0;\r
+                       this.panTotalTime = 20;\r
+                       this.sliding      = true;\r
+                       this.isPanOut     = true;\r
+               },\r
+               pan : function(){\r
+                       var page = this,\r
+                               x    = page.currentX = easeOutQuad( page.panTime, page.startX, page.offsetX, page.panTotalTime );\r
+                       // page.elm.style.left = x + 'px';\r
+                       this.node.x( x );\r
+                       if( page.panTotalTime < ++page.panTime ){\r
+                               delete page.panTime;\r
+                               delete page.startX;\r
+                               delete page.offsetX;                                    \r
+                               delete page.panTotalTime;\r
+                               delete page.sliding;\r
+                               if( this.isPanOut === true ) this.elm.style.display = 'none';\r
+                       };\r
+               },\r
+               draw : function( folder ){\r
+                       var _w = this.nodeRoot.width();\r
+                       this.folder = folder;\r
+                       var data     = this,\r
+                               iconList = data.iconList,\r
+                               i        = 0,\r
+                               j        = 0,\r
+                               l        = folder.getChildFileLength(),\r
+                               m        = iconList.length,\r
+                               scrollY  = -this.nodeRoot.scrollY(),\r
+                               rootH    = scrollY + this.nodeRoot.height(),\r
+                               icon;\r
+\r
+                       for( ; i < l; ++i ){\r
+                               if( ( i + 1 ) * ICON_HEIGHT < scrollY || rootH < i * ICON_HEIGHT ) continue;\r
+                               if( j < m ){\r
+                                       iconList[ j ].init( this, folder.getChildFileAt( i ), _w, i, data.style );\r
+                               } else {\r
+                                       iconList.push( FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );\r
+                               };\r
+                               j++;\r
+                       };\r
+                       data.elmRoot.className    = folder.getState() === Const.FILE.STATE.LOADING ? 'finder-body loading' : 'finder-body';\r
+                       // data.elmRoot.style.height = ( data.h - data.headH ) + 'px';\r
+                       \r
+                       while( j < iconList.length ) iconList.pop().destroy();\r
+                       data.elmScroll.style.height = ( l * ICON_HEIGHT ) + 'px';\r
+               },\r
+               onScroll : function(){\r
+                       var _w       = this.nodeRoot.width();\r
+                       \r
+                       var data     = this,\r
+                               iconList = data.iconList,\r
+                               folder   = this.folder,\r
+                               i        = 0,\r
+                               j        = 0,\r
+                               l        = folder.getChildFileLength(),\r
+                               scrollY  = -this.nodeRoot.scrollY(),\r
+                               rootH    = scrollY + this.nodeRoot.height(),\r
+                               startIndex = 0 < iconList.length ? iconList[ 0 ]._index : 0,\r
+                               icon;\r
+                       \r
+                       // console.log( ' > ' + scrollY + ' , ' + rootH )\r
+                       for( ; i < l; ++i ){\r
+                               if( ( i + 1 ) * ICON_HEIGHT < scrollY || rootH < i * ICON_HEIGHT ){\r
+                                       if( iconList.length <= j ) continue;\r
+                                       icon = iconList[ j ];\r
+                                       if( icon._index !== i ) continue;\r
+                                       icon.destroy();\r
+                                       iconList.splice( j, 1 );\r
+                                       continue;\r
+                               };\r
+                               if( iconList.length <= j || iconList[ j ]._index !== i ){\r
+                                       if( i < startIndex ){\r
+                                               iconList.splice( j, 0, FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );                    \r
+                                       } else\r
+                                       if( startIndex + iconList.length <= i ){\r
+                                               iconList.push( FinderIconClass.get( this, folder.getChildFileAt( i ), _w, i, data.style ) );                    \r
+                                       };                                      \r
+                               };\r
+                               ++j;\r
+                       };\r
+                       \r
+                       //while( j < iconList.length ) iconList.pop().destroy();\r
+               },\r
+               resize : function( w ){\r
+                       var list = this.iconList,\r
+                               i    = list.length;\r
+                       for( ; i; ) list[ --i ].resize( w );\r
+               },\r
+               destroy : function(){\r
+                       var icon;\r
+                       while( icon = this.iconList.shift() ) icon.destroy();\r
+                       \r
+                       this.elm.parentNode.removeChild( this.elm );\r
+               }\r
+       };\r
+       \r
+       var ApplicationButton = function(){};\r
+       ApplicationButton.prototype = {\r
+               elm     : null,\r
+               button  : null,\r
+               app     : null,\r
+               file    : null,\r
+               fileUID : -1,\r
+               init    : function( ui, elmParent, app, file ){\r
+                       if( this.elm === null ){\r
+                               this.elm = document.createElement( 'div' );\r
+                       };\r
+                       elmParent.appendChild( this.elm );\r
+                       this.elm.className = 'button';\r
+                       this.elm.innerHTML = app.getDisplayName();\r
+                       \r
+                       var that = this;\r
+                       this.button = ui.createButton( this.elm, function(){\r
+                               that.onClick();\r
+                               // that = null;\r
+                       } );\r
+                       \r
+                       this.app     = app;\r
+                       this.file    = file;\r
+                       this.fileUID = file.getUID();\r
+               },\r
+               onClick : function(){\r
+                       this.app.boot( this.file );\r
+                       return false;\r
+               },\r
+               destroy : function(){\r
+                       var elm = this.elm;\r
+                       elm.parentNode.removeChild( elm );\r
+                       \r
+                       this.button.destroy();\r
+                       //this.kill()\r
+                       //this.elm = elm;\r
+               }\r
+       };\r
+       \r
+       var DetailPageClass = function(){};\r
+       DetailPageClass.prototype = Util.extend( new PageClass(), {\r
+               appButtons : null,\r
+               init : function( finderData ){\r
+                       this.finderData = finderData;\r
+                       this.apiuser    = finderData.apiuser;\r
+                       this.nodeRoot   = finderData.nodeRoot;\r
+                       this.elmRoot    = finderData.elmRoot;\r
+                       this.elmScroll  = finderData.elmScroll;\r
+                       \r
+                       if( this.elm === null ){\r
+                               this.elm = Util.pullHtmlAsTemplete( [\r
+                                       '<div class="finder-detail">',\r
+                                               '<div class="file-icon"><div></div></div>',\r
+                                               '<div class="finder-detail-filename break-word">file name</div>',\r
+                                               '<div class="finder-detail-summary break-word">file descriptiion</div>',\r
+                                               '<div>View this file</div>',\r
+                                               '<div class="viewer-apps"></div>',                                              \r
+                                               '<div>Edit this file</div>',\r
+                                               '<div class="editor-apps"></div>',\r
+                                       '</div>'\r
+                               ].join( '' ) );\r
+                       };\r
+                       this.elm.style.display = 'none';\r
+                       this.elmScroll.appendChild( this.elm );\r
+                       this.node = this.nodeRoot.createNode( this.elm, true, false );\r
+                       \r
+                       this.ui = this.apiuser.createUIGroup( this.node );\r
+                       this.appButtons = [];\r
+               },\r
+               draw : function( file ){\r
+                       var elm        = this.elm,\r
+                               thumb      = file.getThumbnail(),\r
+                               elmThumb   = Util.getElementsByClassName( elm, 'file-icon' )[ 0 ].firstChild,\r
+                               elmName    = Util.getElementsByClassName( elm, 'finder-detail-filename' )[ 0 ],\r
+                               elmDesc    = Util.getElementsByClassName( elm, 'finder-detail-summary' )[ 0 ],\r
+                               tmpButtons = Util.copyArray( this.appButtons ),\r
+                               apps, app, elmContainer, button;\r
+                       if( thumb.image ){\r
+                               elmThumb.className = 'has-thumbnail';\r
+                               elmThumb.style.backgroundImage = [ 'url(', thumb.image, ')' ].join( '' );\r
+                       } else {\r
+                               elmThumb.className = thumb.className;\r
+                               elmThumb.style.backgroundImage = '';\r
+                       };\r
+                       \r
+                       elmName.firstChild.data = file.getName();\r
+                       elmDesc.firstChild.data = file.getSummary();\r
+                       this.node.width( this.nodeRoot.width() );\r
+                       this.node.height( this.nodeRoot.height() );\r
+                       \r
+                       this.appButtons.length = 0;\r
+                       \r
+                       apps         = file.viewerApplicationList();\r
+                       elmContainer = Util.getElementsByClassName( elm, 'viewer-apps' )[ 0 ];\r
+                       for( i = 0; i < apps.length; ++i ){\r
+                               button = 0 < tmpButtons.length ? tmpButtons.shift() : new ApplicationButton();\r
+                               button.init( this.ui, elmContainer, apps[ i ], file );\r
+                               this.appButtons.push( button );\r
+                       };\r
+                       apps         = file.editorApplicationList();\r
+                       elmContainer = Util.getElementsByClassName( elm, 'editor-apps' )[ 0 ];\r
+                       for( i = 0; i < apps.length; ++i ){\r
+                               button = 0 < tmpButtons.length ? tmpButtons.shift() : new ApplicationButton();\r
+                               button.init( this.ui, elmContainer, apps[ i ], file );\r
+                               this.appButtons.push( button );\r
+                       };\r
+                       \r
+                       while( button = tmpButtons.shift() ) button.destroy();\r
+                       \r
+                       this.resize();\r
+               },\r
+               pan : function(){\r
+                       var page = this,\r
+                               x    = page.currentX = easeOutQuad( page.panTime, page.startX, page.offsetX, page.panTotalTime );\r
+                       // page.elm.style.left = x + 'px';\r
+                       this.node.x( x );\r
+                       if( page.panTotalTime < ++page.panTime ){\r
+                               delete page.panTime;\r
+                               delete page.startX;\r
+                               delete page.offsetX;                                    \r
+                               delete page.panTotalTime;\r
+                               delete page.sliding;\r
+                               if( this.isPanOut === true ) this.elm.style.display = 'none';\r
+                       };\r
+               },\r
+               onScroll : function(){\r
+                       \r
+               },\r
+               resize : function(){\r
+                       this.elmScroll.style.height = this.nodeRoot.height() + 'px';\r
+               },\r
+               destroy : function(){\r
+                       var button;\r
+                       while( button = this.appButtons.shift() ) button.destroy();\r
+                       this.ui.destroy();\r
+                       this.node.remove();\r
+               }\r
+       });\r
+       \r
+/**\r
+ * FinderPrivateData\r
+ */\r
+       var FinderPrivateData = Class.create(\r
+               Class.PRIVATE_DATA, {\r
+               finder       : null,\r
+               apiuser      : null,\r
+               elmRoot      : null,\r
+               nodeRoot     : null,\r
+               elmScroll    : null,\r
+               elmPath      : null,\r
+               nodePath     : null,\r
+               tree         : null,\r
+               onSelect     : null,\r
+               viewerOption : null,\r
+               editorOption : null,\r
+               pathList     : null,\r
+               headH        : 0,\r
+               iconW        : 0,\r
+               iconH        : 0,\r
+               style        : 0,\r
+               pageIcons1   : null,\r
+               pageIcons2   : null,\r
+               panInPage    : null,\r
+               panOutPage   : null,\r
+               pageDetail   : null,\r
+               currentFile  : null,\r
+               Constructor : function( finder, apiuser, elm, tree, onSelect, viewerOption, editorOption ){\r
+                       this.finder       = finder;\r
+                       this.apiuser      = apiuser;\r
+                       if( PointingDeviceEventTree.isNodeInstance( elm ) === true ){\r
+                               this.nodeRoot = elm;\r
+                               this.elmRoot  = PointingDeviceEventTree._getNodePrivateData( elm ).elm;\r
+                       } else {\r
+                               // App が eventTree を持っている?\r
+                               // App が eventTree を持っていない\r
+                               this.elmRoot  = elm;\r
+                       };\r
+                       this.nodeRoot.addEventListener( 'click', this.onIconClick, this );\r
+                       this.nodeRoot.addEventListener( 'scroll', this.onScroll, this );\r
+                       \r
+                       this.elmScroll    = document.createElement( 'div' );\r
+                       this.elmRoot.appendChild( this.elmScroll );\r
+                       this.elmScroll.className     = 'finder-elm-scroll';\r
+                       this.elmScroll.style.cssText = 'width:100%;overflow:hidden;';\r
+                       \r
+                       this.tree         = tree;\r
+                       this.onSelect     = onSelect;\r
+                       this.viewerOption = viewerOption;\r
+                       this.editorOption = editorOption;\r
+                       \r
+                       var size          = Util.getElementSize( ELM_ORIGIN_FINDER_ICON );\r
+                       this.iconW        = size.width;\r
+                       this.iconH        = size.height;\r
+                       \r
+                       tree.addTreeEventListener( Const.TREE.EVENT.UPDATE, this.draw, this );\r
+                       Util.addClass( this.elmRoot, 'finder-body' );\r
+                       \r
+                       if( this.panInPage === null ){\r
+                               this.pageIcons1 = new PageClass();\r
+                               this.pageIcons2 = new PageClass();\r
+                               this.pageDetail = new DetailPageClass();\r
+                       };\r
+                       this.pageIcons1.init( this.nodeRoot, this.elmRoot, this.elmScroll );\r
+                       this.pageIcons2.init( this.nodeRoot, this.elmRoot, this.elmScroll );\r
+                       this.pageDetail.init( this );\r
+               },\r
+               onIconClick : function( e ){\r
+                       if( this.panInPage === this.pageDetail ) return;\r
+                       \r
+                       var target = e.target,\r
+                               list   = this.panInPage.iconList,\r
+                               i, icon,\r
+                               file;\r
+                       if( target === this.nodeRoot ) return;\r
+                       for( i = list.length; i; ){\r
+                               icon = list[ --i ];\r
+                               if( icon.node === target ){\r
+                                       i = icon._index;\r
+                                       file = this.currentFile.getChildFileAt( i );\r
+                                       if( target.width() - 30 < e.layerX ){\r
+                                               this.tree.down( i );\r
+                                               this.draw( this.w, this.h, 1, true );\r
+                                       } else\r
+                                       if( file.getChildFileLength() !== -1 || file.getType() === Const.FILE.TYPE.FOLDER ){\r
+                                               this.tree.down( i );\r
+                                               this.draw( this.w, this.h, 1 );\r
+                                       } else\r
+                                       if( Type.isFunction( this.onSelect ) === true ){ /* && this.onSelect( file ) === true */\r
+                                               this.onSelect( file );\r
+                                       } else {\r
+                                               this.tree.down( i );\r
+                                               this.draw( this.w, this.h, 1 );\r
+                                       };\r
+                                       file.destroy();\r
+                                       break;\r
+                               };\r
+                       };\r
+               },\r
+               onScroll : function( e ){\r
+                       this.panInPage.onScroll( e );\r
+               },\r
+               onPathClick : function( e ){\r
+                       var target = e.target,\r
+                               i      = target.nodeIndex();\r
+                       if( target === this.nodePath || this.nodePath.numNode() - 1 === i ) return;\r
+                       this.tree.up( i );\r
+                       this.draw( this.w, this.h, -1 );\r
+               },\r
+               draw : function( w, h, way, showDetail ){\r
+                       var data = this, page;\r
+                       data.w = w = Type.isFinite( w ) === true ? w : data.w;\r
+                       data.h = h = Type.isFinite( h ) === true ? h : data.h;\r
+                       \r
+                       var file     = this.currentFile = this.tree.getCurrentFile(),\r
+                               isFolder = showDetail !== true && ( file.getChildFileLength() !== -1 || file.getType() === Const.FILE.TYPE.FOLDER );\r
+                       \r
+                       data.elmPath && data.drawPath( w );\r
+                       page = this.panInPage;\r
+                       if( Type.isNumber( way ) === true ){\r
+                               if( page.sliding === false ){\r
+                                       if( isFolder === true ){\r
+                                               this.panInPage = page === this.pageIcons1 ? this.pageIcons2 : ( page === this.pageIcons2 ? this.pageIcons1 : this.panOutPage );\r
+                                       } else {\r
+                                               this.panInPage = this.pageDetail;\r
+                                       };\r
+                                       this.panOutPage = page;\r
+                               };\r
+                               this.panInPage.panInReady( way );\r
+                               //this.panInPage.elm.className = 'panIN';\r
+                               this.panOutPage.panOutReady( way );\r
+                               //this.panOutPage.elm.className = 'panOut';\r
+                               this.nodeRoot.disabled( true );\r
+                               SystemTimer.add( this.apiuser, this.tick, 16, false, this );\r
+                       } else {\r
+                               if( isFolder === true ){\r
+                                       this.panInPage = page === null ? this.pageIcons1 : page;\r
+                               } else {\r
+                                       this.panInPage = this.pageDetail;\r
+                               };\r
+                       };\r
+                       this.panInPage.draw( file );\r
+                       \r
+                       data.nodeRoot.invalidateScrollbar();\r
+               },\r
+               tick : function(){\r
+                       if( this.panInPage.sliding === false && this.panOutPage.sliding === false ){\r
+                               SystemTimer.remove( this.apiuser, this.tick );\r
+                               this.nodeRoot.disabled( false );\r
+                               this.nodeRoot.invalidateScrollbar();\r
+                               return;\r
+                       };\r
+                       this.panInPage.sliding === true && this.panInPage.pan();\r
+                       this.panOutPage.sliding  === true && this.panOutPage.pan();\r
+               },\r
+               drawPath : function( w ){\r
+                       if( !this.elmPath.parentNode ) return;\r
+                       w = this.nodePath.width();\r
+                       var data      = this,\r
+                               tree      = data.tree,\r
+                               pathList  = data.pathList,\r
+                               i         = 0,\r
+                               l         = tree.hierarchy() + 1,\r
+                               m         = pathList.length,\r
+                               wList     = [],\r
+                               totalW    = 0,\r
+                               minW      = FinderPrivateData.MIN_PATH_WIDTH,\r
+                               file, path, pathW, offset, remove, pathX = 0, fit = false;\r
+                       \r
+                       for( ; i < l; ++i ){\r
+                               file = i !== l - 1 ? tree.getParentFileAt( i ) : this.currentFile;\r
+                               if( i < m ){\r
+                                       pathList[ i ].init( this, file, i );\r
+                               } else {\r
+                                       pathList.push( PathClass.get( this, file, i ) );\r
+                               };\r
+                       };\r
+                       while( l < pathList.length ) pathList.pop().destroy();\r
+                       \r
+                       for( i = l; i; ){\r
+                               pathW = pathList[ --i ].textWidth();\r
+                               wList.push( pathW );\r
+                               totalW += pathW;\r
+                       };\r
+                       \r
+                       //if( minW * ( l + 1 ) * 1.2 < w ){\r
+                               console.log( totalW + ' , ' + w )\r
+                               while( true ){\r
+                                       if( fit === true ) break;\r
+                                       for( i = 0; i < l; ++i ){\r
+                                               offset = totalW - w;\r
+                                               if( offset <= 0 ){\r
+                                                       fit = true;\r
+                                                       break;\r
+                                               };\r
+                                               remove = l - i;\r
+                                               remove = offset < remove ? offset : remove;\r
+                                               pathW  = wList[ i ];\r
+                                               if( pathW - remove < minW ){\r
+                                                       totalW -= ( pathW - minW );\r
+                                                       wList[ i ] = minW;\r
+                                               } else {\r
+                                                       wList[ i ] = pathW - remove;\r
+                                                       totalW -= remove;\r
+                                               };\r
+                                       };\r
+                               };\r
+                               for( i = 0; i < l; ++i ){\r
+                                       path  = pathList[ i ];\r
+                                       pathW = wList[ i ];\r
+                                       path.update( pathX, pathW );\r
+                                       pathX += pathW;\r
+                               };                      \r
+                       //} else {\r
+                               \r
+                       //};\r
+               },\r
+               createPath : function( node ){\r
+                       if( this.elmPath ) return;\r
+                       \r
+                       if( PointingDeviceEventTree.isNodeInstance( node ) === true ){\r
+                               this.nodePath = node;\r
+                               this.elmPath  = PointingDeviceEventTree._getNodePrivateData( node ).elm;\r
+                               \r
+                               node.addEventListener( 'click', this.onPathClick, this );\r
+                               Util.addClass( this.elmPath, 'finder-path' );\r
+                               // this.elmPath  = document.createElement( 'div' );\r
+                               // this.elmPath.className = ;\r
+                               this.pathList = [];\r
+                               // this.headH    = 0;\r
+                               AsyncCall.add( this.apiuser, this.draw, null, this );\r
+                       };\r
+               },\r
+               onKill : function(){\r
+                       this.tree.removeTreeEventListener( Const.TREE.EVENT.UPDATE, this.draw );\r
+\r
+                       if( this.pathList ){\r
+                               while( this.pathList.length > 0 ) this.pathList.shift().destroy();\r
+                       };\r
+                       \r
+                       this.pageIcons1.destroy();\r
+                       this.pageIcons2.destroy();\r
+                       this.pageDetail.destroy();\r
+                       this.nodeRoot.remove();\r
+                       \r
+                       FINDER_LIST.splice( Util.getIndex( FINDER_LIST, this.finder ), 1 );\r
+                       var data = ApplicationPrivateData.get( this.apiuser ),\r
+                               list = data.finderList,\r
+                               i    = Util.getIndex( list, this.finder );\r
+                       i !== -1 && list.splice( i, 1 );\r
+               }\r
+       });\r
+       FinderPrivateData.MIN_PATH_WIDTH = 25;\r
+\r
+/**\r
+ * FinderClass\r
+ */\r
+       var Finder = Class.create(\r
+               FinderPrivateData, {\r
+               Constructor : function( application, elmRoot, tree, onSelect, viewerOption, editorOption ){\r
+                       Finder.newPrivateData( this, this, application, elmRoot, tree, onSelect, viewerOption, editorOption );\r
+               },\r
+               MIN_WIDTH  : 200,\r
+               MIN_HEIGHT : 200,\r
+               resize : function( w, h ){\r
+                       var data = Finder.getPrivateData( this );\r
+                       data.panInPage && data.panInPage.resize( w );\r
+               },\r
+               createPath : function( node ){\r
+                       return Finder.getPrivateData( this ).createPath( node );\r
+               },\r
+               destroy : function(){\r
+                       this.kill();\r
+               }\r
+       });\r
+\r
+       return {\r
+               init: function(){\r
+                       \r
+               },\r
+               create: function( application, elmTarget, tree, onSelect, viewerOption, editorOption ){\r
+                       //if( Application.isApplicationInstance( _application ) === false ) return;\r
+                       \r
+                       var finder = new Finder( application, elmTarget, tree, onSelect, viewerOption, editorOption );\r
+                       FINDER_LIST.push( finder );\r
+                       return finder;\r
+               },\r
+               registerFinderHead: function(){\r
+                       \r
+               },\r
+               registerFinderPane: function( _finderPane ){\r
+                       \r
+               },\r
+               isFinderInstance: function( _finder ){\r
+                       return _finder instanceof Finder;\r
+               },\r
+               isFinderPaneInstance: function(){\r
+                       \r
+               },\r
+               isFinderHeadInstance: function(){\r
+               }\r
+       };\r
+})();\r
+\r
+\r
+/*\r
+ * -- len, %\r
+ * marginBottom, marginLeft, marginRight, marginTop, margin\r
+ * padding, paddingBottom, paddingLeft, paddingRight, paddingTop\r
+ * fontSize, textIndent\r
+ * height, width\r
+ * bottom, left, right, top                    (len, %)\r
+ *\r
+ * -- len\r
+ * borderBottomWidth, borderLeftWidth, borderRightWidth, borderTopWidth, borderWidth,\r
+ * letterSpacing\r
+ *\r
+ * -- color\r
+ * backgroundColor\r
+ * borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, borderColor\r
+ * color\r
+ *\r
+ * -- special\r
+ * clip                        rect(0px, 40px, 40px, 0px);\r
+ * backgroundPosition  (len, %)\r
+ * opacity\r
+ * lineHeight          (len, %, num)\r
+ * zIndex                      ( order )\r
+ */\r
+\r
+var DHTML = ( function(){\r
+       \r
+       var TICKET_ARRAY = [],\r
+               fpms         = 50,\r
+               round        = Math.round,\r
+               cround       = function( v ){ return round( v * 100 ) / 100 };\r
+       \r
+       function startAnimation( _elm, _cssObject, _onComplete, _onEnterFrame, _numFrames ){\r
+               var _ticket, i = TICKET_ARRAY.length;\r
+               for( ; i; ){\r
+                       _ticket = TICKET_ARRAY[ --i ];\r
+                       if( _ticket.elm === _elm ){\r
+                               return;\r
+                       };\r
+               };\r
+               \r
+               var _currentValues     = [],\r
+                       _offsetValues      = [],\r
+                       _endValues         = [],\r
+                       _targetProperties  = [],\r
+                       _units             = [];\r
+               var target, current,\r
+                       inlineStyle    = CSS.getInlineStyle( _elm ),\r
+                       currentStyle   = CSS.getWrappedStyle( _elm ),\r
+                       targetStyle    = CSS.getWrappedStyle( _elm, _cssObject );\r
+                       targetStyle.pxPerEm = currentStyle.get( 'fontSize' )._toPx();\r
+               for( var p in _cssObject ){\r
+                       p       = Util.camelize( p );\r
+                       target  = targetStyle.get( p );\r
+                       current = currentStyle.get( p );\r
+\r
+                       if( target.isValid() === false || current.isValid() === false || current.equal( target ) !== false ){\r
+                               target.clear();\r
+                               current.clear();\r
+                               continue;\r
+                       };\r
+                       \r
+                       current.convert( target );\r
+                       // alert( current.getValue() + ' , ' + target.getValue() )\r
+                       _currentValues.push( current.getValue() );\r
+                       _offsetValues.push( current.getOffset( target ) );\r
+                       _endValues.push( target.getValue() );\r
+                       _targetProperties.push( p );\r
+                       _units.push( target.getUnit() );\r
+\r
+                       // IE has trouble with opacity if it does not have layout\r
+                       // Force it by setting the zoom level                   \r
+                       if( p === 'opacity' && SPECIAL.hasLayout ){\r
+                               if( SPECIAL.hasLayout( _elm ) === false ) inlineStyle.zoom = 1;\r
+                               inlineStyle.filter = current.getValueText();\r
+                       } else {\r
+                               inlineStyle[ p ]   = current.getValueText();\r
+                       };\r
+                       \r
+                       target.clear();\r
+                       current.clear();\r
+               };\r
+               \r
+               var i, cssTexts = [];\r
+               for( i = 0; i < _numFrames; ++i ){\r
+                       if( i < _numFrames - 1 ){\r
+                               tickValue( _currentValues, _offsetValues, _numFrames );\r
+                               cssTexts.push( createCssText( _currentValues, _targetProperties, targetStyle, inlineStyle ) );\r
+                       } else {\r
+                               cssTexts.push( createCssText( _endValues, _targetProperties, targetStyle, inlineStyle ) );\r
+                       };\r
+               };\r
+               \r
+               TICKET_ARRAY.push( new AnimationTaskClass(\r
+                       _elm, cssTexts,\r
+                       Type.isFunction( _onComplete ) === true   ? _onComplete   : null,\r
+                       Type.isFunction( _onEnterFrame ) === true ? _onEnterFrame : null,\r
+                       _numFrames\r
+               ) );\r
+               \r
+               currentStyle.clear();\r
+               targetStyle.clear();            \r
+               SystemTimer.add( SUPER_USER_KEY, onEnterFrame, 1000 / fpms );\r
+       };\r
+       \r
+       function tickValue( current, offset, numFrames ){\r
+               if( Type.isArray( current ) === true ){\r
+                       var ret, i = current.length;\r
+                       for( ; i; ){\r
+                               --i;\r
+                               ret = tickValue( current[ i ], offset[ i ], numFrames );\r
+                               if( Type.isNumber( ret ) === true ) current[ i ] = ret;\r
+                       };\r
+               } else {\r
+                       return current + offset / numFrames;\r
+               };\r
+       };\r
+       function createCssText( update, props, style, inline ){\r
+               var prop;\r
+               for( var i = props.length; i; ){\r
+                       prop = style.get( props[ --i ] );\r
+                       prop.setValue( update[ i ] );\r
+                       inline[ Util.uncamelize( prop.name ) ] = prop.getValueText();\r
+                       //if( prop.name === 'backgroundColor' ) alert( prop.getValueText() + '|' + update[ i ].join( ',') )\r
+                       prop.clear();\r
+               };\r
+               return CSS.toCssText( inline );\r
+       };\r
+       \r
+       function onEnterFrame(){\r
+               var _ticket, l,\r
+                       i = 0;\r
+               while( i < TICKET_ARRAY.length ){\r
+                       _ticket = TICKET_ARRAY[ i ];\r
+                       l       = _ticket.cssTexts.length;\r
+                       _ticket.elm.style.cssText = _ticket.cssTexts.shift();\r
+                       if( l === 1 ){\r
+                               _ticket.onComplete && _ticket.onComplete();\r
+                               delete _ticket.elm;\r
+                               delete _ticket.cssTexts;\r
+                               delete _ticket.onComplete;\r
+                               delete _ticket.onEnterFrame;\r
+                               delete _ticket.numFrame;\r
+                               TICKET_ARRAY.splice( i, 1 );\r
+                       } else {\r
+                               _ticket.onEnterFrame && _ticket.onEnterFrame( l / _ticket.numFrame );\r
+                               ++i;\r
+                       };\r
+               };\r
+               if( TICKET_ARRAY.length === 0 ){\r
+                       SystemTimer.remove( SUPER_USER_KEY, onEnterFrame );\r
+               };\r
+       };\r
+       \r
+       var AnimationTaskClass = function( elm, cssTexts, onEnterFrame, onComplete, numFrame ){\r
+               this.elm          = elm;\r
+               this.cssTexts     = cssTexts;\r
+               this.onEnterFrame = onEnterFrame;\r
+               this.onComplete   = onComplete;\r
+               this.numFrame     = numFrame;\r
+       };\r
+       \r
+       var VisualEffectClass = function( elm ){\r
+               this.elm = elm;\r
+       };\r
+       VisualEffectClass.prototype = {\r
+               anime : function( _cssObject, _onComplete, _onEnterFrame, _time ){\r
+                       var _numFrames = Math.floor( _time / fpms );\r
+                       startAnimation( this.elm, _cssObject, _onComplete, _onEnterFrame, _numFrames );\r
+               },\r
+               fadeIn : function(){\r
+                       \r
+               },\r
+               fadeOut : function(){\r
+                       \r
+               },\r
+               update : function( x, y, w, h ){\r
+                       var _cssText = this.elm.style.cssText;\r
+               }\r
+       };\r
+       \r
+       return {\r
+               create: function( application, _elm ){\r
+                       return new VisualEffectClass( _elm );\r
+               },\r
+               isInstanceOfVisualEffect: function( _instance){\r
+                       return _instance instanceof VisualEffectClass;\r
+               }\r
+       }\r
+})();\r
+\r
+\r
+/* --------------------------------------------\r
+ * \r
+ */\r
+\r
+       Application.onCurrentApplicationChange( SUPER_USER_KEY );\r
+       \r
+       SERVICE_LIST.push( MouseEvent );\r
+       \r
+       new EventTicketClass( window, 'unload', function(){\r
+               var _service;\r
+               while( SERVICE_LIST.length > 0 ){\r
+                       _service = SERVICE_LIST.shift();\r
+                       Type.isFunction( _service.onSystemShutdown ) === true && _service.onSystemShutdown();\r
+               }\r
+       });\r
+       // beforeunload\r
+\r
+\r
+/* ---------------------------------------------\r
+ * broadcast to global\r
+ */\r
+       window.gOS = {};\r
+       \r
+       gOS.registerApplication = Application.register;\r
+       gOS.registerDriver      = File.registerDriver;\r
+       \r
+})( window, document );\r