Jump to content
  • Advertisement
Infinity8378

FROGGER ARCADE JAVASCRIPT

Recommended Posts

Advertisement

fixed logs error All rights reserved to Frogger.

FROGGER UNDER100linesGREATV2.html

image.png.1552bdd54d8c2e313a15798e6ba4bb38.png

 

 <!DOCTYPE html>
<html lang="en">
<body>
<HEADER>
        <P>FROGGER</P>
    </HEADER>
  <meta charset="utf-8" />
<SECTION style="border-style: solid; border-width: 2px; width: 512px;">
        <CANVAS WIDTH="512" HEIGHT="512" ID="canvas" tabindex="0">
            Your browser does not support canvas!!
        </CANVAS>
    </SECTION>
   <script>
var d=0,qp=1;
document.addEventListener('keydown', function(event) {
    switch (event.keyCode) {
         case 39:
            QX+=16//right
            break;
        case 38:
            QY-=16//up
            qp=-qp;
            d=qp;
        break;
        case 37:
            QX-=16//left
            break;
        case 40:
            QY+=16//down
            qp=-qp;
            d=qp;
            break;
       default:
    }
    if (QY>120){
    d=0;}}, true);
var CPRESSRATIO=7//RANGE 3-26 from 128 or 4
var canvas = document.getElementById('canvas');
var canvasWidth  = canvas.width;
var canvasHeight = canvas.height;
var ctx = canvas.getContext('2d');
var imageData =ctx.getImageData(0, 256, 256,512);
var fps = 28;
var now;
var then = Date.now();
var interval = 1000/fps;
var delta;
var buf = new ArrayBuffer(imageData.data.length);
var buf8 = new Uint8ClampedArray(buf);
var data = new Uint32Array(buf);
var TRIAL = new Image();   // Create new img element
TRIAL.src="data:image/png;base64,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"
QX=128;
QY=224;
var coldQ=224;
ctx.fillStyle="#00FF00";
function draw() {
    now = Date.now();
    delta = now - then;
    if (delta > interval) {
        then = now - (delta % interval);
        coldQ++;        
        coldQ=coldQ&255;
var UU= (canvasWidth*canvasHeight/2)
var hit=0;
for (var i = 0; i < UU; ++i) {
var EE=imageData.data[4*i+2]+imageData.data[4*i+1]+imageData.data[4*i];
       if(i&64) {
        hit=(hit+1)&2047;}
if (hit===0){
coldQ=-coldQ+512;
hit=0;}
var w=256;
var EST=!((i<48*w)||((i>128*w)&&(i<144*w))||(i>224*w))
        data[i+(coldQ*EST)] =(255<<24)|imageData.data[4*i+2]<<16|imageData.data[4*i+1]<<8|imageData.data[4*i];;          
if((i+(coldQ*EST))==(((QY+8)<<8)+QX+7)){
 if ((QY<128)&&(EE== 74)){
 d=0;
 QX=128;
 QY=128;}
 if ((QY>128)&&(EST)&&(EE>12)){
 QX=128;
 QY=224;}} 
if (QY<48){
alert("You Win!")
QX=128;
d=0;
 QY=224;}}
imageData.data.set(buf8);
ctx.putImageData(imageData, 0, 0);
ctx.fillRect(QX-=d,QY,16,16);
ctx.drawImage(TRIAL, 0,0,256,256,0,256,256,256);
imageData = ctx.getImageData(0, 256, 256,512);}
requestAnimationFrame(draw);}
draw();
</script>
  <style>
  </style>
</body>
</html>

FROGGERAT100linesGREATV2.html

Share this post


Link to post
Share on other sites

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!