function folio()
{
    this.items = Array();
}

folio.prototype.init = function(id) //id == tape
{
    this.container = document.getElementById(id);
    if(this.container == null) alert("Can't init with id "+id+"!");
}

folio.prototype.addItem = function(params)
{
    var item = document.createElement('div');
    item.className = "folio-item";
    this.container.appendChild(item);
    this.items.push(item);
    var number = this.items.length;

    var image = document.createElement('img');
    image.className = "folio-framed-image";
    image.alt = params.title;
    image.src = params.imageurl;
    item.appendChild(image);

    var text = document.createElement('div');
    text.className = "folio-text";
    item.appendChild(text);

    // text left

    var textleft = document.createElement('div');
    textleft.className = "folio-text-left";
    text.appendChild(textleft);

    var ftitle = document.createElement('div');
    ftitle.className = "folio-title";
    textleft.appendChild(ftitle);
    var ftitlep = document.createElement('p');
    ftitlep.innerHTML = params.title;
    ftitle.appendChild(ftitlep);

    if(params.twitter!="")
    {
        var twitter = document.createElement('a');
        twitter.href=params.twitter;
        twitter.className = "folio-twitter";
        ftitle.appendChild(twitter);
    }

    if(params.facebook!="")
    {
        var facebook = document.createElement('a');
        facebook.href=params.facebook;
        facebook.className = "folio-facebook";
        ftitle.appendChild(facebook);
    }

    var clr = document.createElement('div');
    clr.className = "clr";
    ftitle.appendChild(clr);

    var fmain = document.createElement('div');
    fmain.className = "folio-main";
    textleft.appendChild(fmain);
    fmain.innerHTML = params.content;


    //text right

    var textright = document.createElement('div');
    textright.className = "folio-text-right";
    text.appendChild(textright);
    if(params.video!="")
    {
        var playlink = document.createElement('a');
        playlink.className = "folio-button";
        textright.appendChild(playlink);
        var playimg = document.createElement('div');
        playimg.className = "folio-button-play";
        playlink.appendChild(playimg);
        var playtext = document.createElement('p');
        playtext.innerHTML = "watch the video";
        playlink.appendChild(playtext);
        playlink.onclick = function()
        {
            openShadowbox('Video: '+params.video+'!', 'html')
        }
    }

    if(params.tracks!="")
    {
        var tracklink = document.createElement('a');
        tracklink.className = "folio-button";
        textright.appendChild(tracklink);
        var trackimg = document.createElement('div');
        trackimg.className = "folio-button-track";
        tracklink.appendChild(trackimg);
        var tracktext = document.createElement('p');
        tracktext.innerHTML = "sample tracks";
        tracklink.appendChild(tracktext);


        tracklink.href = params.tracks;/*onclick = function()
        {
            openShadowbox('Tracks: '+params.tracks+'!', 'html')
        }*/
    }

    if(params.photo!="")
    {
        var photolink = document.createElement('a');
        photolink.className = "folio-button";
        textright.appendChild(photolink);
        var photoimg = document.createElement('div');
        photoimg.className = "folio-button-photo";
        photolink.appendChild(photoimg);
        var phototext = document.createElement('p');
        phototext.innerHTML = "launch slideshow";
        photolink.appendChild(phototext);
$(photolink).click(function() {
  $.fancybox(eval(params.photo), {
   'autoScale':false,
   'autoDimensions':false,
   'padding'   : 0,
   'transitionIn'  : 'none',
   'transitionOut'  : 'none',
   'type'              : 'image',
   'changeFade'        : 0
  });
 });
    }

    /*var AG = new ABTOGallery();
    AG.initByNode(image,{

        'width': 940,
        'height': 487,

        'triggerPeriod': 10,
        'deltaTrigger': 2,

        'labelPeriod': 10,
        'deltaLabel': 4,

        'notriggers': true,
        'norot':true,
        'nogbm':true,

        'images': new Array(params.imageurl)
        });
    AG.setAltLabelByNode(text);*/

}
