CodeIgniter Forums

Full Version: Multi Upload with CI & swfUpload
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3

El Forum

[eluser]TDSPower[/eluser]
Hye,

I need to install swfUpload which permit to upload some files instantanately.

I want to do as this exemple.

First I have installed swfUpload as noticed on the wiki.

So, on my system/javascript folder I have two files : swfupload_f9.swf && swfupload.js.

On my controller I have :

Code:
function upload(){
            $this->upload->do_upload('Filedata');        
        }
            
        function do_upload()
        {
            $config['upload_path'] = './uploads/';
            $config['allowed_types'] = 'gif|jpg|png';
            $config['max_size']    = '100';
            $config['max_width']  = '1024';
            $config['max_height']  = '768';
            
            $this->load->library('upload', $config);
        
            if ( ! $this->upload->do_upload())
            {
                $error = array('error' => $this->upload->display_errors());
                
                $this->load->view('upload_form', $error);
            }    
            else
            {
                $data = array('upload_data' => $this->upload->data());
                
                $this->load->view('upload_success', $data);
            }
        }

I have the folder "uploads" in Controller/uploads

My view is :
Code:
<head>
    
    

    
        var swfu;
        window.onload = function () {
            swfu = new SWFUpload({
                // Backend Settings
                upload_url: "http://localhost/magnet/index.php/upload/doUpload",    // Relative to the SWF file
                post_params: {"PHPSESSID": "cf7mgr76aqh4j9ndgue9nd7kc4"},

                // File Upload Settings
                file_size_limit : "2048",    // 2MB
                file_types : "*.jpg",
                file_types_description : "JPG Images",
                file_upload_limit : "0",

                // Event Handler Settings - these functions as defined in Handlers.js
                //  The handlers are not part of SWFUpload but are part of my website and control how
                //  my website reacts to the SWFUpload events.
                file_queue_error_handler : fileQueueError,
                file_dialog_complete_handler : fileDialogComplete,
                upload_progress_handler : uploadProgress,
                upload_error_handler : uploadError,
                upload_success_handler : uploadSuccess,
                upload_complete_handler : uploadComplete,

                // Flash Settings
                flash_url : "<?=base_url()?>system/javascript/swfupload_f9.swf",    // Relative to this file

                custom_settings : {
                    upload_target : "divFileProgressContainer"
                },
                
                // Debug Settings
                debug: false
            });
        }
    

</head>
<body>
    <div style="margin: 0px 10px;">
            &lt;form&gt;
                &lt;button id="btnBrowse" type="button" style="padding: 5px;" onclick="swfu.selectFiles(); this.blur();"&gt;<img src="images/page_white_add.png" style="padding-right: 3px; vertical-align: bottom;">Select Images <span style="font-size: 7pt;">(2 MB Max)</span></button>

            &lt;/form&gt;
        </div>
        <div id="divFileProgressContainer" style="height: 75px;"></div>
        <div id="thumbnails"></div>
    </div>
&lt;/body&gt;

Nothing is uploaded when I select an image... and no error are showed.

Thanks for your help,

Fran├žois

El Forum

[eluser]Tobz[/eluser]
try adding enctype="multipart/form-data" to your form element (not sure if swfupload does this for you)

or try changing
Code:
if ( ! $this->upload->do_upload()) ....
to
Code:
if ( ! $this->upload->do_upload('name_of_swfupload_field')) ...
in you do_upload function

El Forum

[eluser]Tobz[/eluser]
I'm now actually using swfupload on a project and the problem is flash sends the incorrect mime-type.

so uploading jpg's with swfupload has mime-type of application/octet-stream instead of image/jpg and CI does not have application/octet-stream mapped to the jpg extension in config/mimes.php

what I've done is add application/octet-stream to config/mimes.php and extended the upload class
(application/libraries/MY_Upload.php) and add application/octet-stream to the is_image function so that width and height are returned in the upload->data() function.

hope this helps
also hope Adobe will fix this bug in the flash player

El Forum

[eluser]MMCCQQ[/eluser]
HELP!!!

I GOT THIS

I want using SWFupload. how to do?

Code:
function Upload()
    {
         $this->load->helper('file');

     $this->load->library('tunerspot');
    
        $config['upload_path'] = "/home/importz/public_html/img/spacio/";
        $config['allowed_types'] = 'gif|jpg|png';
        $config['max_size']    = '1000';
        $config['max_width']  = '1024';
        $config['max_height']  = '768';
        $config['encrypt_name']  = TRUE;
        
        $this->load->library('upload', $config);
        
        
            if ( ! $this->upload->do_upload())
        {
            $error = array('error' => $this->upload->display_errors());
            $main['contenido'] = $this->load->view('spacio/upload',$error,true);
           $data['modules_left'] = $this->load->view('frontend/contenido', $main, true);
        $data['modules_right'] = FALSE;
                $this->load->view('templatev2', $data);
        }else{
        
        
    $upload_data = $this->upload->data();
$image_path = $upload_data['full_path'];
$extension = $upload_data['file_ext'];
$this->load->library('tunerspot');
$some_new_image_path = $this->tunerspot->randpass();
$config['image_library'] = 'GD2';
$config['source_image'] = $image_path;
$config['new_image'] = $some_new_image_path . '_mini' .  $extension;
$config['maintain_ratio'] = TRUE;
$config['width'] = 200;
$config['height'] = 200;

$this->load->library('image_lib'); // load the image library
$this->image_lib->initialize($config);
        
        if ( ! $this->image_lib->resize())
{
$error = array('error' => $this->upload->display_errors());
            
        
          
    
}
else
{
    
    $data = array(
    
    'thumb' => 'img/spacio/'.$some_new_image_path . '_mini' .  $extension,
    'idsp' => $this->uri->segment(3)
    );
    
    if($this->db->insert('spacio_img',$data))
    {
        
            
        $this->load->load('vivie');    
        
    }

    
}
    }
    }

El Forum

[eluser]Merolen[/eluser]
I've been trying to make SWFUpload to work with CI as well. After using this post and the wiki entry as a startingpoing I've got a working sample.

Here is my experience:

I've used both the handler.js, swfupload.js, main.css and the images from the demo. I've used absolute path, guess it works fine with relative as well. This is put within the &lt;head&gt; tags:
Code:
&lt;link rel="stylesheet" type="text/css" href="/absolute/path/to/css/default.css" /&gt;
&lt;script type="text/javascript" src="/absolute/path/to/handlers.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="/absolute/path/to/swfupload.js"&gt;&lt;/script&gt;

Then the SWFUpload initialization, this is copied from the demo. Note that this has to be within the &lt;head&gt; tags. Here I've given the URL, the demo uses relative path. But this works for me:
Code:
var swfu;
        window.onload = function () {
            swfu = new SWFUpload({
                // Backend Settings
                upload_url : "http://www.mysite.com/upload/do_upload",
                flash_url : "http://www.mysite.com/path/to/swfupload_f9.swf",
                
                // Don't think this is needed
                post_params: {"PHPSESSID": "&lt;?php echo session_id(); ?&gt;"},

                // File Upload Settings
                file_size_limit : "2048",    // 2MB
                file_types : "*.jpg",
                file_types_description : "JPG Images",
                file_upload_limit : "0",

                // Event Handler Settings - these functions as defined in Handlers.js
                //  The handlers are not part of SWFUpload but are part of my website and control how
                //  my website reacts to the SWFUpload events.
                file_queue_error_handler : fileQueueError,
                file_dialog_complete_handler : fileDialogComplete,
                upload_progress_handler : uploadProgress,
                upload_error_handler : uploadError,
                upload_success_handler : uploadSuccess,
                upload_complete_handler : uploadComplete,

                custom_settings : {
                    upload_target : "divFileProgressContainer"
                },
                
                // Debug Settings
                debug: false
            });
        }

Now the code in the controller. My class is called upload and the function is called do_upload, the function must not be confused with CI's own do_upload function which is used inside our own do_upload. The most important thing to notice here is the echo at the bottom. If nothing is echoed the upload will just hang. The echo is the way to send information to the handler.js. Here the filename is echoed so that the image can be shown when the upload is finished.

Code:
class Upload extends Controller {
    
    function Upload() {
        parent::Controller();
        $config['upload_path'] = './relative/to/root/upload';
        $config['allowed_types'] = 'gif|jpg|png';
        $config['max_size']    = '1000';
        $config['max_width']  = '1024';
        $config['max_height']  = '768';
        
        $this->load->library('upload', $config);
    }
    
    function do_upload() {
        $this->upload->do_upload('Filedata');
        $res = $this->upload->data();

        echo $res['file_name'];
    }
}

And now to the view file which will show the upload button
Code:
<div style="margin: 0px 10px;">
    &lt;form&gt;
        &lt;button id="btnBrowse" type="button" style="padding: 5px;" onclick="swfu.selectFiles(); this.blur();"&gt;
            Select Images <span style="font-size: 7pt;"></span></button>
    &lt;/form&gt;
    </div>
    <div id="divFileProgressContainer" style="height: 75px;"></div>
    <div id="thumbnails"></div>
</div>

So the handler.js. You want to have a look at the function uploadSuccess where the AddImage function is called. Change the 'thumbnail.php?id=' + server_data to '/path/to/your/pic/' + server_data. Server_data is what we echoed in the do_upload function. Also just scroll through the file to change the text messages and gif urls.
For debugging I echoed information from $this->upload->data(); and wrote alert(server_data) before the AddImage function is called in uploadSuccess.

Remember to fix the mime-type in system/application/config/mimes.php and add 'application/octet-stream'. Some say that this may be a security risk, I don't know, but it has to be done for it to work.

Code:
'jpeg'    =>    array('image/jpeg', 'image/pjpeg', 'application/octet-stream'),
'jpg'    =>    array('image/jpeg', 'image/pjpeg', 'application/octet-stream'),
'jpe'    =>    array('image/jpeg', 'image/pjpeg', 'application/octet-stream'),
'png'    =>    array('image/png',  'image/x-png', 'application/octet-stream'),

I hope this helps.

El Forum

[eluser]andjules[/eluser]
I managed to get this working too...
here are a couple of extra pointers to help the next person:
a) stating the obvious for newbies & people experiencing a 'brain fart' (I was a little bit of both): the controller that loads the view that displays the swfUpload page ISN'T part of the Upload controller shown in the example above. You could show the swfUpload function on your welcome controller/view, if you wanted. The Upload controller above is just where swfUpload SENDS the file
b) more imporantly, if you're using .htaccess, you'll need to add the folder/folder path you plan to upload to, e.g. notice the 'filetemp' (my upload folder) in the following:
Code:
RewriteEngine on
RewriteCond $1 !^(index\.php|images|assets|filetemp|robots\.txt)
RewriteRule ^(.*)$ /index.php?$1 [L]
or it will just hang (if you set the log threshold to debug in config.php, it'll tell you that the upload path doesn't seem to be valid)

El Forum

[eluser]mmorgensen[/eluser]
Hi All,

I found that when using SWFUpload that the build-in CI file uploading class will not get the Height and Width of the image. Not a problem for most, but for some it is!

I'm guessing it occurred when I modified the mimes.php to include "application/octet-stream" for images.

I worked around it like this...

Code:
$filedata = $this->upload->data();
list($width,$height) = getimagesize($filedata['full_path']);
$filedata['image_width'] = $width;
$filedata['image_height'] = $height;

Cheers
Matt

El Forum

[eluser]Gabriel Popa[/eluser]
Hi to all swfupload users,

i'm trying to do the same thing like you, but not for pictures. only for documents.

using controller with CI file_upload class working like a charm. Using with swfupload, i get upload complete message but no sign of uploaded file.

here it is my view:
Code:
<div id="flashUI" style="display: none;">
  <div>
       &lt;input type="text" id="txtFileName" name="txtFileName" disabled="true" style="border: solid 1px; background-color: #FFFFFF;" /&gt;
       &lt;input id="btnBrowse" type="button" value="Browse..." onclick="fileBrowse.apply(swfu)" /&gt;
                            (10 MB max)
  </div>
<div class="flash" id="fsUploadProgress"></div>
       &lt;input type="hidden" name="hidFileID" id="hidFileID" value="" /&gt;
</div>
<div id="degradedUI">
       &lt;input type="file" name="resume_degraded" id="resume_degraded" /&gt;                        (10 MB max)<br/>        
</div>

my js
Code:
swfu = new SWFUpload({
                            // Backend settings
                            upload_url: "&lt;?php echo $this->config->config['base_url'] ?&gt;welcome/do_upload",    // Relative to the SWF file, you can use an absolute URL as well.
                            flash_url : "&lt;?php echo $this->config->config['base_url'] ?&gt;resources/flashdevelop/flash9/swfupload_f9.swf",        // Relative to this file
            
                            post_params: {"PHPSESSID": "&lt;?=$this->session->userdata('session_id');?&gt;"},

                            file_size_limit : "10240",    // 10 MB
                            file_types : "*.doc;*.pdf",    
                            file_types_description : "All Files",
                            file_upload_limit : "0",     // Even though I only want one file I want the user to be able to try again if an upload fails
                            file_queue_limit : "1",     // this isn't needed because the upload_limit will automatically place a queue limit

                            swfupload_loaded_handler : swfUploadLoaded,
                            
                            file_queued_handler : fileQueued,
                            file_queue_error_handler : fileQueueError,
                            file_dialog_complete_handler : fileDialogComplete,

                            upload_progress_handler : uploadProgress,
                            upload_error_handler : uploadError,
                            upload_success_handler : uploadSuccess,
                            upload_complete_handler : uploadComplete,
            
                            swfupload_element_id : "flashUI",                                            // setting for the graceful degradation plugin
                            degraded_element_id : "degradedUI",
            
                            custom_settings : {
                                progress_target : "fsUploadProgress",
                                upload_successful : false
                            },
                            
                            debug: true
                        });

and my controller

Code:
$config['upload_path'] = './uploads/CVS/';
    $config['allowed_types'] = 'doc|pdf';
    $config['max_size']    = '100';
        
    $this->load->library('upload', $config);
      
    $this->upload->do_upload('txtFileName');
    $res = $this->upload->data();

    echo $res['file_name'];

i don't know where my problem is, but if i knew how to debug it.....

anyone can help?

Thanks

is there

El Forum

[eluser]mmorgensen[/eluser]
I think your problem is with the lack of a form_post_name setting in the SWFUploader.

While you have it set in the "degaded" html mode, flash does not post back with this value.

Try adding the following...

Code:
file_post_name: "txtFileName"

right above the line
Code:
file_size_limit : "10240",    // 10 MB

That will tell the SWF file what name to give the file upon POST.

I found it very helpful to use the CI log_message() function to troubleshoot this process. I would do a dump of the $_POST to see exactly what was getting passed to the server, it helped me pinpoint down the problem when I was troubleshooting the post parameters.

Code:
log_message('debug', explode(',' , $_POST) );

Note: The text for the log_message function is filed under the Error Handling section of the user guide.

Cheers
Matt

El Forum

[eluser]Gabriel Popa[/eluser]
i did all you learned me to do. i got this in swfupload debug:
Code:
SWF DEBUG: Event: uploadSuccess: File ID: SWFUpload_0_0 Data: Array
SWF DEBUG: (
SWF DEBUG:     [Filename] => d.doc
SWF DEBUG:     [PHPSESSID] => f10cd5d1c0cdd3e849d082437cfea72c
SWF DEBUG:     [Upload] => Submit Query
SWF DEBUG: )
SWF DEBUG: d.doc
SWF DEBUG: Event: uploadComplete : Upload cycle complete.

and this in CI log's

Code:
DEBUG - 2008-06-13 09:59:24 --&gt; Global POST and COOKIE data sanitized
DEBUG - 2008-06-13 09:59:24 --&gt; Language Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Loader Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Helpers loaded: url, form, email
DEBUG - 2008-06-13 09:59:24 --&gt; Database Driver Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Session Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Controller Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Data ARRAY: Array
(
    [Filename] => d.doc
    [PHPSESSID] => 38d7bd2341ddf4691216c27e1632a73b
    [Upload] => Submit Query
)

DEBUG - 2008-06-13 09:59:24 --&gt; Upload Class Initialized
DEBUG - 2008-06-13 09:59:24 --&gt; Language file loaded: language/english/upload_lang.php
ERROR - 2008-06-13 09:59:24 --&gt; The filetype you are attempting to upload is not allowed.
DEBUG - 2008-06-13 09:59:24 --&gt; Final output sent to browser
DEBUG - 2008-06-13 09:59:24 --&gt; Total execution time: 0.2919
Pages: 1 2 3