Delay

 
What it does

It delays the loading of the html required to show the display of any wppa shortcode, e.g. slideshow, list of album covers or thumbnails of any album.
Loading the content is delayed until one of the following events happen:

  • The document is loaded (DOMContentLoaded)
  • A given number of milliseconds after the document is loaded expires
  • A link is clicked
  • A button is pressed
How to activate

The WPPA shortcode has now the option of adding the shortcode argument delay=""
The argument value can be

  • 'yes': delay="yes" for delay until DOM ready
  • 'yes,time' e.g.: delay="yes,600" for delay until 600 ms after DOM ready
  • 'text,linktext' e.g.: delay="text,Click me" for delay until the link Click me is clicked
  • 'button,buttontext' e.g.: delay="button,Press me" for delay until the button is pressed
How it is implemented

When delayed, only the outer frame of the wppa container is loaded, containing the instructions to re-load te content with the finally required content.

Examples

[wppa type="filmonly" album="59" delay="yes,500"]


You may combine delay witch Caching:
[wppa type="thumbs" album="205" delay="text,View the fractals" cache="inf"]
View the fractals

[wppa type="generic" delay="button,View all albums" cache="inf"]

The page source shows:
<!-- End /wp-content/plugins/wp-photo-album-plus/wppa-ajax-front.php?action=wppa&wppa-action=render&wppa-size=840&wppa-moccur=3&wppa-fromp=6338&lang=en&wppa-occur=3&wppa-cache=inf&lang=en&resp=1 oc 3 0 queries in 0.9 ms. at 14:40 (cached) -->
Meaning: The content of this box is produced with 0 queries in 0.9 ms using the cached version.
Non-cached, it would show:
<!-- End /wp-content/plugins/wp-photo-album-plus/wppa-ajax-front.php?action=wppa&wppa-action=render&wppa-size=840&wppa-moccur=3&wppa-fromp=6338&lang=en&wppa-occur=3&wppa-cache=inf&lang=en&resp=1 oc 3 50 queries in 205.2 ms. at 14:47 -->
Meaning: The content of this box is produced with 50 queries in 205.2 ms

You can not delay a single image:
[wppa type="photo" photo="1" delay="yes"]