add Core/UI.js

source/Ox.UI/js/Core/UI.js

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