pouët.net

Go to bottom

JS1k, 1k Javascript demo contest

category: code [glöplog]
way to go p01!
now we want multiplayer! :p
added on the 2010-09-10 20:03:43 by wysiwtf wysiwtf
p4p4: Thanks for the notice.

The submit form on js1k borked the script of WOLF1K when I submitted it last night. Kuvos and I got in touch around noon today. I gave him a link to the JS file so that he could copy it as is and avoid the encoding issues of the submit form. Problem solved.

JSYK, at noon today, kuvos said he would keep approving entries but to limit plagiarism he would not be updating the site until the deadline. Meaning: no new entries visible on js1k until midnight CET.

Meanwhile you can check WOLF1K on my site.
added on the 2010-09-10 20:09:15 by p01 p01
did it, enjoyed sliding along the walls like 10 years before..
so --: what a shame, you won't get updated before midnight
added on the 2010-09-10 20:18:54 by p4p4 p4p4
I'm not going to publish it on js1k, but I did a 128b random walk texture generator. It was tought to be used as texture for a 3d scene, but I finally didn't had time to do it...

Code:x=y=w=300;setInterval("for(n=w;n--;y+=m(x+=m(y*x)))document.body.child ren.c.getContext('2d').fillRect(x%w,y%w,1,.1)",m=Math.cos)
added on the 2010-09-10 20:21:36 by texel texel
texel: beware, it's the 'monster under your bed' !
added on the 2010-09-10 20:42:03 by p4p4 p4p4
p4p4: No biggie, you credited IQ's Shadertoy, so it's all good, he made a lot of modifications to my original ;)
A lossy image decompressor and an image in less than 1kb:

http://www.romancortes.com/ficheros/gioconda_js1k.php

The compression ratio is 32x, it outperforms JPEG in PSNR at that file size -- but the visual quality is very similar in any case.

Note that why it outperforms JPEG is not because my algorithm is good at general image compression, but just because JPEG doesn't perform good at very low bitrates.

*Looks better in Chrome and Safari
added on the 2010-09-11 04:13:21 by texel texel
She looks a bit "square faced" ;)
added on the 2010-09-11 12:51:01 by raer raer
She looks a bit awesome to me.

texel: Using UTF-8 even further, I think you could save ~50 bytes by doing:
Quote:
<body><canvas id=c><script>for(W=152,A=W*W;A--;c.getContext('2d').fillRect( A%W,A/W>>0,1,1-D))p="BB Image".charCodeAt((A/W>>3)*19+(A>>3)% 19),r=p%16,m=p%17/16,a=(p-A%8)%67-33,b=(p-A/W%8)%53-26,D=Math.sin(r*r-(a*a+b*b)/1 99)*m*m+p%18/20</script>

Which is 227 bytes + BB Image ( the 361 characters long UTF-8 string ~ 722 bytes ) ~ 949 bytes max.

ps: I'd be curious to see the encoder for this thing. The quality is pretty good.
added on the 2010-09-13 12:05:24 by p01 p01
Does using the pig give better compression? (really, what is it supposed to be?!)
added on the 2010-09-13 12:30:04 by psonice psonice
psonice: What do you mean 'supposed to be'? It's meant to be a pig. They compress best.
added on the 2010-09-13 13:12:36 by sagacity sagacity
piglet compression > wavelet compression
added on the 2010-09-13 13:43:32 by gasman gasman
I used the BB Image to save us all a 361 characters long UTF-8 string. You know 'coz I'm no Jazz musician and there's not much point posting that string here anyways.

gruik!
added on the 2010-09-13 13:52:43 by p01 p01
Ahh, hehe. Thought it was some kind of 'replace chars xxx with pig' feature built into pouet for some reason. Like the sites that replace :) with shitty early 90s animgifs. That was a stupid thought :)
added on the 2010-09-13 14:04:08 by psonice psonice
I'm using about 7,775 bits per character (8 bits byte) in the example (219 values possible), and have 722 charactes.

The maximum number of bits with 722 bytes is 8*722=5776
With my method 722*7,775~=5613

Then (5776-5613)/8~=20 bytes. But afaik, I can't use fully the unicode characters bits... Or I'm wrong? And, in any case... do you think it is worth the effort? If you think so, maybe I can send you my encoders (I have a lot of different versions, the one I used for the mona lisa example is one of the simpler) and we could try to do any kind of collaboration with these...

I thought, for example, in tiny video compression or something... Well, if you are interested, write to my e-mail!
added on the 2010-09-13 14:48:55 by texel texel
http://democopei.de/1021.html

Choose pixel size before shooting it off. Will hog your Firefox. :)

Couldn't submit it to JS1K, because it needs ISO-8895-1 charset to get compressed below 1K.
added on the 2010-09-18 16:59:35 by pixel pixel
@pixel:

Very good. Do you think it would be possible to make it faster (even if it were needed to make it a bit bigger)?

Could you post the source uncompressed?

I suppose you did, but, for the "ground", have you used a BIG sphere, isn't it? Using an "infinitely" big sphere should be cheaper in filesize than adding a plane equation.

Finally, I think the saturated sphere seen only in reflection doesn't look very good for me... I would have rather added it in the middle of the screen, to be seen both in the first ray and in the reflection rays.

added on the 2010-09-18 23:15:04 by texel texel
@texel:

Thanks a lot! :)

You're perfectly right: it's all spheres. You can fetch the uncompressed version here:

http://democopei.de/1021-uncompressed.html

I guess no objects and more bare-metal code would speed it up. Görg, who helped to me to shrink the uncompressed version down and to make the thing aesthetically pleasing, suggested to use some more advanced techniques to trace less rays. (I hope we'll team up again.)

The saturated sphere looks worse if you can see it immediately - it was supposed to look like a sun. This was really all I could do before the mental breakdown when it couldn't be submitted. ;)
added on the 2010-09-19 06:59:05 by pixel pixel
Results available:
http://js1k.com/home

Congrats to p01, feiss and... is there any other demoscener at the list?

The results are very similar to my personal preferences. I'd have made the first Tiny Chess, wich is, not only amazing but the most popular at Twitter (and Twitter a very good estimator of general popularity) entry by a big margin. I'm sure it would have been the "public choice".

About Legend Of The Bouncing Beholder, it is really good, it would have been in my 2nd or 3rd position, so not a very big difference from the current results.

Tetris with sound is amazing too, but, it doesn't sound in all browsers. By other hand, Morse code generator sounds in all browsers. So, for me, and thinking in the rule of the compo "Must work on current fx, sa, ch and o.", tetris should be lower and morse code upper.

About Binary Clock, I think it was an absolutely stupid rule in the compo "6.Bonus points if your submission fits in one tweet ;)". Does it is a 1kb compo or a 140bytes compo? It looks really difficult to rate entries of the same size limit, but how to compare entries of so different sizes? For compiled code, it would have been very similar to a mixed 32/64bytes and 256/512bytes compo...

Finally, I've to say that if we demosceners had been the jury, the results would have been very different I think, probably biased to cool visuals. Since the open nature of the compo, I like the variety in the winners list.
added on the 2010-09-27 14:51:15 by texel texel
Next time i will make a game, using "demoscene technology" LOL

Did anybody spot our entry?

http://js1k.com/demo/528
added on the 2010-09-27 21:09:26 by Ramon B5 Ramon B5
The chess entry is rather impressive, but still my favorite how-the-hell-can-it-fit 1kb chess must be this one! :)
added on the 2010-09-27 22:47:27 by Sdw Sdw
Sdw: remember that the ZX 1kb is compiled code and it is much more compact than Javascript -- even if the JS code is compacted. The ratio can be around 1:2 or 1:3. (See JSpongy 284bytes versus Spongy 128bytes).

TinyChess have less than 700 bytes of Javascript for game play code (the rest is for chess board rendering), wich could be around 3-4 hundred bytes as compiled code. 1K ZX Chess lacks of queening but TinyChess have it. So, I think TinyChess is at least as impressive as 1k zx chess...
added on the 2010-09-28 14:28:02 by texel texel
texel: on the other hand, the JS version had the graphics basically for free :)
added on the 2010-09-28 14:38:35 by Gargaj Gargaj

login

Go to top