[opgelost]detect images automatisch met supersized

[pedes]

ik gebruik een voor een cmsms website ook een plugin supersized
ik wil nu de afbeeldingen die worden gebruikt ophalen vanuit een directory.

het afbeeldingen pad voor de afbeeldingen zit normaal in de hardcoded in de jquery code, deze code kan je aanpassen met een stukje php ertussen, om zo de afbeeldingen op te halen uit een externe map.

als ik dit gewoon buiten een cmsms website doe lukt dit perfect, echter binnen een cmsms website lukt dit niet.

volgens mij heeft het met de smarty code te maken die cmsms gebruikt en dus werkt deze php integratie niet.

iemand die weet hoe ik dit doe zodat dit wel werkt binnen een cmsms website en hoe ik dus dit doe met smarty code

het gaat om deze code

Code: Select all

<?php
//path to directory to scan
$directory = "imgDir/";

//get all image files with a .jpg extension.
$images = glob($directory . "*.jpg");

//print each file name
foreach($images as $image)
{
echo "{image : 'http://urlHere.com/" . $image . "', title : '" .$image . "'},";
}
?>

hartelijk dank,
Peter

[Jos]

dat stukje php kun je toch simpelweg in een UDT plakken (let op, zonder <?php ?>) en die udt binnen je jqueryscript oproepen? {/literal}{jouwudt}{literal}

[pedes]

dag Jos,

nee dat werkt niet ! ... of ik doe iets verkeerd ?
de loading gif blijft draaien, foto's worden niet getoond.
$directory = "supersized/";
image : 'http://www.mijndomein.be/uploads/images/
kloppen zeker, want dit is het zelfde die gebruikt worden op de niet cmsms site en daar werkt het wel.

heb de volgende udt gemaakt {foto} :

Code: Select all

//path to directory to scan
$directory = "supersized/";

//get all image files with a .jpg extension.
$images = glob($directory . "*.jpg");

//print each file name
foreach($images as $image)
{
echo "{image : 'http://www.mijndomein.be/uploads/images/" . $image . "'},";
}

deze udt {foto} heb ik in de jquery geplaatst waar normaal de php code zou moeten zitten:

Code: Select all

{literal}	
	<__script__ type="text/javascript">  
			
			jQuery(function($){
				jQuery.supersized({
				
					//Functionality
					slideshow               :   1,		//Slideshow on/off
					autoplay				:	1,		//Slideshow starts playing automatically
					start_slide             :   1,		//Start slide (0 is random)
					random					: 	1,		//Randomize slide order (Ignores start slide)
					slide_interval          :   6000,	//Length between transitions
					transition              :   1, 		//0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
					transition_speed		:	2000,	//Speed of transition
					new_window				:	0,		//Image links open in new window/tab
					pause_hover             :   0,		//Pause slideshow on hover
					keyboard_nav            :   1,		//Keyboard navigation on/off
					performance				:	2,		//0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
					image_protect			:	1,		//Disables image dragging and right click with Javascript
					image_path				:	'images/', //Default image path

					//Size & Position
					min_width		        :   0,		//Min width allowed (in pixels)
					min_height		        :   0,		//Min height allowed (in pixels)
					vertical_center         :   0,		//Vertically center background
					horizontal_center       :   0,		//Horizontally center background
					fit_portrait         	:   0,		//Portrait images will not exceed browser height
					fit_landscape			:   0,		//Landscape images will not exceed browser width
					
					//Components
					navigation              :   0,		//Slideshow controls on/off
					thumbnail_navigation    :   0,		//Thumbnail navigation
					slide_counter           :   0,		//Display slide numbers
					slide_captions          :   0,		//Slide caption (Pull from "title" in slides array)
					                slides                                  :       [                       
{/literal}
                                      {foto}

{literal}
                                                                                                ]
				}); 
		    });
		    
		</__script>
               {/literal}

inde bron zie ik volgende in de jquery verschijnen (waar normaal de aanroep van de foto's zou moeten verschijnen :

Code: Select all

slides:       [                       
<br />
<b>Warning</b>:  Invalid argument supplied for foreach() in <b>/home/usernaam/domains/mijndomein.be/public_html/lib/classes/class.usertagoperations.inc.php(260) : eval()'d code</b> on line <b>8</b><br />                                                                                                ]

enig idee waar ik faal ...

mvg,
Peter

[Jos]

gezien de foutmelding is de variabele $images leeg. Weet je zeker dat de waarde van $directory klopt? Staat die inderdaad in de root van je site?

[pedes]

ik heb de udt iets moeten veranderen dan bij een gewone site zonder cmsms, nl:

Code: Select all

//path to directory to scan
$directory = "uploads/images/supersized/";

//get all image files with a .jpg extension.
$images = glob($directory . "*.jpg");

//print each file name
foreach($images as $image)
{
echo "{image : 'http://www.mijndomein.be/" . $image . "'},";
}

dan werkt het wel, MAAR nu zie ik dat ook de thumbs van de foto's die auto zijn gecreëerd in deze map worden mee gestuurd, wat uiteraard slechte supersized afbeelding geeft in de front-end.

is er een manier om die thumbs voor deze map uit te schakelen of een manier om deze niet in de udt op te nemen

mvg,
Peter

[Jos]

volgens mij moet dat kunnen door binnen de glob functie een zgn "reguliere expressie" te gebruiken. Ik ben daar niet voldoende deskundig in, maar als schotvoor de boeg:

Code: Select all

 $images = glob($directory . "[^(thumb_)]*.jpg"); 

[pedes]

dank u Jos
dit was meteen raak, wel voldoende deskundig dus ..

Thxs
Peter

[pedes]

een ander probleem bij het gebruik van deze udt.

alles werkt goed maar in IE krijg ik een jquery foutmelding.
dit blijkt van de afsluiting te komen bij het maken van de afbeeldingen lijst.

hieronder zie je de output, tussen de afbeeldingen komt steeds een komma te staan, maar bij de laatste afbeelding zou dit niet mogen .. om te functioneren in IE (bij alle andere browsers is dit geen probleem)

slides : [
{image : 'http://www.mijndomein.be/uploads/images ... elding.jpg'},
{image : 'http://www.mijndomein.be/uploads/images ... lding2.jpg'}, ]

mijn udt zie er nu zo uit:

Code: Select all

//path to directory to scan
$directory = "uploads/images/supersized/visie/";

//get all image files with a .jpg extension.
$images = glob($directory . "[^(thumb_)]*.jpg");

//print each file name
foreach($images as $image)
{
echo "{image : 'http://www.mijndomein.be/" . $image . "'},";
}

iemand een idee hoe ik er voor zorg dat er na de laatste afbeelding (en ook als er maar 1 afbeelding is) geen komma staat ?

Mvg,
Peter

[Jos]

Code: Select all

//path to directory to scan
$directory = "uploads/images/supersized/visie/";

//get all image files with a .jpg extension.
$images = glob($directory . "[^(thumb_)]*.jpg");

//print each file name
$slides = "";
foreach($images as $image)
{
$slides .= "{image : 'http://www.mijndomein.be/" . $image . "'},";
}
echo trim($slides, ',');

[pedes]

Jos,

ik heb zonet iets gevonden die het oplost (heb uw oplossing nog niet geprobeerd).

mijn udt ziet er nu zo uit:

Code: Select all

//path to directory to scan
$directory = "uploads/images/supersized/home/";

//get all image files with a .jpg extension.
$images = glob($directory . "[^(thumb_)]*.jpg");

//print each file name
$count=count($images);
$i=0;
foreach($images as $image){
if(++$i==$count)echo "{image : 'http://www.mijndomein.be/" . $image . "'}";
else echo "{image : 'http://www.mijndomein.be/" . $image . "'},";
}

dit werkt blijkbaar goed !