angular.module('portfolio').controller('slider', function($scope, $location, $rootScope, projectsService, $element) {

    // Map
    var mapArgs = {
        zoom: 14,
        scrollwheel: false,
        center: new google.maps.LatLng(51, 17),
        mapTypeId: google.maps.MapTypeId.ROADMAP,

        mapTypeControl: false,
        panControl: false,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.LARGE,
            position: google.maps.ControlPosition.LEFT_CENTER
        },
        streetViewControl: false
    };
    var map = new google.maps.Map($element[0], mapArgs);
    delete mapArgs;

    var projects = projectsService.projects;
    if (projects.length > 0) {
        var latlngbounds = new google.maps.LatLngBounds();
        for (q = 0; q < projects.length; q++) {
            if (projects[q].map.lat == "") continue;

            var latLng = new google.maps.LatLng(projects[q].map.lat, projects[q].map.lng);
            latlngbounds.extend(latLng);

            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                animation: google.maps.Animation.DROP,
                title: projects[q].name
            });

            (function(pid) {
                google.maps.event.addListener(marker, 'click', function() {
                    $rootScope.$apply(function() {
                        $location.path('/project/' + pid);
                    });
                })
            })(projects[q].id);

            delete marker;
        }
        // console.log(map.zoom);
        map.setCenter(latlngbounds.getCenter());
        map.fitBounds(latlngbounds);

        google.maps.event.addListener(map, 'mouseover', function() {
            $('main').addClass('mapMouseOver');
        })
        google.maps.event.addListener(map, 'mouseout', function() {
            $('main').removeClass('mapMouseOver');
        })
    }

    // Banner image
    var $projectBanner = $('<div id="projectBanner"></div>').appendTo($element);
    var $banner = $('<div></div>').appendTo($projectBanner);

    delete $projectBanner;

    // On change location
    $scope.$on('$routeChangeStart', function(next, current) {
        if (current.controller == 'project') {
            var project = projectsService.getById(current.params.id);
            $banner.css({
                'background-image': 'url(' + project.banner.url + ')'
            });

            $banner.attr('data-img-width', project.banner.width);
            $banner.attr('data-img-height', project.banner.height);

            window.$topBanner = $banner;
            $(window).trigger('resize');

            delete project;
        }
        else {
            window.$topBanner = null;
        }
    });

});