var XML_Webpage = 'dbcontent/webpage.json.php?id='+id_page+'&preview='+preview;
var json_WebpageContent;



/* STEP 1. Load content when the whole page is loaded, included all images */
window.addEvent('load', function() {
	LoadWebpageContent();

});

/* STEP 2. Load the Home Page Json Content File */
function LoadWebpageContent(){
	var request = new Json.Remote(XML_Webpage, {
		onComplete: function(jsonObj) {
			json_WebpageContent = jsonObj
			InitalizeWebpageContent();
		}
	}).send();
}

/* STEP 3. Launch the different element initialisations */
function InitalizeWebpageContent(){
	InitalizeWebpage();
}
function InitalizeWebpage(){
	if ( json_WebpageContent ){
		var target_titre = $('TopFrame_Title');
		
		var header = $('Webpage_Header');
		var body = $('Webpage_Body');
		var downloadText ='';
		
		if(json_WebpageContent.downloads!='Empty'){
			json_WebpageContent.downloads.each( function(download) {
				downloadText += '<div style="margin-bottom: 10px;"><a href="'+download.path+'" target="_blank"><img src="'+download.icon+'" border="0" align="left" style="margin-right: 6px; margin-top: 4px;"/></a> '+StripSlashes(download.note)+'</div>';
			});
		}
		if($('FullContent_header').innerHTML != ''){
			var HeaderP = new Element('p').setHTML($('FullContent_header').innerHTML).injectInside(header);
			header.setStyles({'background-color': '#fea520'});
		} else if (json_WebpageContent.image){
			new Asset.images(json_WebpageContent.image, {
						onProgress: function(i) {
						loadedImages = this;
						},
						onComplete: function() {
										loadedImages.injectInside(header);
										loadedImages.setStyles({
											'margin-top': (header.getCoordinates().height-loadedImages.getCoordinates().height)/2+'px',
											'margin-left': (header.getCoordinates().width-loadedImages.getCoordinates().width)/2+'px'
										})
										header.effect('opacity', {duration: 200}).start(1);
									}
					});
		}
		body.setHTML($('FullContent_body').innerHTML+downloadText);

		var Titre = '<h2>'+json_WebpageContent.chapter+' / </h2><h3> '+json_WebpageContent.name;
		target_titre.setHTML(StripSlashes(Titre));
	
		var hauteur = $('Webpage_Body').getCoordinates().height;
		if (hauteur>320){
			var scroll = new Element('div', { id: 'scrollbar1', 'class': 'scrollbar-vert' }).injectInside($('WebPage_Content'));
			var handle = new Element('div', { id: 'handle1', 'class': 'handle-vert' }).injectInside(scroll);
			scroll.setStyles({'height':'331px'});
			makeScrollbar( $('Webpage_Body_Target'), $('scrollbar1'), $('handle1') );
		}
		
		var imgs = body.getElements('img');
		
		imgs.each(function(img){
			img.addEvents({
				'load': function(){
					var hauteur = $('Webpage_Body').getCoordinates().height;
					if (hauteur>320){
						var scrollbar = $$('.scrollbar-vert');
						if(scrollbar.length==0){
							var scroll = new Element('div', { id: 'scrollbar1', 'class': 'scrollbar-vert' }).injectInside($('WebPage_Content'));
							var handle = new Element('div', { id: 'handle1', 'class': 'handle-vert' }).injectInside(scroll);
							scroll.setStyles({'height':'331px'});
						}
						makeScrollbar( $('Webpage_Body_Target'), $('scrollbar1'), $('handle1') );
					}
				}
			})
		});
	}
}