var selectModel     = '<select name="modellen"><option selected="selected" value="">Kies model</option><option value="1-serie">1-serie</option><option value="3-serie">3-serie</option><option value="5-serie">5-serie</option><option value="5-serie+Gran+Turismo">5-serie Gran Turismo</option><option value="6-serie">6-serie</option><option value="7-serie">7-serie</option><option value="8-serie">8-serie</option><option value="M3">M3</option><option value="M5">M5</option><option value="M6">M6</option><option value="X1">X1</option><option value="X3">X3</option><option value="X5">X5</option><option value="X6">X6</option><option value="Z1">Z1</option><option value="Z3">Z3</option><option value="Z4">Z4</option><option value="Z8">Z8</option></select>';
var classicDatumList= '<option value="2011">2011</option><option value="2010">2010</option><option value="2009">2009</option><option value="2008">2008</option><option value="2007">2007</option><option value="2006">2006</option><option value="2005">2005</option><option value="2004">2004</option><option value="2003">2003</option><option value="2002">2002</option><option value="2001">2001</option><option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1979">1979</option><option value="1978">1978</option><option value="1977">1977</option><option value="1976">1976</option><option value="1975">1975</option><option value="1974">1974</option><option value="1973">1973</option><option value="1972">1972</option><option value="1971">1971</option><option value="1970">1970</option><option value="1969">1969</option><option value="1968">1968</option><option value="1967">1967</option><option value="1966">1966</option><option value="1965">1965</option><option value="1964">1964</option><option value="1963">1963</option><option value="1962">1962</option><option value="1961">1961</option><option value="1960">1960</option><option value="1959">1959</option><option value="1958">1958</option><option value="1957">1957</option><option value="1956">1956</option><option value="1955">1955</option><option value="1954">1954</option><option value="1953">1953</option><option value="1952">1952</option><option value="1951">1951</option><option value="1950">1950</option><option value="1940">1940</option><option value="1930">1930</option><option value="1920">1920</option><option value="1910">1910</option><option value="1900">1900</option>';
var shortDatumList  = '<option value="2011">2011</option><option value="2010">2010</option><option value="2009">2009</option><option value="2008">2008</option><option value="2007">2007</option><option value="2006">2006</option><option value="2005">2005</option><option value="2004">2004</option><option value="2003">2003</option><option value="2002">2002</option><option value="2001">2001</option><option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1970">1970</option><option value="1960">1960</option>';
var optionPrijs     = '<option value="500">&euro; 500</option><option value="1000">&euro; 1000</option><option value="2000">&euro; 2000</option><option value="3000">&euro; 3000</option><option value="4000">&euro; 4000</option><option value="5000">&euro; 5000</option><option value="6000">&euro; 6000</option><option value="7000">&euro; 7000</option><option value="8000">&euro; 8000</option><option value="9000">&euro; 9000</option><option value="10000">&euro; 10000</option><option value="11000">&euro; 11000</option><option value="12000">&euro; 12000</option><option value="13000">&euro; 13000</option><option value="14000">&euro; 14000</option><option value="15000">&euro; 15000</option><option value="17500">&euro; 17500</option><option value="20000">&euro; 20000</option><option value="22500">&euro; 22500</option><option value="25000">&euro; 25000</option><option value="27500">&euro; 27500</option><option value="30000">&euro; 30000</option><option value="35000">&euro; 35000</option><option value="40000">&euro; 40000</option><option value="45000">&euro; 45000</option><option value="50000">&euro; 50000</option><option value="60000">&euro; 60000</option><option value="70000">&euro; 70000</option><option value="80000">&euro; 80000</option><option value="90000">&euro; 90000</option><option value="100000">&euro; 100000</option>';
var selectTotPrijs  = '<select name="totPrijs" id="totPrijs"><option value="">t/m</option><option value="500">&euro; 500</option><option value="1000">&euro; 1000</option><option value="2000">&euro; 2000</option><option value="3000">&euro; 3000</option><option value="4000">&euro; 4000</option><option value="5000">&euro; 5000</option><option value="6000">&euro; 6000</option><option value="7000">&euro; 7000</option><option value="8000">&euro; 8000</option><option value="9000">&euro; 9000</option><option value="10000">&euro; 10000</option><option value="11000">&euro; 11000</option><option value="12000">&euro; 12000</option><option value="13000">&euro; 13000</option><option value="14000">&euro; 14000</option><option value="15000">&euro; 15000</option><option value="17500">&euro; 17500</option><option value="20000">&euro; 20000</option><option value="22500">&euro; 22500</option><option value="25000">&euro; 25000</option><option value="27500">&euro; 27500</option><option value="30000">&euro; 30000</option><option value="35000">&euro; 35000</option><option value="40000">&euro; 40000</option><option value="45000">&euro; 45000</option><option value="50000">&euro; 50000</option><option value="60000">&euro; 60000</option><option value="70000">&euro; 70000</option><option value="80000">&euro; 80000</option><option value="90000">&euro; 90000</option><option value="100000">&euro; 100000</option></select>';
var selectVanCyl    = '<select onchange="javascript:updateMaxBox(\'vanCilinderInhoud\',\'totCilinderInhoud\');" name="vanCilinderInhoud" id="vanCilinderInhoud"><option value="">van</option><option value="75">125 cc</option><option value="200">250 cc</option><option value="450">500 cc</option><option value="550">600 cc</option><option value="700">750 cc</option><option value="850">900 cc</option><option value="950">1000 cc</option><option value="1050">1100 cc</option><option value="1150">1200 cc</option><option value="1250">1300 cc</option><option value="1550">1600 cc</option></select>';
var selectTotCyl    = '<select onchange="javascript:updateMinBox(\'totCilinderInhoud\',\'vanCilinderInhoud\');" name="totCilinderInhoud" id="totCilinderInhoud"><option value="">t/m</option><option value="175">125 cc</option><option value="300">250 cc</option><option value="550">500 cc</option><option value="650">600 cc</option><option value="800">750 cc</option><option value="950">900 cc</option><option value="1050">1000 cc</option><option value="1250">1200 cc</option><option value="1350">1300 cc</option><option value="1650">1600 cc</option></select>';
var selectKmStand   = '<select name="totKmStand" id="totKmStand"><option value="0">t/m</option><option value="5000">5.000</option><option value="10000">10.000</option><option value="20000">20.000</option><option value="30000">30.000</option><option value="40000">40.000</option><option value="50000">50.000</option><option value="60000">60.000</option><option value="70000">70.000</option><option value="80000">80.000</option><option value="90000">90.000</option><option value="100000">100.000</option><option value="110000">110.000</option><option value="120000">120.000</option><option value="140000">140.000</option><option value="160000">160.000</option><option value="180000">180.000</option><option value="200000">200.000</option><option value="250000">250.000</option><option value="300000">300.000</option></select>';
var selectAfstand   = '<select name="afstand" id="afstand"><option value="0">Landelijk</option><option value="1">1 km</option><option value="20">20 km</option><option value="40">40 km</option><option value="60">60 km</option><option value="80">80 km</option><option value="100">100 km</option><option value="120">120 km</option><option value="140">140 km</option><option value="160">160 km</option><option value="180">180 km</option><option value="200">200 km</option></select>';

var formContent     = '';

function addSubmitBlock()
{
    formContent += '<fieldset class="last">\n';
    formContent += '    <label class="narrow" for="postcode"><span>Postcode</span>\n';
    formContent += '        <input maxlength="7" value="" id="postcode" name="postcode" type="text" />\n';
    formContent += '    </label>\n';
    formContent += '    <label class="narrow" for="afstand"><span>Afstand</span>\n';
    formContent += '        '+selectAfstand+'\n';
    formContent += '    </label>';
    formContent += '    <button type="submit">BMW Zoeken</button>\n';
    formContent += '</fieldset>\n';
}

function addKmBlock()
{
    formContent += '    <label class="narrow"><span>Km t/m</span>\n';
    formContent += '            '+selectKmStand;
    formContent += '    </label>\n';    
}

function addTotPrijs()
{
    formContent += '    <label class="narrow" for="maxprice"><span>Prijs t/m</span>\n';
    formContent += '        ' + selectTotPrijs + '\n';
    formContent += '    </label>\n';
}

function autoContent() 
{
    formContent     = '';
    
    formContent += '<fieldset>\n'; 
    formContent += '    <label class="wide" for="occasionmodel"><span>Model</span><span>\n';
    formContent += '        '+ selectModel + '\n';
    formContent += '    </span></label>\n';
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow" for="trefwoord"><span>Trefwoord</span>\n';
    formContent += '        <input maxlength="50" id="trefwoord" name="trefwoord" type="text"/>\n';
    formContent += '    </label>\n';
    addTotPrijs();
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow"><span>Bouwjaar vanaf</span>\n';
    formContent += '        <select name="vanBouwjaar" id="vanBouwjaar">\n';
    formContent += '            <option value="">van</option>' + shortDatumList + '\n';
    formContent += '        </select>\n';
    formContent += '    </label>\n';
    addKmBlock();
    formContent += '</fieldset>\n'; 
    
    addSubmitBlock();   
} 

function classicContent() 
{
    formContent     = '';
    
    formContent += '<fieldset>\n';
    formContent += '    <label class="wide" for="trefwoord"><span>Trefwoord</span>\n';
    formContent += '        <input maxlength="50" id="trefwoord" name="trefwoord" type="text"/>\n';
    formContent += '    </label>\n';
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    addTotPrijs();
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow"><span>Bouwjaar vanaf</span>\n'; 
    formContent += '        <select onchange="javascript:updateMaxBox(\'vanBouwjaar\',\'totBouwjaar\');" name="vanBouwjaar" id="vanBouwjaar">\n';
    formContent += '            <option value="">van</option>' + classicDatumList + '\n';
    formContent += '        </select>\n';
    formContent += '    </label>\n';

    formContent += '    <label class="narrow"><span>Bouwjaar t/m</span>\n';
    formContent += '        <select onchange="javascript:updateMinBox(\'totBouwjaar\',\'vanBouwjaar\');" name="totBouwjaar" id="totBouwjaar">\n';
    formContent += '            <option value="">t/m</option>' + classicDatumList + '\n';
    formContent += '        </select>\n';
    formContent += '    </label>\n';
    formContent += '</fieldset>\n';

    addSubmitBlock();
}

function motorContent() 
{
    formContent     = '';
    
    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow" for="trefwoord"><span>Model, trefwoord</span>\n';
    formContent += '        <input maxlength="50" id="trefwoord" name="trefwoord" type="text"/>\n';
    formContent += '    </label>\n';

    addTotPrijs();
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow"><span>Inhoud vanaf</span>\n';
    formContent += '        ' + selectVanCyl + '\n';
    formContent += '    </label>\n';

    formContent += '    <label class="narrow"><span>Cilinderinhoud t/m</span>\n';
    formContent += '        ' + selectTotCyl + '\n';
    formContent += '    </label>\n';
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    formContent += '    <label class="narrow"><span>Bouwjaar vanaf</span>\n';
    formContent += '        <select onchange="javascript:updateMaxBox(\'vanBouwjaar\',\'totBouwjaar\');" name="vanBouwjaar" id="vanBouwjaar">\n';
    formContent += '            <option value="">van</option>' + shortDatumList + '\n';
    formContent += '        </select>\n';
    formContent += '    </label>\n';

    formContent += '    <label class="narrow"><span>Bouwjaar t/m</span>\n';        
    formContent += '        <select onchange="javascript:updateMinBox(\'totBouwjaar\',\'vanBouwjaar\');" name="totBouwjaar" id="totBouwjaar">\n';
    formContent += '            <option value="">t/m</option>' + shortDatumList + '\n';
    formContent += '        </select>\n';
    formContent += '    </label>\n';
    formContent += '</fieldset>\n';

    formContent += '<fieldset>\n';
    addKmBlock();
    formContent += '</fieldset>\n';

    addSubmitBlock();
}



function search_cat_change(category)
{
       
    if(category == 'motor') {
        motorContent();
        document.getElementById('formContent').innerHTML = formContent;
        
        document.getElementById('link_motor').setAttribute ('class','selected');
        document.getElementById('link_classic').setAttribute ('class','Xselected'); 
        document.getElementById('link_auto').setAttribute ('class','Xselected');
        // for ie
        document.getElementById('link_motor').setAttribute ('className','selected');
        document.getElementById('link_classic').setAttribute ('className','Xselected'); 
        document.getElementById('link_auto').setAttribute ('className','Xselected'); 
        document.getElementById('trader_logo_id').src='images/layout/trader/logo-autotrader-print-motor.png';
        document.getElementById('trader_logo_link').href='http://www.autotrader.nl/index.htm';  
        document.getElementById('occasionzoeken').action = 'http://www.autotrader.nl/motor/kopen/zoekresultaten.htm'; 
        
    }
    if(category == 'classic') {
        classicContent();
        document.getElementById('formContent').innerHTML = formContent;
        
        document.getElementById('link_motor').setAttribute ('class','Xselected'); 
        document.getElementById('link_classic').setAttribute ('class','selected'); 
        document.getElementById('link_auto').setAttribute ('class','Xselected');
        //for ie
        document.getElementById('link_motor').setAttribute ('className','Xselected'); 
        document.getElementById('link_classic').setAttribute ('className','selected'); 
        document.getElementById('link_auto').setAttribute ('className','Xselected'); 
        document.getElementById('trader_logo_id').src='images/layout/trader/logo-autotrader-print-klassieker.png';                   
        document.getElementById('trader_logo_link').href='http://www.autotrader.nl/klassieker/index.htm';
        document.getElementById('occasionzoeken').action = 'http://www.autotrader.nl/klassieker/kopen/zoekresultaten.htm';  
        searchCategory = 'classic';
    }
    if(category == 'auto') {
        autoContent();
        document.getElementById('formContent').innerHTML = formContent;
        
        document.getElementById('link_motor').setAttribute ('class','Xselected'); 
        document.getElementById('link_classic').setAttribute ('class','Xselected'); 
        document.getElementById('link_auto').setAttribute ('class','selected'); 
        //for ie
        document.getElementById('link_motor').setAttribute ('className','Xselected'); 
        document.getElementById('link_classic').setAttribute ('className','Xselected'); 
        document.getElementById('link_auto').setAttribute ('className','selected'); 
        document.getElementById('trader_logo_id').src='images/layout/trader/logo-autotrader-print-auto.png';                  
        document.getElementById('trader_logo_link').href='http://www.autotrader.nl/motor/index.htm';
        document.getElementById('occasionzoeken').action = 'http://www.autotrader.nl/auto/kopen/zoekresultaten.htm'; 
        searchCategory = 'auto';
    }        
} 

function updateMaxBox(optionElement,targetElement) {
    var elem1 = document.getElementById(optionElement);
    var elem2 = document.getElementById(targetElement);
        
    if (parseInt(elem1.value) > parseInt(elem2.value)) {
        elem2.value='';
    }
    
}
function updateMinBox(optionElement,targetElement) {
    var elem1 = document.getElementById(optionElement);
    var elem2 = document.getElementById(targetElement);
    
    if (parseInt(elem1.value) < parseInt(elem2.value)) {
        elem2.value='';
    }
    
}
