@ -14,14 +14,14 @@ import {
isNull ,
isNull ,
isFunction ,
isFunction ,
contains ,
contains ,
bind
bind ,
Events ,
emptyFn ,
LogicFactory ,
EVENT _RESPONSE _TIME ,
EVENT _BLUR
} from "@/core" ;
} from "@/core" ;
/ * *
* @ class BI . Bubble
* @ extends BI . Widget
* /
@ shortcut ( )
@ shortcut ( )
export class Bubble extends Widget {
export class Bubble extends Widget {
static xtype = "bi.bubble" ;
static xtype = "bi.bubble" ;
@ -65,7 +65,7 @@ export class Bubble extends Widget {
adjustLength : 0 , // 调整的距离
adjustLength : 0 , // 调整的距离
adjustXOffset : 0 ,
adjustXOffset : 0 ,
adjustYOffset : 0 ,
adjustYOffset : 0 ,
hideChecker : BI . emptyFn ,
hideChecker : emptyFn ,
offsetStyle : "left" , // left,right,center
offsetStyle : "left" , // left,right,center
el : { } ,
el : { } ,
popup : { } ,
popup : { } ,
@ -83,32 +83,32 @@ export class Bubble extends Widget {
} ) ;
} ) ;
this . combo . on ( Controller . EVENT _CHANGE , ( type , value , obj , ... args ) => {
this . combo . on ( Controller . EVENT _CHANGE , ( type , value , obj , ... args ) => {
if ( this . isEnabled ( ) && this . isValid ( ) ) {
if ( this . isEnabled ( ) && this . isValid ( ) ) {
if ( type === BI . Events . EXPAND ) {
if ( type === Events . EXPAND ) {
this . _popupView ( ) ;
this . _popupView ( ) ;
}
}
if ( type === BI . Events . COLLAPSE ) {
if ( type === Events . COLLAPSE ) {
this . _hideView ( ) ;
this . _hideView ( ) ;
}
}
if ( type === BI . Events . EXPAND ) {
if ( type === Events . EXPAND ) {
this . fireEvent ( Controller . EVENT _CHANGE , type , value , obj , ... args ) ;
this . fireEvent ( Controller . EVENT _CHANGE , type , value , obj , ... args ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
}
}
if ( type === BI . Events . COLLAPSE ) {
if ( type === Events . COLLAPSE ) {
this . fireEvent ( Controller . EVENT _CHANGE , type , value , obj , ... args ) ;
this . fireEvent ( Controller . EVENT _CHANGE , type , value , obj , ... args ) ;
this . isViewVisible ( ) && this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
this . isViewVisible ( ) && this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
}
}
if ( type === BI . Events . CLICK ) {
if ( type === Events . CLICK ) {
this . fireEvent ( Bubble . EVENT _TRIGGER _CHANGE , obj ) ;
this . fireEvent ( Bubble . EVENT _TRIGGER _CHANGE , obj ) ;
}
}
}
}
} ) ;
} ) ;
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , e => {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
this . element . addClass ( hoverClass ) ;
this . element . addClass ( hoverClass ) ;
}
}
} ) ;
} ) ;
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , e => {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
this . element . removeClass ( hoverClass ) ;
this . element . removeClass ( hoverClass ) ;
}
}
@ -120,7 +120,7 @@ export class Bubble extends Widget {
element : this ,
element : this ,
scrolly : false ,
scrolly : false ,
} ,
} ,
BI . LogicFactory . createLogic (
LogicFactory . createLogic (
"vertical" ,
"vertical" ,
extend ( logic , {
extend ( logic , {
items : [ { el : this . combo } ] ,
items : [ { el : this . combo } ] ,
@ -146,7 +146,7 @@ export class Bubble extends Widget {
const { stopEvent , stopPropagation , toggle } = this . options ;
const { stopEvent , stopPropagation , toggle } = this . options ;
const evs = ( this . options . trigger || "" ) . split ( "," ) ;
const evs = ( this . options . trigger || "" ) . split ( "," ) ;
const st = ( e ) => {
const st = e => {
if ( stopEvent ) {
if ( stopEvent ) {
e . stopEvent ( ) ;
e . stopEvent ( ) ;
}
}
@ -157,7 +157,7 @@ export class Bubble extends Widget {
let enterPopup = false ;
let enterPopup = false ;
const hide = ( e ) => {
const hide = e => {
if (
if (
this . isEnabled ( ) &&
this . isEnabled ( ) &&
this . isValid ( ) &&
this . isValid ( ) &&
@ -166,7 +166,7 @@ export class Bubble extends Widget {
toggle === true
toggle === true
) {
) {
this . _hideView ( e ) ;
this . _hideView ( e ) ;
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . COLLAPSE , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . COLLAPSE , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
}
}
this . popupView &&
this . popupView &&
@ -178,18 +178,18 @@ export class Bubble extends Widget {
let debounced ;
let debounced ;
switch ( ev ) {
switch ( ev ) {
case "hover" :
case "hover" :
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , e => {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
this . _popupView ( e ) ;
this . _popupView ( e ) ;
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
}
}
} ) ;
} ) ;
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , e => {
if ( this . popupView ) {
if ( this . popupView ) {
this . popupView . element . on ( ` mouseenter. ${ this . getName ( ) } ` , ( e ) => {
this . popupView . element . on ( ` mouseenter. ${ this . getName ( ) } ` , e => {
enterPopup = true ;
enterPopup = true ;
this . popupView . element . on ( ` mouseleave. ${ this . getName ( ) } ` , ( e ) => {
this . popupView . element . on ( ` mouseleave. ${ this . getName ( ) } ` , e => {
hide ( e ) ;
hide ( e ) ;
} ) ;
} ) ;
this . popupView . element . off ( ` mouseenter. ${ this . getName ( ) } ` ) ;
this . popupView . element . off ( ` mouseenter. ${ this . getName ( ) } ` ) ;
@ -204,7 +204,7 @@ export class Bubble extends Widget {
break ;
break ;
case "click" :
case "click" :
debounced = debounce (
debounced = debounce (
( e ) => {
e => {
if ( this . combo . element . _ _isMouseInBounds _ _ ( e ) ) {
if ( this . combo . element . _ _isMouseInBounds _ _ ( e ) ) {
if (
if (
this . isEnabled ( ) &&
this . isEnabled ( ) &&
@ -217,29 +217,29 @@ export class Bubble extends Widget {
// }
// }
toggle ? this . _toggle ( e ) : this . _popupView ( e ) ;
toggle ? this . _toggle ( e ) : this . _popupView ( e ) ;
if ( this . isViewVisible ( ) ) {
if ( this . isViewVisible ( ) ) {
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
} else {
} else {
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . COLLAPSE , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . COLLAPSE , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
this . fireEvent ( Bubble . EVENT _COLLAPSE ) ;
}
}
}
}
}
}
} ,
} ,
BI . EVENT _RESPONSE _TIME ,
EVENT _RESPONSE _TIME ,
{
{
leading : true ,
leading : true ,
trailing : false ,
trailing : false ,
}
}
) ;
) ;
this . element . off ( ` ${ ev } . ${ this . getName ( ) } ` ) . on ( ` ${ ev } . ${ this . getName ( ) } ` , ( e ) => {
this . element . off ( ` ${ ev } . ${ this . getName ( ) } ` ) . on ( ` ${ ev } . ${ this . getName ( ) } ` , e => {
debounced ( e ) ;
debounced ( e ) ;
st ( e ) ;
st ( e ) ;
} ) ;
} ) ;
break ;
break ;
case "click-hover" :
case "click-hover" :
debounced = debounce (
debounced = debounce (
( e ) => {
e => {
if ( this . combo . element . _ _isMouseInBounds _ _ ( e ) ) {
if ( this . combo . element . _ _isMouseInBounds _ _ ( e ) ) {
if (
if (
this . isEnabled ( ) &&
this . isEnabled ( ) &&
@ -252,27 +252,27 @@ export class Bubble extends Widget {
// }
// }
this . _popupView ( e ) ;
this . _popupView ( e ) ;
if ( this . isViewVisible ( ) ) {
if ( this . isViewVisible ( ) ) {
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
}
}
}
}
}
}
} ,
} ,
BI . EVENT _RESPONSE _TIME ,
EVENT _RESPONSE _TIME ,
{
{
leading : true ,
leading : true ,
trailing : false ,
trailing : false ,
}
}
) ;
) ;
this . element . off ( ` click. ${ this . getName ( ) } ` ) . on ( ` click. ${ this . getName ( ) } ` , ( e ) => {
this . element . off ( ` click. ${ this . getName ( ) } ` ) . on ( ` click. ${ this . getName ( ) } ` , e => {
debounced ( e ) ;
debounced ( e ) ;
st ( e ) ;
st ( e ) ;
} ) ;
} ) ;
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseleave. ${ this . getName ( ) } ` , e => {
if ( this . popupView ) {
if ( this . popupView ) {
this . popupView . element . on ( ` mouseenter. ${ this . getName ( ) } ` , ( e ) => {
this . popupView . element . on ( ` mouseenter. ${ this . getName ( ) } ` , e => {
enterPopup = true ;
enterPopup = true ;
this . popupView . element . on ( ` mouseleave. ${ this . getName ( ) } ` , ( e ) => {
this . popupView . element . on ( ` mouseleave. ${ this . getName ( ) } ` , e => {
hide ( e ) ;
hide ( e ) ;
} ) ;
} ) ;
this . popupView . element . off ( ` mouseenter. ${ this . getName ( ) } ` ) ;
this . popupView . element . off ( ` mouseenter. ${ this . getName ( ) } ` ) ;
@ -286,10 +286,10 @@ export class Bubble extends Widget {
} ) ;
} ) ;
break ;
break ;
case "hover-click" :
case "hover-click" :
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , ( e ) => {
this . element . on ( ` mouseenter. ${ this . getName ( ) } ` , e => {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
if ( this . isEnabled ( ) && this . isValid ( ) && this . combo . isEnabled ( ) && this . combo . isValid ( ) ) {
this . _popupView ( e ) ;
this . _popupView ( e ) ;
this . fireEvent ( Controller . EVENT _CHANGE , BI . Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Controller . EVENT _CHANGE , Events . EXPAND , "" , this . combo ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
this . fireEvent ( Bubble . EVENT _EXPAND ) ;
}
}
} ) ;
} ) ;
@ -319,7 +319,7 @@ export class Bubble extends Widget {
this
this
) ;
) ;
this . popupView . on ( Controller . EVENT _CHANGE , ( type , value , obj , ... args ) => {
this . popupView . on ( Controller . EVENT _CHANGE , ( type , value , obj , ... args ) => {
if ( type === BI . Events . CLICK ) {
if ( type === Events . CLICK ) {
this . combo . setValue ( this . getValue ( ) ) ;
this . combo . setValue ( this . getValue ( ) ) ;
this . fireEvent ( Bubble . EVENT _CHANGE , value , obj ) ;
this . fireEvent ( Bubble . EVENT _CHANGE , value , obj ) ;
}
}
@ -404,7 +404,7 @@ export class Bubble extends Widget {
. createElement ( document )
. createElement ( document )
. unbind ( ` mousedown. ${ this . getName ( ) } ` )
. unbind ( ` mousedown. ${ this . getName ( ) } ` )
. unbind ( ` mousewheel. ${ this . getName ( ) } ` ) ;
. unbind ( ` mousewheel. ${ this . getName ( ) } ` ) ;
BI . EVENT _BLUR && hideWhenBlur && Widget . _renderEngine . createElement ( window ) . unbind ( ` blur. ${ this . getName ( ) } ` ) ;
EVENT _BLUR && hideWhenBlur && Widget . _renderEngine . createElement ( window ) . unbind ( ` blur. ${ this . getName ( ) } ` ) ;
this . fireEvent ( Bubble . EVENT _AFTER _HIDEVIEW ) ;
this . fireEvent ( Bubble . EVENT _AFTER _HIDEVIEW ) ;
}
}
@ -427,7 +427,7 @@ export class Bubble extends Widget {
options : {
options : {
offset : ( ) => [ adjustXOffset , ( showArrow ? 12 : 0 ) + ( adjustYOffset + adjustLength ) ] ,
offset : ( ) => [ adjustXOffset , ( showArrow ? 12 : 0 ) + ( adjustYOffset + adjustLength ) ] ,
} ,
} ,
} ,
}
] ;
] ;
if ( this . options . showArrow ) {
if ( this . options . showArrow ) {
modifiers . push ( {
modifiers . push ( {
@ -448,11 +448,11 @@ export class Bubble extends Widget {
this . element . addClass ( this . options . comboClass ) ;
this . element . addClass ( this . options . comboClass ) ;
hideWhenClickOutside && Widget . _renderEngine . createElement ( document ) . unbind ( ` mousedown. ${ this . getName ( ) } ` ) ;
hideWhenClickOutside && Widget . _renderEngine . createElement ( document ) . unbind ( ` mousedown. ${ this . getName ( ) } ` ) ;
BI . EVENT _BLUR && hideWhenBlur && Widget . _renderEngine . createElement ( window ) . unbind ( ` blur. ${ this . getName ( ) } ` ) ;
EVENT _BLUR && hideWhenBlur && Widget . _renderEngine . createElement ( window ) . unbind ( ` blur. ${ this . getName ( ) } ` ) ;
hideWhenClickOutside &&
hideWhenClickOutside &&
Widget . _renderEngine . createElement ( document ) . bind ( ` mousedown. ${ this . getName ( ) } ` , bind ( this . _hideIf , this ) ) ;
Widget . _renderEngine . createElement ( document ) . bind ( ` mousedown. ${ this . getName ( ) } ` , bind ( this . _hideIf , this ) ) ;
BI . EVENT _BLUR &&
EVENT _BLUR &&
hideWhenBlur &&
hideWhenBlur &&
Widget . _renderEngine . createElement ( window ) . bind ( ` blur. ${ this . getName ( ) } ` , bind ( this . _hideIf , this ) ) ;
Widget . _renderEngine . createElement ( window ) . bind ( ` blur. ${ this . getName ( ) } ` , bind ( this . _hideIf , this ) ) ;
this . fireEvent ( Bubble . EVENT _AFTER _POPUPVIEW ) ;
this . fireEvent ( Bubble . EVENT _AFTER _POPUPVIEW ) ;
@ -500,8 +500,8 @@ export class Bubble extends Widget {
populate ( items ) {
populate ( items ) {
this . _assertPopupView ( ) ;
this . _assertPopupView ( ) ;
this . popupView . populate . apply ( this . popupView , arguments ) ;
this . popupView . populate ( ... arguments ) ;
this . combo . populate && this . combo . populate . apply ( this . combo , arguments ) ;
this . combo . populate && this . combo . populate ( ... arguments ) ;
}
}
_setEnable ( arg ) {
_setEnable ( arg ) {