4 * http://d.hatena.ne.jp/uupaa/20100430/1272561922
8 if( window.addEventListener ){
9 X.Dom.Event = function( e, xnode ){
13 //http://www.quirksmode.org/js/events_properties.html
14 this.target = Node._getXNode( e.target.nodeType === 3 ? e.target.parentNode : e.target );// defeat Safari bug // xnode
16 this.currentTarget = xnode; // xnode
17 this.relatedTarget = Node._getXNode( e.relatedTarget ); // xnode
18 this.eventPhase = e.eventPhase;
20 this.clientX = e.clientX;
21 this.clientY = e.clientY;
22 //this.screenX = e.screenX;
23 //this.screenY = e.screenY;
26 this.offsetX = e.offsetX || e.layerX;
27 this.offsetY = e.offsetY || e.layerY;
29 this.keyCode = e.keyCode;
30 this.altKey = e.altKey;
31 this.ctrlKey = e.ctrlKey;
32 this.shiftKey = e.shiftKey;
34 // http://www.programming-magic.com/20090127231544/
35 this.which = e.which || ( e.button + 1 ); // 左:1, 中:2, 右:3
37 // https://developer.mozilla.org/ja/docs/DOM/DOM_event_reference/mousewheel
38 if( e.wheelDeltaY !== undefined ){
39 this.wheelDeltaX = e.wheelDeltaX / 12;
40 this.wheelDeltaY = e.wheelDeltaY / 12;
42 if( e.wheelDelta !== undefined ){
43 this.wheelDeltaX = this.wheelDeltaY = e.wheelDelta / 12;
45 if( e.detail !== undefined ){
46 this.wheelDeltaX = this.wheelDeltaY = - e.detail * 3;
48 this.wheelDeltaX = this.wheelDeltaY = 0;
51 if( e.constructor === window.TouchEvent ){
53 this.touches = e.touches;
54 this.changedTouches = e.changedTouches;
55 this.targetTouches = e.targetTouches;
56 this.metaKey = e.metaKey;
57 this.force = e.force || e.webkitForce || 0;
59 if( e.constructor === window.PointerEvent ){
61 this.currentPoint = e.currentPoint;
63 this.height = e.height;
64 this.timeStamp = e.timeStamp;
65 this.hwTimestamp = e.hwTimestamp;
66 this.intermediatePoints = e.intermediatePoints;
67 this.isPrimary = e.isPrimary;
68 this.pointerId = e.pointerId;
69 this.pointerType = e.pointerType;
70 this.pressure = e.pressure;
76 X.Dom.Event = function( e, xnode, element ){
81 this.target = Node._getXNode( e.srcElement ); // xnode
82 if( this.target && this.target._xnodeType === 3 ) this.target = this.target.parent; // ie4 の fake Textnode がヒットしていないか?
83 this.currentTarget = xnode; // xnode
84 this.relatedTarget = Node._getXNode( e.formElement ? e.formElement : e.toElement ); // xnode
85 this.eventPhase = e.srcElement === element ? 2: 3;
87 this.clientX = e.clientX;
88 this.clientY = e.clientY;
89 //this.screenX = e.screenX;
90 //this.screenY = e.screenY;
92 if( X.Dom._root ){ // uuu...
94 this.pageX = e.clientX + X.Dom._root.scrollLeft;
95 this.pageY = e.clientY + X.Dom._root.scrollTop;
98 //event.pageX = DOMAssistant.def(e.pageX)? e.pageX : (event.clientX + (de.scrollLeft || b.scrollLeft) - (de.clientLeft || 0));
99 //event.pageY = DOMAssistant.def(e.pageY)? e.pageY : (event.clientY + (de.scrollTop || b.scrollTop) - (de.clientTop || 0));
104 if( X.UA.IE && 5 <= X.UA.IE ){
105 this.offsetX = e.offsetX; // イベントターゲット左上からの座標
106 this.offsetY = e.offsetY;
108 //if( e.srcElement ){
109 // this.offsetX = e.x - e.srcElement.offsetLeft; // e.x はイベント発生要素の親要素を基準にした座標。
110 // this.offsetY = e.y - e.srcElement.offsetTop;
113 this.keyCode = e.keyCode;
114 this.altKey = e.altKey;
115 this.ctrlKey = e.ctrlKey;
116 this.shiftKey = e.shiftKey;
118 // http://www.programming-magic.com/20090127231544/
132 btn & 2 ? 3 : 0; // 左:1(click:0), 中:4, 右:2
134 this.wheelDeltaX = this.wheelDeltaY = e.wheelDelta / 12;
138 X.Dom.Event.DOM_PRE_INIT = 0;
139 X.Dom.Event.DOM_INIT = 1;
140 X.Dom.Event.XDOM_READY = 2;
141 X.Dom.Event.VIEW_ACTIVATE = 3;
142 X.Dom.Event.VIEW_DEACTIVATE = 4;
143 X.Dom.Event.VIEW_RESIZED = 5;
144 X.Dom.Event.BASE_FONT_RESIZED = 6;
145 // on_screen_keyboard_show
146 // on_screen_keyboard_hide
147 X.Dom.Event.BEFORE_UPDATE = 7;
148 X.Dom.Event.COMMIT_UPDATE = 8;
150 X.Dom.Event.BEFORE_UNLOAD = 9;
151 X.Dom.Event.UNLOAD = 10;
152 X.Dom.Event.LOAD_BEFORE_STOP = 11;
153 X.Dom.Event.LOAD_ASSET_STOP = 12;
154 X.Dom.Event.LOAD_ASSET_COMPLETE = 13;
155 X.Dom.Event.LOAD_ASSET_ERROR = 14;
157 X.Dom.Event.ANIME_BEFORE_START = 15;
158 X.Dom.Event.ANIME_START = 16;
159 X.Dom.Event.ANIME = 17;
160 X.Dom.Event.ANIME_END = 18;
161 X.Dom.Event.ANIME_BEFORE_STOP = 19; // xnode.stop() のみ、指定時間による停止では呼ばれない
162 X.Dom.Event.ANIME_STOP = 20;
163 X.Dom.Event._LAST_EVENT = 20; // ここに書いてあるイベントの最後の値 X.Dom.Event.ANIME_STOP と同じ値
166 X.Dom.Node.prototype.listen = function( type, arg1, arg2, arg3 /* [ listener || ( context + function ) || function ][ arguments ] */ ){
169 if( this._xnodeType === 0 || this._xnodeType === 3 || !arg1 ) return this;
171 ( !this._listeners || !this._listeners[ type ] ) && this._addEvent( type );
173 return typeof arg1 === 'function' ?
174 X.EventDispatcher.prototype.listen.call( this, type, this, arg1, arg2 ) :
175 X.EventDispatcher.prototype.listen.apply( this, arguments );
178 X.Dom.Node.prototype._addEvent =
179 document.removeEventListener ?
181 this._rawNode && this._rawNode.addEventListener( type, this, false );
183 document.detachEvent ?
185 if( !this._rawNode ) return;
186 this._handleEvent = this._handleEvent || X.Callback.create( this );
187 this._rawNode.attachEvent( 'on' + type, this._handleEvent );
190 var elm = this._ie4getRawNode();
192 this._handleEvent = elm[ 'on' + type ] = this._handleEvent || X.Callback.create( this );
196 X.Dom.Node.prototype.unlisten = function( type /* , arg1, arg2, arg3 */ ){
197 var list = this._listeners,
198 l = !this._dispatching && list && type !== undefined && list[ type ] && list[ type ].length;
200 X.EventDispatcher.prototype.unlisten.apply( this, arguments );
202 l && !list[ type ] && this._removeEvent( type );
207 X.Dom.Node.prototype._removeEvent =
208 document.removeEventListener ?
210 var elm = this._rawNode;
212 elm.removeEventListener( type, this, false );
214 document.detachEvent ?
216 var elm = this._rawNode;
218 elm.detachEvent( 'on' + type, this._handleEvent );
219 if( !this._listeners ){
220 X.Callback._correct( this._handleEvent );
221 delete this._handleEvent;
225 var elm = this._rawNode || this._ie4getRawNode();
227 elm[ 'on' + type ] = X.emptyFunction;
228 elm[ 'on' + type ] = '';
229 if( !this._listeners ){
230 X.Callback._correct( this._handleEvent );
231 delete this._handleEvent;
236 X.Dom.Node.prototype.handleEvent =
237 document.removeEventListener ?
239 var ret = X.EventDispatcher.prototype.dispatch.call( this, new X.Dom.Event( e, this ) );
241 if( ret & X.Callback.STOP_PROPAGATION ){
244 if( ret & X.Callback.PREVENT_DEFAULT ){
245 this._tag === 'A' && this._rawNode.blur();
251 var ret = X.EventDispatcher.prototype.dispatch.call( this, new X.Dom.Event( event, this, this._rawNode ) );
253 if( ret & X.Callback.STOP_PROPAGATION ){
254 event.cancelBubble = true;
256 if( ret & X.Callback.PREVENT_DEFAULT ){
257 this._tag === 'A' && this._rawNode.blur();
258 return event.returnValue = false;
263 // イベントの退避、dom が画面から抜かれる場合に実施しておく
264 X.Dom.Node.prototype._migrateEvent = function(){
265 var hash = this._listeners,
269 this._removeEvent( type );
274 X.Dom.Node.prototype._restoreEvent = function(){
275 var hash = this._listeners,
279 this._addEvent( type );
285 /* -----------------------------------------------
287 * Dean Edwards/Matthias Miller/John Resig
289 /* for ie9+/Mozilla/Opera9 */
290 if( document.addEventListener ){
291 X.Dom.Node._document.listenOnce( 'DOMContentLoaded', X.Dom._init );
293 if( 5 <= X.UA.IE && X.inHead ){
294 // if this script in Head
295 document.write( "<script id=__ie_onload defer src=javascript:void(0)><\/script>" );
296 X.Dom._script = document.getElementById( "__ie_onload" );
297 X.Dom._script.onreadystatechange = function(){
298 this.readyState === 'complete' && X.Dom._init();
301 if( X.UA.WebKit ){ // sniff
302 X.Timer.add( 10, function(){
303 if( !X.Dom._init ) return X.Callback.UN_LISTEN;
304 if( 'loaded|complete'.indexOf( document.readyState ) !== -1 ) return X.Dom._init();
308 /* for other browsers */
309 X.Dom.Node._window.listenOnce( 'load', X.Dom._init );
312 X.Dom.listenOnce( X.Dom.Event.XDOM_READY, function(e){ console.log( 'X.Dom XDomReady ' + X.Dom.readyState ); } );
314 X.Dom.listenOnce( X.Dom.Event.VIEW_RESIZED, function(e){ console.log( 'X.Dom VIEW_RESIZED ' + e.w + 'x' + e.h ); } );
317 /* --------------------------------------
320 X.Dom.listenOnce( X.Dom.Event.DOM_INIT, function(){
322 Node._html = document.documentElement ?
323 new Node( document.documentElement ) :
324 document.getElementsByTagName ?
325 new Node( document.getElementsByTagName( 'html' )[ 0 ] ) :
327 new Node( document.all.tags( 'html' )[ 0 ] ) :
330 var r = Node.root = new Node( document.body ),
332 createTree, xnodes, s, i, n = 0;
333 r.appendTo = r.appendToRoot = r.before = r.after = r.clone = r.remove = r.destroy = r.prevNode = r.nextNode = new Function( 'return this' );
335 r._root = Node._html._root = r;
336 r.parent = Node._html;
337 Node._html._xnodes = [ r ];
338 //r.width = new Function( 'return X.Dom.getSize()[ 0 ]' );
339 //r.height = new Function( 'return X.Dom.getSize()[ 1 ]' );
341 // todo: cleanup tree
346 body.childNodes && (function( elm, skip, head ){
347 var me = arguments.callee,
348 moveToHead = 'style,bgsound,area,base,meta'.split( ',' ),
349 remove = 'script,noscript,noframes,comment,!,noembed,nolayer'.split( ',' ),
350 noncleanup = 'pre,textarea,code,kbd,samp,xmp,plaintext,listing'.split( ',' ),
351 nodes = X.copyArray( elm.childNodes ),
354 node, tag, textNode, content;
357 switch( node.nodeType ){
359 tag = node.tagName.toLowerCase();
360 if( moveToHead.indexOf( tag ) !== -1 ){
361 head = head || document.getElementsByTagName( 'head' )[ 0 ];
362 head.appendChild( node );
365 if( remove.indexOf( tag ) !== -1 ){
366 elm.removeChild( node );
369 // pre タグ以下はスペースの置換は行わない
370 node.childNodes && node.childNodes.length && me( node, skip || noncleanup.indexOf( tag ) !== -1, head );
375 content = skip ? node.data : X.Dom.cleanupWhiteSpace( node.data );
376 //console.log( 'Delete space ' + node.data.length + ' => ' + content.length );
377 if( !textNode && content !== ' ' && content.length ){
383 textNode.data += content; // 直前が TextNode の場合 一本化して削除
385 // ブロック要素直下のスペースだけは削除??
387 //console.log( 'Remove type: ' + node.nodeType + ' value: ' + node.nodeValue );
388 elm.removeChild( node );
396 (function( xnode, childNodes, skipCleanup, textarea ){
399 l = childNodes.length,
400 child, _xnode, f, tag, text, _xtext, doc;
401 childNodes = X.copyArray( childNodes );
404 xnode.attr( 'value', xnode.text() ).empty();
409 child = childNodes[ i ];
411 if( ( child.nodeType !== 1 && child.nodeType !== 3 ) || tag === '!' || ( tag && tag.charAt( 0 ) === '/' ) ){
412 child.parentNode.removeChild( child );
416 while( xnode._xnodes && j < xnode._xnodes.length ){
417 _xnode = xnode._xnodes[ j ];
418 _xnode.parent = xnode;
420 if( _xnode._xnodeType === 1 ){
421 if( child.nodeType !== 1 ){
422 if( !( text = child.data ) || ( text = X.Dom.cleanupWhiteSpace( text ) ) === ' ' ){
423 child.parentNode.removeChild( child );
426 alert( '[' +xnode._tag + '>' +_xnode._tag + '] !== ' + child.nodeType + '\n' + child.data );
430 if( _xnode._tag.toUpperCase() !== tag ){
431 alert( '[' +xnode._tag + '>' +_xnode._tag + ' ' + (_xnode._xnodes ? _xnode._xnodes.length : '' ) + '] !== ' + tag + ' ' + (child.childNodes ? child.childNodes.length : '' ) + '\n' + child.outerHTML );
435 _xnode._rawNode = child;
436 //if( ( doc = child.ownerDocument || child.document ) && ( doc.createElement( 'p' ).tagName === doc.createElement( 'P' ).tagName ) ){
437 if( tag.charAt( 0 ) === '/' ) tag = tag.slice( 1 );
438 _xnode._tag = tag; // .toUpperCase()
440 _xnode._root = xnode._root;
441 child.UID = _xnode._uid;
442 if( 0 <= X.Dom.cleanupTagNames.indexOf( tag.toLowerCase() ) || tag === 'SCRIPT' ){ // ie で body 内の script が2度よばれるのに対処
443 //alert( '[' +xnode._tag + '>' + _xnode._tag + '] remove ... ' );
448 //alert( '[' +xnode._tag + '>' + _xnode._tag + ' ' + (_xnode._xnodes ? _xnode._xnodes.length : '' ) + '] === ' + tag + ' ' + (child.childNodes ? child.childNodes.length : '' ) + ' Hit\n' + child.outerHTML );
449 child.childNodes && child.childNodes.length && createTree( _xnode, child.childNodes, skipCleanup || 0 <= X.Dom.skipCleanupTagNames.indexOf( tag.toLowerCase() ), tag === 'TEXTAREA' );
457 if( _xnode._xnodeType === 3 ){
459 if( child.nodeType !== 3 ){
460 if( !( text = _xnode._text ) || ( text = X.Dom.cleanupWhiteSpace( text ) ) === ' ' ){
461 console.log( '[' +xnode._tag + '>' + _xnode._uid + '] destroy ... ' );
466 alert( xnode._tag + '>' + '"' + _xnode._text + '" !== ' + tag + '\n' + child.outerHTML );
471 _xnode._rawNode = child;
472 _xnode._root = xnode._root;
474 if( !( text = _xnode._text ) || ( text = X.Dom.cleanupWhiteSpace( text ) ) === ' ' ){
475 console.log( '[' +xnode._tag + '>' + _xnode._uid + '] destroy ... ' );
481 _xtext.text( _xtext._text + text );
482 console.log( '[' +xnode._tag + '>' + _xnode._uid + '] xtext,destroy ... ' );
487 //alert( xnode._tag + '>' + '"' + text + '"\n' + child.data );
492 _xtext.text( _xtext._text + _xnode.text );
493 console.log( '[' +xnode._tag + '>' + _xnode._uid + '] xtext,destroy ... ' );
498 _xtext = _xtext || _xnode;
507 //if( !f ) alert( '**** ' + child.outerHTML );
509 while( xnode._xnodes && j < xnode._xnodes.length ){
510 _xnode = xnode._xnodes[ j ];
511 _xnode.parent = xnode;
518 (function( xnode, children, skipCleanup, textarea ){
520 xnodes = parent._xnodes,
521 l = xnodes && xnodes.length,
523 i = 0, j = 0, flag = 0,
524 elm, tag, xtext, text;
525 //children = X.copyArray( children );
528 xnode.attr( 'value', xnode.text() ).empty();
532 for( ; i < xnodes.length; ++i ){
534 xnode.parent = parent;
536 if( xnode._xnodeType === 3 ){
537 //alert( X.Dom.cleanupWhiteSpace( xnode._text ) );
539 if( !( text = xnode._text ) || ( text = X.Dom.cleanupWhiteSpace( text ) ) === ' ' ){
544 //alert( 'xtext ' + text.charCodeAt( 0 ) + ' : ' + text.length );
545 xtext.text( xtext._text + text );
549 //alert( 'xnode ' + text.charCodeAt( 0 ) + ' : ' + text.length );
554 //alert( 'skip ' + text.charCodeAt( 0 ) + ' : ' + text.length );
555 xtext.text( xtext._text + xnode._text );
560 xtext = xtext || xnode;
564 if( xnode._xnodeType !== 1 ){
565 //alert( xnode._xnodeType )
573 * 未知のタグについては、閉じタグも含めてタグ名扱いになる
575 if( tag === '!' || tag.charAt( 0 ) === '/' ){
576 alert( '## ' + tag );
579 if( xnode._tag !== tag ){
580 alert( xnode._tag + ' ' + ' !== ' + tag + '\nxnode.html():' + xnode.attr('cite') + '\nelm.outerHTML:' + elm.outerHTML );
582 xnode._rawNode = elm;
583 xnode._root = parent._root;
584 if( 0 <= X.Dom.cleanupTagNames.indexOf( tag.toLowerCase() ) || tag === 'SCRIPT' ){
589 xnode._xnodes && xnode._xnodes.length && createTree( xnode, elm.children, skipCleanup || 0 <= X.Dom.skipCleanupTagNames.indexOf( tag.toLowerCase() ), tag === 'TEXTAREA' );
591 !xnode._id && elm.setAttribute( 'id', 'ie4uid' + xnode._uid );//( elm.id = 'ie4uid' + xnode._uid );
592 elm.setAttribute( 'UID', xnode._uid );
596 ( xnode._attrs = { type : 'text' } ) :
597 ( !xnode._attrs.type ) || ( xnode._attrs.type = 'text' )
606 if( !xnode._rawNode ){
607 alert( xnode._tag + ' ' + xnode._id + ' !== none...' );
614 ( flag & 6 ) && ( parent._dirty |= X.Dom.Dirty.IE4_TEXTNODE_FIX );
615 //( flag & 4 ) && ( parent._state |= X.Dom.Dirty.ONLY_TEXTNODE );
618 r._xnodes = xnodes = [];
621 Node.skipCreate = true;
623 * http://support.microsoft.com/kb/812417/ja
624 * PRB: outerHTML の HTML 要素のプロパティは、既定の属性は表示されません。
626 * body.innerHTML でなく、 body.outerHTML にはできなかった、、、
628 xnodes.push.apply( xnodes, X.Dom.parse( body.innerHTML, true ) );
629 delete Node.skipCreate;
631 //alert(body.innerHTML);
635 createTree( r, body.childNodes || body.children );
638 Node._systemNode = s = r.create( 'div' ).className( 'hidden-sysyem-node' );
639 //alert( i + ' -> ' + xnodes.length );
641 Node._fontSizeNode = r.create( 'div' ).className( 'hidden-sysyem-node' ).cssText( 'line-height:1;height:1em;' ).text( 'X' );
643 r.appendAt( 0, Node._systemNode, Node._fontSizeNode );
647 //xnodes.splice( xnodes.indexOf( s ), 1 ); // hide from api user
649 //alert(n + ' ' + body.innerHTML);
651 X.Timer.add( 200, X.Dom.Event._detectFontSize );
654 Node._fontSizeNode = null;
656 X.Dom.Event._lastFontSize = 0;
657 X.Dom.Event._detectFontSize = function(){
658 var size = Node._fontSizeNode._rawNode.offsetHeight;
659 if( X.Dom.Event._lastFontSize !== size ){
660 X.Dom.Event._lastFontSize && X.Dom.asyncDispatch( 0, { type : X.Dom.Event.BASE_FONT_RESIZED, size : size } );
661 X.Dom.Event._lastFontSize = size;