views:

969

answers:

1

I would like to show a dynamic progressbar in my applciation while uploading a video (*.flv format). I searched on the Web for more than 2 hours but I can't find any tutorial to guide me through this process.

What I have so far:

  • script that uploads a video
  • jQuery library included in the section

But what to do next? Here is the controller action for uploading a video I use:

public function uploadPublicVideoAction()
{
    $request = $this->getRequest();
    $media = $this->_getTable('Media');

    $form = $this->_getForm('UploadPublicVideo',
                            $this->_helper->url('upload-public-video'));
    // if POST data has been submitted
    if ($request->isPost()) {
        // if the UploadPublicVideo form has been submitted and the submitted data is valid
        if (isset($_POST['upload_public_video']) && $form->isValid($_POST)) {

            $data = $form->getValues();
            $data['user_id'] = $this->view->identity->id;

            $ext = end(explode('.', $form->video->getFileName()));

            $dbTrans = false;

            try {

                $db = $this->_getDb();
                $dbTrans = $db->beginTransaction();

                $data['type'] = 'video';
                $data['status'] = 'public';
                $paths = $media->add($data, $ext);

                if (file_exists($paths[0])) {
                   unlink($paths[0]);
                }
                if (file_exists($paths[1])) {
                   unlink($paths[1]);
                }

                // add filter for renaming the uploaded photo
                $form->video->addFilter('Rename',
                                        array('target' => $paths[0],
                                              'overwrite' => true));

                // upload the video
                $form->video->receive();

                // create a thumbnail
                //$this->_helper->FlvThumbnail($path[0], $path[1]);

                $db->commit();

                $form->reset();

                $this->view->success = 'Public video successfully uploaded';

            } catch (Exception $e) {
                if (true === $dbTrans) {
                    $db->rollBack();
                }
                $this->view->error = $e->getMessage();
            }

        }
    }

    $this->view->headTitle('Upload Public Video');
    $this->view->form = $form;
}

Can anyone show me a simple way to use Zend_Progressbar and jQuery together to achieve a dynamic upload progressbar?

+1  A: 

You can do either long (comet) or short polling (ajax) to achieve the desired effect. With the former I would suggest making the request in an iFrame and having your code write out JS which will get executed as they come in, with the latter just do something like:

var pollingId = window.setInterval(poll, 250);
function poll(){
   //make an AJAX request, do something with it (like update your progress bar).
   if(done){
      window.clearInterval(pollingId);
   }
}
illvm