Bubble = function(bubble_element,tooltip_element, thumbtack) {
    if (arguments.length > 0) {
        this.initialize(bubble_element,tooltip_element, thumbtack);
    }
}

Bubble.prototype = {
    element: null,
    tooltip:null,
    options: {
        distance: -5,
        time: 150,
        hideDelay: 0
    },
    gridEtablissements : {
		AIG : "Parc national d'Aiguebelle",
		PAN : "Parc national d'Anticosti",
		BIC : "Parc national du Bic",
		FRO : "Parc national de Frontenac",
		GAS : "Parc national de la Gaspésie",
		GRJ : "Parc national des Grands-Jardins",
		HGO : "Parc national des Hautes-Gorges-de-la-Rivière-Malbaie",
		BON : "Parc national de l'Île-Bonaventure-et-du-Rocher-Percé", 
		BOU : "Parc national des Îles-de-Boucherville",
		JAC : "Parc national de la Jacques-Cartier",
		MIG : "Parc national de Miguasha",
		MME : "Parc national du Mont-Mégantic",
		MOR : "Parc national du Mont-Orford",
		MSB : "Parc national du Mont-Saint-Bruno",
		MOT : "Parc national du Mont-Tremblant",
		MVA : "Parc national des Monts-Valin",
		OKA : "Parc national d'Oka",
		PIN : "Parc national des Pingualuit",
		PLA : "Parc national de Plaisance",
		PTA : "Parc national de la Pointe-Taillon",
		SAG : "Parc national du Saguenay",
		SSL : "Parc marin du Saguenay-Saint-Laurent",
		YAM : "Parc national de la Yamaska",
		ASH : "Réserve faunique Ashuapmushuan",
		AMW : "Réserve faunique des Lacs-Albanel-Mistassini-et-Waconichi",
		CHC : "Réserve faunique des Chic-Chocs",
		LAU : "Réserve faunique des Laurentides",
		LVY : "Réserve faunique La Vérendrye",
		MAS : "Réserve faunique Mastigouche",
		MAT : "Réserve faunique de Matane",
		PAL : "Réserve faunique de Papineau-Labelle",
		SPC : "Réserve faunique de Port-Cartier-Sept-Îles",
		POD : "Réserve faunique de Port-Daniel",
		POR : "Réserve faunique de Portneuf",
		RIM : "Réserve faunique de Rimouski",
		ROM : "Réserve faunique Rouge-Matawin",
		STM : "Réserve faunique du Saint-Maurice",
		PRE : "Auberge Fort-Prével",
		BDP : "Camping de la Baie-de-Percé",
		VOL : "Camping des Voltigeurs",
		KEN : "Centre touristique du Lac-Kénogami",
		SIM : "Centre touristique du Lac-Simon",
		AQU : "Aquarium du Québec",
		PCM : "Parc de la Chute-Montmorency",
		DUC : "Station touristique Duchesnay",
		VAL : "Village historique de Val-Jalbert",
		AMC : "Auberge de montagnes des Chic-Chocs",
		SAN : "Sépaq Anticosti",
		PAQ : "Aquarium du Québec",
		ASN : "Réserve faunique Assinica"
	},
    
    hideDelayTimer: null,
    beingShown: false,
    shown: false,
    ttTimer:null,
    ttBeingShown:false,
    ttShown:false,

    initialize: function(bubble_element,tooltip_element, thumbtack) {
        this.element = bubble_element.clone();
        this.tooltip = tooltip_element.clone();
        
        this.element.removeAttr("id");
        this.tooltip.removeAttr("id");
        this.tooltip.css({'display':'none'})
        
        jQuery("body").append(this.element);
        jQuery("body").append(this.tooltip);

        var logo_element = this.element.find(".logo_overlay_image");
        
        logo_element.attr("src", "/resources/images/logos/" + thumbtack.data.establishment_code.toLowerCase() + ".gif")
    	//logo_tooltip.attr("src", "/resources/images/logos/" + thumbtack.data.establishment_code.toLowerCase() + ".gif")
    	var currentEstablishmentCode = thumbtack.data.establishment_code.toUpperCase();
    	this.tooltip.append(this.gridEtablissements[currentEstablishmentCode]);
    
        var view_button = this.element.find("#view_button");
        var viewBtn = jQuery(view_button);
        
        if (null != thumbtack.data.view_button_url) {
            var hrefTemplate = thumbtack.data.view_button_url;
            viewBtn.attr("href", hrefTemplate.replace(/\[eta_id\]/g, thumbtack.data.establishment_code.toLowerCase()).replace(/\[net_id\]/g, thumbtack.data.network_code.toLowerCase()));
        } else {
            viewBtn.remove();
        }
        
        var reserve_button = this.element.find("#reserve_button");
        var reserveBtn = jQuery(reserve_button);
        
        if (null != thumbtack.data.reserve_button_url) {
            var hrefTemplate = thumbtack.data.reserve_button_url;
            reserveBtn.attr("href", hrefTemplate.replace(/\[eta_id\]/g, thumbtack.data.establishment_code.toUpperCase()).replace(/\[net_id\]/g, thumbtack.data.network_code.toUpperCase()));
        } else {
            reserveBtn.remove();
        }
        

        this.attachTo(thumbtack.image);
    },
    
    attachTo: function(image) {
        var self = this;
        if (jQuery("body.forfaits").length) {
          jQuery([image.get(0), this.element.get(0)]).click(showForfait);

        }
        else {
          jQuery([image.get(0), this.element.get(0)]).click(handleClick);
          jQuery("#map").click(handleClick)
        }
        jQuery([image.get(0), this.element.get(0)]).hover(toolOn,toolOut);
        
        function handleClick(e) {
        	if($(e.currentTarget).next().css('display')=="none") {
        		jQuery('.bubble').each(hideMe);
        		rollOn();
        	}
        	else {
        		jQuery('.bubble').each(hideMe);
        	}
            
        }

        function showForfait(e) {
                 jQuery("#liste_forfaits div.establishmentCode").hide();
                 jQuery('div#'+jQuery(this).attr('class')+'.establishmentCode').show();
        }

        
        function toolOn(){
	        if($(self.element).css('display')!="block") {
	        	if (self.ttTimer) clearTimeout(self.ttTimer);
	            if (self.ttBeingShown || self.ttShown) {
	                // don't trigger the animation again
	                return;
	            } else {
	                // reset position of tooltip
	                self.ttBeingShown = true;
	                self.tooltip.css({
	                    top: image.position().top + 5,
	                    left: image.position().left + image.width() + 5,
	                    display: "block"
	                }).animate({
	                    opacity: 1
	                }, self.options.time, "swing", function() {
	                    self.ttBeingShown = false;
	                    self.ttShown = true;
	                });
	           }
	        }
	    	return false;
        }
        
        function toolOut() {
        	if (self.ttTimer) clearTimeout(self.ttTimer);
            self.ttTimer = setTimeout(function() {
                self.ttTimer;
                self.tooltip.animate({
                    opacity: 0
                }, self.options.time, "swing", function() {
                    self.ttShown = false;
                    self.tooltip.css("display", "none");
                });
            }, self.options.hideDelay);
            return false;
        }
        
        function rollOn() {
            if (self.hideDelayTimer) clearTimeout(self.hideDelayTimer);
           /*
 if (self.beingShown || self.shown) {
                // don't trigger the animation again
                return;
            } else {
*/
				$(self.tooltip).hide();
                // reset position of info box
                self.beingShown = true;
                self.element.css({
                    top: image.position().top - self.element.height(),
                    left: image.position().left - (self.element.width() / 2) + (image.width() / 2)-1,
                    display: "block"
                }).animate({
                    top: "-=" + self.options.distance + "px",
                    opacity: 1
                }, self.options.time, "swing", function() {
                    self.beingShown = false;
                    self.shown = true;
                });
           // }
            return false;
        }
        
        function rollOut() {
            if (self.hideDelayTimer) clearTimeout(self.hideDelayTimer);
            self.hideDelayTimer = setTimeout(function() {
                self.hideDelayTimer;
                self.element.animate({
                    top: "+=" + self.options.distance + "px",
                    opacity: 0
                }, self.options.time, "swing", function() {
                    self.shown = false;
                    self.element.css("display", "none");
                });
            }, self.options.hideDelay);
            return false;
        }
        
        function hideMe(e) {
        	jQuery(this).hide();
        }
    }
};