MaterialRippleComponent constructor

MaterialRippleComponent(
  1. HtmlElement _element
)

Implementation

MaterialRippleComponent(this._element) {
  // These are initialized here instead of when they're declared because
  // dart2js would otherwise wait to initialize them until they are used.
  _ripplePool ??=
      List<DivElement?>.filled(_maxRipples, null, growable: false);
  _opacityTiming ??= {
    'duration': 300.0,
  };
  _opacityKeyframes ??= [
    {'opacity': _minOpacity},
    {'opacity': _maxOpacity, 'offset': 0.25},
    {'opacity': _maxOpacity, 'offset': 0.5},
    {'opacity': _minOpacity},
  ];
  _transformTiming ??= {
    'duration': 225.0,
    'easing': 'cubic-bezier(0.4, 0.0, 0.2, 1)',
  };
  // This is className = instead of classes.add because classes.add compiles
  // to a DOM read, conversion to List, and then a DOM write.
  if (_rippleTemplate == null) {
    final className =
        (supportsAnimationApi) ? '__acx-ripple' : '__acx-ripple fallback';
    _rippleTemplate = DivElement()..className = className;
  }

  // This is necessary because if _onMouseDown was a method, a new closure
  // would be created each time it was referenced. That means that
  // _onMouseDown in removeEventListener would point to a different listener,
  // so the listener would not be removed.
  _onMouseDown = (e) {
    // This is inlined by dart2js so we aren't incurring an additional
    // function call here.
    final clientX = (e as MouseEvent).client.x;
    final clientY = e.client.y;
    _createRipple(clientX as int, clientY as int, _element, center);
  };
  _onKeyDown = (e) {
    if (!isKeyboardTrigger(e as KeyboardEvent)) return;
    // Ripples created by a keypress are always centered.
    _createRipple(0, 0, _element, true);
  };
  // This is about 5x faster than _element.onMouseDown.listen or Angular
  // (mousedown) because this compiles directly to addEventListener, whereas
  // the streams approach adds several layers of slow indirection.
  _element.addEventListener('mousedown', _onMouseDown);
  _element.addEventListener('keydown', _onKeyDown);
}