| 498 | | dojo.provide("dojox.layout.dnd.plottedDnD"); |
| 499 | | |
| 500 | | dojo.require("dojo.dnd.Source"); |
| 501 | | dojo.require("dojo.dnd.Manager"); |
| 502 | | dojo.require("dojox.layout.dnd.Avatar"); |
| 503 | | |
| 504 | | dojo.declare("dojox.layout.dnd.plottedDnD",[dojo.dnd.Source], { |
| 505 | | // summary: |
| 506 | | // dnd source handling plotted zone to show the dropping area |
| 507 | | GC_OFFSET_X: dojo.dnd.manager().OFFSET_X, |
| 508 | | GC_OFFSET_Y: dojo.dnd.manager().OFFSET_Y, |
| 509 | | |
| 510 | | constructor: function(/*Node*/node, /*Object*/params){ |
| 511 | | this.childBoxes = null; |
| 512 | | this.dropIndicator = new dojox.layout.dnd.DropIndicator("dndDropIndicator", "div"); |
| 513 | | this.withHandles = params.withHandles; |
| 514 | | this.handleClasses = params.handleClasses; |
| 515 | | this.opacity = params.opacity; |
| 516 | | this.allowAutoScroll = params.allowAutoScroll;//MODIF MYS |
| 517 | | this.dom = params.dom; |
| 518 | | this.singular = true; |
| 519 | | this.skipForm = true; |
| 520 | | this._over = false; |
| 521 | | this.defaultHandleClass = "GcDndHandle"; |
| 522 | | this.isDropped = false; |
| 523 | | this._timer = null; |
| 524 | | //Initialize the params to calculate offset |
| 525 | | this.isOffset = (params.isOffset)?true:false; |
| 526 | | this.offsetDrag = (params.offsetDrag) ? params.offsetDrag : {x:0,y:0}; |
| 527 | | this.hideSource = params.hideSource ? params.hideSource : true; |
| 528 | | this._drop = this.dropIndicator.create(); |
| 529 | | |
| 530 | | }, |
| 531 | | |
| 532 | | _calculateCoords : function(/*Boolean*/height){ |
| 533 | | // summary: Calculate each position of children |
| 534 | | dojo.forEach(this.node.childNodes, dojo.hitch(this, function(child){ |
| 535 | | child.coords = { |
| 536 | | xy: dojo.coords(child, true), |
| 537 | | w: child.offsetWidth / 2, |
| 538 | | h: child.offsetHeight / 2 |
| 539 | | }; |
| 540 | | if (height) |
| 541 | | child.coords.mh = dojo.marginBox(child).h; |
| 542 | | })); |
| 543 | | }, |
| 544 | | |
| 545 | | _legalMouseDown: function(/*Event*/e){ |
| 546 | | // summary: Checks if user clicked on "approved" items. |
| 547 | | if(!this.withHandles){ return true; } |
| 548 | | for(var node = (e.target); node && node != this.node; node = node.parentNode) |
| 549 | | if(dojo.hasClass(node,this.defaultHandleClass)) |
| 550 | | return true; |
| 551 | | return false; // Boolean |
| 552 | | }, |
| 553 | | |
| 554 | | setDndItemSelectable: function(/*Node*/node, /*Boolean*/isSelectable) { |
| 555 | | // summary: set an item as selectable |
| 556 | | for(var _node = node; _node && node != this.node; _node = _node.parentNode) { |
| 557 | | if (dojo.hasClass(_node,"dojoDndItem")) { |
| 558 | | dojo.setSelectable(_node,isSelectable); |
| 559 | | return; |
| 560 | | } |
| 561 | | } |
| 562 | | }, |
| 563 | | |
| 564 | | getDraggedWidget: function(/*Node*/node) { |
| 565 | | // summary: Return one or more widget selected during the drag. |
| 566 | | var _node = node; |
| 567 | | while (_node && _node.nodeName.toLowerCase()!="body" && !dojo.hasClass(_node,"dojoDndItem")) { |
| 568 | | _node = _node.parentNode; |
| 569 | | } |
| 570 | | |
| 571 | | return (_node)? dijit.byNode(_node) : null; |
| 572 | | }, |
| 573 | | |
| 574 | | isAccepted: function(/*Node*/ node) { |
| 575 | | // summary: test if this node can be accepted |
| 576 | | var _dndType = (node) ? node.getAttribute("dndtype") : null; |
| 577 | | if(_dndType && _dndType in this.accept) |
| 578 | | return true; |
| 579 | | else |
| 580 | | return false; |
| 581 | | }, |
| 582 | | |
| 583 | | onDndStart:function(/*Object*/source, /*Array*/nodes, /*Object*/copy){ |
| 584 | | // summary: Called to initiate the DnD operation. |
| 585 | | if (source == this) |
| 586 | | this.firstIndicator = true; |
| 587 | | else |
| 588 | | this.firstIndicator = false; |
| 589 | | |
| 590 | | this._calculateCoords(true); |
| 591 | | //this.isDropped = true; |
| 592 | | if (nodes[0].coords) { |
| 593 | | this._drop.style.height = nodes[0].coords.mh + "px"; |
| 594 | | }else{ |
| 595 | | var m= dojo.dnd.manager(); |
| 596 | | this._drop.style.height = m.avatar.node.clientHeight+"px"; |
| 597 | | } |
| 598 | | this.dndNodes = nodes; |
| 599 | | dojox.layout.dnd.plottedDnD.superclass.onDndStart.call(this,source, nodes, copy); |
| 600 | | if(source==this) |
| 601 | | if(this.hideSource) |
| 602 | | for(var i=0; i<nodes.length; i++) |
| 603 | | dojo.style(nodes[i], "display", "none"); |
| 604 | | }, |
| 605 | | |
| 606 | | onDndCancel:function(){ |
| 607 | | // summary: Called to cancel the DnD operation. |
| 608 | | var m= dojo.dnd.manager(); |
| 609 | | if(m.source== this && this.hideSource){ |
| 610 | | var nodes = this.getSelectedNodes(); |
| 611 | | for(var i=0; i<nodes.length; i++) |
| 612 | | if(nodes[i]) |
| 613 | | dojo.style(nodes[i], "display", ""); |
| 614 | | } |
| 615 | | dojox.layout.dnd.plottedDnD.superclass.onDndCancel.call(this); |
| 616 | | this.deleteDashedZone(); |
| 617 | | }, |
| 618 | | |
| 619 | | onDndDrop: function(source,nodes,copy) { |
| 620 | | // summary: Called to finish the DnD operation |
| 621 | | try { |
| 622 | | if (!this.isAccepted(nodes[0])) |
| 623 | | this.onDndCancel(); |
| 624 | | else { |
| 625 | | if (source == this && this._over && this.dropObject) |
| 626 | | this.current = this.dropObject.c; |
| 627 | | dojox.layout.dnd.plottedDnD.superclass.onDndDrop.call(this, source, nodes, false); |
| 628 | | this._calculateCoords(true); |
| 629 | | } |
| 630 | | } |
| 631 | | catch (error) { |
| 632 | | console.info(error); |
| 633 | | } |
| 634 | | }, |
| 635 | | |
| 636 | | onMouseDown: function(/*Event*/e) { |
| 637 | | // summary: Event processor for onmousedown. |
| 638 | | if (this.current == null) |
| 639 | | this.selection = {}; |
| 640 | | else{ |
| 641 | | if (this.current == this.anchor) |
| 642 | | this.anchor = null; |
| 643 | | } |
| 644 | | if (this.current !== null) { |
| 645 | | this.current.coords = { |
| 646 | | xy: dojo.coords(this.current, true), |
| 647 | | w: this.current.offsetWidth / 2, |
| 648 | | h: this.current.offsetHeight / 2, |
| 649 | | mh: dojo.marginBox(this.current).h |
| 650 | | }; |
| 651 | | this._drop.style.height = this.current.coords.mh + "px"; |
| 652 | | |
| 653 | | if (this.isOffset) { |
| 654 | | if (this.offsetDrag.x == 0 && this.offsetDrag.y == 0) { |
| 655 | | var NoOffsetDrag = true; |
| 656 | | var coords = dojo.coords(this._getChildByEvent(e)); |
| 657 | | this.offsetDrag.x = coords.x - e.pageX; |
| 658 | | this.offsetDrag.y = coords.y - e.clientY; |
| 659 | | } |
| 660 | | if (this.offsetDrag.y < 16 && this.current != null) |
| 661 | | this.offsetDrag.y = this.GC_OFFSET_Y; |
| 662 | | var m = dojo.dnd.manager(); |
| 663 | | m.OFFSET_X = this.offsetDrag.x; |
| 664 | | m.OFFSET_Y = this.offsetDrag.y; |
| 665 | | if (NoOffsetDrag) { |
| 666 | | this.offsetDrag.x = 0; |
| 667 | | this.offsetDrag.y = 0; |
| 668 | | } |
| 669 | | } |
| 670 | | } |
| 671 | | if (dojo.dnd.isFormElement(e)) { |
| 672 | | this.setDndItemSelectable(e.target,true); |
| 673 | | } |
| 674 | | else { |
| 675 | | this.containerSource = true; |
| 676 | | var _draggedWidget = this.getDraggedWidget(e.target); |
| 677 | | if (_draggedWidget && _draggedWidget.dragRestriction) |
| 678 | | dragRestriction = true; |
| 679 | | else |
| 680 | | dojox.layout.dnd.plottedDnD.superclass.onMouseDown.call(this,e); |
| 681 | | } |
| 682 | | }, |
| 683 | | |
| 684 | | onMouseUp: function(/*Event*/e) { |
| 685 | | // summary: Event processor for onmouseup. |
| 686 | | dojox.layout.dnd.plottedDnD.superclass.onMouseUp.call(this,e); |
| 687 | | this.containerSource = false; |
| 688 | | if (!dojo.isIE && this.mouseDown) |
| 689 | | this.setDndItemSelectable(e.target,true); |
| 690 | | var m = dojo.dnd.manager(); |
| 691 | | m.OFFSET_X = this.GC_OFFSET_X; |
| 692 | | m.OFFSET_Y = this.GC_OFFSET_Y; |
| 693 | | }, |
| 694 | | |
| 695 | | onMouseMove: function(e) { |
| 696 | | // summary: Event processor for onmousemove |
| 697 | | var m = dojo.dnd.manager(); |
| 698 | | if (this.isDragging) { |
| 699 | | var before = false; |
| 700 | | if (this.current != null || (this.current == null && !this.dropObject)) { |
| 701 | | if (this.isAccepted(m.nodes[0]) || this.containerSource) |
| 702 | | before = this.setIndicatorPosition(e); |
| 703 | | |
| 704 | | } |
| 705 | | if (this.current != this.targetAnchor || before != this.before) { |
| 706 | | this._markTargetAnchor(before); |
| 707 | | m.canDrop(!this.current || m.source != this || !(this.current.id in this.selection)); |
| 708 | | } |
| 709 | | |
| 710 | | if (this.allowAutoScroll) |
| 711 | | this._checkAutoScroll(e); |
| 712 | | } |
| 713 | | else { |
| 714 | | if (this.mouseDown && this.isSource) { |
| 715 | | var nodes = this.getSelectedNodes(); |
| 716 | | if (nodes.length) { |
| 717 | | m.startDrag(this, nodes, this.copyState(dojo.dnd.getCopyKeyState(e))); |
| 718 | | } |
| 719 | | } |
| 720 | | |
| 721 | | if (this.allowAutoScroll) |
| 722 | | this._stopAutoScroll(); |
| 723 | | } |
| 724 | | }, |
| 725 | | |
| 726 | | _markTargetAnchor: function(/*Boolean*/before){ |
| 727 | | // summary: Assigns a class to the current target anchor based on "before" status |
| 728 | | if(this.current == this.targetAnchor && this.before == before){ return; } |
| 729 | | this.targetAnchor = this.current; |
| 730 | | this.targetBox = null; |
| 731 | | this.before = before; |
| 732 | | }, |
| 733 | | |
| 734 | | _unmarkTargetAnchor: function(){ |
| 735 | | // summary: Removes a class of the current target anchor based on "before" status. |
| 736 | | if(!this.targetAnchor){ return; } |
| 737 | | this.targetAnchor = null; |
| 738 | | this.targetBox = null; |
| 739 | | this.before = true; |
| 740 | | }, |
| 741 | | |
| 742 | | setIndicatorPosition: function(/*Event*/e) { |
| 743 | | // summary: set the position of the drop indicator |
| 744 | | var before = false; |
| 745 | | if(this.current){ |
| 746 | | if (!this.current.coords || this.allowAutoScroll) { |
| 747 | | this.current.coords = { |
| 748 | | xy: dojo.coords(this.current, true), |
| 749 | | w: this.current.offsetWidth / 2, |
| 750 | | h: this.current.offsetHeight / 2 |
| 751 | | }; |
| 752 | | } |
| 753 | | if (this.horizontal) { |
| 754 | | before = (e.pageX - this.current.coords.xy.x) < this.current.coords.w; |
| 755 | | } |
| 756 | | else { |
| 757 | | before = (e.pageY - this.current.coords.xy.y) < this.current.coords.h; |
| 758 | | } |
| 759 | | this.insertDashedZone(before); |
| 760 | | } |
| 761 | | else { |
| 762 | | if (!this.dropObject /*|| dojo.isIE*/) this.insertDashedZone(false); |
| 763 | | } |
| 764 | | return before; |
| 765 | | }, |
| 766 | | |
| 767 | | |
| 768 | | onOverEvent:function(){ |
| 769 | | this._over = true; |
| 770 | | dojox.layout.dnd.plottedDnD.superclass.onOverEvent.call(this); |
| 771 | | if (this.isDragging) { |
| 772 | | var m = dojo.dnd.manager(); |
| 773 | | if (!this.current && !this.dropObject && this.getSelectedNodes()[0] && this.isAccepted(m.nodes[0])) |
| 774 | | this.insertDashedZone(false); |
| 775 | | } |
| 776 | | }, |
| 777 | | |
| 778 | | onOutEvent: function() { |
| 779 | | this._over = false; |
| 780 | | this.containerSource = false; |
| 781 | | dojox.layout.dnd.plottedDnD.superclass.onOutEvent.call(this); |
| 782 | | if (this.dropObject) this.deleteDashedZone(); |
| 783 | | }, |
| 784 | | |
| 785 | | deleteDashedZone: function() { |
| 786 | | // summary: hide the dashed zone |
| 787 | | this._drop.style.display = "none"; |
| 788 | | var next = this._drop.nextSibling; |
| 789 | | while (next != null) { |
| 790 | | next.coords.xy.y -= parseInt(this._drop.style.height); |
| 791 | | next = next.nextSibling; |
| 792 | | } |
| 793 | | delete this.dropObject; |
| 794 | | }, |
| 795 | | |
| 796 | | insertDashedZone: function(/*Boolean*/before) { |
| 797 | | // summary: Insert the dashed zone at the right place |
| 798 | | if (this.dropObject) { |
| 799 | | if (before == this.dropObject.b && ((this.current && this.dropObject.c == this.current.id) || (!this.current && !this.dropObject.c))) |
| 800 | | return; |
| 801 | | else |
| 802 | | this.deleteDashedZone(); |
| 803 | | } |
| 804 | | this.dropObject = {n: this._drop, c: (this.current)? this.current.id : null, b: before}; |
| 805 | | if (this.current) { |
| 806 | | dojo.place(this._drop, this.current, (before) ? "before" : "after"); |
| 807 | | if (!this.firstIndicator) { |
| 808 | | var next = this._drop.nextSibling; |
| 809 | | while (next != null) { |
| 810 | | next.coords.xy.y += parseInt(this._drop.style.height); |
| 811 | | next = next.nextSibling; |
| 812 | | } |
| 813 | | }else{ |
| 814 | | this.firstIndicator = false; |
| 815 | | } |
| 816 | | } |
| 817 | | else |
| 818 | | this.node.appendChild(this._drop); |
| 819 | | this._drop.style.display = ""; |
| 820 | | }, |
| 821 | | |
| 822 | | insertNodes: function(/*Boolean*/addSelected, /*Array*/data, /*Boolean*/before, /*Node*/anchor){ |
| 823 | | // summary: Inserts new data items (see Dojo Container's insertNodes method for details). |
| 824 | | if (this.dropObject){ |
| 825 | | dojo.style(this.dropObject.n,"display","none"); |
| 826 | | dojox.layout.dnd.plottedDnD.superclass.insertNodes.call(this,true,data,true,this.dropObject.n); |
| 827 | | this.deleteDashedZone(); |
| 828 | | } |
| 829 | | else { |
| 830 | | return dojox.layout.dnd.plottedDnD.superclass.insertNodes.call(this,addSelected,data,before,anchor); |
| 831 | | } |
| 832 | | var _widget = dijit.byId(data[0].getAttribute("widgetId")); |
| 833 | | if (_widget) { |
| 834 | | dojox.layout.dnd._setGcDndHandle(_widget, this.withHandles, this.handleClasses); |
| 835 | | if(this.hideSource) |
| 836 | | dojo.style(_widget.domNode, "display", ""); |
| 837 | | } |
| 838 | | }, |
| 839 | | |
| 840 | | &n |
