forum.coppermine-gallery.net

No Support => Modifications/Add-Ons/Hacks => Mods: Uploading => Topic started by: mbjackass on February 23, 2007, 09:50:20 am

Title: Upload progress / status bar
Post by: mbjackass on February 23, 2007, 09:50:20 am
I have been reading al lot of post about the possibility for a progress bar on the coppermine upload page. And i found out that this was impossible.
But i wanted to have it anaway.

So i decited make something that is the closest thing to an progress bar,

And i come up whit the idea to use a bar that just keeps loading if you press the upload button. (so it doesnt know how long the upload wil take it just ceeps loding and loading)

I used the bar from http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm (http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm)

this bar included in coppermine can look liks this: (img is in dutch language)

(http://img181.imageshack.us/img181/7555/copperminewy2.jpg)

This bar is just somthing so that people know that the site is bussy and the don't click again on the button or do anything stupid.
Ive testid it with ie and firefox

So how does this work:

step 1:

Copy this code between the header tags of your template: themes/YOUR_THEME/template.html

Code: [Select]
<script language="javascript" src="xp_progress.js">

/***********************************************
* WinXP Progress Bar- By Brian Gosselin- http://www.scriptasylum.com/
* Script featured on Dynamic Drive- http://www.dynamicdrive.com
***********************************************/

</script>

step 2:

Open upload.php (main directory of coppermine):

and look for:

Code: [Select]
<input type="submit" value="{$button_value}"
And past after that:
Code: [Select]
onclick="javascript:bar1.showBar()"
The result wil look like this:
Code: [Select]
<input type="submit" value="{$button_value}" onclick="javascript:bar1.showBar()" class="button"/>
Then past this code on the place you want the loading bar to be shown. i past it directly under the upload button (the code above is the upload button):

Code: [Select]
<script type="text/javascript">
var bar1= createBar(300,15,'white',1,'black','blue',85,7,3,"");
</script>

Than you need tho upload everything including the attached file: xp_progress.js
the xp_progress.js file need to be uploaded in the main directory

* if jou go to http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm (http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm) you can read more about chancing the color of the bar
* you must not download the xp_progress.js file from that website, i modified it a little (the bar is now
Title: Re: Upload progress / status bar
Post by: Hein Traag on February 23, 2007, 10:09:29 am
Nice idea mbjackass. Your english is fine, don't worry about that ;)

Moved it to Mods sections since it is not yet a real plugin. But it does look like a nice idea to be pluginized.

De groeten
Hein
Title: Re: Upload progress / status bar
Post by: Hein Traag on February 28, 2007, 03:36:23 pm
Added this mod to my own CPG using Mac OS X theme and it works perfectly!

Hein
Title: Re: Upload progress / status bar
Post by: tms_shan on March 03, 2007, 12:16:50 am
hey i did as you mentioned but the progress bar keeps showing even after upload:S any fix to this? please
Title: Re: Upload progress / status bar
Post by: mbjackass on March 05, 2007, 09:38:39 am
hey i did as you mentioned but the progress bar keeps showing even after upload:S any fix to this? please

If you mean by keeps showing after upload, that the bar is showing on the page were you place the uploaded images to the album you select.
Then this is how it is meant to be, becouse if you have a lot of images you need te place then that can take some time to, so the bar is showing there to. (it's supposed to show only when you press the button, olso in the next steps)
So hope this helps, otherwise i have not yet a solution to stop the bar from showing once you hit upload button and go on tho the next steps of placing images.

(i understand by reading your replay that you have used the xp_progress.js file that i included here. and not the one frome the mentioned website. otherwise the bar is always showing.)
Title: Re: Upload progress / status bar
Post by: tms_shan on March 06, 2007, 02:43:41 am
thanks man, ill wait for future modification.
Title: Re: Upload progress / status bar
Post by: sibsoft on August 23, 2007, 09:08:36 am
Hello,

please also check another upload progress bar http://www.sibsoft.net/xupload.html (http://www.sibsoft.net/xupload.html). It will show real upload progress, not just "sand watches".

Thanks
Title: Re: Upload progress / status bar
Post by: Joachim Müller on August 23, 2007, 05:39:58 pm
Nice implementation. However, your app "XUpload" has two main drawbacks:

Of course it's a nice idea to implement such a feature in a language that is closer to the operating system it runs on - using Ajax to generate the client-server feedback is a good idea as well. However, there are cross-platform issues with such solutions. What I was trying to say: nice one - power-users should go ahead and give it a try. Not a solution for the mainstream (i.e. coppermine target audience) imo.
Title: Re: Upload progress / status bar
Post by: Bazzah on August 25, 2007, 01:27:58 pm
Has anyone had this working in firefox? I am using FF 2.0.0.6 and it won't show the bar. It works fine in Internet Explorer
Title: Re: Upload progress / status bar
Post by: pvisser on June 30, 2008, 04:15:52 pm
Thank It works fine. just is it posible to ad a message above the bar like MOMENT PLEASE! when starting?
Title: Re: Upload progress / status bar
Post by: Hellraiser666 on October 31, 2008, 01:44:03 pm

Then past this code on the place you want the loading bar to be shown. i past it directly under the upload button (the code above is the upload button):

in whatever line I find the Upload button?
Title: Re: Upload progress / status bar
Post by: marianowo on March 08, 2009, 11:29:58 pm
thank you. It works perfect.
;)
Title: Re: Upload progress / status bar
Post by: m3lvm on April 09, 2009, 03:07:09 am
Thanks for that one ;D ;D ;D ;D ;D