Album Image Uploads: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
==Upload Types==
[[Category:CMS Documentation]] [[Category:Littled Libraries]] [[Category:Albums CMS]] [[Category:JQuery/AJAX]]
===Content type without album===
 
===Album-based content using a gallery image as a thumbnail===
== Upload Types ==
=== Content type without album ===
 
=== Album-based content using a gallery image as a thumbnail ===
 
See: [[Album-based content using a gallery image as a thumbnail]]
 
* The thumbnail is a pointer to one of the album image records.
* The thumbnail is a pointer to one of the album image records.
* In the content properties CMS check the "use gallery image as thumbnail" option.
* In the '''Content Properties CMS''' check the '''use gallery image as thumbnail''' option.
* To make the edit and delete buttons available when the thumbnail image is clicked:
* To make the edit and delete buttons available when the thumbnail image is clicked:
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
Line 13: Line 20:
</syntaxhighlight>
</syntaxhighlight>
* In the page header for the details and edit pages:
* In the page header for the details and edit pages:
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript" highlight="2">
$(document).ready(function() {
$(document).ready(function() {
$('.image-upload-container').galleries('bindImageOverlayHandlers');
$('.image-upload-container').galleries('bindImageOverlayHandlers');
});
});
</script>
</syntaxhighlight>
</syntaxhighlight>


Line 24: Line 30:
*The gallery images have a different <code>type_id</code> value from the thumbnail image <code>image_link</code> record.
*The gallery images have a different <code>type_id</code> value from the thumbnail image <code>image_link</code> record.


==PHP Classes==
===Album-based content that does not require an image upload===
*Shared PHP classes
* The default setting for images requires that an image is uploaded with each album record that is created.
*<code>[COMMON_LIB]_classes/images/image_upload_class.php</code> (extends <code>image_link_class</code>)
* In some cases, it may be necessary to allow records to be created without an associated image.
* When creating a new album record, an <code>image_link</code> object is added to its <code>gallery</code> property.
** This instance is created in the <code>gallery::fill_from_input()</code> routine.
** By default this <code>image_link<code> object's <code>full->path->required</code> property is set to <code>TRUE</code>.
* To override the default setting, in custom content class derived from the <code>album</code> class override the <code>fill_from_input()</code> routine.
<syntaxhighlight lang="php" highlight="5">
function fill_from_input()
{
parent::fill_from_input();
if (is_array($this->gallery->list) && count($this->gallery->list)>0) {
$this->gallery->list[0]->full->path->required = false;
}
}
</syntaxhighlight>


==PHP Template Includes==
== PHP Classes ==
*<code>[COMMON_TEMPLATE_DIR]forms/images/thumbnail_overlay_buttons.php</code><br />Include this once somewhere on the page containing the image upload controls.
 
*For album-based uploads (both with linked and independent thumbnails)
* Shared PHP classes
* `[COMMON_LIB]_classes/images/image_upload_class.php` (extends `image_link_class`)
 
== PHP Template Includes ==
 
* `[COMMON_TEMPLATE_DIR]forms/images/thumbnail_overlay_buttons.php`<br />Include this once somewhere on the page containing the image upload controls.
* For album-based uploads (both with linked and independent thumbnails)
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
include (COMMON_TEMPLATE_DIR."forms/images/select_thumbnail_link_container.php");
include (COMMON_TEMPLATE_DIR."forms/images/select_thumbnail_link_container.php");
</syntaxhighlight>
</syntaxhighlight>
*For images within gallery listings:
* For images within gallery listings:
**IMG <code>class="gallery-edit"</code>
** IMG `class="gallery-edit"`
**IMG attributes <code>data-id</code> and <code>data-tid</code>
** IMG attributes `data-id` and <code>data-tid</code>
**<code>$('.gallery-edit')</code> handler is set in <code>LITTLED.Gallery.bindImageOverlayHandlers()</code>
** `$('.gallery-edit')` handler is set in `LITTLED.Gallery.bindImageOverlayHandlers()`
**single click: display edit and delete buttons overlaid on the image
** single click: display edit and delete buttons overlaid on the image
**double click: display the full-sized version of the image in a lightbox
** double click: display the full-sized version of the image in a lightbox


==JavaScript Libraries==
== JavaScript Libraries ==
*<code>[COMMON_LIB]scripts/littled/littled.js</code>
 
*<code>[COMMON_LIB]scripts/littled/listings.js</code>
* `[COMMON_LIB]scripts/littled/littled.js`
*<code>[COMMON_LIB]scripts/littled/gallery.js</code>
* `[COMMON_LIB]scripts/littled/listings.js`
* `[COMMON_LIB]scripts/littled/gallery.js`


==AJAX Handler Scripts==
==AJAX Handler Scripts==
*<code>[ADMIN_ROOT]_ajax/images/edit_image.php</code><br />Designed to handle uploading and editing images from within image and album listings.
*<code>[ADMIN_ROOT]_ajax/images/upload_image.php</code><br />Designed to handler uploading a single image within the parent article edit form.


==MySQL Tables==
* `[ADMIN_ROOT]_ajax/images/edit_image.php`<br />Designed to handle uploading and editing images from within image and album listings.
*<code>image_link</code>
* `[ADMIN_ROOT]_ajax/images/upload_image.php`<br />Designed to handler uploading a single image within the parent article edit form.
*<code>images</code>
 
*<code>site_section</code>
== MySQL Tables ==
*<code>section_properties</code>
 
* `image_link`
* `images`
* `site_section`
* `section_properties`
 
== See Also ==


==See Also==
*[[Radomizing Image Filenames]]
*[[Radomizing Image Filenames]]
[[Category:CMS Documentation]]
[[Category:Albums CMS]]
[[Category:JQuery/AJAX]]

Latest revision as of 22:31, 9 October 2015


Upload Types[edit]

Content type without album[edit]

Album-based content using a gallery image as a thumbnail[edit]

See: Album-based content using a gallery image as a thumbnail

  • The thumbnail is a pointer to one of the album image records.
  • In the Content Properties CMS check the use gallery image as thumbnail option.
  • To make the edit and delete buttons available when the thumbnail image is clicked:
include (COMMON_TEMPLATE_DIR."forms/images/thumbnail_overlay_buttons.php");
  • To insert an editable thumbnail image (either gallery-based or independent) into the edit form or details content include:
include (COMMON_TEMPLATE_DIR."forms/images/select_thumbnail_link_container.php");
  • In the page header for the details and edit pages:
$(document).ready(function() {
	$('.image-upload-container').galleries('bindImageOverlayHandlers');
});

Album-based content with thumbnail record independent of the gallery images[edit]

  • The thumbnail image_link record has the same type_id as the parent content record.
  • The gallery images have a different type_id value from the thumbnail image image_link record.

Album-based content that does not require an image upload[edit]

  • The default setting for images requires that an image is uploaded with each album record that is created.
  • In some cases, it may be necessary to allow records to be created without an associated image.
  • When creating a new album record, an image_link object is added to its gallery property.
    • This instance is created in the gallery::fill_from_input() routine.
    • By default this image_link object's full->path->required property is set to TRUE.
  • To override the default setting, in custom content class derived from the album class override the fill_from_input() routine.
function fill_from_input() 
{
	parent::fill_from_input();
	if (is_array($this->gallery->list) && count($this->gallery->list)>0) {
		$this->gallery->list[0]->full->path->required = false;
	}
}

PHP Classes[edit]

  • Shared PHP classes
  • [COMMON_LIB]_classes/images/image_upload_class.php (extends image_link_class)

PHP Template Includes[edit]

  • [COMMON_TEMPLATE_DIR]forms/images/thumbnail_overlay_buttons.php
    Include this once somewhere on the page containing the image upload controls.
  • For album-based uploads (both with linked and independent thumbnails)
include (COMMON_TEMPLATE_DIR."forms/images/select_thumbnail_link_container.php");
  • For images within gallery listings:
    • IMG class="gallery-edit"
    • IMG attributes data-id and data-tid
    • $('.gallery-edit') handler is set in LITTLED.Gallery.bindImageOverlayHandlers()
    • single click: display edit and delete buttons overlaid on the image
    • double click: display the full-sized version of the image in a lightbox

JavaScript Libraries[edit]

  • [COMMON_LIB]scripts/littled/littled.js
  • [COMMON_LIB]scripts/littled/listings.js
  • [COMMON_LIB]scripts/littled/gallery.js

AJAX Handler Scripts[edit]

  • [ADMIN_ROOT]_ajax/images/edit_image.php
    Designed to handle uploading and editing images from within image and album listings.
  • [ADMIN_ROOT]_ajax/images/upload_image.php
    Designed to handler uploading a single image within the parent article edit form.

MySQL Tables[edit]

  • image_link
  • images
  • site_section
  • section_properties

See Also[edit]