var Comete = {
    fancyFrameOptions: {
        frameWidth: 750,
        frameHeight: 550
    },
    init: function(){
        window.addEvent("domready", this.initialize.bind(this));
    },
    initialize: function(){
        this.setEvents();
        this.build_post_map();
        this.cufonize();
    },
    setEvents: function(){
        this.FBLoaded();
        $$("#haztefan iframe").addEvent("load", this.FBLoaded);
        // reset form fields on click
        $$(".clickreset").addEvent('click', this.resetField);
        // fancybox urls
        jQuery("a.iframe").fancybox(this.fancyFrameOptions);
        // fancybox galleries
        jQuery(".gallery a").attr("title","");
        jQuery(".gallery img").attr("title","");
        jQuery(".gallery img").attr("alt","");
        jQuery(".gallery a").fancybox();
        jQuery("a[rel=lightbox]").fancybox();
    },
    resetField: function(ev){
        ev.target.set("value","");
    },
    build_post_map: function(){
        $$("#map_canvas").each(function(element){
            var latlng = $("map_latlng").innerHTML.split(",");
            latlng = new google.maps.LatLng(latlng[0], latlng[1]);
            var myOptions = {
                zoom: 15,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                scrollwheel: false
                //navigationControl: false,
                //mapTypeControl: false,
                //scaleControl: false,
                //draggable: false,

            };
            var map = new google.maps.Map(element, myOptions);
            var markerOptions = {
                clickable: false,
                dragable: false,
                cursor: 'pointer',
                map: map,
                position: latlng
            };
            var marker = new google.maps.Marker(markerOptions);
        });
    },
    build_general_map: function(center, zoom, restaurants) {
        var latlng = center.split(",");
        latlng = new google.maps.LatLng(latlng[0], latlng[1]);
        var myOptions = {
            zoom: zoom,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map($("generalmap_canvas"), myOptions);
        restaurants.each(function(restaurant){
            var pos = restaurant.coord.split(",");
            pos = new google.maps.LatLng(pos[0], pos[1]);
            var markerOptions = {
                clickable: true,
                dragable: false,
                cursor: 'pointer',
                map: map,
                position: pos,
                title: restaurant.name
            };
            var marker = new google.maps.Marker(markerOptions);
            google.maps.event.addListener(marker, "click", function(){
                var dest = "http://" + window.location.host + '/' + restaurant.url;
                window.location = dest;
            });
        });
    },
    FBLoaded: function() {
        $$("#loading_tabs").setStyle("display", "none");
        $$("#oculting_tabs").setStyle("display", "block");
    },
    cufonize: function() {
        Cufon.replace('.cufon');
    	Cufon.replace('.titulo-promociones');
    }
}

var AddressMap = new Class({
    Implements: Options,
    options: {
        zoom: 5,
        center: "40.111689,-2.680664",
        mapTypeControl: false,
        scrollwheel: false
    },
    initialize: function(canvas, addressField, latlngField, locateButton, options){
        this.canvas = $(canvas);
        this.addressField = $(addressField);
        this.latlngField = $(latlngField);
        this.locateButton = $(locateButton);
        this.setOptions(options);

        if (!$defined(this.canvas)||!$defined(this.addressField)||!$defined(this.latlngField)||!$defined(google))
            return; // Canvas not found or google API not loaded

        this.geocoder = new google.maps.Geocoder();
        this.build();
        this.setEvents();
    },
    build: function(){
        var placeDefined = ($defined(this.latlngField) && this.latlngField.value != ""), latlng;
        latlng =  (placeDefined) ? this.latlngField.value.split(',') : this.options.center.split(',');
        this.options.zoom = (placeDefined) ? 16 : this.options.zoom;
        this.options.mapTypeId = google.maps.MapTypeId.ROADMAP;
        this.options.center = new google.maps.LatLng(latlng[0], latlng[1]);
        this.map = new google.maps.Map(this.canvas, this.options);
        this.addMapMarker();
    },
    setEvents: function(){
        if ($defined(this.locateButton)){
            this.locateButton.addEvent("click", this.searchAddress.bind(this));
        } else {
            this.addressField.addEvent("change", this.searchAddress.bind(this));
        }
        this.addressField.addEvent("keypress", this.filterKeys.bind(this));
        google.maps.event.addListener(this.marker, 'position_changed', this.updateLatLngField.bind(this));
    },
    filterKeys: function(e){
        if (e.key == 'enter') {
            e.stop();
            this.searchAddress();
        }
    },
    addMapMarker: function(){
        var markerOptions = {
            map: this.map,
            draggable: true,
            visible: true,
            position: this.map.getCenter()
        };
        this.marker = new google.maps.Marker(markerOptions);
    },
    searchAddress: function(){
        if (this.addressField.value == "")
            return;

        req = {address: this.addressField.value, language: 'es', region: 'ES'};
        this.geocoder.geocode(req, this._processGeocoderResponse.bind(this));
    },
    _processGeocoderResponse: function(res, status) {
        if (status != "OK" || res.lenght == 0){
            jQuery.fancybox("No se ha encontrado la dirección");
            return;
        }

        resultsList = new Element('ul', {id: "geocoderResults"});
        res.each(function(r){
            var li = new Element('li').set("text", r.formatted_address);
            li.addEvent('click', function(){this.markAddress(r)}.bind(this));
            li.inject(resultsList);
            li = null;
        }, this);
        jQuery.fancybox(resultsList);
    },
    markAddress: function(result){
        jQuery.fancybox.close();
        this.marker.setPosition(result.geometry.location);
        this.map.setCenter(result.geometry.location);
        this.map.setZoom(16);
    },
    updateLatLngField: function() {
        this.latlngField.set("value", this.marker.getPosition().toUrlValue());
    }
})
