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
parent
fa3bc92c87
commit
b39c765332
|
@ -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>
|
||||||
|
|
||||||
|
|
|
@ -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() {
|
||||||
|
|
|
@ -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() {
|
||||||
|
|
Loading…
Reference in New Issue