From 8b5eefafdba6b13bb0c310e62e890745ce828d7d Mon Sep 17 00:00:00 2001 From: Tim Geyssens Date: Wed, 30 Oct 2013 13:33:55 +0100 Subject: [PATCH] Some more member group picker WIP --- .../src/common/services/dialog.service.js | 19 ++++ .../dialogs/membergrouppicker.controller.js | 88 +++++++++++++++++++ .../common/dialogs/membergrouppicker.html | 69 +++++++++++++++ .../membergrouppicker.controller.js | 6 +- .../membergrouppicker/membergrouppicker.html | 4 +- 5 files changed, 181 insertions(+), 5 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.html diff --git a/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js b/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js index 842f6ff7c3..c937d30ae7 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js @@ -373,6 +373,25 @@ angular.module('umbraco.services') options.show = true; return openDialog(options); }, + + /** + * @ngdoc method + * @name umbraco.services.dialogService#memberGroupPicker + * @methodOf umbraco.services.dialogService + * + * @description + * Opens a member group picker in a modal, the callback returns a object representing the selected member + * @param {Object} options member group picker dialog options object + * @param {$scope} options.scope dialog scope + * @param {$scope} options.multiPicker should the tree pick one or multiple members before returning + * @param {Function} options.callback callback function + * @returns {Object} modal object + */ + memberGroupPicker: function (options) { + options.template = 'views/common/dialogs/memberGroupPicker.html'; + options.show = true; + return openDialog(options); + }, /** * @ngdoc method diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.controller.js new file mode 100644 index 0000000000..40d5e1d7bb --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.controller.js @@ -0,0 +1,88 @@ +//used for the member picker dialog +angular.module("umbraco").controller("Umbraco.Dialogs.MemberGroupPickerController", + function($scope, eventsService, entityResource, searchService, $log) { + var dialogOptions = $scope.$parent.dialogOptions; + $scope.dialogTreeEventHandler = $({}); + $scope.results = []; + + /** Method used for selecting a node */ + function select(text, id, entity) { + + $scope.showSearch = false; + $scope.results = []; + $scope.term = ""; + $scope.oldTerm = undefined; + + if (dialogOptions.multiPicker) { + $scope.select(id); + } + else { + //if an entity has been passed in, use it + if (entity) { + $scope.submit(entity); + } + else { + //otherwise we have to get it from the server + entityResource.getById(id, "Member").then(function (ent) { + $scope.submit(ent); + }); + } + } + } + + $scope.performSearch = function() { + if ($scope.term) { + if ($scope.oldTerm !== $scope.term) { + $scope.results = []; + searchService.searchMembers({ term: $scope.term }).then(function(data) { + $scope.results = data; + }); + $scope.showSearch = true; + $scope.oldTerm = $scope.term; + } + } + else { + $scope.oldTerm = ""; + $scope.showSearch = false; + $scope.results = []; + } + }; + + /** method to select a search result */ + $scope.selectResult = function(result) { + //since result = an entity, we'll pass it in so we don't have to go back to the server + select(result.name, result.id, result); + }; + + $scope.dialogTreeEventHandler.bind("treeNodeSelect", function(ev, args) { + args.event.preventDefault(); + args.event.stopPropagation(); + + if (args.node.nodeType === "member-folder") { + return; + } + + eventsService.publish("Umbraco.Dialogs.MemberPickerController.Select", args).then(function(a) { + + //This is a tree node, so we don't have an entity to pass in, it will need to be looked up + //from the server in this method. + select(a.node.name, a.node.id); + + if (dialogOptions && dialogOptions.multipicker) { + + var c = $(a.event.target.parentElement); + if (!a.node.selected) { + a.node.selected = true; + c.find("i.umb-tree-icon").hide() + .after(""); + } + else { + a.node.selected = false; + c.find(".temporary").remove(); + c.find("i.umb-tree-icon").show(); + } + } + }); + + }); + }); \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.html new file mode 100644 index 0000000000..315a1a2673 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.html @@ -0,0 +1,69 @@ +
+
+
+ +
+
+ + + +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.controller.js index a44e5c3385..a9cb3154f2 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.controller.js @@ -1,7 +1,7 @@ //this controller simply tells the dialogs service to open a memberPicker window //with a specified callback, this callback will receive an object with a selection on it angular.module('umbraco') -.controller("Umbraco.PropertyEditors.MemberPickerController", +.controller("Umbraco.PropertyEditors.MemberGroupPickerController", function($scope, dialogService, entityResource, $log, iconHelper){ $scope.renderModel = []; @@ -25,8 +25,8 @@ angular.module('umbraco') }); }); - $scope.openMemberPicker =function(){ - var d = dialogService.memberPicker( + $scope.openMemberGroupPicker =function(){ + var d = dialogService.memberGroupPicker( { scope: $scope, multiPicker: $scope.cfg.multiPicker, diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.html index b943145776..60b90c9c62 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.html +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/membergrouppicker/membergrouppicker.html @@ -1,4 +1,4 @@ -
+