8 bit art

General FreeBASIC programming questions.
angros47
Posts: 1508
Joined: Jun 21, 2005 19:04

8 bit art

Postby angros47 » Jul 29, 2010 6:51

http://www.effectgames.com/demos/canvascycle/?sound=0

(Mozilla or Chrome required)

The animation effect is gained by color cycling (like in many old games)

I believe that should not be difficult to port this to FreeBasic.
HD_
Posts: 215
Joined: Jun 10, 2006 12:15
Contact:

Postby HD_ » Jul 29, 2010 8:04

Wow, that is just plain amazing.
Mentat
Posts: 332
Joined: Oct 27, 2007 15:23
Location: NC, US
Contact:

Postby Mentat » Jul 29, 2010 13:59

Quite neat.
agamemnus
Posts: 1842
Joined: Jun 02, 2005 4:48

Postby agamemnus » Jul 29, 2010 14:31

Nice.
rdc
Posts: 1713
Joined: May 27, 2005 17:22
Location: Texas, USA
Contact:

Postby rdc » Jul 29, 2010 14:42

Impressive.
Skyler
Posts: 242
Joined: Sep 26, 2006 16:30

Postby Skyler » Jul 29, 2010 14:56

Fascinating.
antarman
Posts: 66
Joined: Jun 12, 2006 9:27
Location: Russia, Ural, Chelyabinsk
Contact:

Postby antarman » Jul 30, 2010 2:45

Very, very cool !!!
counting_pine
Site Admin
Posts: 6172
Joined: Jul 05, 2005 17:32
Location: Manchester, Lancs

Postby counting_pine » Jul 30, 2010 15:28

Here's some code that will shift a section of the palette. Call it multiple times to shift multiple sections. It features the blending feature that I think the accompanying blog talks about. Now if anyone can actually find a good BMP to try it on...

(One of the old win9x logo.sys files should work, if you can find the right palette section to cycle.)

Code: Select all

function rangemod(i as single, start as integer, period as integer) as single
   
    dim as single j = i - start
    return j - int(j / period) * period + start
   
end function

function shiftindex( _
        i as integer, _
        start as integer, _
        period as integer, _
        cycle as single _
    ) as single
   
    if i < start orelse i >= start + period then return i
   
    return rangemod(i + cycle, start, period)
   
end function

function getcol(pal() as integer, i as single, start as integer, end_ as integer) as integer
   
    dim as integer j1 = int(i), j2 = int(i+1): if j2 = end_ then j2 = start
    dim as integer c1 = pal(j1), c2 = pal(j2)
   
    dim as single r1 = c1 shr 16 and 255, r2 = c2 shr 16 and 255
    dim as single g1 = c1 shr  8 and 255, g2 = c2 shr  8 and 255
    dim as single b1 = c1        and 255, b2 = c2        and 255
   
    dim as single m = (i - int(i))
    r1 += m * (r2 - r1)
    g1 += m * (g2 - g1)
    b1 += m * (b2 - b1)
   
    return (r1 and 255) shl 16 or (g1 and 255) shl 8 or (b1 and 255)
   
end function

sub shiftpalette(oldpal() as integer, newpal() as integer, start as integer, period as integer, cycle as single)
    #if 1
    '' make copy of oldpal so oldpal and newpal can be same array
    dim as integer oldpal_(0 to 255)
    for i as integer = 0 to 255: oldpal_(i) = oldpal(i): next i
    #else
    #define oldpal_ oldpal
    #endif
   
    dim as integer end_ = start + period
    for i as integer = 0 to 255
        'dim j as single = iif(i < 10, (i + cycle) mod 10, i)
        dim j as single = shiftindex(i, start, period, cycle)
        newpal(i) = getcol(oldpal_(), j, start, end_)
    next i
   
end sub



screenres 256, 256, 8
dim as integer pal1(0 to 255), pal2(0 to 255)

bload "C:\Windows\Prairie Wind.bmp", 0, @pal1(0)

dim as single i = 0
do
    shiftpalette(pal1(), pal2(), 0, 10, i)
    palette using pal2
    sleep 1
    i += 0.0625
loop until len(inkey)
angros47
Posts: 1508
Joined: Jun 21, 2005 19:04

Postby angros47 » Jul 30, 2010 19:40

The image used in the online demo was originally LBM files, converted to a internal format:

http://www.effectgames.com/effect/artic ... with_HTML5

By looking at the javascript source code, I found links to image sources:

http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage
http://www.effectgames.com/demos/canvas ... ocessImage

As far as I've understood, the triplets of numbers between square brackets in the first line could be palette informations (with red, green and blue values for every color); code between curly brackets should contain infos about how to cycle colors, and the long list of comma separated numbers (ranging from 0 to 255) should be pixel data.

So, setting a screen of 640,480, 8 bit, then reading these numbers and copying them to screen buffer, then setting palette should load the image. After that, color cycle should work... in theory!

I haven't tried yet.
Mysoft
Posts: 772
Joined: Jul 28, 2005 13:56
Location: Brazil, Santa Catarina, Indaial (ouch!)
Contact:

Postby Mysoft » Jul 31, 2010 1:37

yeah very nice usage of palette... who needs 32bits anyway? :P
angros47
Posts: 1508
Joined: Jun 21, 2005 19:04

Postby angros47 » Jul 31, 2010 23:15

Ok, I did it!

Here is the viewer:

Code: Select all

open command(1) for input as #1

dim as string a,b

line input #1, a

type cycle
   min as integer
   max as integer
   reverse as integer
   rate as integer
end type




screenres 640,480,8

screenlock
dim pixel as byte

dim dest as byte ptr=screenptr()

for y as integer=1 to 480
   for x as integer=1 to 639
      input #1,pixel
      *dest=pixel
      dest+=1
   next
   input #1,pixel
next
screenunlock

close #1

dim shared as integer p(255,2)
a=mid(a,instr(a,"[[")+2)

for i as integer=0 to 255
   b=left(a,instr(a,"]")-1)
   a=mid(a,instr(a,"[")+1)

   p(i,0)=val(left(b,instr(b,",")-1))
   b=mid(b,instr(b,",")+1)
   p(i,1)=val(left(b,instr(b,",")-1))
   b=mid(b,instr(b,",")+1)
   p(i,2)=val(b)
   palette i,p(i,0),p(i,1),p(i,2)
next

dim as cycle cycles (16)

for i as integer=0 to 15
   a=mid(a,instr(a,"reverse:")+8)
   b=left(a,instr(a,",")-1)
   cycles(i).reverse=val(b)

   a=mid(a,instr(a,"rate:")+5)
   b=left(a,instr(a,",")-1)
   cycles(i).rate=val(b)

   a=mid(a,instr(a,"low:")+4)
   b=left(a,instr(a,",")-1)
   cycles(i).min=val(b)


   a=mid(a,instr(a,"high:")+5)
   b=left(a,instr(a,",")-1)
   cycles(i).max=val(b)

next

sub Cycle (lowest as integer, highest as integer)
   dim as integer a,b,c
   a=p(highest,0)
   b=p(highest,1)
   c=p(highest,2)
   for i as integer= highest to lowest+1 step -1
      p(i,0)=p(i-1,0)
      p(i,1)=p(i-1,1)
      p(i,2)=p(i-1,2)
      palette i,p(i,0),p(i,1),p(i,2)
   next
   p(lowest,0)=a
   p(lowest,1)=b
   p(lowest,2)=c
   palette lowest,a,b,c

end sub

sub CycleRev (lowest as integer, highest as integer)
   dim as integer a,b,c
   a=p(lowest,0)
   b=p(lowest,1)
   c=p(lowest,2)
   for i as integer= lowest to highest-1
      p(i,0)=p(i+1,0)
      p(i,1)=p(i+1,1)
      p(i,2)=p(i+1,2)
      palette i,p(i,0),p(i,1),p(i,2)
   next
   p(highest,0)=a
   p(highest,1)=b
   p(highest,2)=c
   palette highest,a,b,c

end sub



dim t(15) as double

do
   for i as integer=0 to 15
      t(i)=t(i)+Cycles(i).rate/10000

      if t(i) >10 then
         if Cycles(i).reverse=0 then
            Cycle(Cycles(i).min,Cycles(i).max)
         else
            CycleRev(Cycles(i).min,Cycles(i).max)
         end if
         t(i)=t(i)-10
      end if

   next
   sleep 1

loop until inkey<>""


Download a file from links above, and with this program you will be able to view it.

I'd like to put online a file with all the animated pictures, but I don't know if I need permission from the author. So, for now, get the images from the official site.
robert8192
Posts: 35
Joined: Apr 27, 2010 15:03

Postby robert8192 » Aug 06, 2010 19:58

No Freeking Way.

How cool.

How did you figure this out.

Totally Freeking cool. Everyone should run this.

This is so ultimately Freeking Cool.

Like Absolute Zero Cool - -470Kelvin type stuff.

Rob.
rdc
Posts: 1713
Joined: May 27, 2005 17:22
Location: Texas, USA
Contact:

Postby rdc » Aug 06, 2010 21:42

Cool indeed.
counting_pine
Site Admin
Posts: 6172
Joined: Jul 05, 2005 17:32
Location: Manchester, Lancs

Postby counting_pine » Aug 07, 2010 15:14

Note: the reverse attribute (despite its name) isn't a boolean. There are several colour-cylcing modes - according to the Javascript code, there's a sine-wave mode and a "ping-pong" mode as well.
Thorham
Posts: 73
Joined: Apr 16, 2008 21:25

Postby Thorham » Aug 18, 2010 22:20

Fantastic! I've seen some color cycle images before, and they were all crap, but this is just astounding :)

I'm going to download all of these with a script, and convert them from crappy java script to binary.

Return to “General”

Who is online

Users browsing this forum: No registered users and 22 guests