Skip to content

Instantly share code, notes, and snippets.

@pzi
Last active August 29, 2015 14:01
Show Gist options
  • Save pzi/379ba9dbe71ed94bc048 to your computer and use it in GitHub Desktop.
Save pzi/379ba9dbe71ed94bc048 to your computer and use it in GitHub Desktop.
Display and store (sessionStorage) the latest tweet without having to use Twitter OAuth.
# How to create a valid ID to use
# 1. Go to www.twitter.com and sign in as normal, go to your settings page.
# 2. Go to "Widgets" on the left hand side.
# 3. Create a new widget for what you need eg "user timeline" or "search" etc.
# 4. Feel free to check "exclude replies" if you dont want replies in results.
# 5. Now go back to settings page, and then go back to widgets page, you should
# see the widget you just created. Click edit.
# 6. Now look at the URL in your web browser, you will see a long number like this:
# 345735903485048478
# 7. Use this as your WIDGET_ID below instead!
# How to use twitterFetcher:
#
# @param {string}
# Your Twitter widget ID.
#
# @param {string}
# The ID of the DOM element you want to write results to.
#
# @param {int}
# Optional - the maximum number of tweets you want returned. Must be a number between 1 and 20.
#
# @param {boolean}
# Optional - set true if you want urls and hash tags to be hyperlinked!
#
# @param {boolean}
# Optional - Set false if you dont want user photo / name for tweet to show.
#
# @param {boolean}
# Optional - Set false if you dont want time of tweet to show.
#
# @param {function/string} Optional
# A function you can specify to format
# tweet date/time however you like. This function takes a JavaScript date
# as a parameter and returns a String representation of that date.
# Alternatively you may specify the string 'default' to leave it with
# Twitter's default renderings.
#
# @param {boolean}
# Optional - Show retweets or not. Set false to not show.
#
# @param {function/string}
# Optional - A function to call when data is ready. It
# also passes the data to this function should you wish to manipulate it
# yourself before outputting. If you specify this parameter you must
# output data yourself!
#
# @param {boolean}
# Optional - Show links for reply, retweet, favourite. Set false to not show.
WIDGET_ID = 'YOUR_WIDGET_ID'
TARGET_CONTAINER = 'latest-tweet'
fetchTweet = (method) ->
twitterFetcher.fetch(WIDGET_ID, TARGET_CONTAINER, 1, true, false, false, '', false, method, false)
storeTweet = (tweet) ->
sessionStorage.lastTweet = tweet
drawTweet = (tweet) ->
element = document.getElementById(TARGET_CONTAINER)
element.innerHTML = tweet
storeTweet(tweet) if Modernizr.sessionstorage and not sessionStorage.lastTweet
if Modernizr.sessionstorage
if sessionStorage.lastTweet
drawTweet(sessionStorage.lastTweet)
fetchTweet(storeTweet)
else
fetchTweet(drawTweet)
else
fetchTweet(drawTweet)
/*!********************************************************************
* #### Twitter Post Fetcher v10.0 ####
* Coded by Jason Mayes 2013. 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/
* Updates will be posted to this site.
*********************************************************************/
var twitterFetcher = function() {
function x(e) {
return e.replace(/<b[^>]*>(.*?)<\/b>/gi, function(c, e) {
return e
}).replace(/class=".*?"|data-query-source=".*?"|dir=".*?"|rel=".*?"/gi, "")
}
function p(e, c) {
for (var g = [], f = RegExp("(^| )" + c + "( |$)"), a = e.getElementsByTagName("*"), h = 0, d = a.length; h < d; h++)
f.test(a[h].className) && g.push(a[h]);
return g
}
var y = "", l = 20, s = !0, k = [], t = !1, q = !0, r = !0, u = null, v = !0, z = !0, w = null, A = !0;
return {fetch: function(e, c, g, f, a, h, d, b, m, n) {
void 0 === g && (g = 20);
void 0 === f && (s = !0);
void 0 === a && (a =
!0);
void 0 === h && (h = !0);
void 0 === d && (d = "default");
void 0 === b && (b = !0);
void 0 === m && (m = null);
void 0 === n && (n = !0);
t ? k.push({id: e,domId: c,maxTweets: g,enableLinks: f,showUser: a,showTime: h,dateFunction: d,showRt: b,customCallback: m,showInteraction: n}) : (t = !0, y = c, l = g, s = f, r = a, q = h, z = b, u = d, w = m, A = n, c = document.createElement("script"), c.type = "text/javascript", c.src = "//cdn.syndication.twimg.com/widgets/timelines/" + e + "?&lang=en&callback=twitterFetcher.callback&suppress_response_codes=true&rnd=" + Math.random(), document.getElementsByTagName("head")[0].appendChild(c))
},
callback: function(e) {
var c = document.createElement("div");
c.innerHTML = e.body;
"undefined" === typeof c.getElementsByClassName && (v = !1);
e = [];
var g = [], f = [], a = [], h = [], d = 0;
if (v)
for (c = c.getElementsByClassName("tweet"); d < c.length; ) {
0 < c[d].getElementsByClassName("retweet-credit").length ? a.push(!0) : a.push(!1);
if (!a[d] || a[d] && z)
e.push(c[d].getElementsByClassName("e-entry-title")[0]), h.push(c[d].getAttribute("data-tweet-id")), g.push(c[d].getElementsByClassName("p-author")[0]), f.push(c[d].getElementsByClassName("dt-updated")[0]);
d++
}
else
for (c = p(c, "tweet"); d < c.length; )
e.push(p(c[d], "e-entry-title")[0]), h.push(c[d].getAttribute("data-tweet-id")), g.push(p(c[d], "p-author")[0]), f.push(p(c[d], "dt-updated")[0]), 0 < p(c[d], "retweet-credit").length ? a.push(!0) : a.push(!1), d++;
e.length > l && (e.splice(l, e.length - l), g.splice(l, g.length - l), f.splice(l, f.length - l), a.splice(l, a.length - l));
c = [];
d = e.length;
for (a = 0; a < d; ) {
if ("string" !== typeof u) {
var b = new Date(f[a].getAttribute("datetime").replace(/-/g, "/").replace("T", " ").split("+")[0]), b = u(b);
f[a].setAttribute("aria-label", b);
if (e[a].innerText)
if (v)
f[a].innerText = b;
else {
var m = document.createElement("p"), n = document.createTextNode(b);
m.appendChild(n);
m.setAttribute("aria-label", b);
f[a] = m
}
else
f[a].textContent = b
}
b = "";
s ? (r && (b += '<div class="user">' + x(g[a].innerHTML) + "</div>"), b += '<p class="tweet">' + x(e[a].innerHTML) + "</p>", q && (b += '<p class="timePosted">' + f[a].getAttribute("aria-label") + "</p>")) : e[a].innerText ? (r && (b += '<p class="user">' + g[a].innerText + "</p>"), b += '<p class="tweet">' + e[a].innerText +
"</p>", q && (b += '<p class="timePosted">' + f[a].innerText + "</p>")) : (r && (b += '<p class="user">' + g[a].textContent + "</p>"), b += '<p class="tweet">' + e[a].textContent + "</p>", q && (b += '<p class="timePosted">' + f[a].textContent + "</p>"));
A && (b += '<p class="interact"><a href="https://twitter.com/intent/tweet?in_reply_to=' + h[a] + '" class="twitter_reply_icon">Reply</a><a href="https://twitter.com/intent/retweet?tweet_id=' + h[a] + '" class="twitter_retweet_icon">Retweet</a><a href="https://twitter.com/intent/favorite?tweet_id=' +
h[a] + '" class="twitter_fav_icon">Favorite</a></p>');
c.push(b);
a++
}
if (null == w) {
e = c.length;
g = 0;
f = document.getElementById(y);
for (h = "<ul>"; g < e; )
h += "<li>" + c[g] + "</li>", g++;
f.innerHTML = h + "</ul>"
} else
w(c);
t = !1;
0 < k.length && (twitterFetcher.fetch(k[0].id, k[0].domId, k[0].maxTweets, k[0].enableLinks, k[0].showUser, k[0].showTime, k[0].dateFunction, k[0].showRt, k[0].customCallback, k[0].showInteraction), k.splice(0, 1))
}}
}();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment