var StickyWinTopMost = 10000;
var StickyWinSkin = StickyWinFx.extend({
	getDefaultOptions: function(){
		return Object.extend(this.parent(), {
			title: 'Titre',
            toggleClassName: 'toggleSticky',
			url:'',
            ajaxOptions: {method: 'get'}
		});
	},
    /* Re-ecriture de la fonction initialize pour insérer le skin avant
       la gestion des drag et resize... et setContent
    */
	initialize: function(options){
        //Initialize de StickyWin
		options.id = options.id || 'StickyWin_'+new Date().getTime();
		this.options = this.setOptions(this.getDefaultOptions(), options);
		this.makeWindow();
		if(this.options.showNow) this.show();
            //Ajout du Skin ici obligatoire
            //juste après le makeWindow() et avant le setContent() et makeDraggable ...
            this.skin();
            //gestion de l'ajax
            if(this.options.url) {
                this.options.content = false;
    			new Ajax(this.options.url, Object.extend(this.options.ajaxOptions, {
    					update: this.winContent
    				})
    			).request();
            }
        if(this.options.content) this.setContent(this.options.content);
        
            //Pour mettre la fenêtre au premier plan si déplace ou resize
            this.options.dragOptions = Object.extend(this.options.dragOptions || {},{onBeforeStart: this.focus.bind(this)});
            this.options.resizeOptions = Object.extend(this.options.resizeOptions || {}, {onBeforeStart: this.focus.bind(this)});
        //Initialize de StickyWinFx
		if(this.options.draggable) this.makeDraggable();
		if(this.options.resizable) this.makeResizable();
        
            //Pour mettre la fenêtre au premier plan si clic dedans
            this.win.style.zIndex = StickyWinTopMost++;
            this.win.addEvent('mousedown', this.focus.bind(this));
            
            //this.win.addEvent('dblclick', this.destroy.bind(this));
            
            //Affecte le comportement aux boutons (fermer - minimiser)
            $(this.options.id+'_'+this.options.closeClassName).addEvent('click', this.destroy.bind(this));
            $(this.options.id+'_'+this.options.toggleClassName).addEvent('click', this.toggle.bind(this));
	},
    /* Re-ecriture de la fonction setContent pour écrire à l'intérieur
       du tableau généré pour le Skin
    */
	setContent: function(html) {
		if($type(html) == "string") this.winContent.setHTML(html);
		else if ($(html)) this.winContent.adopt(html);
        /*
        //Peut êter à simplifier si on impose 1 seul bouton fermer et minimiser
        //pas dans le contenu et on remonte ça dans le initialize !
		this.win.getElements('.'+this.options.closeClassName).each(function(el){
			el.addEvent('click', this.hide.bind(this));
		}, this);
		this.win.getElements('.'+this.options.toggleClassName).each(function(el){
			el.addEvent('click', this.toggle.bind(this));
		}, this);
        */
		return this;
	},
    /* Masque le contenu de la fenêtre pour la réduire à la barre de titre
    */
    toggle: function() {
        this.winTblContent.toggle();
    },
    /* Permet de faire passer la fenêtre au premier plan lorsqu'on
       clique dessus
    */
    focus: function() { 
        if(this.win.style.zIndex < StickyWinTopMost){
            this.win.style.zIndex = StickyWinTopMost++;
        }
    },
    /* Création du Skin avec une table. Les CSS sont pas compatibles avec IE et
        la transparence PNG pour IE6 marche pas si on utilise une image de fond
        dans un CSS. Donc on a une table avec des balises <img>.
        En plus avec le fixPNG on peut pas mettre de div dessus, ça fait des trous
        dans l'image, donc un utilise un gif en background pour la barre de titre !
    */
    skin: function(){
        //Construction du squelette de la fenêtre
        var str = "";
        str += "<table class='StickySkin stkHd'>";
        str += "    <tr>";
        str += "        <td id='"+this.options.id+"_tl'></td>";
        str += "        <td id='"+this.options.id+"_t' width='100%'></td>";
        str += "        <td id='"+this.options.id+"_tr'></td>";
        str += "    </tr>";
        str += "    <tr>";
        str += "        <td id='"+this.options.id+"_tl2'></td>";
        str += "        <td id='"+this.options.id+"_t2' width='100%' class='titleSticky'>&nbsp;"+ this.options.title +"</td>";
        str += "        <td id='"+this.options.id+"_tr2'></td>";
        str += "    </tr>";
        str += "</table><table class='StickySkin' width='100%' height='100%' id='"+this.options.id+"_TblContent'>";
        str += "    <tr>";
        str += "        <td id='"+this.options.id+"_l'></td>";
        str += "        <td width='100%' class='contentSticky' valign='top'>";
        str += "            <div id='"+this.options.id+"_Content' class='StickySkinContent'/>";
        str += "        </td>";
        str += "        <td id='"+this.options.id+"_r'></td>";
        str += "    </tr>";
        str += "</table><table class='StickySkin' width='100%'>";
        str += "    <tr>";
        str += "        <td id='"+this.options.id+"_bl'></td>";
        str += "        <td id='"+this.options.id+"_b' width='100%'></td>";
        str += "        <td id='"+this.options.id+"_br' class='resizerSticky'></td>";
        str += "    </tr>";
        str += "</table>";
        str += "<div id='"+this.options.id+'_'+this.options.toggleClassName+"' class='"+this.options.toggleClassName+"'><img src='images/minimize.gif' alt='Réduire la fenêtre'></div>";
        str += "<div id='"+this.options.id+'_'+this.options.closeClassName+"' class='"+this.options.closeClassName+"'><img src='images/close.gif' alt='Fermer la fenêtre'></div>";
        this.win.setHTML(str);
        this.winContent = $(this.options.id+'_Content');
        this.winTblContent = $(this.options.id+'_TblContent');
        
        //Applique les images au squelette de la fenêtre
        $(this.options.id+'_tl').adopt(this.options.skin.topLeft.clone());
        $(this.options.id+'_t').adopt(this.options.skin.top.clone());
        $(this.options.id+'_tr').adopt(this.options.skin.topRight.clone());
        
        $(this.options.id+'_tl2').adopt(this.options.skin.topLeft2.clone());
        $(this.options.id+'_tr2').adopt(this.options.skin.topRight2.clone());
        $(this.options.id+'_t2').setStyles(this.options.skin.top2Class);
        
        $(this.options.id+'_l').adopt(this.options.skin.left.clone());
        $(this.options.id+'_r').adopt(this.options.skin.right.clone());
        
        $(this.options.id+'_bl').adopt(this.options.skin.bottomLeft.clone());
        $(this.options.id+'_b').adopt(this.options.skin.bottom.clone());
        $(this.options.id+'_br').adopt(this.options.skin.bottomRight.clone());
    }
});
