From 7636ad324085f3bf2e6bb56e607663e0c4544d7d Mon Sep 17 00:00:00 2001
From: Adam Palay <adam@edx.org>
Date: Mon, 14 Apr 2014 13:37:51 -0400
Subject: [PATCH] Add javascript backup if pointer-event is not supported by
 browser

(STUD-1498)
---
 .../static/js/spec/CSS3_workarounds_spec.js   | 40 +++++++++++++++++++
 common/static/js/src/CSS3_workarounds.js      | 17 ++++++++
 2 files changed, 57 insertions(+)
 create mode 100644 common/static/js/spec/CSS3_workarounds_spec.js
 create mode 100644 common/static/js/src/CSS3_workarounds.js

diff --git a/common/static/js/spec/CSS3_workarounds_spec.js b/common/static/js/spec/CSS3_workarounds_spec.js
new file mode 100644
index 0000000000..3207e0d783
--- /dev/null
+++ b/common/static/js/spec/CSS3_workarounds_spec.js
@@ -0,0 +1,40 @@
+describe("CSS3 workarounds", function() {
+	describe("pointer-events", function() {
+		beforeEach(function() {
+			var html = "<a href='#' class='ui-disabled'>What wondrous life in this I lead</a>";
+			setFixtures(html);
+		});
+
+		it("should not prevent default when pointerEvents is supported", function() {
+			// In case this test suite is being run in a browser where
+			// 'pointerEvents' is not supported, mock out document.body.style
+			// so that it includes 'pointerEvents'
+			var mockBodyStyle = document.body.style;
+			if (!("pointerEvents" in mockBodyStyle)) {
+				mockBodyStyle["pointerEvents"] = "";
+			};
+
+			pointerEventsNone(".ui-disabled", mockBodyStyle);
+			spyOnEvent(".ui-disabled", "click");
+			$(".ui-disabled").click();
+			expect("click").not.toHaveBeenPreventedOn(".ui-disabled");
+		});
+
+		it("should prevent default when pointerEvents is not Supported", function() {
+			// mock document.body.style so it does not include 'pointerEvents'
+			var mockBodyStyle = {},
+			    bodyStyleKeys = Object.keys(document.body.style);
+			for (var index = 0; index < bodyStyleKeys.length; index++) {
+				var key = bodyStyleKeys[index];
+				if (key !== "pointerEvents") {
+					mockBodyStyle[key] = document.body.style[key];
+				};
+			};
+
+			pointerEventsNone(".ui-disabled", mockBodyStyle);
+			spyOnEvent(".ui-disabled", "click");
+			$(".ui-disabled").click();
+			expect("click").toHaveBeenPreventedOn(".ui-disabled");
+		});
+	});
+});
diff --git a/common/static/js/src/CSS3_workarounds.js b/common/static/js/src/CSS3_workarounds.js
new file mode 100644
index 0000000000..d75d6ebc5a
--- /dev/null
+++ b/common/static/js/src/CSS3_workarounds.js
@@ -0,0 +1,17 @@
+// A file for JS workarounds for CSS3 features that are not
+// supported in older browsers
+
+var pointerEventsNone = function (selector, supportedStyles) {
+	// Check to see if the brower supports 'pointer-events' css rule.
+	// If it doesn't, use javascript to stop the link from working
+	// when clicked.
+	$(selector).click(function (event) {
+		if (!('pointerEvents' in supportedStyles)) {
+			event.preventDefault();
+		};
+	});
+};
+
+$(function () {
+	pointerEventsNone('.ui-disabled', document.body.styles);
+});