Since I frequently use TinyURLs, I’ve come up with a bookmarklet to simplify the process of providing both the TinyURL and the original URL[1]:
(drag this link to your browser’s bookmarks toolbar or right-click and save it as a bookmark)
This bookmarklet works in two steps: On the first click, the TinyURL is created. The second click then extracts both URLs from the page and presents them in a newly-created input field, ready to copy and paste.
The original plan was to circumvent the first step by using a hidden IFRAME element. However, due to XSS restrictions, that seems not to be possible.
Limitations
TinyURL currently strips in-page anchors from the original URL (e.g. http://domain.tld/index.html#section becomes http://domain.tld/index.html).
I’m afraid there is nothing I can do about this.
Also, some error handling is currently missing, which might lead to JavaScript errors in case TinyURL change their HTML structure.
Source Code
function extractTinyURL() {
var txt = document.body.innerHTML;
var RE = /(http:\/\/tinyurl.com\/\w+)/;
var original = document.getElementsByName("url")[0].value;
var tiny = txt.match(RE)[1];
return tiny + " (" + original + ")";
}
function displayTinyURL() {
var txt = extractTinyURL();
var c = document.createElement("div");
c.style.position = "absolute";
c.style.top = "25%";
c.style.left = "25%";
c.style.width = "50%";
c.style.width = "border: 2px solid #AAA";
c.style.padding = "50px";
c.style.backgroundColor = "#EEE";
var e = document.createElement("input");
e.setAttribute("type", "text");
e.setAttribute("value", txt);
e.style.width = "100%";
c.appendChild(e);
document.body.appendChild(c);
e.select();
}
if(document.location.toString().indexOf("tinyurl.com") == -1)
document.location.href = "http://tinyurl.com/create.php?url=" + location.href;
else
displayTinyURL();
Feel free to suggest improvements!
- see here for my reasoning on this [↩]
- created using Bookmarklet Builder [↩]