click-block.js 2.4KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. import { Directive, ElementRef, Inject, Renderer, forwardRef } from '@angular/core';
  2. import { App } from '../app/app';
  3. import { Config } from '../../config/config';
  4. import { Platform } from '../../platform/platform';
  5. /**
  6. * @hidden
  7. */
  8. export class ClickBlock {
  9. constructor(app, config, plt, elementRef, renderer) {
  10. this.plt = plt;
  11. this.elementRef = elementRef;
  12. this.renderer = renderer;
  13. this._showing = false;
  14. app._clickBlock = this;
  15. const enabled = this.isEnabled = config.getBoolean('clickBlock', true);
  16. if (enabled) {
  17. this._setElementClass('click-block-enabled', true);
  18. }
  19. }
  20. activate(shouldShow, expire = 100, minDuration = 0) {
  21. if (this.isEnabled) {
  22. this.plt.cancelTimeout(this._tmr);
  23. if (shouldShow) {
  24. // remember when we started the click block
  25. this._start = Date.now();
  26. // figure out the minimum time it should be showing until
  27. // this is useful for transitions that are less than 300ms
  28. this._minEnd = this._start + (minDuration || 0);
  29. this._activate(true);
  30. }
  31. this._tmr = this.plt.timeout(this._activate.bind(this, false), expire);
  32. }
  33. }
  34. /** @internal */
  35. _activate(shouldShow) {
  36. if (this._showing !== shouldShow) {
  37. if (!shouldShow) {
  38. // check if it was enabled before the minimum duration
  39. // this is useful for transitions that are less than 300ms
  40. var now = Date.now();
  41. if (now < this._minEnd) {
  42. this._tmr = this.plt.timeout(this._activate.bind(this, false), this._minEnd - now);
  43. return;
  44. }
  45. }
  46. this._setElementClass('click-block-active', shouldShow);
  47. this._showing = shouldShow;
  48. }
  49. }
  50. _setElementClass(className, add) {
  51. this.renderer.setElementClass(this.elementRef.nativeElement, className, add);
  52. }
  53. }
  54. ClickBlock.decorators = [
  55. { type: Directive, args: [{
  56. selector: '.click-block'
  57. },] },
  58. ];
  59. /** @nocollapse */
  60. ClickBlock.ctorParameters = () => [
  61. { type: App, decorators: [{ type: Inject, args: [forwardRef(() => App),] },] },
  62. { type: Config, },
  63. { type: Platform, },
  64. { type: ElementRef, },
  65. { type: Renderer, },
  66. ];
  67. //# sourceMappingURL=click-block.js.map