mobile.initializePage("detailsView", function() { 

	// handles the message container 
	mobile.updateTextContainer = function(status) {

		var buttonPaneDiv = $('buttonPane');
		var messagePaneDiv = $('messagePane');
		
		if (status == 'SUCCESSFULL') {
			var statusCssClass = 'success';
			$('parkVehicle').addClassName('hidden');
			$('gotoParking').removeClassName('hidden');
			
			if(mobile.trackParking){
				mobile.trackParking();
			}
			
			if (typeof(mediaplex) != "undefined") {
				mediaplex.executeRequest();
			}
		} else {
			var statusCssClass = 'failure';
		}
		
		setTimeout(function() {
			messagePaneDiv.removeClassName("pending")
						.addClassName(statusCssClass)
						.update(mobile.PageParams.MessageResources[status]);
			
			// After all, hide and remove message container.
			setTimeout(function() {
				new Effect.Opacity(messagePaneDiv, {
					from: 1, 
					to: 0,  
					duration: 1,
					afterFinish: function() {
						messagePaneDiv.setStyle({visibility: "hidden"});
						messagePaneDiv.update("").removeClassName(statusCssClass);
						
						buttonPaneDiv.setStyle({visibility: "visible"});
						mobile.buttonInProgress = false;
					},
					queue: 'end'
				});
			}, (2 * 1000));
		}, (2 * 1000));
	}

	 
	mobile.sendParkingRequest = function(){
		new Ajax.Request('parkingAjax.html', {
			evalJSON: true,
			method: 'post',
			requestHeaders: {
				Accept: 'application/json'
			},
			parameters: {
				adIdToPark: mobile.PageParams.AdId
			},
			onComplete: function(response){
				var status = response.responseJSON.ParkingCreationStatus;
				mobile.updateTextContainer(status);
			},
			onFailure: function() {
				mobile.updateTextContainer('ERROR');
			}
		});
	}

	//false on load, prevent happy clicking - only one action at once
	mobile.buttonInProgress = false;

	//handles the click event for the parking button
	document.observe("click", function(event) {
		var element = event.element();
		
		if (element && element.hasClassName('parkVehicleLink')) {
			event.stop();
			element.blur();
			
			if (!mobile.buttonInProgress) {
				//prevent happy clicking - only one action at once
				mobile.buttonInProgress = true;

				// hide button pane				
				var buttonPaneDiv = $('buttonPane');
				buttonPaneDiv.setStyle({visibility: "hidden"});
			
				var messagePaneDiv = $('messagePane');
				
				// Show message container with a spinning image ...
				messagePaneDiv.setStyle({
					opacity: 0
				});
				messagePaneDiv.setStyle({visibility: "visible"});
				// ... and a loading message ...
				messagePaneDiv.update(mobile.PageParams.MessageResources['SENDING']).addClassName("pending");
				
				/// ... and fade it in.
				new Effect.Opacity(messagePaneDiv, { 
					from: 0, 
					to: 1, 
					duration: 1, 
					queue: 'front' 
				});
				
				mobile.sendParkingRequest();					
			}
		}
	});
});