CSS on players bots

To do next: condtionals show hide elems
This commit is contained in:
Gnieark 2017-02-09 19:24:18 +01:00
parent aabde97ec5
commit b629a4755d
2 changed files with 19 additions and 18 deletions

View File

@ -99,8 +99,7 @@ form label {
margin-right: 20px; margin-right: 20px;
vertical-align: top; vertical-align: top;
text-align: right; text-align: right;
}
}
pre{ pre{
font-style: normal; font-style: normal;
font-size: 16px; font-size: 16px;
@ -116,5 +115,4 @@ pre{
.hidden{display:none;} .hidden{display:none;}
@media screen and (max-width: 800px){ @media screen and (max-width: 800px){
aside, article{display: block; width: 100%; border-right:none;} aside, article{display: block; width: 100%; border-right:none;}
} }

View File

@ -24,14 +24,10 @@ footer a {margin:0px 15px 0px 15px; color: #666;text-decoration: none; font-weig
section{margin: 0 auto; width: 90%;} section{margin: 0 auto; width: 90%;}
article{float: right; width:70%;} article{float: right; width:70%;}
aside{float:left;width:29%;} aside{float:left;width:29%;}
.playerBox{} .playerBox{ }
.playerBox em {width: 100%;} .playerBox em {display: block; width: 100%;}
.playerBox em label { width: 40%; text-align: right;} .playerBox em label {text-overflow: hidden; display: inline-block; width: 30%; margin-right: 20px; vertical-align: top; text-align: right;}
.playerBox em input,.playerBox em input, .playerBox em select {width:59%; float:right;} .playerBox em input, .playerBox em select {box-sizing: border-box; width: 59%; padding: 4px; vertical-align: top; }
.hidden{display: none;} .hidden{display: none;}
#logs{font-size: 70%;} #logs{font-size: 70%;}
@ -63,13 +59,12 @@ function changeRandom(index,newValue){
document.getElementById("posX" + index).className = ""; document.getElementById("posX" + index).className = "";
document.getElementById("posY" + index).className = ""; document.getElementById("posY" + index).className = "";
} }
} }
function changeTypePlayer(index,newValue){ function changeTypePlayer(index,newValue){
if (newValue == "Human") document.getElementById("botUrl" + index).className = "hidden"; alert("botUrl" + index);
else document.getElementById("botUrl" + index).className = ""; if (newValue == "Human") document.getElementById("botUrl" + index).class = "hidden";
else document.getElementById("botUrl" + index).class = "";
} }
function createElemWithLabel(type,attributes,labelTxt, id =''){ function createElemWithLabel(type,attributes,labelTxt, id =''){
@ -147,10 +142,11 @@ function createPlayerForm(index){
createElemWithLabel( createElemWithLabel(
'input', 'input',
{ {
"id":"botUrl" + index, "type": "text", "value":"", "type": "text", "value":"",
"placeholder":"http://Bot.url" "placeholder":"http://Bot.url"
}, },
'URL du Bot' 'URL du Bot',
'botUrl' + index
) )
); );
@ -180,7 +176,14 @@ function createPlayerForm(index){
'Y coord:' 'Y coord:'
) )
); );
var but = createElem('input',
{
'type':'button',
'value':'Add this player',
'onclick':'createPlayerForm(\'' + (parseFloat(index) + 1) + '\');'
}
);
divForm.appendChild(but);
container.appendChild(divForm); container.appendChild(divForm);
} }