126 lines
3.6 KiB
JavaScript
126 lines
3.6 KiB
JavaScript
'use strict';
|
|
|
|
//@ Ox.DIMENSIONS <o> Names of horizontal and vertical dimensions
|
|
Ox.DIMENSIONS = Ox.UI.DIMENSIONS = {
|
|
horizontal: ['width', 'height'],
|
|
vertical: ['height', 'width']
|
|
};
|
|
|
|
//@ Ox.EDGES <o> Names of horizontal and vertical edges
|
|
Ox.EDGES = Ox.UI.EDGES = {
|
|
horizontal: ['left', 'right', 'top', 'bottom'],
|
|
vertical: ['top', 'bottom', 'left', 'right']
|
|
};
|
|
|
|
//@ Ox.SCOLLBAR_SIZE <n> Size of scrollbars
|
|
Ox.SCROLLBAR_SIZE = Ox.UI.SCROLLBAR_SIZE = $.browser.webkit ? 8 : (function() {
|
|
var inner = Ox.$('<p>').css({
|
|
height: '200px',
|
|
width: '100%'
|
|
}),
|
|
outer = Ox.$('<div>').css({
|
|
height: '150px',
|
|
left: 0,
|
|
overflow: 'hidden',
|
|
position: 'absolute',
|
|
top: 0,
|
|
visibility: 'hidden',
|
|
width: '200px'
|
|
}).append(inner).appendTo($('body')),
|
|
width = inner[0].offsetWidth;
|
|
outer.css({overflow: 'scroll'});
|
|
width = 1 + width - (inner[0].offsetWidth == width
|
|
? outer[0].clientWidth : inner[0].offsetWidth);
|
|
outer.remove();
|
|
return width;
|
|
})();
|
|
|
|
//@ Ox.UI_PATH <str> Path of Ox UI
|
|
Ox.UI_PATH = Ox.UI.PATH = Ox.PATH + 'Ox.UI/';
|
|
|
|
//@ Ox.$elements <o> Reference to all Ox Elements
|
|
Ox.$elements = Ox.UI.elements = {};
|
|
|
|
/*@
|
|
Ox.getImageData <f> Returns properties of an Ox UI image
|
|
(url) -> <s> Image Name
|
|
@*/
|
|
Ox.getImageData = Ox.cache(function(url) {
|
|
var str = 'data:image/svg+xml;base64,';
|
|
return Ox.startsWith(url, str)
|
|
? JSON.parse(atob(url.split(',')[1]).match(/<!--(.+?)-->/)[1])
|
|
: null;
|
|
});
|
|
|
|
/*@
|
|
Ox.getImageURL <f> Returns the URL of an Ox UI image
|
|
(name[, color[, theme]]) -> <s> Image URL
|
|
name <s> Image name
|
|
color <s|[n]> Color name or RGB values
|
|
theme <s> Theme name
|
|
@*/
|
|
Ox.getImageURL = Ox.cache(function(name, color, theme) {
|
|
var colorName,
|
|
colors = {
|
|
marker: {
|
|
'#000000': 'videoMarkerBorder',
|
|
'#FFFFFF': 'videoMarkerBackground'
|
|
},
|
|
symbol: {
|
|
'#FF0000': 'symbolWarningColor'
|
|
}
|
|
},
|
|
image = Ox.IMAGES[name],
|
|
themeData,
|
|
type = Ox.toDashes(name).split('-')[0];
|
|
color = color || 'default';
|
|
theme = theme || Ox.Theme();
|
|
themeData = Ox.Theme.getThemeData(theme);
|
|
if (type == 'symbol') {
|
|
if (Ox.isString(color)) {
|
|
colorName = color;
|
|
color = themeData[
|
|
'symbol' + color[0].toUpperCase() + color.slice(1) + 'Color'
|
|
];
|
|
}
|
|
image = image.replace(/#808080/g, '#' + Ox.toHex(color));
|
|
}
|
|
Ox.forEach(colors[type], function(name, hex) {
|
|
image = image.replace(
|
|
new RegExp(hex, 'g'),
|
|
'$' + Ox.toHex(themeData[name])
|
|
);
|
|
});
|
|
image = image.replace(/\$/g, '#');
|
|
return 'data:image/svg+xml;base64,' + btoa(
|
|
image + '<!--' + JSON.stringify(Ox.extend(color ? {
|
|
color: colorName
|
|
} : {}, {
|
|
name: name, theme: theme
|
|
})) + '-->'
|
|
);
|
|
}, {
|
|
key: function(args) {
|
|
args[1] = args[1] || 'default';
|
|
args[2] = args[2] || Ox.Theme();
|
|
return JSON.stringify(args);
|
|
}
|
|
});
|
|
|
|
//@ Ox.getOxElement <f> Returns the Ox.Element of a DOM element, or `undefined`
|
|
Ox.getOxElement = function(element) {
|
|
return Ox.$elements[$(element).data('oxid')];
|
|
};
|
|
|
|
/*@
|
|
Ox.hideScreen <f> hide loading screen
|
|
() -> <u> hide loading screen
|
|
@*/
|
|
Ox.hideScreen = Ox.UI.hideLoadingScreen = function() {
|
|
Ox.LoadingScreen.hide();
|
|
};
|
|
|
|
//@ Ox.isOxElement <f> Returns `true` if a DOM element is an Ox.Element
|
|
Ox.isOxElement = Ox.UI.isOxElement = function(element) {
|
|
return !!$(element).data('oxid');
|
|
};
|