Denthor/Asphyxia’s VGA trainers: The Scrolling Saga

This is Denthor here with the 5th part of the ASPHYXIA VGA Trainer Series: The Scrolling Saga. I have had many requests for information on scrolling, so I decided to make it this week’s topic. If you have ever seen a demo, you have probably seen some form of scrolling.

DENTHOR, coder for ...
_____   _____   ____   __   __  ___  ___ ___  ___  __   _____
/  _  \ /  ___> |  _ \ |  |_|  | \  \/  / \  \/  / |  | /  _  \
|  _  | \___  \ |  __/ |   _   |  \    /   >    <  |  | |  _  |
\_/ \_/ <_____/ |__|   |__| |__|   |__|   /__/\__\ |__| \_/ \_/
smith9@batis.bis.und.ac.za
The great South African Demo Team! Contact us for info/code exchange!

Grant Smith, alias Denthor of Asphyxia, wrote up several articles on the creation of demo effects in the 90s. I reproduce them here, as they offer so much insight into the demo scene of the time.

These articles apply some formatting to Denthor's original ASCII files, plus a few typo fixes.

Our SILKYDEMO has quite a nice example of scrolling. What it is, is a long row of text moving across your screen, usually from right to left, e.g.:

         H     : Step 1
        He     : Step 2
       Hel     : Step 3
      Hell     : Step 4
     Hello     : Step 5
    Hello      : Step 6

What do we scroll?

Usually, letters. Most groups put greetings and information in their ‘scrollies’, as they are termed. You can also scroll and entire screen using the scrolling technique. Scrolling your text is a hell of a lot less boring then just having it appear on your screen. Unfortunately, ‘scrollies’ have been used so many times in demos they are wearing a bit thin, so usually they are accompanied by a cool picture or some nice routine happening at the same time (In our SILKYDEMO we had a moving checkerboard and colour bars going at the same time).

How do we scroll from side to side?

The theory behind scrolling is quite easy. Let us imagine that we are scrolling a 16x16 font grabbed by TEXTER (;-)) across the top of the screen (i.e. 320 pixels) As we know, the VGA screen starts at zero at the top left hand part of the screen, then counts up to the right to 319, then goes back to the left hand side one pixel down at 320 (see part 1). This means that a 16*320 scroller takes up the space 0 to 5119 on the screen. In ASCII this looks like this:

            (0)   .                                    .  (319)
            (320) .                                    .  (639)
                            "             "           "
           (4800) .                                    .  (5119)

Simple enough. Now what we do is we put down the first Y-line of the first character onto the very right hand side of the screen , like so:

For loop1:=1 to 16 do
  Putpixel (319,loop1-1,font['A',1,loop1],vga);

This will draw some stuff on the very right hand side. Your screen should now look like this:

            (0)   .                                   X.  (319)
            (320) .                                   X.  (639)
                            "             "           "
           (4800) .                                   X.  (5119)

Next, we move each line one to the left, i.e.:

For loop1:=0 to 15 do
  Move (mem[VGA:loop1*320+1],mem[VGA:loop1*320],320);

This scrolls the screen from right to left, which is the easiest to read. To scroll the screen from left to right, swap the +1 onto the other side of the command. Also, to increase the size of the portion scrolled, increase the 15 to however many lines from the top you wish to scroll-1.

After this move, your screen will look like this:

            (0)   .                                  X .  (319)
            (320) .                                  X .  (639)
                            "             "           "
           (4800) .                                  X .  (5119)
                                                      ^
                                                Note this space

What you then do is draw in the next line on the right hand side, move it, draw the next line, move it etc. etc. Tah-Dah! You have a scrolly! Fairly simple, isn’t it?

How do we scroll up or down?

To scroll up or down is also fairly simple. This can be used for ‘movie credit’ endings (I once wrote a little game with a desert scrolling down with you being a little robot on the bottom of the screen). The theory is this: draw the top line (or bottom line) then move the entire screen:

Move (mem[vga:0],mem[vga:320],63680);
  { 64000 - 320 = 63680 }

For scrolling down, or:

Move (mem[vga:320],mem[vga:0],63680);

…for scrolling up. You then draw the next line and repeat.

Because of the simplicity of coding in a scrolly, most demos have one. It is usually best to have something extra happening on the screen so that the viewer doesn’t get too bored, even, as I say, if it is only a really nice picture.