function popWindow(theURL,winName,winWidth,winHeight,otherFeatures) {
   var x = 0;
   var y = 0;
   x = (screen.availWidth - 12 - winWidth) / 2;
   y = (screen.availHeight - 48 - winHeight) / 2;
   if (otherFeatures != "") {otherFeatures = "," + otherFeatures}
   var features = "screenX=" + x + ",screenY=" + y + ",width=" + winWidth + 
",height=" + winHeight+",top="+y+",left="+x+"'" + otherFeatures
   var NewWindow = window.open(theURL,winName,features);
   NewWindow.focus();
}

function getGender(){
        var genderfield_value = document.getElementById('gendertemp').value;
        return genderfield_value;
}

function setDefaultChar(gender){
        var imageurl = "images/characterselection/";
        var texture = 'M1';
        if ( gender == 'female' ) {
            texture = 'F1';
        }
        var charimage = getCharacterGenderImage(gender,texture);
        document.getElementById('char_img').src = imageurl + charimage;
        setTexture(texture);
}

function setTextureOptions(texturefieldobj){
        var gender = getGender(); 
        var textureoption_div = document.getElementById("char_options_div");
//clean texture list div
        textureoption_div.innerHTML = "";        
//new implementation
//texture options will be an array of images
        if (gender == "male") {

        var opt = "<img src=\"images/characterselection/M1.JPG\" alt=\"icon\" id='s1' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M1');\" onclick=\"setCharacter('M1');setTexture('M1');setBorder('s1');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/M2.JPG\" alt=\"icon\" id='s2' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M2');\" onclick=\"setCharacter('M2');setTexture('M2');setBorder('s2');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/M3.JPG\" alt=\"icon\" id='s3' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M3');\" onclick=\"setCharacter('M3');setTexture('M3');setBorder('s3');\"><br />";
	  opt = opt + "<img src=\"images/characterselection/M4.JPG\" alt=\"icon\" id='s4' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M4');\" onclick=\"setCharacter('M4');setTexture('M4');setBorder('s4');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/M5.JPG\" alt=\"icon\" id='s5' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M5');\" onclick=\"setCharacter('M5');setTexture('M5');setBorder('s5');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/M6.JPG\" alt=\"icon\" id='s6' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M6');\" onclick=\"setCharacter('M6');setTexture('M6');setBorder('s6');\"><br />"
	  opt = opt + "<img src=\"images/characterselection/M7.JPG\" alt=\"icon\" id='s7' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M7');\" onclick=\"setCharacter('M7');setTexture('M7');setBorder('s7');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B1.JPG\" alt=\"icon\" id='s8' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B1');\" onclick=\"setCharacter('B1');setTexture('B1');setBorder('s8');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B2.JPG\" alt=\"icon\" id='s9' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B2');\" onclick=\"setCharacter('B2');setTexture('B2');setBorder('s9');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B3.JPG\" alt=\"icon\" id='s10' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B3');\" onclick=\"setCharacter('B3');setTexture('B3');setBorder('s10');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B4.JPG\" alt=\"icon\" id='s11' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B4');\" onclick=\"setCharacter('B4');setTexture('B4');setBorder('s11');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B5.JPG\" alt=\"icon\" id='s12' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B5');\" onclick=\"setCharacter('B5');setTexture('B5');setBorder('s12');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B6.JPG\" alt=\"icon\" id='s13' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B6');\" onclick=\"setCharacter('B6');setTexture('B6');setBorder('s13');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B7.JPG\" alt=\"icon\" id='s14' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B7');\" onclick=\"setCharacter('B7');setTexture('B7');setBorder('s14');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/B8.JPG\" alt=\"icon\" id='s15' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('B8');\" onclick=\"setCharacter('B8');setTexture('B8');setBorder('s15');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/M8.jpg\" alt=\"icon\" id='s16' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M8');\" onclick=\"setCharacter('M8');setTexture('M8');setBorder('s16');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/M9.jpg\" alt=\"icon\" id='s17' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('M9');\" onclick=\"setCharacter('M9');setTexture('M9');setBorder('s17');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/MA.jpg\" alt=\"icon\" id='s18' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('MA');\" onclick=\"setCharacter('MA');setTexture('MA');setBorder('s18');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/MB.jpg\" alt=\"icon\" id='s19' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('MB');\" onclick=\"setCharacter('MB');setTexture('MB');setBorder('s19');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/MC.jpg\" alt=\"icon\" id='s20' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('MC');\" onclick=\"setCharacter('MC');setTexture('MC');setBorder('s20');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/MD.jpg\" alt=\"icon\" id='s21' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('MD');\" onclick=\"setCharacter('MD');setTexture('MD');setBorder('s21');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/ME.jpg\" alt=\"icon\" id='s22' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('ME');\" onclick=\"setCharacter('ME');setTexture('ME');setBorder('s22');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/MF.jpg\" alt=\"icon\" id='s23' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('MF');\" onclick=\"setCharacter('MF');setTexture('MF');setBorder('s23');\">&nbsp;";

        } else if (gender == "female") {
        var opt = "<img src=\"images/characterselection/F1.JPG\" alt=\"icon\" id='s1' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F1');\" onclick=\"setCharacter('F1');setTexture('F1');setBorder('s1');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/F2.JPG\" alt=\"icon\" id='s2' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F2');\" onclick=\"setCharacter('F2');setTexture('F2');setBorder('s2');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/F3.JPG\" alt=\"icon\" id='s3' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F3');\" onclick=\"setCharacter('F3');setTexture('F3');setBorder('s3');\"><br />";
        opt = opt + "<img src=\"images/characterselection/F4.JPG\" alt=\"icon\" id='s4' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F4');\" onclick=\"setCharacter('F4');setTexture('F4');setBorder('s4');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/F5.JPG\" alt=\"icon\" id='s5' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F5');\" onclick=\"setCharacter('F5');setTexture('F5');setBorder('s5');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/F6.JPG\" alt=\"icon\" id='s6' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F6');\" onclick=\"setCharacter('F6');setTexture('F6');setBorder('s6');\"><br />";
        opt = opt + "<img src=\"images/characterselection/F7.JPG\" alt=\"icon\" id='s7' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F7');\" onclick=\"setCharacter('F7');setTexture('F7');setBorder('s7');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A1.JPG\" alt=\"icon\" id='s8' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A1');\" onclick=\"setCharacter('A1');setTexture('A1');setBorder('s8');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A2.JPG\" alt=\"icon\" id='s9' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A2');\" onclick=\"setCharacter('A2');setTexture('A2');setBorder('s9');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A3.JPG\" alt=\"icon\" id='s10' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A3');\" onclick=\"setCharacter('A3');setTexture('A3');setBorder('s10');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A4.JPG\" alt=\"icon\" id='s11' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A4');\" onclick=\"setCharacter('A4');setTexture('A4');setBorder('s11');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A5.JPG\" alt=\"icon\" id='s12' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A5');\" onclick=\"setCharacter('A5');setTexture('A5');setBorder('s12');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A6.JPG\" alt=\"icon\" id='s13' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A6');\" onclick=\"setCharacter('A6');setTexture('A6');setBorder('s13');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A7.JPG\" alt=\"icon\" id='s14' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A7');\" onclick=\"setCharacter('A7');setTexture('A7');setBorder('s14');\">&nbsp;";
        opt = opt + "<img src=\"images/characterselection/A8.JPG\" alt=\"icon\" id='s15' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('A8');\" onclick=\"setCharacter('A8');setTexture('A8');setBorder('s15');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/F8.jpg\" alt=\"icon\" id='s16' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F8');\" onclick=\"setCharacter('F8');setTexture('F8');setBorder('s16');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/F9.jpg\" alt=\"icon\" id='s17' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('F9');\" onclick=\"setCharacter('F9');setTexture('F9');setBorder('s17');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/FA.jpg\" alt=\"icon\" id='s18' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('FA');\" onclick=\"setCharacter('FA');setTexture('FA');setBorder('s18');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/FB.jpg\" alt=\"icon\" id='s19' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('FB');\" onclick=\"setCharacter('FB');setTexture('FB');setBorder('s19');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/FC.jpg\" alt=\"icon\" id='s20' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('FC');\" onclick=\"setCharacter('FC');setTexture('FC');setBorder('s20');\">&nbsp;";
	  opt = opt + "<img src=\"images/characterselection/FD.jpg\" alt=\"icon\" id='s21' width=\"64px\" height=\"64px\" onmouseover=\"preSetCharacter('FD');\" onclick=\"setCharacter('FD');setTexture('FD');setBorder('s21');\">&nbsp;";
	
        }
        textureoption_div.innerHTML += opt;
}
var LastSelected = 0;
var CharSetFlag = 0;
function setBorder(id){
    var obj = document.getElementById(id);    
    if(document.getElementById(LastSelected)){
        document.getElementById(LastSelected).style.border='0px';
    }
    obj.style.border='1px solid';
    LastSelected = id;
    CharSetFlag = 1;
}

function getCharacterGenderImage(gender,character){
        var image = "";
        var malecharimage = new Array("M1.JPG","M2.JPG","M3.JPG","M4.JPG","M5.JPG","M6.JPG","M7.JPG","B1.JPG","B2.JPG","B3.JPG","B4.JPG","B5.JPG","B6.JPG","B7.JPG","B8.JPG","M8.jpg","M9.jpg","MA.jpg","MB.jpg","MC.jpg","MD.jpg","ME.jpg","MF.jpg");
        var femalecharimage = new Array("F1.JPG","F2.JPG","F3.JPG","F4.JPG","F5.JPG","F6.JPG","F7.JPG","A1.JPG","A2.JPG","A3.JPG","A4.JPG","A5.JPG","A6.JPG","A7.JPG","A8.JPG","F8.jpg","F9.jpg","FA.jpg","FB.jpg","FC.jpg","FD.jpg");
        image = character + '.JPG';
        return image;
}

function setCharacterImage(gender,character){
        var imageurl = "images/characterselection/";
        var charimage = getCharacterGenderImage(gender,character);
        document.getElementById('char_img').src = imageurl + charimage;
}

function setCharacter(texture){
        var gender = getGender(); 
        setCharacterImage(gender,texture);
}
function preSetCharacter(texture){
    if (CharSetFlag == 0){
        setCharacter(texture);
    }
}

function setTexture(texture){
        document.getElementById('character').value = texture;
}

function clearTexture(){
        document.getElementById('character').value = "";
}