/*
function page_header(variable_stylesheet, page_title)

Esta função representa o header das páginas.
Cada página tem uma folha de estilo comum a todas as páginas, e uma outra variável.

@params - string, variable_stylesheet, representa a folha de estilo variavel de cada pagina.
	      string, page_title, título da página
@returns - string, header da página

*/
function page_header(variable_stylesheet)
{
	var meta2 = "<meta http-equiv=\"content-language\" content=\"pt-pt\" />";
	var meta3 = "<meta name=\"keywords\" content=\"Franchini, Galeria, Arte, Escultura, Pintura, Porto, Miguel Bombarda\"/>";

	var link1 = "<link rel=\"stylesheet\" type=\"text/css\" href=\"stylesheets/main.css\"/>";
	var link2 = "<link rel=\"stylesheet\" type=\"text/css\" href=\"stylesheets/" + variable_stylesheet + "\"/>";

	var js1 = "<script type=\"text/javascript\" src=\"javascript/jquery.js\"></script>";
	var js2 = "<script type=\"text/javascript\" src=\"javascript/jquery.browser.js\"></script>";
	var js3 = "<script type=\"text/javascript\" src=\"javascript/lib.js\"></script>";
    var js4 = "<script type=\"text/javascript\" src=\"javascript/main.js\"></script>";

	return meta2 + meta3 + link1 + link2 + js1 + js2 + js3 + js4;
}
	

/*
function top_menu(right_logo)

Esta funçao representa o menu superior das páginas. Funciona como um template para o menu.
Devido a compatibilidade de browser o HTML faz se com concatenaçao de strings, sendo que estas 
têm de estar numa mesma linha. Para que se possa alterar com maior facilidade após a definiçao da
função deixa-se em comentário a estrutura indentada.

@params - string right_logo, nome da imagem para o logo do lado direito
@returns - string top_menu, representaçao em string do html correspondente ao menu superior junto com os		
				  dois logos utilizados, o da esquerda sempre fixo e o da direita variavel.
*/
function top_menu(right_logo)
	{
		
		
		var logos1 = "<tr><td><div id='inside_logo_container'><a href='home.html'><img alt=\"logo\" src='images/logo_siteinterior.gif'/></a></div></td>";
		
		var logos2 ="";
		if(right_logo!='')
			logos2 = "<td rowspan='2' align='right' valign='bottom' ><img src='images/" + right_logo + "' style='margin-top: 0px; margin-right: 25px;'/></td></tr>";
		else
			logos2 = "<td rowspan='2' align='right' valign='bottom' ></td></tr>";
		
		var top_menu_header = "<tr><td width='610px'><div id='top_menu'><table border='0px'>";	
		var top_menu_artist = "<tr><td width='30px'></td><td align='right' id='td_enter_artist'><a href='#' id='enter_artist' class='main_link'>artista</a></td><td><div id='submenu_artist'><a href='cv.html' id='artist_op_1' class='submenu_link'>cv</a><span class='pipe'>|</span><a href='obras.html' id='artist_op_2' class='submenu_link'>obras</a><span class='pipe'>|</span><a href='news.html' id='artist_op_3' class='submenu_link'>news</a></div></td></tr>";
		var top_menu_gallery = "<tr><td width='30px'></td><td align='right' id='td_enter_gallery'><a href='#' id='enter_gallery' class='main_link'>galeria</a></td><td> <div id='submenu_gallery'><a href='apresentacao.html' id='gallery_op_1' class='submenu_link'>apresenta&ccedil;&atilde;o</a><span class='pipe'>|</span><a href='exposicoes.html' id='gallery_op_2' class='submenu_link'>exposi&ccedil;&otilde;es</a><span class='pipe'>|</span><a href='acervo.html' id='gallery_op_3' class='submenu_link'>acervo</a><span class='pipe'>|</span><a href='contactos.html' id='gallery_op_4' class='submenu_link'>contactos</a></div></td></tr>";	
		var top_menu_footer = "</table></div></td></tr>";
		
		return logos1 + logos2 + top_menu_header + top_menu_artist + top_menu_gallery + top_menu_footer;
	}

	
	
function detectBrowserLegacyIE()
{

	var return_val = 0;

	jQuery.each(jQuery.browser, function(i, val) {
 
		if(i=="ie")
		{
		
			var version = parseFloat(jQuery.browser.version);
			
			if(version <= 6.0)
			{
				return_val=1;
			}
		}
		
    });
	
	return return_val;

}
	
	
/*
function listing(exp_thumb, author, name, year)

Esta funçao representa uma exposiçao na listagem de exposiçoes ou um artista no acervo

@params - string exp_thumb, representa o thumbnail da exposiçao/obra no acervo
	      string link, ligacao para a pagina da exposicao/acervo
	      string author, autor da exposicao/autor presente no acervo
	      string name, nome da exposição
	      string year, ano da exposição
	      int flag_first, sinala que é a primeira da lista (por uma questao de arranjo grafico)
                int option, para se saber se estamos a listar para exposicoes(1) ou para o acervo(2)
 
 @returns - string, representaçao em string do HTML correspondente a uma exposiçao listada.

*/
function listing(exp_thumb, link, author, name, year, flag_first, option)
{
	
	var controlLegacyIE = detectBrowserLegacyIE();
	
	if (flag_first == 0)
		var exp_header = "<table border=\"0px\" cellpadding=\"0px\" cellspacing=\"0px\" style=\"margin-top: 30px;\"><tr>";
	else
		var exp_header = "<table border=\"0px\" cellpadding=\"0px\" cellspacing=\"0px\"><tr>";
	
	var thumb = "<td><div class=\"thumb_container\"><a href=\"" + link + "\"><img alt=\"" + author + "\" src=\"images/" + exp_thumb + "\"/></a></div></td>";

	var hr1 = "<td><table border=\"0px\" cellpadding=\"0px\" cellspacing=\"0px\"><tr><td valign=\"top\" height=\"1px\">";

	if(controlLegacyIE==0)
	{
		hr1 = hr1 + "<div class=\"horizontal_rule\"></div>";
	}
	
	hr1 = hr1 + "</td></tr>";
	
	if(option == 1)
		var text = "<tr><td><a href=\"" + link + "\" class=\"exhibit_name\"  style=\"margin-left: 25px;\"> > " + author + "</a><span class=\"pipe_gray\"> | </span><label class=\"exhibit_name\">" + name + "</label><span class=\"pipe_gray\"> | </span><label class=\"exhibit_name\">" + year + "</label></td></tr>"; 
	else
		var text = "<tr><td><a href=\"" + link + "\" class=\"exhibit_name\"  style=\"margin-left: 25px;\"> > " + author + "</a><label class=\"exhibit_name\">" + name + "</label><label class=\"exhibit_name\">" + year + "</label></td></tr>"; 
	
	var hr2 = "<tr><td height=\"42px\"></td></tr><tr><td valign=\"bottom\">";

	if(controlLegacyIE==0)
	{
		hr2 = hr2 + "<div class=\"horizontal_rule\"></div>";
	}
	
	hr2 = hr2 + "</td></tr>";
	
	
	var exp_footer = "</table></td></tr></table>";
	
	return exp_header + thumb + hr1 + text + hr2 + exp_footer; 
}


/*
function cv_entry(text, date)

Esta funcao representa uma nova entrada no currículo de Franchini

@params - string text, representa o texto da nova entrada
	        string date, representa a data da entrada, exº Junho 2008
	        int n_entries, numero de entradas para este mes deste ano
@returns - representaçao em string do HTML correspondente

*/
function cv_entry(date, text)
{
	var date = "<b class=\"date\">" + date + ":</b>&nbsp;"; 
	
	var entries = text.split("AND");
	
	var result_text = "";
	
	for(i=0; i<entries.length; i++)
	{
		result_text = result_text + entries[i] + "<br/>";
	
	}
	
	var nl = "<br/>";
	return date + result_text + nl;
}


/*

function news(image, image_title, image_text, normal_title, bold_title, text, link)

Função que alberga o template para a secção de notícias.

@params -	string image, nome físico da imagem do lado direito
		string image_title, título da imagem
		string image_text, legenda da imagem
		string normal_title, parte do título que nao tem bold
		string bold_title, parte do título em bold
		string text, texto da notícia
		string link, um possível link com mais informação

@returns, representação HTML do template

*/
function news(image, image_title, image_text, normal_title, bold_title, text, link)
{

	var entries = text.split("AND");
	
	var result_text = "";
	
	for(i=0; i<entries.length; i++)
	{
		result_text = result_text + entries[i] + "<br/><br/>";
	}

	var head = "<tr><td colspan=\"2\" class=\"center_align\"><table class=\"right_image_left_text_table\" border=\"0px\"><tr>";
	
	var con ="";
	
	if(link!='')	
		con = "<label class=\"to_link\">Ver mais em&nbsp;</label><a class=\"external_link\" href=\"" + link + "\">" + link + "\</a>";
	
	var left_text = "<td class=\"right_top_align\"><div class=\"news_headline\">" + normal_title + "&nbsp;<b>" + bold_title + "</b></div><div class=\"news_text\">" + result_text + con + "</div></td>";
	var img = "<td width=\"200px\" align=\"left\"><img src=\"images/" + image + "\"/><div class=\"show_exhibit_image_sub\"><i>" + image_title + "</i> - " + image_text + "</div></td>";
	var foot = "</tr></table></td></tr>";

	return head + left_text + img + foot;
}


/*

function contactos(image, address, tlf, mail, time)

Função que alberga o template para a secção de contactos.
@params - string image, nome físico da imagem do lado direito
	        string address, morada da galeria
	        string tlf, telefone da galeria
	        string mail, direçao de email
	       string time, horario de abertura

@returns, representação html do template

*/

function contactos(image, address, tlf, mail, time)
{

	var head = "<table border=\"0px\" class=\"right_image_left_text_table\"><tr><td class=\"right_top_align\" >";
	var left_text = "<div id=\"contact_section\">" + address + "<br/><br/><br/>" + tlf + "<br/><br/><br/><a class=\"email_link\" href=\"mailto:" + mail + "\" >" + mail + "</a><br/><br/><br/>" + time + "</div></td>";
	var img = "<td width=\"200px\"><img src=\"images/" + image + "\"/></td>";
	var foot ="</tr></table>";

	return head + left_text + img + foot;
}



/*
function space_before_text(table_wd, image, text_wd)

Esta função auxiliar calcula o espaço num td antes do texto de uma exposiçao

@params - int table_wd, largura da tabela
                int image, imagem a utilizar
                int text_wd, largura do texto a utilizar
	
@returns int espaço a colocar

*/

function space_before_text(table_wd, image, text_wd)
{
	var path_img  = "./images/" + image;
	
	var img = new Image();
	
	img.src = path_img;
	
	var wd_i = img.width;
	
	return table_wd - wd_i - text_wd;

}


/*
function exposition(image, image_title, image_text, artist, exp_name, date, artist_cv)

Esta função albera o template que vai fornecer uma imagem do lado direito e texto do lado esquerdo.
Separou-se da funcao right_image_left_text uma vez que uma exposiçao tem características únicas.

@params - string image, imagem a utlizar
                string image_title, título da imagem
	      string image_text, legenda da imagem
	      string artist, nome do artista
	      string exp_name, nome da exposiçao
	      string date, informação da data da exposição
	      string artist_cv, texto com o CV do artista

@uses - space_before_text
		    
@returns representação HTML

*/
function exposition(image, image_title, image_text, artist, exp_name, inaug, final_date, artist_cv)
{

	var text_head = "<tr><td colspan=\"2\" class=\"center_align\"><table class=\"images_container\" border=\"0px\"><tr><td width=\"" + space_before_text(913, image, 283).toString() + "\"></td><td class=\"right_top_align\"><div class=\"exhibit_text\">"; 
	
	var artist_name = "<label class=\"artist_name_show_exhibit\">" + artist + "</label><br/>";

	var name ="<label class=\"exhibit_name_show_exhibit\">_" + exp_name + "</label><br/><br/>";
	
	var exp_info = "<label class=\"exhibit_date\">" + inaug + "<br/>" + final_date + "</label><br/><br/>";

	var art_cv_title = "<div class=\"artist_exhibit_text\">" + artist + "_CV<br/><br/>";

	var text_foot = "</div></div></td>";
	
	var img = "<td width=\"200px\" align=\"left\"><img alt=\"" + image_title + "\" src=\"images/" + image + "\"/>";
		
	var image_sub = "<div class=\"show_exhibit_image_sub\"><i>" + image_title + "</i> - " + image_text + "</div></td>";		 

	var foot ="</tr></table></td></tr>";
	
	return text_head + artist_name + name + exp_info + art_cv_title + artist_cv  + text_foot + img + image_sub + foot;
}

/*
function artist_acervo(image, image_title, image_text, artist)

Esta função albera o template que vai fornecer uma imagem do lado direito e texto do lado esquerdo
para a secçao do acervo.

@params - string image, nome física da imagem
	      string image_title, título da imagem
	      string image_text, legenda da imagem
                string artist, nome do artista

@uses - space_before_text
				
@returns representaçao HTML				

*/
function artist_acervo(image, image_title, image_text, artist, sub_margin_correction)
{

	var text_head = "<tr><td colspan=\"2\" class=\"center_align\"><table class=\"images_container\" border=\"0px\"><tr><td width=\"" + space_before_text(913, image, 283).toString() + "\"></td><td class=\"right_top_align\"><div class=\"exhibit_text\">"; 
	
	var artist_name = "<label class=\"artist_name_show_exhibit\">" + artist + "</label><br/>";

	var text_foot = "</div></td>";
	
	var img = "<td width=\"200px\" align=\"left\"><img alt=\"" + image_title + "\" src=\"images/" + image + "\"/>";
		
	var image_sub = "<div style=\"margin-top: " + sub_margin_correction + "px\" class=\"show_exhibit_image_sub\"><i>" + image_title + "</i> - " + image_text + "</div></td>";		 

	var foot ="</tr></table></td></tr>";
	
	return text_head + artist_name + text_foot + img + image_sub + foot;
}

/*
function int_td_width(table_wd, image1, image2)

Funcao auxiliar para saber o tamanho de uma td que se coloca entre duas imagens numa linha de imagens.
Esta td é necessária para o alinhamento à esquerda das legendas. 
A necessidade inicial adveio da compatibilidade de browser, que forçou à colocaçao das imagens de uma determinada maneira.

@params - int table_wd, largura da tabela que alberga as linha de imagens
	        int image1, nome da primeira imagem
	        int image2, nome da segunda imagem
			
@return int tamanho da td a colcar entre imagens


*/
function int_td_width(table_wd, image1, image2)
{
	var path_img_l  = "./images/" + image1;
	var path_img_r  = "./images/" + image2;
	
	var img_l = new Image();
	var img_r = new Image();
	
	img_l.src = path_img_l;
	img_r.src = path_img_r;
	
	var wd_l = img_l.width;
	var wd_r = img_r.width;
	
	return table_wd - wd_l - wd_r;
}



/*

images_left_top_right_top(image_left, title_im_left, text_im_left, image_right, title_im_right, text_im_right)

Esta funçao serve como template para uma linha de imagens.
neste caso, tanto a imagem da esquerda como a da direita alinhadas em cima

@params - string image_left, nome físico da imagem da esquerda
	      string title_im_left, título da imagem da esquerda
	      string text_im_left, legenda da imagem da esquerda
	      string image_right, nome físico da imagem da direita
	      string title_im_right, título da imagem da direita
	      string text_im_right, legenda da imagem da direita
	
@uses - int_td_width

@returns - representação HTML

*/

function images_left_top_right_top(image_left, title_im_left, text_im_left, image_right, title_im_right, text_im_right, sub_margin_correction_l, sub_margin_correction_r)
{
	var th = "<tr><td colspan=\"2\"><br/><br/><table border=\"0px\" class=\"images_container\"><tr>";
	
	var img_left = "<td class=\"left_top_align\"><img alt=\"" + title_im_left + "\" src=\"images/" + image_left + "\"/>";
	
	var text_left = "<div style =\"margin-top: " + sub_margin_correction_l.toString() + "px;\" class=\"show_exhibit_image_sub\"><i>" + title_im_left + "</i> - " + text_im_left + "</div></td>";

	var img_right = "<td width=\"" + int_td_width(913,image_left,image_right).toString() + "\"></td><td class=\"right_top_align\"><img alt=\"" + title_im_right + "\" src=\"images/" + image_right + "\"/>";
	
	var text_right = "<div style =\"margin-top: " + sub_margin_correction_r.toString() + "px;\" class=\"show_exhibit_image_sub\"><i>" + title_im_right + "</i> - " + text_im_right + "</div></td>";

	var tf = "</tr></table></td></tr>";
	
	return th + img_left + text_left + img_right + text_right + tf;
}


/*

images_left_bottom_right_down(image_left, title_im_left, text_im_left, image_right, title_im_right, text_im_right)

Esta funçao serve como template para uma linha de imagens.
neste caso, tanto a imagem da esquerda como a da direita alinhadas em baixo

@params - string image_left, nome físico da imagem da esquerda
	      string title_im_left, título da imagem da esquerda
	      string text_im_left, legenda da imagem da esquerda
	      string image_right, nome físico da imagem da direita
	      string title_im_right, título da imagem da direita
	      string text_im_right, legenda da imagem da direita
	
@uses - int_td_width

@returns - representação HTML

*/
function images_left_bottom_right_down(image_left, title_im_left, text_im_left, image_right, title_im_right, text_im_right)
{


	var th = "<tr><td colspan=\"2\"><table border=\"0px\" class=\"images_container\"><tr>";
	
	var img_left = "<td class=\"left_bottom_align\"><img alt=\"" + title_im_left + "\" src=\"images/" + image_left + "\"/>";
	
	var text_left = "<div class=\"show_exhibit_image_sub\"><i>" + title_im_left + "</i> - " + text_im_left + "</div></td>";
	
	var img_right = "<td width=\"" + int_td_width(913,image_left,image_right).toString() + "\"></td><td class=\"right_bottom_align\"><img alt=\"" + title_im_right + "\" src=\"images/" + image_right + "\"/>";
	
	var text_right = "<div class=\"show_exhibit_image_sub\"><i>" + title_im_right + "</i> - " + text_im_right + "</div></td>";
	
	var tf = "</tr></table></td></tr>";
	
	return th + img_left + text_left + img_right + text_right + tf;
	
}


/*
function side_tds_wd(table_wd, image)

Funcao auxiliar para saber o tamanho de uma td que se coloca no inicio e no final de uma linha de imagens.
Este tamanho permite centrar a imagem, mantendo o alinhamento à esquerda das legendas. 
A necessidade inicial adveio da compatibilidade de browser, que forçou à colocaçao das imagens de uma determinada maneira.

@params - int table_wd, largura da tabela que alberga as linha de imagens
	        int image, nome da primeira imagem
			
@return int tamanho da td a colcar


*/
function side_tds_wd(table_wd, image)
{
	
	var path_img  = "./images/" + image;
	
	var img = new Image();
	
	img.src = path_img;
	
	var wd_i = img.width;
	
	return table_wd - wd_i;
}


/*

centered_image(image, title, text)

Esta funçao serve como template para uma linha em que apenas aparece uma imagem centrada.

@params - string image, nome físico da imagem
                string title, título da imagem
	      string text, legenda da imagem
		 
@returns - representaçõ HTML

*/
function centered_image(image, title, text)
{
	var th = "<tr><td colspan=\"2\"><table border=\"0px\" class=\"images_container\"><tr>";

	var img = "<td width=\"" + side_tds_wd(913, image).toString() + "\"></td><td><img alt=\"" + title + "\" src=\"images/" + image + "\"/>";
	
	var text = "<div class=\"show_exhibit_image_sub\"><i>" + title + "</i> - " + text + "</div></td>";
	
	var tf = "<td width=\"" + side_tds_wd(913, image).toString() + "\"></tr></table></td></tr>";
	
	return th + img + text + tf;
}

/*
function page_footer()

funcao que alberga o validator de XHTML e footer da pagina

@params - int mtop, margem ao elemento mais acima.

@returns, string representacao HTML do validator e footer de uma página
*/

function page_footer()
{
	main_table_h = $('#main_container').height();

	if (main_table_h > 550)
		margin = 50;	
	else
	{
		margin = 555 - main_table_h;
	}
		
	var owner = "<div class=\"footer\" style=\"margin-top:" + margin.toString() + "px;\" align=\"right\"><label id=\"owner\" >2008 &copy; Franchinis Galeria | <a class=\"f_link\" href=\"http://validator.w3.org/check?uri=referer\">XHTML 1.0</a> e <a class=\"f_link\" href=\"http://jigsaw.w3.org/css-validator/\">CSS3</a> | desenvolvido por </label>";

	var credits = "<label id=\"credits\">J&JRocha - <a class=\"f_link\" href=\"mailto:jandjrocha@gmail.com\">jandjrocha@gmail.com</a></label></div>";
	
	return owner + credits;
}