diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorheader.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorheader.directive.js index bf87d764a6..e425bde042 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorheader.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorheader.directive.js @@ -1,52 +1,57 @@ (function() { - 'use strict'; + 'use strict'; - function EditorHeaderDirective(iconHelper) { + function EditorHeaderDirective(iconHelper) { - function link(scope, el, attr, ctrl) { + function link(scope, el, attr, ctrl) { - scope.openIconPicker = function() { - scope.dialogModel = { - view: "iconpicker", - show: true, - submit: function(model) { - if (model.color) { - scope.icon = model.icon + " " + model.color; - } else { - scope.icon = model.icon; + scope.openIconPicker = function() { + scope.dialogModel = { + view: "iconpicker", + show: true, + submit: function(model) { + if (model.color) { + scope.icon = model.icon + " " + model.color; + } else { + scope.icon = model.icon; + } + + // set form to dirty + ctrl.$setDirty(); + + scope.dialogModel.show = false; + scope.dialogModel = null; } - scope.dialogModel.show = false; - scope.dialogModel = null; - } + }; }; - }; - } + } - var directive = { - transclude: true, - restrict: 'E', - replace: true, - templateUrl: 'views/components/editor/umb-editor-header.html', - scope: { - tabs: "=", - actions: "=", - name: "=", - nameLocked: "=", - menu: "=", - icon: "=", - hideIcon: "@", - alias: "=", - hideAlias: "@", - description: "=", - hideDescription: "@", - navigation: "=" - }, - link: link - }; + var directive = { + require: '^form', + transclude: true, + restrict: 'E', + replace: true, + templateUrl: 'views/components/editor/umb-editor-header.html', + scope: { + tabs: "=", + actions: "=", + name: "=", + nameLocked: "=", + menu: "=", + icon: "=", + hideIcon: "@", + alias: "=", + hideAlias: "@", + description: "=", + hideDescription: "@", + navigation: "=" + }, + link: link + }; - return directive; - } + return directive; + } - angular.module('umbraco.directives').directive('umbEditorHeader', EditorHeaderDirective); + angular.module('umbraco.directives').directive('umbEditorHeader', EditorHeaderDirective); })(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js index 81c6a6612e..328884cfa1 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js @@ -1,10 +1,13 @@ (function() { 'use strict'; - function GroupsBuilderDirective(contentTypeHelper, contentTypeResource, mediaTypeResource, dataTypeHelper, dataTypeResource, $filter, iconHelper, $q, $timeout) { + function GroupsBuilderDirective(contentTypeHelper, contentTypeResource, mediaTypeResource, dataTypeHelper, dataTypeResource, $filter, iconHelper, $q, $timeout, notificationsService, localizationService) { function link(scope, el, attr, ctrl) { + var validationTranslated = ""; + var tabNoSortOrderTranslated = ""; + scope.sortingMode = false; scope.toolbar = []; scope.sortableOptionsGroup = {}; @@ -25,6 +28,14 @@ // add init tab addInitGroup(scope.model.groups); + // localize texts + localizationService.localize("validation_validation").then(function(value) { + validationTranslated = value; + }); + + localizationService.localize("contentTypeEditor_tabHasNoSortOrder").then(function(value) { + tabNoSortOrderTranslated = value; + }); } function setSortingOptions() { @@ -202,13 +213,30 @@ scope.toggleSortingMode = function(tool) { - scope.sortingMode = !scope.sortingMode; + if (scope.sortingMode === true) { - if(scope.sortingMode === true) { - scope.sortingButtonKey = "general_reorderDone"; - } else { - scope.sortingButtonKey = "general_reorder"; - } + var sortOrderMissing = false; + + for (var i = 0; i < scope.model.groups.length; i++) { + var group = scope.model.groups[i]; + if (group.tabState !== "init" && group.sortOrder === undefined) { + sortOrderMissing = true; + group.showSortOrderMissing = true; + notificationsService.error(validationTranslated + ": " + group.name + " " + tabNoSortOrderTranslated); + } + } + + if (!sortOrderMissing) { + scope.sortingMode = false; + scope.sortingButtonKey = "general_reorder"; + } + + } else { + + scope.sortingMode = true; + scope.sortingButtonKey = "general_reorderDone"; + + } }; @@ -394,8 +422,12 @@ } }; - scope.changeSortOrderValue = function() { - scope.model.groups = $filter('orderBy')(scope.model.groups, 'sortOrder'); + scope.changeSortOrderValue = function(group) { + + if (group.sortOrder !== undefined) { + group.showSortOrderMissing = false; + } + scope.model.groups = $filter('orderBy')(scope.model.groups, 'sortOrder'); }; function addInitGroup(groups) { diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less index 3012b5a30b..868fbb3437 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less @@ -21,7 +21,6 @@ } .umb-group-builder__group.-inherited { - background: #FDFDFD; border-color: #F2F2F2; animation: fadeIn 0.5s; } @@ -90,7 +89,6 @@ font-weight: bold; display: flex; align-items: center; - margin-right: 10px; } .umb-group-builder__group-title-icon { @@ -109,7 +107,6 @@ .umb-group-builder__group-title.-inherited { border-color: #F2F2F2; - background: #FDFDFD; } input.umb-group-builder__group-title-input { @@ -134,6 +131,15 @@ input.umb-group-builder__group-title-input { display: inline-block; position: relative; top: 2px; + margin-left: 10px; +} + +.umb-group-builder__group-sort-order { + display: flex; + align-items: center; + margin-left: 10px; + position: relative; + top: 2px; } input.umb-group-builder__group-sort-value { @@ -141,10 +147,7 @@ input.umb-group-builder__group-sort-value { padding: 0px 0 0px 5px; width: 40px; margin-bottom: 0; - margin-right: 10px; border-color: #d9d9d9; - position: relative; - top: 2px; } /* ---------- PROPERTIES ---------- */ @@ -182,7 +185,6 @@ input.umb-group-builder__group-sort-value { .umb-group-builder__property.-inherited { border: transparent; - background: #FDFDFD; animation: fadeIn 0.5s; } @@ -232,7 +234,9 @@ input.umb-group-builder__group-sort-value { .umb-group-builder__property-meta-alias { font-size: 10px; color: @gray; - word-wrap: break-word; + word-break: break-word; + line-height: 1.5; + margin-bottom: 5px; } .umb-group-builder__property-meta-label textarea { @@ -256,6 +260,7 @@ input.umb-group-builder__group-sort-value { .umb-group-builder__property-meta-description textarea { font-size: 12px; + line-height: 1.5; color: @grayDark; margin-bottom: 0; padding: 0; diff --git a/src/Umbraco.Web.UI.Client/src/less/property-editors.less b/src/Umbraco.Web.UI.Client/src/less/property-editors.less index b3cb034596..7ea8cfe949 100644 --- a/src/Umbraco.Web.UI.Client/src/less/property-editors.less +++ b/src/Umbraco.Web.UI.Client/src/less/property-editors.less @@ -200,10 +200,6 @@ ul.color-picker li a { border: 1px solid #f8f8f8; } -.umb-sortable-thumbnails li:hover a { - display: block; -} - .umb-sortable-thumbnails li img { max-width:100%; max-height:100%; @@ -228,6 +224,43 @@ ul.color-picker li a { display: block; } +.umb-sortable-thumbnails .umb-sortable-thumbnails__actions { + position: absolute; + bottom: 10px; + right: 10px; + text-decoration: none; + display: flex; + flex-direction: row; + opacity: 0; + visibility: hidden; +} + +.umb-sortable-thumbnails li:hover .umb-sortable-thumbnails__actions { + opacity: 1; + visibility: visible; +} + +.umb-sortable-thumbnails .umb-sortable-thumbnails__action { + font-size: 16px; + background: white; + height: 25px; + width: 25px; + border-radius: 15px; + color: @grayDarker; + display: flex; + justify-content: center; + align-items: center; + margin-left: 5px; +} + +.umb-sortable-thumbnails .umb-sortable-thumbnails__action.-red { + color: red; +} + +.umb-sortable-thumbnails .umb-sortable-thumbnails__action:hover { + text-decoration: none; +} + // // Cropper diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html index fd169ca86a..c58ebcf364 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html @@ -84,7 +84,13 @@ - + +
+ +
+
+
+
diff --git a/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.html b/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.html index c3c2a7f4ab..ce694ff5ea 100644 --- a/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.html +++ b/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.html @@ -2,61 +2,60 @@ -
+ + name="vm.contentType.name" + alias="vm.contentType.alias" + description="vm.contentType.description" + navigation="vm.page.navigation" + icon="vm.contentType.icon"> - + + - + - - + + - + - + - - - + + - - - - - + + + diff --git a/src/Umbraco.Web.UI.Client/src/views/mediatypes/edit.html b/src/Umbraco.Web.UI.Client/src/views/mediatypes/edit.html index b6c507ec0c..c1a3f69241 100644 --- a/src/Umbraco.Web.UI.Client/src/views/mediatypes/edit.html +++ b/src/Umbraco.Web.UI.Client/src/views/mediatypes/edit.html @@ -1,70 +1,71 @@
- + - + + name="vm.contentType.name" + alias="vm.contentType.alias" + description="vm.contentType.description" + navigation="vm.page.navigation" + icon="vm.contentType.icon">
- + +
- - + - - + + - + - + - - + + + + - - - - - + -
diff --git a/src/Umbraco.Web.UI.Client/src/views/membertypes/edit.html b/src/Umbraco.Web.UI.Client/src/views/membertypes/edit.html index 64ffe504b1..eb34aae6cc 100644 --- a/src/Umbraco.Web.UI.Client/src/views/membertypes/edit.html +++ b/src/Umbraco.Web.UI.Client/src/views/membertypes/edit.html @@ -1,67 +1,69 @@
- + + +
- - + name="vm.contentType.name" + alias="vm.contentType.alias" + description="vm.contentType.description" + navigation="vm.page.navigation" + icon="vm.contentType.icon">
- + +
- - + - - + + - + - + - - + + + + - - - - + -
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js index f73920a377..bf82efae24 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js @@ -1,7 +1,7 @@ //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 angular.module('umbraco').controller("Umbraco.PropertyEditors.MediaPickerController", - function ($rootScope, $scope, dialogService, entityResource, mediaResource, mediaHelper, $timeout, userService) { + function ($rootScope, $scope, dialogService, entityResource, mediaResource, mediaHelper, $timeout, userService, $location) { //check the pre-values for multi-picker var multiPicker = $scope.model.config.multiPicker && $scope.model.config.multiPicker !== '0' ? true : false; @@ -56,6 +56,10 @@ angular.module('umbraco').controller("Umbraco.PropertyEditors.MediaPickerControl $scope.sync(); }; + $scope.goToItem = function(item) { + $location.path('media/media/edit/' + item.id); + }; + $scope.add = function() { $scope.mediaPickerOverlay = { diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html index 9af1c7b10d..096685f1a9 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html @@ -2,14 +2,23 @@
  • - - - - {{image.name}} - + + + + + {{image.name}} + + +
    + + + + + + +
    -
diff --git a/src/Umbraco.Web.UI/umbraco/config/lang/en_us.xml b/src/Umbraco.Web.UI/umbraco/config/lang/en_us.xml index cd0067bf78..b94a6b4dab 100644 --- a/src/Umbraco.Web.UI/umbraco/config/lang/en_us.xml +++ b/src/Umbraco.Web.UI/umbraco/config/lang/en_us.xml @@ -1037,37 +1037,38 @@ To manage your website, simply open the Umbraco back office and start adding con Inherit tabs and properties from an existing document type. New tabs will be added to the current document type or merged if a tab with an identical name exists. This content type is used in a composition, and therefore cannot be composed itself. There are no content types available to use as a composition. - + Available editors Reuse Editor settings - + Configuration - + Yes, delete - + was moved underneath Select the folder to move to in the tree structure below - + All Document types All Documents All media items - + using this document type will be deleted permanently, please confirm you want to delete these as well. using this media type will be deleted permanently, please confirm you want to delete these as well. using this member type will be deleted permanently, please confirm you want to delete these as well - + and all documents using this type and all media items using this type and all members using this type - + using this editor will get updated with the new settings Member can edit Show on member profile + tab has no sort order - + Alternative field Alternative Text