PopoverHelper.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536
  1. export default class PopoverHelper{constructor(container,getRequest){this._disableOnClick=false;this._hasPadding=false;this._getRequest=getRequest;this._scheduledRequest=null;this._hidePopoverCallback=null;this._container=container;this._showTimeout=0;this._hideTimeout=0;this._hidePopoverTimer=null;this._showPopoverTimer=null;this._boundMouseDown=this._mouseDown.bind(this);this._boundMouseMove=this._mouseMove.bind(this);this._boundMouseOut=this._mouseOut.bind(this);this._container.addEventListener('mousedown',this._boundMouseDown,false);this._container.addEventListener('mousemove',this._boundMouseMove,false);this._container.addEventListener('mouseout',this._boundMouseOut,false);this.setTimeout(1000);}
  2. setTimeout(showTimeout,hideTimeout){this._showTimeout=showTimeout;this._hideTimeout=typeof hideTimeout==='number'?hideTimeout:showTimeout/2;}
  3. setHasPadding(hasPadding){this._hasPadding=hasPadding;}
  4. setDisableOnClick(disableOnClick){this._disableOnClick=disableOnClick;}
  5. _eventInScheduledContent(event){return this._scheduledRequest?this._scheduledRequest.box.contains(event.clientX,event.clientY):false;}
  6. _mouseDown(event){if(this._disableOnClick){this.hidePopover();return;}
  7. if(this._eventInScheduledContent(event)){return;}
  8. this._startHidePopoverTimer(0);this._stopShowPopoverTimer();this._startShowPopoverTimer((event),0);}
  9. _mouseMove(event){if(this._eventInScheduledContent(event)){return;}
  10. this._startHidePopoverTimer(this._hideTimeout);this._stopShowPopoverTimer();if(event.which&&this._disableOnClick){return;}
  11. this._startShowPopoverTimer((event),this.isPopoverVisible()?this._showTimeout*0.6:this._showTimeout);}
  12. _popoverMouseMove(event){this._stopHidePopoverTimer();}
  13. _popoverMouseOut(popover,event){if(!popover.isShowing()){return;}
  14. if(event.relatedTarget&&!event.relatedTarget.isSelfOrDescendant(popover.contentElement)){this._startHidePopoverTimer(this._hideTimeout);}}
  15. _mouseOut(event){if(!this.isPopoverVisible()){return;}
  16. if(!this._eventInScheduledContent(event)){this._startHidePopoverTimer(this._hideTimeout);}}
  17. _startHidePopoverTimer(timeout){if(!this._hidePopoverCallback||this._hidePopoverTimer){return;}
  18. this._hidePopoverTimer=setTimeout(()=>{this._hidePopover();this._hidePopoverTimer=null;},timeout);}
  19. _startShowPopoverTimer(event,timeout){this._scheduledRequest=this._getRequest.call(null,event);if(!this._scheduledRequest){return;}
  20. this._showPopoverTimer=setTimeout(()=>{this._showPopoverTimer=null;this._stopHidePopoverTimer();this._hidePopover();this._showPopover(event.target.ownerDocument);},timeout);}
  21. _stopShowPopoverTimer(){if(!this._showPopoverTimer){return;}
  22. clearTimeout(this._showPopoverTimer);this._showPopoverTimer=null;}
  23. isPopoverVisible(){return!!this._hidePopoverCallback;}
  24. hidePopover(){this._stopShowPopoverTimer();this._hidePopover();}
  25. _hidePopover(){if(!this._hidePopoverCallback){return;}
  26. this._hidePopoverCallback.call(null);this._hidePopoverCallback=null;}
  27. _showPopover(document){const popover=new UI.GlassPane();popover.registerRequiredCSS('ui/popover.css');popover.setSizeBehavior(UI.GlassPane.SizeBehavior.MeasureContent);popover.setMarginBehavior(UI.GlassPane.MarginBehavior.Arrow);const request=this._scheduledRequest;request.show.call(null,popover).then(success=>{if(!success){return;}
  28. if(this._scheduledRequest!==request){if(request.hide){request.hide.call(null);}
  29. return;}
  30. if(PopoverHelper._popoverHelper){console.error('One popover is already visible');PopoverHelper._popoverHelper.hidePopover();}
  31. PopoverHelper._popoverHelper=this;popover.contentElement.classList.toggle('has-padding',this._hasPadding);popover.contentElement.addEventListener('mousemove',this._popoverMouseMove.bind(this),true);popover.contentElement.addEventListener('mouseout',this._popoverMouseOut.bind(this,popover),true);popover.setContentAnchorBox(request.box);popover.show(document);this._hidePopoverCallback=()=>{if(request.hide){request.hide.call(null);}
  32. popover.hide();delete PopoverHelper._popoverHelper;};});}
  33. _stopHidePopoverTimer(){if(!this._hidePopoverTimer){return;}
  34. clearTimeout(this._hidePopoverTimer);this._hidePopoverTimer=null;this._stopShowPopoverTimer();}
  35. dispose(){this._container.removeEventListener('mousedown',this._boundMouseDown,false);this._container.removeEventListener('mousemove',this._boundMouseMove,false);this._container.removeEventListener('mouseout',this._boundMouseOut,false);}}
  36. UI.PopoverRequest;self.UI=self.UI||{};UI=UI||{};UI.PopoverHelper=PopoverHelper;