From a5c481e14f75d929ec18e2cbcf5336dc10e5d728 Mon Sep 17 00:00:00 2001 From: unknown Date: Mon, 16 Feb 2015 17:32:46 +0000 Subject: [PATCH] Updated the tree generation tool to include a host of new changes - CTRL and SHIFT being one --- app/index.html | 31 + .../modules/contextMenu/contextMenuModule.js | 244 +++++-- app/scripts/modules/tree/factory.js | 290 +++++++++ app/scripts/modules/tree/service.js | 357 +++++++++++ app/scripts/modules/tree/theme/style.css | 401 +++++++++--- app/scripts/modules/tree/treeModule.js | 603 +++++++----------- 6 files changed, 1426 insertions(+), 500 deletions(-) create mode 100644 app/scripts/modules/tree/factory.js create mode 100644 app/scripts/modules/tree/service.js diff --git a/app/index.html b/app/index.html index 03b503a..861ba64 100644 --- a/app/index.html +++ b/app/index.html @@ -73,10 +73,41 @@

AngularJS Dynamic Tree Module

+ + + + diff --git a/app/scripts/modules/contextMenu/contextMenuModule.js b/app/scripts/modules/contextMenu/contextMenuModule.js index 82e6aea..b8d7deb 100644 --- a/app/scripts/modules/contextMenu/contextMenuModule.js +++ b/app/scripts/modules/contextMenu/contextMenuModule.js @@ -1,66 +1,234 @@ -angular.module('contextMenuModule', []) -.directive('contextMenuModule', ['$compile', function (compile) { +angular.module('contextMenuModule', ['tree.service']) + +.directive('popover', ['$compile', 'NodeTrackingService', function (compile, NodeTrackingService) { return { scope: false, replace: false, - link: function ($scope, element) { + link: function ($scope, element, attributes) { + $scope.Print = function () { - endRightClickEvent(); - alert("Print"); + alert("Problem with Print"); + }; + + $scope.Customsie = function () { + handleClickEvent(); + //$state.go('main.document.customise', { id: attributes.nodeid }); }; - $scope.Edit = function () { - endRightClickEvent(); - alert("Edit"); + $scope.CopyAndCustomsie = function () { + handleClickEvent(); + //$state.go('main.document.customise', { id: result.DocumentId }); + }; + + $scope.CopyDocuments = function (event) { + handleClickEvent(); + NodeTrackingService.setRightClickAndAction(true); + //$state.go('main.documents.copy'); }; $scope.Delete = function () { - endRightClickEvent(); - alert("Delete"); + handleClickEvent(); + NodeTrackingService.setRightClickAndAction(true); + //$state.go('main.documents.delete'); }; - - var htmlTemplate = htmlTemplate = - ''; - - element.on("contextmenu", function (e) { - console.log("in right click"); - endRightClickEvent(); - element.css('background-color', 'LightBlue'); - e.preventDefault(); // default context menu is disabled - e.stopPropagation(); // stop any further right click + + $scope.Approve = function () { + handleClickEvent(); + NodeTrackingService.setRightClickAndAction(true); + //$state.go('main.documents.approve'); + }; + + $scope.AddToFolder = function () { + handleClickEvent(); + //$state.go('main.documents.addToFolder'); + }; + + $scope.RemoveFromFolder = function () { + handleClickEvent(); + NodeTrackingService.setRightClickAndAction(true); + //$state.go('main.documents.removeFromFolder'); + }; + + /* SERVICE MODEL FOLDER OPTIONS*/ + + $scope.CreateFolder = function () { + handleClickEvent(); + $scope.$parent.createFolder(); + }; + $scope.RenameFolder = function () { + handleClickEvent(); + $scope.$parent.setIsReadOnly(false); + }; + $scope.Cut = function () { + handleClickEvent(); + $scope.$parent.cut(); + }; + $scope.Copy = function () { + handleClickEvent(); + $scope.$parent.copy(); + }; + $scope.Paste = function () { + handleClickEvent(); + $scope.$parent.paste(); + }; + $scope.DeleteFolders = function () { + handleClickEvent(); + $scope.$parent.deleteFolders(); + }; + + + element.on("contextmenu", function (event) { - var newElement = compile(htmlTemplate)($scope); - newElement.css({ - left: event.clientX + 'px', - top: event.clientY + 'px' - }); - element.append(newElement); + + var htmlTemplate = ''; + var showRightClick = true; + + handleClickEvent(); + event.preventDefault(); // default context menu is disabled + event.stopPropagation(); + + var screenHeight = screen.height; + var xPosition = event.clientX - element[0].getBoundingClientRect().left; + var yPosition = event.clientY - element[0].getBoundingClientRect().top; + + + htmlTemplate = + ''; + + var newElement = compile(htmlTemplate)($scope); + newElement.css({ + left: xPosition + 'px', + top: yPosition + 'px' + }); + element.append(newElement); + + }); - element.on("mouseleave", function (event) { - endRightClickEvent(event); + element.on("mouseleave", function () { + // on mouse leave, the context menu is removed. + handleClickEvent(); }); - - function endRightClickEvent(event) { - if ($("#contextmenu-node")){ + + function handleClickEvent() { + if ($("#contextmenu-node")) { $("#contextmenu-node").remove(); element.css('background-color', 'White'); } } $scope.$on('$destroy', function () { - $(document).unbind('mouseleave', endRightClickEvent); - $(document).unbind('contextmenu', endRightClickEvent); + $(document).unbind('mouseleave', handleClickEvent); + $(document).unbind('contextmenu', handleClickEvent); }); } }; -}]); +}]) + +.directive('draganddrop', function ($compile, NodeTrackingService) { + return { + restrict: 'A', + link: function (scope, element, attributes) { + + + // Set up folder / service model drag and drop + + element.draggable({ + helper: function(event, ui) { + return '
'; + }, + start: function(event, ui) { + var folders = NodeTrackingService.getClickedFolderNodes(); + var documents = NodeTrackingService.getClickedDocumentNodes(); + var title = ""; + + folders.length > 1 ? title = "Move Folders" : title = title; + folders.length == 1 ? title = "Move Folders" : title = title; + if (folders.length > 0) { + documents.length > 1 ? title = title + " & Documents" : title = title; + documents.length == 1 ? title = title + " & Documents" : title = title; + } else { + documents.length > 1 ? title = "Move Documents" : title = title; + documents.length == 1 ? title = "Move Document" : title = title; + } + + var widgetHtml = "
" + title + "
"; + widgetHtml += "
"; + + if (folders.length > 0) { + widgetHtml += "

Folders

"; + } + if (documents.length > 0) { + widgetHtml += "

Documents

"; + } + widgetHtml += "
"; + angular.element(ui.helper)[0].innerHTML = widgetHtml; + }, + scroll: true, + scrollSensitivity: 20, + scrollSpeed: 10, + opacity: 0.9, + delay: 250, + cursor: "move", + axis: 'y', + revert: "invalid", + revertDuration: 100, + zIndex: 9999, + cursorAt: { top: -15, left: 100 }, + }); + + element.droppable({ + greedy: true, + hoverClass: "sm_dropBox_hover", + tolerance: 'pointer', + drop: function(event, ui) { + var draggedNode = angular.element(ui.draggable).scope().node; + + + if (NodeTrackingService.getClickedNodes().length == 0) { + NodeTrackingService.clearClickedNodes(); + NodeTrackingService.addToClickedNodes(draggedNode); + NodeTrackingService.setClickedNode(draggedNode); + } + + if (!scope.node.attr.isEndNode) { + scope.$parent.cut(); + NodeTrackingService.setClickedNode(scope.node); + alert ("Dropped node(s)"); + scope.$parent.paste(); + } + + }, + }); + + + + scope.$on('$destroy', function () { + element.off('**'); + }); + } + }; +}); diff --git a/app/scripts/modules/tree/factory.js b/app/scripts/modules/tree/factory.js new file mode 100644 index 0000000..bd6a09e --- /dev/null +++ b/app/scripts/modules/tree/factory.js @@ -0,0 +1,290 @@ + +angular.module('tree.factory', ['tree.service']); + +angular.module('tree.factory') + .factory('TreeRecursionHelper', ['$compile' + , function ($compile) { + var TreeRecursionHelper = { + compile: function (element) { + var factory = {}; + + var contents = element.contents().remove(); + var compiledContents; + + factory = function (scope, element) { + + if (!compiledContents) { + compiledContents = $compile(contents); + } + + compiledContents(scope, function (clone) { + element.append(clone); + }); + + }; + return factory; + } + }; + return TreeRecursionHelper; + } + ]) + .factory('NodesHelper', function (NodeTrackingService) { + var NodesHelper = { + collapseNodes: function (currentNode) { + if (currentNode != null) { + if (currentNode.children) { + for (var i = 0; i < currentNode.children.length; i++) { + //Close all the child folders + var child = currentNode.children[i]; + child.attr.expanded = false; + } + } + } + }, + removeSelectableValueFromAllNodes: function (currentNode) { + currentNode.attr.selectable = false; + if (currentNode.children) { + for (var i = 0; i < currentNode.children.length; i++) { + NodesHelper.removeSelectableValueFromAllNodes(currentNode.children[i]); + } + } + }, + refreshSelectOrDeselectedBasedOnNodeTrackingService: function (currentNode, checkParent) { + if (currentNode != null) { + + var checkChildren = false; + + if (!checkParent) { + checkChildren = true; + } else { + if (currentNode.attr.selected == 1 || currentNode.attr.selected == 2) { + checkChildren = true; + } else { + checkChildren = false; + } + } + + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children && checkChildren) { + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + + // Check if the child end node is seleted or not + if (child.attr.isEndNode) { + if (NodeTrackingService.findSelectedNode(child.attr.documentId, child.attr.documentGroupId)) { + child.attr.selected = 1; + } else { + child.attr.selected = 0; + } + + + } + else { + // Check if the child end node is seleted or not + if (NodeTrackingService.findSelectedFolder(child.attr.documentGroupId)) { + child.attr.selected = 1; + } else { + child.attr.selected = 0; + } + } + if (child.children) { + // go to the folders children and select + NodesHelper.refreshSelectOrDeselectedBasedOnNodeTrackingService(child, checkParent); + } + }; + } + NodesHelper.findChildNodeAndSetStateOfParentsItterator(currentNode); + } + }, + refreshExpandedNodesBasedOnNodeTrackingService: function (currentNode) { + if (currentNode != null) { + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + + if (!child.attr.isEndNode && NodeTrackingService.findExpandedNode(child.attr.documentGroupId)) { + child.attr.expanded = true; + } + if (child.children) { + // go to the folders children and select + NodesHelper.refreshExpandedNodesBasedOnNodeTrackingService(child); + } + }; + } + } + }, + findChildNodesAndSelectOrDeselect: function (currentNode, documentIdToFind, newValue) { + if (currentNode != null) { + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + // We have a folder + + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + if (child.attr.isEndNode) { + if (child.attr.documentId == documentIdToFind) { + child.attr.selected = newValue; + if (newValue == 1) { + NodeTrackingService.setSelectedNode(child); + } + if (newValue == 0) { + NodeTrackingService.removeSelectedNode(child); + } + } + } else { + if (child.children) { + // go to the folders children and select + NodesHelper.findChildNodesAndSelectOrDeselect(child, documentIdToFind, newValue); + } + } + }; + } + } + }, + findChildNodeAndSetStateOfParentsItterator: function (currentNode) { + var newValue = 0; + if (currentNode != null) { + + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + // We have a folder + var selectedChildCount = 0; + var partiallySelectedCount = 0; + + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + NodesHelper.findChildNodeAndSetStateOfParentsItterator(child); + if (child.attr.selected == 1) { selectedChildCount = selectedChildCount + 1; } + if (child.attr.selected == 2) { partiallySelectedCount = partiallySelectedCount + 1; } + } + + // Partially Selected + if (selectedChildCount > 0 || partiallySelectedCount > 0) { + newValue = 2; + } + + // All Children Selected + if (selectedChildCount == currentNode.children.length) { + if (selectedChildCount == 1) { + newValue = currentNode.children[0].attr.selected; + } else { + newValue = 1; + } + } + + // No children selected + if (selectedChildCount == 0 && partiallySelectedCount == 0) { + if (NodeTrackingService.findSelectedFolder(currentNode.attr.documentGroupId)) { + newValue = 1; + } else { + newValue = 0; + } + + } + + currentNode.attr.selected = newValue; + } + } + }, + selectParentsChildNodeItterator: function (currentNode, newValue) { + + if (currentNode != null) { + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + // We have a folder + var selectedChildCount = 0; + var partiallySelectedCount = 0; + + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + if (child.attr.selected == 1) { selectedChildCount = selectedChildCount + 1; } + if (child.attr.selected == 2) { partiallySelectedCount = partiallySelectedCount + 1; } + } + + // Partially Selected + if (selectedChildCount > 0 || partiallySelectedCount > 0) { + newValue = 2; + } + + // No children selected + if (selectedChildCount == 0 && partiallySelectedCount == 0) { + newValue = 0; + } + + // All Children Selected + if (selectedChildCount == currentNode.children.length) { + newValue = 1; + } + + if (currentNode.children.length == 0) { + if (currentNode.attr.selected == 0 || currentNode.attr.selected == 2) { + newValue = 0; + } else { + newValue = 1; + } + } + } + + currentNode.attr.selected = newValue; + } + }, + selectChildNodeItterator: function (currentNode, newValue) { + if (currentNode != null) { + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + // We have a folder + + for (var i = 0; i < currentNode.children.length; i++) { + var child = currentNode.children[i]; + + if (child.attr.show) { + child.attr.selected = newValue; + if (newValue == 1) { + NodeTrackingService.setSelectedNode(child); + } + if (newValue == 0) { + NodeTrackingService.removeSelectedNode(child); + } + } + if (child.children) { + // go to the folders children and select + NodesHelper.selectChildNodeItterator(child, newValue); + } + + };//); + } + if (!angular.isUndefined(currentNode.attr)) { + if (currentNode.attr.show) { + currentNode.attr.selected = newValue; + } + } + } + }, + showParentsNodeItterator: function (currentNode) { + if (currentNode != null && !currentNode.attr.isEndNode) { + // We need to go over all of the parents direct child items to work out if this node should be selected or not + if (currentNode.children) { + // We have a folder + var hiddenChildCount = 0; + for (var i = 0; i < currentNode.children.length; i++) { + if (!currentNode.children[i].attr.show) { + hiddenChildCount = hiddenChildCount + 1; + } + }; + + if (hiddenChildCount == currentNode.children.length) { + currentNode.attr.show = false; + } + else { + currentNode.attr.show = true; + } + } + else { + currentNode.attr.show = true; + } + } + } + }; + return NodesHelper; + }); \ No newline at end of file diff --git a/app/scripts/modules/tree/service.js b/app/scripts/modules/tree/service.js new file mode 100644 index 0000000..5032d57 --- /dev/null +++ b/app/scripts/modules/tree/service.js @@ -0,0 +1,357 @@ + +angular.module('tree.service', []); + +angular.module('tree.service') + .service("NodeTrackingService", function () { + var node = {}; + var nodeList = []; + var folderNodeList = []; + var clickedNode = {}; + var clickedNodes = []; + var hoveredNode = {}; + var expandedNodeList = []; + var copiedNodeList = []; + var folderClickedNode = {}; + var destinationFolderNodeList = []; + var isCutOperation = false; + var clickedNodeIndex = 0; + var rightClickAndAction = false; + var selectedTreeMenu = "CoreAndCustom"; + + return { + setSelectedTreeMenu: function(value) { + selectedTreeMenu = value; + }, + getSelectedTreeMenu: function() { + return selectedTreeMenu; + }, + setExpandedNode: function (value) { + expandedNodeList.push(value); + }, + clearExpandedNodes: function () { + expandedNodeList = []; + }, + removeExpandedNode: function (value) { + expandedNodeList.splice(expandedNodeList.indexOf(value), 1); + }, + findExpandedNode: function (value) { + for (var i = 0; i < expandedNodeList.length; i++) { + if (expandedNodeList[i] == value) { + return true; + } + } + return false; + }, + getSelectedNode: function () { + return node; + }, + /* Node functions */ + setSelectedNode: function (value) { + node = value; + if (!angular.isUndefined(value.attr)) { + if (value.attr.isEndNode) { + var alreadyAdded = false; + for (var i = 0; i < nodeList.length; i++) { + if (nodeList[i].DocumentId == value.attr.documentId && nodeList[i].DocumentGroupId == value.attr.documentGroupId) { + alreadyAdded = true; + } + } + + if (!alreadyAdded) { + var newNode = { + DocumentId: value.attr.documentId, + DocumentGroupId: value.attr.documentGroupId, + DocumentTypeId: value.attr.documentTypeId, + DocumentTitle: value.data.title, + Draft: value.attr.draft + }; + + nodeList.push(newNode); + } + } else { + + //find the number of child folders + var numberOfChildFolders = 0; + for (var i = 0; i < value.children.length; i++) { + if (!value.children[i].attr.isEndNode) { + if (value.children[i].attr.documentGroupId < 1000000) { + numberOfChildFolders = numberOfChildFolders + 1; + } + } + } + + var alreadyAddedFolder = false; + + // Check that the selected folder is not jsut a document grouping defined by 1900009 + if (value.attr.documentGroupId < 1000000) { + for (var i = 0; i < folderNodeList.length; i++) { + if (folderNodeList[i].FolderGroupId == value.attr.documentGroupId) { + alreadyAddedFolder = true; + } + } + + if (!alreadyAddedFolder) { + var newFolderNode = { + FolderGroupId: value.attr.documentGroupId, + FolderTitle: value.data.title, + NumberOfChildFolders: numberOfChildFolders + }; + folderNodeList.push(newFolderNode); + } + } + } + } + }, + removeSelectedEndNode: function (documentId, documentGroupId) { + for (var i = 0; i < nodeList.length; i++) { + var node = nodeList[i]; + if (angular.isDefined(node) && node.DocumentId == documentId) { + nodeList.splice(i, 1); + i--; + } + } + + }, + removeSelectedEndNodeByGroupId: function (documentId, documentGroupId) { + for (var i = 0; i < nodeList.length; i++) { + var node = nodeList[i]; + if (angular.isDefined(node) && node.DocumentId == documentId && nodeList[i].DocumentGroupId == documentGroupId) { + nodeList.splice(i, 1); + i--; + } + } + + }, + removeSelectedNode: function (value) { + node = value; + if (value.attr.isEndNode) { + for (var i = 0; i < nodeList.length; i++) { + if (nodeList[i].DocumentId == value.attr.documentId && nodeList[i].DocumentGroupId == value.attr.documentGroupId) { + nodeList.splice(i, 1); + } + } + } else { + for (var i = 0; i < folderNodeList.length; i++) { + if (folderNodeList[i].FolderGroupId == value.attr.documentGroupId) { + folderNodeList.splice(i, 1); + } + } + } + }, + removeSelectedNodeById: function (documentId) { + for (var i = 0; i < nodeList.length; i++) { + if (nodeList[i].DocumentId == documentId) { + nodeList.splice(i, 1); + } + } + }, + removeSelectedFolderById: function (folderId) { + for (var i = 0; i < folderNodeList.length; i++) { + if (folderNodeList[i].FolderGroupId == folderId) { + folderNodeList.splice(i, 1); + } + } + }, + + /* NodeList functions */ + seedSelectNodeList: function (documentList, folderList ) { + nodeList = documentList.slice(); + folderNodeList = folderList.slice(); + }, + getSelectedFolderNodeList: function () { + return folderNodeList; + }, + getSelectedFolderNodeListOfIds: function () { + var folderNodeListIds = []; + for (var i = 0; i < folderNodeList.length; i++) { + folderNodeListIds.push(folderNodeList[i].FolderGroupId); + } + return folderNodeListIds; + }, + getSelectedNodeList: function () { + return nodeList; + }, + getDistinctSelectedNodeList: function (existingNodeList) { + var distinctList = []; + for (var i = 0; i < existingNodeList.length; i++) { + var currentNode = existingNodeList[i]; + var found = false; + for (var j = 0; j < distinctList.length; j++) { + if (distinctList[j].DocumentId == currentNode.DocumentId) { + found = true; + } + } + if (!found) { + distinctList.push(currentNode); + } + } + return distinctList; + }, + + getSelectedNodeListOfIds: function () { + var selectedNodeIds = []; + for (var i = 0; i < nodeList.length; i++) { + selectedNodeIds.push(nodeList[i].DocumentId); + } + return selectedNodeIds; + }, + clearAllSelectedNodes: function () { + nodeList = []; + folderNodeList = []; + destinationFolderNodeList = []; + + }, + findSelectedNode: function (documentId, groupId) { + for (var i = 0; i < nodeList.length; i++) { + if (nodeList[i].DocumentId == documentId && nodeList[i].DocumentGroupId == groupId) { + return true; + } + } + return false; + }, + findSelectedFolder: function (groupId) { + for (var i = 0; i < folderNodeList.length; i++) { + if (folderNodeList[i].FolderGroupId == groupId) { + return true; + } + } + return false; + }, + getClickedNodeIndex: function () { + return clickedNodeIndex; + }, + setClickedNodeIndex: function (value) { + clickedNodeIndex = value; + }, + getRightClickAndAction: function () { + return rightClickAndAction; + }, + setRightClickAndAction: function (value) { + rightClickAndAction = value; + }, + getClickedNode: function () { + return clickedNode; + }, + setClickedNode: function (value) { + clickedNode = value; + }, + getClickedNodes: function () { + return clickedNodes; + }, + getClickedFolderNodes: function () { + var returnNodes = []; + for (var i = 0; i < clickedNodes.length; i++) { + var currentNode = clickedNodes[i]; + if (!currentNode.attr.isEndNode) { + returnNodes.push(currentNode); + } + } + return returnNodes; + }, + getClickedDocumentNodes: function () { + var returnNodes = []; + for (var i = 0; i < clickedNodes.length; i++) { + var currentNode = clickedNodes[i]; + if (currentNode.attr.isEndNode) { + returnNodes.push(currentNode); + } + } + return returnNodes; + }, + isClickedNode: function (value) { + return clickedNodes.indexOf(value) > -1 ? true : false; + }, + addToClickedNodes: function (value) { + var alreadyAdded = false; + for (var i = 0; i < clickedNodes.length; i++) { + if (clickedNodes[i] == value) { + alreadyAdded = true; + } + } + + if (!alreadyAdded) { + clickedNodes.push(value); + } + }, + removeClickedNode: function (value) { + clickedNodes.splice(clickedNodes.indexOf(value), 1); + }, + clearClickedNodes: function () { + clickedNodes = []; + clickedNode = {}; + }, + getCopiedNodesCount: function () { + return copiedNodeList.length; + }, + getCopiedFolderNodes: function () { + var returnNodes = []; + for (var i = 0; i < copiedNodeList.length; i++) { + var currentNode = copiedNodeList[i]; + if (!currentNode.attr.isEndNode) { + returnNodes.push(currentNode); + } + } + return returnNodes; + }, + getCopiedDocumentNodes: function () { + var returnNodes = []; + for (var i = 0; i < copiedNodeList.length; i++) { + var currentNode = copiedNodeList[i]; + if (currentNode.attr.isEndNode) { + returnNodes.push(currentNode); + } + } + return returnNodes; + }, + setCutNodes: function () { + copiedNodeList = angular.copy(clickedNodes); + }, + setCopiedNodes: function () { + var documentIds = []; + var distinctNodes = []; + for (var i = 0; i < clickedNodes.length; i++) { + if (documentIds.indexOf(clickedNodes[i].attr.documentId) == -1) { + distinctNodes.push(clickedNodes[i]); + documentIds.push(clickedNodes[i].attr.documentId); + } + } + copiedNodeList = angular.copy(distinctNodes); + }, + clearCopiedNodes: function () { + copiedNodeList = []; + }, + setIsCutOperation: function (value) { + isCutOperation = value; + }, + getIsCutOperation: function () { + return isCutOperation; + }, + getHoveredNode: function () { + return hoveredNode; + }, + setHoveredNode: function (value) { + hoveredNode = value; + }, + removeHoveredNode: function () { + hoveredNode = {}; + }, + setDestinationFolderNodes: function (value) { + destinationFolderNodeList.push(value); + }, + removeDestinationFolderNodes: function (value) { + destinationFolderNodeList.splice(destinationFolderNodeList.indexOf(value), 1); + }, + getDestinationFolderNodes: function () { + return destinationFolderNodeList; + }, + setFolderClickedNode: function (value) { + folderClickedNode = value; + }, + getFolderClickedNode: function () { + return folderClickedNode; + }, + clearFolderClickedNode: function () { + folderClickedNode = {}; + } + }; + }); \ No newline at end of file diff --git a/app/scripts/modules/tree/theme/style.css b/app/scripts/modules/tree/theme/style.css index 773c849..a47e83f 100644 --- a/app/scripts/modules/tree/theme/style.css +++ b/app/scripts/modules/tree/theme/style.css @@ -13,10 +13,42 @@ font-family: source_sans_proregular, 'Segoe UI', Verdana, Helvetica, sans-serif; color: black; text-decoration:none; - background-color:transparent; + /*background-color:transparent;*/ display: block; } + .nodeListItem > a > label:hover { + background-color:rgb(56,147,155) !important; + color: white; + } + + .nodeListItem .selected > label { + background-color:rgb(56,147,155); + color: white; + } + + .tf_dropBox_active { + background-color: rgb(56,147,155) !important; + color: white; + } + + .tf_dropBox_active .treeNodeLabel { + background-color: rgb(56,147,155) !important; + color: white; + } + + .tf_dropBox_hover > div > a > label { + background-color: rgb(93,50,161) !important; + color: white; + } + + + .sm_dropBox_hover { + background-color:rgb(56,147,155) !important; + color: white; + } + + .nodepart { -moz-user-select: -moz-none; @@ -26,58 +58,81 @@ user-select: none; color: #555; text-decoration:none; - background-color:transparent; display:inline-block; vertical-align:middle; } + /* Component containers + ----------------------------------*/ + .tree-widget { + /*font-family: Verdana,Arial,sans-serif; + font-size: 1.1em*/ + z-index: 9999; + } + + .tree-widget .tree-widget { font-size: 1em; } + .tree-widget input, .tree-widget select, .tree-widget textarea, .tree-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; } + .tree-widget-content { + border: 1px solid rgb(56, 147, 155); + background: white; + color: black; + font-size: 9pt; + + } + .tree-widget-content li{ + width: 205px; + font-size: 9pt; + text-decoration: none; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + .tree-widget-content label{ + font-size: 9pt; + text-decoration: none; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + width: 100px; + } + + .tree-widget-content h4{ + padding-left: 10px; + font-size: 11pt; + } + .tree-widget-content a { color: #222222/*{fcContent}*/; } + .tree-widget-header { + background-color: rgb(56, 147, 155); + color: white; + font-weight: bold; + padding-top: 2px; + padding-bottom: 2px; + } + - nodepartlabel :hover { - background:red; - background-color:transparent; - } + .tree-widget-header a { color: #222222/*{fcHeader}*/; } + .isSearchResult { background-color:yellow !important; - /*border: 2px dashed black;*/ - } - .isNotSearchResult { - - } - + .warning { background-color:red; } - .tf_dropBox_hover > div > a { - background-color:yellow !important; - border: 0.5px dashed black; - } - - .tf_dropBox_active > div > a { - background-color:yellow; - - } - + .itemHeader { background-color:blue; } - .ui-widget-content { - border: 1px solid #aaaaaa; - background: #ffffff; - color: #222222; - } - - .tree ul { - background-color:transparent; + /*background-color:transparent;*/ list-style: none; border: none; - overflow: hidden; + /*overflow: hidden;*/ display: block; margin: 0 0 0 0; padding: 0 0 0 0; @@ -93,7 +148,7 @@ position: relative; padding: 0 0 0 0px; - background-color:transparent; + /*background-color: transparent !important;*/ list-style-type: none; margin-bottom: 0px; margin-left: 10px; @@ -109,17 +164,14 @@ } .tree li div { - min-height: 18px; + /*min-height: 18px;*/ + /*background-color: transparent;*/ } .tree li div .endNode { - height: 18px !important; + /*height: 18px !important;*/ } - .tree a:hover { - background-color: transparent; - } - .tree li div > a { vertical-align:top; text-decoration: none !important; @@ -128,17 +180,27 @@ cursor: pointer; display: inline-block; font-family: source_sans_proregular, 'Segoe UI', Verdana, Helvetica, sans-serif; - font-size: 14px; + font-size: 11pt; height: 17px; - line-height: 17px; + width:100%; + line-height: 14pt; list-style-type: none; - margin: 0px 0px 0px 0px; - padding: 0px; - /* - text-decoration: none solid rgb(0, 0, 0);*/ - + + } + + .tree li div > a input { + background:lightgrey; + border:none; + width:100%; + height: 17px; + font-weight:normal; + display:inline-block; + vertical-align:top; + margin: 0 0 0 0px; + padding:0px 0px 0px 5px; + line-height:17px !important; } .tree ins { @@ -148,13 +210,12 @@ height: 17px; margin: 0 3px 0 0px; color: black; - background-color:transparent; vertical-align:top; } .tree a ins { - height: 17px; + height: 16px; width: 16px; padding: 0px; margin: 0px; @@ -173,94 +234,278 @@ line-height:17px !important; } - .tree a:hover{ - background-color:lightblue; - } - .tree li i, tree li span div label { cursor: pointer; } - .tree li .selected { - background-color: #aaddff; - padding: 1px 5px; + .folderdots > div > a { + background-repeat:repeat-y; + background-image:url("/scripts/modules/tree/theme/d.png"); + background-position: -90px 0px; + position:relative; + top:0px; + right:-0px; } - .dots { - background-image:url("/scripts/modules/Tree/theme/d.png"); - background-position:-90px 0; + .folderdots { background-repeat:repeat-y; - background-color:transparent; + background-image:url("/scripts/modules/tree/theme/d.png"); + background-position: -90px -32px; + } .leaf { - background-image:url("/scripts/modules/Tree/theme/d.png"); - background-position:-36px -2px; + background-repeat:repeat-y; + background-image:url("/scripts/modules/tree/theme/d.png"); + background-position:-39px -0px; + } + .folderLeaf { + background-repeat:repeat-y; + background-image:url("/scripts/modules/tree/theme/d.png"); + background-position:-39px -2px; + } /* Tree node - */ .open-tree { - background-image:url("/scripts/modules/Tree/theme/d.png"); + background-image:url("/scripts/modules/tree/theme/d.png"); background-repeat:no-repeat; - background-color:transparent; background-position:-72px -2px; - /*width:16px !important;*/ margin: 0px 3px 0px 0px !important; + } .closed { - background-image:url("/scripts/modules/Tree/theme/d.png"); + background-image:url("/scripts/modules/tree/theme/d.png"); background-repeat:no-repeat; - background-color:transparent; background-position:-54px -2px; - /*width:16px !important;*/ margin: 0px 3px 0px 0px !important; + } /*Expanded folder*/ .folder { - background-image: url("/scripts/modules/Tree/theme/folder.png"); - /*background-image: url("/scripts/modules/Tree/theme/fugue-icons-10.png");*/ + /*background-image: url("/scripts/modules/tree/theme/folder.png");*/ + background-image: url("/scripts/modules/tree/theme/fugue-icons-10.png"); background-repeat: no-repeat; - background-color: transparent; + /*background-color: transparent;*/ background-position: 0 0; - /*background-position: 0px -1672px;*/ + background-position: 0px -1672px; width: 18px !important; /*height: 16px;*/ } .checkedSome { - background-image:url("/scripts/modules/Tree/theme/d.png"); + background-image:url("/scripts/modules/tree/theme/d.png"); background-position: -20px -19px; background-repeat: no-repeat; - background-color: transparent; + /*background-color: transparent;*/ } .checkedImg { - background-image:url("/scripts/modules/Tree/theme/d.png"); + background-image:url("/scripts/modules/tree/theme/d.png"); background-position: -38px -19px; background-repeat: no-repeat; - background-color: transparent; + /*background-color: transparent;*/ } .checkedNone { - background-image:url("/scripts/modules/Tree/theme/d.png"); + background-image:url("/scripts/modules/tree/theme/d.png"); background-position: -2px -19px; background-repeat: no-repeat; - background-color: transparent; + /*background-color: transparent;*/ } .doc { - background-image: url(/scripts/modules/Tree/theme/fugue-icons-8.png); + background-image: url(/scripts/modules/tree/theme/fugue-icons-8.png); background-position: 0 -1235px; background-repeat:no-repeat; - background-color:transparent; + /*background-color:transparent;*/ width: 18px !important; height: 17px; } + +/* Fonts for SFG20 +-----------------------------------------------------------*/ + +@font-face { + font-family: 'source_sans_problack'; + src: url('/Content/fonts/sourcesanspro-black-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-black-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-black-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-black-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-black-webfont.svg#source_sans_problack') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_problack_italic'; + src: url('/Content/fonts/sourcesanspro-blackit-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-blackit-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-blackit-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-blackit-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-blackit-webfont.svg#source_sans_problack_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_probold'; + src: url('/Content/fonts/sourcesanspro-bold-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-bold-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-bold-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-bold-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-bold-webfont.svg#source_sans_probold') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_probold_italic'; + src: url('/Content/fonts/sourcesanspro-boldit-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-boldit-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-boldit-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-boldit-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-boldit-webfont.svg#source_sans_probold_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proextralight'; + src: url('/Content/fonts/sourcesanspro-extralight-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-extralight-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-extralight-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-extralight-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-extralight-webfont.svg#source_sans_proextralight') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proXLtIt'; + src: url('/Content/fonts/sourcesanspro-extralightit-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-extralightit-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-extralightit-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-extralightit-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-extralightit-webfont.svg#source_sans_proXLtIt') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proitalic'; + src: url('/Content/fonts/sourcesanspro-it-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-it-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-it-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-it-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-it-webfont.svg#source_sans_proitalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prolight'; + src: url('/Content/fonts/sourcesanspro-light-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-light-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-light-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-light-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-light-webfont.svg#source_sans_prolight') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prolight_italic'; + src: url('/Content/fonts/sourcesanspro-lightit-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-lightit-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-lightit-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-lightit-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-lightit-webfont.svg#source_sans_prolight_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proregular'; + src: url('/Content/fonts/sourcesanspro-regular-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-regular-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-regular-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-regular-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-regular-webfont.svg#source_sans_proregular') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prosemibold'; + src: url('/Content/fonts/sourcesanspro-semibold-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-semibold-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-semibold-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-semibold-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-semibold-webfont.svg#source_sans_prosemibold') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proSBdIt'; + src: url('/Content/fonts/sourcesanspro-semiboldit-webfont.eot'); + src: url('/Content/fonts/sourcesanspro-semiboldit-webfont.eot?#iefix') format('embedded-opentype'), + url('/Content/fonts/sourcesanspro-semiboldit-webfont.woff') format('woff'), + url('/Content/fonts/sourcesanspro-semiboldit-webfont.ttf') format('truetype'), + url('/Content/fonts/sourcesanspro-semiboldit-webfont.svg#source_sans_proSBdIt') format('svg'); + font-weight: normal; + font-style: normal; +} \ No newline at end of file diff --git a/app/scripts/modules/tree/treeModule.js b/app/scripts/modules/tree/treeModule.js index 3b776a1..6228e78 100644 --- a/app/scripts/modules/tree/treeModule.js +++ b/app/scripts/modules/tree/treeModule.js @@ -1,415 +1,258 @@ angular.module('treeModule', ['tree.service', 'tree.factory', 'tree.directive', 'contextMenuModule']); -angular.module('tree.service', []) - .service("NodeTrackingService", function () { - var node = {}; - var nodeList = []; - var clickedNode = {}; - var hoveredNode = {}; - var expandedNodeList = []; - +angular.module('tree.directive', []) +.directive('tree', function ($compile, NodesHelper, NodeTrackingService, TreeRecursionHelper) { return { - setExpandedNode: function (value) { - expandedNodeList.push(value); - }, - removeExpandedNode: function (value) { - expandedNodeList.splice(expandedNodeList.indexOf(value), 1); - }, - findExpandedNode: function (value) { - for (var i = 0; i < expandedNodeList.length; i++) { - if (expandedNodeList[i] == value) { - return true; - } - } - return false; + restrict: "A", + require: "^tree", + transclude: true, + scope: { + node: '=', + type: '=' }, - getSelectedNode: function () { - return node; - }, - setSelectedNode: function (value) { - node = value; - if (value.attr.isEndNode) { - var newNode = { - DocumentId: value.attr.documentId, - DocumentGroupId: value.attr.documentGroupId, - DocumentTypeId: value.attr.documentTypeId, - DocumentTitle: value.data.title - }; - - var alreadyAdded = false; - - for (var i = 0; i < nodeList.length ; i++) - { - if (nodeList[i].DocumentId == value.attr.documentId) { - alreadyAdded = true; - } - } + replace: false, + controller: function ($scope, $rootScope) { + + $scope.isReadOnly = true; - if (!alreadyAdded) { - nodeList.push(newNode); - } - } - }, - removeSelectedNode: function (value) { - node = value; - if (value.attr.isEndNode) { - for (var i = 0; i < nodeList.length ; i++) { - if (nodeList[i].DocumentId == value.attr.documentId) { - nodeList.splice(i, 1); - - } - } - } - }, - getSelectedNodeList: function () { - return nodeList; - }, - getSelectedNodeListOfIds: function () { - var selectedNodeIds = []; - for (var i = 0; i < nodeList.length; i++) { - selectedNodeIds.push(nodeList[i].DocumentId); - } - return selectedNodeIds; - }, - clearAllSelectedNodes: function () { - nodeList = []; - }, - findSelectedNode: function (value) { - for (var i = 0; i < nodeList.length; i++) { - if (nodeList[i].DocumentId == value) { - return true; + $scope.hover = function () { + NodeTrackingService.setHoveredNode($scope.node); + $rootScope.$broadcast("hoveredNodeChanged"); + }; + + $scope.exitHover = function () { + NodeTrackingService.removeHoveredNode(); + $rootScope.$broadcast("hoveredNodeExit"); + }; + + $scope.clickedStartIndex = 0; + + $scope.openDocument = function (event) { + if (ctrlClicked || shiftClicked) { + event.preventDefault(); + } else { + // Open document navigation in here } } - return false; - }, - getClickedNode: function () { - return clickedNode; - }, - setClickedNode: function (value) { - clickedNode = value; - }, - getHoveredNode: function () { - return hoveredNode; - }, - setHoveredNode: function (value) { - hoveredNode = value; - }, - removeHoveredNode: function () { - hoveredNode = {}; - } - - }; - }); -angular.module('tree.factory', []) - .factory('TreeRecursionHelper', ['$compile', '$rootScope' - , function ($compile, $rootScope) { - var TreeRecursionHelper = { - compile: function (element) { - var factory = {}; - var contents = element.contents().remove(); - var compiledContents; - - factory = function(scope, element) { - - if (!compiledContents) { - compiledContents = $compile(contents); - } + $scope.clickNode = function (event) { + + switch (event.which) { + case 1: + + //left click + if (!(ctrlClicked || shiftClicked)) { + if (!angular.isUndefined($scope.$parent.node)) { + NodeTrackingService.setClickedNodeIndex($scope.$parent.node.children.indexOf($scope.node)); + } + + if (NodeTrackingService.getClickedNodes().indexOf($scope.node) == -1) { + // The node has not been selected so clear down all previous selections + NodeTrackingService.clearClickedNodes(); + NodeTrackingService.addToClickedNodes($scope.node); + NodeTrackingService.setClickedNode($scope.node); + } + } + + if (ctrlClicked) { + event.preventDefault(); - /*Add drag and drop*/ - if (scope.node.attr.isEndNode) { + var previousNode = NodeTrackingService.getClickedNode(); + NodeTrackingService.setSelectedNode(previousNode); + NodeTrackingService.addToClickedNodes(previousNode); - var widget = "
" + scope.node.data.title + "
"; + var clickedNodes = NodeTrackingService.getClickedNodes(); + var newSelectedState = 1; - element.draggable({ - snap: true, - revert: 'revert', - appendTo: 'body', - cursor: "move", - cursorAt: { top: 5, left: -10 }, - helper: function (event) { - return $(widget); + // Check that they are all selected + for (var j = 0; j < clickedNodes.length; j++) { + NodeTrackingService.setSelectedNode($scope.node); + NodesHelper.selectChildNodeItterator(clickedNodes[j], newSelectedState); } - }); - - } - else { - element.droppable({ - hoverClass: 'tf_dropBox_hover', - greedy: true, - drop: function(event, ui) { - - nodeScope = angular.element(ui.draggable).scope() - nodeParentScope = nodeScope.$parent; + if (clickedNodes.indexOf($scope.node) == -1) { + NodeTrackingService.addToClickedNodes($scope.node); + NodeTrackingService.setSelectedNode($scope.node); + newSelectedState = 1; + } else { + NodeTrackingService.removeClickedNode($scope.node); + NodeTrackingService.removeSelectedNode($scope.node); + newSelectedState = 0; + } + + // Select all children + NodesHelper.selectChildNodeItterator($scope.node, newSelectedState); - if (!(angular.isUndefined(nodeParentScope) - && angular.isUndefined(nodeParentScope.node) - && angular.isUndefined(nodeParentScope.node.children) - && angular.isUndefined(nodeScope.$index) - )) { + // Emits the select to all parents in scope + $scope.$emit("SelectNodeParents", newSelectedState); - // Remove the old node - nodeParentScope.node.children.splice(nodeScope.$index, 1); - // Add the new node - scope.node.children.push(nodeScope.child); + } + + if (shiftClicked) { - // Save the changes to the scope - scope.$apply(); + event.preventDefault(); - } + var startIndex = NodeTrackingService.getClickedNodeIndex();; + var endIndex = $scope.$parent.node.children.indexOf($scope.node); + var beginIndex = startIndex; + var toIndex = endIndex; + + if (startIndex > endIndex) { + beginIndex = endIndex; + toIndex = startIndex; } - }); - } - compiledContents(scope, function(clone) { - element.append(clone); - }); + NodeTrackingService.clearClickedNodes(); - }; - return factory; - } - }; - return TreeRecursionHelper; - } - ]) - .factory('NodesHelper', function (NodeTrackingService) { - var NodesHelper = { - refreshSelectOrDeselectedBasedOnNodeTrackingService: function (currentNode) { - if (currentNode != null) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - if (child.attr.isEndNode && NodeTrackingService.findSelectedNode(child.attr.documentId)) { - child.attr.selected = true; - } - if (child.children) { - // go to the folders children and select - NodesHelper.refreshSelectOrDeselectedBasedOnNodeTrackingService(child); - } - }; - } - NodesHelper.findChildNodeAndSetStateOfParentsItterator(currentNode); - } - }, - refreshExpandedNodesBasedOnNodeTrackingService: function (currentNode) { - if (currentNode != null) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - - if (!child.attr.isEndNode && NodeTrackingService.findExpandedNode(child.attr.documentGroupId)) { - child.attr.expanded = true; - } - if (child.children) { - // go to the folders children and select - NodesHelper.refreshExpandedNodesBasedOnNodeTrackingService(child); - } - }; - } - } - }, - findChildNodesAndSelectOrDeselect: function (currentNode, documentIdToFind, newValue) { - - if (currentNode != null) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - // We have a folder - - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - if (child.attr.isEndNode) { - if (child.attr.documentId == documentIdToFind) { - child.attr.selected = newValue; - if (newValue == 1) { - NodeTrackingService.setSelectedNode(child); - } - if (newValue == 0) { - NodeTrackingService.removeSelectedNode(child); - } + for (var i = beginIndex; i <= toIndex; i++) { + NodeTrackingService.setSelectedNode($scope.$parent.node.children[i]); + NodeTrackingService.addToClickedNodes($scope.$parent.node.children[i]); } - } else { - if (child.children) { - // go to the folders children and select - NodesHelper.findChildNodesAndSelectOrDeselect(child, documentIdToFind, newValue); + + NodesHelper.refreshSelectOrDeselectedBasedOnNodeTrackingService($scope.$parent.node, false); + + } + + + break; + case 2: + break; + case 3: + // Check to see if the rightclicked item is in the selected list of items + var clickedNodes = NodeTrackingService.getClickedNodes(); + var clickedInCurrentSelection = false; + var clickedNode = $scope.node; + for (var i = 0; i < clickedNodes.length; i++) { + var node = clickedNodes[i]; + if (node === clickedNode) { + clickedInCurrentSelection = true; } } - - }; + if (clickedInCurrentSelection) { + NodeTrackingService.setClickedNode($scope.node); + } else { + // remove all previous selections and add just this one + NodeTrackingService.clearClickedNodes(); + NodeTrackingService.addToClickedNodes($scope.node); + NodeTrackingService.setSelectedNode($scope.node); + NodeTrackingService.setClickedNode($scope.node); + } + break; } } - }, - findChildNodeAndSetStateOfParentsItterator: function (currentNode) { - if (currentNode != null) { - - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - // We have a folder - var selectedChildCount = 0; - var partiallySelectedCount = 0; - - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - NodesHelper.findChildNodeAndSetStateOfParentsItterator(child); - if (child.attr.selected == 1) { selectedChildCount = selectedChildCount + 1; } - if (child.attr.selected == 2) { partiallySelectedCount = partiallySelectedCount + 1; } - } - // Partially Selected - if (selectedChildCount > 0 || partiallySelectedCount > 0) { - newValue = 2; - } - - // All Children Selected - if (selectedChildCount == currentNode.children.length) { - if (selectedChildCount == 1) { - newValue = currentNode.children[0].attr.selected; - } else { - newValue = 1; - } + $scope.isClickedNode = function () { + return NodeTrackingService.isClickedNode($scope.node); + }; + + $scope.$on('CreateFolder', function () { + if ($scope.type == "Folder") { + if (NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + $scope.createFolder(); } - - // No children selected - if (selectedChildCount == 0 && partiallySelectedCount == 0) { - newValue = 0; + } + }); + + $scope.$on('RenameFolder', function () { + if ($scope.type == "Folder") { + if (!angular.isUndefined(NodeTrackingService.getClickedNode().attr) && NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + $scope.setIsReadOnly(false); } - currentNode.attr.selected = newValue; } - } - }, - selectParentsChildNodeItterator: function (currentNode, newValue) { - - if (currentNode != null) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - // We have a folder - var selectedChildCount = 0; - var partiallySelectedCount = 0; - - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - if (child.attr.selected == 1) { selectedChildCount = selectedChildCount + 1; } - if (child.attr.selected == 2) { partiallySelectedCount = partiallySelectedCount + 1; } + }); + + $scope.$on('CutFolder', function () { + if ($scope.type == "Folder") { + if (!angular.isUndefined(NodeTrackingService.getClickedNode().attr) && NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + $scope.cut(); } + } + }); - // Partially Selected - if (selectedChildCount > 0 || partiallySelectedCount > 0) { - newValue = 2; + $scope.$on('CopyFolder', function () { + if ($scope.type == "Folder") { + if (!angular.isUndefined(NodeTrackingService.getClickedNode().attr) && NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + $scope.copy(); } + } + }); - // No children selected - if (selectedChildCount == 0 && partiallySelectedCount == 0) { - newValue = 0; + $scope.$on('PasteFolder', function () { + if ($scope.type == "Folder") { + if (!angular.isUndefined(NodeTrackingService.getClickedNode().attr) && NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + $scope.paste(); } + } + }); - // All Children Selected - if (selectedChildCount == currentNode.children.length) { - if (selectedChildCount == 1) { - newValue = currentNode.children[0].attr.selected; - } - else { - newValue = 1; - } + $scope.$on('DeleteFolder', function () { + if ($scope.type == "Folder") { + if (!angular.isUndefined(NodeTrackingService.getClickedNode().attr) && NodeTrackingService.getClickedNode().attr.documentGroupId == $scope.node.attr.documentGroupId && !$scope.node.attr.isEndNode) { + + $scope.deleteFolders(); } } - currentNode.attr.selected = newValue; + }); + + $scope.customise = function () { + //Customise / Edit API call here } - }, - selectChildNodeItterator: function (currentNode, newValue) { - if (currentNode != null) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - // We have a folder - - for (var i = 0; i < currentNode.children.length; i++) { - var child = currentNode.children[i]; - - if (child.attr.show) { - child.attr.selected = newValue; - if (newValue == 1) { - NodeTrackingService.setSelectedNode(child); - } - if (newValue == 0) { - NodeTrackingService.removeSelectedNode(child); - } - } - if (child.children) { - // go to the folders children and select - NodesHelper.selectChildNodeItterator(child, newValue); - } - };//); - } - if (currentNode.attr.show) { - currentNode.attr.selected = newValue; - } + $scope.setIsReadOnly = function (isReadOnly) { + $scope.isReadOnly = isReadOnly; } - }, - showParentsNodeItterator: function (currentNode) { - if (currentNode != null && !currentNode.attr.isEndNode) { - // We need to go over all of the parents direct child items to work out if this node should be selected or not - if (currentNode.children) { - // We have a folder - var hiddenChildCount = 0; - for (var i = 0; i < currentNode.children.length; i++) { - if (!currentNode.children[i].attr.show) { hiddenChildCount = hiddenChildCount + 1 } - }; - - if (hiddenChildCount == currentNode.children.length) { - currentNode.attr.show = false; - } - else { - currentNode.attr.show = true; - } - } - else { - currentNode.attr.show = true; - } + + $scope.renameNode = function () { + $scope.isReadOnly = true; + // Remane API Call in here + }; + + $scope.cut = function () { + NodeTrackingService.setIsCutOperation(true); + NodeTrackingService.setCutNodes(); + NodeTrackingService.clearClickedNodes(); } - } - }; + $scope.copy = function () { + NodeTrackingService.setIsCutOperation(false); + NodeTrackingService.setCopiedNodes(); + NodeTrackingService.clearClickedNodes(); + } - return NodesHelper; - }); -angular.module('tree.directive', []) - .directive('tree', function ($compile, NodesHelper, NodeTrackingService, TreeRecursionHelper) { - return { - restrict: "A", - scope: { - node: '=' - }, - replace: false, - controller: function ($scope, $rootScope, $location) { + $scope.paste = function () { + // Paste api call in here + } - $scope.hover = function () { - NodeTrackingService.setHoveredNode($scope.node); - $scope.$emit("hoveredNodeChanged"); - }; + $scope.deleteFolders = function () { + // Delete api call in here + } + + $scope.createFolder = function () { + + //Create API call in here - $scope.exitHover = function () { - NodeTrackingService.removeHoveredNode(); - $scope.$emit("hoveredNodeChanged"); }; - $scope.countVisibleChildren = function () { + // Work out the scopes + $scope.numberOfVisibleChildren = function () { var numberOfVisibleChildren = 0; - for (var i = 0; i < $scope.node.children.length; i++) { - var child = $scope.node.children[i]; - if (child.attr.show) { - numberOfVisibleChildren = numberOfVisibleChildren + 1; + if ($scope.node.children) { + for (var i = 0; i < $scope.node.children.length; i++) { + var child = $scope.node.children[i]; + if (child.attr.show) { + numberOfVisibleChildren = numberOfVisibleChildren + 1; + } } } return numberOfVisibleChildren; - }; + } + $scope.$on('SelectNodeParents', function (node, value) { NodesHelper.selectParentsChildNodeItterator($scope.node, value); @@ -429,6 +272,7 @@ angular.module('tree.directive', []) $event.preventDefault(); var currentSelectedState = $scope.node.attr.selected; var newSelectedState = 0; + if (currentSelectedState == 0) { newSelectedState = 1; } @@ -440,7 +284,7 @@ angular.module('tree.directive', []) } $scope.node.attr.selected = newSelectedState; - + if (newSelectedState == 1) { NodeTrackingService.setSelectedNode($scope.node); } @@ -451,8 +295,6 @@ angular.module('tree.directive', []) // Select all children NodesHelper.selectChildNodeItterator($scope.node, newSelectedState); - $scope.$emit("SaveSelectedNodes", newSelectedState); - // Emits the select to all parents in scope $scope.$emit("SelectNodeParents", newSelectedState); @@ -460,47 +302,39 @@ angular.module('tree.directive', []) }, - template: - '
' + - '' + - '' + + template: '' + + + '
' + + '' + + '' + '' + '' + '' + ' ' + - '{{ node.data.title }}' + + '' + '' + - '' + - '' + - '' + + + '' + + '' + + '' + + '' + + '' + '' + '' + '' + '' + - '' + + '' + + '' + + '' + + '' + '' + '
' + - '
' + - '' + + '
' + '
    ' + '
  • ' + '
      ' + - '
    • ' + - '
    • ' + + '
    • ' + '
    ' + '
    • ' + '
' + @@ -510,3 +344,4 @@ angular.module('tree.directive', []) } }; }); +