CLICK TO FLAP!

A Flappy Bird demake that fits in a single tweet!

Here's the super minified version, the entire HTML file is only 244 bytes!

<canvas onclick=V=1 style=width:100% id=c><svg onload="C=c.getContext`2d`;T=-1;setInterval(`X=(c.width=99)-T%128;i=T++>>7;for(j=2;j--;C.fillRect(X+3,7+o-120*j,19,99))o=18+i**2%25;C.fillText(i,9,T&&X*X>144|(Y-o)**2<49?Y-=V-=.03:T=Y=V=0,9)`,16)">

Here is a cleaner version with white space and comments...

<canvas style=width:100% id=c><script> // html canvas and script
x = c.getContext`2d`                   // get 2d canvas context
T = -1                                 // init time value
setInterval( _=> {                     // update interval
  X = (c.width=99) - T%128             // get wall position and clear screen
  i = T++ >> 7                         // get wall index
  H = 18 + i**2%25                     // get pseudo random wall height
  T && X*X>144 | (Y-H)**2<49 ?         // collision detection
    onclick =_=> V=1 :                 // click to flap
    T = Y = V = 0                      // reset if collided
  for ( j = 2; j--; )                  // top and bottom part of wall
    x.fillRect(X+3, 7+H-120*j, 19, 99) // draw wall parts
  x.fillText(i, 9, Y -= V -= .03, 9)   // draw player and update physics
},16)                                  // 60 fps update
</script>                              // end html

Comments

Log in with itch.io to leave a comment.

(1 edit)

Hi! I am doing a YouTube channel where I do speed- and short- coding among other stuff. I was thinking about making a "game in a Tweet" video, although I expected it to be some simple command-line game in Python. I am really surprised a Web game with graphics is possible in such a short amount of code! Is it ok if I base my video(s) based on your idea and code? Although I'll try to make HD version out of it.

It took quite some effort to understand how all the parts work together. And the game itself is pretty hard (I think my best was around 6-7:)

Edit: just reached 10

Sure, go for it! You can find more games that fit in a tweet here (some are not actual games but tributes)... http://dweetabase.3d2k.com/?&search=game

Thanks!

I was just wondering whether you know some other 1-tweet web games - I'll check out the link:)