diff --git a/dist/js/ionic.js b/dist/js/ionic.js index d221228ab3..8f6c0b386b 100644 --- a/dist/js/ionic.js +++ b/dist/js/ionic.js @@ -2501,17 +2501,21 @@ window.ionic = { this.resistance = opts.resistance; // Listen for drag and release events - window.ionic.onGesture('drag', function(e) { + ionic.onGesture('drag', function(e) { _this._handleDrag(e); }, this.el); - window.ionic.onGesture('release', function(e) { + ionic.onGesture('release', function(e) { _this._handleEndDrag(e); }, this.el); + ionic.on('webkitTransitionEnd', function(e) { + _this._endTransition(); + }); }; ionic.views.Scroll.prototype = { DECEL_RATE_NORMAL: 0.998, DECEL_RATE_FAST: 0.99, + DECEL_RATE_SLOW: 0.996, /** * Scroll to the given X and Y point, taking @@ -2531,15 +2535,22 @@ window.ionic = { el.style.webkitTransitionTimingFunction = easing; el.style.webkitTransitionDuration = time; el.style.webkitTransform = 'translate3d(0,' + y + 'px, 0)'; + console.log('TRANSITION ADDED!'); }, _initDrag: function() { + this._endTransition(); + this._isStopped = false; + }, + + _endTransition: function() { this._isDragging = false; this._drag = null; this.el.classList.remove('scroll-scrolling'); - this.el.style.webkitTransitionDuration = '0'; + console.log('REMOVING TRANSITION'); + this.el.style.webkitTransitionDuration = '0'; }, /** @@ -2569,6 +2580,11 @@ window.ionic = { window.requestAnimationFrame(function() { var content; + if(_this._isStopped) { + _this._initDrag(); + return; + } + // We really aren't dragging if(!_this._drag) { _this._startDrag(e); @@ -2600,18 +2616,18 @@ window.ionic = { }, _handleEndDrag: function(e) { - var _this = this; - // We didn't have a drag, so just init and leave - if(!_this._drag) { - _this._initDrag(); + if(!this._drag) { + this._initDrag(); return; } + // Set a flag in case we don't cleanup completely after the + // drag animation so we can cleanup the next time a drag starts + this._isStopped = true; + // Animate to the finishing point - _this._animateToStop(e); - // Cleanup - _this._initDrag(); + this._animateToStop(e); }, diff --git a/js/views/scrollView.js b/js/views/scrollView.js index 73a3532758..c0ec47bc5b 100644 --- a/js/views/scrollView.js +++ b/js/views/scrollView.js @@ -17,17 +17,21 @@ this.resistance = opts.resistance; // Listen for drag and release events - window.ionic.onGesture('drag', function(e) { + ionic.onGesture('drag', function(e) { _this._handleDrag(e); }, this.el); - window.ionic.onGesture('release', function(e) { + ionic.onGesture('release', function(e) { _this._handleEndDrag(e); }, this.el); + ionic.on('webkitTransitionEnd', function(e) { + _this._endTransition(); + }); }; ionic.views.Scroll.prototype = { DECEL_RATE_NORMAL: 0.998, DECEL_RATE_FAST: 0.99, + DECEL_RATE_SLOW: 0.996, /** * Scroll to the given X and Y point, taking @@ -47,15 +51,22 @@ el.style.webkitTransitionTimingFunction = easing; el.style.webkitTransitionDuration = time; el.style.webkitTransform = 'translate3d(0,' + y + 'px, 0)'; + console.log('TRANSITION ADDED!'); }, _initDrag: function() { + this._endTransition(); + this._isStopped = false; + }, + + _endTransition: function() { this._isDragging = false; this._drag = null; this.el.classList.remove('scroll-scrolling'); - this.el.style.webkitTransitionDuration = '0'; + console.log('REMOVING TRANSITION'); + this.el.style.webkitTransitionDuration = '0'; }, /** @@ -85,6 +96,11 @@ window.requestAnimationFrame(function() { var content; + if(_this._isStopped) { + _this._initDrag(); + return; + } + // We really aren't dragging if(!_this._drag) { _this._startDrag(e); @@ -116,18 +132,18 @@ }, _handleEndDrag: function(e) { - var _this = this; - // We didn't have a drag, so just init and leave - if(!_this._drag) { - _this._initDrag(); + if(!this._drag) { + this._initDrag(); return; } + // Set a flag in case we don't cleanup completely after the + // drag animation so we can cleanup the next time a drag starts + this._isStopped = true; + // Animate to the finishing point - _this._animateToStop(e); - // Cleanup - _this._initDrag(); + this._animateToStop(e); }, diff --git a/starters/weather/app.js b/starters/weather/app.js new file mode 100644 index 0000000000..18080f301d --- /dev/null +++ b/starters/weather/app.js @@ -0,0 +1,16 @@ +angular.module('ionic.weather', ['ionic.weather.services', 'ionic.weather.directives']) + +.constant('API_KEY', '1cc2d3de40fa5af0') + +.filter('int', function() { + return function(v) { + return parseInt(v) || ''; + }; +}) + +.controller('WeatherCtrl', function($scope, Weather) { + + Weather.getAtCurrentLocation(function(resp) { + $scope.current = resp.current_observation; + }); +}); diff --git a/starters/weather/directives.js b/starters/weather/directives.js new file mode 100644 index 0000000000..99886b8103 --- /dev/null +++ b/starters/weather/directives.js @@ -0,0 +1,58 @@ +angular.module('ionic.weather.directives', []) + +.directive('currentTime', function($timeout, $filter) { + return { + restrict: 'E', + replace: true, + template: '{{currentTime}}', + scope: { + localtz: '=', + localTime: '=' + }, + link: function($scope, $element, $attr) { + $timeout(function checkTime() { + if($scope.localTime && $scope.localtz) { + $scope.currentTime = $filter('date')(parseInt($scope.localTime), 'h:mm') + $scope.localtz; + } + $timeout(checkTime, 500); + }); + } + } + }) + +.directive('smallWeather', function($timeout) { + return { + restrict: 'E', + replace: true, + transclude: true, + template: '
', + link: function($scope, $element, $attr) { + + // Delay so we are in the DOM and can calculate sizes + $timeout(function() { + var windowHeight = window.innerHeight; + var thisHeight = $element[0].offsetHeight; + var headerHeight = document.querySelector('#header').offsetHeight; + $element[0].style.marginTop = (windowHeight - thisHeight) + 'px'; + angular.element(document.querySelector('.content')).css('-webkit-overflow-scrolling', 'auto'); + $timeout(function() { + angular.element(document.querySelector('.content')).css('-webkit-overflow-scrolling', 'touch'); + }, 50); + }); + } + } +}) + +.directive('weatherBox', function($timeout) { + return { + restrict: 'E', + replace: true, + transclude: true, + scope: { + title: '@' + }, + template: '