image-attachment user friendly widget, to manage(upload, remove, replace) image associated with model

ImageAttachment

  1. Features
  2. Decencies
  3. Installation:
  4. Contributing
  5. Resources
  6. Changelog

This extension intended to handle actions with images associated with model.

Extensions provides user friendly widget, to upload and remove image.

Screenshots: Yii image attachement screenshots

Features

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

Decencies

  1. Yii
  2. Twitter bootstrap
  3. yii-image component

Installation:

0. Download and extract extension somewhere in your application(in this guide into extensions/imageAttachment). Also available in composer.

  1. Add ImageAttachmentBehavior to you model, and configure it, create folder for uploaded files.
public function behaviors()
        {
            return array(
                'preview' => array(
                    'class' => 'ext.imageAttachment.ImageAttachmentBehavior',
                    // size for image preview in widget
                    'previewHeight' => 200,
                    'previewWidth' => 300,
                    // extension for image saving, can be also tiff, png or gif
                    'extension' => 'jpg',
                    // folder to store images
                    'directory' => Yii::getPathOfAlias('webroot').'/images/productTheme/preview',
                    // url for images folder
                    'url' => Yii::app()->request->baseUrl . '/images/productTheme/preview',
                    // image versions
                    'versions' => array(
                        'small' => array(
                            'resize' => array(200, null),
                        ),
                        'medium' => array(
                            'resize' => array(800, null),
                        )
                    )
                )
            );
        }
  1. Add ImageAttachmentAction in controller somewhere in your application. Also on this step you can add some security checks for this action.
class ApiController extends Controller
        {
            public function actions()
            {
                return array(
                    'saveImageAttachment' => 'ext.imageAttachment.ImageAttachmentAction',
                );
            }
        }
  1. Add ImageAttachmentWidget somewhere in you application, for example in editing from.
$this->widget('ext.imageAttachment.ImageAttachmentWidget', array(
            'model' => $model,
            'behaviorName' => 'preview',
            'apiRoute' => 'api/saveImageAttachment',
        ));
  1. It is done! You can use it now.
if($model->preview->hasImage())
            echo CHtml::image($model->preview->getUrl('medium'),'Medium image version');
        else
            echo 'no image uploaded';

Contributing

Pull requests are welcome! Also, if you any ideas or questions about - welcome to issue tracker

Resources

Forum discussion

Extension, on Bitbuket

Image component, on Bitbuket

Example application - it is fork from yii blog demo, with some of my extensions.

Changelog

  • December 2, 2013 - update documentation, added min size for preview, fix bug with photo removal, on some urlManager configurations, bug fix for directory creation, fixes in updateImages method.
  • September 4, 2013 - Fix bugs: when using model with composite key, with automatic directory creation
3 0
22 followers
3 070 downloads
Yii Version: Unknown
License: BSD-2-Clause
Category: User Interface
Developed by: Bogdan Savluk
Created on: Aug 29, 2013
Last updated: 10 years ago

Downloads

show all

Related Extensions