From d0e4f42e4647760459e1974d257f298b3f4d4382 Mon Sep 17 00:00:00 2001 From: Mark Dalgleish Date: Sat, 30 Jul 2011 15:59:28 +1000 Subject: [PATCH] Better iPhone/iPad support --- fathom.js | 8 +++++--- fathom.min.js | 5 ++--- fathom.sample.css | 16 +++++++++++++++- 3 files changed, 22 insertions(+), 7 deletions(-) diff --git a/fathom.js b/fathom.js index b23155a..1684ea1 100644 --- a/fathom.js +++ b/fathom.js @@ -1,10 +1,11 @@ /* -Fathom.js v1.2.1 +Fathom.js v1.2.2 Copyright 2011, Mark Dalgleish This content is released under the MIT License github.com/markdalgleish/fathom/blob/master/MIT-LICENSE.txt */ + (function($, window, undefined){ var Fathom = function(container, options){ this.container = container; @@ -331,6 +332,7 @@ github.com/markdalgleish/fathom/blob/master/MIT-LICENSE.txt var self = this, slideSelector = self.config.slideTagName + (self.config.slideClass ? '.' + self.config.slideClass : ''), $scrollContainer = this.config.portable ? this.$portableContainer : $window, + isIOS = navigator.userAgent.match(/like Mac OS X/i) === null ? false : true, $elem; self.scrolling = false; @@ -345,8 +347,8 @@ github.com/markdalgleish/fathom/blob/master/MIT-LICENSE.txt var offsetX = self.config.portable ? $scrollContainer.position().left : 0, offsetY = self.config.portable ? $scrollContainer.position().top : 0, midpoint = { - x: offsetX + ($scrollContainer.width() / 2), - y: offsetY + ($scrollContainer.height() / 2) + x: offsetX + ($scrollContainer.width() / 2) + (isIOS ? $window.scrollLeft() : 0), + y: offsetY + ($scrollContainer.height() / 2) + (isIOS ? $window.scrollTop() : 0) }; $elem = $(document.elementFromPoint(midpoint.x, midpoint.y)); diff --git a/fathom.min.js b/fathom.min.js index c30019c..2da5ee5 100644 --- a/fathom.min.js +++ b/fathom.min.js @@ -1,8 +1,7 @@ /* -Fathom.js v1.2.1 +Fathom.js v1.2.2 Copyright 2011, Mark Dalgleish This content is released under the MIT License github.com/markdalgleish/fathom/blob/master/MIT-LICENSE.txt -*/ -(function(a,b,c){var d=function(a,b){this.container=a,this.options=b;return this.init()},e=a(b),f=a(document);d.prototype={defaults:{portable:c,portableTagName:"div",portableClass:"fathom-container",displayMode:"single",slideTagName:"div",slideClass:"slide",activeClass:"activeslide",inactiveClass:"inactiveslide",margin:100,onScrollInterval:300,scrollLength:600,timeline:c,video:c,onActivateSlide:c,onDeactivateSlide:c},init:function(){this.config=a.extend({},this.defaults,this.options),this.$container=a(this.container),this.$slides=this.$container.find(this.config.slideTagName+(this.config.slideClass?"."+this.config.slideClass:"")),this.$firstSlide=this.$slides.filter(":first"),this.$lastSlide=this.$slides.filter(":last"),this.$activeSlide=this.activateSlide(this.$firstSlide);return this._detectPortable()._setStyles()._setClasses()._setMargins()._setupEvents()._setupTimeline()._setupVideo()._setupScrollHandler()},nextSlide:function(){return this.scrollToSlide(this.$activeSlide.next())},prevSlide:function(){return this.scrollToSlide(this.$activeSlide.prev())},scrollToSlide:function(b){var c=this,d=this.config.portable?this.$portableContainer:a("html,body"),f=this.config.portable?this.$portableContainer:e,g=this.config.portable?this.$portableContainer.scrollLeft():0;if(b.length!==1)return b;this.isAutoScrolling=!0,d.stop().animate({scrollLeft:b.position().left+g-(f.width()-b.innerWidth())/2},c.config.scrollLength,function(){c.isAutoScrolling=!1});return this.activateSlide(b)},activateSlide:function(a){var b=a.get(0),d;if(this.$activeSlide!==c){d=this.$activeSlide.get(0);if(d===b)return a;this.$activeSlide.removeClass(this.config.activeClass).addClass(this.config.inactiveClass).trigger("deactivateslide.fathom"),typeof this.config.onDeactivateSlide=="function"&&this.config.onDeactivateSlide.call(d)}a.removeClass(this.config.inactiveClass).addClass(this.config.activeClass),this.$activeSlide=a,a.trigger("activateslide.fathom"),typeof this.config.onActivateSlide=="function"&&this.config.onActivateSlide.call(b);return a},setTime:function(a){var b=this._timeline||[];for(var c=0;ca){this.$activeSlide[0]!==b[c].slide[0]&&this.scrollToSlide(b[c].slide);break}},_detectPortable:function(){this.config.portable===c&&(this.$container.parent().is("body")?this.config.portable=!1:this.config.portable=!0);return this},_setupEvents:function(){var b=this;this.$container.delegate(this.config.slideTagName+"."+this.config.inactiveClass,"click",function(c){c.preventDefault(),b.scrollToSlide(a(this))}),f.keydown(function(a){var c=a.which;c===39||c===32?(a.preventDefault(),b.nextSlide()):c===37&&(a.preventDefault(),b.prevSlide())}),e.resize(function(){b._setMargins()});return this},_setStyles:function(){this.$container.css("white-space","nowrap"),this.$slides.css({"white-space":"normal",display:"inline-block","vertical-align":"top"}),this.config.portable&&(this.$portableContainer=a("<"+this.config.portableTagName+' class="'+this.config.portableClass+'" />'),this.$container.before(this.$portableContainer).appendTo(this.$portableContainer));return this},_setClasses:function(){this.$slides.addClass(this.config.inactiveClass),this.$activeSlide.removeClass(this.config.inactiveClass).addClass(this.config.inactiveClass);return this},_setMargins:function(){var b=this.config.displayMode,c=this.config.portable?this.$portableContainer:e,d=c.width(),f=Math.ceil((c.height()-this.$firstSlide.innerHeight())/2),g=Math.ceil((d-this.$firstSlide.innerWidth())/2),h=Math.ceil((d-this.$lastSlide.innerWidth())/2),i=Math.ceil(d/25);this.$container.css("margin-top",f),b==="single"?this.$slides.css("margin-right",g-i):b==="multi"&&this.$slides.css("margin-right",this.config.margin),this.$firstSlide.css("margin-left",g),this.$lastSlide.css("margin-right",h);if(this.config.portable){var j=parseInt(this.$container.css("padding-left"))+parseInt(this.$container.css("padding-right"));this.$slides.each(function(){j+=a(this).outerWidth(!0)}),this.$container.width(j)}return this},_setupTimeline:function(){function e(c){if(c.slide==null)d++;else if(a.type(c.slide)==="number")d=c.slide;else for(var e=b.filter(c.slide)[0],f=0;f';return a(d).appendTo(c.parent||"body")[0]}var d=this,c=this.config.video,e=!1;b.location.protocol==="file:"&&("console"in b&&console.log("vimeo video player api does not work with local files. Downgrading video support\nsee http://vimeo.com/api/docs/player-js"),e=!0),e?a(f()).bind("load",function(){d._setupDefaultTimeSource()}):a.getScript("http://a.vimeocdn.com/js/froogaloop2.min.js?",function(){$f(f()).addEvent("ready",function(a){var b=$f(a),e=!1;b.addEvent("play",function(a){e===!1&&(e=setInterval(function(){b.api("getCurrentTime",function(a,b){d.setTime(a)})},250))}),b.addEvent("pause",function(a){clearInterval(e),e=!1}),c.autoplay&&b.api("play")})})},_setupScrollHandler:function(){var b=this,d=b.config.slideTagName+(b.config.slideClass?"."+b.config.slideClass:""),f=this.config.portable?this.$portableContainer:e,g;b.scrolling=!1,setInterval(function(){if(b.scrolling&&(b.isAutoScrolling===!1||b.isAutoScrolling===c)){b.scrolling=!1;if(f.scrollLeft()===0)b.activateSlide(b.$firstSlide);else{var e=b.config.portable?f.position().left:0,h=b.config.portable?f.position().top:0,i={x:e+f.width()/2,y:h+f.height()/2};g=a(document.elementFromPoint(i.x,i.y)),g.is(d)?b.activateSlide(g):g=g.parents(d+":first").each(function(){b.activateSlide(a(this))})}}},b.config.onScrollInterval),f.scroll(function(){b.scrolling=!0});return this}},a.fn.fathom=function(a){new d(this,a);return this},d.defaults=d.prototype.defaults,d.setDefaults=function(b){a.extend(d.defaults,b)},b.Fathom=d})(jQuery,window); \ No newline at end of file +*/(function(a,b,c){var d=function(a,b){this.container=a,this.options=b;return this.init()},e=a(b),f=a(document);d.prototype={defaults:{portable:c,portableTagName:"div",portableClass:"fathom-container",displayMode:"single",slideTagName:"div",slideClass:"slide",activeClass:"activeslide",inactiveClass:"inactiveslide",margin:100,onScrollInterval:300,scrollLength:600,timeline:c,video:c,onActivateSlide:c,onDeactivateSlide:c},init:function(){this.config=a.extend({},this.defaults,this.options),this.$container=a(this.container),this.$slides=this.$container.find(this.config.slideTagName+(this.config.slideClass?"."+this.config.slideClass:"")),this.$firstSlide=this.$slides.filter(":first"),this.$lastSlide=this.$slides.filter(":last"),this.$activeSlide=this.activateSlide(this.$firstSlide);return this._detectPortable()._setStyles()._setClasses()._setMargins()._setupEvents()._setupTimeline()._setupVideo()._setupScrollHandler()},nextSlide:function(){return this.scrollToSlide(this.$activeSlide.next())},prevSlide:function(){return this.scrollToSlide(this.$activeSlide.prev())},scrollToSlide:function(b){var c=this,d=this.config.portable?this.$portableContainer:a("html,body"),f=this.config.portable?this.$portableContainer:e,g=this.config.portable?this.$portableContainer.scrollLeft():0;if(b.length!==1)return b;this.isAutoScrolling=!0,d.stop().animate({scrollLeft:b.position().left+g-(f.width()-b.innerWidth())/2},c.config.scrollLength,function(){c.isAutoScrolling=!1});return this.activateSlide(b)},activateSlide:function(a){var b=a.get(0),d;if(this.$activeSlide!==c){d=this.$activeSlide.get(0);if(d===b)return a;this.$activeSlide.removeClass(this.config.activeClass).addClass(this.config.inactiveClass).trigger("deactivateslide.fathom"),typeof this.config.onDeactivateSlide=="function"&&this.config.onDeactivateSlide.call(d)}a.removeClass(this.config.inactiveClass).addClass(this.config.activeClass),this.$activeSlide=a,a.trigger("activateslide.fathom"),typeof this.config.onActivateSlide=="function"&&this.config.onActivateSlide.call(b);return a},setTime:function(a){var b=this._timeline||[];for(var c=0;ca){this.$activeSlide[0]!==b[c].slide[0]&&this.scrollToSlide(b[c].slide);break}},_detectPortable:function(){this.config.portable===c&&(this.$container.parent().is("body")?this.config.portable=!1:this.config.portable=!0);return this},_setupEvents:function(){var b=this;this.$container.delegate(this.config.slideTagName+"."+this.config.inactiveClass,"click",function(c){c.preventDefault(),b.scrollToSlide(a(this))}),f.keydown(function(a){var c=a.which;c===39||c===32?(a.preventDefault(),b.nextSlide()):c===37&&(a.preventDefault(),b.prevSlide())}),e.resize(function(){b._setMargins()});return this},_setStyles:function(){this.$container.css("white-space","nowrap"),this.$slides.css({"white-space":"normal",display:"inline-block","vertical-align":"top"}),this.config.portable&&(this.$portableContainer=a("<"+this.config.portableTagName+' class="'+this.config.portableClass+'" />'),this.$container.before(this.$portableContainer).appendTo(this.$portableContainer));return this},_setClasses:function(){this.$slides.addClass(this.config.inactiveClass),this.$activeSlide.removeClass(this.config.inactiveClass).addClass(this.config.inactiveClass);return this},_setMargins:function(){var b=this.config.displayMode,c=this.config.portable?this.$portableContainer:e,d=c.width(),f=Math.ceil((c.height()-this.$firstSlide.innerHeight())/2),g=Math.ceil((d-this.$firstSlide.innerWidth())/2),h=Math.ceil((d-this.$lastSlide.innerWidth())/2),i=Math.ceil(d/25);this.$container.css("margin-top",f),b==="single"?this.$slides.css("margin-right",g-i):b==="multi"&&this.$slides.css("margin-right",this.config.margin),this.$firstSlide.css("margin-left",g),this.$lastSlide.css("margin-right",h);if(this.config.portable){var j=parseInt(this.$container.css("padding-left"))+parseInt(this.$container.css("padding-right"));this.$slides.each(function(){j+=a(this).outerWidth(!0)}),this.$container.width(j)}return this},_setupTimeline:function(){function e(c){if(c.slide==null)d++;else if(a.type(c.slide)==="number")d=c.slide;else for(var e=b.filter(c.slide)[0],f=0;f';return a(d).appendTo(c.parent||"body")[0]}var d=this,c=this.config.video,e=!1;b.location.protocol==="file:"&&("console"in b&&console.log("vimeo video player api does not work with local files. Downgrading video support\nsee http://vimeo.com/api/docs/player-js"),e=!0),e?a(f()).bind("load",function(){d._setupDefaultTimeSource()}):a.getScript("http://a.vimeocdn.com/js/froogaloop2.min.js?",function(){$f(f()).addEvent("ready",function(a){var b=$f(a),e=!1;b.addEvent("play",function(a){e===!1&&(e=setInterval(function(){b.api("getCurrentTime",function(a,b){d.setTime(a)})},250))}),b.addEvent("pause",function(a){clearInterval(e),e=!1}),c.autoplay&&b.api("play")})})},_setupScrollHandler:function(){var b=this,d=b.config.slideTagName+(b.config.slideClass?"."+b.config.slideClass:""),f=this.config.portable?this.$portableContainer:e,g=navigator.userAgent.match(/like Mac OS X/i)===null?!1:!0,h;b.scrolling=!1,setInterval(function(){if(b.scrolling&&(b.isAutoScrolling===!1||b.isAutoScrolling===c)){b.scrolling=!1;if(f.scrollLeft()===0)b.activateSlide(b.$firstSlide);else{var i=b.config.portable?f.position().left:0,j=b.config.portable?f.position().top:0,k={x:i+f.width()/2+(g?e.scrollLeft():0),y:j+f.height()/2+(g?e.scrollTop():0)};h=a(document.elementFromPoint(k.x,k.y)),h.is(d)?b.activateSlide(h):h=h.parents(d+":first").each(function(){b.activateSlide(a(this))})}}},b.config.onScrollInterval),f.scroll(function(){b.scrolling=!0});return this}},a.fn.fathom=function(a){new d(this,a);return this},d.defaults=d.prototype.defaults,d.setDefaults=function(b){a.extend(d.defaults,b)},b.Fathom=d})(jQuery,window) \ No newline at end of file diff --git a/fathom.sample.css b/fathom.sample.css index 97ffdf3..02188e5 100644 --- a/fathom.sample.css +++ b/fathom.sample.css @@ -78,4 +78,18 @@ div.slide { } div.activeslide { opacity: 1; - } \ No newline at end of file + } + +/* iPad */ +@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) { + div.inactiveslide { + opacity: 1; + } +} + +/* iPhone */ +@media only screen and (max-device-width: 480px) { + div.inactiveslide { + opacity: 1; + } +} \ No newline at end of file