Dark Bit Factory & Gravity

PROGRAMMING => General coding questions => Topic started by: ttemper on December 12, 2011

Title: the beginnings... and many questions.
Post by: ttemper on December 12, 2011
ok, so i have been messing around with tinyptc_ext, and converted my bmp to raw then bas for loading... and used the base code (with some mods) to get my logo up n displayed on screen (what a learning curve... persistence paid off).

ok, so heres the thing... i setup my screen for 800x600 to prompt for fullscreen/windowed, yet the option screen does not appear, it just goes directly into FS. what did i do wrong? nevermind... just changed the 0 to a 1 and it prompted me.

also, the logo i did put into a SIN wave on the X axis which is what i wanted to do, it works fine now (after i added in erase buffer), but 2 things....

1. how do i get the background from black to translucent? aka make it not show up so things under it are not hidden by the black rectangle.

2. how do i get the sinewave that ive put in place to not go so damn fast, it moves across screen back and forth too quick, i want to slow the timing down so its at a nice rhythm.

attached is the source and exe (so far), any thoughts, help, suggestions would be great. thx again.
Title: Re: the beginnings... and many questions.
Post by: Raizor on December 12, 2011
In answer to question 2, using something called Delta Timing is probably the best route.

At present, any updates you do in the main loop get called each frame. This means that the faster the computer, the fast everything runs.

Delta timing is used to control effects according to elapsed time, rather than frames (time vs fps essentially). This is a nice solution that works well and scales nicely for faster systems. Depending on the effect you're working on, the implementation can be a little bit more involved than just updating a variable or offset in the main loop, but generally it's not too difficult.

For something like a a sine based effect, I usually generate all my sine values in advance and store them in a look-up table (LUT). I then use the delta time to determine where in the sine table I should pull the value from (determine the sine table index). As your demo runs, you'll end up with index values that are outside the bounds of your sine table, so you'll need to do a modulus operation on your sine table index to stop it overflowing.

If you've not come across modulus before, it's a method for getting a remainder for a number (integer) when the number is divided by another number. For example, If my sine table has 100 entries and I'm changing the offset into the sine table each second by a value of 1, it will go 1, 2, 3, 4 etc.  Eventually it will reach 100 and go beyond the number of values in the sine table. To overcome this I just do something like this.

CurrentSineTableIndexValue = number of seconds (120, which is too big for the sine table)
FixedSineTableIndexValue= CurrentValue MOD 100 (120 MOD 100 gives us 20)

Shockwave posted on here a while back regarding using delta timing in Freebasic. So that's probably a good post to reference (http://www.dbfinteractive.com/forum/index.php?topic=587.msg7226#msg7226).

Hope this makes some sense. If you get stuck I'll take a look at your code. It's better that you try and get to grips with it yourself first though as you'll learn much more that way.
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 12, 2011
@Raizor, thanks for the reply, i briefly checked out a Shockwave post about delta timing, not entirely sure how to do/implement it atm, but i'll learn slowly but surely.

Im totally new to learning to code, like i said.. i script, but coding is a whole new ball game for me, and its like im getting struck out over and over.

i'll have a read of that post, thanks. the more i do myself, the more i will learn, yes. lots to learn and once again i jumped in the deep end. hehe.
Title: Re: the beginnings... and many questions.
Post by: Raizor on December 12, 2011
ttemper, you're welcome. Yeah it can be really frustrating when you're just starting out. Stick with it though, as the feeling when you get something working really kicks ass :)

Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 12, 2011
Nice first effect!

I hope you don't mind, I took a look through the code and made a few small changes.. The funny thing is that you had the delta timing code in there but you hadn't used it!

Nowadays I favour a simpler version of Delta Timing, just take the internal timer value at the start of the loop and look again at the end and get the difference, store the value in a floating point variable and just use that as the value to add to sin counters etc.

I've done that in the code below.. There's also a variable called rad2deg, it holds the value of pi/180 which is what you need to multiply a radian by to turn it into a degree and get a smooth movement, you'll see I've multiplied the sin + cos calculations by this number.

About pre-calculating the sine table - in this case there are only two sine calculations so the juice isn't worth the squeeze, but if you were making a plasma or a 3D routine that had a lot of calculations then a look up table would be a good idea.

The best part of this is that you've worked out how to resource a picture into your exe.

Code: [Select]

OPTION STATIC
OPTION EXPLICIT
'-------------------------------------------------------------------------------
' INCLUDES
'-------------------------------------------------------------------------------
#INCLUDE "TINYPTC_EXT.bi"
#INCLUDE "WINDOWS.BI"
'-------------------------------------------------------------------------------
'   SCREEN DIMENSIONS;
'------------------------------------------------------------------------------- 

CONST XRES = 800
CONST YRES = 600

DIM SHARED AS UINTEGER BUFFER ( XRES * YRES )
'-------------------------------------------------------------------------------
' DEJAVU LOGO
'-------------------------------------------------------------------------------
'Palette array
#INCLUDE "gfx\dejavupalpal.bas"
'Raw Image array
#INCLUDE "gfx\dejavubmpraw.bas"
'-------------------------------------------------------------------------------
'   DEJAVU IMAGE DIMENSIONS;
'------------------------------------------------------------------------------- 
DIM SHARED AS INTEGER IMGX = 640
DIM SHARED AS INTEGER IMGY = 160
'-------------------------------------------------------------------------------
'   TINYPTC_EXT SUB ROUTINE DECLARES;
'-------------------------------------------------------------------------------
DECLARE SUB WritePixelFast( byval intX As Integer, byval intY As Integer, byval intC As Integer )
DECLARE SUB DrawImage(byval xpos as integer,byval ypos as integer)
DECLARE SUB LoadDataImage()
'-------------------------------------------------------------------------------
'   IMAGE BUFFER;
'-------------------------------------------------------------------------------
REDIM SHARED img_buffer(1) as integer
'-------------------------------------------------------------------------------
'   RGB COLOR PALETTE BUFFER;
'-------------------------------------------------------------------------------
DIM SHARED img_r(256), img_g(256), img_b(256) as SHORT
'-------------------------------------------------------------------------------
'   DELTA TIMING;
'-------------------------------------------------------------------------------
DIM SHARED AS DOUBLE OLD,DV
DIM SHARED SINWAVE AS INTEGER

'LoadDataImage(Width, Height)
LoadDataImage()

'Open TinyPTC window
    PTC_ALLOWCLOSE(0)
    PTC_SETDIALOG(1,"DEJAVU TEST!"+CHR$(13)+"Full Screen?",0,1)               
    IF (PTC_OPEN("http://www.dbfinteractive.com",XRES,YRES)=0) THEN
    END-1
    END IF   

   
    DIM SHARED AS DOUBLE RAD2DEG
    RAD2DEG=4*ATN(1)/180


'-------------------------------------------------------------------------------
'   MAIN LOOP;
'-------------------------------------------------------------------------------
WHILE (GETASYNCKEYSTATE(VK_ESCAPE)<> -32767 and PTC_GETLEFTBUTTON=FALSE)
   

OLD=TIMER

SINWAVE = SINWAVE+DV


DRAWIMAGE(80+(80*SIN(SINWAVE*RAD2DEG)),0)
DRAWIMAGE(80+(80*COS(SINWAVE*RAD2DEG)),YRES-IMGY)

Ptc_Update @BUFFER(0)
ERASE BUFFER
SLEEP 1

'-------------------------------------------------------------------------------   
'   DELTA TIMING;
'-------------------------------------------------------------------------------   

    DV=(TIMER-OLD)*150
    IF DV>5 THEN DV=5
 
WEND

'Close TinyPTC window
Ptc_Close()

'-------------------------------------------------------------------------------
'   TINYPTC_EXT SUB ROUTINES;
'-------------------------------------------------------------------------------
Sub LoadDataImage()
    dim i as integer

    'Loads Color palette
    for i = 0 to 255
                      'Palette array name
         img_r( i ) = dejavubmp.pal (i*3  )'Red color
         img_g( i ) = dejavubmp.pal (i*3+1)'Green color
         img_b( i ) = dejavubmp.pal (i*3+2)'Blue color
    Next
   
    'Fix image size
    while ((imgx mod 4) <> 0)
        imgx += 1
    wend

    ReDim img_buffer(imgx*imgy)
   
    for i = 0 to (imgx*imgy) - 1
                         'Raw image array name
         img_buffer(i) = dejavubmp.raw(i)
    next 
       
End Sub

Sub DrawImage(byval xpos as integer,byval ypos as integer)
    dim x,y,pixel as integer
   
    for y = 0 to imgy-1
        for x = 0 to imgx-1
            pixel = img_buffer(x+(y*imgx))
            WritePixelFast( x+xpos,y+ypos, (img_r(pixel) Shl 16) Or (img_g(pixel) Shl 8 )  Or img_b(pixel) )
        next
    next
   
End Sub

Sub WritePixelFast( byval intX As Integer, byval intY As Integer, byval intC As Integer )
    If ( intX>0 And intX<XRES-1 ) And ( intY>0 And intY<YRES-1 ) Then
        Buffer( intX + (intY * XRES) ) = intC
    End If   
End Sub

Last hint (about the transparrent background colours)
If you load the file dejavupalpal.bas into the editor and look at the first 3 bytes;

Code: [Select]
&H00,&H00,&H01,etc....

Change them to;

Code: [Select]
&HFF,&H00,&HFF

In the file they are R,G,B ,R,G,B etc... So by doing that you've just changed the first colour to pink.

Now find this code;

Code: [Select]
    for y = 0 to imgy-1
        for x = 0 to imgx-1
            pixel = img_buffer(x+(y*imgx))
            WritePixelFast( x+xpos,y+ypos, (img_r(pixel) Shl 16) Or (img_g(pixel) Shl 8 )  Or img_b(pixel) )
        next
    next

And change it to;

Code: [Select]
   dim rgbc as integer

    for y = 0 to imgy-1
        for x = 0 to imgx-1
            pixel = img_buffer(x+(y*imgx))
            rgbc = (img_r(pixel) Shl 16) Or (img_g(pixel) Shl 8 )  Or img_b(pixel)       
            if rgbc<>&HFF00FF then WritePixelFast( x+xpos,y+ypos, rgbc)
        next
    next


Then Pink will be treated as the mask colour..  You could use the value in pixel as the mask too if you just wanted to eliminate colour index(es) to make stencil effects..

Hope that helps and K+ for figuring how to draw the pictures :)
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 13, 2011
@Shockwave, much thanks for that code snippet, it did the trick nicely for slowing down the motion of the logo(s).

Yes i did have the delta timing in there (pulled it from source code found on DBF to try any work out how it actually functioned). I guess the more I read, the more I will learn, but also messing with code, looking up function definitions, etc help me understand also. HUGE learning curve for me, but im slowly learning... SLOWLY. hehe.

I did change the palette to &HFF00FF as you said, and it worked nicely with that slight change in code and the bg colour is now translucent :)
Code: [Select]
if rgbc<>&HFF00FF then WritePixelFast( x+xpos,y+ypos, rgbc)
So i take it, if the current pixel colour doesn't equal FF00FF (the <> code) then proceed with the code/function. Normally in scripting code its "!=" not "<>", still getting to terms with the slight changes.

My next task i want to try and construct is a custom bitmap font drawn on screen via a (sine) scroller.

I have checked out (ripped) more code from findings on here to learn from, but I've sort of hit a roadblock. The thing is, the bitmap font is laid out like "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789.,()-:; " in a 512x128px in 32px blocks, so its not the 'regular' pattern from char32 onwards with " !?" etc

i got the scroller code from http://www.dbfinteractive.com/forum/index.php?topic=3541.0 (http://www.dbfinteractive.com/forum/index.php?topic=3541.0) and tried to modify it somewhat... ok i have the bitmap loaded into 32x32 chunks, it displays but in the wrong order and the background is white (as in the original bmp)...

1. how do i specify in a string where to show the structure of the bitmap? eg if the string is "ABCDEFG....", and the chunk size is 32x32 and wraps at 512px wide, then drops down 32px etc... so then it refers to the set variable to pull the correct character.

example..

Code: [Select]
#INCLUDE "gfx\fontpal1.bas"
#INCLUDE "gfx\fontbmp1.bas"
const bmfont_chars(1) = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789.,()-:; "

#INCLUDE "gfx\fontpal2.bas"
#INCLUDE "gfx\fontbmp2.bas"
const bmfont_chars(2) = " !?#$%&'()*+,-./0123456789:;‹=›?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_'abcdefghijklmnopqrstuvwxyz{|}~     "

etc?

if i were to grab character 'F', it would be search for letter F in bmfont_chars and trim to it? len(bmfont_chars) to find how far along 'F' is, then multiply it by 32 then pull the 32x32px bitmap character, so in that case it would be 6th letter in (6th char x 32pixels = topleft coords 0,192 to bottom right coords 32,224) of the bitmap as a 32x32 box right? idk, gettin a lil confused...

anyways... as i have it at the moment, the font is displaying on screen in 256colours with white bg but the character order is all messed up due to not being in the uniform order as a normal charset is.

2. the other thing is this... if i want to put in multiple graphics into the routine, do i have to duplicate the LoadDataImage, DrawImage, WritePixelFast each time? what im sayin is, cant i just parse the details to the function LoadDataImage, and it will reference it to a number?

eg...
Code: [Select]
logo_1 = LoadDataImage(logo1.pal,logo1.raw,512,128)which would return to 'logo_1' so then i can do
Code: [Select]
Drawimage(80,100,logo_1) which would draw my logo 80px across, 100px down on screen. just a thought.

3. with a sinewave scroller with the current delta timing for the logos, if i just leave it 'as-is', the scroller runs at the same speed as the logos, do i need to calculate another sinewave/delta time specifically for the scroller if i were to change the speed?

hell. so many questions. sorry. just trying to learn, and its a BIG learning curve for me, you have all been helpful so far, i just don't want to burn that help out with you guys thinking 'omg not more questions!'

thanks in advance :)

attached is the current (messy) code and exe.
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 13, 2011
ok, so i redid the bitmap font and put bg colour to 255,0,255 so its easier to mask with, and made sure the anti-alias' crap was off, so it didn't bleed into the background. attached is the updated fontbmp pal + raw.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 13, 2011
You're doing well :)

First of all please don't apologise for asking questions, we're all here to learn new stuff and pass on the things we know, if it wasn't for people asking questions then this place would become stale pretty quickly.

I'll try to answer most of your questions;

Quote
So i take it, if the current pixel colour doesn't equal FF00FF (the <> code) then proceed with the code/function. Normally in scripting code its "!=" not "<>", still getting to terms with the slight changes.

and some pointer to show where you are in the string which is increased each time the scrolltext has moved over by one letter, you can get the character from the string like this;

Usually you'll have a string containing your text;

TXT =" HELLO WORLD "

and some pointer to show where you are in the string which is increased each time the scrolltext has moved over by one letter, you can get the character from the string like this;

C = MID(TXT,POINTER,1)

Which gets the character next to the pointer, think of Mid as similar to sub5tr in php only Mid is easier to use.
You can then either loop through another string of characters to find the one you've located which is perfectly file - in fact you've eluded to it in your post or you can use the ascii value (which I like better).

As the usable characters in a font start at chr(32), if the first character in the font is a space then you should subtract 31 from the ascii value of the letter you got to give the letter number in your font.

If the font is laid out in ascii order then you can simply multiply the ascii value - 31 by the width of one letter to locate the start position in your font strip.

In fact, going back more years than I care to remember on the beloved Amiga I've even precalculated the letter offsets and stored them as bytes to save valuable scan time :)

These days, there is so much power on tap that it doesn't really matter which way you do it.

About having another delta value for the sinescroll, that would be cool, as long as it used the same delta value as a basis for what's added to it then it would be fine as everything would speed up / slow down proportionally.

Hope that helps :)
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 13, 2011
Apologies for the edit above.. when I tried to post the word sub5tr with it's correct spelling our hosts security software apparently didn't like it!
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 14, 2011
Ok, thanks for the response... still kinda confused to it all about the bitmap font and how I calculate and display the proper chars, guess I'll dig up some more code to learn by.

As for question 2. those image subroutines, do i need to duplicate those each time I introduce a new logo? It would make more sense to have the routines and then parse the info to them instead of 3 sub routines similar to each other for each logo/picture/bmpfont.

the whole...
Code: [Select]
logo_1 = LoadDataImage(logo1.pal,logo1.raw,512,128)
^ would parse the logo1.pal and logo1.raw with the dimentions to 'LoadDataImage' which then would be held in 'logo_1' for me to use.

for example...

Code: [Select]
Drawimage(80,100,logo_1)
^ would then tell 'Drawimage' to display 'logo_1' starting at top/left 80x100 onwards.

Again, not sure 'if' this can be done, or a static sub routine for each one is needed for tinyptc_ext each time. Just a thought.

But at the moment, I think I will stick to the one logo and concentrate on figuring out how to get that bitmap font displayed correctly. My best choice would be to change the font to one with the proper ascii order and go from that, instead of the one that is out of order.

Here goes!
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 14, 2011
Quote
Ok, thanks for the response... still kinda confused to it all about the bitmap font and how I calculate and display the proper chars, guess I'll dig up some more code to learn by.

There's a lot to get to grips with, but the answer is in my post above believe it or not.

If your letters are set out like;

 !"#$%&'()*+, .... etc

and you know that space is chr(32), exclamation is chr(33) etc.. Then all you need to do is subtract 31 from the ascii value of the letter you have to get the number of the letter in the font and from that you can calculate the offset or even relate it to a look up table with the letter positions and widths (if you're using proportinal fonts).

About functions and code re-use - that's definitely a good idea to do.  A graphics function for example can have many images on one page and you can pass it the screen x+y positions to tell it where to draw, the mask colour to tell it what colour to ignore, and also the start x, start y, width and height .

If you think about it, you're doing it already because all the letters in the font are stored in one image and you're just cutting out little bits of it.

Title: Re: the beginnings... and many questions.
Post by: ttemper on December 14, 2011
after a few more hours of coding (or at least trying to), i redid my bitmap font to 2048x32px as for the moment im not sure what part of the code to add/change to get my 256x256 (32px per char) font working. still learning slowly... i have the concept in my head, but putting it into a subroutine at the moment is a lil' frustrating, i get lost quick.

so i managed to load in the bitmap font and get the chars to display A for A, B for B, etc, but the background is showing... that horrible pink that is suppose to be hidden. hehe. help!

i also had an attempt at making the LoadDataImage so i could parse strings to it then it store the output to another variable to use. but i couldn't get that working either. :/

Code: [Select]
LoadDataImage("logo1","logo1.pal","logo1.raw",640,160)
would parse the palette and the raw for processing, with the 640x160px and store it back to "logo1" so then i could call...

Code: [Select]
DrawImage("logo1",80,0)
would display the "logo1" image of 640x160 at starting point 80,0 to 720,160 (640x160 image)

but i had no success, kept getting an error which i didn't know how to fix.

Code: [Select]
DIM SHARED IMGX AS INTEGER
DIM SHARED IMGY AS INTEGER

DECLARE SUB LoadDataImage(BYVAL bMAP AS INTEGER ,BYVAL bPAL AS STRING , BYVAL bRAW AS STRING ,BYVAL IMGX AS INTEGER,BYVAL IMGY AS INTEGER)

LOADDATAIMAGE(1,"dejavubmp.pal","dejavubmp.raw",640,160)

SUB LoadDataImage(BYVAL bMAP AS INTEGER ,BYVAL bPAL AS STRING , BYVAL bRAW AS STRING ,BYVAL IMGX AS INTEGER,BYVAL IMGY AS INTEGER)
   
    DIM i as INTEGER
 
    'Loads Color palette
    for i = 0 to 255
                    'Palette array name
         img_r(i) = bPAL (i*3  )'Red color
         img_g(i) = bPAL (i*3+1)'Green color
         img_b(i) = bPAL (i*3+2)'Blue color
    Next
   
    'Fix image size
    while ((imgx MOD 4) <> 0)
        imgx += 1
    wend

    ReDim img_buffer(imgx*imgy)
   
    for i = 0 to (imgx*imgy) - 1
                         'Raw image array name
         img_buffer(i) = bRAW(i)
    next 
       
End Sub

but like i said, it didnt work.

1. is, how do i fix my bitmap font to display properly without the background colour? i tried and tried and tried... no success.

2. is there any subroutine like this that i will only need once in the code, and im able to call as many pictures/logo's to it and store them in those variables ready for calling with DrawImage? or i will (attempt to) write my own.

thanks again.

attached is the current source/exe in rar 'so far'.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 14, 2011
Good progress..

To make the font transparent, just replace the LFDrawImage sub with this one;

Code: [Select]
SUB LFDrawImage(byval xpos as integer,byval ypos as integer,byval SX as integer,byval SY as integer)
    dim as integer x,y,pixel,mong,intx,inty,xxx,yyy,VLU,TT   
    XXX=XPOS
    YYY=YPOS   
    TT=1       
    for Y = SY to SY+32-1 'EACH CHAR IS 32PX WIDTH
        for X = SX to SX+32-1 'EACH CHAR IS 32PX HEIGHT       
            PIXEL = LFimg_buffer(x+(y*lfimgx))
              MONG = (LFimg_r(pixel) )                       
                INTX = XXX
                INTY = YYY           
            IF pixel<>0 THEN
               IF ( XXX>0 And XXX<XRES-1 ) And ( YYY>0 And YYY<YRES-1 ) THEN
                Buffer( XXX + (YYY * XRES) ) = MONG
               END IF
            END IF                   
            XXX=XXX+1
        next       
            YYY=YYY+1
            XXX=XPOS
    next   
End SUB

I've gone by the index instead of &HFF00FF as the mask colour as I think the base colour of your pictuce had become altered slightly somehow.

The subroutine you want to write to load pictures is possible, but tricky because you will need several buffers or a large continuous buffers to load them into.

Why don't you take the advice I gave above and have all your graphics on one page and rewrite the sub that draws the logo to behave more like the one that draws the font letters?

It makes more sense to do it that way... I've got code that does this but have a go yourself first :)
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 15, 2011
@Shockwave... much thanks again, that solved my pink bg issue. wonder why its not pulling the correct pixel colours. in the palette it shows FF00FF as the bg colour, yet in the raw it shows as 000000? idk. not sure how or why it was translated wrong via bin2raw/bas.

for only coding for ~2 weeks (1st week was darkbasic, 2nd is freebasic) i think im doing 'ok'. i can see the coded routines and can modify them somewhat to what i need, but atm its just baby steps. if i were to code things from scratch at the moment, i think i would be lost until i actually work out what these routines do (with using the includes). i think i need to go through the entire index of commands and learn what does what and what function it has, then i would have more understanding how things operate.

by messing around i managed to separate the font pixels on screen, so it was ". . . ." instead of "...." etc. i added to the x and y then multiplied the xpos by the same and it stretched the chars nicely, although it was rather hard to see (sorta like a dotmatrix effect) and very translucent/dark.

i think my next objective is to sinewave the scroller properly. at the moment it only sines up and down (wave effect), but i want it to sine left to right with movement also... like character wave. (i know what i mean in my head, its hard to explain). so instead of the whole row of chars moving together, to actually 'bounce' sinewave them individually whilst the sinewave also moves along so the bounce isnt always in the same position. probably a walk in the park for most of you, but for me... more learning. :)

well i got distracted from this post... and coded some more... found a nice routine for putting in bg colours on screen, line rasters, etc, so i used it n adapted it for my own. works nicely.

q'. now that i have the scroller functioning properly, how do i go about fading in and out the borders for the scroller? do i use a 'copperlist' and overlay it with the coordinates over the scroller on the edges... eg a box 50x50 and fade it from solid black on the left to translucent on the right? not quite sure how to implement that one... thoughts?

again, much thanks for everyones help. especially Shockwave.

Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 15, 2011
Seems like you're having fun :)

WHat kind of copperlist effect are you trying to get?
Do you have a youtube link or a pic?
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 16, 2011
well, what im actually trying to achieve is a fade in right/fade out left scroller. at the moment the entire screen res, border to border it just wraps with no fade, just falls off screen.

what i want to do is say put a mask over the coordinates of the left border 100px wide by YRES fading from black to translucent over those 100px from left to right, so then that would be placed over my scroller to give the effect that its fading out at the border. and of course do the same for the right border. XRES-100*YRES, fade from translucent to black.

^edit, so it seems i cannot do a fade in/out effect with a 256 colour palette, only true colour? ive seen a binary scroller where Shockwave faded near the borders using diff colours, thats the sorta effect im trying to get at, but how to i adapt that to my 256 colour bitmap scroller?

i tried to set alpha transparency on some lines, but all that does is dim the colour, not make it transparent.

having fun... yeh. lots to learn... getting a lil' frustrated at times (as i tend to jump in the deep end). if there are any tutorials or basics that i can have a read up on, let me know.

i spent a couple of hours yesterday trying to work out how to sinewave (characters) the scroller proper instead of just a full width up/down wave.... to no success yet. in due time i think.

as for the copperlist, thats for the bg colours and fades, that was fairly easy to understand what went on. generate the palette, then create the colours for the screen coords then buffer them to screen. no i dont have a link or youtube link... was just trying to think of possible ways to create the fade in/out scroller effect.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 16, 2011
Sorry, what do you want to do?  -  Do you want to fade the letters out to black at the edges or do you want to make them more and more transparent towards the edges?

Either way it's probably a little bit fiddly so if you let me know which one you want to do and post your latest version of the code I'll try and write you something tonight if I get time, if not tomorrow, you'll be able to pull it apart and see how it works then.
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 16, 2011
well, i was trying to put a mask over the scroller, but it seems i cant do that (a black to translucent faded box).

but if i were to fade the scroller, it would fade from the 256 colours say 50px from left border, from translucent to full 256 colour to give that fade out effect. i dont want it to fade to black, as then it covers/masks out the background, which i dont want.

| <-------F | is the fade, then the rest of the scroller here, then right border would be | F-------> |

so the > and < are the translucent sides, the F is the full colour. each fade would be 50px (or 100px).. thats if i faded the scroller.

the code is messy and all over the place as i have been trying different things to get use to the code and functions, etc... again... lots to learn.

thanks for your input/insight. much appreciated (as always).

code and exe attached.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 17, 2011
Thanks ttemper - Sorry I've had a lot of things to do at home today and yesterday, I'll have some more time top do this tomorrow definitely.
Title: Re: the beginnings... and many questions.
Post by: Hotshot on December 17, 2011
Looking GOOD and keep going  ;D
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 18, 2011
@Shockwave. np, no hurry at all. I'll still mess around with things some more, etc. Already changed up the code a lil' again, but depending on how these translucency's work I may just have to change them back as I use the (RGBA) alpha channel to fade my rasters atm.

@Hotshot. thanks, its all learning... and the code is messy as, as i was testing things. Once I learn more and understand how things operate, etc I will complete it. Until then, its still learn learn learn. :) btw, how long you had this handle/nickname for? I was known as 'HotShot' back in c64 days. Ran a small group named 'STRIDER', mainly traded, did graphics... tried to learn to code, but was over my head at the time, although I was and still am a big demo scene fan. HotShot, Druid, Tonster. Also use to be involved with 'The Force' aka 'The Atomic Force', 'Sabotage' and a few others. Fun times, just a shame I didn't learn to code in ASM back then.

Thanks for all the help guys.
Title: Re: the beginnings... and many questions.
Post by: Hotshot on December 18, 2011
Quote
btw, how long you had this handle/nickname for?

I used be very good at POOL when I potted 7 Balls hence why they called me  "HOTSHOT" at Deaf College when I played them! LOL  ;D

Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 19, 2011
I just had a look at your example - it's really cool :)

anyway, please see the attached file, I've made an additive blend sub for you;

Code: [Select]
SUB BlendPixel(byval DX as integer, byval DY as integer, byval opacity as double, byval pwrite as integer)
   
    ' ****************************************************************************************
    ' * This could be done better with a predefined function - it's just broken down into    *
    ' * stages here for illustration purposes                                                *
    ' ****************************************************************************************
   
    DIM RDV AS INTEGER
    DIM GDV AS INTEGER
    DIM BDV AS INTEGER
   
    DIM RWV AS INTEGER
    DIM GWV AS INTEGER
    DIM BWV AS INTEGER

    DIM RCV AS INTEGER
    DIM GCV AS INTEGER
    DIM BCV AS INTEGER


    DIM GPX as uinteger
    GPX = BUFFER(DX+(DY*XRES))

    RWV = ((pwrite shr 16) and &H000000FF) * OPACITY
    GWV = ((pwrite shr 8) and &H000000FF)* OPACITY
    BWV = (pwrite  and &H000000FF)* OPACITY
   
    RDV = (GPX shr 16) and &H000000FF
    GDV = (GPX shr 8) and &H000000FF
    BDV =  GPX  and &H000000FF

    RCV = RWV+RDV
    GCV = GWV+GDV
    BCV = BWV+BDV

    IF RCV>255 THEN RCV = 255
    IF GCV>255 THEN GCV = 255
    IF BCV>255 THEN BCV = 255
   
    BUFFER(DX+(DY*XRES)) = RGB(RCV,GCV,BCV)
   
END SUB

It's not the best way of doing it, in fact whenever I do stuff like this I predefine an instruction (you can do this with #DEFINE) and with a bit of bitshifting and anding you can get a fast alpha blend function.

I've made the sub in this way so that you can see how to chop up an rgb value, mess with it and combine it.

Anyway here's how to use it;

Code: [Select]
BLENDPIXEL(SCREEN X , SCREEN Y, OPACITY , RGBCOLOUR )

Opacity should be a number between 0 and 1
0 is totally transparrent, .5 is half transparrent, 1 is fully opaque etc..

It blends the RGBCOLOUR pixel you give it with whatever is at screen x and screen y.

Hope that helps :)
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 20, 2011
@Shockwave. Thanks for that.. now i'll have to sit down and try to work out what you did. Wasn't what i was after tbh, but I can always use that elsewhere. In you binaryfont demo bdf.bas, you have a binary scroller at the bottom which fades from 'grey' to 'dark purple' (i think), thats the kind of effect im looking for for my bitmap scroller, but instead of fading from a colour to a colour, i want to fade from the full 256 colours, to translucent (the actual scroller is translucent the closer it gets to the screen borders). Hard to explain.... I added a png file to show the effect I am after. So basically, anything underneath the scroller would show through when the scroller bitmap itself faded to translucent.

I think I'm getting ahead of myself tho', as I'm having trouble enough understanding some of the code and what does what still. As for that translucent pixel subroutine you did, that would work well for rasterbars.

I also tried to get those copperbars running vertically, but couldn't do it :/ rather than set it out like....

Code: [Select]
FOR LP = 1 TO YRES-1
Buffer ((20+LP*XRES))=&h0a000b00
Buffer ((19+LP*XRES))=&h0a000b00
Buffer ((18+LP*XRES))=&h0a000b00
Buffer ((17+LP*XRES))=&h0a000b11
NEXT

I tried to use the custom copper routine, but to no success... eg.

Code: [Select]
for LP=1 to XRES*YRES
            customcop(LP)=&h0a000b18
            SELECT CASE LP
            CASE 0 TO XRES*10
            customcop(LP)=&h0a000b22
            CASE XRES*10 TO XRES*20
                customcop(LP)=&h0a000b33
            CASE XRES*20 TO XRES*30
                customcop(LP)=&h0a000b44
            END SELECT
NEXT

IDK, gettin rather confused with it all atm, its a bit overwhelming trying to understand it all when I have little idea how things work atm. Appreciate all the help tho', as I'd be well stuck without it.

* attatched is the effect i was looking for.


Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 20, 2011
Yep, the routine I wrote for you does the effect you posted - It's definitely the effect you wanted, I was hoping to see if youd work out how to use the routine I made to achieve the effect. You need to decrease the capacity of the pixels towards the edges.  My routine has a parameter that you can change from 0 to 1.  Read the post again and look at the routine again carefully.  A hint for you, on the scroll text letter routine you need to work out how far from the edge you are and if you are in the region you want to fade, turn that distance between the pixel you want to plot and the edge into the opacity value.

If you're still stuck let me know and I'll give you another hint.:)

[edit = spelling mistakes caused by mobile phone "predictive text correction" fixed]
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 20, 2011
hmm, I had that in the back of my mind tbh about that procedure, eg working out 100px from the left border then doing a transition fade from solid to translucent. In the mean time, i did mess around with the function and saw that if I overlay it on the logo's, I can get some sort of 'negative' effect if I switch up the sub routines values... something to mess with later on i guess.

I'll have a play with what you said, see if I am able to do it. It's still a big learning curve for me, so no doubt I will get stuck.

Thanks again.

*edit.... tbch... im frazzled, ive tried to understand what to do where n how n why.. but no luck. :/ like i said, think im getting too far ahead of myself for a newbie coder.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 20, 2011
No worries, I'll show you how to use it then :)

Stay tuned.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 20, 2011
Here you go, I've addressed a lot of the things you've asked about and optimised the code a bit.

No time for any more today I'm afraid as I have presents to wrap :)

Do let me know how you get on though and if you need any more help.

Cheers!

Title: Re: the beginnings... and many questions.
Post by: ttemper on December 20, 2011
Much thanks Shockwave.... you know before my frustrations, I did actually put... blendpixel(SX,SY, 1, MONG) underneath Buffer( XXX + (YYY * XRES) ) = MONG in that sub function for a test, but it threw dots up top of the screen... so I kinda gave up (tiredness and just not being able to think straight doesn't help either). Your code is helping me understand more though which is good.... hell, theres lots to learn... and here I was in DarkBasic throwing things together easy as pie within a couple of days, now FreeBasic is halting me every which way it can. Weird.

As for the coppers, its better to do it the ASM way? cos tbh, I understand the old copper structure, how they are made and put to buffer, but now.... I wouldn't have a clue how they work. ASM isn't my strong side, never could understand it.

As for the effect, very nice, that is indeed how I envisioned it... although one thing... the fade out from opacity 1 doesn't blend very well. its a harsh fade atm. I quickly messed with it to see what did what, and i changed the OPACITY 1 to .8 which then blends from sided to main proper (as I wanted it to), but I'm left with a pink tinge over the whole scroller.... which I didn't want. I guess I'll mess around some more n see if i can extend the fade from 0 to a full 1 and not .8 opacity. Thanks again.

I tend to get frustrated quickly when I learn and can't figure things out... code newbie ftl :/

*EDIT

If I set the code like this....

    IF EDGE<100 THEN
            OPACITY = EDGE/100
    ELSE
            OPACITY = .9999999999999999
    END IF

then it blends much nicer, but the font looks washed out... is there a tradeoff? or can the font be opacity 1 with a nice fade instead of seeing the border where it begins to fade?

*EDIT

changed the bottom raster/coppers to blue fade to back/translucent and the scroller seems to fade out ok with opacity 1 set, so I guess it has alot to do with the bg colour AND the font colours to what blends nice, and what doesn't. Thanks again.
Title: Re: the beginnings... and many questions.
Post by: Shockwave on December 20, 2011
I'm glad it's working a bit better for you :)

About the ASM way of drawing the copper lines, it is definitely among the fastest ways of doing it, not much slower than simply erasing the buffer and even if you don't understand the code it's easy for you to change as all the colour values for each line are in data statements at the bottom of the listing so to change the colours, just change the data :)

As for the blending, it can be difficult to get right, there are lots of different methods of blending, I've just done a very basic blend for you to get started..

You could try different blend methods in that blend sub..

Multiplication Blend:
Code: [Select]
(Colour1 * Colour2) /255

Screen Blend (inverts the colours before multiply blending but should result in a somewhat brighter image):
Code: [Select]
255 - ((255 - Color1)*(255 - Color2))/255

There are loads more different blend techniques, it's just a case of experimenting!

btw, when you use .9999999999999999 as the default opacity, it means that all the scroller pixels are drawn with the blend function, not just the edges which isn't really desirable as it will look washed out and take longer to draw the whole scroll.
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 21, 2011
hmm, well that worked... must be something in my text causing an error in posting... idk. anyways...

thanks. :)

yeh, i figured by setting the opacity to less than 1 it would then use the blend function for all. i wasn't happy using it all like that, so that's why i changed the raster lines below to blue etc, soon as i did that the scroller fades with opacity 1 set looked a lot cleaner transition from opacity 1 (100px in) to fade out (on the edge border). seeing that the font is more blue orientated i thought it would fit/blend nicer... and it did.

i understand the hex colour codes np, but as for the 'data' lines. how does the script know where to pull the information from for the customcopper?, as i see no reference to 'data' in that proc.

also that asm code, able to explain what is happening to the stack there please. i see tc and slice are an integer, and pp is a pointer for the buffer(x*y), but i have no clue what the asm code does.

slowly understanding things.... and you (and others) are probably thinking 'damn newbie'. :/

*edit, it seems it didn't like the code I placed in here, even though I had it within the [ code ] brackets.

question... i've tried to get scroller1 doing a nice sinewave effect, yet i cant seem to do it... i have no clue as to why, i referred to other source code on here... but no success. :/ help is needed again.. what the hell am i doing wrong? :/
Title: Re: the beginnings... and many questions.
Post by: ttemper on December 22, 2011
ok, after still attempting to create this sinewave... i give up, i don't know what im doing wrong, and i cant find any reference material to read over or learn from... its like trying to find a diamond in a volcano surrounded by alligators... just aint gonna happen.

extremely lost on what im doing wrong. i can make it wave back an forth, and up and down, but as for individual letters doing the whole wave... nup.

please elp! (yeh im that frustrated i lost my letter h)


*EDIT....

Ok.... after some more messing and referring to code on this forum (much much help), I have seemed to now have been able to sinewave my scroll... \o/... frustration got the better of me before, but after trial and error, I know know how to do it. again... \o/. hehe.

I'll be sure to ask more and more questions as time goes on... but I will attempt to code things myself. Your help is always much appreciated.