Author Topic: JSFBGL :: Javascript Framebuffer Graphic Library  (Read 7658 times)

0 Members and 1 Guest are viewing this topic.

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Hi all,

today I released JSFBGL :: Javascript Framebuffer Graphic Library !

It is a little experimental art project to provide a graphic library similar to
TinyPTC e.g. in JavaScript. Do not take it too seriously ;-)

Project Site: http://www.weltenkonstrukteur.de/?site=works&prd=jsfbgl
Direct Download : http://www.weltenkonstrukteur.de/dl/jsfbgl.zip

Three examples are available online (see project site):

      

Any feedback welcome.
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #1 on: September 23, 2006 »
That's a really neat idea Benny :) I like the examples. Would bigger windows be practical or would they slow things down too much?

I'd love to see a glenze vector done in this lib :)
Shockwave ^ Codigos
Challenge Trophies Won:

Offline Rbz

  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 2721
  • Karma: 485
    • View Profile
    • http://www.rbraz.com/
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #2 on: September 23, 2006 »
Nice one  8)

Quote
Would bigger windows be practical or would they slow things down too much?
I would make the same question  :P
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #3 on: September 23, 2006 »
@Rbraz&shockwave:

First - thank you. I am glad you like it.

Anyway. Big windows - meaning a higher resolution of the acutal html table -
would be not practical at the moment. You can cheat around with some
clever algorithms - but a constant redraw of the whole table is really cpu consuming.
So better check out the cpu usage while developing !

Again - this is more like a html hack of pretending to have something like a  frame
buffer using a simple html table. But a html table is of course not mend to be used
in that way ;-)
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #4 on: September 24, 2006 »
Well it gives a result of some almost ascii-ish effects and definately looks interesting Benny :)
How about increasing the scale of the display instead of the resolution then?
Shockwave ^ Codigos
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #5 on: September 24, 2006 »
Well it gives a result of some almost ascii-ish effects and definately looks interesting Benny :)

You are right. When I wrote the first effects with this library it also reminds me on some
kind of ascii-art.

Quote
How about increasing the scale of the display instead of the resolution then?

Yup. That is no problem. You can change it really simple.

jsfbgl_open(x_res, y_res, pixel_width, pixel_height)

Is the function to 'open' (i.e. create) the html table (i.e. screen). x_res and y_res
are the amount of cells and rows of the table. With the parameters pixel_width and
pixel_height you specify the width and the height of each cell - which represents a single
pixel.
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #6 on: September 24, 2006 »
It actually gives me a really interesting idea for a coding challenge.

Perhaps if the entrants of the challenge had to use a frame buffer of say 64 * 64 and t he display scaled up to 800 X 600 and drawn in blocky rectangles what effects would be made?

I kind of think we'd be surprised at how diverse they'd be.
Your routine has definately given me cause to think about this and perhaps that could be a future challenge. It's certainly different and wouldn't be limited by language either.

Would you mind if I did something like that in the future Benny?
Shockwave ^ Codigos
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #7 on: September 24, 2006 »
@Shockwave:

That definately sounds like a cool idea. A competition were the display is limited!
Never heard of this before and the entries could be very surprising, I think !


@topic:

Added another example: Pixelfade - a pixelwise fading fx between two pics.



Link is on here : http://www.weltenkonstrukteur.de/?site=works&prd=jsfbgl
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #8 on: September 24, 2006 »
Hehee.

You know, it's crazy using html tables like this. What a great idea. I love it!
I love the cross fade effect too.
Shockwave ^ Codigos
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #9 on: September 24, 2006 »
@shockwave: thx.


@topic:

I decided to add the tool I coded for the pixelfade fx to the official release pack.
It's just a small command line tool that converts any bitmap file into a javascript
array source code, so that you can use it with the library.

You will find it in the jsfbgl_bin folder. The download url remains the same :

http://www.weltenkonstrukteur.de/dl/jsfbgl.zip

« Last Edit: September 24, 2006 by benny! »
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Rbz

  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 2721
  • Karma: 485
    • View Profile
    • http://www.rbraz.com/
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #10 on: September 24, 2006 »
I'll try to include some effects into my site, thx benny!
Challenge Trophies Won:

Offline Clyde

  • A Little Fuzzy Wuzzy
  • DBF Aficionado
  • ******
  • Posts: 7271
  • Karma: 71
    • View Profile
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #11 on: September 24, 2006 »
Btw, Benny Cool Work dude, real nice stuff and work.
Still Putting The IT Into Gravy
If Only I Knew Then What I Know Now.

Challenge Trophies Won:

Offline Tetra

  • DBF Aficionado
  • ******
  • Posts: 2532
  • Karma: 83
  • Pirate Monkey!
    • View Profile
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #12 on: September 24, 2006 »
Thats really cool, i like that, never given Javascript a second thought for stuff like that before now  8)
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #13 on: September 25, 2006 »
@Clyde & Tetra:

Thanks - I am glad you guys like it.



@Rbraz:

cool. Give me a note when you put something online.
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #14 on: September 25, 2006 »
You should definately add your site to our links forum Benny :)
Shockwave ^ Codigos
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #15 on: September 25, 2006 »
You should definately add your site to our links forum Benny :)

@shockwave:
that's a nice thought .. but I do not dare to put the link of my little site in a list with
names like intro inferno, kkrunchy by ryg^farbrausch, but maybe I start
another thread concerning personal pages worth visiting in that section ...


@topic:
coded a little snake game today using jsfbgl. Resolution is a 20 cell * 20 cell large html-
table. Each table 6*6pixel big. Well, just to prove that even simple games are possible to
be played in a html-table ;-)



Play it online : http://www.weltenkonstrukteur.de/?site=works&prd=jsfbgl
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17378
  • Karma: 497
  • evil/good
    • View Profile
    • My Homepage
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #16 on: September 25, 2006 »
I am crap at this game, I could only manage to eat 5 apples!!!
Shockwave ^ Codigos
Challenge Trophies Won:

Offline taj

  • Bytes hurt
  • DBF Aficionado
  • ******
  • Posts: 4810
  • Karma: 189
  • Scene there, done that.
    • View Profile
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #17 on: October 08, 2006 »
Very cool idea indeed, simple and very effective. Karma up!
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4380
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #18 on: October 08, 2006 »
Very cool idea indeed, simple and very effective. Karma up!

Thank you very much!
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline p01

  • Atari ST
  • ***
  • Posts: 158
  • Karma: 51
    • View Profile
    • www.p01.org
Re: JSFBGL :: Javascript Framebuffer Graphic Library
« Reply #19 on: April 25, 2007 »
Guys, most of the effects in Neja, the JavaScript demo I presented at the Assembly 2005 Browser demo compo, are done with a linear frame buffer.

Since I aimed for standard compliants browsers ( aka anything but that piece of junk called IE ), I used the 9yo RFC 2397 - the data url scheme to generate 24bits BMP images on the fly. The format is not compressed and is ridiculously easy to manipulate and generate. Also this technique is much faster than the zillion DID/TD techniques.

Being a JS demo, anyone can grab the code and have look. Of course credits would be appreciated if one make anything useful out of it :p