mirror of https://github.com/dirtbags/tanks.git
more style & js tweaks
This commit is contained in:
parent
c1f6e765bc
commit
0a8d25cbe1
|
@ -110,18 +110,10 @@ dl {
|
|||
}
|
||||
dt {
|
||||
white-space: pre;
|
||||
background-color: #333;
|
||||
padding: 5px;
|
||||
border: 2px solid green;
|
||||
border-bottom: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd {
|
||||
border: 2px solid green;
|
||||
margin: 0px;
|
||||
padding: 5px;
|
||||
background-color: #282828;
|
||||
margin-left: 2em;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -179,16 +179,6 @@ function Tank(ctx, width, height, color, sensors) {
|
|||
}
|
||||
|
||||
var loop_id;
|
||||
var updateFunc = null;
|
||||
function togglePlayback() {
|
||||
if ($("#playing").prop("checked")) {
|
||||
loop_id = setInterval(updateFunc, 66);
|
||||
} else {
|
||||
clearInterval(loop_id);
|
||||
loop_id = null;
|
||||
}
|
||||
$("#pauselabel").toggleClass("ui-icon-play ui-icon-pause");
|
||||
}
|
||||
|
||||
function start(id, game) {
|
||||
var canvas = document.getElementById(id);
|
||||
|
@ -251,58 +241,11 @@ function start(id, game) {
|
|||
}
|
||||
|
||||
drawFrame(idx);
|
||||
|
||||
$('#seekslider').slider('value', idx);
|
||||
}
|
||||
|
||||
function seekToFrame(newidx) {
|
||||
var idx = frame % (turns.length + 20);
|
||||
if (idx !== newidx) {
|
||||
frame = newidx;
|
||||
drawFrame(newidx);
|
||||
}
|
||||
// make sure we're paused
|
||||
if ($("#playing").prop("checked")) {
|
||||
$("#playing").prop("checked", false);
|
||||
togglePlayback();
|
||||
}
|
||||
}
|
||||
|
||||
updateFunc = update;
|
||||
loop_id = setInterval(update, 66);
|
||||
//loop_id = setInterval(update, 400);
|
||||
if (fps) {
|
||||
setInterval(update_fps, 1000);
|
||||
}
|
||||
|
||||
if (id === "battlefield") {
|
||||
$("#game_box").append('<p><input type="checkbox" checked id="playing" onclick="togglePlayback();"><label for="playing"><span class="ui-icon ui-icon-pause" id="pauselabel"></class></label> <span id="frameid">0</span> <span id="seekslider" style="width: 75%; float: right;"></span></p>');
|
||||
$('#playing').button();
|
||||
var slider = $('#seekslider');
|
||||
slider.slider({ max: turns.length-1, slide: function(event, ui) { seekToFrame(ui.value); } });
|
||||
|
||||
var spacing = 100 / turns.length;
|
||||
var deaths = [];
|
||||
for (i in turns[0]) {
|
||||
deaths.push(false);
|
||||
}
|
||||
var percent = 0;
|
||||
for (var f = 0; f < turns.length; f++) {
|
||||
var turn = turns[f];
|
||||
if (percent < (spacing * f)) {
|
||||
percent = spacing * f;
|
||||
}
|
||||
for (var i = 0; i < turn.length; i++) {
|
||||
if (deaths[i]) { continue; }
|
||||
if (!turn[i] || (turn[i][4] & 4)) {
|
||||
deaths[i] = true;
|
||||
// http://stackoverflow.com/questions/8648963/add-tick-marks-to-jquery-slider
|
||||
$('<span class="ui-slider-tick-mark"></span>').css('left', percent + '%').css('background-color', game[1][i][0]).appendTo(slider);
|
||||
percent++;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue