Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

98 lines (88 sloc) 2.66 kB
<!doctype html>
<head>
<title>Bonsai Movie Library</title>
<script>
var require = {
baseUrl: '../../src',
urlArgs: +new Date
};
</script>
<script src=../../lib/requirejs/require.js></script>
<style type="text/css">
body, html { margin: 0; font-family: sans-serif; font-size: 14px; width: 100%; height: 100%; }
#edit {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 10;
background: rgba(255,255,255, 0.5);
}
textarea {
width:100%;
height: 100%;
border: none;
background: transparent;
outline: none;
font-size: 14px;
font-family: monospace;
}
.hidden textarea {
display: none;
}
#edit.hidden {
background: transparent;
}
#bs {
box-shadow: 0 0 20px rgba(0,0,0,0.5);
margin: 70px auto;
width: 500px;
height: 500px;
}
</style>
</head>
<body>
<div id="edit">
<div id="buttonbar">
<button onclick="showEditor();">show editor</button>
<button onclick="hideEditor();">hide editor</button>
<button onclick="load()">Load</button>
</div>
<textarea>
/**
* Tests a simple shape creation.
*/
// bs.Path.rect returns a {DisplayObject}
var rectPath = new bonsai.Path.rect(150, 150, 150, 150);
// add [DisplayObjectInstance] to [Stage]
stage.addChild(rectPath.attr({strokeWidth:1, fill:'red', opacity:0.4}));
// full circle
stage.addChild(bonsai.Path.circle(52, 52, 50).attr({fill: 'red', strokeWidth:1, line: 'yellow'}));
// half circle
stage.addChild(bonsai.Path.arc(202, 52, 50, Math.PI/2, Math.PI).attr({fill: 'red', strokeWidth:1, line: 'green'})).attr({x:140,y:30});
// half circle
stage.addChild(new bonsai.Path('M40,140 L40,100 L10,100 C10,10 90,10 90,100 L60,100 L60,140 M140,50 C70,180 195,180 190,100 z').attr({fill: 'blue', strokeWidth: 1}));
</textarea>
</div>
<div id=bs></div>
<script>
function load(){
var stageNode = document.getElementById('bs');
var script = document.getElementsByTagName('textarea')[0].value;
stageNode.innerHTML = '';
require(['player'], function(bs) {
var opts = {
width: 500,
height: 500,
noCache: true
};
stageNode.style.width = opts.width + 'px';
stageNode.style.height = opts.height + 'px';
var movie = bs.runCode(stageNode, '.', script, opts);
});
}
function showEditor() { document.getElementById('edit').className = 'visible'; }
function hideEditor() { document.getElementById('edit').className = 'hidden'; }
</script>
</body>
Jump to Line
Something went wrong with that request. Please try again.