Randomizing the Featured Content Slider?

[gtaunt]

1) Script Title: Featured Content Slider

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tentslider.htm

3) Describe problem:

Not so much a problem as an idea. Is it possible to have the content of the Featured Content Slider cycle randomly instead of in order? Thanks for any thoughts.

[jscheuer1]

In the contentslider.js file replace this:

autorotate:function(setting){
 window["fcsautorun"+setting.id]=setInterval(function(){featuredcontentslider.turnpage(setting, "next")}, setting.autorotate[1])
},

with:

randomize:function(setting){
var n = Math.ceil(Math.random()*setting.contentdivs.length);
if(n == setting.currentpage)
n--;
return n;
},

autorotate:function(setting){
var nxt = function(setting){return setting.random? featuredcontentslider.randomize(setting) : "next";}
 window["fcsautorun"+setting.id]=setInterval(function(){featuredcontentslider.turnpage(setting, nxt(setting))}, setting.autorotate[1])
},

Once you have that, it will allow you to set random here (in the on page call):

featuredcontentslider.init({
	id: "slider1",  //id of main slider DIV
	contentsource: ["inline", ""],  //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
	toc: "#increment",  //Valid values: "#increment", "markup", ["label1", "label2", etc]
	nextprev: ["Previous", "Next"],  //labels for "prev" and "next" links. Set to "" to hide.
	revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
	enablefade: [true, 0.2],  //[true/false, fadedegree]
	autorotate: [true, 3000],  //[true/false, pausetime]
	random: true, //true/false - defaults to false (requires autorotate be set to true with a pausetime)
	onChange: function(previndex, curindex){  //event handler fired whenever script changes slide
		//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
		//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
	}
})

</script>

[gtaunt]

Thanks so much for providing this. I really appreciate your time and effort.

[javoec]

Thanks for the script change to work in random mode...

I was thinking.. is it difficult to make the script to be random when I enter the site or go to another page? ..because by default, the script remembers the last seen slide with Cookies according to the description of it.

I'm no JavaScript expert, could it be something in the onChange: function(previndex, curindex) function?

It would be great to know how to make it random, but always random.. I dunno if there's somewhere something in the configuration to make it work like I mentioned before.

Thanks in advance.

[jscheuer1]

In the future, please start a new thread for a new question.

That said, here (in the main script) set to false as shown:

//** Featured Content Slider script- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com.
//** May 2nd, 08'- Script rewritten and updated to 2.0.
//** June 12th, 08'- Script updated to v 2.3, which adds the following features:
			//1) Changed behavior of script to actually collapse the previous content when the active one is shown, instead of just tucking it underneath the later.
			//2) Added setting to reveal a content either via "click" or "mouseover" of pagination links (default is former).
			//3) Added public function for jumping to a particular slide within a Featured Content instance using an arbitrary link, for example.

//** July 11th, 08'- Script updated to v 2.4:
			//1) Added ability to select a particular slide when the page first loads using a URL parameter (ie: mypage.htm?myslider=4 to select 4th slide in "myslider")
			//2) Fixed bug where the first slide disappears when the mouse clicks or mouses over it when page first loads.

var featuredcontentslider={

//3 variables below you can customize if desired:
ajaxloadingmsg: '<div style="margin: 20px 0 0 20px"><img src="loading.gif" /> Fetching slider Contents. Please wait...</div>',
bustajaxcache: true, //bust caching of external ajax page after 1st request?
enablepersist: false, //persist to last content viewed when returning to page?

settingcaches: {}, //object to cache "setting" object of each script instance

jumpTo:function(fcsid, pagenumber){ //public function to go to a slide manually.
	this.turnpage(this.settingcaches[fcsid], pagenumber)
},

[javoec]

In the future, please start a new thread for a new question.

Sorry, it was my first post over here, I didn't want to start a new thread because my question is someway similar.

That said, here (in the main script) set to false as shown:

//** Featured Content Slider script- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com.
//** May 2nd, 08'- Script rewritten and updated to 2.0.
//** June 12th, 08'- Script updated to v 2.3, which adds the following features:
			//1) Changed behavior of script to actually collapse the previous content when the active one is shown, instead of just tucking it underneath the later.
			//2) Added setting to reveal a content either via "click" or "mouseover" of pagination links (default is former).
			//3) Added public function for jumping to a particular slide within a Featured Content instance using an arbitrary link, for example.

//** July 11th, 08'- Script updated to v 2.4:
			//1) Added ability to select a particular slide when the page first loads using a URL parameter (ie: mypage.htm?myslider=4 to select 4th slide in "myslider")
			//2) Fixed bug where the first slide disappears when the mouse clicks or mouses over it when page first loads.

var featuredcontentslider={

//3 variables below you can customize if desired:
ajaxloadingmsg: '<div style="margin: 20px 0 0 20px"><img src="loading.gif" /> Fetching slider Contents. Please wait...</div>',
bustajaxcache: true, //bust caching of external ajax page after 1st request?
enablepersist: false, //persist to last content viewed when returning to page?

settingcaches: {}, //object to cache "setting" object of each script instance

jumpTo:function(fcsid, pagenumber){ //public function to go to a slide manually.
	this.turnpage(this.settingcaches[fcsid], pagenumber)
},

I tried your solution. Apparently that makes the Feature Content Slider to start with the 1st slide listed each time I (for example) reload the whole page. Interesting since I can now always make people see the 1st slide (that I can emphasize the most) and then the sliders can go random.

Thanks a lot!

That works for me, but what I was also wondering (according to my previous post) is how to make that, each time I enter or reload the page, the Feature Content Slider could show me any of the slides in random order.

[jscheuer1]

OK, in contentslider.js modify the highlighted line as shown (add red):

init:function(setting){
	var persistedpage=this.getCookie("fcspersist"+setting.id) || 1
	var urlselectedpage=this.urlparamselect(setting.id) //returns null or index from: mypage.htm?featuredcontentsliderid=index
	this.settingcaches[setting.id]=setting //cache "setting" object
	setting.contentdivs=[]
	setting.toclinks=[]
	setting.topzindex=0
	setting.currentpage=setting.currentpage || urlselectedpage || ((this.enablepersist)? persistedpage : 1)
	setting.prevpage=setting.currentpage
	setting.revealtype="on"+(setting.revealtype || "click")
	setting.curopacity=0
	setting.onChange=setting.onChange || function(){}
	if (setting.contentsource[0]=="inline")
		this.buildpaginate(setting)
	if (setting.contentsource[0]=="ajax")
		this.ajaxconnect(setting)
}

Then add in the on page call (highlighted):

featuredcontentslider.init({
	id: "slider1",  //id of main slider DIV
	contentsource: ["inline", ""],  //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
	toc: "#increment",  //Valid values: "#increment", "markup", ["label1", "label2", etc]
	nextprev: ["Previous", "Next"],  //labels for "prev" and "next" links. Set to "" to hide.
	revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
	enablefade: [true, 0.2],  //[true/false, fadedegree]
	random: true, //true/false - defaults to false (requires autorotate be set to true with a pausetime)
	currentpage: Math.ceil(Math.random() * 3),
	autorotate: [true, 3000],  //[true/false, pausetime]
	onChange: function(previndex, curindex){  //event handler fired whenever script changes slide
		//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
		//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
	}
})

Notice the red 3, it should be the total number of content divisions for that slider.

[javoec]

Many thanks John!
That was just what I wanted: http://slurmed.com

..I really need to understand JS better.. thanks again.

[deeksha]

Please help me out for the same content slider...
I too want random contents by clicking on same image each time...

[jscheuer1]

Please help me out for the same content slider...
I too want random contents by clicking on same image each time...

Since the script has been updated since this thread was, the exact code changes may be different. So, if you cannot achieve your objectives by following the advice in this thread:

Please start a new thread and be as precise as you can about what you are after.