Ajax-img-gallery

Ajax Image Gallery module for Drupal

objective : A nice and flexible gallery module for Drupal

Modules Depedency

• Imagefield• ImageCache• CCK

Standard Features

• Multi-upload• Multi-Edit• Admin options• Ajax Interface• Arranging options• CCK flexibility• thumbnail generation• Gallery Themes• Organic Group Integration• Views Integration

1


Functionalities

The AJAX IMAGE GALLERY module gives a selected content type the ability to display the content of other content types containing an imagefield with no multiple value. Here is how it would work :

I created a new content type called ‘Photo Gallery’ :

I created a new content type called ‘Photo’, with an imagefield in it :

I set the ‘Photo Gallery’ content type as an ‘AJAX IMAGE GALLERY’ content type :

I set the ‘Photo’ content type to be used by the ‘Photo Gallery’ content type :

photogallery

photo

photogallery

photophotogallery

2


Once it is configure, when the user create a new ‘Photo Gallery’, it will create several ‘Photo’ nodes, that will all be attached to the ‘Photo Gallery’ node.

The galleries can have 2 settings for the content : Display the ‘Photo Gallery’ content, or the ‘Photo’ content. If the gallery displays the ‘Photo Gallery’ content, the body and comments will be the same for all viewed images, as it will use the fields of the ‘Photo Gallery’ content type. If the gallery displays the ‘Photo’ content, the body and comments will be different for each viewed images, as it will use the fields of the ‘Photo’ content type.

photo

photo

photo

photophoto

photogallery

photo

photo

photo

photo

photo

photo

photo gallery

content

comments

photo gallery

photo

content

comments

photo

content

comments

photo

content

comments

photo

content

comments

photo

content

comments

3


Integrations

Views : Gallery should expose its fields to views, and should also expose the related images fields.

Organic Group : Groups should be able to have there private galleries.

4


Admin Section

5

Here the user can choose which content type should be the ‘gallery container’. Any

kind of content type is allowed

6

Here the admin can choose which content type should be used as the ‘Image’ content type. Only the content type

with an image field (imagefield) are listed here (no multiple value allowed).

7


Creating the gallery

9

This is the form to create a new gallery. All is done on this one and only page

10

When clicking on “Add New’ the user can choose a FOLDER of image, or one single image

11

After selecting the folder, the images should be uploaded and added to the gallery. A progress bar should indicate that the

user should wait until all the images are uploaded

12

When the upload is done, the user can choose to edit the fields of each image. These fields reflect the fields of the image content type.

By default, the title should be filled with the file name.

13

After editing the images fields, the images should appear in the images fieldset as icons. The user can select one or

more images by clicking on it, and then can use the menu to apply some modifications to all selected images

14

The user can modify the infos of each selected image by clicking on

the edit menu item

15

The modifications are updated on the list. Here the image has now a

new title.

16

The user can also re-arrange the order of the images. When overing an image, you can see an area at the bottom of the

image that the user can use to drag and drop

17

The order of the image is dynamically updated

18

The modification can be previewed live, but the user will need to click on ‘Update’ to make the modification effective. A message should warn the user about that, and the modified image should

have a different background (here blue)

19

As images are nodes, the user can also re-use images that he already uploaded previously. By

clicking on ‘Add existing’ the user can browse older images he or she previously uploaded.

20

Like before, just click on an image to select it.

21

The user should be able to select multiple images. Click on the ‘Add’ input to add all the

selected images.

22

Now the images are added to the gallery.

23

The user can REMOVE FROM THE GALLERY any image by just clicking on ‘Remove’ after selecting images. Another section should

be dedicated to DELETE the images from the server.

24

After clicking on ‘Remove’, the user can either UPDATE the modifications, or CANCEL in case of an error by

clicking on ‘CANCEL’

25

The user can also change the thumbnail of the gallery that will be displayed when the gallery is viewed as a teaser.

First select the image.

27

Then click on ‘Thumbnail’ to make the selected image the thumbnail of the gallery. A little Star icon should indicate

which image is the thumbnail of the gallery.

28


Viewing the gallery

29

The two diferences between this module and Image gallery module, is that other images are represented by icons, and

the content is updated with AJAX.

30

When overing the image, if settings allow it, the user can view the original image in a new window.

31

Ajax-img-gallery

Documents

Transcript of Ajax-img-gallery