Last active
December 21, 2015 22:09
-
-
Save baldwicc/6373071 to your computer and use it in GitHub Desktop.
Adds a native lightbox based on url regex, or a native inline messages based on matching css selectors. Useful when decommissioning tools.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** qut-inlinewarnings | |
* Adds a native lightbox based on url regex, or a native inline messages based on matching css selectors. Useful when decommissioning tools. | |
* | |
* - Uses .html resources for lightbox iframes | |
* - Only shows lightbox once a day | |
* - Useful for building block pages, or standard pages with content items | |
* - Tracks to GA | |
* | |
* @author Christopher Baldwin [https://staff.qut.edu.au/details?id=baldwicc] | |
* @licence Simplified BSD License | |
* @source https://gist.github.com/baldwicc/6373071 | |
*/ | |
/* | |
Usage: | |
- add objects to triggers[] | |
- set use_ga for google analytics or not (uses _gaq) | |
- set courseid to the current course title or course pkid | |
*/ | |
Event.observe(document, "dom:loaded", function() { | |
/* SETUP */ | |
var options = { | |
// current course id. Used as event label for GATC | |
courseid: "${context.courseId.externalString}", | |
// whether or not to use google analytics | |
use_ga: true, | |
// how often to re-show the same lightbox (in seconds) | |
cookie_timeout: 86400, // one day | |
/* | |
* Define new triggers like so: | |
* triggers[#].name: gatc action label | |
* triggers[#].category: gatc category label | |
* | |
* Notes: | |
* - Leave triggers[#].inline and triggers[#].lightbox undefined if they are not required. | |
* - Using both urlregex and selector is probably silly | |
* | |
* Stuff for inline messages: | |
* triggers[#].inline.selector: css selector (jquery / prototype) | |
* triggers[#].inline.msgtype: type of message displayed ("bad","success" or "warning") | |
* triggers[#].inline.html: html to use for inline message | |
* | |
* Stuff for lightboxes: | |
* triggers[#].lightbox.urlregex: regex to determine if page requires a lightbox | |
* triggers[#].lightbox.selector: css selector (jquery / prototype). | |
* triggers[#].lightbox.lbframe: path to html for lightbox iframe | |
* triggers[#].lightbox.lbtitle: title of lightbox | |
*/ | |
triggers: [ | |
// START triggers | |
// campus pack wiki | |
{ | |
name: "wiki", | |
category: "lobj_2013", | |
inline: { | |
selector: '#content_listContainer li img.item_icon[src^="/webapps/lobj-wiki-"]', | |
msgtype: "bad", | |
html: ["<p>Campus Pack Wikis will not function after Semester 2, 2013. Please use Blackboard native tools. For information about the Blackboard tools and archiving Campus Pack data, see the <a style='color: #fff; text-decoration: underline;' href='http://www.els.qut.edu.au/blendedlearning/blackboard/campuspack.jsp' target='_new'>project webpage</a>.</p>"].join("\n") | |
}, | |
lightbox: { | |
urlregex: /^\/webapps\/lobj-wiki-/, | |
lbframe: "${resourcePath}/wiki.html", | |
lbtitle: "Important Message: " | |
}, | |
}, | |
// campus pack blog | |
{ | |
name: "blog", | |
category: "lobj_2013", | |
inline: { | |
selector: '#content_listContainer li img.item_icon[src^="/webapps/lobj-journal-"]', | |
msgtype: "bad", | |
html: [" <p>", " Campus Pack Blogs will not function after Semester 2, 2013. Please use Blackboard native tools. For information about the Blackboard tools and archiving Campus Pack data, see the <a style='color: #fff; text-decoration: underline;' href='http://www.els.qut.edu.au/blendedlearning/blackboard/campuspack.jsp' target='_new'>project webpage</a>.", " </p>"].join("\n") | |
}, | |
lightbox: { | |
urlregex: /^\/webapps\/lobj-journal-/, | |
lbframe: "${resourcePath}/blog.html", | |
lbtitle: "Important Message: " | |
}, | |
}, | |
// campus pack podcast | |
{ | |
name: "podcast", | |
category: "lobj_2013", | |
inline: { | |
selector: '#content_listContainer li img.item_icon[src^="/webapps/lobj-podcast-"]', | |
msgtype: "bad", | |
html: [" <p>", " Campus Pack Podcast will not function after Semester 2, 2013. For information about other tools, see the <a style='color: #fff; text-decoration: underline;' href='http://www.els.qut.edu.au/blendedlearning/blackboard/campuspack.jsp' target='_new'>project webpage</a>.", " </p>"].join("\n") | |
}, | |
lightbox: { | |
urlregex: /^\/webapps\/lobj-podcast-/, | |
lbframe: "${resourcePath}/podcast.html", | |
lbtitle: "Important Message: " | |
}, | |
} | |
], | |
}; | |
/** | |
* A complete cookies reader/writer framework with full unicode support. | |
* | |
* Syntaxes: | |
* docCookies.setItem(name, value[, end[, path[, domain[, secure]]]]) | |
* docCookies.getItem(name) | |
* docCookies.removeItem(name[, path]) | |
* docCookies.hasItem(name) | |
* docCookies.keys() | |
* | |
* @source https://developer.mozilla.org/en-US/docs/DOM/document.cookie | |
* @licence http://www.gnu.org/licenses/gpl-3.0-standalone.html | |
* @type {Object} | |
*/ | |
var docCookies = { | |
getItem: function(sKey) { | |
return decodeURI(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURI(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null; | |
}, | |
setItem: function(sKey, sValue, vEnd, sPath, sDomain, bSecure) { | |
if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { | |
return false; | |
} | |
var sExpires = ""; | |
if (vEnd) { | |
switch (vEnd.constructor) { | |
case Number: | |
sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd; | |
break; | |
case String: | |
sExpires = "; expires=" + vEnd; | |
break; | |
case Date: | |
sExpires = "; expires=" + vEnd.toGMTString(); | |
break; | |
} | |
} | |
document.cookie = encodeURI(sKey) + "=" + encodeURI(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : ""); | |
return true; | |
}, | |
removeItem: function(sKey, sPath, sDomain) { | |
if (!sKey || !this.hasItem(sKey)) { | |
return false; | |
} | |
document.cookie = encodeURI(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + (sPath ? "; path=" + sPath : "") + (sDomain ? "; domain=" + sDomain : ""); | |
return true; | |
}, | |
hasItem: function(sKey) { | |
return (new RegExp("(?:^|;\\s*)" + encodeURI(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie); | |
}, | |
keys: /* optional method: you can safely remove it! */ function() { | |
var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/); | |
for (var nIdx = 0; nIdx < aKeys.length; nIdx++) { | |
aKeys[nIdx] = decodeURI(aKeys[nIdx]); | |
} | |
return aKeys; | |
} | |
}; | |
/** | |
* track specific tool to gatc | |
* @param {object} tool a tool object from the triggers array | |
*/ | |
var trackToGA = function(tool, actionsuffix) { | |
if (options.use_ga) { | |
var _gaq = window._gaq || []; | |
_gaq.push(['_trackEvent', tool.category, tool.name + actionsuffix, options.courseid]); | |
} | |
}; | |
/** | |
* IE Detection | |
* @return {number|undefined} version of IE | |
* @source https://gist.github.com/527683 | |
*/ | |
var ie = (function() { | |
var undef, | |
v = 3, | |
div = document.createElement('div'), | |
all = div.getElementsByTagName('i'); | |
while (div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->', all[0]); | |
return v > 4 ? v : undef; | |
}()); | |
/** | |
* add message using page.InlineConfirmation. will not overwrite existing message. | |
* @param {object} inline a inline object from a tool in the triggers array | |
*/ | |
var addInlineMessage = function(inline) { | |
// page.InlineConfirmation.prototype = function( type, message, showRefreshLink, oneReceiptPerPage ) | |
new page.InlineConfirmation(inline.msgtype, "</a>" + inline.html + "<a>", false, true); | |
}; | |
/** | |
* Adds lightbox to page for a given tool | |
* @param {object} tool a tool from triggers | |
* @returns {boolean} whether or not a lb was added | |
*/ | |
var addLightbox = function(tool) { | |
var lbadded = false; | |
// check if the current pages url matches this tool's regex, or if selector was matched | |
if ((tool.lightbox.urlregex && document.location.pathname.match(tool.lightbox.urlregex)) || $$(tool.lightbox.selector).length) { | |
lbadded = true; | |
// if we want a lightbox, and we're not in IE, and no cookie exists | |
if (tool.lightbox === "object" && !ie && docCookies.getItem(tool.category) !== tool.name) { | |
var lbInstance = new lightbox.Lightbox({ | |
title: tool.lightbox.lbtitle, | |
contents: '<iframe src="' + tool.lightbox.lbframe + '" width="100%" height="400" />', | |
showCloseLink: true, | |
closeOnBodyClick: true, | |
useDefaultDimensionsAsMinimumSize: true, | |
defaultDimensions: { | |
w: 720, | |
h: 400 | |
} | |
}); | |
lbInstance.open(); | |
// cookie it | |
docCookies.setItem(tool.category, tool.name, options.cookie_timeout, '/'); // twenty four hours. yep. | |
// track it | |
trackToGA(tool, '_lightbox_warning'); | |
} else { | |
// fallback for ie or cookies people | |
addInlineMessage(tool.inline); | |
trackToGA(tool, '_lightbox_warning_cookieorie'); | |
} | |
} | |
return lbadded; | |
}; | |
/** | |
* initialise using prototype | |
*/ | |
var init = function() { | |
var i, ii; | |
for (i = 0; i < options.triggers.length; i++) { | |
var tool = options.triggers[i]; | |
var lbdone = false; | |
// first, add lightboxes for this tool. | |
lbdone = addLightbox(tool); | |
// if there were no lb's added, lets go parsing | |
if (tool.inline) { | |
if (!lbdone) { | |
// see if anything matches this tool's selector | |
var elems = $$(tool.inline.selector); | |
// add message and track for all found elements | |
for (ii = 0; ii < elems.length; ii++) { | |
addInlineMessage(tool.inline); | |
trackToGA(tool, '_inline_warning_css'); | |
} | |
// and handle urlregexes | |
if (tool.inline.urlregex && document.location.pathname.match(tool.inline.urlregex)) { | |
addInlineMessage(tool.inline); | |
trackToGA(tool, '_inline_warning_url'); | |
} | |
} | |
} | |
} | |
}; | |
/** BUSINESS END */ | |
init(); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment