Ajax-img-gallery
description
Transcript of 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
Ajax Image Gallery module for Drupal
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
Ajax Image Gallery module for Drupal
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
Ajax Image Gallery module for Drupal
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
Ajax Image Gallery module for Drupal
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
8
Ajax Image Gallery module for Drupal
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
26
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
Ajax Image Gallery module for Drupal
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