diff --git a/treegrid.js b/treegrid.js index 80f0cca..9a925a1 100644 --- a/treegrid.js +++ b/treegrid.js @@ -87,6 +87,7 @@ TreeGrid.prototype.initCellEditing = function(onStartEdit, onStopEdit) self.editedCells = []; // FIXME maybe remove and use just class selector addListener(this.table, 'dblclick', function(evt) { + evt = evt||window.event; var td = evt.target||evt.srcElement; while (td.nodeName != 'TABLE' && td.nodeName != 'TD') td = td.parentNode; diff --git a/treegridtest.htm b/treegridtest.htm index 93f0ae8..03ab72b 100644 --- a/treegridtest.htm +++ b/treegridtest.htm @@ -51,10 +51,13 @@ onDomReady(function() // Cell selection by mouse drag example var startDrag, dragDiv; - $(document.body).on('mousedown', function(evt) + addListener(document.body, 'mousedown', function(evt) { - $(TG.table).find('td.selected').removeClass('selected'); - if (evt.button != 0) + var els = TG.table.querySelectorAll('td.selected'); + for (var i = 0; i < els.length; i++) + els[i].className = els[i].className.replace(' selected', ''); + evt = getEventCoord(evt); + if (evt.which != 1) return; startDrag = [ evt.pageX, evt.pageY ]; if (!dragDiv) @@ -64,10 +67,11 @@ onDomReady(function() document.body.appendChild(dragDiv); } }); - $(document.body).on('mousemove', function(evt) + addListener(document.body, 'mousemove', function(evt) { if (startDrag) { + evt = getEventCoord(evt); dragDiv.style.display = 'block'; if (startDrag[0] < evt.pageX) { @@ -91,10 +95,11 @@ onDomReady(function() } } }); - $(document.body).on('mouseup', function(evt) + addListener(document.body, 'mouseup', function(evt) { if (startDrag) { + evt = getEventCoord(evt); dragDiv.style.display = 'none'; var x1 = startDrag[0], y1 = startDrag[1], x2 = evt.pageX, y2 = evt.pageY; if (x2 < x1) @@ -112,30 +117,29 @@ onDomReady(function() startDrag = null; if (x2 > x1+10 && y2 > y1+10) { - $(rectangleSelect($(TG.table).find('td + td'), x1, y1, x2, y2)).addClass('selected'); + rectangleSelect(TG.table.getElementsByTagName('td'), x1, y1, x2, y2, function() + { + var e = this.previousSibling; + while (e && e.nodeType == 3) e = e.previousSibling; + if (e) + this.className += ' selected'; + }); return false; } } }); }); -function rectangleSelect(selector, x1, y1, x2, y2) +function rectangleSelect(elements, x1, y1, x2, y2, cb) { - var elements = []; - $(selector).each(function() + for (var i = 0; i < elements.length; i++) { - var $this = $(this); - var offset = $this.offset(); - var x = offset.left; - var y = offset.top; - var w = $this.width(); - var h = $this.height(); - if (x+w >= x1 && y+h >= y1 && x <= x2 && y <= y2) - { - elements.push($this.get(0)); - } - }); - return elements; + var offset = getOffset(elements[i]); + var w = elements[i].offsetWidth; + var h = elements[i].offsetHeight; + if (offset.left+w >= x1 && offset.top+h >= y1 && offset.left <= x2 && offset.top <= y2) + cb.apply(elements[i]); + } } //--> diff --git a/util.js b/util.js index d90ff88..395e69f 100644 --- a/util.js +++ b/util.js @@ -251,6 +251,26 @@ window.getOffset = function(elem) return getOffsetSum(elem); }; +window.getEventCoord = function(e) +{ + if (!e) + e = window.event; + if (e && e.pageX == null && e.clientX != null) + { + var html = document.documentElement; + var body = document.body; + e.pageX = e.clientX + (html && html.scrollLeft || body && body.scrollLeft || 0) - (html.clientLeft || 0); + e.pageY = e.clientY + (html && html.scrollTop || body && body.scrollTop || 0) - (html.clientTop || 0); + } + if (e && !e.which && e.button) + { + if (e.button & 1) e.which = 1; + else if (e.button & 4) e.which = 2; + else if (e.button & 2) e.which = 3; + } + return e; +} + })(); window.json_decode = function(text)