// nuance website app
// (c) by fugu GmbH
// author: simon hiller
function Nuance(){
this.apps = [];
this.bound = {};
this.shareOpen = false;
this.shareActive = false;
}
Nuance.prototype.run = function(){
var $this = this;
if(window.addEventListener){
window.addEventListener("DOMContentLoaded", function(){$this.runRegisteredApps();},false);
} else {
this.runRegisteredApps();
}
}
Nuance.prototype.registerApp = function(func){
this.apps.push(func);
}
Nuance.prototype.runRegisteredApps = function(){
AJS.map(this.apps, function(func){func();});
this.handleResize(null);
}
Nuance.prototype.share = function(elmLink) {
var elm = AJS.$('site_recomment_div');
if (this.shareActive) {
return;
}
this.shareActive = true;
var that = this;
var height = AJS.getElementsByTagAndClassName(null, 'addthis_toolbox', elm)[0].offsetHeight;
var plusOne = AJS.getElementsByTagAndClassName(null, 'addthis_button_google_plusone', elm)[0];
if(plusOne && plusOne.lastChild.nodeType==1){
if(AJS.isIe()){
AJS.removeElement(plusOne)
}else{
plusOne.appendChild(plusOne.firstChild);
AJS.setStyle(plusOne.firstChild,'paddingRight','8px');
}
}
if(AJS.isIe())height+=20;
if (!this.shareOpen) {
elm.style.visibility = 'visible';
AJS.fx.setHeight(elm, {from: 0, to: height, onComplete: function(){that.shareActive = false;}})
this.shareOpen = true;
}else {
AJS.fx.setHeight(elm, {from: height, to: 0, onComplete : function() {elm.style.visibility = 'hidden';that.shareActive = false;}})
this.shareOpen = false;
}
}
Nuance.prototype.addDate = function(elmName) {
var elms = AJS.$bytc('input', 'date_add_item');
count = elms.length;
var d = AJS.DIV({'class' : 'form_sub_item'});
var html = '
';
AJS.setHTML(d, html)
AJS.ACN(elms[count - 1].parentNode.parentNode, d);
}
Nuance.prototype.handleResize = function (evt) {
var elm = AJS.getElementsByTagAndClassName(null, 'tpl_backgroundview', AJS.getBody())[0];
if(!elm)return;
var winH = window.innerHeight || document.documentElement.clientHeight;
if(winH>elm.offsetHeight){
if(AJS.isIe()){
var dif = winH-elm.offsetHeight;
var f = AJS.$('tpl_footer');
AJS.setHeight(f,dif + f.offsetHeight);
AJS.setHeight(elm,winH-10);
}
else {
AJS.setHeight(elm,winH);
}
}
}
Nuance.prototype.iniHeadNavigation = function() {
this.bound.repositionShimmer = AJS.bind(this.repositionShimmer,this);
this.bound.unlinkShimmer = AJS.bind(this.unlinkShimmer,this);
var arrayLinks = AJS.getElementsByTagAndClassName('a', null, AJS.getElementsByTagAndClassName('table', 'maintable', AJS.$('tpl_header'))[0]);
for(var i = 0;i1)this.subselect = this.select[1];
this.select = this.select[0]
AJS.addEventListener(this.select, 'change', this.bound.selectChange);
}
Catalog.prototype.toggleFormView = function(event){
AJS.preventDefault(event);
if(this.fx.timer)return;
if(this.formWrapper.style.display == 'none'){
this.formWrapper.style.display = 'block';
var nHeight = this.form.offsetHeight;
if(nHeight>this.formHeight)this.formHeight = nHeight;
this.fx.custom(0,this.formHeight);
this.updateButton(true);
}else{
this.fx.custom(this.formHeight,0);
}
}
Catalog.prototype.updateFormView = function(v){
if(parseInt(this.formWrapper.style.height)<10){
this.formWrapper.style.display = 'none';
this.updateButton(false);
}else {
this.formWrapper.style.height = 'auto';
}
}
Catalog.prototype.updateButton = function(open,ajax){
var data = open?{msg:Messages.closeSearch,action:'addClass'}:{msg:Messages.openSearch,action:'removeClass'};
for(var i=0;i0){
var xhr = AJS.getRequest(Helper.mergeUrl(Config.rootUrl, AJS.queryArguments({'category':c, 'ajax':'true'})),null, 'GET');
xhr.addCallback(this.bound.selectCallback);
xhr.sendReq();
}
}
Catalog.prototype.selectCallback = function(data, req){
var text = req.responseText;
var o = null;
if(text!=''){
try {
o = AJS.evalTxt(text);
}catch(e){}
}
if(!o)return;
if(!this.subselect){
this.subselect = AJS.SELECT({name:'subcategory'});
AJS.insertAfter(this.subselect, this.select);
}
this.subselect.options.length = 0;
for(var key in o){
this.subselect.options.add(new Option(o[key], key));
}
}
var nuance = new Nuance();
if(!Flags.isIe6){
AJS.addEventListener(window, 'resize', nuance.handleResize);
}else{
nuance.registerApp(function(){nuance.iniHeadNavigation()});
}
var catalog = new Catalog();
nuance.registerApp(function(){catalog.ini().iniHeadNav();nuance.iniInfo()});
/*
* ken burns and helpers
*/
// utils.. little mootools..
// (c) by fugu GmbH
// author: michael van der weg
var fuguTools = function(){
var me = this;
this.fps = 20;
this.round = function(number, count){
count = ((count == "" || count == 0) ? 1 : Math.pow(10,count));
return Math.round(number * count) / count;
}
// returns a non occupied id
this.getFreeId = function(prefix){
var length = 10;
var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');
if (! length) {
length = Math.floor(Math.random() * chars.length);
}
var str;
while(true){
str = "";
for (var i = 0; i < length; i++) {
str += chars[Math.floor(Math.random() * chars.length)];
}
if(prefix){
str = prefix + str;
}
if(!document.getElementById(str)){
return str;
}
}
}
// set a style
this.setStyle = function(el, style, value){
var e = me.e(el);
switch(style.toLowerCase()){
case "opacity":
try{
e.style.opacity = value;
e.style.filter = "alpha(opacity="+(value*100)+");";
} catch(ex){ }
break;
default:
try{
e.style[style] = value;
}catch(ex){}
break;
}
}
// set attribute
this.set = function(el, attributes){
var e = me.e(el);
if(e){
for(var key in attributes){
e.setAttribute(key, attributes[key]);
}
}
}
// set multiple styles
this.setStyles = function(el, styles){
for(var key in styles){
me.setStyle(el, key, styles[key]);
}
}
// return scrollTop
this.scrollPosition = function(el){
if(el){
return {
t: me.e(el).scrollTop
, l: me.e(el).scrollLeft
}
}
else{
if(document.pageXOffset){
return {
t: document.pageYOffset
, l: document.pageXOffset
}
}
else if(document.documentElement.scrollTop){
return {
t: document.documentElement.scrollTop
, l: document.documentElement.scrollLeft
}
}
else if(document.body.scrollTop){
return {
t: document.body.scrollTop
, l: document.body.scrollLeft
}
}
}
return {
t: 0
, l: 0
}
}
// welement dimensions
this.dimensions = function(el){
var ret = {h:0,w:0};
if(el){
var e = me.e(el);
try{
ret.h = e.clientHeight;
ret.w = e.clientWidth;
}
catch(ex){}
}
else{
try{
ret.h = window.innerHeight;
ret.w = window.innerWidth;
if(ret.h == undefined) throw("could not get dimensions");
}
catch(ex){
ret.h = document.body.offsetHeight;
ret.w = document.body.offsetWidth;
}
}
return ret;
}
// get element by id
this.e = function(el){
if(typeof(el) != "object"){
if(el.substr(0,1) == "#")
{
return document.getElementsByTagName(el.substr(1));
}
else{
return document.getElementById(el);
}
}
else{
return el;
}
}
// fade element
this.fade = function(el, time, from, to, callback){
this.frames = Math.floor(me.fps*(time/1000))
this.stepper = Math.floor(1000/me.fps);
var ostepper = ((to - from)/this.frames);
var currentOpacity = from;
for(var i = 0;i < this.frames; i++){
setTimeout(function(){
currentOpacity += ostepper;
me.setStyle(el, "opacity", currentOpacity);
}, (i * this.stepper));
}
if(callback) setTimeout(callback, time);
}
// create element
this.element = function(type, id, styles){
var el = document.createElement(type);
el.setAttribute("id", id);
me.setStyles(el, styles);
return el;
}
// add event
this.addEvent = function(el, type, callback){
try{
me.e(el).addEventListener(type, callback, false);
}
catch(ex){
me.e(el).attachEvent(("on" + type), callback);
}
}
}
// ken burns animation
// (c) by fugu GmbH
// author: michael van der weg
var kenBurns = function(options){
this.a = new fuguTools();
var self = this;
// startup
this.initialize = function(options){
this.options = options;
this.images = [];
this.fps = 30;
this.interval = (1000/this.fps);
this.nonCanvas = false;
// start animation
this.index = 0
// start fallback if canvas could not be started
if(!this.probe.call(this) || !this.prepare.call(this)){
this.nonCanvas = true;
this.initialHidden = false;
this.prepareFallback();
}
}
// static images insted of ken burns
this.fallback = function(index, firstCall){
if(!firstCall){
this.a.fade(this.a.e(this.id), 500, 0, 1, function(){
self.a.e("animatetiamge").style.display = "none";
});
}
// compute scale factor
var min = {h: this.options.styles.height, w: this.options.styles.width}
var max = {h: this.images[index].image.height, w: this.images[index].image.width}
var factor = ((min.h/max.h) > (min.w/max.w)) ? (min.h/max.h) : (min.w/max.w) ;
min.h = max.h*factor;
min.w = max.w*factor;
var dim = {w:((max.w > min.w) ? max.w : min.w), h:((max.h > min.h) ? max.h : min.h)}
this.a.setStyles(this.image, {
width: parseInt(dim.w, 10)
, height: parseInt(dim.h, 10)
, top: ((dim.h - this.options.styles.height)/2*-1)
, left: ((dim.w - this.options.styles.width)/2*-1)
, position: "relative"
});
this.changeMessage.call(self, index);
setTimeout(function(){
if(self.index < (self.images.length-1)){
self.index++;
}
else{
self.index = 0;
}
self.a.fade(self.a.e(self.id), 500, 1, 0, function(){
self.image.src = self.images[self.index].image.src;
self.fallback.call(self, self.index);
});
}, this.images[index].time);
}
this.changeMessage = function(index){
document.getElementById("front_title_1").innerHTML = " " + self.images[index].title1;
document.getElementById("front_title_2").innerHTML = " " + self.images[index].title2;
}
// animate image
this.animate = function(index){
while(!this.images[index]){
index = this.index = (this.index < (this.images.length-1)) ? (this.index+1) : 0 ;
}
// get min / max dimensions
var numSteps = (Math.ceil(this.images[index].time/1000*this.fps));
var min = {h: this.options.styles.height, w: this.options.styles.width}
var max = {h: this.images[index].image.height, w: this.images[index].image.width}
var factor = ((min.h/max.h) > (min.w/max.w)) ? (min.h/max.h) : (min.w/max.w) ;
if(factor < 0.87 ) factor = 0.87; // throttle
min.h = max.h*factor;
min.w = max.w*factor;
// start stop dimensiosn and positions
this.images[index].start = {top: 0, left: 0, width: max.w, height: max.h}
this.images[index].stop = {top: ((max.h - min.h)/2)*Math.random(), left: ((max.w - min.w)/2)*Math.random(), width: min.w, height: min.h}
// set parameters for the animation
var options = {
step:{
t: ((this.images[index].start.top-this.images[index].stop.top)/numSteps)
, l: ((this.images[index].start.left-this.images[index].stop.left)/numSteps)
, w: ((this.images[index].start.width-this.images[index].stop.width)/numSteps)
, h: ((this.images[index].start.height-this.images[index].stop.height)/numSteps)
}
, current:{
t: this.images[index].start.top
, l: this.images[index].start.left
, h: this.images[index].start.height
, w: this.images[index].start.width
}
, img: this.images[index].image
, index: index
, h: min.h
, w: min.w
, t: ((min.h - this.options.styles.height)/2)*-1
, l: ((min.w - this.options.styles.width)*Math.random())*-1
, ctx: this.context_outer
, counter: 0
, numSteps: numSteps
, self: this
}
// change message
this.changeMessage.call(self, index);
var interval = setInterval(function(){
try{
// decrease index (because of the possible removal of images fomr the images array
// on their on onload event (too small images are beeing removed onload))
while(!self.images[index]){
if(index < (self.images.length-1)){
index++;
}
else{
index = 0;
}
}
options.ctx.drawImage(self.images[index].image, options.current.l, options.current.t, options.current.w, options.current.h, options.l, options.t , options.w, options.h);
} catch(ex){ /* drawing failed, fail silently */ }
options.counter++;
// compute new values
options.current.t = options.self.a.round((options.current.t -= options.step.t), 5);
options.current.l = options.self.a.round((options.current.l -= options.step.l), 5);
options.current.h = options.self.a.round((options.current.h -= options.step.h), 5);
options.current.w = options.self.a.round((options.current.w -= options.step.w), 5);
// transition
if(options.counter > (options.numSteps-5)){
options.ctx.globalAlpha = (options.ctx.globalAlpha-0.2)
}
if(options.counter < 25){
options.ctx.globalAlpha = (options.ctx.globalAlpha+0.04)
}
// increase counter / start next image
if(options.counter == options.numSteps) {
clearInterval(interval);
options.self.index = (options.self.index < (options.self.images.length-1)) ? (options.self.index+1) : 0 ;
options.self.animate.call(options.self, options.self.index)
}
}, this.interval);
}
// test if the 2d context is available
this.probe = function(){
try{
var x = this.a.element("canvas", this.a.getFreeId("test_")).getContext('2d');
return true;
} catch(e){}
return false;
}
// prepare fallback functions
this.prepareFallback = function(){
var id = this.a.getFreeId("kenburns_");
this.id = id;
this.image = this.a.element("img", id, this.options.styles);
this.a.e(self.options.target).appendChild(this.image);
this.image.src = this.a.e("animatetiamge").src;
// start preloader
this.loadImages.call(this);
}
// create element, initilize them
this.prepare = function(){
// check compat
// get some free ids
var id = this.a.getFreeId("kenburns_");
this.id = id;
// create canvas
this.canvas_outer = this.a.element("canvas", id, {});
// attach to dom
this.a.e(this.options.target).appendChild(this.canvas_outer);
// get refeence of the cancas div
var c = this.a.e(this.canvas_outer);
this.a.setStyles(this.canvas_outer, {
position: "relative"
, display: "block"
, opacity: 0
});
// set dimensions
this.canvas_outer.width = this.options.styles.width;
this.canvas_outer.height = this.options.styles.height;
// create context
try{
this.context_outer = this.canvas_outer.getContext('2d');
this.loadImages.call(this);
return true;
}
catch(ex){
return false;
}
}
this.getImageIndex = function(src){
for(var i = 0; i < this.images.length; i++){
if(this.images[i] && this.images[i].image.src == src){
return i;
}
}
return 0;
}
// preloads images
this.loadImages = function(){
for (var i = 0; i < this.options.images.length; i++){
this.images[i] = {
src: this.options.images[i].url
, time: this.options.images[i].time
, start: this.options.images[i].start
, stop: this.options.images[i].stop
, image: new Image()
, title1: this.options.images[i].title1
, title2: this.options.images[i].title2
};
this.images[i].image.src = this.images[i].src;
this.a.addEvent(this.images[i].image, "load", function(){
var currentIndex = self.getImageIndex(this.src);
if(this.width < self.options.styles.width || this.height < self.options.styles.height){
// remove image, its too small for animation
self.images.splice(currentIndex, 1);
}
else{
if(!self.fired){
self.fired = true;
if(self.nonCanvas){
self.fallback.call(self, 0);
}
else{
self.animate.call(self, currentIndex);
self.a.fade(self.id, 500, 0, 1, function(){});
}
}
}
});
}
}
// init class
this.initialize.call(self, options);
}
var startKB = function(){
for(var i = 0; i < KBanimatedImages.length; i++){
KBanimatedImages[i].start = {};
KBanimatedImages[i].stop = {};
KBanimatedImages[i].url = KBanimatedImages[i].url.replace(/&/ig, "&");
KBanimatedImages[i].time = 5000;
}
new kenBurns({
target: "animationContainerKenBurns"
, styles:{
height: 340
, width: 960
}
, images: KBanimatedImages
});
}