Skip to content

Instantly share code, notes, and snippets.

@jasonlcrane
Created December 14, 2011 21:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jasonlcrane/1478639 to your computer and use it in GitHub Desktop.
Save jasonlcrane/1478639 to your computer and use it in GitHub Desktop.
Notifies a user if they arrive at an outdated documentation page for jQuery Mobile.
// ==UserScript==
// @match http://jquerymobile.com/demos/*
// ==/UserScript==
// notifies user of newer version of jQuery Mobile documentation
(function versionNotifier() {
var path = window.location.pathname,
// regex for version number in url
re = /[0-9ab.]+\//,
// extract version being viewed from path
// this is the only way I could reliably find to get this
// data-url on page element is inconsistent across doc versions
docsVer = path.match(re).toString().split('/')[0],
// cache body element
body = document.getElementsByTagName('body')[0],
// create iframe to be appended to body
iframe = document.createElement('iframe');
// set the src and style attributes
iframe.setAttribute('src','http://jquerymobile.com/demos');
iframe.setAttribute('style','display:none;');
// append the iframe
body.appendChild(iframe);
// when the iframe loads
iframe.onload = function() {
// get the current version off the first jqm page's data-url attr
var currentVer = iframe.contentDocument.getElementsByClassName('ui-page')[0].getAttribute('data-url').split('/')[2];
// if we're not already viewing the current version
if (currentVer !== docsVer) {
// cache the content div (where we're going to insert the message
var contentDiv = body.getElementsByClassName('ui-content')[0],
// create a div to hold our message
messageDiv = document.createElement('div'),
// create the message
message = document.createTextNode('Looks like this is an old version of the documentation. '),
// create a link
link = document.createElement('a'),
// and the link text
linkText = document.createTextNode('Go to the latest version');
// set classes to gives us a yellow notification bar
messageDiv.setAttribute('class','ui-bar ui-bar-e');
// prevent jqm from using ajax to load page
link.setAttribute('data-ajax','false');
// this prevents ajax request on older versions of jqm
link.setAttribute('rel','external');
// set href to latest docs
link.setAttribute('href','http://jquerymobile.com/demos/');
// append link text to the link
link.appendChild(linkText);
// append the message and link to the message container
messageDiv.appendChild(message);
messageDiv.appendChild(link);
// insert it at the top of the content div
contentDiv.insertBefore(messageDiv,contentDiv.firstChild);
// and remove the iframe
body.removeChild(iframe);
}
else {
// if we're already on latest version of docs, just remove the iframe
body.removeChild(iframe);
}
};
})();
@jasonlcrane
Copy link
Author

This is a userscript (only tested in Chrome) that adds a notification to older jQuery Mobile docs pages that you're not viewing the latest version of the docs. It's pretty hacky, but it's the only way I could figure out to do it.

The problem this hopes to solve: Do a Google search for pagecreate (for example) on jquerymobile.com. You'll get results for several different versions of the jQuery Mobile docs, but frequently not the docs for the current release. https://www.google.com/search?q=site%3Ajquerymobile.com+pagecreate

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment