Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Comparing changes

Choose two branches to see what's changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: wesnolte/jOrgChart
base: ddfc594332
...
head fork: wesnolte/jOrgChart
compare: 6fddbda863
Checking mergeability… Don't worry, you can still create the pull request.
  • 3 commits
  • 2 files changed
  • 0 commit comments
  • 2 contributors
Commits on Mar 24, 2012
Jonathon Smith Improved the way nodes without IDs are handled using data- attributes…
… instead of searching on html/plain text
f1432f8
Commits on Apr 06, 2012
Jonathon Smith Changed node find method from data- attributes to jquery data()
This maintains validation on pre-HTML5 documents
b034e99
Commits on May 07, 2012
@wesnolte Merge pull request #17 from ja-jo/master
Improved handling of none ID lists. Element classes are copied across and element ids are stored against elements using the jQuery .data() method.
6fddbda
Showing with 58 additions and 138 deletions.
  1. +29 −69 example/jquery.jOrgChart.js
  2. +29 −69 jquery.jOrgChart.js
View
98 example/jquery.jOrgChart.js
@@ -35,7 +35,7 @@
distance : 40,
helper : 'clone',
opacity : 0.8,
- revert : true,
+ revert : 'invalid',
revertDuration : 100,
snap : 'div.node.expanded',
snapMode : 'inner',
@@ -68,68 +68,27 @@
// Drop event handler for nodes
$('div.node').bind("drop", function handleDropEvent( event, ui ) {
- var sourceNode = ui.draggable;
- var targetNode = $(this);
-
- // finding nodes based on plaintext and html
- // content is hard!
- var targetLi = $('li').filter(function(){
-
- li = $(this).clone()
- .children("ul,li")
- .remove()
- .end();
- var attr = li.attr('id');
- if (typeof attr !== 'undefined' && attr !== false) {
- return li.attr("id") == targetNode.attr("id");
- }
- else {
- return li.html() == targetNode.html();
- }
-
- });
-
- var sourceLi = $('li').filter(function(){
-
- li = $(this).clone()
- .children("ul,li")
- .remove()
- .end();
- var attr = li.attr('id');
- if (typeof attr !== 'undefined' && attr !== false) {
- return li.attr("id") == sourceNode.attr("id");
- }
- else {
- return li.html() == sourceNode.html();
- }
-
- });
-
- var sourceliClone = sourceLi.clone();
+
+ var targetID = $(this).data("tree-node");
+ var targetLi = $this.find("li").filter(function() { return $(this).data("tree-node") === targetID; } );
+ var targetUl = targetLi.children('ul');
+
+ var sourceID = ui.draggable.data("tree-node");
+ var sourceLi = $this.find("li").filter(function() { return $(this).data("tree-node") === sourceID; } );
var sourceUl = sourceLi.parent('ul');
-
- if(sourceUl.children('li').size() > 1){
- sourceLi.remove();
- }else{
- sourceUl.remove();
- }
-
- var id = sourceLi.attr("id");
- if(targetLi.children('ul').size() >0){
- if (typeof id !== 'undefined' && id !== false) {
- targetLi.children('ul').append('<li id="'+id+'">'+sourceliClone.html()+'</li>');
- }else{
- targetLi.children('ul').append('<li>'+sourceliClone.html()+'</li>');
- }
- }else{
- if (typeof id !== 'undefined' && id !== false) {
- targetLi.append('<ul><li id="'+id+'">'+sourceliClone.html()+'</li></ul>');
- }else{
- targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>');
- }
+ if (targetUl.length > 0){
+ targetUl.append(sourceLi);
+ } else {
+ targetLi.append("<ul></ul>");
+ targetLi.children('ul').append(sourceLi);
}
+ //Removes any empty lists
+ if (sourceUl.children().length === 0){
+ sourceUl.remove();
+ }
+
}); // handleDropEvent
} // Drag and drop
@@ -142,7 +101,8 @@
chartClass : "jOrgChart",
dragAndDrop: false
};
-
+
+ var nodeCount = 0;
// Method that recursively builds the tree
function buildNode($node, $appendTo, level, opts) {
var $table = $("<table cellpadding='0' cellspacing='0' border='0'/>");
@@ -162,15 +122,15 @@
var $nodeContent = $node.clone()
.children("ul,li")
.remove()
- .end()
- .html();
-
- var new_node_id = $node.attr("id");
- if (typeof new_node_id !== 'undefined' && new_node_id !== false) {
- $nodeDiv = $("<div>").addClass("node").attr("id", $node.attr("id")).append($nodeContent);
- }else{
- $nodeDiv = $("<div>").addClass("node").append($nodeContent);
- }
+ .end()
+ .html();
+
+ //Increaments the node count which is used to link the source list and the org chart
+ nodeCount++;
+ $node.data("tree-node", nodeCount);
+ $nodeDiv = $("<div>").addClass("node")
+ .data("tree-node", nodeCount)
+ .append($nodeContent);
// Expand and contract nodes
if ($childNodes.length > 0) {
View
98 jquery.jOrgChart.js
@@ -35,7 +35,7 @@
distance : 40,
helper : 'clone',
opacity : 0.8,
- revert : true,
+ revert : 'invalid',
revertDuration : 100,
snap : 'div.node.expanded',
snapMode : 'inner',
@@ -68,68 +68,27 @@
// Drop event handler for nodes
$('div.node').bind("drop", function handleDropEvent( event, ui ) {
- var sourceNode = ui.draggable;
- var targetNode = $(this);
-
- // finding nodes based on plaintext and html
- // content is hard!
- var targetLi = $('li').filter(function(){
-
- li = $(this).clone()
- .children("ul,li")
- .remove()
- .end();
- var attr = li.attr('id');
- if (typeof attr !== 'undefined' && attr !== false) {
- return li.attr("id") == targetNode.attr("id");
- }
- else {
- return li.html() == targetNode.html();
- }
-
- });
-
- var sourceLi = $('li').filter(function(){
-
- li = $(this).clone()
- .children("ul,li")
- .remove()
- .end();
- var attr = li.attr('id');
- if (typeof attr !== 'undefined' && attr !== false) {
- return li.attr("id") == sourceNode.attr("id");
- }
- else {
- return li.html() == sourceNode.html();
- }
-
- });
-
- var sourceliClone = sourceLi.clone();
+
+ var targetID = $(this).data("tree-node");
+ var targetLi = $this.find("li").filter(function() { return $(this).data("tree-node") === targetID; } );
+ var targetUl = targetLi.children('ul');
+
+ var sourceID = ui.draggable.data("tree-node");
+ var sourceLi = $this.find("li").filter(function() { return $(this).data("tree-node") === sourceID; } );
var sourceUl = sourceLi.parent('ul');
-
- if(sourceUl.children('li').size() > 1){
- sourceLi.remove();
- }else{
- sourceUl.remove();
- }
-
- var id = sourceLi.attr("id");
- if(targetLi.children('ul').size() >0){
- if (typeof id !== 'undefined' && id !== false) {
- targetLi.children('ul').append('<li id="'+id+'">'+sourceliClone.html()+'</li>');
- }else{
- targetLi.children('ul').append('<li>'+sourceliClone.html()+'</li>');
- }
- }else{
- if (typeof id !== 'undefined' && id !== false) {
- targetLi.append('<ul><li id="'+id+'">'+sourceliClone.html()+'</li></ul>');
- }else{
- targetLi.append('<ul><li>'+sourceliClone.html()+'</li></ul>');
- }
+ if (targetUl.length > 0){
+ targetUl.append(sourceLi);
+ } else {
+ targetLi.append("<ul></ul>");
+ targetLi.children('ul').append(sourceLi);
}
+ //Removes any empty lists
+ if (sourceUl.children().length === 0){
+ sourceUl.remove();
+ }
+
}); // handleDropEvent
} // Drag and drop
@@ -142,7 +101,8 @@
chartClass : "jOrgChart",
dragAndDrop: false
};
-
+
+ var nodeCount = 0;
// Method that recursively builds the tree
function buildNode($node, $appendTo, level, opts) {
var $table = $("<table cellpadding='0' cellspacing='0' border='0'/>");
@@ -162,15 +122,15 @@
var $nodeContent = $node.clone()
.children("ul,li")
.remove()
- .end()
- .html();
-
- var new_node_id = $node.attr("id");
- if (typeof new_node_id !== 'undefined' && new_node_id !== false) {
- $nodeDiv = $("<div>").addClass("node").attr("id", $node.attr("id")).append($nodeContent);
- }else{
- $nodeDiv = $("<div>").addClass("node").append($nodeContent);
- }
+ .end()
+ .html();
+
+ //Increaments the node count which is used to link the source list and the org chart
+ nodeCount++;
+ $node.data("tree-node", nodeCount);
+ $nodeDiv = $("<div>").addClass("node")
+ .data("tree-node", nodeCount)
+ .append($nodeContent);
// Expand and contract nodes
if ($childNodes.length > 0) {

No commit comments for this range

Something went wrong with that request. Please try again.