diff options
| author | Arjun Roychowdhury <pliablepixels@gmail.com> | 2015-11-01 09:55:53 -0500 |
|---|---|---|
| committer | Arjun Roychowdhury <pliablepixels@gmail.com> | 2015-11-01 09:55:53 -0500 |
| commit | 90292571dd1cd8d30531c55a8fa9c28cb9ebc116 (patch) | |
| tree | 979c493e3d9068cb6e1922c12ce7b80a8196521c | |
| parent | 2c2f2a731c71b8211714d7851a96ecbeef2cffd4 (diff) | |
fixed touch vs. click conflict while supporting desktop and device - was double eventing - #60
| -rw-r--r-- | www/external/angular-carousel.js | 18 | ||||
| -rw-r--r-- | www/templates/events.html | 2 |
2 files changed, 16 insertions, 4 deletions
diff --git a/www/external/angular-carousel.js b/www/external/angular-carousel.js index e0748f1d..dc387cf5 100644 --- a/www/external/angular-carousel.js +++ b/www/external/angular-carousel.js @@ -29,7 +29,7 @@ angular.module('angular-carousel') // so slide does not progress if image is not loaded or gets an error // imageLoadingDataShare is the factory that has a value // of 0 if no image is being loaded, -1 if there was an error and 1 if an image is currently being loaded -.directive('rnCarouselAutoSlide', ['$interval','$timeout', 'imageLoadingDataShare', function($interval,$timeout, imageLoadingDataShare) { +.directive('rnCarouselAutoSlide', ['$interval','$timeout', 'imageLoadingDataShare', function($interval,$timeout, imageLoadingDataShare ) { return { restrict: 'A', link: function (scope, element, attrs) { @@ -67,8 +67,20 @@ angular.module('angular-carousel') if (attrs.hasOwnProperty('rnCarouselPauseOnHover') && attrs.rnCarouselPauseOnHover !== 'false'){ // PP - added touchend to make it react to touch devices + if (attrs.hasOwnProperty('rnPlatform') && attrs.rnPlatform == 'unknown') + { + console.log ("Desktop, de-registering any old click"); + element.off('click', toggleAutoPlay); // PP - remove mouse click for desktop + element.on('click', toggleAutoPlay); // PP for desktop + console.log ("Desktop, registering click"); + } + else + { + console.log ("Device, de-registering any old touch"); + element.off('touchend', toggleAutoPlay); // PP - remove touchend too element.on('touchend', toggleAutoPlay); - element.on('click', toggleAutoPlay); // PP for desktop + console.log ("Device, registering touch"); + } //element.on('mouseenter', stopAutoPlay); //element.on('mouseleave', restartTimer); } @@ -367,7 +379,7 @@ angular.module('angular-carousel').run(['$templateCache', function($templateCach scope.nextSlide = function(slideOptions) { if (imageLoadingDataShare.get() == 1) // PP- If the image is still being loaded, hold on, don't change { - console.log ("Image is still loading, not skipping slides"); + //console.log ("Image is still loading, not skipping slides"); return; } var index = scope.carouselIndex + 1; diff --git a/www/templates/events.html b/www/templates/events.html index 32fcd70a..a894495e 100644 --- a/www/templates/events.html +++ b/www/templates/events.html @@ -138,7 +138,7 @@ <p>{{mycarousel.index+1}}/{{event.Event.Frames}} Type: {{FrameArray[mycarousel.index].Type}}</p> <div style="height:190px"> - <ul rn-carousel rn-carousel-buffered rn-carousel-transition="none" rn-swipe-disabled="true" rn-carousel-index="mycarousel.index" rn-carousel-auto-slide="{{calcMsTimer(event.Event.Frames, event.Event.Length)/1000.0}}" rn-carousel-pause-on-hover> + <ul rn-carousel rn-carousel-buffered rn-carousel-transition="none" rn-swipe-disabled="true" rn-carousel-index="mycarousel.index" rn-carousel-auto-slide="{{calcMsTimer(event.Event.Frames, event.Event.Length)/1000.0}}" rn-carousel-pause-on-hover rn-platform="$root.platformOS"> <li ng-repeat="slide in slides"> <!-- Linwood scaling --> <img imageonload="finishedLoadingImage($index)" image-spinner-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{slide.img}}&height=380" image-spinner-loader="lines" height="190px" ;/> |