Jump to content
UBot Underground

[FREE] HTML5 Progress Bar Source Code for (STD/PRO/DEV)

dankass

By dankass,
in Bots and Scripts

 Share Followers 10

Recommended Posts

dankass

dankass 52

Posted
Posted

UPDATE - NOW WORKS WITH ALL VERSIONS OF UBOT STUDIO (see below for standard/pro version)

 

I needed a small progress bar for a project I'm working on and wanted it to be "lightweight" and easy to work with without a lot of 'riff-raff'.

It worked so well I thought I'd share it with all of you. I've attached code and .ubot file.

 

Notes:

  • This is accomplished using HTML5
  • Displays in HTML UI Panel (Dev Only)
  • Updated to display rounded numbers in %
set(#progress, 0, "Global")
ui html panel("<body>
<progress variable=\"#progress\" fillwith=\"value\" max=\"100\" style=\"width:300px;\"></progress>
<b><span variable=\"#progress\" fillwith=\"innerhtml\"></span>%</b>
</body>", "")
set(#looptotal, 17, "Global")
set(#loopcount, 1, "Global")
loop(#looptotal) {
    load html("Loop: {#loopcount} of {#looptotal}")
    set(#progress, $eval("var tmp1 =  {$multiply($divide(#loopcount, #looptotal), 100)}; tmp2 = Math.floor(tmp1);
tmp2"), "Global")
    increment(#loopcount)
}

Cheers!

 

UPDATE:  Now Works with Standard and PRO

Figured out a nice workaround for the Ubot Studio Standard & Pro folks to stick this in the regular UI panel.  See code below, or download the HTML5ProgressbarSTD.ubot file for STD or PRO users.

set(#progress, 0, "Global")
ui stat monitor("<progress value=\"{#progress}\" max=\"100\"></progress>", "{#progress}%")
set(#looptotal, 17, "Global")
set(#loopcount, 1, "Global")
loop(#looptotal) {
    load html("Loop: {#loopcount} of {#looptotal}")
    set(#progress, $eval("var tmp1 =  {$multiply($divide(#loopcount, #looptotal), 100)}; tmp2 = Math.floor(tmp1);
tmp2"), "Global")
    increment(#loopcount)
}

HTML5ProgressBarSTD.ubot

HTML5ProgressBarDEV.ubot

  • Like 20
Link to post
Share on other sites
luis carlos

luis carlos 94

Posted
Posted

Thanks Dankass.  For Pro and Std Version, can try it clicking on the "start" button with this code:

set(#progress, 0, "Global")
ui html panel("<body>
<progress variable=\"#progress\" fillwith=\"value\" max=\"100\" style=\"width:300px;\"></progress>
<b><span variable=\"#progress\" fillwith=\"innerhtml\"></span>%</b>
</body><br><br><br>
<button onclick=\"ubot.runScript(\'algo()\')\">Start</button>", "")
define algo {
    set(#looptotal, 20, "Global")
    set(#loopcount, 1, "Global")
    loop(#looptotal) {
        load html("Loop: {#loopcount} of {#looptotal}")
        set(#progress, $eval($multiply($divide(#loopcount, #looptotal), 100)), "Global")
        increment(#loopcount)
    }
}
  • Like 4
Link to post
Share on other sites
Aymen

Aymen 385

Posted
Posted

Wow. I wonder where that animated green bar came from?

Cant find it from the source.

 

Thanks for sharing this.

 

its a new tag from HTML5 ! put the html tag and it will show automatically !

Link to post
Share on other sites
julius

julius 5

Posted
Posted

Following TJ's multithreading process, I came up with this...

ui html panel("<!doctype html>
<html>
<head>
	<meta charset=utf-8>
	<title></title>
	<style>
		progress \{ height: 50px; width: 300px; \}
		span \{ position: absolute; margin-left: 130px; margin-top: 12px; \}
	</style>
</head>
<body>
	<form>
		<span><b variable=\"#prog\" fillwith=\"innertext\"></b> %</span>
		<progress min=\"0\" max=\"100\" value=\"0\" variable=\"#prog\" fillwith=\"value\"></progress>
	</form>
</body>
</html>", 150)
set(#prog, 0, "Global")
set(#num threads, 17, "Global")
set(#number accounts, 87, "Global")
set(#num created, 0, "Global")
set(#used threads, 0, "Global")
loop(#number accounts) {
    loop while($comparison(#used threads, ">=", #num threads)) {
        wait(1)
    }
    loop process()
}
define loop process {
    increment(#used threads)
    increment(#num created)
    registration procedure()
}
define registration procedure {
    thread {
        set(#prog, $eval("var worknum =  {$multiply($divide(#num created, #number accounts), 100)}; worknumrnd = Math.floor(worknum);
worknumrnd"), "Global")
        decrement(#used threads)
        wait(1)
    }
}
  • Like 2
Link to post
Share on other sites
dankass

dankass 52

Posted
  • Author
Posted

Thanks everyone who has contributed to some other great twists for this! It inspired me to take the time to find a simple/easy way to stick the same basic setup in the standard UI panel for standard and pro users. I've updated the original post with a version that will work for yall too.

 

Cheers!

Link to post
Share on other sites
dankass

dankass 52

Posted
  • Author
Posted

 

Following TJ's multithreading process, I came up with this...


        set(#prog, $eval("var worknum =  {$multiply($divide(#num created, #number accounts), 100)}; worknumrnd = Math.floor(worknum);
worknumrnd"), "Global")

 

Thanks! That Math.floor part is what I've been trying to figure out to be able to release the standard & pro version to get it to round and display right. I was doing it with a paid plugin but didn't really want to post free code that required a paid plugin, so that did just the trick!

Link to post
Share on other sites
  • 3 weeks later...
  • 2 weeks later...
  • 1 month later...
  • 4 weeks later...
Buckethead

Buckethead 1

Posted
Posted

Hi, just a quick question , when i tried to use this code in my bot, I can't seem to get the percentage incrememts of the loading bar to match the progress of my bot,

 

see this code here: set(#looptotal, 20, "Global")

set(#loopcount, 1, "Global")

 

 

I want the loading bar to cycle through the loop count that corresponds with the number of urls it visits from a text file,

where loop count = each url out of say 100 urls in the text file, so 100 would be the looptotal, but how do I define it so it automatically works out the number by the amount of urls in the text file (because the number of url's in text file will vary)

 

how would I best go about changing this code for that purpose? thanks

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
 Share
Followers 10
Go to topic listing
×
×
  • Create New...