budyaga/yii2-cropper

Yii-Framework widget for uploading and cropping images

Cropper

Yii-Framework extension for uploading and cropping images, _(*1)

Installation

The preferred way to install this extension is through composer., _(*2)

Either run, _(*3)

php composer.phar require --prefer-dist budyaga/yii2-cropper "*"

or add, _(*4)

"budyaga/yii2-cropper": "*"

to the require section of your composer.json file., _(*5)

Usage

Once the extension is installed, simply use it in your code by :, _(*6)

use budyaga\cropper\Widget;

<?php $form = ActiveForm::begin(['id' => 'form-profile']); ?>
    <?php echo $form->field($model, 'photo')->widget(Widget::className(), [
        'uploadUrl' => Url::toRoute('/user/user/uploadPhoto'),
    ]) ?>
    <div class="form-group">
        <?php echo Html::submitButton('Save', ['class' => 'btn btn-primary']) ?>
    </div>
<?php ActiveForm::end(); ?>

Widget has following properties:, _(*7)

In UserController:, _(*8)

public function actions()
{
    return [
        'uploadPhoto' => [
            'class' => 'budyaga\cropper\actions\UploadAction',
            'url' => 'http://your_domain.com/uploads/user/photo',
            'path' => '@frontend/web/uploads/user/photo',
        ]
    ];
}

Action has following parameters:, _(*9)

You can use this widget on frontend and backend. For example: user can change his userpic and administrator can change users userpic., _(*10)

Operates as follows:

User click on new photo area or drag file, _(*11)

, _(*12)

The picture is loaded by JavaScript FileAPI., _(*13)

, _(*14)

This picture is displayed in the widget and users have the ability to crop it or upload another picture, _(*15)

, _(*16)

When the user clicks "Crop image", a request with file and coordinates is sent to the server. This picture is displayed in the form, and user can save it, or change crop area, or upload another photo., _(*17)

, _(*18)