How to preload picture images into the plugin?

[khmerlove]

I do not know how to preload images from an existing directory into the plugin ? Please help me!!!

[alpo008]

Hi, khmerlove, are you still need a solution? Yesterday I had to invented one and I can share it. Sincerely, Alex.

[cresusjpt]

please share with us

[alpo008]

Hello @cresusjpt! Six months ago I did it this way: First I rendered existing photos in the hidden container .existing-photos.hidden

foreach ($model->getGalleryPhotos()->orderBy(['id' => SORT_DESC])->all() as $photo) : ...
//see the attached file ... php endforeach;

Second on document load I moved these photos into widget container and deleted hidden:

$(document).ready(function(){ var $existingPhotos = $(".existing-photos .files"); $("#room-uploadedphotos-fileupload .files").html($existingPhotos.html()); $(".existing-photos").remove(); });

And here you can see widget settings for my case:

echo FileUploadUI::widget([ 'model' => $model, 'attribute' => 'uploadedPhotos', 'url' => Url::toRoute(['photos-upload', 'id' => $model->id]), 'gallery' => false, 'fieldOptions' => [ 'accept' => 'image/*' ], 'clientOptions' => [ 'maxFileSize' => 2000000, 'prependFiles' => true, 'dataType' => 'json' ], 'clientEvents' => [ 'fileuploaddone' => 'function(e, data) { $(document).find(".existing-photos").remove(); var that = $(this).data("blueimp-fileupload")		$(this).data("fileupload"), getFilesFromResponse = data.getFilesFromResponse		that.options.getFilesFromResponse, files = getFilesFromResponse(data), template, deferred; template = that._renderDownload(files); $(".files").html(template); $(".files").find("tr.fade").addClass("in"); }', 'fileuploadfail' => 'function(e, data) { }', ], ]);

You can see the code here Please do not hesitate to contact me if you find any unclearness. Have a nice day. Alex.

[cresusjpt]

thank you, i'll try it and get back to you if i need more explication.

Le ven. 31 août 2018 à 10:57, Alexey POZHIDAEV notifications@github.com a écrit :

Hello @cresusjpt https://github.com/cresusjpt! Six months ago I did it this way: First I renderd existing photos in the hidden container ` getGalleryPhotos()->orderBy(['id' => SORT_DESC])->all() as $photo) : ?>

fileName ?> formatter->asShortSize(filesize($model->originalsDirectory . $photo->fileName), 2)?> Delete **Second** on document load I moved these photos into widget container and deleted the hidden one: $(document).ready(function(){ var $existingPhotos = $(".existing-photos .files"); $("#room-uploadedphotos-fileupload .files").html($existingPhotos.html()); $(".existing-photos").remove(); }); And here you can see widget settings for my case: $model, 'attribute' => 'uploadedPhotos', 'url' => Url::toRoute(['photos-upload', 'id' => $model->id]), 'gallery' => false, 'fieldOptions' => [ 'accept' => 'image/*' ], 'clientOptions' => [ 'maxFileSize' => 2000000, 'prependFiles' => true, 'dataType' => 'json' ], 'clientEvents' => [ 'fileuploaddone' => 'function(e, data) { $(document).find(".existing-photos").remove(); var that = $(this).data("blueimp-fileupload") || $(this).data("fileupload"), getFilesFromResponse = data.getFilesFromResponse || that.options.getFilesFromResponse, files = getFilesFromResponse(data), template, deferred;

            template = that._renderDownload(files);
            $(".files").html(template);
            $(".files").find("tr.fade").addClass("in");
        }',
        'fileuploadfail' => 'function(e, data) {
        }',
    ],
]);

?> ` Please do not hesitate to contact me if you find any unclearness. Have a nice day. Alex.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/2amigos/yii2-file-upload-widget/issues/135#issuecomment-417600218, or mute the thread https://github.com/notifications/unsubscribe-auth/AYPmgo3HCevAB6bJ4hqNxzYWghYN4jPKks5uWPqSgaJpZM4RY6iM .

[speker2010]

From Jquery File Upload plugin's html files I got this:

    var passscans = $('#documents-files-fileupload').addClass('fileupload-processing');
        $.ajax({
            url: '{$passScansUrl}',
            dataType: 'json',
            context: passscans[0]
        }).always(function () {
            $(this).removeClass('fileupload-processing');
        }).done(function (result) {
            $(this).fileupload('option', 'done')
                .call(this, $.Event('done'), {result: result});
        });

where in $passScansUrl: $passScansUrl = Url::toRoute(['site/get-files', 'app_id' => $model->Application->id]);

where get-files action:

public function actionGetPassScans() {
    $files = FileHelper::findFiles($directory);
    $output = [];
    foreach ($files as $file) {
        $fileName = basename($file);
        $path = '/img/temp/' . Yii::$app->session->id . DIRECTORY_SEPARATOR . $fileName;
        $output['files'][] = [
            'name' => $fileName,
            'size' => filesize($file),
            'url' => $path,
            'thumbnailUrl' => $path,
            'deleteUrl' => 'image-delete?name=' . $fileName,
            'deleteType' => 'POST',
        ];
    }
    return Json::encode($output);
}