/**
 * file default.js
 *
 * contains javascript for To Increase website
 *
 * @require MooTools version 1.2.2
 */

window.addEvents({
    'domready': function() {
        initMenu();
        defaultInputText();
        handleSearchButton('/search.aspx?q=');
        initProductPanels();
        initSubmenu();
        //initTogglemenu();
        showProductBody();
        initTabs();
        initSlideShow($$('div.headerslideshow')[0], 10000);
    },
    'load': function() {
        initPartnerMap();
        initLogoTicker();
    }
});


/**
* initMenu
*
* initializes menu
*
* @author CSD 
* @return void
*/

function initMenu() {

	if ($$('ul.main_nav ul').length == 0) return false;

	var arrNavListItems = $$('ul.main_nav>li');

	arrNavListItems.each(function(elNavListItem, index) {

	    if (!elNavListItem.hasClass('nosub')) {

	        // meten
	        if(!elNavListItem.hasClass('solutions')) {
				elNavListItem.openW = elNavListItem.getElement('ul').getSize().x;
				elNavListItem.getElement('div').setStyle('width', elNavListItem.openW);
			}
	        elNavListItem.openH = elNavListItem.getElement('div').getSize().y;
	        
	        elNavListItem.getElement('div').setStyle('height', 0);
	        elNavListItem.getElement('div').setStyle('visibility', 'visible');

	        elNavListItem.addEvent('mouseenter', function() {

	            this.getElement('div').tween('height', this.openH);

	        });

	        elNavListItem.addEvent('mouseleave', function() {
	            this.getElement('div').tween('height', 0);
	        });
	    }

	})
}


/**
* initSlideShow
*
* initializes slideshow
*
* @author CSD 
* @return void
*/

function initSlideShow (slideshow, interval) {

    if (!slideshow) return false;
    slideshow.currentSlide = 0;
	    
    var slideshowImages = slideshow.getElements('img');
    
    // show first
    slideshowImages.setOpacity(0);
    slideshowImages[0].setOpacity(1);
    
    // start slideshow
    var bubbleAutoPlay = nextHeaderSlideShowImage.periodical(interval, this, slideshow);
    
}


/**
* nextHeaderSlideShowImage
*
* show next slideshow image
*
* @author CSD 
* @return void
*/

function nextHeaderSlideShowImage(slideshow) {

	var slideshowImages = slideshow.getElements('img');
	slideshowImages[slideshow.currentSlide].set('tween', {'duration': 2500});
	slideshowImages[slideshow.currentSlide].tween('opacity', [1, 0]);
	
	if (slideshow.currentSlide < (slideshowImages.length - 1)) {
		slideshow.currentSlide++;
    } else {
		slideshow.currentSlide = 0;
    }

    slideshowImages[slideshow.currentSlide].set('tween', {'duration': 2500});
	slideshowImages[slideshow.currentSlide].tween('opacity', [0, 1]);
    
}


/**
* defaultInputText
*
* toggles default text in text inputfields
*
* @author Klaas Dieleman <klaas{AT}efocus.nl>
* @return void
*/
 
function defaultInputText() {
	var inputfields = $$('.defaultText');
	
	inputfields.each(function(item) {
		item.defaultText = item.value;
		item.addClass('default');
		
		item.addEvents({
			'focus': function() {
				if (item.value == item.defaultText) item.value = '';
				item.removeClass('default');
			},
			'blur': function() {
				if (item.value == '') {
					item.value = item.defaultText;
					item.addClass('default');
				}
			}
		});
	});
}


/**
 * handleSearchButton
 *
 * enables keyboard and mouse input on search field and button
 *
 * @param searchURL string; URL to search results page
 * @author Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 */
 
function handleSearchButton(searchURL) {
	if(!document.getElement('fieldset.search')) return false;
	
	var gotoSearch = function(event, searchField) {
		event.preventDefault();
		var searchQuery = searchField.getElement('input.text').get('value');
		window.location = encodeURI(searchURL + searchQuery);
	}
	
	document.getElements('fieldset.search').each(function(item) {
	
		item.getElement('input.text').addEvent('keydown', function(event) {
			if (event.key == 'enter') gotoSearch(event, item)
		});
		
		item.getElement('a').addEvents({
			'keydown': function(event) {
				if (event.key == 'enter') gotoSearch(event, item)
			},
			'click': function(event) { gotoSearch(event, item) }
		});
		
	});
}


/**
 * initProductPanels
 *
 * enables mouseover-toggling of navigation panels in product overview on homepage
 *
 * @author Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 */

function initProductPanels() {
	if (!document.getElement('div.productoverzicht')) return false;

	$$('div.productoverzicht h3, div.productoverzicht img').each(function(item) {
		item.addEvent('mouseenter', function() {
			item.getParent().addClass('active');
		});
	});

	$$('div.productoverzicht ul.productsoverview>li').each(function(item) {
		item.addEvent('mouseleave', function() {
			item.removeClass('active');
		});
    });

    var navPanelMainList = $$('div.productoverzicht ul li.nav div.panel>ul>li');

    if (navPanelMainList.length > 2) {

        navPanelMainList[1].clone().injectAfter(navPanelMainList[2]);
        navPanelMainList[1].dispose();
        navPanelMainList[2].setStyle('float', 'right');
        
    }
    
}


/**
* function showProductBody
*
* shows or hides product detail body
*
* @author Mirjam <mirjam{AT}efocus.nl>
* @return void
*/

function showProductBody() {

	var productButtons = $$('div.productdetail a.buttonProductBody');
	if (productButtons.length == 0) return false;

	productButtons.each(function(productButton) {

		var productButtonMore = productButton.getParent('div.productdetail').getElement('div.productBody');
		var newH = productButtonMore.getScrollSize().y;

		if (productButtonMore) {
			productButton.thismore = productButtonMore;
			productButton.h = newH;
			productButton.addEvent('click', function() {
				productButton.blur();
				if (this.thismore.getStyle('height').toInt() > 0) {
					this.thismore.tween('height', 0);
					productButton.removeClass('active');
				} else {
					this.thismore.tween('height', this.h);
					productButton.addClass('active');
				}
			});
		}

	});

}


/**
 * initSubmenu
 *
 * initializes submenu interaction
 *
 * @author Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 *
 */
 
function initSubmenu() {
	if($$('ul.submenu').length != $$('ul.submenuproducts li').length || $$('ul.submenuproducts li').length != 3) return false;

	// find the current subpage (via css class 'current') and identify the matching parent item
	// for the accordion to show initially
	var activeAccItem = -1;
	var subpages = $$('ul.submenuaccordion li li');
	var currentsubpages = subpages.filter(function(item) {
		return (item.hasClass('current'));
	});
	if(currentsubpages.length > 0) {
		var parentElements = currentsubpages.getLast().getParents();
		for(var i = 0; i < parentElements.length; i++) {
			if(parentElements[i].match('li') && parentElements[i + 1].match('ul.submenuaccordion')) {
				activeAccItem = $$('ul.submenuaccordion>li').indexOf(parentElements[i]);
			}
		}
	}
	
	var submenuAccordion = new Accordion($$('ul.submenuaccordion li h4'), $$('ul.submenuaccordion li div'), {
		onActive: function(toggler){
			toggler.getParent().addClass('active');
		},
		onBackground: function(toggler){
			toggler.getParent().removeClass('active');
		},
		alwaysHide: true,
		show: activeAccItem

	});

	$$('ul.submenuproducts li').each(function(item, index) {
	    item.addEvent('click', function() {
	        $$('ul.submenu').hide();
	        $$('ul.submenuproducts li').removeClass('active');
	        $$('ul.submenu')[index].show();
	       
	        item.addClass('active');
	    });
	});
	
	// find the current subpage (via css class 'current') and identify the matching main productgroup to show initially
	var activeProduct = 0;
	var subpages = $$('ul.submenu li');
	var currentsubpages = subpages.filter(function(item) {
		return (item.hasClass('current'));
	});
	if(currentsubpages.length > 0) {
		var parentElements = currentsubpages.getLast().getParents();
		for(var i = 0; i < parentElements.length; i++) {
			if(parentElements[i].match('ul.submenu')) {
				activeProduct = $$('ul.submenu').indexOf(parentElements[i]);
			}
		}
	}
	
	$$('ul.submenuproducts li')[activeProduct].fireEvent('click');
	
	$$('ul.submenu').setStyle('visibility', 'visible');
	
}


/**
 * initTogglemenu
 *
 * initializes submenu toggling
 *
 * @author Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 *
 */
 
function initTogglemenu() {
	// Even on hold, totdat duidelijk is of dit erin moet
	if(document.getElement('div.submenu h4') && document.getElement('div.togglemenu')) {
		var toggleMenuFX = new Fx.Slide(document.getElement('div.togglemenu'), {
			mode: 'vertical',
			duration: 1000,
			transition: Fx.Transitions.Pow.easeOut
		});
		toggleMenuFX.toggle();
	}
}


/**
 * initTabs()
 *
 * enables tab functionality
 *
 * @author Jasper Leferink <jasper.leferink{AT}efocus.nl>, extended by Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 */

function initTabs() {
	var arrTabListItems = $$('ul.tabs li');
	var arrPanels = $$('table.panel');

	if (arrTabListItems.length != arrPanels.length || arrTabListItems.length == 0 || arrPanels.length == 0) return false;

	arrTabListItems[0].addClass('active');
	arrPanels[0].addClass('active');

	arrTabListItems.each(function(elTabListItem, index) {
		elTabListItem.addEvent('click', function() {
			elTabListItem.blur();
			arrTabListItems.removeClass('active');
			elTabListItem.addClass('active');

			arrPanels.removeClass('active');
			arrPanels[index].addClass('active');
		});
	})
	
	// activate tab on load through querystring
	var initialTab = -1;
	var queryString = location.search.substring(1, location.search.length);
	var queryArguments = queryString.split("&");
	for (var i = 0; i < queryArguments.length; ++i) {
		var queryPair = queryArguments[i].split('=');
		if (queryPair[0] == 'tab' && queryPair[1] != null) initialTab = queryPair[1];
	}
	if (initialTab != -1) {
		if(arrTabListItems[initialTab]) {
			arrTabListItems[initialTab].fireEvent('click');
		}
	}
}


/**
 * GetEnter
 * Gets the key "enter" on the input
 *
 * @author Jeroen Datema <jeroen.datema[at]efocus.nl>
 * @return void
 */
function GetEnter(url, e, zoekstring) {
    var keycode;
    if (window.event) keycode = window.event.keyCode;
    else if (e) keycode = e.which;
    else return true;
    if (keycode == 13) {
        window.location = url + "?q=" + encodeURIComponentNew(zoekstring);
        return false;
    }
    else
        return true;
}


/**
 * RedirectZoek
 *
 * @author Jeroen Datema <jeroen.datema[at]efocus.nl>
 * @return void
 */
function RedirectSearch(url, zoekstring) {
    window.location = url + "?q=" + encodeURIComponentNew(zoekstring);
    return false;
}


/** 
 * functie encodeURIComponentNew() doet escape() maar dan netjes unicode 
 *
 * @author Barend <barend[at]efocus.nl>
 */
var hexchars = "0123456789ABCDEF";
var okURIchars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789_-";
function encodeURIComponentNew(s) {
    var s = utf8(s);
    var c;
    var enc = "";
    for (var i = 0; i < s.length; i++) {
        if (okURIchars.indexOf(s.charAt(i)) == -1)
            enc += "%" + toHex(s.charCodeAt(i));
        else
            enc += s.charAt(i);
    }
    return enc;
}


function toHex(n) {
    return hexchars.charAt(n >> 4) + hexchars.charAt(n & 0xF);
}


function utf8(wide) {
    var c, s;
    var enc = "";
    var i = 0;
    while (i < wide.length) {
        c = wide.charCodeAt(i++);
        // handle UTF-16 surrogates
        if (c >= 0xDC00 && c < 0xE000) continue;
        if (c >= 0xD800 && c < 0xDC00) {
            if (i >= wide.length) continue;
            s = wide.charCodeAt(i++);
            if (s < 0xDC00 || c >= 0xDE00) continue;
            c = ((c - 0xD800) << 10) + (s - 0xDC00) + 0x10000;
        }
        // output value
        if (c < 0x80) enc += String.fromCharCode(c);
        else if (c < 0x800) enc += String.fromCharCode(0xC0 + (c >> 6), 0x80 + (c & 0x3F));
        else if (c < 0x10000) enc += String.fromCharCode(0xE0 + (c >> 12), 0x80 + (c >> 6 & 0x3F), 0x80 + (c & 0x3F));
        else enc += String.fromCharCode(0xF0 + (c >> 18), 0x80 + (c >> 12 & 0x3F), 0x80 + (c >> 6 & 0x3F), 0x80 + (c & 0x3F));
    }
    return enc;
}

/**
 * initPartnerMap
 * initializes partner map rollovers and clicks
 *
 * @author Rocco Janse, <rocco[at]efocus.nl>
 * @editor Mirjam, <mirjam[at]efocus.nl>
 * @return void
 */

function initPartnerMap() {
    
    var map = $('worldmap');
    var imagemap = $('imagemap');
    
    if (!imagemap) return false;
    
    var hovers = imagemap.getElements('area');
    hovers.each(function(area) {
		
		//preload images
		var preloadImg = new Element('img', {
			src: '/siteimg/map_' + area.getProperty('id') + '.png'
		});

        area.addEvents({
            'mouseenter': function() {
                map.addClass(area.getProperty('id'));
            },
            'mouseleave': function() {
                map.removeClass(area.getProperty('id'));
            },
            'click': function(event) {
                event.stop();
                zoomGMap(area.getProperty('id'));
            }
        });
    });
    
    var continentlinks = $$('ul.continents li a');
    continentlinks.each(function(continent) {
		continent.addEvent('click', function(event) {
			event.stop();
			zoomGMap(continent.get('text'));
		});
    });
    
    
    if (GBrowserIsCompatible()) {
		// init
		var gmap = new GMap2($('googlemap'));

		// disable dragging and remove overlay(s)
		gmap.disableDragging();
		gmap.clearOverlays();
		
		// Create marker icon
		var customIcon = new GIcon();
		customIcon.image = "/siteimg/icon_partnermap.png";
		customIcon.iconAnchor = new GPoint(0, 12);
		customIcon.iconSize = new GSize(12, 12);
		markerOptions = { icon:customIcon }
		
		
		var geocoder = new GClientGeocoder();
		
		var callback = function(point) {
			//console.log(point.toString());
		};
		
		var geocodePlaats = function(plaatsIndex) {
			geocoder.getLatLng(markers[plaatsIndex], function(point){ callback(point) });
		};
		
    }

    var zoomGMap = function(area_id) {

        switch (area_id.toLowerCase()) {

            case 'asia':

                var boundaries = new GLatLngBounds(new GLatLng(-45.82879925192133, 40.078125), new GLatLng(36.87962060502676, -163.828125));
                var imgOverlay = "map_zoom_asia.png";
                gmap.setCenter(new GLatLng(-5.965754, 117.949219), 2);
                break;

            case 'noram':

                var boundaries = new GLatLngBounds(new GLatLng(24.206889622398023, -174.0234375), new GLatLng(75.05035357407698, -19.3359375));
                var imgOverlay = "map_zoom_noram.png";
                gmap.setCenter(new GLatLng(57.51582286553882, -96.6796875), 2);
                break;

            case 'latam':

                var boundaries = new GLatLngBounds(new GLatLng(-56.17002298293204, -158.5546875), new GLatLng(22.59372606392931, -3.8671875000000004));
                var imgOverlay = "map_zoom_latam.png";
                gmap.setCenter(new GLatLng(-21.943045533438166, -81.2109375), 2);
                break;

            case 'africa':

                var boundaries = new GLatLngBounds(new GLatLng(-40.71395582628604, -48.515625), new GLatLng(42.293564192170095, 106.171875));
                var imgOverlay = "map_zoom_africa.png";
                gmap.setCenter(new GLatLng(1.0546279422758869, 28.828125), 2);
                break;

            case 'emea':

                var boundaries = new GLatLngBounds(new GLatLng(25.48295117535531, -13.0078125), new GLatLng(75.40885422846455, 141.6796875));
                var imgOverlay = "map_zoom_emea.png";
                gmap.setCenter(new GLatLng(58.26328705248603, 64.3359375), 2);
                break;

            case 'globe':
                $('googlemap').setStyle('visibility', 'hidden');
                return false;
                break;

            default:
                gmap.setCenter(new GLatLng(58.26328705248603, 64.3359375), 2);
                break;
        }

        var geocoder = new GClientGeocoder();

        for (var i = 0; i < markers.length; i++) {

            var markerLatLong = markers[i][2].split(",");
            var markerLink = markers[i][1];

            var point = new GLatLng(parseFloat(markerLatLong[0]), parseFloat(markerLatLong[1]));
            var marker = new GMarker(point, markerOptions);

            markerOptions.title = markers[i][0];
            marker.link = markerLink;

            gmap.addOverlay(marker);
            GEvent.addListener(marker, 'click', function() {
                window.location = this.link;
            });

        }

        var c1 = gmap.fromLatLngToDivPixel(boundaries.getSouthWest());
        var c2 = gmap.fromLatLngToDivPixel(boundaries.getNorthEast());

        if ($$('div.map_img')) {
            $$('div.map_img').dispose();
        }

        var div = document.createElement("div");
        div.style.position = "absolute";
        div.className = 'map_img';

        div.style.width = Math.abs(c2.x - c1.x) + "px";
        div.style.height = Math.abs(c2.y - c1.y) + "px";
        div.style.left = (Math.min(c2.x, c1.x)) + "px";
        div.style.top = (Math.min(c2.y, c1.y)) + "px";

        div.innerHTML = "<img src='/siteimg/" + imgOverlay + "' alt='' />";
        gmap.getPane(G_MAP_MAP_PANE).appendChild(div);

        $('googlemap').setStyle('visibility', 'visible');

    }
}


/**
 * initLogoTicker()
 *
 * scrolls Customer logos
 *
 * @author Klaas Dieleman <klaas{AT}efocus.nl>
 * @return void
 */
function initLogoTicker() {
	if(!document.getElement('div.customersslideshow')) return false;
	
	var tickerspeed = 30;
	var newsList = new Array;
	var tweens = new Array;
	
	newsList[0] = document.getElement('div.customersslideshow').getElement('ul');
	var tickerWidth = newsList[0].getSize().x;
	if(tickerWidth <= document.getElement('div.customersslideshow').getSize().x) return false;
	
	document.getElement('div.customersslideshow div.innerslideshow').setStyle('width', tickerWidth * 2 );
	
	newsList[1] = newsList[0].clone();
	var tweenDuration = tickerWidth * tickerspeed;
	
	tweens[0] = new Fx.Tween(newsList[0], {
		'duration':		tweenDuration,
		'transition':	'linear'
	});
	
	tweens[1] = new Fx.Tween(newsList[1], {
		'duration':		tweenDuration,
		'transition':	'linear'
	});
	
	var animate = function(index) {
		var index2;
		index == 0 ? index2 = 1 : index2 = 0

		newsList.each(function(item) { item.setStyle('margin-left', 0) });
		newsList[index2].inject(newsList[index], 'after');
		
		tweens[index].start('margin-left', -tickerWidth).chain(function() {
			animate(index2)
		});
	};
	
	animate(0);
	
}