<?php
/* 
= Render hidden div in page to preload images
* WordPress: 3.3.1
* Version: 1.0
* URL: elbone.com.au
* Files: functions.php
*/
add_action('get_header', 'elbone_image_preloader');
if (!function_exists('elbone_image_preloader')) {    	
	function elbone_image_preloader() {
		$folder = '/images/'; // images directory in theme
		$dir = get_stylesheet_directory().$folder;
		$url = get_stylesheet_directory_uri().$folder;
		$types = array('jpg','gif','png');
		$files = array();
  		if ($handle = opendir($dir)) {
    		while(false !== ($file = readdir($handle))) {
      			$extension = strtolower(substr(strrchr($file,'.'),1));
      			if($extension && in_array($extension, $types)) {
        			$files[] = $file;
      			}
    		}
    		closedir($handle);
		}
		if(count($files)) {
  			$i = 0;
  			echo "\n", '<div style="display: none">', "\n";
  			echo '<!-- Preloaded images: ('.count($files).') -->', "\n";
  			foreach($files as $index => $file) {
  				$i++;
				echo '<img data-count="'.$i.'" src="'.$url.$file.'" />', "\n";
			}
			echo '</div>', "\n";	
		}
	}
}
?>