Sorting Listings: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
No edit summary
Line 1: Line 1:
==Sections CMS==
[[Category:CMS_Documentation]] [[Category:Littled Libraries]] [[Category:JQuery/AJAX]] [[Category:Web Development]]
*Hostmgr > Sections
 
*Is Sortable: checked
== Content Properties CMS ==
*Sorting URI: <code>/hostmgr/_ajax/utils/resort.php</code> (default shared AJAX handler script)
 
'''CMS''' > '''Content Properties'''
 
* '''Is Sortable''': checked
* '''Sorting URI''': <code>/hostmgr/_ajax/utils/resort.php</code> (default shared AJAX handler script)
 
== JavaScript ==
== JavaScript ==


Line 15: Line 20:
</syntaxhighlight>
</syntaxhighlight>


Listings container is stored in `dom.listings_container`, with a default value of `'.listings'`.
== PHP ==
 
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.
`/_classes/site_content/cache_class.php`
 
Typically the `<nowiki><table></nowiki>` markup is in a page content template, which is wrapped in a `div.listings` container by the top-level page.
 
==PHP==
<code>/_classes/site_content/cache_class.php</code>


Add include directives for both the parent page’s content and content filter classes:
Add include directives for both the parent page’s content and content filter classes:
Line 32: Line 30:
require_once (APP_CLASS_DIR."site_filters/press_filters_class.php");
require_once (APP_CLASS_DIR."site_filters/press_filters_class.php");
</syntaxhighlight>
</syntaxhighlight>
Update the set_filters() routine to include the filter class representing the page’s content type.
Update the set_filters() routine to include the filter class representing the page’s content type.


<code>/_classes/site_content/cache_class.php</code>
`/_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
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


<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
if ($this->filters instanceof filters_collection_class)
if ($this->filters instanceof filters_collection_class) {
{
     $this->filters->parse_filters();
     $this->filters->parse_filters();
     $this->filters->page_len->value = null; /* get all available records */
     $this->filters->page_len->value = null; /* get all available records */
}
}
</syntaxhighlight>
</syntaxhighlight>
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.
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.


Line 53: Line 52:
</syntaxhighlight>
</syntaxhighlight>


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


===Sortable container attributes===
Listings container is stored in `dom.listings_container`, with a default value of `'.listings'`.
(either TABLE or DIV)
 
* Selector used to identify the container element holding the sortable elements.
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.
** <code>id="listings-table"</code> for a TABLE element
 
** <code>id="listings-container"</code> for a DIV element
When loading modal dialogs and refreshing listings content, the library looks to the `data-po` attribute of `.listings table:first` by default.
* <code>data-tid</code> Value is the content type of the records contained in the table that can be sorted.
 
* <code>data-p</code> 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 <code>data-p</code> value is 51.) Typically this value is inserted with
Typically the `<nowiki><table></nowiki>` markup is in a page content template, which is wrapped in a `div.listings` container by the top-level page.
<syntaxhighlight lang="php">
 
data-p="<?=$filters->calc_rec_position()?>"
Sortable elements are defined by the `dom.sortable_selector` property (default `tr.rec-row`).
</syntaxhighlight>
* Use table header <code>'''<th>'''</code> tags and not table cell tags <code>'''<tr class="coltitle"><td></td></tr>'''</code> for the first row in the listings.


===Sortable element attributes===
== MySQL ==
*<code>id="#rr-[SECTION_ID]-[RECORD_ID]"</code> For each sortable row.
*<code>class="rec-row"</code> For each row that is sortable.
*<code>data-rid</code> Record id value.
*<code>id="pages-row-[XXX]"</code> (Albums only) ID of <tr> elements where [XXX] is the id of the album.
===Gallery listings===
*Sortable element selector is <code>tr.page-row</code> for listings within tables, and <code>.page-cell</code> for listings within DIV containers.
*The parent container attributes are rolled into
<syntaxhighlight lang="php">
<? include (COMMON_TEMPLATE_DIR."forms/images/gallery_listings_container.php"); ?>
</syntaxhighlight>
*When using the <code>gallery_listings_container.php</code> template it's necessary to load the gallery listings content on page load:
<syntaxhighlight lang="javascript">
$(document).ready(function(){
LITTLED.Gallery.retrieveGallery({pid: <?=$input->id->value?>});
});
</syntaxhighlight>
*<code>LITTLED.Gallery.retrieveGallery()</code> in turn calls <code>LITTLED.Gallery.bindGalleryHandlers()</code> which in turn calls <code>LITTLED.Gallery.configureSorting()</code>.


==MySQL==
Tables with sortable records must contain
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.
* An id column containing a unique id for the record.
[[Category:JQuery/AJAX]]
* A slot column holding the value of the record’s position in the listings relative to all other records.
[[Category:CMS_Documentation]]

Revision as of 05:57, 13 September 2014


Content Properties CMS

CMS > Content Properties

  • 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();
});

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");

Markup

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.

Sortable elements are defined by the dom.sortable_selector property (default tr.rec-row`).

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.