clean up and prepare for implementing settings

This commit is contained in:
Niels Lyngsø
2020-03-12 15:48:26 +01:00
parent d8705831da
commit 9859f1b0d3
8 changed files with 75 additions and 26 deletions
@@ -82,12 +82,10 @@
/**
* Used to create a scoped watcher for a property on a blockModel.
* Used to create a scoped watcher for a content property on a blockModel.
*/
function createPropWatcher(blockModel, prop) {
function createContentModelPropWatcher(blockModel, prop) {
return function() {
// sync data:
blockModel.contentModel[prop.alias] = prop.value;
@@ -95,7 +93,16 @@
// TODO: could use a debounce.
blockModel.label = getBlockLabel(blockModel);
}
}
/**
* Used to create a scoped watcher for a settings property on a blockModel.
*/
function createSettingsModelPropWatcher(blockModel, prop) {
return function() {
// sync data:
blockModel.layoutModel.settings[prop.alias] = prop.value;
}
}
@@ -143,7 +150,7 @@
this.blockConfigurations.forEach(blockConfiguration => {
scaffoldAliases.push(blockConfiguration.contentTypeAlias);
if (blockConfiguration.settingsElementTypeAlias != null) {
scaffoldAliases.push(elementType.settingsElementTypeAlias);
scaffoldAliases.push(blockConfiguration.settingsElementTypeAlias);
}
});
@@ -233,7 +240,12 @@
blockModel.layoutModel = layoutEntry;
blockModel.watchers = [];
// TODO: settings
// TODO: implement settings
// create ElementTypeModel of settings
// store ElementTypeModel in blockModel.settings
// setup watchers for mapping
// Add blockModel to our isolated scope to enable watching its values:
this.isolatedScope.blockModels["_"+blockModel.key] = blockModel;
@@ -249,7 +261,7 @@
// Do notice that it is not performing a deep watch, meaning that we are only watching primatives and changes directly to the object of property-value.
// But we like to sync non-primative values as well! Yes, and this does happen, just not through this code, but through the nature of JavaScript.
// Non-primative values act as references to the same data and are therefor synced.
blockModel.watchers.push(this.isolatedScope.$watch("blockModels._"+blockModel.key+".content.variants[0].tabs["+t+"].properties["+p+"].value", createPropWatcher(blockModel, prop)));
blockModel.watchers.push(this.isolatedScope.$watch("blockModels._"+blockModel.key+".content.variants[0].tabs["+t+"].properties["+p+"].value", createContentModelPropWatcher(blockModel, prop)));
}
}
@@ -286,7 +298,8 @@
mapToPropertyModel(blockModel.content, blockModel.contentModel);
// TODO: sync settings to layout entry.
// TODO: implement settings, sync settings to layout entry.
// mapToPropertyModel(blockModel.settings, blockModel.layoutModel.settings)
},
@@ -318,7 +331,7 @@
}
if (blockConfiguration.settingsElementTypeAlias != null) {
// TODO: Settings.
entry.settings = {};
}
return entry;
@@ -1,12 +1,15 @@
//used for the media picker dialog
angular.module("umbraco")
.controller("Umbraco.Editors.ElementEditorController",
.controller("Umbraco.Editors.BlockEditorController",
function ($scope) {
var vm = this;
vm.content = $scope.model.content;
// TODO: implement settings — do notice that settings is optional.
//vm.settings = $scope.model.settings;
vm.title = $scope.model.title;
vm.saveAndClose = function() {
@@ -1,6 +1,6 @@
<div class="umb-element-editor" ng-controller="Umbraco.Editors.ElementEditorController as vm">
<div class="umb-block-editor" ng-controller="Umbraco.Editors.BlockEditorController as vm">
<ng-form name="elementTypeForm" val-form-manager>
<ng-form name="blockForm" val-form-manager>
<umb-editor-view ng-if="!page.loading">
<umb-editor-header
@@ -14,7 +14,15 @@
<div class="umb-editor-container umb-panel-body umb-scrollable row-fluid">
<!-- Missing Deleted Message Bar (Displayed when viewing node in recycle bin) -->
<!-- Missing Deleted Message Bar (Displayed when viewing node in recycle bin), but Blocks dosnt go into trash-bin, so does not make sense currently
<div ng-show="vm.content.trashed" class="umb-editor--trashed-message">
<i class="icon icon-trash"></i> <localize key="content_nodeIsInTrash">This item is in the Recycle Bin</localize>
</div>
-->
<!-- Missing content apps? — but i'm not sure content apps will or can work for ElementTypes? -->
<!-- TODO: implement settings -->
<div class="umb-pane">
<div class="umb-editor-sub-views" val-sub-view>
@@ -19,6 +19,12 @@
</div>
<div class="umb-block-list__block--actions">
<button type="button" class="btn-reset action --copy" localize="title" title="actions_editSettings" ng-click="vm.blockEditorApi.openSettingsForBlock(block);" ng-if="block.showSettings === true">
<i class="icon icon-settings" aria-hidden="true"></i>
<span class="sr-only">
<localize key="general_settings">Settings</localize>
</span>
</button>
<button type="button" class="btn-reset action --copy" localize="title" title="actions_copy" ng-click="vm.blockEditorApi.requestCopyBlock(block);" ng-if="vm.showCopy">
<i class="icon icon-documents" aria-hidden="true"></i>
<span class="sr-only">
@@ -123,6 +123,9 @@
// Lets apply fallback views, and make the view available directly on the blockModel.
block.view = block.config.view || vm.model.config.useInlineEditingAsDefault ? "views/blockelements/inlineblock/inlineblock.editor.html" : "views/blockelements/labelblock/labelblock.editor.html";
block.showSettings = block.config.settingsElementTypeAlias != null;
console.log(block)
return block;
}
@@ -184,15 +187,20 @@
// make a clone to avoid editing model directly.
var blockContentModelClone = angular.copy(blockModel.content);
// TODO: implement settings
// Settings should be available as a tab in this overlay:
//var blockSettingsModelClone = angular.copy(blockModel.settings);
var elementEditorModel = {
var blockEditorModel = {
content: blockContentModelClone,
//settings: blockSettingsModelClone,
title: blockModel.label,
view: "views/common/infiniteeditors/elementeditor/elementeditor.html",
view: "views/common/infiniteeditors/blockeditor/blockeditor.html",
size: blockModel.config.overlaySize || "medium",
submit: function(elementEditorModel) {
submit: function(blockEditorModel) {
// To ensure syncronization gets tricked we transfer
blockEditorService.mapElementTypeValues(elementEditorModel.content, blockModel.content)
blockEditorService.mapElementTypeValues(blockEditorModel.content, blockModel.content)
editorService.close();
},
close: function() {
@@ -201,7 +209,7 @@
};
// open property settings editor
editorService.open(elementEditorModel);
editorService.open(blockEditorModel);
}
vm.showCreateDialog = showCreateDialog;
@@ -244,7 +252,7 @@
},
close: function () {
vm.blockTypePicker.show = false;
vm.blockTypePicker = null;
delete vm.blockTypePicker;
}
};
@@ -372,6 +380,21 @@
});
}
function openSettingsForBlock() {
alert("settings not implemented jet.");
}
vm.blockEditorApi = {
editBlock: editBlock,
requestCopyBlock: requestCopyBlock,
requestDeleteBlock: requestDeleteBlock,
deleteBlock: deleteBlock,
openSettingsForBlock: openSettingsForBlock
}
var runtimeSortVars = {};
@@ -412,13 +435,6 @@
}
};
vm.blockEditorApi = {
editBlock: editBlock,
requestCopyBlock: requestCopyBlock,
requestDeleteBlock: requestDeleteBlock,
deleteBlock: deleteBlock
}
function onAmountOfBlocksChanged() {
@@ -16,6 +16,7 @@
<key alias="createGroup">Opret gruppe</key>
<key alias="delete">Slet</key>
<key alias="disable">Deaktivér</key>
<key alias="editSettings">Edit settings</key>
<key alias="emptyRecycleBin">Tøm papirkurv</key>
<key alias="enable">Aktivér</key>
<key alias="exportDocumentType">Eksportér dokumenttype</key>
@@ -16,6 +16,7 @@
<key alias="createGroup">Create group</key>
<key alias="delete">Delete</key>
<key alias="disable">Disable</key>
<key alias="editSettings">Edit settings</key>
<key alias="emptyRecycleBin">Empty recycle bin</key>
<key alias="enable">Enable</key>
<key alias="exportDocumentType">Export Document Type</key>
@@ -16,6 +16,7 @@
<key alias="createGroup">Create group</key>
<key alias="delete">Delete</key>
<key alias="disable">Disable</key>
<key alias="editSettings">Edit settings</key>
<key alias="emptyRecycleBin">Empty recycle bin</key>
<key alias="enable">Enable</key>
<key alias="exportDocumentType">Export Document Type</key>