summaryrefslogtreecommitdiff
path: root/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1
diff options
context:
space:
mode:
Diffstat (limited to 'docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1')
-rwxr-xr-xdocs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/css/animation.css74
-rwxr-xr-xdocs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/image/ball.gifbin0 -> 549 bytes
-rwxr-xr-xdocs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/index.html46
-rwxr-xr-xdocs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/script/animation.js189
4 files changed, 309 insertions, 0 deletions
diff --git a/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/css/animation.css b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/css/animation.css
new file mode 100755
index 0000000..380a671
--- /dev/null
+++ b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/css/animation.css
@@ -0,0 +1,74 @@
+body {
+ font-size:75%;
+}
+
+h1, h2, h3 {
+ font:normal 3em "Helvetica Neue Light","Helvetica Neue",helvetica,georgia,"times new roman","Arial Rounded MT Bold",verdana,tahoma,arial,"sans serif";
+ font-weight:normal;
+ margin-bottom:0px;
+}
+
+h1, h2 {
+ letter-spacing:-1px; /* zomg web x.0! ;) */
+}
+
+h1, h2, h3 {
+ padding-bottom:1px;
+ margin-bottom:0.25em;
+}
+
+h1 {
+ margin-top:0px;
+ margin-bottom:0px;
+ background-color:#666;
+ color:#ccc;
+ margin-left:-5px;
+ padding-left:5px;
+ padding-right:5px;
+ padding-bottom:5px;
+}
+
+h1,
+h1 a {
+ color:#fff;
+ text-decoration:none;
+}
+
+h1 a:hover {
+ text-decoration:underline;
+}
+
+h2 {
+ font-size:2em;
+ margin-top:1em;
+ background-color:#aaa;
+ color:#fff;
+ padding:5px;
+ margin-left:-5px;
+ min-width:23em;
+}
+
+h3 {
+ font-size:1.65em;
+ margin-top:0.5em;
+ margin-bottom:0.25em;
+ color:#333;
+ min-width:28em;
+}
+
+h3 a {
+ font-size:small;
+}
+
+h4 {
+ color:#444;
+}
+p {
+ font:normal 1em/2em verdana,tahoma,arial,"sans serif";
+}
+
+.balls img {
+ position:absolute;
+ width:12px;
+ height:12px;
+} \ No newline at end of file
diff --git a/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/image/ball.gif b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/image/ball.gif
new file mode 100755
index 0000000..0f13534
--- /dev/null
+++ b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/image/ball.gif
Binary files differ
diff --git a/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/index.html b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/index.html
new file mode 100755
index 0000000..7d010a8
--- /dev/null
+++ b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/index.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+<head>
+<link rel="stylesheet" href="../template/template.css" media="screen" />
+<link rel="stylesheet" href="css/animation.css" media="screen" />
+<script type="text/javascript" src="../../script/soundmanager2-nodebug-jsmin.js"></script>
+<script type="text/javascript" src="script/animation.js"></script>
+</head>
+<body>
+
+<div style="margin-right:43em">
+
+<h1>Interval-based animation (with sound)</h1>
+
+<p>
+ Click + drag for fun.
+</p>
+
+<h2>Speeding Up ExternalInterface: Keep .swf in view</h2>
+
+<p>SoundManager 2 now incorporates a "high performance" mode, which has been shown to noticeably improve timing and frequency of flash callbacks. This is important for timing, reducing delay between a JS call and the sound being played, etc.</p>
+
+<p>To reduce audio delay and timing issues from slow JS/Flash communication, SM2 will try to ensure that the flash movie is visible on screen at all times. If hidden or otherwise off-screen, Flash will be given lower priority and thus JS/flash "lag" (ie., delay) will be introduced when trying to play audio "in sync."</p>
+
+<p>Generally, positioning the flash movie using position:fixed and bottom/left or bottom/right 0px is the less-intrusive option.</p>
+
+<p style="margin:0px;padding:0px">
+ <input id="useMouse" name="usemouse" value="usemouse" type="checkbox"> Throw from mouse
+</p>
+<p style="margin:0px;padding:0px">
+ <button id="b-start" onclick="startAnimation()" disabled="disabled">Start</button>
+ <button id="b-stop" onclick="stopAnimation()" disabled="disabled">Stop</button>
+</p>
+
+
+<p>Sound source: <a href="http://freesound.iua.upf.edu/samplesViewSingle.php?id=19987">"Acclivity"</a>, Free Sound Project</p>
+
+</div>
+
+<div id="ball-container" class="balls">
+ <img src="image/ball.gif" alt="" />
+</div>
+
+</body>
+</html>
diff --git a/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/script/animation.js b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/script/animation.js
new file mode 100755
index 0000000..f167761
--- /dev/null
+++ b/docs/dymaxion/soundmanagerv297a-20101010/demo/animation-1/script/animation.js
@@ -0,0 +1,189 @@
+var balls = [];
+var canvasX = 0;
+var canvasY = 0;
+var timer = null;
+var m_lastX = 0;
+var m_lastY = 0;
+var M_SPACE = 24;
+var B_VMIN = 5;
+var B_VMAX = 5;
+var B_WIDTH = 13;
+var B_HEIGHT = 13;
+var useMouse = null;
+var ballSound = null;
+var ballPopSound = null;
+
+function rnd(n) {
+ return Math.random()*n;
+}
+
+function rndI(n) {
+ return parseInt(rnd(n));
+}
+
+function createBall(oParent) {
+ oParent.appendChild(balls[0].cloneNode(true));
+ initBall(balls[balls.length-1],balls.length);
+}
+
+function createBallAtMouse(e) {
+ e = e?e:event;
+ createBall(document.getElementById('ball-container'));
+ with (balls[balls.length-1]) {
+ _x = e.clientX;
+ _y = e.clientY;
+ if (useMouse.checked != false) {
+ _vX = (m_lastX-e.clientX)*-0.7;
+ _vY = (m_lastY-e.clientY)*-0.7;
+ } else {
+ _vX = 0;
+ _vY = 0;
+ }
+ }
+ moveBall(balls[balls.length-1]);
+}
+
+function initBall(oBall,i) {
+ oBall._id = 'ball'+i;
+ oBall._active = true;
+ oBall._x = rnd(canvasX);
+ oBall._y = rnd(canvasY);
+ oBall._vX = B_VMIN+rnd(B_VMAX)*(Math.random()>0.5?1:-1);
+ oBall._vY = B_VMIN+rnd(B_VMAX);
+ oBall.style.display = 'block';
+}
+
+function moveBall(oBall) {
+ oBall._x += oBall._vX;
+ oBall._y += (oBall._vY++); // gravity!
+ var bounce = false;
+ if ((oBall._vX>0 && oBall._x+oBall._vX+B_WIDTH>canvasX) || (oBall._vX<0 && oBall._x+oBall._vX<0)) {
+ oBall._vX *= -1;
+ bounce = true;
+ }
+ if ((oBall._vY>0 && oBall._y+oBall._vY+B_HEIGHT>canvasY) || (oBall._vY<0 && oBall._y+oBall._vY<0)) {
+ // bounce on Y axis - with resistance on both axes
+ if (oBall._vY>0) oBall._y = canvasY-B_HEIGHT; // bounce exactly from bottom
+ oBall._vY *= -(oBall._vY>1?0.6:1);
+ bounce = true;
+ if (Math.abs(oBall._vX)>0.5) {
+ oBall._vX *= 0.85;
+ } else {
+ oBall._vX = 0;
+ }
+ if (Math.abs(oBall._vY)<=3 && Math.abs(oBall._vX==0)) {
+ oBall._active = false;
+ bounce = false;
+ ballPopSound.play();
+ oBall.style.display = 'none';
+ }
+ }
+ oBall.style.left = oBall._x+'px';
+ oBall.style.top = oBall._y+'px';
+ if (bounce) ballSound.play({pan:getPan(oBall._x,canvasX)});
+}
+
+function getPan(x,canvasX) {
+ var pos = x/canvasX;
+ var pan = null;
+ if (pos<=0.4) {
+ pan = Math.floor(-100+(pos/0.4*100));
+ } else if (pos>0.4 && pos<=0.5) {
+ pan = 0;
+ } else {
+ pan = Math.floor(pos*100);
+ }
+ return pan;
+}
+
+function animateStuff() {
+ for (var i=balls.length; i--;) {
+ if (balls[i]._active) moveBall(balls[i]);
+ }
+}
+
+function startAnimation() {
+ if (!timer) timer = setInterval(animateStuff,20);
+ document.getElementById('b-start').disabled = true;
+ document.getElementById('b-stop').disabled = false;
+}
+
+function stopAnimation() {
+ if (!timer) return false;
+ clearInterval(timer);
+ timer = null;
+ document.getElementById('b-start').disabled = false;
+ document.getElementById('b-stop').disabled = true;
+}
+
+function mouseDown(e) {
+ e = e?e:event;
+ m_lastX = e.clientX;
+ m_lastY = e.clientY;
+ document.onmousemove = mouseMove;
+ document.onmouseup = mouseUp;
+ return false;
+}
+
+function mouseMove(e) {
+ e = e?e:event;
+ if (Math.abs(e.clientX-m_lastX)>M_SPACE || Math.abs(e.clientY-m_lastY)>M_SPACE) {
+ createBallAtMouse(e);
+ m_lastX = e.clientX;
+ m_lastY = e.clientY;
+ }
+ return false;
+}
+
+function mouseUp() {
+ document.onmousemove = null;
+ document.onmouseup = null;
+}
+
+function init() {
+ ballSound = soundManager.createSound({
+ id: 'ballSound',
+ url: '../animation/audio/fingerplop.mp3',
+ volume: 50,
+ multiShot: true,
+ autoLoad: true
+ });
+ ballPopSound = soundManager.createSound({
+ id: 'ballPopSound',
+ url: '../animation/audio/fingerplop2.mp3',
+ volume: 50,
+ multiShot: true,
+ autoLoad: true
+ });
+ balls = document.getElementById('ball-container').getElementsByTagName('img');
+ for (var i=balls.length; i--;) {
+ initBall(balls[i],i);
+ }
+ useMouse = document.getElementById('useMouse');
+ useMouse.checked = true;
+ getWindowCoords();
+ startAnimation();
+ document.onmousedown = mouseDown;
+}
+
+// I know this is kinda broken in Opera.
+getWindowCoords = (navigator.userAgent.toLowerCase().indexOf('opera')>0||navigator.appVersion.toLowerCase().indexOf('safari')!=-1)?function() {
+ canvasX = window.innerWidth;
+ canvasY = window.innerHeight;
+}:function() {
+ canvasX = document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth;
+ canvasY = document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight;
+}
+
+window.onresize = getWindowCoords;
+
+soundManager.flashVersion = 9;
+soundManager.url = '../../swf/';
+soundManager.useHighPerformance = true;
+soundManager.debugMode = false; // disable debug mode
+soundManager.defaultOptions.multiShot = true;
+
+soundManager.onload = function() {
+ // soundManager is ready to use (create sounds and so on)
+ init();
+}