X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/3bf45c83c84f9e7a1c5f2dafd64d812c987037e5..9490c431ea46a6c3d9f1d348a5b525c0bd3b6359:/project/static/js/views/split.js diff --git a/project/static/js/views/split.js b/project/static/js/views/split.js index 9d6dabd2..cc0d361f 100644 --- a/project/static/js/views/split.js +++ b/project/static/js/views/split.js @@ -1,18 +1,21 @@ -/*globals Class*/ +/*globals View*/ // Split view inspired by jQuery Splitter Plugin http://methvin.com/splitter/ -var SplitView = Class.extend({ +var SplitView = View.extend({ splitbarClass: 'splitview-splitbar', activeClass: 'splitview-active', + overlayClass: 'splitview-overlay', element: null, + model: null, zombie: null, leftViewOffset: 0, // Cache _splitbarWidth: 0, - init: function(element) { + init: function(element, model) { this.element = $(element).css('position', 'relative'); + this.model = model; this.views = $(">*", this.element[0]).css({ position: 'absolute', // positioned inside splitter container 'z-index': 1, // splitbar is positioned above @@ -44,6 +47,13 @@ var SplitView = Class.extend({ beginResize: function(event) { this.zombie = this.zombie || this.splitbar.clone(false).insertAfter(this.leftView); + this.overlay = this.overlay || $('
').addClass(this.overlayClass).css({ + position: 'absolute', + width: this.element.width(), + height: this.element.height(), + top: this.element.position().top, + left: this.element.position().left + }).appendTo(this.element); this.views.css("-webkit-user-select", "none"); // Safari selects A/B text on a move this.splitbar.addClass(this.activeClass); this.leftViewOffset = this.leftView[0].offsetWidth - event.pageX; @@ -63,6 +73,8 @@ var SplitView = Class.extend({ var newPosition = event.pageX + this.leftViewOffset; this.zombie.remove(); this.zombie = null; + this.overlay.remove(); + this.overlay = null; this.resplit(newPosition); $(document) @@ -88,6 +100,7 @@ var SplitView = Class.extend({ dispose: function() { this.splitter.unbind('mousedown.splitview'); + this._super(); } });