jcuts
Version:
52 lines (48 loc) • 1.16 kB
HTML
<html>
<head>
<title>jcuts.js examples</title>
<script src="../src/jcuts.js"></script>
<script src="../bower_components/jmaths/jmaths.js"></script>
<script src="../bower_components/jpaths/jpaths.js"></script>
<link rel="stylesheet" type="text/css" href="../src/jcuts.css">
<!-- <script src="../jcuts.min.js"></script> -->
<style>
#canvas, #canvas1 {
border: solid 1px #ccc;
width: 500px;
height: 500px;
}
#canvas1 {
width: 300px;
height: 500px;
}
</style>
</head>
<body>
<div id="canvas"></div>
<div id="canvas1"></div>
<div id="tool"><button>replay</button></div>
</body>
<script>
(function() {
var pager = jcuts.createRender({
container: '#canvas1'
});
var game = jcuts.createGame({
edges: 6,
container: '#canvas',
fill: '#ff00ff',
storke: 'blue',
onchange: function() {
var shape = this.getShape();
pager.render(shape);
console.log(JSON.stringify(shape));
}
});
document.querySelector('button').onclick = function() {
game.replay();
};
})();
</script>
</html>