var InitFolder;
function init()
{
    
    var temp = document.getElementById('hiddenCurrPath').value;
    InitFolder = temp.split("&|");
    if ((InitFolder.length>1) && (InitFolder[1]!=""))
    {
        if (InitFolder.length>3)
        {
            CurrPath[0] = {'id':InitFolder[0],'name':InitFolder[1]};
            OpenFolder(InitFolder[2],InitFolder[3]);
        }
        else
            OpenFolder(InitFolder[0],InitFolder[1]);
    }
    else
    {
       document.getElementById('divLoading').style.display="block";
       __theFormPostData = "";
       WebForm_InitCallback();
       CallServer("cat=-1","cat");
    }
}

var CatColsCount = 3;
var DecalsColsCount = 4;
var CurrPath = new Array();

function CellClick(e)
{
    var info = this.id;
    var args = info.split('_');;
    if (info.indexOf('OpenFolder')>-1)
    {
        var newurl;
        if (CurrPath.length>0)
        {
            newurl = "decals.aspx?cat="+CurrPath[0].id+"&cname="+encodeURIComponent(CurrPath[0].name);
            newurl+="&sub="+args[1]+"&sname="+encodeURIComponent(args[2]);
        }
        else    
            newurl = "decals.aspx?cat="+args[1]+"&cname="+encodeURIComponent(args[2]);
        location.href = newurl;
        //OpenFolder(args[1],args[2]);
    }
    else
        ShowDecal(args[1],args[2]);
}   

function BuildTable(IDs,Names,postfix)
{
    var table = document.getElementById('tableImages');
    var i;
    if (IDs==null)
    {
        table.insertRow(0).insertCell(0).innerHTML = 'Sorry, no decals here :) Please let us know what do you want to see here.';
        return;
    }
    var j;
    var temp;
    var ColsCount;
    var Action;
    if (postfix=='cat') 
    {
        Action = 'OpenFolder';
        ColsCount=CatColsCount;
    }
    else 
    {
        Action = 'ShowDecal';
        ColsCount = DecalsColsCount;
    }
    
    var RowCount = Math.floor((IDs.length - 1) / ColsCount);
    
    var row, cell;
    var tdWidth = 100/ColsCount + "%";
    
    for (i=0; i< RowCount; i++)
    {
         row = table.insertRow(i);
         for (j=0; j<ColsCount;j++)
         {
            cell = row.insertCell(j);
            cell.width = tdWidth;
            
            //cell.style.cursor = "pointer";
            cell.id = "cell_"+IDs[i*ColsCount+j]+"_"+Names[i*ColsCount+j]+"_"+Action;
            cell.onclick = CellClick;
            
            //temp = "<a href='#' onclick='%3%(%0%,\"%2%\");return false'>%2%</a><br/><img src='decals/%0%_%1%' onclick='%3%(%0%,\"%2%\")' onerror='ErrorLoadImg(this)' />";
            temp = "<div class='decalName'>%2%</div><div><img src='decals/%0%_%1%')' onerror='ErrorLoadImg(this)' /></div>";
            temp = temp.replace(/%0%/g,IDs[i*ColsCount+j]);
            temp = temp.replace(/%1%/g,postfix);
            temp = temp.replace(/%2%/g,Names[i*ColsCount+j]);
            temp = temp.replace(/%3%/g,Action);
            if (Action=='ShowDecal') temp+="<a href='#' class='decalLink' onclick='return false'>Click to select size</a>";
            cell.innerHTML = temp;
         }
    }
    var lasti = RowCount;
    row = table.insertRow(lasti);
    for (j=0; j<=(IDs.length-1)%ColsCount; j++)
    {
        cell = row.insertCell(j);
        cell.width = tdWidth;
        
        cell.id = "cell_"+IDs[i*ColsCount+j]+"_"+Names[i*ColsCount+j]+"_"+Action;
        cell.onclick = CellClick;
        
        temp = "<div class='decalName'>%2%</div><div><img src='decals/%0%_%1%')' onerror='ErrorLoadImg(this)' /></div>";
        temp = temp.replace(/%0%/g,IDs[lasti*ColsCount+j]);
        temp = temp.replace(/%1%/g,postfix);
        temp = temp.replace(/%2%/g,Names[i*ColsCount+j]);
        temp = temp.replace(/%3%/g,Action);
        if (Action=='ShowDecal') temp+="<a href='#' class='decalLink' onclick='return false'>Click to select size</a>";
        cell.innerHTML = temp;
    }
}

function OpenFolder(id, name, level)
{
    var table = document.getElementById('tableImages');
    for (i=table.rows.length-1;i>=0;i--)
        table.deleteRow(i);
        
    document.getElementById('divLoading').style.display="block";
    __theFormPostData = "";
    WebForm_InitCallback();
    
    if (level!=undefined)
    {
        CurrPath.length=level+1;
        CurrPath[level]= {'id':id,'name':name};
    }
    else
        CurrPath.push({'id':id,'name':name});
    FormPath();
    if (CurrPath.length==1 || CurrPath.length==0)
    {
        
        CallServer("cat="+id,"cat");
    }
    else
    {
        //location.href = "decals.aspx?cat="+CurrPath[0].id+"&cname="+CurrPath[0].name+"&subcat="+CurrPath[1].id+"&sname="+CurrPath[1].name;
        CallServer("sub="+id,"decthumb");
    }
}

function FormPath()
{
    var node;
    var i;
    var dest = document.getElementById('divPath');
    for (i=dest.childNodes.length-1; i>=0;i--)
    {
        dest.removeChild(dest.childNodes[i]);
    }
    
    node = document.createElement('strong');
    node.innerHTML = "Path: ";
    dest.appendChild(node);
    node = document.createElement("a");
    //node.href = "javascript:OpenFolder(-1,'root',-1)";
    node.href = "decals.aspx";
    node.innerHTML = "Decals";
    dest.appendChild(node);
    
    for (i=0;i<CurrPath.length;i++)
    {
        //node = document.createTextNode('->');
        node = document.createElement('img');
        node.src = 'img/arrow2.gif';
        node.alt = '->';
        dest.appendChild(node);
        node = document.createElement('a');
        //node.href = "javascript:OpenFolder("+CurrPath[i].id+",'"+CurrPath[i].name+"',"+i+")";
        if (i==0)
            node.href = "decals.aspx?cat="+CurrPath[0].id+"&cname="+encodeURIComponent(CurrPath[i].name);
        node.innerHTML = CurrPath[i].name;
        dest.appendChild(node);
    }
    dest.lastChild.removeAttribute('href');
    dest.lastChild.style.textDecoration="none";
    dest.lastChild.style.color="#000";
    dest.lastChild.style.cursor="default";
}

function ErrorLoadImg(image)
{
    //image.style.display = "none";
    var node = document.createElement('h1');
    node.innerHTML = "NO FOTO";
    //image.parentNode.appendChild(node);
    image.parentNode.replaceChild(node,image);
}

function ShowDecal(id, name)
{
    var info = CurrPath[0].id+"&|"+CurrPath[1].id+"||"+CurrPath[0].name+"&|"+CurrPath[1].name;
    //__doPostBack("",info);
    document.location.href="decalsAlt.aspx?decid="+id+"&info="+encodeURIComponent(info);
}

function ReceiveServerData(returnedData,context)
{
    document.getElementById('divLoading').style.display="none";
    if (returnedData!="")
    {
        var temp = returnedData.split('||');
        var IDs,Names;
        IDs = temp[0].split('&|');
        Names = temp[1].split('&|');
        BuildTable(IDs,Names,context);
    }
    else
    {
        BuildTable(null,null,null);
    }
}

function ErrorCallback(message,context)
{
    alert('Error');
}