[Effen] Reduce splashes when scrolling.

sky/framework/components/ink_splash.dart

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 import '../animation/animated_value.dart';
 import '../animation/curves.dart';
 import '../animation/generators.dart';
 import '../fn.dart';
 import '../theme/view-configuration.dart' as config;
 import 'dart:async';
 import 'dart:math' as math;
 import 'dart:sky' as sky;
 
 const double _kSplashConfirmedDuration = 350.0;
 const double _kSplashUnconfirmedDuration = config.kDefaultLongPressTimeout;
+const double _kSplashAbortDuration = 100.0;
+const double _kSplashInitialDelay = 0.0; // we could delay initially in case the user scrolls
 
 double _getSplashTargetSize(sky.ClientRect rect, double x, double y) {
   return 2.0 * math.max(math.max(x - rect.left, rect.right - x),
                         math.max(y - rect.top, rect.bottom - y));
 }
 
 class SplashController {
   final int pointer;
   Stream<String> get onStyleChanged => _styleStream;
 
   final AnimatedValue _size = new AnimatedValue(0.0);
   double _offsetX;
   double _offsetY;
+  double _lastSize = 0.0;
+  bool _growing = true;
   double _targetSize;
   Stream<String> _styleStream;
 
   void start() {
-    _size.animateTo(_targetSize, _kSplashUnconfirmedDuration, curve: easeOut);
+    _size.animateTo(_targetSize, _kSplashUnconfirmedDuration, curve: easeOut, initialDelay: _kSplashInitialDelay);
   }
 
   void confirm() {
     double fractionRemaining = (_targetSize - _size.value) / _targetSize;
     double duration = fractionRemaining * _kSplashConfirmedDuration;
     if (duration <= 0.0)
       return;
     _size.animateTo(_targetSize, duration, curve: easeOut);
   }
 
+  void abort() {
+    _growing = false;
+    double durationRemaining = _size.remainingTime;
+    if (durationRemaining <= _kSplashAbortDuration)
+      return;
+    _size.animateTo(_targetSize, _kSplashAbortDuration, curve: easeOut);
+  }
+
   void cancel() {
     _size.stop();
   }
 
   SplashController(sky.ClientRect rect, double x, double y,
                    { this.pointer, Function onDone })
       : _offsetX = x - rect.left,
         _offsetY = y - rect.top,
         _targetSize = _getSplashTargetSize(rect, x, y) {
 
     _styleStream = _size.onValueChanged.map((p) {
       if (p == _targetSize) {
         onDone();
       }
+      var s;

[eseidel, 2015/04/20 22:45:04]

What does s mean?

[Hixie, 2015/04/20 22:49:40]

changed to "size"

+      if (_growing) {
+        s = p;
+        _lastSize = p;
+      } else {
+        s = _lastSize;
+      }
       return '''
-        top: ${_offsetY - p/2}px;
-        left: ${_offsetX - p/2}px;
-        width: ${p}px;
-        height: ${p}px;
-        border-radius: ${p}px;
+        top: ${_offsetY - s/2}px;
+        left: ${_offsetX - s/2}px;
+        width: ${s}px;
+        height: ${s}px;
+        border-radius: ${s}px;
         opacity: ${1.0 - (p / _targetSize)};''';
     });
 
     start();
   }
 }
 
 class InkSplash extends Component {
   static final Style _clipperStyle = new Style('''
     position: absolute;
@@ skipping 40 matching lines @@
       style: _clipperStyle,
       children: [
         new Container(
           inlineStyle: _inlineStyle,
           style: _splashStyle
         )
       ]
     );
   }
 }