Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

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.