//------------------------------------------------------------------------------------------
// Script:		js/ajax.js
// Authors:		Guillaume Lambert - guillaume@falzhobel.ca
//			Alex Gignac - alex@ax2.ca
//
// Date:		May 2009
//
// Javascript functions for all AJAX-based functions and calls (mainly with lightview.js)
// * Note: Next time try with Class - won't work this time because lightview is object itself
//
// Functions:
//	-
//
//------------------------------------------------------------------------------------------
	
	// show the send mail box
	function showSendMail(url) {
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				// overlayClose: false,	// clicking on background won't close lightview
				ajax: {
					onComplete: function() {
						// once the request is complete we observe the form for a submit
						$('team_send_mail').observe('submit', submitSendMail);
					}
				}
			}
		});
	}
	
	// when send mail form is submitted
	function submitSendMail(event) {
		// block default form submit
  		Event.stop(event);
	  	// lightview part
  		Lightview.show({
			href: appWebPath + 'ajax/team_send_mail.php',
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					parameters: Form.serialize('team_send_mail'), // the parameters from the form
					// Let's still observe if there is an error
					onComplete: function() {
						$('team_send_mail').observe('submit', submitSendMail);
					}
				}
			}
  		});
	}
	
	// show the send to colleague box
	function showSendToColleague(url) {
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					onComplete: function() {
						// once the request is complete we observe the form for a submit
						$('send_to_colleague').observe('submit', submitSendToColleague);
					}
				}
			}
		});
	}
	
	// when send to colleague form is submitted
	function submitSendToColleague(event) {
		// block default form submit
  		Event.stop(event);
	  	// lightview part
  		Lightview.show({
			href: appWebPath + 'ajax/send_to_colleague.php',
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					parameters: Form.serialize('send_to_colleague'), // the parameters from the form
					// Let's still observe if there is an error
					onComplete: function() {
						$('send_to_colleague').observe('submit', submitSendToColleague);
					}
				}
			}
  		});
	}
	
	// show the career box
	function showCareer(url) {
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					onComplete: function() {
						// once the request is complete we observe the form for a submit
						$('career').observe('submit', submitCareer);
					}
				}
			}
		});
	}
	
	// when career form is submitted
	function submitCareer(event) {
		// block default form submit
  		Event.stop(event);
	  	// lightview part
  		Lightview.show({
			href: appWebPath + 'ajax/career.php',
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					parameters: Form.serialize('career'), // the parameters from the form
					// Let's still observe if there is an error
					onComplete: function() {
						$('career').observe('submit', submitCareer);
					}
				}
			}
  		});
	}
	
	// show the brochure standard box
	function showBrochureStandard(url) {
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					onComplete: function() {
						// once the request is complete we observe the form for a submit
						$('brochure').observe('submit', submitBrochureStandard);
					}
				}
			}
		});
	}
	
	// when brochure standard form is submitted
	function submitBrochureStandard(event) {
		// block default form submit
  		Event.stop(event);
	  	// lightview part
  		Lightview.show({
			href: appWebPath + 'ajax/brochure_standard.php',
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					parameters: Form.serialize('brochure'), // the parameters from the form
					// Let's still observe if there is an error
					onComplete: function() {
						$('brochure').observe('submit', submitBrochureStandard);
					}
				}
			}
  		});
	}
	
	// show the brochure visualization box
	function showBrochureVisualization(url) {		
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					evalScripts: true,
					onComplete: function() {
						// oncomplete set drag/drop with scriptaculous
						var changeEffect;
						Position.includeScrollOffsets = true; 
        					Sortable.create('organizer_choices', { handle: 'list_move', scroll: 'custom_choices_list',   
							onChange: function(item) {  
								/* ... */
							},  
							
							onUpdate: function(list) {
									
								// Just a test to show the list
								//alert(Sortable.serialize(list));
							
								/* Ajax goes here... */
								new Ajax.Request(appWebPath + "brochure/reorder.php", {  
									method: "post",
									/*
									onLoading: function(){$('activityIndicator').show();},  
									onLoaded: function(){$('activityIndicator').hide();},
									*/  
									parameters: { data: Sortable.serialize(list) },
									onComplete: function(){
										// reload current page
										fetchPreviewPage(curPreviewPage);
									}
								});
								
							}                 
						});
						
						// once the request is complete we observe the form for a submit
						$('brochure').observe('submit', submitBrochureVisualization);
					}
				}
			}
		});
	}
	
	// when brochure visualization form is submitted
	function submitBrochureVisualization(event) {
		// block default form submit
  		Event.stop(event);
	  	// lightview part
  		Lightview.show({
			href: appWebPath + 'ajax/brochure_visualization.php',
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false,
				ajax: {
					parameters: Form.serialize('brochure'), // the parameters from the form
					// Let's still observe if there is an error
					onComplete: function() {
						$('brochure').observe('submit', submitBrochureVisualization);
					}
				}
			}
  		});
	}
	
	// show the brochure custom box - no ajax needed here
	function showBrochureCustom(url) {
		Lightview.show({
			href: url,
			rel: 'ajax',
			options: {
				autosize: true,
				menubar: false,
				topclose: false
			}
		});
	}
	
	function removeBrochureItem(itemId) {
		new Ajax.Request(appWebPath + "brochure/delete.php", {  
			method: "get", 
			parameters: { item_id: itemId }, 
			/*
			onLoading: function(){$('activityIndicator').show();}, 
			onLoaded: function(){
				//fetchBrochureListItems();
				$('activityIndicator').hide();
			}, 
			*/
			onSuccess: function(transport) {
				// load the response, and convert JSON into regular array
				var response = transport.responseText;
				var jsonObj = response.evalJSON();
				
				// load debug
				//$('activityIndicator').innerHTML = response;
				
				// loop through response array, and populate all the returned items
				var itemsList = "";
				for (var i = 0; i < jsonObj.length; i++) {
					// load item's id
					var item_id = jsonObj[i].id;
					
					itemsList += '<li id="item_' + item_id + '">' + jsonObj[i].short_title + ' <span class="list_delete"><a href="#" onclick="removeBrochureItem(\'' + item_id + '\'); return false;"><img src="' + appWebPath + 'images/brochure/icon_x.gif" alt="" /></a></span><span class="list_move"><a href="#"><img src="' + appWebPath + 'images/brochure/icon_move.gif" alt="" /></a></span></li> \n';					
				} // end for
				
				// load the widget items list
				$('organizer_choices').innerHTML = itemsList;
			},
			onComplete: function() {
				// adjust max number of preview pages
				maxPreviewPage = maxPreviewPage - 1;
				$('custom_page_num_end').innerHTML = maxPreviewPage;
				
				// reload current page
				fetchPreviewPage(curPreviewPage);
				
				// oncomplete set drag/drop with scriptaculous
				var changeEffect;
				Position.includeScrollOffsets = true; 
        			Sortable.create('organizer_choices', { handle: 'list_move', scroll: 'custom_choices_list',   
					onChange: function(item) {  
						/* ... */
					},  
					
					onUpdate: function(list) {
					
						/* Ajax goes here... */
						new Ajax.Request(appWebPath + "brochure/reorder.php", {  
							method: "post", 
							/* 
							onLoading: function(){$('activityIndicator').show();},  
							onLoaded: function(){$('activityIndicator').hide();}, 
							*/ 
							parameters: { data: Sortable.serialize(list) },
							onComplete: function(){
								// reload current page
								fetchPreviewPage(curPreviewPage);
							}
						});
						
					}                 
				});
			}
		});
	}
	
	/* NOT USED... */
	// load the list items to display in the draggable list
	function fetchBrochureListItems() {
		new Ajax.Request(appWebPath + "brochure/loader.php", {  
			method: "get", 
			parameters: { }, 
			/*
			onLoading: function(){$('activityIndicator').show();}, 
			onLoaded: function(){$('activityIndicator').hide();}, 
			*/
			onSuccess: function(transport) {
				// load the response, and convert JSON into regular array
				var response = transport.responseText;
				var jsonObj = response.evalJSON();
				
				// load debug
				//$('activityIndicator').innerHTML = response;
				
				// loop through response array, and populate all the returned items
				var itemsList = "";
				for (var i = 0; i < jsonObj.length; i++) {
					// load item's id
					var item_id = jsonObj[i].id;
					
					itemsList += '<li id="item_' + item_id + '">' + jsonObj[i].short_title + ' <span class="list_delete"><a href="#" onclick=""><img src="' + appWebPath + 'images/brochure/icon_x.gif" alt="" /></a></span><span class="list_move"><a href="#"><img src="' + appWebPath + 'images/brochure/icon_move.gif" alt="" /></a></span></li> \n';					
				} // end for
				
				// load the widget items list
				$('organizer_choices').innerHTML = itemsList;
			}
		});
	}
	
	// *** PREVIEW MODULE *** //
	var curPreviewPage = 0;
	var maxPreviewPage = 0;
	
	// load the preview details based on speciifed page/rank
	function fetchPreviewPage(rank) {
		$('visualization_page_bg').hide();
		$('visualization_page_image').hide();
		$('visualization_page_loader_image').show();
		
		new Ajax.Request(appWebPath + "brochure/preview.php", {  
			method: "get", 
			parameters: { rank: rank }, 
			//onLoading: function(){ $('visualization_page_bg').hide(); $('visualization_page_image').hide(); $('visualization_page_loader_image').show(); }, 
			//onComplete: function(){ $('visualization_page_loader_image').hide(); $('visualization_page_bg').show(); $('visualization_page_image').show(); }, 
			onSuccess: function(transport) {
			
				// load the response, and convert JSON into regular array
				var response = transport.responseText;
				var jsonObj = response.evalJSON();
				
				// load all dynamic info into proper ids
				curPreviewPage = rank;
				
				// images
				$('visualization_page_bg').src = appWebPath + 'images/brochure/thumbs/visualization_page_' + jsonObj.wireframe + '.jpg';
				if ( jsonObj.image != '' ) {
					$('visualization_page_image').src = jsonObj.image;
					//alert(jsonObj.image);
				} else {
					//alert('hello');
					$('visualization_page_image').src = appWebPath + 'images/general/spacer.gif';
				}
				
				// pages
				$('custom_page_num_start').innerHTML = rank + 1;
				
				// nav
				var nav = '';
				if ( rank > 0 ) {
					nav += '<a href="#" onclick="fetchPreviewPage(' + (rank - 1) + '); return false;"><img src="' + appWebPath + 'images/brochure/photo_nav_prev.gif" alt="" /></a> ';
				}
				if ( rank < maxPreviewPage - 1 ) {
					nav += '<a href="#" onclick="fetchPreviewPage(' + (rank + 1) + '); return false;"><img src="' + appWebPath + 'images/brochure/photo_nav_next.gif" alt="" /></a>';
				}
				$('custom_page_nav').innerHTML = nav;
				
				// when everything is loaded, show back the page image and bg and hide the loader
				$('visualization_page_loader_image').hide(); 
				$('visualization_page_bg').show(); 
				$('visualization_page_image').show();
				
			}
		});
	}