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

initial commit for save dialog

Browse Source
This commit is contained in:
Shannon
2018-08-13 16:45:05 +10:00
parent e950914fc8
commit 30d29d9fcf
7 changed files with 250 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -481,7 +481,63 @@
};
$scope.save = function () {
return performSave({ saveMethod: $scope.saveMethod(), action: "save" }).catch(angular.noop);
// TODO: Add "..." to save 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 ($scope.content.variants.length > 1) {
//before we launch the dialog we want to execute all client side validations first
if (formHelper.submitForm({ scope: $scope, action: "save" })) {
var dialog = {
view: "views/content/overlays/save.html",
variants: $scope.content.variants, //set a model property for the dialog
skipFormValidation: true, //when submitting the overlay form, skip any client side validation
submitButtonLabel: "Save",
submit: function (model) {
model.submitButtonState = "busy";
//we need to return this promise so that the dialog can handle the result and wire up the validation response
return performSave({
saveMethod: $scope.saveMethod(),
action: "save"
}).then(function (data) {
overlayService.close();
return $q.when(data);
},
function (err) {
model.submitButtonState = "error";
//re-map the dialog model since we've re-bound the properties
dialog.variants = $scope.content.variants;
//check the error list for specific variant errors, if none exist that means that only server side validation
//for the current variant's properties failed, in this case we want to close the publish dialog since the user
//will need to fix validation errors on the properties
if (err.data && err.data.ModelState) {
var keys = _.keys(err.data.ModelState);
var foundVariantError = _.find(keys,
function (k) {
return k.startsWith("publish_variant_");
});
if (!foundVariantError) {
//no variant errors, close the dialog
overlayService.close();
}
}
return $q.reject(err);
});
},
close: function (oldModel) {
overlayService.close();
}
};
overlayService.open(dialog);
}
}
else {
return performSave({ saveMethod: $scope.saveMethod(), action: "save" }).catch(angular.noop);
}
};
$scope.preview = function (content) {

22
src/Umbraco.Web.UI.Client/src/common/directives/components/content/umbvariantlist.directive.js Normal file
View File

@@ -0,0 +1,22 @@
(function () {
'use strict';
function umbVariantStateController($scope, $element) {
var vm = this;
}
var umbVariantStateComponent = {
templateUrl: 'views/components/content/umb-variant-state.html',
bindings: {
variant: "<"
},
controllerAs: 'vm',
controller: umbVariantStateController
};
angular.module("umbraco.directives")
.component('umbVariantState', umbVariantStateComponent);
})();

7
src/Umbraco.Web.UI.Client/src/views/common/overlays/publish/publish.html
View File

@@ -26,11 +26,8 @@
<span ng-class="{'bold': variant.published}" style="margin-bottom: 2px;">{{ variant.language.name }}</span>
</label>
<div ng-if="!publishVariantSelectorForm.publishVariantSelector.$invalid" ng-switch="variant.state">
<div class="umb-permission__description" ng-switch-when="NotCreated"><localize key="content_notCreated"></localize></div>
<div class="umb-permission__description" ng-switch-when="Draft"><localize key="content_unpublished"></localize></div>
<div class="umb-permission__description" ng-switch-when="PublishedPendingChanges"><localize key="content_publishedPendingChanges"></localize></div>
<div class="umb-permission__description" ng-switch-when="Published"><localize key="content_published"></localize></div>
<div ng-if="!publishVariantSelectorForm.publishVariantSelector.$invalid">
<umb-variant-state variant="variant"></umb-variant-state>
</div>
<div ng-messages="publishVariantSelectorForm.publishVariantSelector.$error" show-validation-on-submit>

6
src/Umbraco.Web.UI.Client/src/views/components/content/umb-variant-state.html Normal file
View File

@@ -0,0 +1,6 @@
<div ng-switch="variant.state">
<div class="umb-permission__description" ng-switch-when="NotCreated"><localize key="content_notCreated"></localize></div>
<div class="umb-permission__description" ng-switch-when="Draft"><localize key="content_unpublished"></localize></div>
<div class="umb-permission__description" ng-switch-when="PublishedPendingChanges"><localize key="content_publishedPendingChanges"></localize></div>
<div class="umb-permission__description" ng-switch-when="Published"><localize key="content_published"></localize></div>
</div>

101
src/Umbraco.Web.UI.Client/src/views/content/overlays/save.controller.js Normal file
View File

@@ -0,0 +1,101 @@
(function () {
"use strict";
function SaveContentController($scope, localizationService) {
var vm = this;
vm.variants = $scope.model.variants;
vm.changeSelection = changeSelection;
vm.loading = true;
vm.dirtyVariantFilter = dirtyVariantFilter;
vm.pristineVariantFilter = pristineVariantFilter;
vm.hasPristineVariants = false;
//watch this model, if it's reset, then re init
$scope.$watch("model.variants",
function (newVal, oldVal) {
vm.variants = newVal;
if (oldVal && oldVal.length) {
//re-bind the selections
for (var i = 0; i < oldVal.length; i++) {
var found = _.find(vm.variants, function (v) {
return v.language.id === oldVal[i].language.id;
});
if (found) {
found.publish = oldVal[i].publish;
}
}
}
onInit();
});
function changeSelection(variant) {
var firstSelected = _.find(vm.variants, function (v) {
return v.publish;
});
$scope.model.disableSubmitButton = !firstSelected; //disable submit button if there is none selected
}
function dirtyVariantFilter(variant) {
//determine a variant is 'dirty' (meaning it will show up as publish-able) if it's
// * the active one
// * it's editor is in a $dirty state
// * it has pending saves
// * it is unpublished
// * it is in NotCreated state
return (variant.active || variant.isDirty || variant.state === "Draft" || variant.state === "PublishedPendingChanges" || variant.state === "NotCreated");
}
function pristineVariantFilter(variant) {
return !(dirtyVariantFilter(variant));
}
function onInit() {
if(!$scope.model.title) {
localizationService.localize("content_readyToSave").then(function(value){
$scope.model.title = value;
});
}
vm.hasPristineVariants = false;
_.each(vm.variants,
function (variant) {
variant.compositeId = variant.language.culture + "_" + (variant.segment ? variant.segment : "");
//TODO: Change this prefix on both this and the publish dialog
variant.htmlId = "publish_variant_" + variant.compositeId;
//check for pristine variants
if (!vm.hasPristineVariants) {
vm.hasPristineVariants = pristineVariantFilter(variant);
}
});
if (vm.variants.length !== 0) {
//now sort it so that the current one is at the top
vm.variants = _.sortBy(vm.variants, function (v) {
return v.active ? 0 : 1;
});
var active = _.find(vm.variants, function (v) {
return v.active;
});
if (active) {
//ensure that the current one is selected
active.publish = true;
}
} else {
//disable Publish button if we have nothing to publish
$scope.model.disableSubmitButton = true;
}
vm.loading = false;
}
}
angular.module("umbraco").controller("Umbraco.Overlays.SaveContentController", SaveContentController);
})();

58
src/Umbraco.Web.UI.Client/src/views/content/overlays/save.html Normal file
View File

@@ -0,0 +1,58 @@
<div ng-controller="Umbraco.Overlays.SaveContentController as vm">
<div style="margin-bottom: 15px;">
<p><localize key="content_languagesToSave"></localize></p>
</div>
<div ng-if="vm.loading" style="min-height: 50px; position: relative;">
<umb-load-indicator></umb-load-indicator>
</div>
<div class="umb-list umb-list--condensed" ng-if="!vm.loading">
<div class="umb-list-item" ng-repeat="variant in vm.variants | filter:vm.dirtyVariantFilter track by variant.compositeId">
<ng-form name="publishVariantSelectorForm">
<div class="flex">
<input id="{{variant.htmlId}}"
name="publishVariantSelector"
type="checkbox"
ng-model="variant.publish"
ng-change="vm.changeSelection(variant)"
ng-disabled="variant.active === true"
style="margin-right: 8px;"
val-server-field="{{variant.htmlId}}" />
<div>
<label for="{{variant.htmlId}}">
<span ng-class="{'bold': variant.published}" style="margin-bottom: 2px;">{{ variant.language.name }}</span>
</label>
<div ng-if="!publishVariantSelectorForm.publishVariantSelector.$invalid">
<umb-variant-state variant="variant"></umb-variant-state>
</div>
<div ng-messages="publishVariantSelectorForm.publishVariantSelector.$error" show-validation-on-submit>
<div class="umb-permission__description" style="color: #F02E28;" ng-message="valServerField">{{publishVariantSelectorForm.publishVariantSelector.errorMsg}}</div>
</div>
</div>
</div>
</ng-form>
</div>
<br/>
</div>
<div class="umb-list umb-list--condensed" ng-if="!vm.loading && vm.hasPristineVariants">
<div style="margin-bottom: 15px; font-weight: bold;">
<p><localize key="content_unmodifiedLanguages"></localize></p>
</div>
<div class="umb-list-item" ng-repeat="variant in vm.variants | filter:vm.pristineVariantFilter">
<div>
<div ng-class="{'bold': variant.published}" style="margin-bottom: 2px;">{{ variant.language.name }}</div>
<div class="umb-permission__description">{{ variant.state }}</div>
</div>
</div>
</div>
</div>

5
src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
View File

@@ -264,8 +264,11 @@
<key alias="isSensitiveValue">This value is hidden. If you need access to view this value please contact your website administrator.</key>
<key alias="isSensitiveValue_short">This value is hidden.</key>
<key alias="languagesToPublish">What languages would you like to publish?</key>
<key alias="publishedLanguages">Published Languages.</key>
<key alias="languagesToSave">What languages would you like to save?</key>
<key alias="publishedLanguages">Published Languages</key>
<key alias="unmodifiedLanguages">Unmodified Languages</key>
<key alias="readyToPublish">Ready to Publish?</key>
<key alias="readyToSave">Ready to Save?</key>
</area>
<area alias="blueprints">
<key alias="createBlueprintFrom">Create a new Content Template from '%0%'</key>