better filesystem structure for modules and themes; 'minified' ui if debug option not set; dynamially generated map markers

2011-04-27 21:24:33 +02:00 · 2011-04-27 21:24:33 +02:00 · 4489e88f44
commit 4489e88f44
parent 358ee1bc96
596 changed files with 115093 additions and 17682 deletions
--- a/source/Ox.UI/js/Form/Ox.Button.js
+++ b/source/Ox.UI/js/Form/Ox.Button.js
@ -0,0 +1,164 @@
+// vim: et:ts=4:sw=4:sts=4:ft=js
+Ox.Button = function(options, self) {
+
+    /**
+        methods:
+            toggleDisabled              enable/disable button
+            toggleSelected              select/unselect button
+            toggleTitle                 if more than one title was provided,
+                                        toggle to next title.
+        events:
+            click           non-selectable button was clicked
+            deselect        selectable button was deselected
+            select          selectable button was selected
+    */
+
+    var self = self || {},
+        that = new Ox.Element('input', self)
+            .defaults({
+                disabled: false,
+                group: false,
+                id: '',
+                overlap: 'none',
+                selectable: false,
+                selected: false,
+                size: 'medium',
+                // fixme: 'default' or ''?
+                style: 'default', // can be default, checkbox, symbol, or tab
+                title: '',
+                tooltip: '',
+                type: 'text',
+                width: 'auto'
+            })
+            .options(options || {})
+            .attr({
+                disabled: self.options.disabled ? 'disabled' : '',
+                type: self.options.type == 'text' ? 'button' : 'image'
+            })
+            .addClass('OxButton Ox' + Ox.toTitleCase(self.options.size) +
+                (self.options.disabled ? ' OxDisabled': '') +
+                (self.options.selected ? ' OxSelected': '') +
+                (self.options.style != 'default' ? ' Ox' + Ox.toTitleCase(self.options.style) : '') +
+                (self.options.overlap != 'none' ? ' OxOverlap' + Ox.toTitleCase(self.options.overlap) : ''))
+            .css(self.options.width == 'auto' ? {} : {
+                width: (self.options.width - 14) + 'px'
+            })
+            .mousedown(mousedown)
+            .click(click);
+
+    $.extend(self, Ox.isArray(self.options.title) ? {
+        selectedTitle: Ox.setPropertyOnce(self.options.title, 'selected'),
+        titles: self.options.title
+    } : {
+        selectedTitle: 0,
+        titles: [{
+            id: '',
+            title: self.options.title
+        }]
+    });
+
+    setTitle(self.titles[self.selectedTitle].title);
+
+    if (self.options.tooltip) {
+        self.tooltips = Ox.isArray(self.options.tooltip) ? self.options.tooltip : [self.options.tooltip];
+        self.$tooltip = new Ox.Tooltip({
+                title: self.tooltips[self.selectedTitle]
+            });
+        that.mouseenter(mouseenter)
+            .mouseleave(mouseleave);
+    }
+
+    function click() {
+        if (!self.options.disabled) {
+            var data = self.titles[self.selectedTitle];
+            if (!self.options.selectable) {
+                that.triggerEvent('click', data);
+            } else {
+                //self.options.selected = !self.options.selected;
+                //that.toggleClass('OxSelected');
+                if (self.options.group) {
+                    that.triggerEvent('select', data);
+                } else {
+                    that.toggleSelected();
+                    //that.triggerEvent('change', {selected: self.options.selected});
+                }
+            }
+            if (self.titles.length == 2) {
+                that.toggleTitle();
+            }
+        }
+    }
+
+    function mousedown(e) {
+        if (self.options.type == 'image' && $.browser.safari) {
+            // keep image from being draggable
+            e.preventDefault();
+        }
+    }
+
+    function mouseenter(e) {
+        self.$tooltip.show(e.clientX, e.clientY);
+    }
+
+    function mouseleave() {
+        self.$tooltip.hide();
+    }
+
+    function setTitle(title) {
+        self.title = title;
+        if (self.options.type == 'image') {
+            that.attr({
+                src: Ox.UI.getImagePath(
+                    'symbol' + title[0].toUpperCase() + title.substr(1) + '.svg'
+                )
+            });
+        } else {
+            that.val(title);
+        }
+    }
+
+    self.onChange = function(key, value) {
+        if (key == 'disabled') {
+            that.attr({
+                    disabled: value ? 'disabled' : ''
+                })
+                .toggleClass('OxDisabled');
+        } else if (key == 'selected') {
+            if (value != that.hasClass('OxSelected')) { // fixme: neccessary?
+                that.toggleClass('OxSelected');
+            }
+            that.triggerEvent('change');
+        } else if (key == 'title') {
+            setTitle(value);
+        } else if (key == 'width') {
+            that.$element.css({
+                width: (value - 14) + 'px'
+            });
+        }
+    }
+
+    that.toggleDisabled = function() {
+        that.options({
+            enabled: !self.options.disabled
+        });
+        //self.options.disabled = !self.options.disabled;
+    }
+
+    that.toggleSelected = function() {
+        that.options({
+            selected: !self.options.selected
+        });
+        //self.options.selected = !self.options.selected;
+    }
+
+    that.toggleTitle = function() {
+        self.selectedTitle = 1 - self.selectedTitle;
+        setTitle(self.titles[self.selectedTitle].title);
+        self.$tooltip && self.$tooltip.options({
+            title: self.tooltips[self.selectedTitle]
+        });
+    }
+
+    return that;
+
+};