Yii 1.1: imagesgallerymanager

Allows to manage image gallery
66 followers

This widget allows to add gallery management with following features:

  • Multiple file upload in modern browser
  • Optional editing image name and description
  • Arrange images in gallery
  • Multiply images actions - edit, removal
  • Behavior to add gallery to any model

Gallery manager screenshots:

GalleryManager images list

Few more screenshots: drag & drop upload, editing image information, upload progress,

Requirements

  • Tested with Yii 1.1.13, but should work with previous versions too
  • Twitter bootstrap css(widget is made using some classes from it)
  • Image component, from extensions repository or better my fork of it

Usage

  1. Checkout source code to your project, for example to ext.galleryManager.
  2. Install and configure image component(https://bitbucket.org/z_bodya/yii-image).
  3. Add tables for gallery into database (there is sql scheme and migration samples in migrations folder in extension)
  4. Import gallery models to project, by adding "ext.galleryManager.models.*" to import in config/main.php
  5. Add GalleryController to application or module controllerMap.
  6. Configure and save gallery model
  7. Render widget for gallery

Example:

// configure and save gallery model
$gallery = new Gallery();
$gallery->name = true;
$gallery->description = true;
$gallery->versions = array(
    'small' => array(
        'resize' => array(200, null),
    ),
    'medium' => array(
        'resize' => array(800, null),
    )
);
$gallery->save();
 
// render widget in view
$this->widget('GalleryManager', array(
    'gallery' => $gallery,
    'controllerRoute' => '/admin/gallery', //route to gallery controller
));

Using GalleryBehavior

Using gallery behavior is possible to add gallery to any model in application.

To use GalleryBehavior:

Add it to your model:

Example:

public function behaviors()
{
    return array(
        'galleryBehavior' => array(
            'class' => 'GalleryBehavior',
            'idAttribute' => 'gallery_id',
            'versions' => array(
                'small' => array(
                    'centeredpreview' => array(98, 98),
                ),
                'medium' => array(
                    'resize' => array(800, null),
                )
            ),
            'name' => true,
            'description' => true,
        )
    );
}

Add gallery widget to your view:

Example:

<h2>Product galley</h2>
<?php
if ($model->galleryBehavior->getGallery() === null) {
    echo '<p>Before add photos to product gallery, you need to save product</p>';
} else {
    $this->widget('GalleryManager', array(
        'gallery' => $model->galleryBehavior->getGallery(),
    ));
}
?>

Changing image versions for gallery associated with behavior

  1. Update your model with new versions configuration
  2. Run following code(best place for it - in migration):
$models = Model::model()->findAll();
foreach($models as $model) $model->galleryBehavior->changeConfig();

Note: to run in migration you should define 'webroot' path alias.

Changelog

  • September 2, 2013 - Italian translation, some refactoring
  • May 14, 2013 - German translation
  • March 1, 2013 - refactoring, styles upgrade
  • February 26, 2013 - display upload progress
  • February 20, 2013 - added support for drag & drop images upload
  • January 4, 2013 - fixed XSS possibility in html-templates on client side. made some optimisations
  • November 18, 2012 - Added CSRF protection support.
  • Octover 23, 2012 - Fixed mistake in db schema that can cause upload errors on some mysql configurations.
  • August 7, 2012 - Fixed bug with photo select.
  • August 2, 2012 - Added ability use few gallery manager widgets on same page. Moved styles and scripts from view to separate files, added minified script versions.
  • July 29, 2012 - Fixed bug in behavior when tring to insert new record.
  • July 24, 2012 - Begin using jquery.iframe.transport to make ajax file upload in older browsers. Finish work on GalleryBehavior. Remove form tags from widget to make it possible to add it into anouther form tag.
  • July 13, 2012 - Fixed bug(reported by DrMabuse on bitbuket). Bug was in saving order of recently uploaded images.

Resources

Total 20 comments

#19401 report it
Trejder at 2015/06/18 09:14am
Re: Capture Camera

Yeah, sorry for my bad day and for my bad attitude as well, that was rude. Sorry.

If I'm not mistaken, you're trying to use HTML5 or browser or iOS build-in camera capture feature. It should work here, if it works on other extensions / forms, by just adding accept="image/*;capture". I don't know, why this is not working here, but I fear, that since this question is iOS-specific, then there will not be many people here able to help you.

Anyway, you should rather ask this question on Yii forum. Comments shouldn't be uses for asking technical questions. I know, that many people here ignores this, but that is fact. Comments should be used in general for providing feedback (bug reports, feature requests) not for technical questions (how to do this, why that isn't working).

#19104 report it
Trejder at 2015/03/17 06:54am
Code repository and demo application

As mentioned in below comments, main repository at BitBucket is not accessible and does not provide a code to clone. You should use GitHub repository at https://github.com/zxbodya/yii-gallery-manager or download .tar.gz file from this page.

There's a nice looking and (nearly) ready to use demo application found at BitBucket (this time repository is cloneable): https://bitbucket.org/z_bodya/yii-demo-blog. It contains Gallery Manager and other extensions made by this author.

When you get it running, don't be surprised, that you see no sign of gallery manager at first. To see it in action, you should edit any post (or create new one), because gallery manager widget has been included only in this view (and in post view in frontend, once particular view contains some gallery).

This is very simple demo, and need some sort of work to port it to working application. But, for sure this is a good starting point for dealing with all troubles you may have with this extension. And a nice thing from author, that he wanted to spare his time not only on writing extension itself, but also for providing working demo application. Big thumb up from my side! :>

Note, that cloned code does not contain assets folder and protected/runtime folder. You should create these two in point 2.5 (before changing folder permissions) of instruction mentioned in BitBucket repository.

#18806 report it
DryKillLogic at 2015/01/12 12:54pm
Support MongoDB

It would be great mongo support in the Yii2 version. Thanks!.

#18560 report it
Bogdan Savluk at 2014/11/17 10:23am
re: Yii2

Hi, Is there a version for yii2?

It is planned(already started porting), but not done yet. if you are interested - here it is: https://github.com/zxbodya/yii2-gallery-manager

#18558 report it
ahmed.ismail at 2014/11/17 05:37am
Yii2

Hi, Is there a version for yii2?

#17819 report it
Bogdan Savluk at 2014/07/24 08:31pm
re: help me pls
#17817 report it
erickMartinez at 2014/07/24 01:27pm
help me pls

someone could give me an example :( i dont understand

#17787 report it
Bogdan Savluk at 2014/07/22 01:26pm
re: cover

It would be useful in some cases, but in most of them probably no.

My suggestion is - better upload cover separately. (for example using image-attachment extension )

Anyway, if you need it - there is a branch with this functionality.

#17786 report it
paskuale at 2014/07/22 12:31pm
cover

Hi, would be nice to add the ability to select an image as the cover of the gallery, or not ? :)

#17773 report it
Bogdan Savluk at 2014/07/21 05:01pm
re: jquery issue

It is because of missing twitter bootstrap scripts.

P.S. please, use forum or issue tracker on bitbucket for such questions.

#17770 report it
paskuale at 2014/07/21 01:02pm
jquery issue

After image added, firebug return me -> TypeError: $editorModal.modal is not a function, in ".../extensions/gallerymanager/assets/jquery.galleryManager.js" line 106

#17738 report it
Bogdan Savluk at 2014/07/18 06:58am
re: trouble clone by bitbucket

Because it is mercurial repository...

You can fork it from mirror on github: https://github.com/zxbodya/yii-gallery-manager

#17736 report it
paskuale at 2014/07/18 05:50am
trouble clone by bitbucket

Hi, I fork the repo ... but in console git clone get me repository not found !!! Why ?

#16374 report it
propelera at 2014/02/16 12:52pm
Can I select only one picture from gallery?

Hi, if I want to choose main poster of the article can I choose only one image from uploaded images and get it's url in any field?

#13518 report it
Bogdan Savluk at 2013/06/03 10:00am
re: How to use widget by ajax request.

Originally it is not designed to load via ajax.. but maybe later I will add such ability

For now, I have written short instructions how to load widget via ajax: https://bitbucket.org/z_bodya/gallerymanager/issue/11

#13513 report it
hemc at 2013/06/03 08:35am
How to use widget by ajax request.

Thanks for this Great widget.I have setup widget as mentioned in doc and it is working properly on my site. Problem arises When i try load widget by it ajax call.It shows only add, select, edit and remove button only. No preview of the image available.When i click add it popup windows explorer and after select file when i click open, It does nothing. Can you Please guide me how can i achieve this widget working by ajax request?

Thanks in advance.

#13046 report it
DryKillLogic at 2013/04/30 09:38am
Limit

Excellent extension!. The only missing feature is the possibility to set a image limit.

#13040 report it
Bogdan Savluk at 2013/04/30 04:52am
re: js and css errors

Seems you need to include twitter bootstrap styles and scripts to your page.

P.S. For such questions, there is forum.

#13037 report it
igorska at 2013/04/30 03:42am
js and css errors

I see js errors on .modal call in js and seems some css not found. Author please update module

#12457 report it
lostphp at 2013/03/22 05:34am
I want to use this extension, but can not configured

I want to use this extension, but can not configured. Is there a detailed example?

Leave a comment

Please to leave your comment.

Create extension