File Upload Progress Bar

Monday 25 August 2008 6:00:30 am

heya ez community!

I am using ez 4.0
I have a module to upload a zip file and want to have a progress bar for it.
I have found this: http://talks.php.net/show/afup06/22

Can u help me how to run this?

-------------------------------------------------------------------------
In my pagelayout I have
--------------------------------------------------------------------------

<script type="text/javascript" src={'javascript/yui/yahoo.js'|ezdesign}></script>
<script type="text/javascript" src={'javascript/yui/connection.js'|ezdesign}></script>
<script type="text/javascript">
{literal}
var fN = function callBack(o) { 
 var result = document.getElementById('result');
 result.innerHTML='<pre>'+o.responseText+'</pre>';
}
var callback = { success:fN, upload:fN }
function postForm(target,formName,up) {
  YAHOO.util.Connect.setForm(formName,up);
  YAHOO.util.Connect.asyncRequest('POST',target,callback);
}
{/literal}
</script>

-------------------------------------------------------------------------
in my upload.tpl
-------------------------------------------------------------------------

<form enctype="multipart/form-data" id="upload_form" action="" onsubmit="postForm('/test-bestellung/upload','upload_form',1); return false;" method="POST">


{def $user=fetch( 'user', 'current_user' )}
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="{ezhttp( 'eZUserLoggedInID', 'session' )}" />

and this

<script>
{literal}
var fP = function callBack(o) {
 var resp = eval('(' + o.responseText + ')');
 if(!resp['done']) { 
  if(resp['total']) {
   var pct = parseInt(100*(resp['current']/resp['total']));
   document.getElementById('pbar').style.width = ''+pct+'%';
   document.getElementById('ppct').innerHTML = " "+pct+"%";
   document.getElementById('ptxt').innerHTML = resp['current']+" of "+resp['total']+" bytes";
  }
  setTimeout("update_progress()",500);
 } else if(resp['cancel_upload']) {
  txt="Cancelled after "+resp['current']+" bytes!"; 
  document.getElementById('ptxt').innerHTML = txt;
  setTimeout("progress_win.hide();window.location.reload(true);",2000);
 }
}

var pcallback = { success:fP }

function update_progress() {
 progress_key = document.getElementById('progress_key').value;
 YAHOO.util.Connect.asyncRequest('GET','/test-bestellung/upload?progress_key='+progress_key, pcallback);
}

var progress_win;

function postForm(target,formName) {
 YAHOO.util.Connect.setForm(formName,true);
 YAHOO.util.Connect.asyncRequest('POST',target,callback);
 progress_win = new YAHOO.widget.Panel(...);
 update_progress();
}
{/literal}
</script>
 <div id="progress_win"> 
    <div class="hd"></div> 
    <div class="bd"></div> 
    <div class="ft"></div> 
 </div>

-------------------------------------------------------------------------
and in my upload.php
-------------------------------------------------------------------------

if($_SERVER['REQUEST_METHOD']=='POST') {
  $status = apc_fetch('upload_'.$_POST['APC_UPLOAD_PROGRESS']);
  $status['msg'] = 'blah';
  echo json_encode($status);
  exit;
} else if(isset($_GET['progress_key'])) {
  $status = apc_fetch('upload_'.$_GET['progress_key']);
  echo json_encode($status);
}

-------------------------------------------------------------------------

I dont get the next page...