use new umb node preview component in content picker

This commit is contained in:
Mads Rasmussen
2017-01-13 11:16:15 +01:00
parent 0c709d144b
commit 8e79e15c71
2 changed files with 31 additions and 28 deletions

View File

@@ -1,7 +1,7 @@
//this controller simply tells the dialogs service to open a mediaPicker window //this controller simply tells the dialogs service to open a mediaPicker window
//with a specified callback, this callback will receive an object with a selection on it //with a specified callback, this callback will receive an object with a selection on it
function contentPickerController($scope, dialogService, entityResource, editorState, $log, iconHelper, $routeParams, fileManager, contentEditingHelper, angularHelper, navigationService, $location) { function contentPickerController($scope, dialogService, entityResource, editorState, $log, iconHelper, $routeParams, fileManager, contentEditingHelper, angularHelper, navigationService, $location, $timeout, miniEditorHelper) {
function trim(str, chr) { function trim(str, chr) {
var rgxtrim = (!chr) ? new RegExp('^\\s+|\\s+$', 'g') : new RegExp('^' + chr + '+|' + chr + '+$', 'g'); var rgxtrim = (!chr) ? new RegExp('^\\s+|\\s+$', 'g') : new RegExp('^' + chr + '+|' + chr + '+$', 'g');
@@ -77,6 +77,8 @@ function contentPickerController($scope, dialogService, entityResource, editorSt
: "Document"; : "Document";
$scope.allowOpenButton = entityType === "Document" || entityType === "Media"; $scope.allowOpenButton = entityType === "Document" || entityType === "Media";
$scope.allowEditButton = entityType === "Document"; $scope.allowEditButton = entityType === "Document";
$scope.allowRemoveButton = true;
$scope.sortable = true;
//the dialog options for the picker //the dialog options for the picker
var dialogOptions = { var dialogOptions = {
@@ -200,6 +202,10 @@ function contentPickerController($scope, dialogService, entityResource, editorSt
$scope.clear = function () { $scope.clear = function () {
$scope.renderModel = []; $scope.renderModel = [];
}; };
$scope.openMiniEditor = function(node) {
miniEditorHelper.launchMiniEditor(node);
};
var unsubscribe = $scope.$on("formSubmitting", function (ev, args) { var unsubscribe = $scope.$on("formSubmitting", function (ev, args) {
var currIds = _.map($scope.renderModel, function (i) { var currIds = _.map($scope.renderModel, function (i) {

View File

@@ -1,33 +1,30 @@
<div ng-controller="Umbraco.PropertyEditors.ContentPickerController" class="umb-editor umb-contentpicker"> <div ng-controller="Umbraco.PropertyEditors.ContentPickerController" class="umb-editor umb-contentpicker">
<ng-form name="contentPickerForm"> <ng-form name="contentPickerForm">
<ul class="unstyled list-icons" <div ui-sortable ng-model="renderModel">
ui-sortable <umb-node-preview
ng-model="renderModel"> ng-repeat="node in renderModel"
<li ng-repeat="node in renderModel" ng-attr-title="{{model.config.showPathOnHover && 'Path: ' + node.path || undefined}}"> icon="node.icon"
<i class="icon icon-navigation handle"></i> name="node.name"
<a href="#" prevent-default ng-click="remove($index)"> description="node.path"
<i class="icon icon-delete red hover-show"></i> sortable="sortable"
<i class="{{node.icon}} hover-hide"></i> allow-remove="allowRemoveButton"
{{node.name}} allow-open="model.config.showOpenButton && allowOpenButton && !dialogEditor"
</a> allow-edit="model.config.showEditButton && allowEditButton && !dialogEditor"
on-remove="remove($index)"
<div ng-if="!dialogEditor && ((model.config.showOpenButton && allowOpenButton) || (model.config.showEditButton && allowEditButton))"> on-open="showNode($index)"
<small ng-if="model.config.showOpenButton && allowOpenButton"><a href ng-click="showNode($index)"><localize key="open">Open</localize></a></small> on-edit="openMiniEditor(node)">
<small ng-if="model.config.showEditButton && allowEditButton"><a href umb-launch-mini-editor="node"><localize key="edit">Edit</localize></a></small> </umb-node-preview>
</div> </div>
</li>
</ul> <a ng-show="model.config.multiPicker === true || renderModel.length === 0"
class="umb-node-preview-add"
<ul class="unstyled list-icons" ng-show="model.config.multiPicker === true || renderModel.length === 0"> href=""
<li> ng-click="openContentPicker()"
<i class="icon icon-add blue"></i> prevent-default>
<a href="#" ng-click="openContentPicker()" prevent-default> <localize key="general_add">Add</localize>
<localize key="general_add">Add</localize> </a>
</a>
</li>
</ul>
<!--These are here because we need ng-form fields to validate against--> <!--These are here because we need ng-form fields to validate against-->
<input type="hidden" name="minCount" ng-model="renderModel" /> <input type="hidden" name="minCount" ng-model="renderModel" />