README

👁 Latest Version
👁 Software License
👁 Build Status
👁 Coverage Status
👁 Quality Score
👁 Total Downloads

Renders a BlueImp jQuery File Upload plugin. That plugin integrates multiple file selection, drag&drop support, progress bars, validation and preview of images.

Installation

The preferred way to install this extension is through composer.

Either run

$ composer require 2amigos/yii2-file-upload-widget:~1.0

or add

"2amigos/yii2-file-upload-widget": "~1.0"

to the require section of your composer.json file.

Usage

The widget comes with two flavors:

• FileUpload: Basic and BasicPlus
• FileUploadUI: BasicPlus UI

<?php
use dosamigos\fileupload\FileUpload;

// without UI
?>

<?= FileUpload::widget([
 'model' => $model,
 'attribute' => 'image',
 'url' => ['media/upload', 'id' => $model->id], // your url, this is just for demo purposes,
 'options' => ['accept' => 'image/*'],
 'clientOptions' => [
 'maxFileSize' => 2000000
 ],
 // Also, you can specify jQuery-File-Upload events
 // see: https://github.com/blueimp/jQuery-File-Upload/wiki/Options#processing-callback-options
 'clientEvents' => [
 'fileuploaddone' => 'function(e, data) {
 console.log(e);
 console.log(data);
 }',
 'fileuploadfail' => 'function(e, data) {
 console.log(e);
 console.log(data);
 }',
 ],
]); ?>

<?php
use dosamigos\fileupload\FileUploadUI;

// with UI
?>
<?= FileUploadUI::widget([
 'model' => $model,
 'attribute' => 'image',
 'url' => ['media/upload', 'id' => $tour_id],
 'gallery' => false,
 'fieldOptions' => [
 'accept' => 'image/*'
 ],
 'clientOptions' => [
 'maxFileSize' => 2000000
 ],
 // ...
 'clientEvents' => [
 'fileuploaddone' => 'function(e, data) {
 console.log(e);
 console.log(data);
 }',
 'fileuploadfail' => 'function(e, data) {
 console.log(e);
 console.log(data);
 }',
 ],
]); ?>

<?php

// action examples

public function actionImageUpload()
{
 $model = new WhateverYourModel();

 $imageFile = UploadedFile::getInstance($model, 'image');

 $directory = Yii::getAlias('@frontend/web/img/temp') . DIRECTORY_SEPARATOR . Yii::$app->session->id . DIRECTORY_SEPARATOR;
 if (!is_dir($directory)) {
 FileHelper::createDirectory($directory);
 }

 if ($imageFile) {
 $uid = uniqid(time(), true);
 $fileName = $uid . '.' . $imageFile->extension;
 $filePath = $directory . $fileName;
 if ($imageFile->saveAs($filePath)) {
 $path = '/img/temp/' . Yii::$app->session->id . DIRECTORY_SEPARATOR . $fileName;
 return Json::encode([
 'files' => [
 [
 'name' => $fileName,
 'size' => $imageFile->size,
 'url' => $path,
 'thumbnailUrl' => $path,
 'deleteUrl' => 'image-delete?name=' . $fileName,
 'deleteType' => 'POST',
 ],
 ],
 ]);
 }
 }

 return '';
}

public function actionImageDelete($name)
{
 $directory = Yii::getAlias('@frontend/web/img/temp') . DIRECTORY_SEPARATOR . Yii::$app->session->id;
 if (is_file($directory . DIRECTORY_SEPARATOR . $name)) {
 unlink($directory . DIRECTORY_SEPARATOR . $name);
 }

 $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);
}

Please, check the jQuery File Upload documentation for further information about its configuration options.

Using the Actions

TODO

Testing

$ ./vendor/bin/phpunit

Contributing

Please see CONTRIBUTING for details.

Credits

• Antonio Ramirez
• All Contributors

License

The BSD License (BSD). Please see License File for more information.

👁 687474703a2f2f7777772e67726176617461722e636f6d2f6176617461722f35353336333339346437323934356666376564333132353536656330343165302e706e67

web development has never been so fun
www.2amigos.us