Start updating the browser prefix stuff

The old way led to code that was too long and unreadable.

core/modules/filters.js

@@ -195,15 +195,15 @@ exports.operators = {
 	"list": { // Select all tiddlers that are listed (or not listed) in the specified tiddler
 		selector: function(operator) {
 			if(operator.prefix === "!") {
-				return "var list = this.getTextReference(\"" + $tw.utils.stringify(operator.operand) + "\",\"\").split(\"\\n\");" +
+				return "var list = this.getTiddlerList(\"" + $tw.utils.stringify(operator.operand) + "\");" +
 					"for(title in source) {if(list.indexOf(title) === -1) {$tw.utils.pushTop(subResults,title);}}";
 			} else {
-				return "$tw.utils.pushTop(subResults,this.getTextReference(\"" + $tw.utils.stringify(operator.operand) + "\",\"\").split(\"\\n\"));";
+				return "$tw.utils.pushTop(subResults,this.getTiddlerList(\"" + $tw.utils.stringify(operator.operand) + "\"));";
 			}
 		},
 		filter: function(operator) {
 			var op = operator.prefix === "!" ? "!==" : "===";
-			return "var list = this.getTiddler(\"" + $tw.utils.stringify(operator.operand) + "\").fields.text.split(\"\\n\");" +
+			return "var list = this.getTiddlerList(\"" + $tw.utils.stringify(operator.operand) + "\");" +
 				"for(r=subResults.length-1; r>=0; r--) {if(list.indexOf(title) " + op + " -1) {subResults.splice(r,1);}}";
 		}
 	},

core/modules/macros/list/listviews/classic.js

@@ -22,6 +22,13 @@ ClassicListView.prototype.insert = function(index) {
 	// Get the current height of the tiddler
 	var currHeight = targetElement.offsetHeight;
 	// Animate the closure
+	// $tw.utils.setStyle(targetElement,[
+	// 	{transition: ""},
+	// 	{transformOrigin: "0% 0%"},
+	// 	{transform: "translateX(" + window.innerWidth + "px)"},
+	// 	{opacity: "0.0"},
+	// 	{height: "0px"}
+	// ]);
 	targetElement.style[$tw.browser.transition] = "";
 	targetElement.style[$tw.browser.transformorigin] = "0% 0%";
 	targetElement.style[$tw.browser.transform] = "translateX(" + window.innerWidth + "px)";

core/modules/startup.js

@@ -18,9 +18,6 @@ exports.startup = function() {
 	$tw.modules.applyMethods("global",$tw);
 	$tw.modules.applyMethods("config",$tw.config);
 	$tw.modules.applyMethods("utils",$tw.utils);
-	if($tw.browser) {
-		$tw.utils.getBrowserInfo($tw.browser);
-	}
 	$tw.version = $tw.utils.extractVersionInfo();
 	$tw.Tiddler.fieldModules = $tw.modules.getModulesByTypeAsHashmap("tiddlerfield");
 	$tw.modules.applyMethods("tiddlermethod",$tw.Tiddler.prototype);

core/modules/utils/dom/browser.js

@@ -12,8 +12,95 @@ Browser feature detection
 /*global $tw: false */
 "use strict";
 
-exports.getBrowserInfo = function(info) {
-	info.unHyphenateCss = document.body.style["background-color"] === undefined;
+/*
+Set style properties of an element
+	element: dom node
+	styles: ordered array of {name: value} pairs
+*/
+exports.setStyle = function(element,styles) {
+
+};
+
+/*
+Converts a standard CSS property name into the local browser-specific equivalent. For example:
+	"background-color" --> "backgroundColor"
+	"transition" --> "webkitTransition"
+*/
+
+var styleNameCache = {}; // We'll cache the style name conversions
+
+exports.convertStyleName = function(styleName) {
+	// Return from the cache if we can
+	if(styleNameCache[styleName]) {
+		return styleNameCache[styleName];
+	}
+	// Convert it by first removing any hyphens
+	var newStyleName = $tw.utils.unHyphenateCss(styleName);
+	// Then check if it needs a prefix
+	if(document.body.style[newStyleName] === undefined) {
+		var prefixes = ["O","MS","Moz","webkit"];
+		for(var t=0; t<prefixes.length; t++) {
+			var prefixedName = prefixes[t] + newStyleName.substr(0,1).toUpperCase() + newStyleName.substr(1);
+			if(document.body.style[prefixedName] !== undefined) {
+				newStyleName = prefixedName;
+				break;
+			}
+		}
+	}
+	// Put it in the cache too
+	styleNameCache[styleName] = newStyleName
+	return newStyleName;
+}
+
+/*
+Converts a standard event name into the local browser specific equivalent. For example:
+	"animationEnd" --> "webkitAnimationEnd"
+*/
+
+var eventNameCache = {}; // We'll cache the conversions
+
+var eventNameMappings = {
+	"transitionEnd": {
+		correspondingCssProperty: "transition",
+		mappings: {
+			transition: "transitionEnd",
+			OTransition: "oTransitionEnd",
+			MSTransition: "msTransitionEnd",
+			MozTransition: "transitionEnd",
+			webkitTransition: "webkitTransitionEnd"
+		}
+	},
+	"animationEnd": {
+		correspondingCssProperty: "animation",
+		mappings: {
+			animation: "animationEnd",
+			OAnimation: "oAnimationEnd",
+			MSAnimation: "msAnimationEnd",
+			MozAnimation: "animationEnd",
+			webkitAnimation: "webkitAnimationEnd"
+		}
+	}
+};
+
+exports.convertEventName = function(eventName) {
+	if(eventNameCache[eventName]) {
+		return eventNameCache[eventName];
+	}
+	var newEventName = eventName,
+		mappings = eventNameMappings[eventName];
+	if(mappings) {
+		var convertedProperty = $tw.utils.convertStyleName(mappings.correspondingCssProperty);
+		if(mappings.mappings[convertedProperty]) {
+			newEventName = mappings.mappings[convertedProperty];
+		}
+	}
+	// Put it in the cache too
+	eventNameCache[eventName] = newEventName
+	return newEventName;
+};
+
+// For backwards compatibility, this will all be removed 
+var getBrowserInfo = function(info) {
 	info.prefix = document.body.style.webkitTransform !== undefined ? "webkit" : 
 						document.body.style.MozTransform !== undefined ? "Moz" :
 						document.body.style.MSTransform !== undefined ? "MS" :
@@ -46,4 +133,8 @@ exports.getBrowserInfo = function(info) {
 							document.fullScreen !== undefined ? "fullScreen" : "";
 };
 
+if($tw.browser) {
+	getBrowserInfo($tw.browser);
+}
+
 })();