var frontend = {
    createMap: function(mapDiv){
        if( !mapDiv.hasClass('initialized') ) {
            var bounds = new google.maps.LatLngBounds();
            var Latlngs = new Array();
            var locations = mapDiv.find('.location');
            var lat    = parseFloat(locations.find('.latitude').text());
            var lng    = parseFloat(locations.find('.longitude').text());
            var myLatlng = new google.maps.LatLng(lat,lng);
            var myOptions = {
                zoom: 13,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            mapDiv.find('.mapcontent').show();
            var map = new google.maps.Map(mapDiv.find('.mapcontent').get(0), myOptions);
            
            var infowindow = new google.maps.InfoWindow({});
    
            google.maps.event.addListener(map, 'click', function() {
                infowindow.close();
            });
    
            locations.each(function(){
                var location    = $(this);
                var lat      = parseFloat(location.find('.latitude').text());
                var lng      = parseFloat(location.find('.longitude').text());
                var content  = location.find('.content').html();
                var myLatlng = new google.maps.LatLng(lat,lng);
                Latlngs.push(myLatlng);
                var marker   = new google.maps.Marker({
                    position: myLatlng, 
                    map: map, 
                    title: location.find('.title').text()
                });
    
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.close();
                    infowindow.setContent(content);
                    location.find('.content').html();
                    infowindow.open(map,marker);
                });
            });
            
            if( locations.length > 1 ) {
                for( i = 0; i < Latlngs.length; i++ ) {
                    bounds.extend(Latlngs[i]);
                }
                
                map.fitBounds(bounds);
            }
            mapDiv.addClass('initialized');
        }
    },
    fixSpamFilter: function(){
        $("a[rel=email]").each(function(){
            $(this).find('.spamfilter').remove();
            $(this).attr( 'href', 'mailto:' + $(this).text() );
        });
    },
    addMapHandlers: function(){
        $('a.showmap').click(function(){
            var mapDiv = $(this).parent().find('.map');
            if( !mapDiv.hasClass('initialized') ) {
                frontend.createMap(mapDiv);
                $(this).text('Hide map');
            } else if( mapDiv.hasClass('hidden') ) {
                mapDiv.slideDown('fast');
                mapDiv.removeClass('hidden');
                $(this).text('Hide map');
            } else {
                mapDiv.slideUp('fast');
                mapDiv.addClass('hidden');
                $(this).text('Show map');
            }
        });
    },
    addProgramHandlers: function(){
        $('.descr').click(function(){
            $(this).next().slideToggle('fast');
        });
    },
    buttonize: function() {
        if (typeof window.G_vmlCanvasManager != 'undefined') {
            $('.button').each(function(){
                var button = $(this);
                var width = button.width();
                var height = button.height();
                var width = button.width();
                var canvas = $('<canvas>');
                canvas.attr( 'width', width ); 
                canvas.attr( 'height', height );
                canvas.css({
                    position: 'absolute',
                    zIndex: 1,
                    top: 0,
                    left: 0
                });
                button.prepend(canvas);
                canvas = canvas[0];
                window.G_vmlCanvasManager.initElement(canvas);
                
                var radius = 10;
                var ctx = canvas.getContext('2d');
                var north = Math.PI*3/2;
                var west = Math.PI;
                var east = 0;
                var south = Math.PI/2;
    
                ctx.beginPath();
                ctx.moveTo( 0, radius );
                ctx.arc( radius, radius, radius, west, north, false );
                ctx.lineTo( width - radius, 0 );
                ctx.arc( width - radius, radius, radius, north, east, false );
                ctx.lineTo( width, height - radius );
                ctx.arc( width - radius, height - radius, radius, east, south, false );
                ctx.lineTo( 0 + radius, height );
                ctx.arc( radius, height - radius, radius, south, west, false );
                ctx.lineTo( 0, radius );
                ctx.closePath();
                
                var grad = ctx.createLinearGradient(0,0,0,height);
                grad.addColorStop(0,'#fe9a22');
                grad.addColorStop(1,'#ff7300');
                ctx.fillStyle = grad;
                ctx.fill();
                ctx.strokeStyle = '#ffab66';
                ctx.lineWidth = 0;
                ctx.stroke();
            });
        }
    }
}

$(window).load(function(){
    frontend.buttonize();
});

$(document).ready(function(){
    frontend.fixSpamFilter();
    $('#practical').each(function(){
        frontend.addMapHandlers();
    });
    $('#program').each(function(){
        frontend.addProgramHandlers();
    });
    var linkColor = '#2b93dd';
    $('a').hover(
        function(){
            var color = $(this).css('color');
            if( !$(this).data('color') ) {
                $(this).data('color',color);
            }
            $(this).animate({
                color: '#fff'
            },300);
        },
        function(){
            $(this).animate({
                color: $(this).data('color')
            },300);
        }
    );
});
