2012-07-15 16:36:25 +00:00
|
|
|
/*\
|
|
|
|
title: $:/core/modules/utils/dom/browser.js
|
|
|
|
type: application/javascript
|
|
|
|
module-type: utils
|
|
|
|
|
|
|
|
Browser feature detection
|
|
|
|
|
|
|
|
\*/
|
|
|
|
(function(){
|
|
|
|
|
|
|
|
/*jslint node: true, browser: true */
|
|
|
|
/*global $tw: false */
|
|
|
|
"use strict";
|
|
|
|
|
2012-10-25 13:58:32 +00:00
|
|
|
/*
|
|
|
|
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) {
|
2012-07-15 16:36:25 +00:00
|
|
|
info.prefix = document.body.style.webkitTransform !== undefined ? "webkit" :
|
|
|
|
document.body.style.MozTransform !== undefined ? "Moz" :
|
|
|
|
document.body.style.MSTransform !== undefined ? "MS" :
|
|
|
|
document.body.style.OTransform !== undefined ? "O" : "";
|
|
|
|
info.transition = info.prefix + "Transition";
|
|
|
|
info.transform = info.prefix + "Transform";
|
|
|
|
info.transformorigin = info.prefix + "TransformOrigin";
|
|
|
|
info.transitionEnd = {
|
|
|
|
"": "transitionEnd",
|
|
|
|
"O": "oTransitionEnd",
|
|
|
|
"MS": "msTransitionEnd",
|
|
|
|
"Moz": "transitionend",
|
|
|
|
"webkit": "webkitTransitionEnd"
|
|
|
|
}[info.prefix];
|
2012-10-15 16:18:32 +00:00
|
|
|
info.animationEnd = {
|
|
|
|
"": "animationEnd",
|
|
|
|
"O": "oAnimationEnd",
|
|
|
|
"MS": "msAnimationEnd",
|
|
|
|
"Moz": "animationend",
|
|
|
|
"webkit": "webkitAnimationEnd"
|
|
|
|
}[info.prefix];
|
2012-09-12 09:45:23 +00:00
|
|
|
info.requestFullScreen = document.body.webkitRequestFullScreen !== undefined ? "webkitRequestFullScreen" :
|
|
|
|
document.body.mozRequestFullScreen !== undefined ? "mozRequestFullScreen" :
|
|
|
|
document.body.requestFullScreen !== undefined ? "requestFullScreen" : "";
|
|
|
|
info.cancelFullScreen = document.webkitCancelFullScreen !== undefined ? "webkitCancelFullScreen" :
|
|
|
|
document.mozCancelFullScreen !== undefined ? "mozCancelFullScreen" :
|
|
|
|
document.cancelFullScreen !== undefined ? "cancelFullScreen" : "";
|
|
|
|
info.isFullScreen = document.webkitIsFullScreen !== undefined ? "webkitIsFullScreen" :
|
|
|
|
document.mozFullScreen !== undefined ? "mozFullScreen" :
|
|
|
|
document.fullScreen !== undefined ? "fullScreen" : "";
|
2012-07-15 16:36:25 +00:00
|
|
|
};
|
|
|
|
|
2012-10-25 13:58:32 +00:00
|
|
|
if($tw.browser) {
|
|
|
|
getBrowserInfo($tw.browser);
|
|
|
|
}
|
|
|
|
|
2012-07-15 16:36:25 +00:00
|
|
|
})();
|