/**
 * <pre>
 * Nom : togglebox
 * Objectif : Faciliter la création de boîte popup dans le BOV3 tel que les boîtes de refine, mes requêtes ...
 * 	Fenetre noire positionnée sous le bouton lié
 *
 * Activation :
 * 	- avoir un A avec l'attribut data-bov3-togglebox contenant l'identifiant d'un conteneur à insérer dans la boîte qui apparaîtra
 * 	- avoir le conteneur voulu avec l'identifiant indiqué
 * 	- avoir le css associé (déjà inséré dans le bo)
 *
 * Fonctionnement :
 * 	- au démarrage les conteneurs liés seront automatiquement fermés (au cas où le développeur a oublié de les cacher par défaut)
 * 	- losqu'on clique sur le lien, le conteneur sera encapsulé dans un conteneur respectant la charte du BO (la première fois)
 * 	- la boîte sera automatiquement affichée ou masquée, positionnée par rapport au bouton appelant
 *
 * Exemple :
 * <code>
 * 	&lt;a href="#" data-bov3-togglebox="toto"&gt;click me&lt;a&gt;
 * <br/>
 * 	...
 * <br/>
 * 	&lt;div id="toto" style="display:none"&gt;mon super contenu&lt;/div&gt;
 * <br/>
 * </code>
 * </pre>
 *
 * @class
 * @static
 * @name togglebox
 * @version 1.0
 */
jQuery(document).ready(function($) {

		/* cachons pas défaut toutes les boîtes liées */
		$("a[data-bov3-togglebox]").each(function() {
			$("#"+$(this).attr("data-bov3-togglebox")).hide();
		});
		/* Si jamais les boîtes existent alors cachons les */
		$("div.toggleBox").hide();

		/* Dans le cas d'un resize de la window, on pourrait repositionner les popup existantes, mais pour l'instant cachons les.
		 * parce qu'il faudrait faire qqchose de rapide ...
		 */
		$(window).resize(function() {
			$("div.toggleBox:visible").each(function() {
				var container = $(this);
				var image = container.find("> span");
				var boxid = container.find("> div > [data-bov3-togglebox-ready]").attr('id');
				var boutonReference = $("a[data-bov3-togglebox='"+boxid+"']");
				
				container.show();

				/* BUG pour IE / Safari / Opera qui oblige de faire 2 fois */
				for(var i=0;i<2;i++) {
					container.position({
						my: 'right top',
						at: 'right bottom',
						of: boutonReference ,
						collision: 'flip none'
					});
				}

				/* BUG pour IE / Safari / Opera qui oblige de faire 2 fois */
				for(var i=0;i<2;i++) {
					image.position({
						my: 'center top',
						at: 'center bottom',
						of : boutonReference ,
						collision: 'none none'
					});
				}
				
				
			});
		});

		/* Affiche / cache la zone de raffinage de recherche */
		$("a[data-bov3-togglebox]").live('click',function() {
			var box = $("#"+$(this).attr("data-bov3-togglebox"));
			var container = null;
			var image = null;
			if ('true'!=box.attr("data-bov3-togglebox-ready")) {
				/*
				 * <div class='toggleBox'> : container
				 *   <span>&nbsp;</span> : image
				 *   <div class='toggleBoxInt'> : boxContainerShadow
				 *     : box
				 *   </div>
				 * </div>
				 */
				container = $("<div class='toggleBox'></div>").hide();
				image = new jQuery("<span>&nbsp;</span>")
				container.append( image );
				var boxContainerShadow = $("<div></div>").addClass("toggleBoxInt");
				box.after(container.append(boxContainerShadow));
				boxContainerShadow.append(box.show());
				box.attr("data-bov3-togglebox-ready",'true');
			}

			if (container==null) container = box.parent().parent();
			if (image==null) image = container.find("> span");
			box=null;
			//console.log(container, container.is(":visible"), $(this).text() );
			if ( container.is(":visible") ) {
				container.hide();
				return false;
			}

			var boutonReference = $(this);
			$(".toggleBox").hide();

			container.show();

			/* BUG pour IE / Safari / Opera qui oblige de faire 2 fois */
			for(var i=0;i<2;i++) {
				container.position({
					my: 'right top',
					at: 'right bottom',
					of: boutonReference ,
					collision: 'flip none'
				});
			}

			/* BUG pour IE / Safari / Opera qui oblige de faire 2 fois */
			for(var i=0;i<2;i++) {
				image.position({
					my: 'center top',
					at: 'center bottom',
					of : boutonReference ,
					collision: 'none none'
				});
			}

			return false;

		});
});