Examples - Add Dirty Flag Rendering
This commit is contained in:
parent
fbb3e01b4a
commit
8284e82dcf
4 changed files with 65 additions and 7 deletions
|
@ -11,7 +11,7 @@ class Game {
|
||||||
|
|
||||||
double _oscill = 0.1;
|
double _oscill = 0.1;
|
||||||
bool _oscillDir = true; // oscillate upwards (true) or downwards (false)
|
bool _oscillDir = true; // oscillate upwards (true) or downwards (false)
|
||||||
double _OSCILLSPEED = 0.05;
|
double _OSCILLSPEED = 0.1;
|
||||||
bool _fwd = true;
|
bool _fwd = true;
|
||||||
|
|
||||||
Game(CanvasElement this.canvas) {
|
Game(CanvasElement this.canvas) {
|
||||||
|
|
57
lib/src/05_DirtyFlagRendering.dart
Normal file
57
lib/src/05_DirtyFlagRendering.dart
Normal file
|
@ -0,0 +1,57 @@
|
||||||
|
import 'dart:html';
|
||||||
|
|
||||||
|
import 'package:browserloop/game/Game.dart';
|
||||||
|
import 'package:browserloop/game/LoopExample.dart';
|
||||||
|
|
||||||
|
class DirtyFlagRender implements LoopExample {
|
||||||
|
static final double MS_PER_UPDATE = 1000.0;
|
||||||
|
static final double SAFE_GUARD = 500.0;
|
||||||
|
Stopwatch elapsed = new Stopwatch();
|
||||||
|
double lag = 0.0;
|
||||||
|
Game game;
|
||||||
|
num id;
|
||||||
|
bool dirty = true;
|
||||||
|
|
||||||
|
DirtyFlagRender(this.game) {
|
||||||
|
elapsed.start();
|
||||||
|
window.requestAnimationFrame(eventloop);
|
||||||
|
}
|
||||||
|
|
||||||
|
void eventloop(num time) {
|
||||||
|
lag += elapsed.elapsedMilliseconds;
|
||||||
|
elapsed.reset();
|
||||||
|
|
||||||
|
while (lag >= MS_PER_UPDATE && elapsed.elapsedMilliseconds < SAFE_GUARD) {
|
||||||
|
update();
|
||||||
|
lag -= MS_PER_UPDATE;
|
||||||
|
}
|
||||||
|
if(dirty) render(lag / MS_PER_UPDATE);
|
||||||
|
id = window.requestAnimationFrame(eventloop);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
void update() {
|
||||||
|
game.update();
|
||||||
|
// This is for demonstration purposes. It will set the dirty flag once every
|
||||||
|
// update. Usually should be set this deeper in the individual logic units
|
||||||
|
// where a change happens and moved through the program from there.
|
||||||
|
dirty = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
void render(double interp) {
|
||||||
|
game.draw(interp);
|
||||||
|
dirty = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Starting and stopping the loop for the example page
|
||||||
|
void stop() {
|
||||||
|
elapsed.stop();
|
||||||
|
window.cancelAnimationFrame(id);
|
||||||
|
}
|
||||||
|
|
||||||
|
void start() {
|
||||||
|
elapsed.start();
|
||||||
|
elapsed.reset();
|
||||||
|
window.requestAnimationFrame(eventloop);
|
||||||
|
}
|
||||||
|
}
|
|
@ -14,11 +14,7 @@
|
||||||
<div id="while_loop"></div>
|
<div id="while_loop"></div>
|
||||||
<div id="variable_timestep"></div>
|
<div id="variable_timestep"></div>
|
||||||
<div id="fixed_variable"></div>
|
<div id="fixed_variable"></div>
|
||||||
<!--<button id="basic_start">start</button>-->
|
<div id="dirty_flag"></div>
|
||||||
<!--<button id="basic_stop">stop</button>-->
|
|
||||||
<!--<button id="basic_reset">reset</button>-->
|
|
||||||
<!--<button id="basic_plus">+</button>-->
|
|
||||||
<!--<button id="basic_minus">-</button>-->
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -4,11 +4,13 @@ import 'package:browserloop/game/LoopExample.dart';
|
||||||
import 'package:browserloop/src/03-VariableTimestep.dart';
|
import 'package:browserloop/src/03-VariableTimestep.dart';
|
||||||
import 'package:browserloop/src/04-FixedLoopVariableRender.dart';
|
import 'package:browserloop/src/04-FixedLoopVariableRender.dart';
|
||||||
import 'package:browserloop/src/02-AnimationFrameWhile.dart';
|
import 'package:browserloop/src/02-AnimationFrameWhile.dart';
|
||||||
|
import 'package:browserloop/src/05_DirtyFlagRendering.dart';
|
||||||
|
|
||||||
List<Example> examples = [
|
List<Example> examples = [
|
||||||
Example("While Loop Example", "#while_loop"),
|
Example("While Loop Example", "#while_loop"),
|
||||||
Example("Fixed Update, Variable Render", "#fixed_variable"),
|
Example("Fixed Update, Variable Render", "#fixed_variable"),
|
||||||
Example("Variable Timestep", "#variable_timestep")
|
Example("Variable Timestep", "#variable_timestep"),
|
||||||
|
Example("Variable Render with Dirty Flag", "#dirty_flag")
|
||||||
];
|
];
|
||||||
LoopExample active;
|
LoopExample active;
|
||||||
|
|
||||||
|
@ -91,6 +93,9 @@ void activate(MouseEvent e) {
|
||||||
case "#variable_timestep":
|
case "#variable_timestep":
|
||||||
ex.loop = new VariableTimestep(new Game(ex.canvas));
|
ex.loop = new VariableTimestep(new Game(ex.canvas));
|
||||||
break;
|
break;
|
||||||
|
case "#dirty_flag":
|
||||||
|
ex.loop = new DirtyFlagRender(new Game(ex.canvas));
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
if (ex.canvas != ex.loop.game.canvas) ex.loop.game.canvas = ex.canvas;
|
if (ex.canvas != ex.loop.game.canvas) ex.loop.game.canvas = ex.canvas;
|
||||||
querySelector(ex.query).append(new ButtonElement()
|
querySelector(ex.query).append(new ButtonElement()
|
||||||
|
|
Loading…
Reference in a new issue