changed the way drag and drop events are binding to nodes to fix an issue in recent versions of FF. Also cleaned out some dead code

master
Wes 2011-12-02 13:41:02 +00:00
parent fa3bc92c87
commit b39c765332
3 changed files with 23 additions and 35 deletions

View File

@ -9,8 +9,8 @@
<script type="text/javascript" src="prettify.js"></script> <script type="text/javascript" src="prettify.js"></script>
<!-- jQuery includes --> <!-- jQuery includes -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script src="jquery.jOrgChart.js"></script> <script src="jquery.jOrgChart.js"></script>

View File

@ -35,44 +35,41 @@
$('div.node').draggable({ $('div.node').draggable({
cursor : 'move', cursor : 'move',
distance : 40, distance : 40,
helper : 'clone', helper : 'clone',
opacity : 0.8, opacity : 0.8,
revert : true, revert : true,
revertDuration : 100, revertDuration : 100,
snap : 'div.node.expanded', snap : 'div.node.expanded',
snapMode : 'inner', snapMode : 'inner',
stack : 'div.node', stack : 'div.node'
start : handleDragStart,
stop : handleDragStop
}); });
$('div.node').droppable({ $('div.node').droppable({
accept : '.node', accept : '.node',
activeClass : 'drag-active', activeClass : 'drag-active',
drop : handleDropEvent,
hoverClass : 'drop-hover' hoverClass : 'drop-hover'
}); });
// Drag start event handler for nodes // Drag start event handler for nodes
function handleDragStart( event, ui ){ $('div.node').bind("dragstart", function handleDragStart( event, ui ){
var sourceNode = $(this); var sourceNode = $(this);
sourceNode.parentsUntil('.node-container') sourceNode.parentsUntil('.node-container')
.find('*') .find('*')
.filter('.node') .filter('.node')
.droppable('disable'); .droppable('disable');
} });
// Drag stop event handler for nodes // Drag stop event handler for nodes
function handleDragStop( event, ui ){ $('div.node').bind("dragstop", function handleDragStop( event, ui ){
/* reload the plugin */ /* reload the plugin */
$(opts.chartElement).children().remove(); $(opts.chartElement).children().remove();
$this.jOrgChart(opts); $this.jOrgChart(opts);
} });
// Drop event handler for nodes // Drop event handler for nodes
function handleDropEvent( event, ui ) { $('div.node').bind("drop", function handleDropEvent( event, ui ) {
var sourceNode = ui.draggable; var sourceNode = ui.draggable;
var targetNode = $(this); var targetNode = $(this);
@ -113,7 +110,7 @@
targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>'); targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>');
} }
} // handleDropEvent }); // handleDropEvent
} // Drag and drop } // Drag and drop
}; };
@ -148,10 +145,7 @@
.end() .end()
.html(); .html();
//var $heading = $("<h2>").text(nodeContent);
$nodeDiv = $("<div>").addClass("node").append($nodeContent); $nodeDiv = $("<div>").addClass("node").append($nodeContent);
// $nodeDiv.data('markup',$node.html());
// Expand and contract nodes // Expand and contract nodes
$nodeDiv.click(function() { $nodeDiv.click(function() {

View File

@ -17,7 +17,7 @@
$.fn.jOrgChart = function(options) { $.fn.jOrgChart = function(options) {
var opts = $.extend({}, $.fn.jOrgChart.defaults, options); var opts = $.extend({}, $.fn.jOrgChart.defaults, options);
var $appendTo = $(opts.chartElement); var $appendTo = $(opts.chartElement);
// build the tree // build the tree
$this = $(this); $this = $(this);
@ -35,44 +35,41 @@
$('div.node').draggable({ $('div.node').draggable({
cursor : 'move', cursor : 'move',
distance : 40, distance : 40,
helper : 'clone', helper : 'clone',
opacity : 0.8, opacity : 0.8,
revert : true, revert : true,
revertDuration : 100, revertDuration : 100,
snap : 'div.node.expanded', snap : 'div.node.expanded',
snapMode : 'inner', snapMode : 'inner',
stack : 'div.node', stack : 'div.node'
start : handleDragStart,
stop : handleDragStop
}); });
$('div.node').droppable({ $('div.node').droppable({
accept : '.node', accept : '.node',
activeClass : 'drag-active', activeClass : 'drag-active',
drop : handleDropEvent,
hoverClass : 'drop-hover' hoverClass : 'drop-hover'
}); });
// Drag start event handler for nodes // Drag start event handler for nodes
function handleDragStart( event, ui ){ $('div.node').bind("dragstart", function handleDragStart( event, ui ){
var sourceNode = $(this); var sourceNode = $(this);
sourceNode.parentsUntil('.node-container') sourceNode.parentsUntil('.node-container')
.find('*') .find('*')
.filter('.node') .filter('.node')
.droppable('disable'); .droppable('disable');
} });
// Drag stop event handler for nodes // Drag stop event handler for nodes
function handleDragStop( event, ui ){ $('div.node').bind("dragstop", function handleDragStop( event, ui ){
/* reload the plugin */ /* reload the plugin */
$(opts.chartElement).children().remove(); $(opts.chartElement).children().remove();
$this.jOrgChart(opts); $this.jOrgChart(opts);
} });
// Drop event handler for nodes // Drop event handler for nodes
function handleDropEvent( event, ui ) { $('div.node').bind("drop", function handleDropEvent( event, ui ) {
var sourceNode = ui.draggable; var sourceNode = ui.draggable;
var targetNode = $(this); var targetNode = $(this);
@ -113,7 +110,7 @@
targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>'); targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>');
} }
} // handleDropEvent }); // handleDropEvent
} // Drag and drop } // Drag and drop
}; };
@ -148,10 +145,7 @@
.end() .end()
.html(); .html();
//var $heading = $("<h2>").text(nodeContent);
$nodeDiv = $("<div>").addClass("node").append($nodeContent); $nodeDiv = $("<div>").addClass("node").append($nodeContent);
// $nodeDiv.data('markup',$node.html());
// Expand and contract nodes // Expand and contract nodes
$nodeDiv.click(function() { $nodeDiv.click(function() {