clone/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/TiddlyWiki/TiddlyWiki5.git synced 2026-05-05 02:57:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

Start updating the browser prefix stuff

Browse Source 
The old way led to code that was too long and unreadable.
This commit is contained in:
Jeremy Ruston
2012-10-25 14:58:32 +01:00
parent cbfc96cabd
commit 950b46276e
4 changed files with 103 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
core/modules/utils/dom/browser.js
View File

@@ -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);
}
})();