CSS looks quite good now.

This commit is contained in:
Oliver Rümpelein 2014-10-07 11:57:12 +02:00
parent c9dab55c5b
commit 689cd3855f
4 changed files with 44 additions and 21 deletions

View file

@ -9,33 +9,36 @@ body {
body>div {
postion:relative;
background: rgba(163,128,95,0.9);
/* align: center;
text-align: center;*/
border-radius: 20px;
padding: 5px;
padding: 5px 10px 5px 10px;
width:
}
h1 {
align: center;
text-align: center;
margin-top: 10px;
}
#game {
width:auto;
margin: 20px auto;
margin: 0px 20px 0px 0px;
border: #692200 4px solid ;
border-radius: 4px;
float:left;
}
#output {
position:relative;
left: 20px;
width: 350px;
}
#ui {
position: relative;
right: 200px;
width: 350px;
bottom: 20px;
right: 30px;
}
#load {
margin: 0px auto;
}
#clear {
clear: both;
}

View file

@ -8,12 +8,15 @@
<body>
<div>
<h1>JSDSH - Javascript Dungeonslayers Helper</h1>
<div id="game"></div>
<button id="load">Load</button>
<div id="output"></div>
<div id="ui"></div>
<div id="clear"></div>
<div id="output"></div>
<button id="load">Load</button>
</div>
<script type="text/javascript" src="lib/crafty.js"></script>
<script type="text/javascript" src="lib/jquery-1.11.1.min.js"></script>

View file

@ -1,3 +1,13 @@
$(document).ready( function() {
$('#load').click(function() { $.getScript("/assets/adv01/adv_01.js"); $('#load').hide();});
$('#game').hide();
$('#ui').hide();
$('#output').hide();
$('#load').click(function() {
$.getScript("/assets/adv01/adv_01.js");
$('#load').hide();
$('#game').show();
$('#ui').show();
$('#output').show();
});
});

View file

@ -70,6 +70,10 @@
// Helper-Funcs
var clearoutput = function() {
$('#output').empty();
};
var clearui = function() {
$('#output').empty();
$('#ui').empty();
@ -129,7 +133,7 @@
},
attack: function(enem) {
clearui();
clearoutput();
var output=$('#output');
output.html(this.info.cname+" greift "+enem.info.cname+" an!<br>");
var attack_val = dice(this.battle[this.att]);
@ -189,7 +193,7 @@
},
sel_att: function() {
var outstr="";
var outstr="<p>";
outstr += "Angriffstyp?<br>";
outstr += "<select id='att'>";
outstr += "<option value='melee' id='melee'>Melee (" + this.battle["melee"] + ")</option>";
@ -202,6 +206,7 @@
outstr += "<select id='defendible'>";
outstr += "<option value=true selected=true>Ja</option>";
outstr += "<option value=false>Nein</option>";
outstr += "</p>";
$('#ui').html(outstr);
$('#att').bind("change", function() {cur_sel.att=this.value;});
@ -231,12 +236,13 @@
this.battle.shoot_chant = this.battle.chant + this.extern.chant - this.extern.armor;
},
printoutput: function() {
outstr = "";
outstr = "<p>";
outstr += this.info.cname + " (gespielt von "+this.info.pname +")<br>";
outstr += "Greift derzeit durch " + this.att + " mit einer Stärke von "
+ this.battle[this.att] + " an.<br>";
outstr += "Verteidigungsstärke: " + this.battle.defense + "<br>";
outstr += "Kraftpunkte: " + this.life;
outstr += "</p>";
$('#output').html(outstr);
}
});
@ -255,13 +261,14 @@
this.enem = true;
},
printoutput: function() {
clearui();
outstr = "";
clearoutput();
outstr = "<p>";
outstr += "Ein "+ this.info.race + "<br>";
outstr += "Greift derzeit durch " + this.att + " mit einer Stärke von "
+ this.battle[this.att] + " an.<br>";
outstr += "Verteidigungsstärke: " + this.battle.defense + "<br>";
outstr += "Kraftpunkte: " + this.life;
outstr += "</p>";
$('#output').html(outstr);
}
});