corrade-nucleus-nucleons – Blame information for rev 25
?pathlinks?
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 25 | office | 1 | // Retrieve the top-most window z-index. |
| 2 | function getTopWindowIndex() { |
||
| 3 | return Math.max.apply(null, |
||
| 4 | $.map($('.draggable'), function(e, n) { |
||
| 5 | if ($(e).css('position') != 'static') |
||
| 6 | return parseInt($(e).css('z-index')) || 1; |
||
| 7 | }) |
||
| 8 | ); |
||
| 9 | } |
||
| 10 | |||
| 11 | // Draggable and moveable windows. |
||
| 12 | $(document).ready(() => { |
||
| 13 | // Move windows to top on click. |
||
| 14 | $('.draggable').click(function() { |
||
| 15 | $(this).css('z-index', getTopWindowIndex() + 1); |
||
| 16 | }); |
||
| 17 | |||
| 18 | // target elements with the "draggable" class |
||
| 19 | interact('.draggable') |
||
| 20 | .draggable({ |
||
| 21 | // enable inertial throwing |
||
| 22 | inertia: true, |
||
| 23 | // keep the element within the area of it's parent |
||
| 24 | /*restrict: { |
||
| 25 | // Let the user move the windows freely. |
||
| 26 | restriction: "self", |
||
| 27 | endOnly: true//, |
||
| 28 | //elementRect: { top: 0, left: 0, bottom: 1, right: 1 } |
||
| 29 | },*/ |
||
| 30 | |||
| 31 | // enable autoScroll |
||
| 32 | autoScroll: true, |
||
| 33 | |||
| 34 | onmove: dragMoveListener, |
||
| 35 | onend: function (event) { |
||
| 36 | event.target.style.opacity = 1; |
||
| 37 | }, |
||
| 38 | onstart: function(event) { |
||
| 39 | // Move windows to top on drag. |
||
| 40 | event.target.style.zIndex = getTopWindowIndex() + 1; |
||
| 41 | event.target.style.opacity = 0.5; |
||
| 42 | } |
||
| 43 | }) |
||
| 44 | .allowFrom('.panel-heading') |
||
| 45 | .ignoreFrom('a, input, button, textarea'); |
||
| 46 | |||
| 47 | function dragMoveListener (event) { |
||
| 48 | var target = event.target, |
||
| 49 | // keep the dragged position in the data-x/data-y attributes |
||
| 50 | x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, |
||
| 51 | y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; |
||
| 52 | |||
| 53 | // translate the element |
||
| 54 | target.style.webkitTransform = |
||
| 55 | target.style.transform = |
||
| 56 | 'translate(' + x + 'px, ' + y + 'px)'; |
||
| 57 | |||
| 58 | // update the posiion attributes |
||
| 59 | target.setAttribute('data-x', x); |
||
| 60 | target.setAttribute('data-y', y); |
||
| 61 | } |
||
| 62 | |||
| 63 | // this is used later in the resizing and gesture demos |
||
| 64 | window.dragMoveListener = dragMoveListener; |
||
| 65 | }); |