256 lines
8.3 KiB
JavaScript
256 lines
8.3 KiB
JavaScript
Position.includeScrollOffsets = true;
|
|
|
|
var Engine = {
|
|
detect: function() {
|
|
var UA = navigator.userAgent;
|
|
this.isKHTML = /Konqueror|Safari|KHTML/.test(UA);
|
|
this.isGecko = (/Gecko/.test(UA) && !this.isKHTML);
|
|
this.isOpera = /Opera/.test(UA);
|
|
this.isMSIE = (/MSIE/.test(UA) && !this.isOpera);
|
|
this.isMSIE7 = this.isMSIE && !(/MSIE 6\./.test(UA) && !this.isOpera);
|
|
this.isMSIE6 = this.isMSIE && !this.isMSIE7;
|
|
if (document.childNodes && !document.all && !navigator.taintEnabled)
|
|
Engine[!!document.evaluate ? 'isSafari3' : 'isSafari2'] = true;
|
|
}
|
|
}
|
|
Engine.detect();
|
|
|
|
if (Engine.isMSIE){
|
|
try {
|
|
document.execCommand("BackgroundImageCache", false, true);
|
|
} catch(e) {
|
|
// ignore
|
|
}
|
|
}
|
|
|
|
Position.getPageSize = function() {
|
|
|
|
var xScroll, yScroll;
|
|
|
|
if (window.scrollMaxX) {
|
|
xScroll = window.innerWidth + window.scrollMaxX;
|
|
yScroll = window.innerHeight + window.scrollMaxY;
|
|
} else {
|
|
xScroll = document.body.scrollWidth;
|
|
yScroll = document.body.scrollHeight;
|
|
}
|
|
|
|
var windowWidth, windowHeight;
|
|
if (self.innerHeight) { // all except Explorer
|
|
windowWidth = self.innerWidth;
|
|
windowHeight = self.innerHeight;
|
|
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
|
|
windowWidth = document.documentElement.clientWidth;
|
|
windowHeight = document.documentElement.clientHeight;
|
|
} else if (document.body) { // other Explorers
|
|
windowWidth = document.body.clientWidth;
|
|
windowHeight = document.body.clientHeight;
|
|
}
|
|
// for small pages with total height less then height of the viewport
|
|
pageHeight = Math.max(windowHeight, yScroll);
|
|
|
|
// for small pages with total width less then width of the viewport
|
|
pageWidth = Math.max(windowWidth, xScroll);
|
|
|
|
return {
|
|
page: { width: pageWidth, height: pageHeight },
|
|
window: { width: windowWidth, height: windowHeight }
|
|
};
|
|
}
|
|
|
|
Position.scrollX = function(){
|
|
return (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0);
|
|
}
|
|
|
|
var Loader = {
|
|
|
|
_assets: $H({}),
|
|
_checkInterval: null,
|
|
_options: {},
|
|
_update: function() {
|
|
var allLoaded = true;
|
|
Loader._assets.each(function(a) {
|
|
if(!a[1].complete && a[1].image.complete) {
|
|
a[1].complete = true;
|
|
a[1].completed_at = new Date().getTime();
|
|
if(a[1].options.onComplete) {
|
|
a[1].options.onComplete(a[0]);
|
|
}
|
|
}
|
|
if(!a[1].complete && !a[1].image.complete) {
|
|
allLoaded = false;
|
|
}
|
|
});
|
|
if (allLoaded) {
|
|
clearInterval(Loader._checkInterval);
|
|
Loader._checkInterval = null;
|
|
if (Loader._options && Loader._options.onComplete) {
|
|
Loader._options.onComplete();
|
|
}
|
|
Loader._options = null;
|
|
}
|
|
},
|
|
|
|
initialize: function() {
|
|
var options = arguments[0] || {};
|
|
Loader._options = options;
|
|
},
|
|
|
|
cacheOrLoad: function(url) {
|
|
var options = arguments[1] || {};
|
|
if (this.isLoaded(url)) {
|
|
if (options.onComplete) {
|
|
options.onComplete();
|
|
}
|
|
} else {
|
|
this.load(url, options);
|
|
}
|
|
},
|
|
|
|
load: function(url) {
|
|
if (Loader._assets.get(url)) return;
|
|
var options = arguments[1] || {};
|
|
var a = { };
|
|
a.image = new Image();
|
|
a.image.src = url;
|
|
a.complete = false;
|
|
a.options = options;
|
|
a.loaded_at = new Date().getTime();
|
|
if (!Engine.isSafari2) {
|
|
Event.observe(a.image, 'error', function() { Loader.error(url) });
|
|
}
|
|
Loader._assets.set(url, a);
|
|
if (!Loader._checkInterval) {
|
|
Loader._checkInterval = setInterval(Loader._update, 10);
|
|
}
|
|
},
|
|
|
|
error: function(url) {
|
|
var asset = Loader._assets.get(url);
|
|
asset.complete = true;
|
|
if (asset.options.onComplete) {
|
|
asset.options.onComplete('assets/empty.gif');
|
|
}
|
|
},
|
|
|
|
stats: function(url) {
|
|
return (Loader._assets.get(url)._complete ?
|
|
(Loader._assets.get(url)._completed_at - Loader._assets.get(url)._loaded_at) : null);
|
|
},
|
|
|
|
isQueued: function(url) {
|
|
return !!(Loader._assets.get(url));
|
|
},
|
|
|
|
isLoaded: function(url) {
|
|
return (Loader._assets.get(url) && Loader._assets.get(url).complete);
|
|
},
|
|
|
|
remove: function(url) {
|
|
Loader._assets.unset(url);
|
|
},
|
|
|
|
reset: function() {
|
|
Loader._assets = $H({});
|
|
}
|
|
};
|
|
|
|
Event.localPointer = function(event) {
|
|
var p = [Event.pointerX(event), Event.pointerY(event)];
|
|
var element = arguments[1] || Event.element(event);
|
|
var e = Position.page($(element));
|
|
return [
|
|
p[0]-(e[0]+(window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0)),
|
|
p[1]-(e[1]+(window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0))];
|
|
};
|
|
|
|
Effect.HScroll = Class.create();
|
|
|
|
Object.extend(Object.extend(Effect.HScroll.prototype, Effect.Base.prototype), {
|
|
|
|
initialize: function(delta) {
|
|
|
|
this.scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
|
|
|
|
var w = Position.getPageSize();
|
|
if (this.scrollStart + delta < 0) {
|
|
delta = -this.scrollStart;
|
|
}
|
|
if (this.scrollStart + delta > (w.page.width-w.window.width)) {
|
|
delta = (w.page.width-w.window.width) - this.scrollStart;
|
|
}
|
|
this.delta = delta;
|
|
|
|
this.start(arguments[1] || {});
|
|
},
|
|
|
|
update: function(position) {
|
|
Position.prepare();
|
|
window.scrollTo(this.scrollStart + (position*this.delta), 0);
|
|
}
|
|
});
|
|
|
|
Effect.HScrollTo = Class.create();
|
|
|
|
Object.extend(Object.extend(Effect.HScrollTo.prototype, Effect.Base.prototype), {
|
|
initialize: function(scrollEnd) {
|
|
this.scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
|
|
|
|
var delta = scrollEnd - this.scrollStart;
|
|
var w = Position.getPageSize();
|
|
if (this.scrollStart + delta < 0) {
|
|
delta = -this.scrollStart;
|
|
}
|
|
if (this.scrollStart + delta > (w.page.width-w.window.width)) {
|
|
delta = (w.page.width-w.window.width) - this.scrollStart;
|
|
}
|
|
this.delta = delta;
|
|
|
|
this.start(arguments[1] || {});
|
|
},
|
|
|
|
update: function(position) {
|
|
Position.prepare();
|
|
window.scrollTo(this.scrollStart + (position*this.delta), 0);
|
|
}
|
|
});
|
|
|
|
Effect.HScrollToElement = function(element, direction) {
|
|
|
|
element = $(element);
|
|
|
|
var viewportMiddle = Position.getPageSize().window.width/2;
|
|
var scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
|
|
var elementMiddle = element.offsetWidth/2 + Position.cumulativeOffset(element).first();
|
|
var offset = scrollStart + viewportMiddle;
|
|
var clickOffset = Prototype.Browser.IE ? 20 : 17; //offset to keep arrows visible at 800x600
|
|
if (direction == 1)
|
|
var delta = elementMiddle - offset + clickOffset;
|
|
else
|
|
var delta = -(offset - elementMiddle) - clickOffset;
|
|
new Effect.HScroll(delta);
|
|
}
|
|
|
|
Effect.MoveRight = Class.create();
|
|
|
|
Object.extend(Object.extend(Effect.MoveRight.prototype, Effect.Base.prototype), {
|
|
|
|
initialize: function(element, delta) {
|
|
this.element = $(element);
|
|
if(!this.element) throw(Effect._elementDoesNotExistError);
|
|
var options = Object.extend({
|
|
x: delta
|
|
}, arguments[2] || {});
|
|
this.start(options);
|
|
},
|
|
|
|
setup: function() {
|
|
this.originalRight = this.options.initialRight || parseFloat(this.element.getStyle('right') || '0');
|
|
},
|
|
|
|
update: function(position) {
|
|
this.element.setStyle({
|
|
right: Math.round(this.options.x * position + this.originalRight) + 'px'
|
|
});
|
|
}
|
|
});
|