将 Jquery 周期添加到 Twitter Feed
Adding Jquery Cycle to Twitter Feed
我找到了一个可以从 Twitter 提取提要的工作脚本。我现在想要做的是使用 Jquery 循环一次垂直滚动此提要 1 条推文。当我尝试以 "normal" 方式 Jquery 循环工作时，它不会循环推文，因为它们还不存在。我怎样才能将一些代码添加到此脚本中，然后一次循环 1 个推文？
这是脚本：
/*********************************************************************
* #### Twitter Post Fetcher v13.0 ####
* Coded by Jason Mayes 2015. A present to all the developers out there.
* www.jasonmayes.com
* Please keep this disclaimer with my code if you use it. Thanks. :-)
* Got feedback or questions, ask here:
* http://www.jasonmayes.com/projects/twitterApi/
* Github: https://github.com/jasonmayes/Twitter-Post-Fetcher
* Updates will be posted to this site.
*********************************************************************/
(function(v,n){"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?module.exports=n():n()})(this,function(){function v(a){return a.replace(/<b[^>]*>(.*?)<\/b>/gi,function(a,f){return f}).replace(/class=".*?"|data-query-source=".*?"|dir=".*?"|rel=".*?"/gi,"")}function n(a){a=a.getElementsByTagName("a");for(var c=a.length-1;0<=c;c--)a[c].setAttribute("target","_blank")}function m(a,c){for(var f=[],g=new RegExp("(^| )"+c+"( |$)"),h=a.getElementsByTagName("*"),b=0,k=h.length;b<
k;b++)g.test(h[b].className)&&f.push(h[b]);return f}var A="",k=20,B=!0,t=[],w=!1,u=!0,q=!0,x=null,y=!0,C=!0,z=null,D=!0,E=!1,r=!0,F={fetch:function(a){void 0===a.maxTweets&&(a.maxTweets=20);void 0===a.enableLinks&&(a.enableLinks=!0);void 0===a.showUser&&(a.showUser=!0);void 0===a.showTime&&(a.showTime=!0);void 0===a.dateFunction&&(a.dateFunction="default");void 0===a.showRetweet&&(a.showRetweet=!0);void 0===a.customCallback&&(a.customCallback=null);void 0===a.showInteraction&&(a.showInteraction=!0);
void 0===a.showImages&&(a.showImages=!1);void 0===a.linksInNewWindow&&(a.linksInNewWindow=!0);if(w)t.push(a);else{w=!0;A=a.domId;k=a.maxTweets;B=a.enableLinks;q=a.showUser;u=a.showTime;C=a.showRetweet;x=a.dateFunction;z=a.customCallback;D=a.showInteraction;E=a.showImages;r=a.linksInNewWindow;var c=document.createElement("script");c.type="text/javascript";c.src="//cdn.syndication.twimg.com/widgets/timelines/"+a.id+"?&lang="+(a.lang||"en")+"&callback=twitterFetcher.callback&suppress_response_codes=true&rnd="+
Math.random();document.getElementsByTagName("head")[0].appendChild(c)}},callback:function(a){var c=document.createElement("div");c.innerHTML=a.body;"undefined"===typeof c.getElementsByClassName&&(y=!1);a=[];var f=[],g=[],h=[],b=[],p=[],e=0;if(y)for(c=c.getElementsByClassName("tweet");e<c.length;){0<c[e].getElementsByClassName("retweet-credit").length?b.push(!0):b.push(!1);if(!b[e]||b[e]&&C)a.push(c[e].getElementsByClassName("e-entry-title")[0]),p.push(c[e].getAttribute("data-tweet-id")),f.push(c[e].getElementsByClassName("p-author")[0]),
g.push(c[e].getElementsByClassName("dt-updated")[0]),void 0!==c[e].getElementsByClassName("inline-media")[0]?h.push(c[e].getElementsByClassName("inline-media")[0]):h.push(void 0);e++}else for(c=m(c,"tweet");e<c.length;)a.push(m(c[e],"e-entry-title")[0]),p.push(c[e].getAttribute("data-tweet-id")),f.push(m(c[e],"p-author")[0]),g.push(m(c[e],"dt-updated")[0]),void 0!==m(c[e],"inline-media")[0]?h.push(m(c[e],"inline-media")[0]):h.push(void 0),0<m(c[e],"retweet-credit").length?b.push(!0):b.push(!1),e++;
a.length>k&&(a.splice(k,a.length-k),f.splice(k,f.length-k),g.splice(k,g.length-k),b.splice(k,b.length-k),h.splice(k,h.length-k));c=[];e=a.length;for(b=0;b<e;){if("string"!==typeof x){var d=g[b].getAttribute("datetime"),l=new Date(g[b].getAttribute("datetime").replace(/-/g,"/").replace("T"," ").split("+")[0]),d=x(l,d);g[b].setAttribute("aria-label",d);if(a[b].innerText)if(y)g[b].innerText=d;else{var l=document.createElement("p"),G=document.createTextNode(d);l.appendChild(G);l.setAttribute("aria-label",
d);g[b]=l}else g[b].textContent=d}d="";B?(r&&(n(a[b]),q&&n(f[b])),q&&(d+='<div class="user">'+v(f[b].innerHTML)+"</div>"),d+='<p class="tweet">'+v(a[b].innerHTML)+"</p>",u&&(d+='<p class="timePosted">'+g[b].getAttribute("aria-label")+"</p>")):a[b].innerText?(q&&(d+='<p class="user">'+f[b].innerText+"</p>"),d+='<p class="tweet">'+a[b].innerText+"</p>",u&&(d+='<p class="timePosted">'+g[b].innerText+"</p>")):(q&&(d+='<p class="user">'+f[b].textContent+"</p>"),d+='<p class="tweet">'+a[b].textContent+
"</p>",u&&(d+='<p class="timePosted">'+g[b].textContent+"</p>"));D&&(d+='<p class="interact"><a href="https://twitter.com/intent/tweet?in_reply_to='+p[b]+'" class="twitter_reply_icon"'+(r?' target="_blank">':">")+'Reply</a><a href="https://twitter.com/intent/retweet?tweet_id='+p[b]+'" class="twitter_retweet_icon"'+(r?' target="_blank">':">")+'Retweet</a><a href="https://twitter.com/intent/favorite?tweet_id='+p[b]+'" class="twitter_fav_icon"'+(r?' target="_blank">':">")+"Favorite</a></p>");E&&void 0!==
h[b]&&(l=h[b],void 0!==l?(l=l.innerHTML.match(/data-srcset="([A-z0-9%_\.-]+)/i)[0],l=decodeURIComponent(l).split('"')[1]):l=void 0,d+='<div class="media"><img src="'+l+'" alt="Image from tweet" /></div>');c.push(d);b++}if(null===z){a=c.length;f=0;g=document.getElementById(A);for(h="<ul id='tweets'>";f<a;)h+="<li>"+c[f]+"</li>",f++;g.innerHTML=h+"</ul>"}else z(c);w=!1;0<t.length&&(F.fetch(t[0]),t.splice(0,1))}};return window.twitterFetcher=F});
/**
* ### HOW TO CREATE A VALID ID TO USE: ###
* Go to www.twitter.com and sign in as normal, go to your settings page.
* Go to "Widgets" on the left hand side.
* Create a new widget for what you need eg "user time line" or "search" etc.
* Feel free to check "exclude replies" if you don't want replies in results.
* Now go back to settings page, and then go back to widgets page and
* you should see the widget you just created. Click edit.
* Look at the URL in your web browser, you will see a long number like this:
* 345735908357048478
* Use this as your ID below instead!
*/
/**
* How to use TwitterFetcher's fetch function:
*
* @function fetch(object) Fetches the Twitter content according to
* the parameters specified in object.
*
* @param object {Object} An object containing case sensitive key-value pairs
* of properties below.
*
* You may specify at minimum the following two required properties:
*
* @param object.id {string} The ID of the Twitter widget you wish
* to grab data from (see above for how to generate this number).
* @param object.domId {string} The ID of the DOM element you want
* to write results to.
*
* You may also specify one or more of the following optional properties
* if you desire:
*
* @param object.maxTweets [int] The maximum number of tweets you want
* to return. Must be a number between 1 and 20. Default value is 20.
* @param object.enableLinks [boolean] Set false if you don't want
* urls and hashtags to be hyperlinked.
* @param object.showUser [boolean] Set false if you don't want user
* photo / name for tweet to show.
* @param object.showTime [boolean] Set false if you don't want time of tweet
* to show.
* @param object.dateFunction [function] A function you can specify
* to format date/time of tweet however you like. This function takes
* a JavaScript date as a parameter and returns a String representation
* of that date.
* @param object.showRetweet [boolean] Set false if you don't want retweets
* to show.
* @param object.customCallback [function] A function you can specify
* to call when data are ready. It also passes data to this function
* to manipulate them yourself before outputting. If you specify
* this parameter you must output data yourself!
* @param object.showInteraction [boolean] Set false if you don't want links
* for reply, retweet and favourite to show.
* @param object.showImages [boolean] Set true if you want images from tweet
* to show.
* @param object.lang [string] The abbreviation of the language you want to use
* for Twitter phrases like "posted on" or "time ago". Default value
* is "en" (English).
*/
// ##### Simple example 1 #####
// A simple example to get my latest tweet and write to a HTML element with
// id "example1". Also automatically hyperlinks URLS and user mentions and
// hashtags.
var config1 = {
"id": '585817037076725762',
"domId": 'twitterfeed',
"maxTweets": 10,
"enableLinks": true
};
twitterFetcher.fetch(config1);
您必须预先缓存固定数量的推文，然后滚动浏览它们。 API 无法 'skip' 覆盖您已经看过的推文。
var config1 = {
"id": '585817037076725762',
"domId": 'twitterfeed',
"maxTweets": 1000,
"enableLinks": true,
"customCallback": gotTweets
};
twitterFetcher.fetch(config1);
var tweets = [];
var i = 0;
function gotTweets(data){
tweets = data;
};
function showNextTweet() {
document.getElementById("twitterfeed").innerHTML = tweets[i];
i++;
console.log("Showing tweet " + (i+1));
}
setInterval(showNextTweet, 1000);
我找到了一个可以从 Twitter 提取提要的工作脚本。我现在想要做的是使用 Jquery 循环一次垂直滚动此提要 1 条推文。当我尝试以 "normal" 方式 Jquery 循环工作时，它不会循环推文，因为它们还不存在。我怎样才能将一些代码添加到此脚本中，然后一次循环 1 个推文？
这是脚本：
/*********************************************************************
* #### Twitter Post Fetcher v13.0 ####
* Coded by Jason Mayes 2015. A present to all the developers out there.
* www.jasonmayes.com
* Please keep this disclaimer with my code if you use it. Thanks. :-)
* Got feedback or questions, ask here:
* http://www.jasonmayes.com/projects/twitterApi/
* Github: https://github.com/jasonmayes/Twitter-Post-Fetcher
* Updates will be posted to this site.
*********************************************************************/
(function(v,n){"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?module.exports=n():n()})(this,function(){function v(a){return a.replace(/<b[^>]*>(.*?)<\/b>/gi,function(a,f){return f}).replace(/class=".*?"|data-query-source=".*?"|dir=".*?"|rel=".*?"/gi,"")}function n(a){a=a.getElementsByTagName("a");for(var c=a.length-1;0<=c;c--)a[c].setAttribute("target","_blank")}function m(a,c){for(var f=[],g=new RegExp("(^| )"+c+"( |$)"),h=a.getElementsByTagName("*"),b=0,k=h.length;b<
k;b++)g.test(h[b].className)&&f.push(h[b]);return f}var A="",k=20,B=!0,t=[],w=!1,u=!0,q=!0,x=null,y=!0,C=!0,z=null,D=!0,E=!1,r=!0,F={fetch:function(a){void 0===a.maxTweets&&(a.maxTweets=20);void 0===a.enableLinks&&(a.enableLinks=!0);void 0===a.showUser&&(a.showUser=!0);void 0===a.showTime&&(a.showTime=!0);void 0===a.dateFunction&&(a.dateFunction="default");void 0===a.showRetweet&&(a.showRetweet=!0);void 0===a.customCallback&&(a.customCallback=null);void 0===a.showInteraction&&(a.showInteraction=!0);
void 0===a.showImages&&(a.showImages=!1);void 0===a.linksInNewWindow&&(a.linksInNewWindow=!0);if(w)t.push(a);else{w=!0;A=a.domId;k=a.maxTweets;B=a.enableLinks;q=a.showUser;u=a.showTime;C=a.showRetweet;x=a.dateFunction;z=a.customCallback;D=a.showInteraction;E=a.showImages;r=a.linksInNewWindow;var c=document.createElement("script");c.type="text/javascript";c.src="//cdn.syndication.twimg.com/widgets/timelines/"+a.id+"?&lang="+(a.lang||"en")+"&callback=twitterFetcher.callback&suppress_response_codes=true&rnd="+
Math.random();document.getElementsByTagName("head")[0].appendChild(c)}},callback:function(a){var c=document.createElement("div");c.innerHTML=a.body;"undefined"===typeof c.getElementsByClassName&&(y=!1);a=[];var f=[],g=[],h=[],b=[],p=[],e=0;if(y)for(c=c.getElementsByClassName("tweet");e<c.length;){0<c[e].getElementsByClassName("retweet-credit").length?b.push(!0):b.push(!1);if(!b[e]||b[e]&&C)a.push(c[e].getElementsByClassName("e-entry-title")[0]),p.push(c[e].getAttribute("data-tweet-id")),f.push(c[e].getElementsByClassName("p-author")[0]),
g.push(c[e].getElementsByClassName("dt-updated")[0]),void 0!==c[e].getElementsByClassName("inline-media")[0]?h.push(c[e].getElementsByClassName("inline-media")[0]):h.push(void 0);e++}else for(c=m(c,"tweet");e<c.length;)a.push(m(c[e],"e-entry-title")[0]),p.push(c[e].getAttribute("data-tweet-id")),f.push(m(c[e],"p-author")[0]),g.push(m(c[e],"dt-updated")[0]),void 0!==m(c[e],"inline-media")[0]?h.push(m(c[e],"inline-media")[0]):h.push(void 0),0<m(c[e],"retweet-credit").length?b.push(!0):b.push(!1),e++;
a.length>k&&(a.splice(k,a.length-k),f.splice(k,f.length-k),g.splice(k,g.length-k),b.splice(k,b.length-k),h.splice(k,h.length-k));c=[];e=a.length;for(b=0;b<e;){if("string"!==typeof x){var d=g[b].getAttribute("datetime"),l=new Date(g[b].getAttribute("datetime").replace(/-/g,"/").replace("T"," ").split("+")[0]),d=x(l,d);g[b].setAttribute("aria-label",d);if(a[b].innerText)if(y)g[b].innerText=d;else{var l=document.createElement("p"),G=document.createTextNode(d);l.appendChild(G);l.setAttribute("aria-label",
d);g[b]=l}else g[b].textContent=d}d="";B?(r&&(n(a[b]),q&&n(f[b])),q&&(d+='<div class="user">'+v(f[b].innerHTML)+"</div>"),d+='<p class="tweet">'+v(a[b].innerHTML)+"</p>",u&&(d+='<p class="timePosted">'+g[b].getAttribute("aria-label")+"</p>")):a[b].innerText?(q&&(d+='<p class="user">'+f[b].innerText+"</p>"),d+='<p class="tweet">'+a[b].innerText+"</p>",u&&(d+='<p class="timePosted">'+g[b].innerText+"</p>")):(q&&(d+='<p class="user">'+f[b].textContent+"</p>"),d+='<p class="tweet">'+a[b].textContent+
"</p>",u&&(d+='<p class="timePosted">'+g[b].textContent+"</p>"));D&&(d+='<p class="interact"><a href="https://twitter.com/intent/tweet?in_reply_to='+p[b]+'" class="twitter_reply_icon"'+(r?' target="_blank">':">")+'Reply</a><a href="https://twitter.com/intent/retweet?tweet_id='+p[b]+'" class="twitter_retweet_icon"'+(r?' target="_blank">':">")+'Retweet</a><a href="https://twitter.com/intent/favorite?tweet_id='+p[b]+'" class="twitter_fav_icon"'+(r?' target="_blank">':">")+"Favorite</a></p>");E&&void 0!==
h[b]&&(l=h[b],void 0!==l?(l=l.innerHTML.match(/data-srcset="([A-z0-9%_\.-]+)/i)[0],l=decodeURIComponent(l).split('"')[1]):l=void 0,d+='<div class="media"><img src="'+l+'" alt="Image from tweet" /></div>');c.push(d);b++}if(null===z){a=c.length;f=0;g=document.getElementById(A);for(h="<ul id='tweets'>";f<a;)h+="<li>"+c[f]+"</li>",f++;g.innerHTML=h+"</ul>"}else z(c);w=!1;0<t.length&&(F.fetch(t[0]),t.splice(0,1))}};return window.twitterFetcher=F});
/**
* ### HOW TO CREATE A VALID ID TO USE: ###
* Go to www.twitter.com and sign in as normal, go to your settings page.
* Go to "Widgets" on the left hand side.
* Create a new widget for what you need eg "user time line" or "search" etc.
* Feel free to check "exclude replies" if you don't want replies in results.
* Now go back to settings page, and then go back to widgets page and
* you should see the widget you just created. Click edit.
* Look at the URL in your web browser, you will see a long number like this:
* 345735908357048478
* Use this as your ID below instead!
*/
/**
* How to use TwitterFetcher's fetch function:
*
* @function fetch(object) Fetches the Twitter content according to
* the parameters specified in object.
*
* @param object {Object} An object containing case sensitive key-value pairs
* of properties below.
*
* You may specify at minimum the following two required properties:
*
* @param object.id {string} The ID of the Twitter widget you wish
* to grab data from (see above for how to generate this number).
* @param object.domId {string} The ID of the DOM element you want
* to write results to.
*
* You may also specify one or more of the following optional properties
* if you desire:
*
* @param object.maxTweets [int] The maximum number of tweets you want
* to return. Must be a number between 1 and 20. Default value is 20.
* @param object.enableLinks [boolean] Set false if you don't want
* urls and hashtags to be hyperlinked.
* @param object.showUser [boolean] Set false if you don't want user
* photo / name for tweet to show.
* @param object.showTime [boolean] Set false if you don't want time of tweet
* to show.
* @param object.dateFunction [function] A function you can specify
* to format date/time of tweet however you like. This function takes
* a JavaScript date as a parameter and returns a String representation
* of that date.
* @param object.showRetweet [boolean] Set false if you don't want retweets
* to show.
* @param object.customCallback [function] A function you can specify
* to call when data are ready. It also passes data to this function
* to manipulate them yourself before outputting. If you specify
* this parameter you must output data yourself!
* @param object.showInteraction [boolean] Set false if you don't want links
* for reply, retweet and favourite to show.
* @param object.showImages [boolean] Set true if you want images from tweet
* to show.
* @param object.lang [string] The abbreviation of the language you want to use
* for Twitter phrases like "posted on" or "time ago". Default value
* is "en" (English).
*/
// ##### Simple example 1 #####
// A simple example to get my latest tweet and write to a HTML element with
// id "example1". Also automatically hyperlinks URLS and user mentions and
// hashtags.
var config1 = {
"id": '585817037076725762',
"domId": 'twitterfeed',
"maxTweets": 10,
"enableLinks": true
};
twitterFetcher.fetch(config1);
您必须预先缓存固定数量的推文，然后滚动浏览它们。 API 无法 'skip' 覆盖您已经看过的推文。
var config1 = {
"id": '585817037076725762',
"domId": 'twitterfeed',
"maxTweets": 1000,
"enableLinks": true,
"customCallback": gotTweets
};
twitterFetcher.fetch(config1);
var tweets = [];
var i = 0;
function gotTweets(data){
tweets = data;
};
function showNextTweet() {
document.getElementById("twitterfeed").innerHTML = tweets[i];
i++;
console.log("Showing tweet " + (i+1));
}
setInterval(showNextTweet, 1000);