var portfolio = new Array();

// \00e1 -> á
// \00e9 -> é
// \00ed -> í
// \00f3 -> ó
// \00fa -> ú

// \00c1 -> Á
// \00c9 -> É
// \00cd -> Í
// \00d3 -> Ó
// \00da -> Ú

// \00f1 -> ñ
// \00d1 -> Ñ

portfolio[0] = { 'titulo' : 'depstudio', 'descrip' : 'depstudio | dise\u00f1o y programaci\u00f3n web, nuestro primer proyecto, nuestra identidad en internet', 'tit_ul' : 'Tecnolog\u00edas utilizadas', 'lista' : [ 'html 4.01 strict', 'CSS 2.1', 'PHP', 'JavaScript - JSON - DHTML' ], 'a_img' : 'portfolio/depstudio.jpg', 'a_id' : 'img_single_3', 'a_class' : 'depstudio', 'a_titulo' : 'depstudio | dise\u00f1o y programaci\u00f3n web', 'img' : 'portfolio/tumb-depstudio.jpg', 'img_alt' : 'depstudio | dise\u00f1o y programaci\u00f3n web', 'url_site' : 'http://depstudio.com.ar' };
portfolio[1] = { 'titulo' : 'thor IT security', 'descrip' : 'Servicios profesionales especializados en Seguridad Inform\u00e1tica', 'tit_ul' : 'Tecnolog\u00edas utilizadas', 'lista' : [ 'html 4.01 strict', 'CSS 2.1', 'PHP', 'JavaScript' ], 'a_img' : 'portfolio/thorsecurity.jpg', 'a_id' : 'img_single_1', 'a_class' : 'thorsecurity', 'a_titulo' : 'thor IT security | Seguridad Inform\u00e1tica', 'img' : 'portfolio/tumb-thorsecurity.jpg', 'img_alt' : 'thor IT security', 'url_site' : 'http://thorsecurity.com.ar' };
portfolio[2] = { 'titulo' : 'Gr\u00e1fica Tucum\u00e1n', 'descrip' : 'Gr\u00e1fica Tucum\u00e1n Mar del Plata | Imprenta - Cat\u00e1logos - Folletos - Revistas - Libros - Packaging - Carpetas', 'tit_ul' : 'Tecnolog\u00edas utilizadas', 'lista' : [ 'html 4.01 strict', 'CSS 2.1', 'PHP', 'JavaScript' ], 'a_img' : 'portfolio/gtucuman.jpg', 'a_id' : 'img_single_2', 'a_class' : 'gtucuman', 'a_titulo' : 'Gr\u00e1fica Tucum\u00e1n Mar del Plata | Imprenta', 'img' : 'portfolio/tumb-gtucuman.jpg', 'img_alt' : 'Gr\u00e1fica Tucum\u00e1n', 'url_site' : 'http://graficatucuman.com.ar' };
portfolio[3] = { 'titulo' : 'Serendipia', 'descrip' : 'Organizaci\u00f3n de Eventos - Wedding Planner - Corporate Event - Event Planner | Eventos en general', 'tit_ul' : 'Tecnolog\u00edas utilizadas', 'lista' : [ 'html 4.01 strict', 'CSS 2.1', 'PHP', 'JavaScript - DOM - DHTML' ], 'a_img' : 'portfolio/serendipia.jpg', 'a_id' : 'img_single_4', 'a_class' : 'serendipia', 'a_titulo' : 'Serendipia | Organizaci\u00f3n de Eventos', 'img' : 'portfolio/tumb-serendipia.jpg', 'img_alt' : 'Serendipia | Organizaci\u00f3n de Eventos', 'url_site' : 'http://www.serendipiaeventos.com.ar' };
portfolio[4] = { 'titulo' : 'Tres Moscas Verdes', 'descrip' : 'Dise\u00f1os exclusivos en tarjeter\u00eda artesanal | tarjeter\u00eda comercial y social - dise\u00f1o gr\u00e1fico', 'tit_ul' : 'Tecnolog\u00edas utilizadas', 'lista' : [ 'html 4.01 strict', 'CSS 2.1', 'PHP', 'JavaScript - DOM - DHTML' ], 'a_img' : 'portfolio/3moscas.jpg', 'a_id' : 'img_single_5', 'a_class' : 'Tres Moscas Verdes', 'a_titulo' : 'Tres Moscas Verdes | Dise\u00f1os exclusivos en tarjeter\u00eda artesanal', 'img' : 'portfolio/tumb-3moscas.jpg', 'img_alt' : 'Tres Moscas Verdes | Dise\u00f1os exclusivos en tarjeter\u00eda artesanal', 'url_site' : 'http://www.tresmoscasverdes.com.ar' };

var cant = portfolio.length;
var pos = cant -1;

function sigPortfolio() {
    if ( pos  == ( cant -1 ) )
        pos = 0;
    else
        pos++;
    mostrarSitio( pos );
}

function antPortfolio() {
    if ( pos == 0 )
        pos = cant - 1;
    else
        pos--;
    mostrarSitio( pos );
}

function mostrarSitio( elem ) {
    var objeto = portfolio[elem];
        
    // Obtener el contenedor y limpiarlo
    var contenedor = document.getElementById( "trabajos" );
    contenedor.innerHTML = '';
    
    var h4 = document.createElement( "h4" );
    var texto = document.createTextNode( "Proyecto " );
    h4.appendChild( texto );
    
    var span = document.createElement( "span" );
    texto = document.createTextNode( "#" + ( elem + 1) );
    span.appendChild( texto );
    h4.appendChild( span );
    
    texto = document.createTextNode( ': ' + objeto.titulo );
    h4.appendChild( texto );
    contenedor.appendChild( h4 );
    
    var p = document.createElement( "p" );
    texto = document.createTextNode( objeto.descrip );
    p.appendChild( texto );
    contenedor.appendChild( p );
    
    p = document.createElement( "p" );
    var strong = document.createElement( "strong" );
    texto = document.createTextNode( objeto.tit_ul );
    strong.appendChild( texto );
    p.appendChild( strong );
    contenedor.appendChild( p );
    
    var ul = document.createElement( "ul" );
    var li;
    var cant = objeto.lista.length;
    for ( x = 0; x < cant; x++ ) {
        li = document.createElement( "li" );
        texto = document.createTextNode( objeto.lista[x] );
        li.appendChild( texto );
        ul.appendChild( li );
    }
    contenedor.appendChild( ul ) ;
    
    var div = document.createElement( "div" );
    var attr = document.createAttribute( "id" );
    attr.value = 'imagen-sitio';
    div.setAttributeNode( attr );
    
    var a = document.createElement( "a" );
    attr = document.createAttribute( "href" );
    attr.value = objeto.a_img;
    a.setAttributeNode( attr );
    
    attr = document.createAttribute( "id" );
    attr.value = objeto.a_id;
    a.setAttributeNode( attr );
    
    attr = document.createAttribute( "class" );
    attr.value = objeto.a_class;
    a.setAttributeNode( attr );
    
    attr = document.createAttribute( "title" );
    attr.value = objeto.a_titulo;
    a.setAttributeNode( attr );
    
    var img = document.createElement( "img" );
    attr = document.createAttribute( "src" );
    attr.value = objeto.img;
    img.setAttributeNode( attr );
    
    attr = document.createAttribute( "width" );
    attr.value = 300;
    img.setAttributeNode( attr );
    
    attr = document.createAttribute( "height" );
    attr.value = 95;
    img.setAttributeNode( attr );
    
    attr = document.createAttribute( "alt" );
    attr.value = objeto.img_alt;
    img.setAttributeNode( attr );
    
    a.appendChild( img );
    div.appendChild( a );
    contenedor.appendChild( div );
    
    a = document.createElement( "a" );
    attr = document.createAttribute( "href" );
    attr.value = objeto.url_site;
    a.setAttributeNode( attr );
    
    attr = document.createAttribute( "rel" );
    attr.value = 'external';
    a.setAttributeNode( attr );
    
    attr = document.createAttribute( "id" );
    attr.value = 'linksitio';
    a.setAttributeNode( attr );
    
    texto = document.createTextNode( "Visitar el Sitio" );
    a.appendChild( texto );
    contenedor.appendChild( a );
    
    $zoom();
	externalLinks();
}