Event.observe(window, 'load', function() {
//SmallButtons.initialize();
$$('input[type="checkbox"],input[type="radio"]').each(function(checkbox) {
checkbox.style.border = '0';
});
if (typeof(Calendar) == 'function') {
$$('input.datePick').each(function(dateInput) {
var options = {
inputField : dateInput,
ifFormat : '%Y-%m-%d',
button : dateInput,
eventName: 'focus',
onUpdate: function() { dateInput.blur(); },
dateStatusFunc: function(date) {
}
};
var m;
// begindatum
m = new RegExp('start:(\\d+):(\\d+):(\\d+)').exec(dateInput.className);
if (m != null) {
var date = new Date();
date.setYear(m[1]);
date.setMonth(m[2] - 1);
date.setDate(m[3]);
options.date = date;
}
// range
m = new RegExp('range:(\\d+):(\\d+):(\\d+):(\\d+):(\\d+):(\\d+)').exec(dateInput.className);
if (m != null) {
var begin = new Date();
begin.setYear(m[1]);
begin.setMonth(m[2] - 1);
begin.setDate(m[3]);
var end = new Date();
end.setYear(m[4]);
end.setMonth(m[5] - 1);
end.setDate(m[6]);
options.dateStatusFunc = function(date) {
return !(date >= begin && date <= end);
};
}
Calendar.setup(options);
});
}
var popupElements = $$('a.imgPopup');
if (popupElements && popupElements.length > 0) {
var imgPopupTpl = new Template('#{title}'
+ '
'
+ ''
+ '');
var currentPopup;
popupElements.each(function(link) {
link.observe('click', function(evt) {
var offset = link.cumulativeOffset();
if (currentPopup) {
currentPopup.close();
}
currentPopup = window.open('','image', 'toolbar=0,location=0,directories=0,menuBar=0,scrollbars=0,resizable=1,left='+offset[0]+',top='+offset[1]+'');
currentPopup.document.open();
currentPopup.document.write(imgPopupTpl.evaluate({
src: link.href
}));
currentPopup.document.close()
Event.stop(evt);
});
});
}
});
/*Popup = {
Display: function(name, element) {
new Ajax.Request('/Ajax/Popup/'+escape(name), {
onComplete: function(response) {
var pos = Position.cumulativeOffset(element);
$('popup').show();
$('popup').innerHTML = response.responseText;
$('popup').setStyle({
left: pos[0]+'px',
top: pos[1]+'px'
});
}
});
},
Hide: function() {
$('popup').hide();
}
};*/
function TT_SelectImage(img) {
if ($('fullimg')) {
document.body.removeChild($('fullimg'));
}
$('selectedImageInnerContainer').innerHTML = '';
new Effect.Morph('imageListPanes', {
style: 'top: -396px',
duration: 0.3,
afterFinish: function() {
var dDimension = document.viewport.getDimensions();
var midSizeImg = '/Img/Perform/resize_552_356/?file='+img;
var fullSizeImg = '/Img/Perform/resize_'+dDimension.width+'_'+dDimension.height+'/?file='+img;
$('selectedImageInnerContainer').innerHTML = '
';
// middelgrote preloaden
new Preloader(midSizeImg, {
onComplete: function() {
// volledige preloaden
new Preloader(fullSizeImg, {
onComplete: function(fullImageSize) {
setTimeout(function() {
var midSizeImage = $(document.createElement('IMG'));
midSizeImage.src = midSizeImg;
midSizeImage.style.cursor = 'pointer';
midSizeImage.className = 'p';
$('selectedImageInnerContainer').innerHTML = '';
$('selectedImageInnerContainer').insert(midSizeImage);
var fullImage = $(document.createElement('IMG'));
fullImage.src = fullSizeImg;
fullImage.id = 'fullimg';
fullImage.style.cursor = 'pointer';
fullImage.style.border = '1px solid #232323';
fullImage.style.zIndex = '200';
fullImage.style.position = 'absolute';
fullImage.hide();
document.body.insertBefore(fullImage, document.body.firstChild);
Position.clone(midSizeImage, fullImage);
var midPosition = Position.cumulativeOffset(midSizeImage);
var currentMorph;
midSizeImage.onclick = function() {
if (currentMorph) {
currentMorph.cancel();
}
dDimension = document.viewport.getDimensions();
var scrollOffsets = document.viewport.getScrollOffsets();
var left = (dDimension.width / 2) - (fullImageSize[0] / 2);
var top = (dDimension.height / 2) - (fullImageSize[1] / 2);
left += scrollOffsets.left;
top += scrollOffsets.top;
fullImage.show();
currentMorph = new Effect.Morph(fullImage, {
duration: 0.3,
style: 'left: '+left+'px;'+
'width: '+fullImageSize[0]+'px;'+
'height: '+fullImageSize[1]+'px;'+
'top: '+top+'px;'
}
);
};
fullImage.onclick = function() {
if (currentMorph) {
currentMorph.cancel();
}
currentMorph = new Effect.Morph(fullImage, {
duration: 0.3,
style: 'left: '+midPosition[0]+'px;'+
'width: '+midSizeImage.offsetWidth+'px;'+
'height: '+midSizeImage.offsetHeight+'px;'+
'top: '+midPosition[1]+'px;',
afterFinish: function() {
fullImage.hide();
}
});
};
}, 50);
}
});
}
});
}
});
}
Preloader = Class.create({
initialize: function(image, options) {
this.options = Object.extend({
onComplete: Prototype.emptyFunction,
onFailure: Prototype.emptyFunction,
autoLoad: true
}, options || {});
this.image = image;
this.imageObj = new Image();
if (this.options.autoLoad) {
this.load();
}
},
onImageLoaded: function() {
this.options.onComplete([this.imageObj.width, this.imageObj.height]);
},
onImageError: function() {
this.options.onFailure(this.image);
},
load: function() {
this.imageObj.src = this.image;
this.imageObj.onload = this.onImageLoaded.bind(this);
this.imageObj.onerror = this.onImageError.bind(this);
}
});
SmallButtons = {
items: {
'main': {
'mouseover': {}
},
'green': {
'mouseover': {}
},
'security': {
'mouseover': {}
},
'benefits': {
'mouseover': {}
},
'freedom': {
'mouseover': {}
}
},
initialize: function() {
for (var subject in this.items) {
var item = this.items[subject];
item.element = $('sb' + subject.capitalize());
item.mouseover.element = $('sbo' + subject.capitalize());
item.mouseover.element.setStyle({
top: '-40px'
});
}
},
displayAll: function() {
var i = 1;
for (var subject in this.items) {
this.displayButton(subject, (i++)*0.1);
}
},
displayButton: function(which, delay) {
var item = this.items[which];
new Effect.Morph(item.element, {
delay: delay,
style: 'top: 0px',
duration: 0.4
});
},
mouseOver: function(which) {
var item = this.items[which];
if (item.transition) {
item.transition.cancel();
}
item.transition = new Effect.Morph(item.mouseover.element, {
style: 'top: 10px;',
duration: 0.2
});
},
mouseOut: function(which) {
var item = this.items[which];
if (item.transition) {
item.transition.cancel();
}
item.transition = new Effect.Morph(item.mouseover.element, {
style: 'top: -40px;',
duration: 0.2
});
}
};