Geek asks and answers

Plupload Create multiple sketches

I found this thread when creating and loading the client side of sketches. The tread shows how to load the first image and then execute it by resizing it and reloading it. I was wondering if there is an easy way to add one more step so that the final result creates both the original, medium size and small picture.

A better solution is to trigger QueueChanged in the FileUploaded handler, and then call refresh. This will initiate the upload again for the same file and you can set a property that you read in the BeforeUpload handler to adjust the file size.

Warning # 1: you must load the thumbnail after the full-sized image, otherwise the full-sized image may have some buffer problems and may be cropped.

Warning # 2: This will only work if the bind call for FileUploaded happens after uploader.init (), otherwise the native uploader handler for FileUploaded will overwrite file.status to DONE after your handler.

below is the original response from this thread Thumbnail Plupload

uploader.bind('BeforeUpload', function(up, file) {
    if('thumb' in file)
      up.settings.resize = {width : 150, height : 150, quality : 100};
    else
      up.settings.resize = {width : 1600, height : 1600, quality : 100};
}

uploader.bind('FileUploaded', function(up, file) {
    if(!('thumb' in file)) {
        file.thumb = true;
        file.loaded = 0;
        file.percent = 0;
        file.status = plupload.QUEUED;
        up.trigger("QueueChanged");
        up.refresh();
    }
}
+5
source share
2 answers

quite simply, I did this in my project with two minor tweaks.

In upload.php, I made dynamic directory information:

$diretorio = $_REQUEST["diretorio"];
$targetDir = 'upload/'.$diretorio;

and changed the code in the boot interface:

uploader.bind('BeforeUpload', function(up, file) {
    if('thumb' in file){

        //thumb
        up.settings.url = 'upload/upload.php?diretorio=thumbs',
        up.settings.resize = {width : 100, height : 75, quality : 60};

        // medium size
        up.settings.url = 'upload/upload.php?diretorio=medium',
        up.settings.resize = {width : 200, height : 150, quality : 60}; 

    }else{
        up.settings.url = 'upload/upload.php?diretorio=full-size',
        up.settings.resize = {quality : 100};
    }    
        uploader.bind('FileUploaded', function(up, file) {
            if(!('thumb' in file)) {
                file.thumb = true;
                file.loaded = 0;
                file.percent = 0;
                file.status = plupload.QUEUED;
                up.trigger("QueueChanged");
                up.refresh();
            }
    });            
});
+7
source

The answer that Eduardo de Souza gives is very useful for me, but there some changes for this code to work here cannot load the environment file, and the other - the image doesn't resize as a resize parameter, given that I found some changes in my case which:

var i = 1;
uploader.bind('BeforeUpload', function (up, file) {
                if ('thumb' in file) {
                    if (i == 1) {
                        //thumb
                        up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=thumb',
                                up.settings.resize = {width: 80, height: 80, enabled: true};
                    } else {
                        // medium size
                        up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=medium',
                                up.settings.resize = {width: 800, height: 600, enabled: true};
                    }
                } else {
                    up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=full';
                }
                uploader.bind('FileUploaded', function (up, file) {
                    if (!('thumb' in file)) {
                        file.thumb = true;
                        file.loaded = 0;
                        file.percent = 0;
                        file.status = plupload.QUEUED;
                        up.trigger("QueueChanged");
                        up.refresh();
                    } else {
                        if (i < 2) {
                            i++;
                            file.medium = true;
                            file.loaded = 0;
                            file.percent = 0;
                            file.status = plupload.QUEUED;
                            up.trigger("QueueChanged");
                            up.refresh();
                        }
                    }
                });
            });

enabled:true resize, i URL- , , .

0

More articles:


All Articles