Forecast data

js/utils/events.js

@@ -16,8 +16,7 @@
 
     // Trigger a new event
     trigger: function(eventType, data) {
-      // TODO: Do we need to use the old-school createEvent stuff?
-      var event = new CustomEvent(eventType, data);
+      var event = new CustomEvent(eventType, { detail: data });
 
       // Make sure to trigger the event on the given target, or dispatch it from
       // the window if we don't have an event target

js/views/scrollView.js

@@ -8,13 +8,17 @@
     ionic.Utils.extend(opts, {
       decelerationRate: ionic.views.Scroll.prototype.DECEL_RATE_NORMAL,
       dragThresholdY: 10,
-      resistance: 2
+      resistance: 2,
+      scrollEventName: 'momentumScrolled',
+      intertialEventInterval: 50
     });
 
     this.el = opts.el;
     this.decelerationRate = opts.decelerationRate;
     this.dragThresholdY = opts.dragThresholdY;
     this.resistance = opts.resistance;
+    this.scrollEventName = opts.scrollEventName;
+    this.inertialEventInterval = opts.inertialEventInterval;
 
     // Listen for drag and release events
     ionic.onGesture('drag', function(e) {
@@ -44,6 +48,8 @@
      * @param {easing} the animation function to use for easing
      */
     scrollTo: function(x, y, time, easing) {
+      var _this = this;
+
       easing = easing || 'cubic-bezier(0.1, 0.57, 0.1, 1)';
 
       var el = this.el;
@@ -51,6 +57,22 @@
       el.style.webkitTransitionTimingFunction = easing;
       el.style.webkitTransitionDuration = time;
       el.style.webkitTransform = 'translate3d(0,' + y + 'px, 0)';
+
+      // Start triggering events as the element scrolls from inertia.
+      // This is important because we need to receive scroll events
+      // even after a "flick" and adjust, etc.
+      this._momentumStepTimeout = setTimeout(function eventNotify() {
+        var scrollTop = parseFloat(_this.el.style.webkitTransform.replace('translate3d(', '').split(',')[1]) || 0;
+        ionic.trigger(_this.scrollEventName, {
+          target: _this.el,
+          scrollTop: -scrollTop
+        });
+
+        if(_this._isDragging) {
+          _this._momentumStepTimeout = setTimeout(eventNotify, _this.inertialEventInterval);
+        }
+      }, this.inertialEventInterval)
+
       console.log('TRANSITION ADDED!');
     },
 
@@ -67,6 +89,8 @@
 
       console.log('REMOVING TRANSITION');
       this.el.style.webkitTransitionDuration = '0';
+
+      clearTimeout(this._momentumStepTimeout)
     },
 
     /**
@@ -96,6 +120,7 @@
       window.requestAnimationFrame(function() {
         var content;
 
+        // The drag stopped already, don't process this one
         if(_this._isStopped) {
           _this._initDrag();
           return;
@@ -127,6 +152,11 @@
           }
           // Update the new translated Y point of the container
           _this.el.style.webkitTransform = 'translate3d(0,' + newY + 'px, 0)';
+
+          ionic.trigger(_this.scrollEventName, {
+            target: _this.el,
+            scrollTop: -newY
+          });
         }
       });
     },