function displayStatusMessage(message) {
  
  var lMessageDiv = new Element('div', {id: 'status-message'}).setStyle({
    left: ((document.viewport.getWidth() / 2) - 145) + 'px',
    top: ((document.viewport.getHeight() / 2) - 100) + 'px'
  });
  lMessageDiv.insert(new Element('img', { 'width': 16, 'height': 16, 'src': '/images/spinner.gif', 'class': 'spinner' }));
  lMessageDiv.insert(new Element('div', { 'id': 'status-message-text' }).update(message));
  document.body.appendChild(lMessageDiv);
}

function hideStatusMessage() {
	$('status-message').remove();
}


/*** ELEMENT CATEGORY SELECT ***/

var fSelectedCategory = '';
var PER_PAGE = 20;

function getElement(pId) {
  for(var k = 0; k < fElements.length; k++) {
      if(fElements[k].id == pId)
        return fElements[k];
    
  }
}

function selectElement(pId) {
  var lElement = getElement(pId);
   swfobject.embedSWF('http://www.floorplanner.com/flash/preview.swf', 'selected-element', 40, 40, '8', '', {'url':lElement.public_url2d});
   $('element_selected').value = lElement.id;
   $('element-select').toggle();	
}
var fElementSearchName;
function selectElements() {
	var lElements = new Array();
	if(fElementSearchName == '' || fElementSearchName == undefined) {
		lElements = fElements;
	} else { 
			for(var k = 0; k < fElements.length; k++) {
      	if(fElements[k].name != null && fElements[k].name.toLowerCase().indexOf(fElementSearchName.toLowerCase()) != -1 || fElements[k].id.toString() == fElementSearchName)
       		lElements.push(fElements[k]);  
  		}
	}
	return lElements;
}

function selectCategory(pId, pPage) {
  displayStatusMessage('Generating previews...');
  lElements = getElementsForCategory(pId);
  $('element-collection').innerHTML = "";
  if(pPage == null) pPage = 0;
  lPagination = showElementCatNavBar(pId, pPage, PER_PAGE, lElements.length);
  createDivForElements(lElements, lPagination.min , Math.min(lPagination.max, lElements.length));
  hideStatusMessage();
}

function searchElements(pName) {
	fElementSearchName = pName;
	selectElementPage(0)
}

function createDivForElements(pElements, pFrom, pTo) {
  for(var i = pFrom; i < pTo; i++) { 
     var code = '<div class="element" onmouseover="this.className = \'element element-mouseover\';" onmouseout="this.className = \'element\';"  onclick="selectElement(' + pElements[i].id + ');">';
     code += '<div  id="element-' + pElements[i].id + '" class="element-swf" onclick="selectElement(' + pElements[i].id + ');"> </div>';
     code += '<div class="element-name" id="element-' + pElements[i].id + '-name">' + pElements[i].name + '</div>'
     code += '</div>';
     $('element-collection').innerHTML += code;
		 
     swfobject.embedSWF('http://www.floorplanner.com/flash/preview.swf', "element-" + pElements[i].id, 50, 50, '8', '', {'url':pElements[i].public_url2d}, {}, {'style': 'margin-left: 15px;'});
  }
}


function selectElementPage(pPage) {
  displayStatusMessage('Generating previews...');
  lElements = selectElements();
  $('element-collection').innerHTML = "";
  if(pPage == null) pPage = 0;
  lPagination = showElementNavBar(pPage, PER_PAGE, lElements.length);
  createDivForElements(lElements, lPagination.min , Math.min(lPagination.max, lElements.length));
  hideStatusMessage();
}





function showElementCatNavBar(pId, pPage, pPP, pAbsMax) {
  lMin = pPage * PER_PAGE;
  lMax = (pPage + 1) * PER_PAGE;
  
  $('navbar').innerHTML = "";
  $('navbar').innerHTML += " showing " + lMin + " - " + Math.min(lMax, pAbsMax) + " of " + pAbsMax;
  $('navbar').innerHTML += "<span style=\"margin-right:20px;\">&nbsp;</span>";
  if(pPage > 0) {
    $('navbar').innerHTML += "<a href=\"#\" onclick=\"selectCategory("+pId+", " + (pPage - 1) + ");\">prev page</a>";
  } else {
    $('navbar').innerHTML += "prev page";
  } 
  
  $('navbar').innerHTML += " | ";
  
  if( lMax < pAbsMax ) {
    $('navbar').innerHTML += "<a href=\"#\" onclick=\"selectCategory("+pId+", "+ (pPage + 1) + ");\">next page</a>";
  } else {
    $('navbar').innerHTML += "next page";
  }
  
  return {min: lMin, max: lMax};
}


function showElementNavBar(pPage, pPP, pAbsMax) {
  lMin = pPage * PER_PAGE;
  lMax = (pPage + 1) * PER_PAGE;
  
  $('navbar').innerHTML = "";
  $('navbar').innerHTML += " showing " + lMin + " - " + Math.min(lMax, pAbsMax) + " of " + pAbsMax;
  $('navbar').innerHTML += "<span style=\"margin-right:20px;\">&nbsp;</span>";
  if(pPage > 0) {
    $('navbar').innerHTML += "<a href=\"#\" onclick=\"selectElementPage("+ (pPage - 1) + ");\">prev page</a>";
  } else {
    $('navbar').innerHTML += "prev page";
  } 
  
  $('navbar').innerHTML += " | ";
  
  if( lMax < pAbsMax ) {
    $('navbar').innerHTML += "<a href=\"#\" onclick=\"selectElementPage("+ (pPage + 1) + ");\">next page</a>";
  } else {
    $('navbar').innerHTML += "next page";
  }
  
  return {min: lMin, max: lMax};
}



function openFloorplannerPopup(pUrl) {
  //alert(pUrl);
  window.open(pUrl,"Draw the floorplan", "status=1,location=0,menubar=0,resizable=1,scrollbars=0,toolbar=1");
}


function goto(pUrl) {
  window.location = pUrl;
}



function applyPNGFix() {
	var version = parseFloat(navigator.appVersion.split('MSIE')[1]);
	if ((version >= 5.5) && (version < 7) && (document.body.filters)) {
		document.getElementsByClassName('ie-fix-opacity').each(function(poElement){
			// if IE5.5+ on win32, then display PNGs with AlphaImageLoader
			var cBGImg = poElement.currentStyle.backgroundImage;
			var cImage = cBGImg.substring(cBGImg.indexOf('"') + 1, cBGImg.lastIndexOf('"'));
 
			poElement.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + cImage + "', sizingMethod='scale')";
			poElement.style.backgroundImage = "none";
		});
	}
}


function resetRating(pCurrentRating, pHolder) {

	displayRating(pCurrentRating, pHolder);
}

function displayRating(rating, pHolder) {
	
  for (var i = 1; i <= 5; i++) {
    image_src = (rating < i ) ? '/images/star-open.gif' : '/images/star-closed.gif';
    $(pHolder + 'rating_' + i).src = image_src;
  }
}








/** Project thumb **/
function loadProjectInfo(projectId) {
	if (!$('project_' + projectId + '-inforow').visible()) {

		// Collapse all projects that are expanded:
		// $$('table .project-info').each(function(element) { 
		// 	element.hide(); 
		// 	$('project_' + projectId).removeClassName('expanded');			
		// });	

		new Ajax.Request('/projects/' + projectId + '/recent_designs', 
			{	method: 'get', 
				onLoading:  function() { $('project_' + projectId + '-spinner').show(); },
				onComplete: function() { $('project_' + projectId + '-spinner').hide(); },
				onFailure: function()  { alert('Error while loading project details...'); },
				onSuccess: function()  { 
					$('project_' + projectId + '-expander').className = 'project-expanded';
					Effect.SlideDown('project_' + projectId + '-inforow');	
				}
			});
	} else {
		$('project_' + projectId + '-inforow').hide();
		$('project_' + projectId + '-expander').className = 'project-not_expanded';
	}
}

function loadFloorplanner(design_id, project_id, name, url, holder_id) {
	$(holder_id).update("");
	var fp = new Floorplanner({'design_id': design_id, "project_id": project_id, "state": "thumb" });
	fp.embed(holder_id);
	
}

function writeThumbnail(design_id, project_id, name, url, holder_id) {
	$(holder_id).update('<img src="' + url + '" width="190" height="142" alt="' + name + '" />');
}

function loadDesignThumb(design_id, project_id, name, url, holder_id) {
	var img = new Image();
	//img.onerror = function(evt) { writeThumbnail(id, name, '/images/thumb-unavailable.png'); };
	img.onerror = function(evt) { loadFloorplanner(design_id, project_id, name, url, holder_id); };
	img.onload  = function(evt) { writeThumbnail(design_id, project_id, name, url, holder_id); };
	img.src = url;

}

function loadGalleryThumb(design_id, project_id, name, url, holder_id, img_div_id) {
	var img = $(img_div_id);
	img.onerror = function(evt) { 
		$(holder_id).update('');
		loadFloorplanner(design_id, project_id, name, url, holder_id); 
	};
	
}



function setNewProjectButton() {
 
  if(fAvailableProjects > 0) {
    $('newprojectbutton').show();
    $('newprojectbutton-deactive').hide();
  } else {
    $('newprojectbutton').hide();
    $('newprojectbutton-deactive').show();      
  }

}


function showLanguageField(pIdentifier, pCode) {
	
	for(var i = 0; i < fLanguages.length; i++) {
		if(pCode == fLanguages[i]) {
			$(pIdentifier + fLanguages[i]).show();
		} else {
			$(pIdentifier + fLanguages[i]).hide();
		}
	}
}

// Unobtrusive Ajax pagination for WillPaginate

document.observe("dom:loaded", function() {
  // the element in which we will observe all clicks and capture
  // ones originating from pagination links
  var container = $('comment-container');

  if (container) {
    container.observe('click', function(e) {
      var el = e.element();
      if (el.match('#comment-container .pagination a')) {
				el.up('#comment-container .pagination').insert(new Element('img', { 'width': 16, 'height': 16, 'src': '/images/spinner.gif', 'class': 'spinner' }));        
        new Ajax.Request(el.href, { method: 'get' });
        e.stop();
      }
    });
  }
});