0.6.x/js/20_ui/20_PageRoot.js

   1
   2 X.UI._eventRellay = function( e ){
   3         var x       = e.clientX / X.Dom.baseFontSize,
   4                 y       = e.clientY / X.Dom.baseFontSize,
   5                 type    = X.UI.Event.NameToID[ e.type ],
   6                 i       = 0,
   7                 data    = X.UI.currentRootData,
   8                 sysOnly = false,
   9                 ret     = X.Callback.NONE,
  10                 list, parent, _ret;
  11
  12         // mouseup で　alert を出すと　mouseleave が発生、ということでイベント中のイベント発火を禁止
  13         if( !data || data._eventBusy ) return ret;
  14         data._eventBusy = true;
  15
  16         if( type !== '' + X.UI.Event._POINTER_MOVE && type !== '' + X.UI.Event._TOUCH_MOVE && type !== '' + X.UI.Event._MOUSE_MOVE ){
  17                 //console.log( e.type + ' ' + type + ' x:' + x + ', y:' + y );
  18         };
  19
  20         e.type = type;
  21
  22         if( data && ( data = data.monopolyNodeData ) && ( ret = data.dispatch( e ) ) & X.Callback.MONOPOLY ){
  23                 delete X.UI.currentRootData._eventBusy;
  24                 return ret | X.Callback.PREVENT_DEFAULT;
  25         };
  26
  27         list = X.UI.currentRootData.hoverList;
  28         ( X.UI.currentRootData.targetNodeData = X.UI.currentRootData ).capcher( x, y );
  29         data = X.UI.currentRootData.targetNodeData;
  30
  31         //data !== X.UI.currentRootData && console.log( data.xnode.text() );
  32
  33         while( data ){
  34                 _ret = data.dispatch( e, sysOnly );
  35                 ret |= _ret;
  36                 if( _ret & X.Callback.MONOPOLY || _ret & X.Callback.STOP_PROPAGATION || _ret & X.Callback.STOP_NOW ) break; // sysOnly = true;
  37                 data = data.parentData;
  38         };
  39
  40         for( i = list.length; i; ){
  41                 parent = data = list[ --i ];
  42                 while( parent.parentData && parent === parent.parentData.hitChildData ){
  43                         parent = parent.parentData;
  44                 };
  45                 if( parent !== X.UI.currentRootData ){
  46                         data.hoverClassName && data.xnode.removeClass( data.hoverClassName );
  47                         data._listeners && data._listeners[ X.UI.Event.POINTER_OUT ] && data.dispatch( e, X.UI.Event.POINTER_OUT, false ); // new Event
  48                         delete data.hovering;
  49                         list.splice( i, 1 );
  50                         continue;
  51                 };
  52                 if( !data.hovering ){
  53                         data.hoverClassName && data.xnode.addClassName( data.hoverClassName );
  54                         data._listeners && data._listeners[ X.UI.Event.POINTER_IN ] && data.dispatch( e, X.UI.Event.POINTER_IN, true ); // new Event
  55                         data.hovering = true;
  56                 };
  57         };
  58         delete X.UI.currentRootData._eventBusy;
  59         return ret | X.Callback.PREVENT_DEFAULT;
  60 };
  61
  62 /*
  63  * body が存在したら要素を作成、css も指定
  64  * 背景画像を読み終える onload で活動開始
  65  */
  66
  67 X.UI._PageRoot = X.UI._Box.inherits(
  68         '_PageRoot',
  69         X.Class.FINAL | X.Class.PRIVATE_DATA | X.Class.SUPER_ACCESS,
  70         {
  71                 layout                : X.UI.Layout.Canvas,
  72
  73                 calcReserved          : false,
  74                 hoverList             : null,
  75                 targetNodeData        : null,
  76                 monopolyNodeData      : null,
  77
  78                 xnodeInteractiveLayer : null,
  79                 eventCounter          : null,
  80                 cursorStyle           : null,
  81
  82                 _eventBusy            : false,
  83
  84                 Constructor : function( layout, args ){
  85                         this.SuperConstructor( layout, args );
  86
  87                         if( X.Dom.readyState === X.Dom.Event.XDOM_READY ){
  88                                 X.Timer.once( 0, this, this.start );
  89                         } else {
  90                                 X.Dom.listenOnce( X.Dom.Event.XDOM_READY, this, this.start );
  91                         };
  92
  93                         this.hoverList    = [];
  94                         this.eventCounter = {};
  95
  96                         X.UI.currentRootData = this;
  97                 },
  98
  99                 start : function(){
 100                         this.initialize( this.User, this, null, null );
 101                         X.Timer.once( 0, this, this.addToView );
 102                 },
 103                 addToView : function(){
 104                         var     counter = this.eventCounter, flg;
 105
 106                         // this.xnodeInteractiveLayer の前に追加する！
 107
 108                         this.addToParent( X.Dom.Node._body );
 109
 110                         this.xnodeInteractiveLayer = X.Dom.Node._body.create( 'div', {
 111                                 'class'      : 'mouse-operation-catcher',
 112                                 unselectable : 'on'
 113                         } );
 114
 115                         // hover や rollover rollout のための move イベントの追加
 116                         // X.Dom.Event.activate, X.Dom.Event.deactivate ?
 117                         // mouseout, mouseover
 118                         //if( X_UA_HID.POINTER ){
 119                                 this.xnodeInteractiveLayer.listen( X.UI.Event.IdToName[ X.UI.Event._POINTER_MOVE ], X.UI._eventRellay );
 120                                 if( counter[ X.UI.Event._POINTER_MOVE ] ){
 121                                         ++counter[ X.UI.Event._POINTER_MOVE ];
 122                                 } else {
 123                                         counter[ X.UI.Event._POINTER_MOVE ] = 1;
 124                                 };
 125                         /*} else {
 126                                 this.xnodeInteractiveLayer.listen( X.UI.Event.IdToName[ X.UI.Event._MOUSE_MOVE ], X.UI._eventRellay );
 127                                 if( counter[ X.UI.Event._MOUSE_MOVE ] ){
 128                                         ++counter[ X.UI.Event._MOUSE_MOVE ];
 129                                 } else {
 130                                         counter[ X.UI.Event._MOUSE_MOVE ] = 1;
 131                                 };
 132                         };*/
 133                         X.Timer.once( 0, this, this.afterAddToView );
 134                 },
 135                 afterAddToView : function(){
 136                         this.xnode.className( 'PageRoot' );
 137
 138                         this.creationComplete();
 139                         X.Timer.once( 0, this, this.doFirstCalc );
 140                 },
 141
 142                 doFirstCalc : function(){
 143                         this.calculate();
 144                         this.phase = 4;
 145                         X.Dom
 146                                 .listen( X.Dom.Event.VIEW_RESIZED, this, this.calculate )
 147                                 .listen( X.Dom.Event.BASE_FONT_RESIZED, this, this.calculate );
 148                 },
 149
 150                 reserveCalc : function(){
 151                         if( this.calcReserved === false ){
 152                                 this.calcReserved = true;
 153                                 X.Timer.once( 0, this, this.calculate );
 154                         };
 155                 },
 156                 calculate : function( e ){
 157                         var font = X.Dom.baseFontSize,
 158                                 size, w, h;
 159                         if( !e ){
 160                                 size = X.Dom.getSize();
 161                                 w    = size[ 0 ];
 162                                 h    = size[ 1 ];
 163                         } else {
 164                                 w = e.w;
 165                                 h = e.h;
 166                         };
 167                         this.layout.calculate( this, false, 0, 0, w / font, h / font );
 168                         this.calcReserved = false;
 169                 },
 170
 171                 updateCoursor : function( cursor ){
 172
 173                 },
 174
 175                 _remove : function(){
 176                         this.xnodeInteractiveLayer.unlisten();
 177                         _Box.prototype._remove.call( this );
 178                 }
 179         }
 180 );
 181
 182 X.UI.PageRoot = X.UI.Box.presets(
 183         'PageRoot',
 184         X.UI._PageRoot,
 185         {
 186                 width  : '100%',
 187                 height : '100%'
 188         }
 189 );
 190