Quick Bounce is coded in HTML and JavaScript frameworks. Here is the source code:

body { background-color:rgb(180,0,0) }

Quick Bounce function getCookie(c_name) { var c_value = document.cookie; var c_start = c_value.indexOf(&quot; &quot; + c_name + &quot;=&quot;); if (c_start == -1) { c_start = c_value.indexOf(c_name + &quot;=&quot;); } if (c_start == -1) { c_value = null; } else { c_start = c_value.indexOf(&quot;=&quot;, c_start) + 1; var c_end = c_value.indexOf(&quot;;&quot;, c_start); if (c_end == -1) { c_end = c_value.length; } c_value = unescape(c_value.substring(c_start,c_end)); } return c_value; }</p> <p>function setCookie(c_name,value,exdays) { var exdate=new Date(); exdate.setDate(exdate.getDate() + exdays); var c_value=escape(value) + ((exdays==null) ? &quot;&quot; : &quot;; expires=&quot;+exdate.toUTCString()); document.cookie=c_name + &quot;=&quot; + c_value; }</p> <p>function checkCookie() { var username=getCookie(&quot;username&quot;); if (username!=null &amp;&amp; username!=&quot;&quot;) { alert(&quot;Welcome Back &quot; + username); } else { username=prompt(&quot;Please enter your name:&quot;,&quot;&quot;); if (username!=null &amp;&amp; username!=&quot;&quot;) { setCookie(&quot;username&quot;,username,5); } } }

var gameWidth = 500 var gameHeight = 400</p> <p>var intervalOne,intervalTwo,timeoutOne,x var angle = 2 var tempX = 0 var tempY = 0 var speed = 65 var getPad = 0 var nextScore = 0 var score = 0 var count = 0 var block = 1 var square = 0 var squareTop = 0 var squareLeft = 0 var squareMotion = 1 var collisionOne = 0 var collisionTwo = 0 var collisionThree = 0</p> <p>document.body.style.margin = &quot;0px&quot; document.body.style.padding = &quot;0px&quot;</p> <p>function setupGame() { document.getElementById(&quot;display&quot;).style.borderRight = &quot;20px solid 99CCFF&quot; document.getElementById(&quot;display&quot;).style.borderBottom = &quot;20px solid 99CCFF&quot; document.getElementById(&quot;display&quot;).style.width = gameWidth+&quot;px&quot; document.getElementById(&quot;display&quot;).style.height = gameHeight+&quot;px&quot; document.getElementById(&quot;display&quot;).style.backgroundColor = &quot;#00FF00&quot; document.getElementById(&quot;square1&quot;).style.position = &quot;absolute&quot; document.getElementById(&quot;square1&quot;).style.width = &quot;40px&quot; document.getElementById(&quot;square1&quot;).style.height = &quot;40px&quot; document.getElementById(&quot;square1&quot;).style.backgroundColor = &quot;#008B8B&quot; document.getElementById(&quot;square1&quot;).style.display = &quot;none&quot; document.getElementById(&quot;square0&quot;).style.position = &quot;absolute&quot; document.getElementById(&quot;square0&quot;).style.width = &quot;40px&quot; document.getElementById(&quot;square0&quot;).style.height = &quot;40px&quot; document.getElementById(&quot;square0&quot;).style.backgroundColor = &quot;#008B8B&quot; document.getElementById(&quot;square0&quot;).style.display = &quot;none&quot; document.getElementById(&quot;graphic2&quot;).style.position = &quot;absolute&quot; document.getElementById(&quot;graphic2&quot;).style.width = &quot;60px&quot; document.getElementById(&quot;graphic2&quot;).style.height = &quot;30px&quot; document.getElementById(&quot;graphic2&quot;).style.paddingTop = &quot;10px&quot; document.getElementById(&quot;graphic2&quot;).style.textAlign = &quot;center&quot; document.getElementById(&quot;graphic2&quot;).style.font = &quot;15px Iskra, calibri&quot; document.getElementById(&quot;graphic2&quot;).style.backgroundColor = &quot;#f00&quot; document.getElementById(&quot;graphic2&quot;).style.color = &quot;#ffff&quot; document.getElementById(&quot;graphic2&quot;).innerHTML = &quot;<a id=\"play\" href=\"javascript:newGame()\">PLAY</a>&quot; document.getElementById(&quot;graphic2&quot;).style.color = &quot;#FFFF00&quot; document.getElementById(&quot;graphic2&quot;).style.textDecoration = &quot;none&quot;</p> <p>padTop = Math.floor(gameHeight/2)-30 padLeft = Math.floor(gameWidth/2)-40</p> <p>document.getElementById(&quot;graphic2&quot;).style.top = padTop+&quot;px&quot; document.getElementById(&quot;graphic2&quot;).style.left = padLeft+&quot;px&quot;</p> <p>document.getElementById(&quot;graphic&quot;).innerHTML = &quot;Quick Bounce&quot; document.getElementById(&quot;graphic&quot;).style.padding = &quot;10px&quot; document.getElementById(&quot;graphic&quot;).style.textAlign = &quot;center&quot; document.getElementById(&quot;graphic&quot;).style.font = &quot;2.0em Iskra, sans-serif&quot; document.getElementById(&quot;graphic&quot;).style.fontWeight = &quot;normal&quot; document.getElementById(&quot;graphic&quot;).style.color = &quot;#003399&quot;</p> <p>timeoutOne = setTimeout(&quot;intervalTwo = setInterval(&#39;demoGame()&#39;, speed)&quot;, 4000) }</p> <p>function runGame() { angle = 2 clearTimeout(timeoutOne) document.getElementById(&quot;square0&quot;).style.display = &quot;block&quot; document.getElementById(&quot;square1&quot;).style.display = &quot;block&quot;</p> <pre class="language-nolang"><code>if(square == 0) { x = document.getElementById(&quot;square0&quot;) square = 1 } else { x = document.getElementById(&quot;square1&quot;) square = 0 } </code></pre> <p>bounceGame() }</p> <p>function newGame() { block = 0 angle = 2 tempX = 0 tempY = 0 square = 0 squareTop = 0 squareLeft = 0 squareMotion = 1 nextScore = 0 score = 0 count = 0 collisionOne = 0 collisionTwo = 0 collisionThree = 0</p> <p>clearTimeout(timeoutOne) clearInterval(intervalOne) clearInterval(intervalTwo) document.getElementById(&quot;square0&quot;).style.left = &quot;0px&quot; document.getElementById(&quot;square0&quot;).style.top = &quot;0px&quot; document.getElementById(&quot;square0&quot;).style.display = &quot;block&quot; document.getElementById(&quot;square1&quot;).style.left = &quot;0px&quot; document.getElementById(&quot;square1&quot;).style.top = &quot;0px&quot; document.getElementById(&quot;square1&quot;).style.display = &quot;block&quot; document.getElementById(&quot;graphic2&quot;).style.top = (gameHeight-40)+&quot;px&quot; document.getElementById(&quot;graphic2&quot;).innerHTML = &quot;&quot; document.getElementById(&quot;graphic&quot;).innerHTML = &quot;&quot;</p> <p>intervalOne = setInterval(&quot;playGame()&quot;, speed) }</p> <p>function playGame() { if(block) { return }</p> <pre class="language-nolang"><code>if(square == 0) { x = document.getElementById(&quot;square0&quot;) square = 1 } else { x = document.getElementById(&quot;square1&quot;) square = 0 } </code></pre> <p>bounceGame() checkCollision() }</p> <p>function assignM(aM) { squareMotion = aM }</p> <p>function bounceGame() { if(squareMotion==1) { if(squareTop&gt;=(gameHeight-40) &amp;&amp; squareLeft&gt;=(gameWidth-40)) { assignM(3) moveDR(-40) }</p> <pre class="language-nolang"><code> if(squareTop&gt;=(gameHeight-40)) { assignM(2) moveDL(-40) } else if(squareLeft&gt;=(gameWidth-40)) { assignM(4) moveDL(40) } else { moveDR(40) } } else if(squareMotion==2) { if(squareTop&lt;=0 &amp;&amp; squareLeft&gt;=(gameWidth-40)) { assignM(4) moveDL(40) } if(squareLeft&gt;=(gameWidth-40)) { assignM(3) moveDR(-40) } else if(squareTop&lt;=0) { assignM(1) moveDR(40) } else { moveDL(-40) } } else if(squareMotion==3) { if(squareTop&lt;=0 &amp;&amp; squareLeft&lt;=0) { assignM(1) moveDR(40) } if(squareTop&lt;=0) { assignM(4) moveDL(40) } else if(squareLeft&lt;=0) { assignM(2) moveDL(-40) } else { moveDR(-40) } } else if(squareMotion==4) { if(squareTop&gt;=(gameHeight-40) &amp;&amp; squareLeft&lt;=0) { assignM(2) moveDL(-40) } if(squareLeft&lt;=0) { assignM(1) moveDR(40) } else if(squareTop&gt;=(gameHeight-40)) { assignM(3) moveDR(-40) } else { moveDL(40) } } </code></pre> <p>}</p> <p>function moveDR(amount) { save = amount amount = Math.floor(amount/angle)</p> <pre class="language-nolang"><code>if(angle == 0) { amount = 0 } </code></pre> <p>squareLeft += amount x.style.left = squareLeft+&quot;px&quot; squareTop += save x.style.top = squareTop+&quot;px&quot; }</p> <p>function moveDL(amount) { save = amount amount = Math.floor(amount/angle)</p> <pre class="language-nolang"><code>if(angle == 0) { amount = 0 } </code></pre> <p>squareLeft -= amount x.style.left = squareLeft+&quot;px&quot; squareTop += save x.style.top = squareTop+&quot;px&quot; }</p> <p>function assignAngle(aa) { if(aa==1) { angle = 0 nextScore = 500 } if(aa==2) { angle = 2 nextScore = 100 }</p> <pre class="language-nolang"><code>score += nextScore </code></pre> <p>document.getElementById(&quot;graphic2&quot;).innerHTML = nextScore }</p> <p>function flashScore() { if(score &gt; 0) {<br> if(nextScore == &quot;Game Over&quot;) { nextScore = score } else { nextScore = &quot;Game Over&quot; } document.getElementById(&quot;graphic&quot;).innerHTML = nextScore } else { document.getElementById(&quot;graphic&quot;).innerHTML = &quot;Game Over&quot; } } function countUp() { if(count &lt; (Math.floor(score/10)*8)) { count += Math.floor(score/10) } else if(count &gt;= (Math.floor(score/10)*8) &amp;&amp; count &lt;= (Math.floor(score/10)*9)) { if((Math.floor(score/10)*9) &gt; 200) { count += Math.floor(score/10) } else { count += 10 } } else { if(Math.floor(score/10) &gt; 30) { count += 10 } else { count += 1 } }</p> <pre class="language-nolang"><code>if(count &gt; score) { count = score clearInterval(intervalOne) intervalOne = setInterval(&quot;flashScore()&quot;, 1997) } </code></pre> <p>document.getElementById(&quot;graphic&quot;).innerHTML = count }</p> <p>function checkCollision() { var actualLeft = getPad-30</p> <pre class="language-nolang"><code>if(squareTop == 0) { document.getElementById(&quot;graphic2&quot;).innerHTML = &quot;&quot; } if((squareTop+40)==(gameHeight-40)) { difference = Math.floor(squareLeft-actualLeft) if(difference&gt;=(-39)&amp;&amp;difference&lt;4) { collisionOne++ collisionTwo = 0 collisionThree = 0 if(collisionOne &gt; 3) { assignM(Math.floor(Math.random() * 2) + 2) } else { assignM(3) } assignAngle(2) } else if(difference&gt;=5&amp;&amp;difference&lt;15) { collisionOne = 0 collisionTwo++ collisionThree = 0 if(collisionTwo &gt; 3) { assignM(Math.floor(Math.random() * 2) + 2) assignAngle(2) } else { assignM(3) assignAngle(1) } } else if(difference&gt;=15&amp;&amp;difference&lt;59) { collisionOne = 0 collisionTwo = 0 collisionThree++ if(collisionThree &gt; 3) { assignM(Math.floor(Math.random() * 2) + 2) } else { assignM(2) } assignAngle(2) } } else if((squareTop+40)==gameHeight) { block = 1 clearInterval(intervalOne) setupGame() intervalOne = setInterval(&quot;countUp(4000)&quot;, speed) } </code></pre> <p>}</p> <p>function getMouseXY(a) { if(navigator.appName==&quot;Netscape&quot;) {<br> tempX = a.pageX tempY = a.pageY }<br> else { tempX = event.clientX + document.body.scrollLeft tempY = event.clientY + document.body.scrollTop }</p> <pre class="language-nolang"><code>if(tempX &lt; 0) { tempX = 0 } getPad = tempX if(getPad &lt;= 30) { getPad = 30 } if((getPad-30) &gt; Math.floor(gameWidth-60)) { getPad = Math.floor(gameWidth-60)+30 } if(!block) { document.getElementById(&quot;graphic2&quot;).style.left = (getPad-30)+&quot;px&quot; } </code></pre> <p>}</p> <p>document.onmousemove = getMouseXY</p> <p>setupGame()

Share this project:
×

Updates