Ahoj všichni, chtěl bych Vás poprosit o radu jak integrovat do PHP uploadu progress bar lištu. Mám variantu v jQuery i to cosik ukazuje, ale špatně... Asi je potřeba to nějak v tom javascriptu nastavit aby to ukazovalo jak má. Jenže já vůbec nemám páru jak a kde :(
Toto je ten javascript pro ten progress bar (ukazuje to co je v něm nastavené) a já bych potřeboval, aby ukazoval to co má, tedy aktuální nahrávání
$(document).ready(function(){
jQuery.fn.anim_progressbar = function (aOptions) {
// def values
var iCms = 1000;
var iMms = 60 * iCms;
var iHms = 3600 * iCms;
var iDms = 24 * 3600 * iCms;
// def options
var aDefOpts = {
start: new Date(), // now
finish: new Date().setTime(new Date().getTime() + 60 * iCms), // now + 60 sec
interval: 100
}
var aOpts = jQuery.extend(aDefOpts, aOptions);
var vPb = this;
// each progress bar
return this.each(
function() {
var iDuration = aOpts.finish - aOpts.start;
// calling original progressbar
$(vPb).children('.pbar').progressbar();
// looping process
var vInterval = setInterval(
function(){
var iLeftMs = aOpts.finish - new Date(); // left time in MS
var iElapsedMs = new Date() - aOpts.start, // elapsed time in MS
iDays = parseInt(iLeftMs / iDms), // elapsed days
iHours = parseInt((iLeftMs - (iDays * iDms)) / iHms), // elapsed hours
iMin = parseInt((iLeftMs - (iDays * iDms) - (iHours * iHms)) / iMms), // elapsed minutes
iSec = parseInt((iLeftMs - (iDays * iDms) - (iMin * iMms) - (iHours * iHms)) / iCms), // elapsed seconds
iPerc = (iElapsedMs > 0) ? iElapsedMs / iDuration * 100 : 0; // percentages
// display current positions and progress
$(vPb).children('.percent').html('<b>'+iPerc.toFixed(1)+'%</b>');
$(vPb).children('.elapsed').html(iDays+' days '+iHours+'h:'+iMin+'m:'+iSec+'s</b>');
$(vPb).children('.pbar').children('.ui-progressbar-value').css('width', iPerc+'%');
// in case of Finish
if (iPerc >= 100) {
clearInterval(vInterval);
$(vPb).children('.percent').html('<b>100%</b>');
$(vPb).children('.elapsed').html('Finished');
}
} ,aOpts.interval
);
}
);
}
// default mode
$('#progress1').anim_progressbar();
// from second #5 till 15
var iNow = new Date().setTime(new Date().getTime() + 5 * 1000); // now plus 5 secs
var iEnd = new Date().setTime(new Date().getTime() + 15 * 1000); // now plus 15 secs
$('#progress2').anim_progressbar({start: iNow, finish: iEnd, interval: 100});
// we will just set interval of updating to 1 sec
$('#progress3').anim_progressbar({interval: 1000});
});
A zde je stránka kde by se měl zobrazovat tedy zobrazuje se i ukazuje jenže né jak má...
<?php
$page = "upload";
require 'inc/global.php';
if($uid || $set['non_user_upload'])
{
require 'header.php';
?>
<div style="display: none" id="load" class="box">
<h2>Probíhá nahrávání</h2>
Nahrávání <b><i id="file_name"></i></b> , Prosím čekejte...
<br />
<img src="images/loader.gif" />
<!-- TOTO je kód pro zobrazení PROGRESSBARU -->
<div class="progressbar">
<div id="progress1">
<div class="percent"></div>
<div class="pbar"></div>
<div class="elapsed"></div>
</div>
<hr />
<div id="progress2">
<div class="percent"></div>
<div class="pbar"></div>
<div class="elapsed"></div>
</div>
<hr />
<div id="progress3">
<div class="percent"></div>
<div class="pbar"></div>
<div class="elapsed"></div>
</div>
</div>
<!-- TADY končí kód pro zobrazení PROGRESSBARU -->
<div class="sep"></div>
<div align="center">
<? adsense_med(); ?>
</div>
</div>
<?
if(isset($_POST['Submit']))
{
$errors=0;
$site = $set['site_url'];
// If "Site URL" isn't set yet: try to detect automatically
if(!$site)
{
$site="http://".$_SERVER['HTTP_HOST'];
}
$max_size = $set['max_size']*1024*1024;
$file_each = array();
$failed = array();
for($i=0; $i<(count($_FILES['file']['name'])); $i++)
{
$file = $_FILES['file']['name'][$i];
$tmp_name = $_FILES['file']['tmp_name'][$i];
if($file)
{
$filename = stripslashes($file);
$extension = getExtension($filename);
$extension = strtolower($extension);
$size=filesize($tmp_name);
if ($size > $max_size)
{
$errors=1;
$failed[] = ($file);
$too_big = 1;
continue;
}
if(!$errors)
{
$file_exist = mysqli_fetch_assoc($mysqli->query("SELECT id FROM files WHERE file='$file' AND size='$size'"));
if($file_exist)
{
?>
<div class="box" id="err">
<h2>Chyba: Tento soubor již existuje!!!</h2>
<label for="url">Odkaz souboru:</label>
<input type="text" id="url" size="60" value="<? echo download_link($file_exist['id']); ?>" readonly="readonly" onclick="this.select();" />
</div>
<?
$errors=1;
}
}
}
else
{
error("Prosím vyberte soubor!");
$errors = 1;
}
if(!$errors)
{
$file_each[] = $filename;
$upload = func_upload($tmp_name, $size, $file, $site);
if(!$uid && $set['non_user_upload'] && $_POST['check'])
{
$email = $mysqli->real_escape_string($_POST['email']);
$subject = $set['site_name']." | Odkaz na soubor";
$link = $filename.": \n".download_link($upload);
send($c_mail, $email, $subject, $link);
}
}
}
if($upload == true || $too_big)
{
echo "<div class='box' id='suc'>";
if($file_each)
{
echo "<h1>Hotovo</h1>
Následující soubory byly nahrány: <br />
<ul>";
foreach($file_each as $file_single)
{
$fid = mysqli_fetch_assoc($mysqli->query("SELECT id FROM files WHERE file = '$file_single'"));
echo "<li><b>".($file_single)."</b><br />
<input type='text' id='url' size='60' value='" . download_link($fid['id']) . "' readonly='readonly' onclick='this.select();' />
</li><br />";
}
}
if($failed)
{
if(!$file_each)
{
echo "<h2>CHYBA!</h2>";
}
if($file_each && $failed)
{
echo "<div class='sep'></div>";
}
echo "</ul>
<i>Následující soubory <b>nemohly</b> být nahrány, protože jsou příliš velké:
<ul>";
foreach($failed as $failed_name)
{
echo "<li><b>".$failed_name."</b></li>";
}
echo "</ul></i>";
}
echo "</div>";
}
elseif($upload == "failed")
{
error("Neznámá chyba, prosím zkuste to znovu, pokud se tato chyba i nadále zobrazuje, kontaktujte prosím správce serveru.");
}
}
?>
<div id="upload_box" class="box">
<div class="nahratilogo"><h3> Nahrát</h3></div>
<div class="nahrat"></div>
<form method='post' enctype='multipart/form-data'>
<label for="file_choose">Vyberte soubor:</label>
<div id="FileUpload">
<div class="buttonbrowse"></div>
<input type="file" id="file_choose" title="Kliknutím vyberete soubor" size="55" style="height: 45px" onchange="getElementById('FileField').value = getElementById('file_choose').value;" name="file[]" multiple />
<div id="BrowserVisible"><input type="text" id="FileField" /></div>
</div>
<input id="upld" name="Submit" class="button" type="submit" value="Nahrát" />
<br>
<br>
<?
if(!$uid && $set['non_user_upload'])
{
?>
<label class="mail" for="send">
<input type="checkbox" name="check" value="1" id="send" />
Poslat odkaz na soubor kamarádovi, nebo na Váš email
</label>
<div id="email">
<label for="email">E-mail:</label>
<input type="email" name="email" />
</div>
<script>
$(document).ready(function ()
{
if ($("#send").is(":checked"))
$("#email").show();
else
$("#email").hide();
});
$("#send").change(function() {
$("#email").toggle('slow');
});
</script>
<?
}
?>
<br />
<br />
<script>
$("#upld").click(function ()
{
$("#upload_box").hide('fast');
$("#err").hide('slow');
$("#suc").hide('slow');
$("#load").show("slow");
});
$("#file_choose").change(function ()
{
var selected = $('#file_choose').get(0).files.length;
if (selected > 1)
{
$("#file_name").text(+ selected +' souborů');
}
else
{
var value = $(this).val();
$("#file_name").text(value);
}
}).keyup();
</script>
</form>
<div align="right">
Maximální povolená velikost souboru: <? echo $set['max_size']; ?>MB
</div>
</div>
<?
include 'footer.php';
}
else
{
Header("Location: login.php");
}
?>
Jsou tam přednastavené tři a každý se chová jinak... Prosím poraďte jak ho mám zprávně nastavit, nebo jestli je tato varianta špatná, tak poradit jak to mám jinak vyřešit...??? Moc Vám všem děkuji za pomoc... Sedím nad tím už druhý den vůbec nevím jak na to:(