add Core/UI.js
This commit is contained in:
parent
10415a6ae2
commit
35e77e28ae
1 changed files with 80 additions and 0 deletions
80
source/Ox.UI/js/Core/UI.js
Normal file
80
source/Ox.UI/js/Core/UI.js
Normal file
|
@ -0,0 +1,80 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
/*@
|
||||||
|
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,
|
||||||
|
image = 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.isOxElement <f> Returns `true` if a DOM element is an Ox.Element
|
||||||
|
Ox.isOxElement = Ox.UI.isOxElement = function(element) {
|
||||||
|
return !!$(element).data('oxid');
|
||||||
|
};
|
||||||
|
|
||||||
|
//@ 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;
|
||||||
|
})();
|
Loading…
Reference in a new issue