Skip to content

Commit

Permalink
Add "Move" option for deleted items in the media tree
Browse files Browse the repository at this point in the history
  • Loading branch information
@nul800sebastiaan
Kenn Jacobsen authored and nul800sebastiaan committed Jan 17, 2019
1 parent 98fe3e8 commit 57b8a18
Show file tree
Hide file tree
Showing 2 changed files with 177 additions and 69 deletions.
129 changes: 92 additions & 37 deletions src/Umbraco.Web.UI.Client/src/views/media/media.restore.controller.js
View file
Original file line number Diff line number Diff line change
@@ -1,26 +1,91 @@
angular.module("umbraco").controller("Umbraco.Editors.Media.RestoreController",
function ($scope, relationResource, mediaResource, navigationService, appState, treeService, localizationService) {
function ($scope, relationResource, mediaResource, entityResource, navigationService, appState, treeService, userService) {

$scope.source = _.clone($scope.currentNode);

$scope.error = null;
$scope.success = false;
$scope.loading = true;
$scope.moving = false;
$scope.success = false;

$scope.dialogTreeApi = {};
$scope.searchInfo = {
showSearch: false,
results: [],
selectedSearchResults: []
}
$scope.treeModel = {
hideHeader: false
}
userService.getCurrentUser().then(function (userData) {
$scope.treeModel.hideHeader = userData.startContentIds.length > 0 && userData.startContentIds.indexOf(-1) == -1;
});

function nodeSelectHandler(args) {

if (args && args.event) {
args.event.preventDefault();
args.event.stopPropagation();
}

if ($scope.target) {
//un-select if there's a current one selected
$scope.target.selected = false;
}

$scope.target = args.node;
$scope.target.selected = true;

}

function nodeExpandedHandler(args) {
// open mini list view for list views
if (args.node.metaData.isContainer) {
openMiniListView(args.node);
}
}

$scope.hideSearch = function () {
$scope.searchInfo.showSearch = false;
$scope.searchInfo.results = [];
}

// method to select a search result
$scope.selectResult = function (evt, result) {
result.selected = result.selected === true ? false : true;
nodeSelectHandler(evt, { event: evt, node: result });
};

//callback when there are search results
$scope.onSearchResults = function (results) {
$scope.searchInfo.results = results;
$scope.searchInfo.showSearch = true;
};

$scope.onTreeInit = function () {
$scope.dialogTreeApi.callbacks.treeNodeSelect(nodeSelectHandler);
$scope.dialogTreeApi.callbacks.treeNodeExpanded(nodeExpandedHandler);
}

// Mini list view
$scope.selectListViewNode = function (node) {
node.selected = node.selected === true ? false : true;
nodeSelectHandler({}, { node: node });
};

$scope.closeMiniListView = function () {
$scope.miniListView = undefined;
};

function openMiniListView(node) {
$scope.miniListView = node;
}

relationResource.getByChildId($scope.source.id, "relateParentDocumentOnDelete").then(function (data) {
$scope.loading = false;

if (!data.length) {
localizationService.localizeMany(["recycleBin_itemCannotBeRestored", "recycleBin_noRestoreRelation"])
.then(function(values) {
$scope.success = false;
$scope.error = {
errorMsg: values[0],
data: {
Message: values[1]
}
}
});
$scope.moving = true;
return;
}

Expand All @@ -30,40 +95,31 @@ angular.module("umbraco").controller("Umbraco.Editors.Media.RestoreController",
$scope.target = { id: -1, name: "Root" };

} else {
$scope.loading = true;
mediaResource.getById($scope.relation.parentId).then(function (data) {
$scope.loading = true;

entityResource.getById($scope.relation.parentId, "media").then(function (data) {
$scope.loading = false;
$scope.target = data;
// make sure the target item isn't in the recycle bin
if ($scope.target.path.indexOf("-21") !== -1) {
localizationService.localizeMany(["recycleBin_itemCannotBeRestored", "recycleBin_restoreUnderRecycled"])
.then(function (values) {
$scope.success = false;
$scope.error = {
errorMsg: values[0],
data: {
Message: values[1].replace('%0%', $scope.target.name)
}
}
});
$scope.success = false;
}
$scope.target = data;

// make sure the target item isn't in the recycle bin
if ($scope.target.path.indexOf("-21") !== -1) {
$scope.moving = true;
$scope.target = null;
}
}, function (err) {
$scope.success = false;
$scope.error = err;
$scope.loading = false;
});
$scope.error = err;
});
}

}, function (err) {
$scope.success = false;
$scope.error = err;
$scope.loading = false;
$scope.error = err;
});

$scope.restore = function () {
$scope.loading = true;
$scope.loading = true;

// this code was copied from `content.move.controller.js`
mediaResource.move({ parentId: $scope.target.id, id: $scope.source.id })
.then(function (path) {
Expand All @@ -89,9 +145,8 @@ angular.module("umbraco").controller("Umbraco.Editors.Media.RestoreController",
});

}, function (err) {
$scope.success = false;
$scope.error = err;
$scope.loading = false;
$scope.error = err;
});
};

Expand Down
117 changes: 85 additions & 32 deletions src/Umbraco.Web.UI.Client/src/views/media/restore.html
View file
Original file line number Diff line number Diff line change
@@ -1,34 +1,87 @@
<div ng-controller="Umbraco.Editors.Media.RestoreController">
<div class="umb-dialog-body">
<umb-pane>

<umb-load-indicator
ng-show="loading">
</umb-load-indicator>

<p class="abstract" ng-hide="loading || error != null || success">
<localize key="actions_restore">Restore</localize> <strong>{{source.name}}</strong> <localize key="general_under">under</localize> <strong>{{target.name}}</strong>?
</p>

<div ng-show="error">
<div class="alert alert-error">
<div><strong>{{error.errorMsg}}</strong></div>
<div>{{error.data.Message}}</div>
</div>
</div>

<div ng-show="success">
<div class="alert alert-success">
<strong>{{source.name}}</strong> <localize key="editdatatype_wasMoved">was moved underneath</localize> <strong>{{target.name}}</strong>
</div>
<button class="btn btn-primary" ng-click="close()"><localize key="general_ok">Ok</localize></button>
</div>

</umb-pane>
</div>

<div class="umb-dialog-footer btn-toolbar umb-btn-toolbar" ng-hide="loading || success">
<a class="btn btn-link" ng-click="close()"><localize key="general_cancel">Cancel</localize></a>
<button class="btn btn-primary" ng-click="restore()" ng-show="error == null"><localize key="actions_restore">Restore</localize></button>
</div>
<div class="umb-dialog-body">
<umb-pane>
<umb-load-indicator ng-show="loading">
</umb-load-indicator>

<div ng-show="error">
<div class="alert alert-error">
<div><strong>{{error.errorMsg}}</strong></div>
<div>{{error.data.Message}}</div>
</div>
</div>

<div ng-show="success">
<div class="alert alert-success">
<strong>{{source.name}}</strong>
<span ng-hide="moving"><localize key="recycleBin_wasRestored">was restored under</localize></span>
<span ng-show="moving"><localize key="editdatatype_wasMoved">was moved underneath</localize></span>
<strong>{{target.name}}</strong>
</div>
<button class="btn btn-primary" ng-click="close()">Ok</button>
</div>

<div ng-hide="moving || loading || success">

<p class="abstract" ng-hide="error || success">
<localize key="actions_restore">Restore</localize> <strong>{{source.name}}</strong> <localize key="general_under">under</localize> <strong>{{target.name}}</strong>?
</p>

</div>

<div ng-hide="!moving || loading || success">
<div>
<div class="alert alert-info">
<div><strong><localize key="recycleBin_itemCannotBeRestored">Cannot automatically restore this item</localize></strong></div>
<div><localize key="recycleBin_itemCannotBeRestoredHelpText">There is no location where this item can be automatically restored. You can move the item manually using the tree below.</localize></div>
</div>
</div>

<div ng-hide="miniListView">
<umb-tree-search-box hide-search-callback="hideSearch"
search-callback="onSearchResults"
show-search="{{searchInfo.showSearch}}"
section="media">
</umb-tree-search-box>

<br />

<umb-tree-search-results ng-if="searchInfo.showSearch"
results="searchInfo.results"
select-result-callback="selectResult">
</umb-tree-search-results>

<div ng-hide="searchInfo.showSearch">
<umb-tree section="media"
hideheader="{{treeModel.hideHeader}}"
hideoptions="true"
isdialog="true"
api="dialogTreeApi"
on-init="onTreeInit()"
enablelistviewexpand="true"
enablecheckboxes="true">
</umb-tree>
</div>
</div>

<umb-mini-list-view ng-if="miniListView"
node="miniListView"
entity-type="Document"
on-select="selectListViewNode(node)"
on-close="closeMiniListView()">
</umb-mini-list-view>

</div>
</umb-pane>
</div>

<div class="umb-dialog-footer btn-toolbar umb-btn-toolbar" ng-hide="loading || moving || success">
<a class="btn btn-link" ng-click="close()"><localize key="general_cancel">Cancel</localize></a>
<button class="btn btn-primary" ng-click="restore()" ng-show="error == null"><localize key="actions_restore">Restore</localize></button>
</div>

<div class="umb-dialog-footer btn-toolbar umb-btn-toolbar" ng-hide="loading || !moving || success">
<a class="btn btn-link" ng-click="close()"><localize key="general_cancel">Cancel</localize></a>
<button class="btn btn-primary" ng-click="restore()" ng-show="error == null" ng-disabled="!target"><localize key="actions_move">Move</localize></button>
</div>
</div>

0 comments on commit 57b8a18

Please sign in to comment.