zxbodya/yii2-image-attachment

Extension for yii, to handle images attached to ActiveRecord

ImageAttachment

This extension intended to handle images associated with model., _(*1)

Extensions provides user friendly widget, for image upload and removal., _(*2)

, _(*3)

Features

1. Asynchronous image upload
2. Ability to generate few image versions with different configurations
3. Drag & Drop

Decencies

1. Yii2
2. Twitter bootstrap assets
3. Imagine library

Installation:

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

Either run, _(*5)

php composer.phar require --prefer-dist zxbodya/yii2-image-attachment "*@dev", _(*6)

or add, _(*7)

"zxbodya/yii2-image-attachment": "*@dev", _(*8)

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

Usage

Add ImageAttachmentBehavior to your model, and configure it, create folder for uploaded files., _(*10)

public function behaviors()
{
    return [
        'coverBehavior' => [
            'class' => ImageAttachmentBehavior::className(),
            // type name for model
            'type' => 'post',
            // image dimmentions for preview in widget 
            'previewHeight' => 200,
            'previewWidth' => 300,
            // extension for images saving
            'extension' => 'jpg',
            // path to location where to save images
            'directory' => Yii::getAlias('@webroot') . '/images/post/cover',
            'url' => Yii::getAlias('@web') . '/images/post/cover',
            // additional image versions
            'versions' => [
                'small' => function ($img) {
                    /** @var ImageInterface $img */
                    return $img
                        ->copy()
                        ->resize($img->getSize()->widen(200));
                },
                'medium' => function ($img) {
                    /** @var ImageInterface $img */
                    $dstSize = $img->getSize();
                    $maxWidth = 800;
                    if ($dstSize->getWidth() > $maxWidth) {
                        $dstSize = $dstSize->widen($maxWidth);
                    }
                    return [
                        $img->copy()->resize($dstSize),
                        ['jpeg_quality' => 80], // options used when saving image (Imagine::save)
                    ];
                },
            ]
        ]
    ];
}

Add ImageAttachmentAction in controller somewhere in your application. Also on this step you can add some security checks for this action., _(*11)

public function actions()
{
    return [
        'imgAttachApi' => [
            'class' => ImageAttachmentAction::className(),
            // mappings between type names and model classes (should be the same as in behaviour)
            'types' => [
                'post' => Post::className()
            ]
        ],
    ];
}

Add ImageAttachmentWidget somewhere in you application, for example in editing from., _(*12)

echo ImageAttachmentWidget::widget(
    [
        'model' => $model,
        'behaviorName' => 'coverBehavior',
        'apiRoute' => 'test/imgAttachApi',
    ]
)

Done! Now, you can use it in other places in app too:, _(*13)

if ($model->getBehavior('coverBehavior')->hasImage()) {
    echo Html::img($model->getBehavior('coverBehavior')->getUrl('medium'));
}