Computer Science Canada

Basic Loading bar
Author:  copthesaint [ Thu Mar 12, 2009 2:50 pm ]
Post subject:  Basic Loading bar
My class was asked to do a project of a loading bar over the next hour,
I decided to do one as well. Here is the loading bar for anyone who may want it.
Why not post a awsome loading bar you have made here?

Turing:
View.Set ("offscreenonly,title:Awsome Loading Bar,nobuttonbar,graphics:800;600")
type Color :
    record
        Blue, Red, Green : real
    end record
var ColorFrame : array 1 .. 4 of int
var SmoothAMIA, Timer1, Timer2, Timer3 : real
var NextLine, NextAddString : int
var String, PreString : string
RGB.SetColor (252, 1.05, 1.05, 1.9)
RGB.SetColor (253, 1.05, 1.05, 1.75)
RGB.SetColor (254, 1.05, 1.05, 1.6)
RGB.SetColor (255, 1.05, 1.05, 1.45)
ColorFrame (1) := 252
ColorFrame (2) := 253
ColorFrame (3) := 254
ColorFrame (4) := 255
var ColorValue : array 1 .. 3 of real
var COLOR : flexible array 1 .. 0 of int
var ColorSet : Color
process Drawing (x1, y1, x2, y2, BaseColor : int)
    var font1 := Font.New ("Arial;" + (intstr ((x2 - x1) div 18)) + ":" + (intstr ((y2 - y1) div 2))+":Bold")
    loop
        NextLine += 1 
        NextAddString+= 1
        if NextAddString = 10 then
            NextAddString:= 0
            PreString+= "."
            if PreString = "...." then
                PreString:= ""
            end if
        end if
        for Frame : 1 .. 4
            Draw.Box (((x1 + 2) - Frame), ((y1 + 2) - Frame), ((x2 + 2) + Frame), ((y2 + 2) + Frame), ColorFrame (Frame))
        end for
        for i : 1 .. NextLine + 1
            RGB.SetColor (251, ((ColorSet.Red / 1000) * (1000 - i)), ((ColorSet.Green / 1000) * (1000 - i)), ((ColorSet.Blue / 1000) * (1000 - i)))
            Draw.Line (round (x1 + 2 + ((((x2 - x1) / 1000) * i))), y1 + 2, round (x1 + 2 + ((((x2 - x1) / 1000) * i))), y2 + 2, 251)
        end for
        if NextLine not= 1000 then
        Font.Draw (String+PreString, ((x2 + x1) div 2) - (Font.Width (String+"...", font1) div 2),((y2+y1) div 2)- ((((y2 - y1) div 1000) * 200)div 2),font1,255)
        else
        Font.Draw ("Done", ((x2 + x1) div 2) - (Font.Width ("!Done!", font1) div 2),((y2+y1) div 2)- ((((y2 - y1) div 1000) * 200)div 2),font1,255)       
        end if
        exit when NextLine = 1000
        View.Update
        Time.DelaySinceLast (1)
        cls
    end loop
    Font.Free (font1)
end Drawing
procedure LoadBar (x1, y1, x2, y2, BaseColor : int)
    RGB.GetColor (BaseColor, ColorSet.Red, ColorSet.Green, ColorSet.Blue)
    Timer1 := Time.Sec
    Timer2 := Time.Sec
    Timer3 := Time.Sec
    NextLine := 0
    NextAddString:= 0
    String:= "Loading"
    PreString:= ""
    fork Drawing (x1, y1, x2, y2, BaseColor)
    Time.Delay (50)
end LoadBar

LoadBar (5, 5, 300, 30, red) %Yes It does load vars. (Pauses at a var)
var fd,ht,hy,erwfg,htr,erthg,ergt,gergt,ergfgt,rtg,tregh,sdfgv,sr,esg,bdfsb,s,rfg : array 1..1000000 of int% don't need example
Author:  Tony [ Thu Mar 12, 2009 3:14 pm ]
Post subject:  RE:Basic Loading bar
Posted Image, might have been reduced in size. Click Image to view fullscreen.

http://compsci.ca/blog/now-loading-loading-bar-anti-pattern/
Author:  BigBear [ Thu Mar 12, 2009 3:36 pm ]
Post subject:  RE:Basic Loading bar
I think loading delays are pointless. But if you were actually loading something that would take time, maybe a map file and character's stats file? I don't really know what would take enough time for a loading bar.

This loading bar is a process so it will display progress as the program is starting. I understand how you are drawing the bar and the colors but where does it take any thing from the program.

You called LoadBar before those variables.

What portion actually stops at the vars?
Author:  Insectoid [ Thu Mar 12, 2009 4:15 pm ]
Post subject:  RE:Basic Loading bar
When I have lots of stuff to load, I just put "Loading..." before anything and cls after everything is loaded. I admit, I've done something similar to this in the past. Only once, though, and only because I was trying to make it look more like a cash register (with the animation representing the printing of the receipt). This was only a month or two into programming though, and I realized how retarded it was soon after. I find with Turing's slow graphics it may almost double the loading time (if not more) by adding graphics.
Author:  Tony [ Thu Mar 12, 2009 4:28 pm ]
Post subject:  Re: RE:Basic Loading bar
BigBear @ Thu Mar 12, 2009 3:36 pm wrote:
I don't really know what would take enough time for a loading bar.

In large games, loading a new area of a map, along with 3D models and textures could take some amount of time. Though this is usually done during loading rooms. Ever notice long narrow corridors with a locked door at the end? The game is loading the next area while you run through that room, and unlocks the door when the loading is done. No pause.
Author:  BigBear [ Thu Mar 12, 2009 4:32 pm ]
Post subject:  RE:Basic Loading bar
Ok but how does this code actually load anything.

It yes it stops at vars but all I see his a fancy RGB color bar moving.
Author:  corriep [ Thu Mar 12, 2009 4:43 pm ]
Post subject:  Re: Basic Loading bar
copthesaint wrote:

My class was asked to do a project of a loading bar over the next hour, I decided to do one as well.


A rebel are we? Wink

You could have done this w/out the process; I hate seeing people use process for anything other than playing music.
Author:  copthesaint [ Fri Mar 13, 2009 2:04 am ]
Post subject:  Re: Basic Loading bar
corriep wrote:

You could have done this w/out the process; I hate seeing people use process for anything other than playing music.

Umm Process are fine for this case and is really needed for to ('Load') the vars
I Used process to make it appear to load as it pauses the animation while creating the variables.
Btw Don't get the idea that having a loop run in the background is a bad idea (ITS NOT), but it just may slow down the program or cause flickering with multiple drawing and view.update.
If you were to run all of your drawings in a process looped and had your conditions in your main loop your program would be fine. I don't know why people have these big grudges on processes. Confused
Btw This was posted because I Wanted MORE EXAMPLES o loading bars, because many didn't know what to do for there loading bars in my class. This wasn't a Discussion topic that I wanted, and also I was just doing this quickly and helping others out at the same time. I wasn't trying to go for anything close to perfection
Author:  DemonWasp [ Fri Mar 13, 2009 9:03 am ]
Post subject:  RE:Basic Loading bar
If you're going to make a loading bar, you'd best make it actually correspond to the work done by the program. My example follows; while it's more simplistic graphically, it communicates the point AND it lets you actually track the loading that's happening in the background:

Turing:

var loadPercent : int := 0          % Used by loadGame and loadGameProcess()
var loadingMessage : string := ""   % Used by loadGame() and its helpers


proc load1 ()
    loadingMessage := "Loading Profile"
    delay (1000)        % Instead of this, you would have some actual loading / processing. This is a stand-in for that.
    loadPercent += 10   % This is an ESTIMATE of how long that part should take (as a percentage).
end load1

proc load2 ()
    loadingMessage := "Loading Models"
    delay (1500)        % Instead of this, you would have some actual loading / processing. This is a stand-in for that.
    loadPercent += 15   % This is an ESTIMATE of how long that part should take (as a percentage).
end load2

proc load3 ()
    loadingMessage := "Loading Map"
    delay (5000)        % Instead of this, you would have some actual loading / processing. This is a stand-in for that.
    loadPercent += 50   % This is an ESTIMATE of how long that part should take (as a percentage).
end load3

proc load4 ()
    loadingMessage := "Reticulating Splines"
    delay (2500)        % Instead of this, you would have some actual loading / processing. This is a stand-in for that.
    loadPercent += 25   % This is an ESTIMATE of how long that part should take (as a percentage).
end load4


process loadGameProcess ()
    load1 ()
    load2 ()
    load3 ()
    load4 ()
    loadingMessage := "DONE"
end loadGameProcess


proc loadGame ()
    fork loadGameProcess

    % Display Loading Bar
    var loadingPercentFont : int := Font.New ("sans serif:16:bold")
    var loadingMessageFont : int := Font.New ("sans serif:24:bold")
   
    loop
        View.Update ()
        Time.DelaySinceLast (100)    % Lock to 10fps - any more would be totally useless
        Draw.Cls

        Font.Draw ( loadingMessage, 30, maxy div 2 + 40, loadingMessageFont, black )
       
        % The actual bar and the percentage listed for it
        Draw.FillBox (0, maxy div 2 + 15, maxx, maxy div 2 + 20, black )
        Draw.FillBox (0, maxy div 2 - 15, maxx, maxy div 2 - 20, black )
        Draw.FillBox (0, maxy div 2 - 15, round (maxx / 100 * loadPercent), maxy div 2 + 15, darkgrey)
        Font.Draw ( intstr(loadPercent)+"%", maxx div 2 - 8, maxy div 2 - 8, loadingPercentFont, brightred )

        exit when loadPercent >= 100
    end loop
   
    % By the end of this method, we will be done loading (assuming that the loadPercent changes all add up correctly.
end loadGame


View.Set ("offscreenonly")
loadGame ()


A worthwhile note: I can't imagine anyone coding a game in Turing that actually takes any appreciable time to load on any machine made in the last 10 years. There are 3D display engines on this site that load in under 2 seconds!

Even worse, the game I'm currently working on as a side project loads in about 2 seconds flat despite loading various models and a lot of high-resolution textures (admittedly, it *is* in Java, which has a pretty heavy speed advantage on Turing). There's really no point in making a loading bar unless it looks like your program is crashing or hanging while it's loading.
Author:  Tallguy [ Fri Mar 13, 2009 9:47 am ]
Post subject:  Re: Basic Loading bar
copthesaint wrote:

My class was asked to do a project of a loading bar over the next hour,
I decided to do one as well. Here is the loading bar for anyone who may want it.
Why not post a awsome loading bar you have made here?

Turing:
View.Set ("offscreenonly,title:Awsome Loading Bar,nobuttonbar,graphics:800;600")
type Color :
    record
        Blue, Red, Green : real
    end record
var ColorFrame : array 1 .. 4 of int
var SmoothAMIA, Timer1, Timer2, Timer3 : real
var NextLine, NextAddString : int
var String, PreString : string
RGB.SetColor (252, 1.05, 1.05, 1.9)
RGB.SetColor (253, 1.05, 1.05, 1.75)
RGB.SetColor (254, 1.05, 1.05, 1.6)
RGB.SetColor (255, 1.05, 1.05, 1.45)
ColorFrame (1) := 252
ColorFrame (2) := 253
ColorFrame (3) := 254
ColorFrame (4) := 255
var ColorValue : array 1 .. 3 of real
var COLOR : flexible array 1 .. 0 of int
var ColorSet : Color
process Drawing (x1, y1, x2, y2, BaseColor : int)
    var font1 := Font.New ("Arial;" + (intstr ((x2 - x1) div 18)) + ":" + (intstr ((y2 - y1) div 2))+":Bold")
    loop
        NextLine += 1 
        NextAddString+= 1
        if NextAddString = 10 then
            NextAddString:= 0
            PreString+= "."
            if PreString = "...." then
                PreString:= ""
            end if
        end if
        for Frame : 1 .. 4
            Draw.Box (((x1 + 2) - Frame), ((y1 + 2) - Frame), ((x2 + 2) + Frame), ((y2 + 2) + Frame), ColorFrame (Frame))
        end for
        for i : 1 .. NextLine + 1
            RGB.SetColor (251, ((ColorSet.Red / 1000) * (1000 - i)), ((ColorSet.Green / 1000) * (1000 - i)), ((ColorSet.Blue / 1000) * (1000 - i)))
            Draw.Line (round (x1 + 2 + ((((x2 - x1) / 1000) * i))), y1 + 2, round (x1 + 2 + ((((x2 - x1) / 1000) * i))), y2 + 2, 251)
        end for
        if NextLine not= 1000 then
        Font.Draw (String+PreString, ((x2 + x1) div 2) - (Font.Width (String+"...", font1) div 2),((y2+y1) div 2)- ((((y2 - y1) div 1000) * 200)div 2),font1,255)
        else
        Font.Draw ("Done", ((x2 + x1) div 2) - (Font.Width ("!Done!", font1) div 2),((y2+y1) div 2)- ((((y2 - y1) div 1000) * 200)div 2),font1,255)       
        end if
        exit when NextLine = 1000
        View.Update
        Time.DelaySinceLast (1)
        cls
    end loop
    Font.Free (font1)
end Drawing
procedure LoadBar (x1, y1, x2, y2, BaseColor : int)
    RGB.GetColor (BaseColor, ColorSet.Red, ColorSet.Green, ColorSet.Blue)
    Timer1 := Time.Sec
    Timer2 := Time.Sec
    Timer3 := Time.Sec
    NextLine := 0
    NextAddString:= 0
    String:= "Loading"
    PreString:= ""
    fork Drawing (x1, y1, x2, y2, BaseColor)
    Time.Delay (50)
end LoadBar

LoadBar (5, 5, 300, 30, red) %Yes It does load vars. (Pauses at a var)
var fd,ht,hy,erwfg,htr,erthg,ergt,gergt,ergfgt,rtg,tregh,sdfgv,sr,esg,bdfsb,s,rfg : array 1..1000000 of int% don't need example




lets not complicate things

Turing:

View.Set ("offscreenonly,title:Awsome Loading Bar,nobuttonbar,graphics:800;600")
drawfillbox (0, 0, 200, 30, blue)
drawfillbox (5, 5, 195, 25, white)
var x : int := 0
loop
    x := x + 1
    drawfillbox (4 + x, 5, 5, 25, red)
    exit when x = 191
    delay (10)
    View.Update
end loop


basically the same thing, justa whole lot simpler
Author:  Insectoid [ Fri Mar 13, 2009 10:37 am ]
Post subject:  RE:Basic Loading bar
If there's a way to get the file size in Turing when loading pictures and whatever, and you can calculate the bit size of a string/int (not too hard) you can make it accurately show how much data has been loaded and even give an accurate percent based on the total number of bytes to be loaded. It would impress your teacher and even if you aren't loading enough to warrant a loading bar it would be good (as it actually does something based on what you're loading, not just delaying the program). In this case, I believe it would be worth it.
Author:  DemonWasp [ Fri Mar 13, 2009 10:47 am ]
Post subject:  RE:Basic Loading bar
You can use File.Status to get the size of a file on disk.

:


You can syndicate this boards posts using the file backend.php or view the topic map using sitemap.php.

Terms of Use | Privacy Policy