yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #3108 from umbraco/temp8-3094-save-button

Browse Source 
Temp8 3094 save button
This commit is contained in:
Claus
2018-10-02 15:14:58 +02:00
committed by GitHub
parent ba295ddcf7 facaba2ed2
commit 9cbb7f1d4a
9 changed files with 140 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/Umbraco.Web.UI.Client/src/common/directives/components/content/edit.controller.js
View File

@@ -157,10 +157,19 @@
if(app && app.alias !== "umbContent" && app.alias !== "umbInfo") {
$scope.defaultButton = null;
$scope.subButtons = null;
$scope.page.showSaveButton = false;
$scope.page.showPreviewButton = false;
return;
}
// create the save button
if(_.contains($scope.content.allowedActions, "A")) {
$scope.page.showSaveButton = true;
// add ellipsis to the save button if it opens the variant overlay
$scope.page.saveButtonEllipsis = content.variants && content.variants.length > 1 ? "true" : "false";
}
// create the pubish combo button
$scope.page.buttonGroupState = "init";
var buttons = contentEditingHelper.configureContentEditorButtons({
create: $scope.page.isNew,
@@ -168,7 +177,6 @@
methods: {
saveAndPublish: $scope.saveAndPublish,
sendToPublish: $scope.sendToPublish,
save: $scope.save,
unPublish: $scope.unPublish
}
});
@@ -225,9 +233,7 @@
// This is a helper method to reduce the amount of code repitition for actions: Save, Publish, SendToPublish
function performSave(args) {
$scope.page.buttonGroupState = "busy";
eventsService.emit("content.saving", { content: $scope.content, action: args.action });
return contentEditingHelper.contentEditorPerformSave({
@@ -242,8 +248,6 @@
syncTreeNode($scope.content, data.path);
$scope.page.buttonGroupState = "success";
eventsService.emit("content.saved", { content: $scope.content, action: args.action });
return $q.when(data);
@@ -257,8 +261,6 @@
editorState.set($scope.content);
}
$scope.page.buttonGroupState = "error";
return $q.reject(err);
});
}
@@ -405,13 +407,20 @@
}
}
else {
return performSave({ saveMethod: contentResource.sendToPublish, action: "sendToPublish" });
$scope.page.buttonGroupState = "busy";
return performSave({
saveMethod: contentResource.sendToPublish,
action: "sendToPublish"
}).then(function(){
$scope.page.buttonGroupState = "success";
}, function () {
$scope.page.buttonGroupState = "error";
});;
}
};
$scope.saveAndPublish = function () {
clearNotifications($scope.content);
// TODO: Add "..." to publish button label if there are more than one variant to publish - currently it just adds the elipses if there's more than 1 variant
if (showSaveOrPublishDialog()) {
//before we launch the dialog we want to execute all client side validations first
if (formHelper.submitForm({ scope: $scope, action: "publish" })) {
@@ -457,7 +466,15 @@
else {
//ensure the publish flag is set
$scope.content.variants[0].publish = true;
return performSave({ saveMethod: contentResource.publish, action: "publish" });
$scope.page.buttonGroupState = "busy";
return performSave({
saveMethod: contentResource.publish,
action: "publish"
}).then(function(){
$scope.page.buttonGroupState = "success";
}, function () {
$scope.page.buttonGroupState = "error";
});;
}
};
@@ -488,15 +505,14 @@
clearNotifications($scope.content);
overlayService.close();
return $q.when(data);
},
function (err) {
clearDirtyState($scope.content.variants);
model.submitButtonState = "error";
//re-map the dialog model since we've re-bound the properties
dialog.variants = $scope.content.variants;
//don't reject, we've handled the error
return $q.when(err);
});
}, function (err) {
clearDirtyState($scope.content.variants);
model.submitButtonState = "error";
//re-map the dialog model since we've re-bound the properties
dialog.variants = $scope.content.variants;
//don't reject, we've handled the error
return $q.when(err);
});
},
close: function (oldModel) {
overlayService.close();
@@ -507,7 +523,15 @@
}
}
else {
return performSave({ saveMethod: $scope.saveMethod(), action: "save" });
$scope.page.saveButtonState = "busy";
return performSave({
saveMethod: $scope.saveMethod(),
action: "save"
}).then(function(){
$scope.page.saveButtonState = "success";
}, function () {
$scope.page.saveButtonState = "error";
});
}
};

17
src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js
View File

@@ -146,7 +146,7 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
if (!args.methods) {
throw "args.methods is not defined";
}
if (!args.methods.saveAndPublish || !args.methods.sendToPublish || !args.methods.save || !args.methods.unPublish) {
if (!args.methods.saveAndPublish || !args.methods.sendToPublish || !args.methods.unPublish) {
throw "args.methods does not contain all required defined methods";
}
@@ -179,17 +179,6 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
alias: "sendToPublish",
addEllipsis: args.content.variants && args.content.variants.length > 1 ? "true" : "false"
};
case "A":
//save
return {
letter: ch,
labelKey: "buttons_save",
handler: args.methods.save,
hotKey: "ctrl+s",
hotKeyWhenHidden: true,
alias: "save",
addEllipsis: args.content.variants && args.content.variants.length > 1 ? "true" : "false"
};
case "Z":
//unpublish
return {
@@ -209,8 +198,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
buttons.subButtons = [];
//This is the ideal button order but depends on circumstance, we'll use this array to create the button list
// Publish, SendToPublish, Save
var buttonOrder = ["U", "H", "A"];
// Publish, SendToPublish
var buttonOrder = ["U", "H"];
//Create the first button (primary button)
//We cannot have the Save or SaveAndPublish buttons if they don't have create permissions when we are creating a new item.

18
src/Umbraco.Web.UI.Client/src/less/buttons.less
View File

@@ -227,13 +227,29 @@ input[type="button"] {
font-size: 16px;
border: none;
background: @green;
color: white;
color: @white;
font-weight: bold;
&:hover {
background: @green-d1;
}
}
// outlined
.btn-outline {
border: 1px solid @gray-8;
background: @white;
color: @black;
padding: 5px 13px;
}
.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active {
border-color: @gray-7;
background: transparent;
color: @black;
}
// Cross-browser Jank
// --------------------------------------------------

2
src/Umbraco.Web.UI.Client/src/less/components/application/umb-dashboard.less
View File

@@ -20,7 +20,7 @@
}
.umb-dashboard__content {
padding: 30px 20px;
padding: 20px;
overflow: auto;
}

7
src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-group.less
View File

@@ -16,12 +16,15 @@
.umb-button-group {
.umb-button__button {
border-radius: 3px 0px 0px 3px;
border-radius: @baseBorderRadius;
}
.umb-button-group__toggle {
border-radius: 0px 3px 3px 0;
border-radius: 0px @baseBorderRadius @baseBorderRadius 0;
border-left: 1px solid rgba(0,0,0,0.09);
margin-left: -2px;
padding-left: 10px;
padding-right: 10px;
}
}

2
src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less
View File

@@ -4,7 +4,7 @@
background: @gray-10;
display: flex;
justify-content: space-between;
margin-top: -20px;
margin-top: -10px;
position: relative;
top: 0;

17
src/Umbraco.Web.UI.Client/src/views/components/content/edit.html
View File

@@ -39,12 +39,23 @@
<umb-button
alias="preview"
ng-if="!page.isNew && content.allowPreview && page.showPreviewButton"
type="button"
button-style="info"
type="button"
button-style="outline"
action="preview(content)"
label="Preview page"
label-key="buttons_showPage">
</umb-button>
<umb-button
ng-if="page.showSaveButton"
alias="save"
type="button"
button-style="info"
state="page.saveButtonState"
action="save(content)"
label-key="buttons_save"
shortcut="ctrl+s"
add-ellipsis="{{page.saveButtonEllipsis}}">
</umb-button>
<umb-button-group
ng-if="defaultButton && !content.trashed && !infiniteModel.infiniteMode"

11
src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
View File

@@ -5,23 +5,26 @@
<umb-editor-sub-header-content-right>
<umb-button
style="margin-right: 5px;"
alias="compositions"
ng-if="compositions !== false"
type="button"
button-style="link"
button-style="outline"
label-key="contentTypeEditor_compositions"
icon="icon-merge"
action="openCompositionsDialog()">
action="openCompositionsDialog()"
size="xs">
</umb-button>
<umb-button
alias="reorder"
ng-if="sorting !== false"
type="button"
button-style="link"
button-style="outline"
label-key="{{sortingButtonKey}}"
icon="icon-navigation"
action="toggleSortingMode();">
action="toggleSortingMode();"
size="xs">
</umb-button>
</umb-editor-sub-header-content-right>

90
src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
View File

@@ -48,8 +48,8 @@
<umb-editor-sub-header-section>
<umb-button
type="button"
label="Clear selection"
size="xs"
button-style="outline"
label-key="buttons_clearSelection"
action="vm.clearSelection()"
disabled="actionInProgress">
@@ -62,48 +62,52 @@
</umb-editor-sub-header-content-left>
<umb-editor-sub-header-content-right ng-if="vm.selection.length > 0">
<div style="margin-right: 5px;">
<umb-button
ng-if="vm.allowSetUserGroup"
type="button" size="xs"
label-key="actions_setGroup"
icon="icon-users"
action="vm.openBulkUserGroupPicker()">
</umb-button>
</div>
<div style="margin-right: 5px;">
<umb-button
ng-if="vm.allowEnableUser"
type="button"
size="xs"
state="vm.enableUserButtonState"
label-key="actions_enable"
icon="icon-check"
action="vm.enableUsers()">
</umb-button>
</div>
<div style="margin-right: 5px;">
<umb-button
ng-if="vm.allowUnlockUser"
type="button"
size="xs"
state="vm.unlockUserButtonState"
label-key="actions_unlock"
icon="icon-unlocked"
action="vm.unlockUsers()">
</umb-button>
</div>
<div>
<umb-button
ng-if="vm.allowDisableUser"
type="button"
size="xs"
state="vm.disableUserButtonState"
label-key="actions_disable"
icon="icon-block"
action="vm.disableUsers()">
</umb-button>
</div>
<umb-button
style="margin-right: 5px;"
ng-if="vm.allowSetUserGroup"
type="button"
size="xs"
button-style="outline"
label-key="actions_setGroup"
icon="icon-users"
action="vm.openBulkUserGroupPicker()">
</umb-button>
<umb-button
style="margin-right: 5px;"
ng-if="vm.allowEnableUser"
type="button"
size="xs"
button-style="outline"
state="vm.enableUserButtonState"
label-key="actions_enable"
icon="icon-check"
action="vm.enableUsers()">
</umb-button>
<umb-button
style="margin-right: 5px;"
ng-if="vm.allowUnlockUser"
type="button"
size="xs"
button-style="outline"
state="vm.unlockUserButtonState"
label-key="actions_unlock"
icon="icon-unlocked"
action="vm.unlockUsers()">
</umb-button>
<umb-button
ng-if="vm.allowDisableUser"
type="button"
size="xs"
button-style="outline"
state="vm.disableUserButtonState"
label-key="actions_disable"
icon="icon-block"
action="vm.disableUsers()">
</umb-button>
</umb-editor-sub-header-content-right>
</umb-editor-sub-header>