var catData;
var regData;
var dynaCatBlock;
var lastPostInit = false;

function initJSON() {
    if (regionJSON==null) var regionJSON = '{\"regionId\" : [1,2,3,4,5,6,7,8,9],\"regionName\" : [\"East Anglia\",\"London\",\"Midlands\",\"North East\",\"North West\",\"Scotland\",\"South East\",\"South West\",\"Wales\"]}';

    catData=categoryJSON.evalJSON()
    regData=regionJSON.evalJSON()
}

function initDynaPage(blkN){
    dynaCatBlock = $('catBlock_'+blkN).innerHTML;
}

function initDynaCatLevel1(blkN){
    var idx=0;
    catData.catId.each(function(keyN){
        $('catLevel1Id_'+blkN)[idx+1] = new Option
        $('catLevel1Id_'+blkN)[idx+1].value = keyN;
        $('catLevel1Id_'+blkN)[idx+1].text = catData.catName[idx];
        idx++;
    });
    $('catLevel1Id_'+blkN).selectedIndex = 0;

    if (jsLastPostJSON.catIdLevel1!=null && !lastPostInit) initLastPost();
}

function initLastPost (){
    var cat1Idx = 0;
    lastPostInit = true; // so that this function is not called everytime initDynaCatLevel1 is called
    jsLastPostJSON.catIdLevel1.each(function(cat1N) {
        if (cat1N!='') {
            // Set the Level1 category selection
            var lvl1Id = $('catLevel1Id_'+cat1Idx);

            lvl1Id.value = cat1N;
            var cat1SelIdx = lvl1Id.selectedIndex - 1;
            initDynaCatLevel2(lvl1Id); // get the related form components defined now

            // Set the Region Selection ( can be multile regions )
            var objRegion = $('region_'+cat1Idx);
            var regionValObj = eval('jsLastPostJSON.region_'+cat1Idx);
            regionValObj.each(function(regN){
                for (k=0; k<objRegion.options.length; k++) if(objRegion.options[k].value==regN) objRegion.options[k].selected = true;
            })

            // Set CatId's next ( and while doing that even set the leadCounts ) for current cat1Idx
            for (j=0; j<catData.subCats[cat1SelIdx].length; j++){
                var cat2Idx = $('catLevel2_'+cat1Idx+j);
                jsLastPostJSON.cat_id.each(function(cat2ChkN) {
                    if (cat2Idx.value==cat2ChkN) {
                        cat2Idx.checked = true;
                        $('lead'+cat2ChkN+'_'+cat1Idx).value = eval('jsLastPostJSON.lead'+cat2ChkN)
                    }
                })
            }
    }
    cat1Idx++;
    });
}

function allCatsAct(blkN, cnt){
    for (j=0; j<cnt; j++){
        $('catLevel2_'+blkN+j).checked = ($('catSelect_'+blkN).checked);
        var leadObj = $('lead'+$('catLevel2_'+blkN+j).value+'_'+blkN);
        if ($('catLevel2_'+blkN+j).checked && leadObj.value=='') leadObj.selectedIndex=1;
        if (!$('catLevel2_'+blkN+j).checked) leadObj.selectedIndex = 0
    }
}

function setlead(idN, blkN) {
    var arrLeadCount = document.getElementsByName('lead'+idN.value)
    var varLeadCount = arrLeadCount[0];
    if (idN.checked && varLeadCount.value=='') varLeadCount.selectedIndex=1;
    if (!idN.checked) varLeadCount.selectedIndex = 0
}

function initDynaCatLevel2(idN){
    var Arr_strSplit = idN.id.split('_')

    showRegData(Arr_strSplit[1]);

    var idx = idN.selectedIndex-1;
    var txtLevel2 = '';
    var blkLeadPrice = '';
    var blkLeadCount = '';
    if (idx>=0) {
        var blkSelectAll = '<input type="checkbox" id="catSelect_'+Arr_strSplit[1]+'" name="catSelectAll_'+Arr_strSplit[1]+'" value="" onClick="allCatsAct('+Arr_strSplit[1]+','+catData.subCats[idx].length+');"><span class="arial11BUEA6C00">Select / Deselect all SubCategories</span>';

        for (j=0; j<catData.subCats[idx].length; j++){
            txtLevel2 = txtLevel2 +'<input type="checkbox" name="cat_id[]" value="'+catData.subCats[idx][j].subCatId+'" id="catLevel2_'+Arr_strSplit[1]+j+'" onClick="setlead(this);">&nbsp;' + catData.subCats[idx][j].subCatName+"\n"+'<input type="hidden" name="hidRegion'+catData.subCats[idx][j].subCatId+'" value="" id="region'+catData.subCats[idx][j].subCatId+'">'+"<br>\n";

            blkLeadPrice = blkLeadPrice + showLeadPrice(Arr_strSplit[1], idx, j, catData.subCats[idx][j].subCatId) + "<br>";

            blkLeadCount = blkLeadCount + showLeadCount(Arr_strSplit[1], idx, j, catData.subCats[idx][j].subCatId) + "<br>";
        }
    } else {
        txtLevel2 = txtLevel2 + '&nbsp;'
        var blkSelectAll = '&nbsp;'
    }

    $('catLevel2Id_'+Arr_strSplit[1]).innerHTML = txtLevel2;
    $('catLeadPrice_'+Arr_strSplit[1]).innerHTML =  blkLeadPrice;
    var leadSelTD = "                <TD id='catLeadCount_"+Arr_strSplit[1]+"' width='12%' valign='TOP' align='center'>" + blkLeadCount+"</TD>";
    $('catLeadCount_'+Arr_strSplit[1]).replace(leadSelTD);
    $('catSelectAll_'+Arr_strSplit[1]).innerHTML =  blkSelectAll;

    nextBlock(idN);
}

function nextBlock(idN) {
    var Arr_strSplit = idN.id.split('_')
    var nextId = parseInt(Arr_strSplit[1])+1;
    var PTRN_REPLACE = /\_\d/g;

    var catLvl1 = $('catLevel1Id_'+Arr_strSplit[1]).value
    var catLvl2 = idN.value
    var catLvl1Idx = $('catLevel1Id_'+Arr_strSplit[1]).selectedIndex-1
    var catLvl2Idx = idN.selectedIndex-1

    // To create a new Block only if it does not exist!
    if ( (nextId < 10) && ($('catBlock_'+nextId)==null) ) {
        dynaCatBlock = dynaCatBlock.replace(PTRN_REPLACE, "_"+nextId)

        nextCatBlock = "<DIV id='catBlock_"+nextId+"'>"+dynaCatBlock+"</DIV><DIV id='catBlockNext'></DIV>";
        $('catBlockNext').replace(nextCatBlock);
        initDynaCatLevel1(nextId)
    }
}

function showRegData(blkN) {
    var idx=0;
    var regOpts = '';

    regData.regionId.each(function(keyN){
        regOpts += '<option value=' +regData.regionId[idx]+' SELECTED>'+regData.regionName[idx] +'</option>';
        idx++
    });
    regSelTD = "                <TD id='catRegion_"+blkN+"' width='10%' valign='TOP' rowspan='2' "+hideRegion+"><select MULTIPLE size='3' name='region_"+blkN+"[]' class='arial11R666666' id='region_"+blkN+"'>\n"+regOpts+"\n                </TD>";
    $('catRegion_'+blkN).replace(regSelTD)
}

function showLeadPrice (blkN, idx1, idx2, catN) {
    return '&pound;&nbsp;' + catData.subCats[idx1][idx2].subCatLeadPrice.toFixed(2);
}

function showLeadCount (blkN, idx1, idx2, catN) {
    var leadOpts = "<option value=''>---</option>";
    var j = 0;
    for (j=1; j>=0; j++){
        leadOpts += '<option value='+j*maxLeadStep+'>' + j*maxLeadStep +'</option>';
        if ((j+1)*maxLeadStep>maxLeadCount) break;
    }

    leadSel = "<select name='lead"+catN+"' class='arial11R666666' id='lead"+catN+"_"+blkN+"'>"+leadOpts+"</select>";
    return leadSel;
}

function showCatData(blkN, idx1, idx2, catN) {
    var idx=0;
    var regOpts = '';
    regData.regionId.each(function(keyN){
        regOpts += '<option value=' +regData.regionId[idx]+'>' + regData.regionName[idx] +'</option>';
        idx++
    });
    regSelTD = "                <TD id='catRegion_"+blkN+"' width='13%' valign='TOP'><select MULTIPLE size='3' name='region"+catN+"[]' class='arial11R666666' id='region_"+blkN+"'>\n"+regOpts+"\n                </TD>";
    $('catRegion_'+blkN).replace(regSelTD)

    // For Lead Option List
    var leadOpts = '';
    $R(1, 20).each(function(value) {
        leadOpts += '<option value='+value*10+'>' + value*10 +'</option>';
    });
    leadSelTD = "                <TD id='catLeadCount_"+blkN+"' width='14%' valign='TOP' align='center'><select name='lead"+catN+"' class='arial11R666666' id='lead_"+blkN+"'>"+leadOpts+"</TD>";
    $('catLeadCount_'+blkN).replace(leadSelTD)

    // for the Lead & Click prices
    $('catLeadPrice_'+blkN).innerHTML = '&pound;&nbsp;' + catData.subCats[idx1][idx2].subCatLeadPrice.toFixed(2)
}