Skip to content

Instantly share code, notes, and snippets.

/index.html

Created March 29, 2016 21:37
Show Gist options
  • Save anonymous/58cc9a3aadf5f3f310e69d743ffd137c to your computer and use it in GitHub Desktop.
Save anonymous/58cc9a3aadf5f3f310e69d743ffd137c to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source https://jsbin.com/yupomu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>JS Bin</title>
<script src="https://code.createjs.com/easeljs-0.8.2.min.js"></script>
<script>
var image;
var fpstext;
var stage;
function init() {
stage = new createjs.Stage("gameCanvas");
image = new createjs.Bitmap("https://upload.wikimedia.org/wikipedia/commons/thumb/8/89/AquilaPennata.jpg/128px-AquilaPennata.jpg");
stage.addChild(image);
var circle = new createjs.Shape();
circle.graphics.beginFill("red").drawCircle(0, 0, 50);
circle.x = 100;
circle.y = 100;
stage.addChild(circle);
createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick", tick);
fpstext = new createjs.Text("fps:", "20px Arial", "#7a1567");
fpstext.x = 0;
fpstext.y = 20;
stage.addChild(fpstext);
stage.update();
}
function tick() {
image.x += 10;
if (image.x > 600)
image.x = 0;
fpstext.text = Math.round(createjs.Ticker.getMeasuredFPS()) + " fps";
stage.update();
}
</script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
</head>
<body onload="init();">
<canvas id="gameCanvas" width="600" height="600"></canvas>
<script id="jsbin-javascript">
stage
</script>
<script id="jsbin-source-javascript" type="text/javascript">stage
</script></body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment