Welcome to the Cumulus Support forum.

Latest Cumulus MX V3 release 3.28.6 (build 3283) - 21 March 2024

Cumulus MX V4 beta test release 4.0.0 (build 4018) - 28 March 2024

Legacy Cumulus 1 release v1.9.4 (build 1099) - 28 November 2014 (a patch is available for 1.9.4 build 1099 that extends the date range of drop-down menus to 2030)

Download the Software (Cumulus MX / Cumulus 1 and other related items) from the Wiki

Automatic slide show from directory (PHP)- Better solutions?

Other discussion about creating web sites for Cumulus that doesn't have a specific subforum

Moderator: daj

User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Automatic slide show from directory (PHP)- Better solutions?

Post by ace2 »

I'm using a slideshow PHP page to display images that are in a directory, These images get uploaded daily and visiting the page( http://ace2weather.com/sunrise.htm )loads the images for the slideshow.
Although this works, it tends to stumble on load and the transition effects from image to image are poor..
I've searched high and low for a better slider that allows images to sorted with date or file name with better fade effects, but nothing that works well for what I'm after..
code for the PHP below
http://ace2weather.com/slide/images/slideshow.txt
Maybe you know of a better slideshow PHP that can grab images from a folder with automatic play and fade in/out effects...
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
BeaumarisWX
Posts: 357
Joined: Mon 09 Apr 2012 2:38 pm
Weather Station: Davis VP2 Plus - 24hr FARS
Operating System: Windows 10 Pro Hades Canyon
Location: Beaumaris, Tasmania, AU
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by BeaumarisWX »

Hi Chris,

I use this http://hrvistaweather.com/upload/upload/index.php by http://sye.dk/sfpg/

However I don't feel it meets all your requirements, customization may achieve it though.

The other one I use (uses) java and requires manual setup of image names etc http://hrvistaweather.com/webcam/index.php

The other one I use which is also not what your after I suppose uses java again (I use it for my GFS Maps) http://hrvistaweather.com/weather/wxgfs_slp.php can be found : http://dynamicdrive.com/dynamicindex4/simplegallery.htm

regards,
Tony Beaumaris, Tasmania (AUS)

CMX Mobile : https://beaumaris-weather.com/BWX/
CMX Default: https://beaumaris-weather.com/cumulusmx_default/
Colour Dashboard : https://beaumaris-weather.com/dashborad_color.php
Click below for Saratoga Template :
Image
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

Ideal for a gallery but not suitable for a slideshow..
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Automatic slide show from directory (PHP)- Better soluti

Post by beteljuice »

There are obviously lots of code snippets out there, which if the don't do what you want someone of your experince should be able to mash. ;)

I assume your biggest gripes are your image load times (which of course will be determined by their size, and the actual transition effect)

Here's one I found after a very quick search with a nice smooth transition which should be useable. http://javascriptkit.com/script/script2 ... ndex.shtml
Image
......................Imagine, what you will KNOW tomorrow !
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

beteljuice wrote:There are obviously lots of code snippets out there, which if the don't do what you want someone of your experince should be able to mash. ;)

I assume your biggest gripes are your image load times (which of course will be determined by their size, and the actual transition effect)

Here's one I found after a very quick search with a nice smooth transition which should be useable. http://javascriptkit.com/script/script2 ... ndex.shtml
I realise load time is dependent on total image size by how many are pre loaded
Thanks beteljuice, I actually skimmed that site but for some reason passed on it....
I'll take another look.....

:)
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

This script simply dos not want to run on my site and I have no idea why.....
Done everything in instructions and nothing, just doesn't like me!!!!

Code: Select all

<script src="http://www.ace2weather.com/testdemo/fpslideshowvar.php" type="text/javascript"></script>
<script type="text/javascript" src="http://www.ace2weather.com/testdemo/fpslideshow.js">
Edited as needed(demo.htm), Images in location where the PHP's, thumbnails in location(wanting to get rid of that anyway)
Maybe it won't run on my web space????
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Automatic slide show from directory (PHP)- Better soluti

Post by beteljuice »

You didn't give a link to the test page ....

It shouldn't make a difference but ..

fpslideshowvar.php begins

Code: Select all

<?

// try 

<?php
Image
......................Imagine, what you will KNOW tomorrow !
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

beteljuice wrote:You didn't give a link to the test page ....

It shouldn't make a difference but ..

fpslideshowvar.php begins

Code: Select all

<?

// try 

<?php


:bash: :bash:
It shouldn't make a difference but ..
:clap: :clap:
Yet it did!!! :groan:
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

And yet another issue, It like to count backwards instead of forwards (23,22,21 blah blah) with the date or changing it to file name
I've changed the date in fpslideshowvar. format to match time/date format

Code: Select all

$filedate=date ("D, d y H:i:s", filemtime($file));
but makes no difference, I suspect it's looking in the wrong section for file date/time...
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Automatic slide show from directory (PHP)- Better soluti

Post by beteljuice »

You are an awkward cuss :lol:

Sorting is NOT being done by the php part of the script but the js code (I don't know why ?)
So put that back the way it was (Presumeably a js recognizable format)

The options to sort by filename or date are at the bottom of the js script.

Code: Select all

Additional customizations

Inside fpslideshow.js at the very end you'll find the initialization code that jumps start the script:

fullpageslideshow.init({ //initialize script
 imagesobj: fpslideshowvar, //no need to change. Object variable referencing images as generated inside "fpslideshowvar.php"
 thumbdir: 'thumbnails', //sub directory directly below main images directory containing the thumbnail versions.
 sortby: 'date', //sort by "date" or "filename"
 fadeduration: 1000,
 thumbdimensions:[30,30],
 autorotate:{enabled:false, pause: 4000}
})
To change the order of the sort you will need to get your hands dirty :shock:

Code: Select all

			if (options.sortby=="date")
//				images.sort(function(a,b){return new Date(b[2])-new Date(a[2])})
				images.sort(function(a,b){return new Date(a[2])-new Date(b[2])})  // *** NEW
			else{
				images.sort(function(a,b){ //sort by file name
					var filea=a[1].toLowerCase(), fileb=b[1].toLowerCase()
//					return (filea<fileb)? -1 : (filea>fileb)? 1 : 0
					return (filea>fileb)? -1 : (filea<fileb)? 1 : 0  // *** NEW
				})
			
			}
Image
......................Imagine, what you will KNOW tomorrow !
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

Slight edit to

Code: Select all

return (fileb>filea)? -1 : (fileb<filea)? 1 : 0  // *** NEW
return (filea<fileb)? -1 : (filea>fileb)? 1 : 0
Only issue is how to permanently remove the thumbnails.
As it only displays in full screen, I added in using iframe, but those thumbnail dead links appear....

And, yes, yes I am awkward :lol:
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Automatic slide show from directory (PHP)- Better soluti

Post by beteljuice »

JQuery isn't 'my thing' I'm afraid ....

but you could try:

Code: Select all

		jQuery(function($){
			var slideshow=fullpageslideshow
			var layers=$('<div style="position:absolute;left:0;top:0; width:100%; height:100%;overflow:hidden;background:black;" />').clone().andSelf().appendTo(document.body)
//			var thumbs=$(thumbsarr.join('')).appendTo(document.body)
//			thumbs=thumbs.find('li')
//			thumbs.each(function(i){
//				var $thumb=$(this)
//				this._index=i
//				$thumb.css({left: 60*i+20})
//				$thumb.click(function(){
//					clearTimeout(slideshow.setting.rotatetimer)
//					slideshow.changeimage(this._index)
//				})
//			})
			slideshow.layers=layers
//			slideshow.thumbs=thumbs
			slideshow.templayer=$('<div style="position:absolute;left:-5000px;top:-5000px;visibility:hidden" />').appendTo(document.body)
			slideshow.signalcomplete()
			$(window).resize(function(){
				if (imagesarr[slideshow.curimage].complete==true)
					var cssattr=slideshow.scaleimage(imagesarr[slideshow.curimage])
					slideshow.layers.eq(slideshow.layerorder.fg).find('img').css(cssattr)
			})
		})
no guarantees !!!

... and to size / position on a page perhaps:

Code: Select all

	scaleimage:function(imageref){
		var od=imageref._specs, windoww=$(window).width(), windowh=$(window).height()
		var neww=(od.w>od.h)? windoww : Math.round(windowh*od.w/od.h)
		var newh=Math.round(neww*od.h/od.w)
		if (neww>windoww){
			neww=windoww
			newh=Math.round(neww*od.h/od.w)
		}
		else if (newh>windowh){
			newh=windowh
			neww=Math.round(newh*od.w/od.h)
		}
		var xpos=(neww>=windoww)? 0 : windoww/2-neww/2
		var ypos=(newh>=windowh)? 0 : windowh/2-newh/2
//		return {width:neww+'px', height:newh+'px', left:xpos+'px', top:ypos+'px', position:'absolute'}
		return {width:'500px', height:'350px', left:'20px', top:'200px', position:'absolute'}
// above values are examples ONLY
	},	
Image
......................Imagine, what you will KNOW tomorrow !
User avatar
ace2
Posts: 679
Joined: Tue 14 Jan 2014 12:38 pm
Weather Station: maxkon ws-1081pc
Operating System: windows 7 & 8
Location: Adelaide, south Australia, Australia
Contact:

Re: Automatic slide show from directory (PHP)- Better soluti

Post by ace2 »

A little bit of success but, unfortunately your edit on removing thumbnails did not work, I did try that first up, but I found another way of stopping them been added.
I removed these 2 line only which worked removing them but doesn't seem to effect the slides workings....

Code: Select all

//			thumbsarr.push('<li></li>')
		}
//		thumbsarr.push('</ul>')
This stops them loading, so that's that problem solved...
The display idea failed to the point of a black background and small slide window....doh...
I would have thought containing it in a div might work, but not....
So I'm still using the iframe method for now..
looks ok.....
test slidepage http://ace2weather.com/sunrisetest.htm
CHRIS
Image
web site
http://www.ace2weather.com
Follow me on Twitter
http://tinyurl.com/kwlr9re
YouTube channel
http://tinyurl.com/lehwpgp
Facebook page
http://tinyurl.com/k3sap4s
Tiny URL links used
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Automatic slide show from directory (PHP)- Better soluti

Post by beteljuice »

As I said
JQuery isn't 'my thing' I'm afraid ....
... and I haven't downloaded or run the files to 'dissect' them properly.
So you're on your own I'm afraid.
The display idea failed to the point of a black background and small slide window....
Was the 'slide' the size and position you asked for ?

If so it worked .. the background (colour) is a css property ;)
Image
......................Imagine, what you will KNOW tomorrow !
Post Reply