Added configuration to the multinode picker
This commit is contained in:
perploug
@@ -1,29 +1,5 @@
|
||||
{
|
||||
propertyEditors: [
|
||||
{
|
||||
alias: "MyPackage.MNTP",
|
||||
name: "Multinode treepicker",
|
||||
editor: {
|
||||
view: "~/App_Plugins/propertyeditors/mntp/mntp.html"
|
||||
},
|
||||
|
||||
prevalues: {
|
||||
fields: [
|
||||
{
|
||||
label: "Multipicker",
|
||||
key: "multi",
|
||||
view: "boolean"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
alias: "MyPackage.RelatedLinks",
|
||||
name: "Related links",
|
||||
editor: {
|
||||
view: "~/App_Plugins/propertyeditors/relatedlinks/relatedlinks.html"
|
||||
}
|
||||
},
|
||||
{
|
||||
alias: "MyPackage.Boolean",
|
||||
name: "Boolean",
|
||||
|
||||
@@ -1,28 +1,81 @@
|
||||
//used for the media picker dialog
|
||||
angular.module("umbraco").controller("Umbraco.Dialogs.TreePickerController",
|
||||
function ($scope, eventsService, $log) {
|
||||
function ($scope, entityResource, eventsService, $log, searchService) {
|
||||
var dialogOptions = $scope.$parent.dialogOptions;
|
||||
$scope.dialogTreeEventHandler = $({});
|
||||
$scope.section = dialogOptions.section;
|
||||
$scope.treeAlias = dialogOptions.treeAlias;
|
||||
|
||||
//search defaults
|
||||
$scope.searcher = searchService.searchContent;
|
||||
$scope.entityType ="Document";
|
||||
$scope.results = [];
|
||||
|
||||
if(dialogOptions.treeAlias === "member"){
|
||||
$scope.searcher = searchService.searchMembers;
|
||||
$scope.entityType = "Member";
|
||||
}else if(dialogOptions.treeAlias === "media"){
|
||||
$scope.searcher = searchService.searchMedia;
|
||||
$scope.entityType = "Media";
|
||||
}
|
||||
|
||||
function select(id){
|
||||
entityResource.getById(id, $scope.entityType).then(function(ent){
|
||||
if(dialogOptions && dialogOptions.multiPicker){
|
||||
|
||||
$scope.showSearch = false;
|
||||
$scope.results = [];
|
||||
$scope.term = "";
|
||||
$scope.oldTerm = undefined;
|
||||
|
||||
$scope.select(ent);
|
||||
}else{
|
||||
$scope.submit(ent);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$scope.selectResult = function(result){
|
||||
select(result.id);
|
||||
};
|
||||
|
||||
$scope.performSearch = function(){
|
||||
if($scope.term){
|
||||
if($scope.oldTerm !== $scope.term){
|
||||
$scope.results = [];
|
||||
|
||||
$scope.searcher.call(null, {term: $scope.term, results: $scope.results});
|
||||
|
||||
$scope.showSearch = true;
|
||||
$scope.oldTerm = $scope.term;
|
||||
}
|
||||
}else{
|
||||
$scope.oldTerm = "";
|
||||
$scope.showSearch = false;
|
||||
$scope.results = [];
|
||||
}
|
||||
};
|
||||
|
||||
$scope.dialogTreeEventHandler.bind("treeNodeSelect", function(ev, args){
|
||||
args.event.preventDefault();
|
||||
args.event.stopPropagation();
|
||||
|
||||
eventsService.publish("Umbraco.Dialogs.TreePickerController.Select", args).then(function(args){
|
||||
if(dialogOptions && dialogOptions.multipicker){
|
||||
$(args.event.target.parentElement)
|
||||
.find("i.umb-tree-icon")
|
||||
.attr("class", "icon umb-tree-icon sprTree icon-check blue");
|
||||
|
||||
$scope.select(args.node);
|
||||
}else{
|
||||
$scope.submit(args.node);
|
||||
}
|
||||
|
||||
});
|
||||
select(args.node.id);
|
||||
|
||||
if(dialogOptions && dialogOptions.multiPicker){
|
||||
var c = $(args.event.target.parentElement);
|
||||
if(!args.node.selected){
|
||||
args.node.selected = true;
|
||||
c.find("i.umb-tree-icon").hide()
|
||||
.after("<i class='icon umb-tree-icon sprTree icon-check blue temporary'></i>");
|
||||
}else{
|
||||
args.node.selected = false;
|
||||
c.find(".temporary").remove();
|
||||
c.find("i.umb-tree-icon").show();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,7 +1,42 @@
|
||||
<div class="umb-panel" ng-controller="Umbraco.Dialogs.TreePickerController">
|
||||
<div class="umb-panel-body no-header umb-scrollable">
|
||||
<div class="umb-panel-header">
|
||||
<div class="umb-el-wrap umb-panel-buttons">
|
||||
<div class="form-search">
|
||||
<i class="icon-search"></i>
|
||||
<input type="text"
|
||||
ng-model="term"
|
||||
class="umb-search-field search-query"
|
||||
placeholder="Search..."
|
||||
on-keyup="performSearch()">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="umb-panel-body with-footer">
|
||||
<div class="tab-content umb-control-group">
|
||||
<div class="umb-pane">
|
||||
<!-- Search results -->
|
||||
<div ng-show="showSearch">
|
||||
<ul class="umb-tree">
|
||||
<li class="root">
|
||||
<ul class="umb-search-group" ng-repeat="resultGroup in results">
|
||||
<li ng-repeat="result in resultGroup.matches">
|
||||
<div style="padding-left: 20px">
|
||||
<a ng-class="{first:$first}" ng-click="selectResult(result)">
|
||||
<i
|
||||
class="icon umb-tree-icon sprTree {{resultGroup.icon}}"></i>
|
||||
{{result.title}}
|
||||
<small class="search-subtitle" ng-show="result.subTitle">
|
||||
{{result.subTitle}}
|
||||
</small>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div ng-hide="showSearch">
|
||||
<umb-tree
|
||||
section="{{section}}"
|
||||
treealias="{{treeAlias}}"
|
||||
@@ -14,7 +49,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="umb-panel-footer" ng-show="multipicker">
|
||||
<div class="umb-panel-footer" ng-show="multiPicker">
|
||||
<div class="umb-el-wrap umb-panel-buttons">
|
||||
<div class="btn-toolbar umb-btn-toolbar pull-right">
|
||||
<input type="button" ng-click="submit(dialogData)" class="btn btn-primary" value="select" />
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
<select ng-model="model.value">
|
||||
<option value="content">Content</option>
|
||||
<option value="content">Media</option>
|
||||
<option value="member">Members</option>
|
||||
</select>
|
||||
@@ -1 +1 @@
|
||||
<textarea name="textarea" class="umb-editor umb-textarea" ng-model="model.value" rows="4" class=""></textarea>
|
||||
<textarea name="textarea" class="umb-editor umb-textarea" ng-model="model.value" rows="4"></textarea>
|
||||
@@ -0,0 +1 @@
|
||||
<input type="text" ng-model="model.value" class="umb-editor umb-textstring" />
|
||||
@@ -5,11 +5,12 @@ angular.module('umbraco')
|
||||
|
||||
function($scope, dialogService, entityResource, $log, iconHelper){
|
||||
$scope.ids = $scope.model.value.split(',');
|
||||
$scope.renderModel = [];
|
||||
$scope.cfg = {multipicker: false};
|
||||
|
||||
if($scope.config){
|
||||
$scope.cfg = $scope.config;
|
||||
$scope.renderModel = [];
|
||||
$scope.cfg = {multipicker: false, type: "content", filter: ""};
|
||||
|
||||
if($scope.model.config){
|
||||
$scope.cfg = $scope.model.config;
|
||||
}
|
||||
|
||||
entityResource.getByIds($scope.ids, "Document").then(function(data){
|
||||
@@ -20,7 +21,13 @@ angular.module('umbraco')
|
||||
});
|
||||
|
||||
$scope.openContentPicker =function(){
|
||||
var d = dialogService.contentPicker({scope: $scope, multipicker: $scope.cfg.multipicker, callback: populate});
|
||||
var d = dialogService.treePicker({
|
||||
section: $scope.cfg.type,
|
||||
treeAlias: $scope.cfg.type,
|
||||
scope: $scope,
|
||||
multiPicker: $scope.cfg.multiPicker,
|
||||
filter: $scope.cfg.filter,
|
||||
callback: populate});
|
||||
};
|
||||
|
||||
$scope.remove =function(index){
|
||||
|
||||
Reference in New Issue
Block a user