Commits

Anonymous committed c0e0240

First release.

  • Participants

Comments (0)

Files changed (1)

bootstrap-selectable.js

+/**
+ * Created by K.Inanloo on 6/1/2014.
+ */
+
+!function ($) {
+
+    var Selectable = function (element, options) {
+        this.element = $(element);
+        this.element.on('mousedown', $.proxy(this.mousedown, this));
+        this.element.on('mouseup', $.proxy(this.mouseup, this));
+        this.element.on('mousemove', $.proxy(this.mousemove, this));
+
+        if (typeof Modernizr !== 'undefined' && Modernizr.touch) {
+            this.touchCapable = true;
+        }
+
+        this.element.addClass("ui-selectable");
+        this.tolerance = options.tolerance;
+        this.disabled = options.disabled;
+        this.element.on('start', options.start);
+        this.element.on('stop', options.stop);
+        this.element.on('selected', options.selected);
+        this.element.on('unselected', options.unselected);
+
+
+        this.helper = $("<div class='ui-selectable-helper'></div>");
+    };
+
+    Selectable.prototype = {
+        constructor: Selectable,
+
+        disabled: false,
+        over: false,
+        inDrag: false,
+        first: 0,
+        last: 0,
+
+
+        mousedown: function (ev) {
+
+            // Touch: Get the original event:
+            if (this.touchCapable && ev.type === 'touchstart') {
+                ev = ev.originalEvent;
+            }
+
+            this.inDrag = true;
+            this.opos = {x1: ev.pageX, y1: ev.pageY};
+
+            var event = $.Event('start', this.opos);
+            event.which = $(ev.target).index();
+            event.target = ev.target;
+            this.element.trigger(event);
+            if (event.isDefaultPrevented())
+                return;
+
+            // position helper (lasso)
+            $('body').append(this.helper);
+            this.helper.css({
+                "left": ev.pageX,
+                "top": ev.pageY,
+                "width": 0,
+                "height": 0
+            });
+
+        },
+
+        mousemove: function (ev) {
+
+            // Touch: Get the original event:
+            if (this.touchCapable && ev.type === 'touchmove') {
+                ev = ev.originalEvent;
+            }
+
+            if (this.disabled) {
+                return;
+            }
+
+            if (this.inDrag) {
+
+                var tmp,
+                    x1 = this.opos.x1,
+                    y1 = this.opos.y1,
+                    x2 = ev.pageX,
+                    y2 = ev.pageY;
+
+                if (x1 > x2) {
+                    tmp = x2;
+                    x2 = x1;
+                    x1 = tmp;
+                }
+                if (y1 > y2) {
+                    tmp = y2;
+                    y2 = y1;
+                    y1 = tmp;
+                }
+
+                this.helper.css({ left: x1, top: y1, width: x2 - x1, height: y2 - y1 });
+
+                var hit = false;
+                var self = this;
+                this.element.children().each(function () {
+                    var $this = $(this);
+                    var pos = $this.offset();
+
+                    pos.right = pos.left + $this.outerWidth();
+                    pos.bottom = pos.top + $this.outerHeight();
+
+                    if (self.tolerance === "touch") {
+                        hit = ( !(pos.left > x2 || pos.right < x1 || pos.top > y2 || pos.bottom < y1) );
+                    } else if (this.tolerance === "fit") {
+                        hit = (pos.left > x1 && pos.right < x2 && pos.top > y1 && pos.bottom < y2);
+                    }
+
+                    if (hit) {
+                        // SELECT
+                        if ($this.hasClass('ui-selected')) {
+                            $this.removeClass("ui-selected").addClass('ui-selecting');
+                        }
+                        else {
+                            $this.removeClass("ui-unselecting").addClass('ui-selecting');
+                        }
+                    } else {
+                        // UNSELECT
+                        if ($this.hasClass('ui-selecting')) {
+                            if ((ev.metaKey || ev.ctrlKey)) {
+                                $this.removeClass("ui-selecting").addClass("ui-selected");
+                            } else {
+                                $this.removeClass("ui-selecting").addClass("ui-unselecting");
+                            }
+                        }
+                        if ($this.hasClass('ui-selected')) {
+                            if (!ev.metaKey && !ev.ctrlKey) {
+                                $this.removeClass("ui-selected").addClass("ui-unselecting");
+                            }
+                        }
+                    }
+                });
+            }
+        },
+
+        mouseup: function (ev) {
+
+            var self = this;
+            this.inDrag = false;
+
+            $(".ui-unselecting", this.element[0]).each(function () {
+                var $this = $(this);
+                var event = $.Event('unselected');
+                event.which = $this.index();
+                self.element.trigger(event);
+                if (event.isDefaultPrevented())
+                    return;
+                $this.removeClass("ui-unselecting");
+            });
+
+            $(".ui-selecting", this.element[0]).each(function () {
+                var $this = $(this);
+                var event = $.Event('selected');
+                event.which = $this.index();
+                self.element.trigger(event);
+                if (event.isDefaultPrevented())
+                    return;
+                $this.removeClass("ui-selecting").addClass("ui-selected");
+            });
+
+            this.helper.remove();
+
+            var event = $.Event('stop', {x1: ev.pageX, y1: ev.pageY});
+            event.which = $(ev.target).index();
+            event.target = ev.target;
+            this.element.trigger(event);
+
+            return false;
+        }
+    }
+    ;
+
+    $.fn.selectable = function (option, val) {
+        return this.each(function () {
+            var $this = $(this),
+                data = $this.data('selectable'),
+                options = typeof option === 'object' && option;
+            if (!data) {
+                $this.data('selectable', (data = new Selectable(this, $.extend({}, $.fn.selectable.defaults, options))));
+            }
+            if (typeof option == 'string') {
+                data[option](val);
+            }
+        })
+    };
+
+    $.fn.selectable.defaults = {
+        disabled: false,
+        tolerance: 'touch'
+    };
+
+
+    $.fn.selectable.Constructor = Selectable;
+
+}
+(window.jQuery);