Sorting Listings

From Littledamien Wiki
Revision as of 05:51, 13 September 2014 by Video8 (talk | contribs) (→‎JavaScript)
Jump to navigation Jump to search

Sections CMS

  • Hostmgr > Sections
  • Is Sortable: checked
  • Sorting URI: /hostmgr/_ajax/utils/resort.php (default shared AJAX handler script)

JavaScript

Sorting logic is defined in littled/resort.js which is wrapped up in littled.js.

Example:

$(document).ready(function() {
	/* options can be passed as first argument to resort() */
	$('.listings table:first').resort();
});

Listings container is stored in dom.listings_container, with a default value of '.listings'.

The position_offset key is defined in keys.position_offset, with a default value of 'po'. This is the position of the first record currently being displayed on a page relative to the first record in the entire set of matching listings.

When loading modal dialogs and refreshing listings content, the library looks to the data-po attribute of .listings table:first by default.

Typically the `<table> markup is in a page content template, which is wrapped in a div.listings` container by the top-level page.

PHP

/_classes/site_content/cache_class.php

Add include directives for both the parent page’s content and content filter classes:

require_once (APP_CLASS_DIR."site_content/press_class.php");
require_once (APP_CLASS_DIR."site_filters/press_filters_class.php");

Update the set_filters() routine to include the filter class representing the page’s content type.

/_classes/site_content/cache_class.php

Potentially no changes need to be made to this class on a content-type-by-content-type basis as long as the default action for all content types is

if ($this->filters instanceof filters_collection_class)
{
    $this->filters->parse_filters();
    $this->filters->page_len->value = null; /* get all available records */
}

If some other action needs to be taken for a specific content type then a new case would need to be created in the retrieve_section_properties() routine.

Paging is handled with

include (COMMON_TEMPLATE_DIR."framework/navigation/listings_page_links.php");

HTML/CSS

List selectors, CSS classes, and HTML element attributes necessary for resorting.

Sortable container attributes

(either TABLE or DIV)

  • Selector used to identify the container element holding the sortable elements.
    • id="listings-table" for a TABLE element
    • id="listings-container" for a DIV element
  • data-tid Value is the content type of the records contained in the table that can be sorted.
  • data-p Index of the first record displayed on the page. Starts with 1. (For page 1 the value is 1. For page 10 with 5 records per page the data-p value is 51.) Typically this value is inserted with
data-p="<?=$filters->calc_rec_position()?>"
  • Use table header tags and not table cell tags for the first row in the listings.

Sortable element attributes

  • id="#rr-[SECTION_ID]-[RECORD_ID]" For each sortable row.
  • class="rec-row" For each row that is sortable.
  • data-rid Record id value.
  • id="pages-row-[XXX]" (Albums only) ID of elements where [XXX] is the id of the album.

Gallery listings

  • Sortable element selector is tr.page-row for listings within tables, and .page-cell for listings within DIV containers.
  • The parent container attributes are rolled into
<? include (COMMON_TEMPLATE_DIR."forms/images/gallery_listings_container.php"); ?>
  • When using the gallery_listings_container.php template it's necessary to load the gallery listings content on page load:
$(document).ready(function(){
	LITTLED.Gallery.retrieveGallery({pid: <?=$input->id->value?>});
});
  • LITTLED.Gallery.retrieveGallery() in turn calls LITTLED.Gallery.bindGalleryHandlers() which in turn calls LITTLED.Gallery.configureSorting().

MySQL

Tables with sortable records must contain

  • An id column containing a unique id for the record.
  • A slot column holding the value of the record’s position in the listings relative to all other records.