	// Document initialisation.
	//
	
	/*
	Event.observe(window, 'resize', function(event) {

	},false);
	/**/
	
	// Do some stuffs when page loads.
	/*
	Event.observe(window, 'load', function(event){
		
		Event.observe(window, 'resize', function(event) {

		},false);

		
	}, false);
	/**/

	
	/*
	Event.observe(window, 'scroll', function(event) {
		
	},false);
	/**/



document.observe("dom:loaded", function (event) {


    // Ensure that the HTML DOM in the page has a UL Element with a specified classname 'fadeableviewer', so create a new instance of FadeableViewer.
    var fvCollection = $$('#bando_twm ul.fadeableviewer');
    if (parseInt(fvCollection.length) == 1) {
        var fadeableviewer = new FadeableViewer('fadeableviewer', { delay: 4 });
    }


    // Ensure that the page has showcase control to build a Showcase component with the specified LI entries.
    var scCollection = $$('div.showcase');
    if (parseInt(scCollection.length) == 1) {
        new Showcase.Horizontal($$('#horizontal ul li'), $$('#horizontal a.controls'), { duration: 0.3 });
    }

    // Build a Scrollbar instance for the scrollable component area.
    //var scrollbar = new Control.ScrollBar('scrollbar_content','scrollbar_track',{ handle_minimum_height:39, proportional:false });


    // Ensure the page has not an unsecified HTML div element (div#WindowLayer)
    // This WindowLayer is athe page overlay.
    if ($('WindowLayer')) {

        // Catch the page, and pick the hight Body DOM level. Extract, computed width and height size.
        var webPage = $($$('body')[0]);
        pageHeight = Math.max(document.viewport.getHeight() + document.viewport.getScrollOffsets().top, parseInt(webPage.getStyle('height').replace(/px/g, "")));

        // Apply the page size to the overlay.
        // Unused - Fix size to ~0px ;) - See at www.tocra.org why em unit is used and not pixel !
        $('WindowLayer').setStyle({
            width: '0.001em',
            height: '0.001em'
        });

    }


    // Ensure that the page has an HTML element with the ID 'shocase_btnzoom'. This way allows to ensure we are in the correct page.
    if ($('shocase_btnzoom')) {

        // Put an event listener on it for the CLICK. Branch on a function to get the current thumbnail displayed and show a real preview image. (linked in DOM attribute)
        $('shocase_btnzoom').observe("click", function (event) {

            Event.stop(event);
            getCurrentThumbnailAndDisplay();

        });

    }



    // Put an event listenr on each radio button.
    // Allows to call an embed iframe, and give in URL a declared argument.
    $$('a.radiolink_button').each(function (item, index) {

        // There is any <radiolink_button>, so we are in the deails' page.
        hideContent();

        item.observe("click", function (event) {

            //	hideContent(); // Hide splash DIV in a first time.
            Event.stop(event); // Stop bubbling and DOM event propagation.
            showContent(); // Show splash DIV now...

            $('ContentArea').update("");

            // Get the clicked radio button like (real link a href), and pick its 'href' attribute to set the new Iframe src.
            if (item.hasAttribute('href') && item.readAttribute('href') != '#') {
                /* $('ContentAreaIframe').src = item.readAttribute('href'); */

                new Ajax.Request(item.readAttribute('href'), {
                    onSuccess: function (response) {
                        // Handle the response content...
                        $('ContentArea').update(response.responseText);
                    }
                });


            }
            // Otherwize, display an iframe src error page !
            else { /* $('ContentAreaIframe').src = "Recherche_ErreurArgument.html"; */ }

            showContent(); // Show splash DIV again...
            // Fix position to th splash DIV, computed from page viewport and scrolling position.
            $('ContentArea').setStyle({
                marginTop: parseInt(((document.viewport.getHeight() / 2) + document.viewport.getScrollOffsets().top) - ($('ContentArea').getHeight() / 2)) + 'px'
            });

        });

    });

}, false);
	
    
	// Some functions to show/hide the overlay.
	var hideLayer= function(){ /*$('WindowLayer').addClassName('hided');/**/ };
	
	// Some functions to show/hide the splash.
	var showContent = function(){ $('ContentArea').removeClassName('hided');  };
	var hideContent= function()
	{
	    $('ContentArea').update("");

		$('ContentArea').setStyle({
			marginTop: '-1000px'
		});
	    
	    $('ContentArea').addClassName('hided');
	    
	};




    // Get the current selected/displayed thumbnail in the Showcase component, and show a preview image issued from the showcase item attribute.
    var previewimg;
    window.previewimg = previewimg = null;

    var getCurrentThumbnailAndDisplay = function () {

        var sc_thumbs = $$('div.showcase ul li');
        current_zindex = 0;
        current_item = null;


        sc_thumbs.each(function (item, index) {
            if (item.getStyle('zIndex') > current_zindex) {
                current_zindex = item.getStyle('zIndex');
                current_item = item;
            }
        });

        if (current_item != null) {

            lnk = current_item.down('a');
            
//        if (lnk) { alert($(lnk).readAttribute('rel')); }

            if ($(lnk).hasAttribute('rel') && $(lnk).readAttribute('rel') != "") {
                
                $('ImagePreview').setStyle({
                    width: '1px',
                    height: '1px',
                    display: 'none'
                });
                $('ImagePreview').removeClassName('showed');
                $('ImagePreview').addClassName('hided');

                //alert( "Cette image doit s'afficher en 'PREVIEW' :" + $(lnk).readAttribute('rel') )
                previewimg = null;
                previewimg = new Image();
                previewimg.onload = function () {

                    //    alert( previewimg.src );

                    $('ImagePreview').removeClassName('hided');
                    $('ImagePreview').addClassName('showed');

                    $('ImagePreview').observe("click", function (event) {
                        $('ImagePreview').setStyle({
                            width: '1px',
                            height: '1px',
                            display: 'none',
                            marginTop: '0px',
                            marginLeft: '0px',
                            backgroundColor: 'transparent',
                            backgroundImage: "url('img/1pxtransp.gif')"
                        });
                        $('ImagePreview').removeClassName('showed');
                        $('ImagePreview').addClassName('hided');
                    });

                    $('ImagePreview').setStyle({
                        width: parseInt(previewimg.width) + 'px',
                        height: parseInt(previewimg.height) + 'px',
                        display: 'block',
                        borderColor: '#ededed',
                        borderWidth: '20px',
                        borderSize: '20px',
                        borderStyle: 'solid',
                        marginTop: parseInt(((document.viewport.getHeight() / 2) + document.viewport.getScrollOffsets().top) - (parseInt(String(previewimg.height).replace(/px/g, "")) / 2)) + 'px',
                        marginLeft: -(parseInt(String(previewimg.width).replace(/px/g, ""))) / 2 + 'px',
                        backgroundColor: '#111111',
                        backgroundAttachment: 'scroll',
                        backgrounRepeat: 'no-repeat',
                        backgroundPosition: 'left top',
                        backgroundImage: "url('" + $(lnk).readAttribute('rel') + "')"
                    });

                    $('ImagePreview').addClassName('showed');
                    $('ImagePreview').setStyle({
                        backgroundImage: "url('" + $(lnk).readAttribute('rel') + "')"
                    });

                };
                var currentDateNoCache = new Date();
                var stamp = "" + currentDateNoCache.getFullYear() + "" + currentDateNoCache.getMonth() + "" + currentDateNoCache.getDay() + "" + currentDateNoCache.getHours() + "" + currentDateNoCache.getMinutes() + "" + currentDateNoCache.getSeconds() + "" + currentDateNoCache.getMilliseconds() + "";
                previewimg.src = $(lnk).readAttribute('rel') + "?time=" + stamp;
            }
        }

    };
    



