Log in

View Full Version : does this make the feed go in reverse when the mouse cursor is over the feed?



ajfmrf
08-29-2012, 02:53 AM
// Simple Rss/Crawler Interface Script v1.0 (c)2011 John Davenport Scheuer
// as first seen in http://www.dynamicdrive.com/forums/
// username: jscheuer1 - This Notice Must Remain for Legal Use

rsscrawler.loading = 'images/loading.gif';
function rsscrawler(feedurl, divid, crawlerobj){
var bridgepath = './simplepie/simple_bridge.php', // For syndication, use absolute path.
s = document.createElement('script');
this.displaydiv = document.getElementById(divid);
this.displaydiv.style.visibility = 'visible';
this.displaydiv.innerHTML = '<table id="rssloading" style="height: 100%;"><tbody><tr><td valign="middle" style="height: 100%;"><div>Initializing RSS Feed <img src="' + rsscrawler.loading + '" alt="loading" title=""></div></td></tr></tbody></table>';
feedurl = encodeURIComponent(feedurl);
s.type = 'text/javascript';
s.charset = 'utf-8';
s.src = bridgepath + '?feedurl=' + feedurl + '&divid=' + divid + '&scriptcount=' + rsscrawler.scriptcount + '&bustcache=' + new Date().getTime();
document.getElementsByTagName('head')[0].insertBefore(s, document.getElementsByTagName('script')[rsscrawler.scriptcount++]);
this.init(divid, crawlerobj);
}
rsscrawler.scriptcount = 0;
rsscrawler.rsscontent = {};
(function(){
var i = new Image();
i.src = rsscrawler.loading;
})();
rsscrawler.prototype = {
init: function(divid, crawlerobj){
var rcObj = this;
if(typeof rsscrawler.rsscontent[divid] === 'undefined'){
this.counter = this.counter? this.counter + 1 : 1;
if(this.counter < 40){
setTimeout(function(){rcObj.init(divid, crawlerobj);}, 200);
} else {
this.displaydiv.innerHTML = "<div style='color: red;'>There's a problem retrieving the feed.<\/div>";
}
return;
}
var rsscontent = rsscrawler.rsscontent[divid], div = document.createElement('div'), a = document.createElement('a'), s = document.createElement('span'),
table = document.createElement('table'), tbody = document.createElement('tbody'), tr = document.createElement('tr'), td = document.createElement('td'),
defaultcrawler = {
style: {
width: '100%'
},
mouse: 'cursor driven',
moveatleast: 1,
inc: 18,
noAddedSpace: true,
savedirection: true,
neutral: 150
}, i = 0, p, ts, ta, tdiv;
if(rsscontent.constructor !== Array){
this.displaydiv.innerHTML = "<div style='color: red;'>There's a problem retrieving the feed. The simple_bridge.php file says:<br>" + rsscontent + "<\/div>";
this.displaydiv.style.visibility = 'visible';
return;
}
crawlerobj = crawlerobj || {};
if(crawlerobj.reverse){
rsscontent.reverse();
}
crawlerobj.uniqueid = divid;
for(p in defaultcrawler){
if(crawlerobj.hasOwnProperty && !crawlerobj.hasOwnProperty(p) || !crawlerobj.hasOwnProperty && !crawlerobj[p]){
crawlerobj[p] = defaultcrawler[p];
}
}
a.target = crawlerobj.target || '_new';
a.className = 'rsstitle';
s.className = 'rssdescription';
table.className = 'rsstable';
for(i; i < rsscontent.length; ++i){
tr.appendChild(td.cloneNode(false));
tdiv = div.cloneNode(false);
ta = a.cloneNode(false);
ta.href = rsscontent[i].link.replace(/&amp;/g, '&');
ta.innerHTML = unescape(rsscontent[i].title).replace(/’/g, "’");
tdiv.appendChild(ta);
ts = s.cloneNode(false);
ts.className = 'rssdate';
ts.appendChild(document.createTextNode(unescape(rsscontent[i].date) || 'No Date Available'));
tdiv.appendChild(ts);
ts = s.cloneNode(false);
ts.innerHTML = unescape(rsscontent[i].description).replace(/’/g, "’").replace(/\[CDATA\[|…|\.\.\./g, '');
tdiv.appendChild(ts);
tr.lastChild.appendChild(tdiv);
}
tbody.appendChild(tr);
table.appendChild(tbody);
setTimeout(function(){
while(rcObj.displaydiv.lastChild){
rcObj.displaydiv.removeChild(rcObj.displaydiv.lastChild);
}
rcObj.displaydiv.appendChild(table);
if(!crawlerobj.style.height){
crawlerobj.style.height = rcObj.getheight();
}
marqueeInit(crawlerobj);
}, crawlerobj.delay || 0);
},
getheight: (function(){
return window.getComputedStyle? function(){
return document.defaultView.getComputedStyle(this.displaydiv, null).getPropertyValue('height');
} : function(){
return this.displaydiv.currentStyle['height'];
};
})()
};


From John's script at http://www.dynamicdrive.com/forums/attachment.php?attachmentid=4700&d=1345961048 ( http://www.web-user.info/rss/js/simple_crawler.bak.js)

jscheuer1
08-29-2012, 01:07 PM
No. It takes the order of contents of the feed and reverses it before populating the scroller. But only if the reverse: true property is set in the on page new rsscrawler() call:


new rsscrawler('http://news.google.com/?output=rss', 'googlenews', {reverse: true});

I don't believe there's currently a way to have the cursor reverse the scroller onmouseover other than setting up a custom event for it. There are a few options for the scroller's behavior onmouseover:

mouse: false - the mouse does nothing when moving over the scroller
mouse: 'pause' - the mouse pauses the scroller on hover
mouse: 'cursor driven' - this is the default. The mouse governs the speed and direction of the scroller depending upon which part of the scroller it's over. If it moves over the left part, it scrolls it to the right, the right part, it scrolls it to the left, as it approaches the center, it slows it down and eventually pauses it once it reaches a zone (neutral property) in the center.

Example:


new rsscrawler('http://news.google.com/?output=rss', 'googlenews', {reverse: true, inc: 3, mouse: 'pause'});

Other configuration property options are the same as for:

http://www.dynamicdrive.com/dynamicindex2/crawler/index.htm

except that the defaults aren't always the same as for that script.

Here are the defaults where they may differ from those of the crawler script:


{
style: {
width: '100%'
},
mouse: 'cursor driven',
moveatleast: 1,
inc: 18,
noAddedSpace: true,
savedirection: true,
neutral: 150
}

Not listed for that script is the reverse property, unique to the rsscrawler. And there's one other, delay. It sets an optional delay in milliseconds between when the feed is ready to display and when it actually is.

ajfmrf
08-29-2012, 05:04 PM
Thanks for the explanation John.That fast scroll in either direction was annoying me to no end-lol

But I now set it to pause and I am happy it does just that,pause

jscheuer1
08-29-2012, 05:34 PM
The default inc (18) was designed with a wider scrolling area in mind. The top speed is only achieved at the extreme right and left edges of the scroller. You could make it a slower or really slow scroll in either direction, slower:


new rsscrawler('http://news.google.com/?output=rss', 'googlenews', {reverse: true, inc: 7});

which would probably be appropriate for that 700px wide scroller you're using.

Or, really slow:


new rsscrawler('http://news.google.com/?output=rss', 'googlenews', {reverse: true, inc: 3});

You could take it all the way down to 1. But then it wouldn't move any faster than when the mouse is off of it, though direction control would still be enabled. You could even have it not move at all when the mouse is off of it, moving only as directed by the mouse.

If you read over all of the options, there are other possibilities you could come up with.

- J