From f2f11060344e7136a318538c6b0b9fc78e12feeb Mon Sep 17 00:00:00 2001 From: Shannon Date: Thu, 15 Aug 2013 19:20:06 +1000 Subject: [PATCH] Started on data type editor --- .../directives/valpropertymsg.directive.js | 55 +++++++++++-------- .../directives/valtogglemsg.directive.js | 5 +- .../common/mocks/resources/datatype.mocks.js | 10 +++- .../datatype/datatype.edit.controller.js | 19 ++++++- .../src/views/datatype/edit.html | 31 +++++++---- .../validationtest/validationtest.html | 8 +-- 6 files changed, 86 insertions(+), 42 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/valpropertymsg.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/valpropertymsg.directive.js index 8ad52c4df4..dd10d318b5 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/valpropertymsg.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/valpropertymsg.directive.js @@ -53,7 +53,11 @@ function valPropertyMsg(serverValidationManager) { hasError = true; //update the validation message if we don't already have one assigned. if (showValidation && scope.errorMsg === "") { - var err = serverValidationManager.getPropertyError(scope.property.alias, ""); + var err; + //this can be null if no property was assigned + if (scope.property) { + err = serverValidationManager.getPropertyError(scope.property.alias, ""); + } scope.errorMsg = err ? err.errorMsg : "Property has errors"; } } @@ -72,7 +76,11 @@ function valPropertyMsg(serverValidationManager) { scope.$on("saving", function (ev, args) { showValidation = true; if (hasError && scope.errorMsg === "") { - var err = serverValidationManager.getPropertyError(scope.property.alias, ""); + var err; + //this can be null if no property was assigned + if (scope.property) { + err = serverValidationManager.getPropertyError(scope.property.alias, ""); + } scope.errorMsg = err ? err.errorMsg : "Property has errors"; } else if (!hasError) { @@ -109,27 +117,30 @@ function valPropertyMsg(serverValidationManager) { // It's important to note that we need to subscribe to server validation changes here because we always must // indicate that a content property is invalid at the property level since developers may not actually implement // the correct field validation in their property editors. - serverValidationManager.subscribe(scope.property.alias, "", function (isValid, propertyErrors, allErrors) { - hasError = !isValid; - if (hasError) { - //set the error message to the server message - scope.errorMsg = propertyErrors[0].errorMsg; - //flag that the current validator is invalid - formCtrl.$setValidity('valPropertyMsg', false); - } - else { - scope.errorMsg = ""; - //flag that the current validator is valid - formCtrl.$setValidity('valPropertyMsg', true); - } - }); - //when the element is disposed we need to unsubscribe! - // NOTE: this is very important otherwise when this controller re-binds the previous subscriptsion will remain - // but they are a different callback instance than the above. - element.bind('$destroy', function () { - serverValidationManager.unsubscribe(scope.property.alias, ""); - }); + if (scope.property) { //this can be null if no property was assigned + serverValidationManager.subscribe(scope.property.alias, "", function(isValid, propertyErrors, allErrors) { + hasError = !isValid; + if (hasError) { + //set the error message to the server message + scope.errorMsg = propertyErrors[0].errorMsg; + //flag that the current validator is invalid + formCtrl.$setValidity('valPropertyMsg', false); + } + else { + scope.errorMsg = ""; + //flag that the current validator is valid + formCtrl.$setValidity('valPropertyMsg', true); + } + }); + + //when the element is disposed we need to unsubscribe! + // NOTE: this is very important otherwise when this controller re-binds the previous subscriptsion will remain + // but they are a different callback instance than the above. + element.bind('$destroy', function() { + serverValidationManager.unsubscribe(scope.property.alias, ""); + }); + } } }; } diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/valtogglemsg.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/valtogglemsg.directive.js index e324e6ae4e..a26f36e373 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/valtogglemsg.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/valtogglemsg.directive.js @@ -15,8 +15,9 @@ function valToggleMsg(serverValidationManager) { throw "valToggleMsg requires that the attribute valMsgFor exists on the element"; } - //assign the form control to our isolated scope so we can watch it's values - scope.formCtrl = formCtrl; + //we need to copy the form controller val to our isolated scope so that + //we'll also maintain the current form name. + scope[formCtrl.$name] = formCtrl; //if there's any remaining errors in the server validation service then we should show them. var showValidation = serverValidationManager.items.length > 0; diff --git a/src/Umbraco.Web.UI.Client/src/common/mocks/resources/datatype.mocks.js b/src/Umbraco.Web.UI.Client/src/common/mocks/resources/datatype.mocks.js index 6f0c21fa67..abe12053bb 100644 --- a/src/Umbraco.Web.UI.Client/src/common/mocks/resources/datatype.mocks.js +++ b/src/Umbraco.Web.UI.Client/src/common/mocks/resources/datatype.mocks.js @@ -13,7 +13,15 @@ angular.module('umbraco.mocks'). var dataType = { id: id, name: "Data type " + id, - selectedEditor: String.CreateGuid() + selectedEditor: String.CreateGuid(), + availableEditors: [ + { name: "Some editor 1", editorId: String.CreateGuid() }, + { name: "Some editor 2", editorId: String.CreateGuid() }, + { name: "Some editor 3", editorId: String.CreateGuid() }, + { name: "Some editor 4", editorId: String.CreateGuid() }, + { name: "Some editor 5", editorId: String.CreateGuid() }, + { name: "Some editor 6", editorId: String.CreateGuid() } + ] }; return [200, dataType, null]; diff --git a/src/Umbraco.Web.UI.Client/src/views/datatype/datatype.edit.controller.js b/src/Umbraco.Web.UI.Client/src/views/datatype/datatype.edit.controller.js index 6649921165..415605e8a8 100644 --- a/src/Umbraco.Web.UI.Client/src/views/datatype/datatype.edit.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/datatype/datatype.edit.controller.js @@ -7,7 +7,21 @@ * The controller for the content editor */ function DataTypeEditController($scope, $routeParams, $location, dataTypeResource, notificationsService, angularHelper, serverValidationManager, contentEditingHelper) { - + + function createDisplayProps() { + $scope.properties = { + selectedEditor: { + alias: "selectedEditor", + description: "Select a property editor", + label: "Property editor" + }, + selectedEditorId: { + alias: "selectedEditorId", + label: "Property editor GUID" + } + }; + } + if ($routeParams.create) { //we are creating so get an empty content item dataTypeResource.getScaffold($routeParams.id, $routeParams.doctype) @@ -22,6 +36,7 @@ function DataTypeEditController($scope, $routeParams, $location, dataTypeResourc .then(function(data) { $scope.loaded = true; $scope.content = data; + createDisplayProps(); //in one particular special case, after we've created a new item we redirect back to the edit // route but there might be server validation errors in the collection which we need to display @@ -55,4 +70,4 @@ function DataTypeEditController($scope, $routeParams, $location, dataTypeResourc } -angular.module("umbraco").controller("Umbraco.Editors.DataType.EditController", DataTypeEditController); +angular.module("umbraco").controller("Umbraco.Editors.DataType.EditController", DataTypeEditController); \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/datatype/edit.html b/src/Umbraco.Web.UI.Client/src/views/datatype/edit.html index c4ae0d5a31..4b92e6b56e 100644 --- a/src/Umbraco.Web.UI.Client/src/views/datatype/edit.html +++ b/src/Umbraco.Web.UI.Client/src/views/datatype/edit.html @@ -20,21 +20,30 @@ - - - - + +
+
- + - + +
+ + Requires +
+ + + +
{{content.selectedEditor}}
- - - +
+
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/validationtest/validationtest.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/validationtest/validationtest.html index 0258e9f518..b114564780 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/validationtest/validationtest.html +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/validationtest/validationtest.html @@ -1,12 +1,12 @@ 

Enter a numeric value

- - Required! - The value entered is not a number - A server error occurred + Required! + The value entered is not a number + A server error occurred