Fix validation bug, rename labelExpression, change error style

app/controllers/config.controller.js

@@ -3,9 +3,9 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
     //$scope.model.value = "";
     //console.log($scope.model.value); 
 
-    var newPropertyModel = '{alias: "", remove: false, collapse: false, label: "", helpText: "", view: "", value: "", config: {}}';
-    var newFieldsetModel = '{alias: "", remove: false, collapse: false, labelExpression: "", tooltip: "", icon: "", label: "", headerText: "", footerText: "", properties:[' + newPropertyModel + ']}';
-    var defaultFieldsetConfigModel = eval("({showAdvancedOptions: false, hideFieldsetToolbar: false, enableMultipleFieldsets: false, hideFieldsetControls: false, hideFieldsetLabels: false, hidePropertyLabel: false, maxFieldsets:1, fieldsets: [" + newFieldsetModel + "]})");
+    var newPropertyModel = '{alias: "", remove: false, collapse: false, label: "", helpText: "", view: "", value: "", config: ""}';
+    var newFieldsetModel = '{alias: "", remove: false, collapse: false, labelTemplate: "", tooltip: "", icon: "", label: "", headerText: "", footerText: "", properties:[' + newPropertyModel + ']}';
+    var defaultFieldsetConfigModel = eval("({showAdvancedOptions: false, hideFieldsetToolbar: false, enableMultipleFieldsets: false, hideFieldsetControls: false, hideFieldsetLabels: false, hidePropertyLabel: false, maxFieldsets: null, fieldsets: [" + newFieldsetModel + "]})");
     
     $scope.model.value = $scope.model.value || defaultFieldsetConfigModel;
     

app/controllers/controller.js

@@ -14,10 +14,10 @@
     $scope.archetypeRenderModel = {};
     initArchetypeRenderModel();
      
-    //helper to get $eval the labelExpression
+    //helper to get $eval the labelTemplate
     $scope.getFieldsetTitle = function(fieldsetConfigModel, fieldsetIndex) {
         var fieldset = $scope.archetypeRenderModel.fieldsets[fieldsetIndex];
-        var template = fieldsetConfigModel.labelExpression;
+        var template = fieldsetConfigModel.labelTemplate;
         var rgx = /{{(.*?)}}*/g;
         var results;
         var parsedTemplate = template;
@@ -35,7 +35,6 @@
 
     //defines the options for the jquery sortable 
     //i used an ng-model="archetypeRenderModel" so the sort updates the right model
-
     $scope.sortableOptions = {
         axis: 'y',
         cursor: "move",
@@ -240,13 +239,17 @@
     {
         var validation = {}
         validation.isValid = true;
+        validation.requiredAliases = [];
         validation.invalidProperties = [];
 
         //determine which fields are required
         _.each($scope.model.config.fieldsets, function(fieldset){
-            validation.requiredAliases = _.find(fieldset.properties, function(property){
-                return property.required;
-            }) || [];
+            _.each(fieldset.properties, function(property){
+                if(property.required)
+                {
+                    validation.requiredAliases.push(property.alias);
+                }
+            });
         });
 
         //if nothing required; let's go
@@ -277,6 +280,11 @@
             });
         });
 
+        if($scope.model.config.developerMode == '1')
+        {
+            console.log(validation);
+        }
+
         return validation;
     }
 

app/directives/archetypeproperty.js

@@ -32,7 +32,7 @@
         var defaultValue = configFieldsetModel.properties[scope.propertyConfigIndex].value;
         
         //try to convert the config to a JS object
-        if(typeof config == 'string'){
+        if(config && typeof config == 'string'){
             try{
                 if(scope.archetypeConfig.developerMode == '1'){
                     console.log("Trying to eval config: " + config); 
@@ -47,12 +47,12 @@
             }
         }
 
-        if(scope.archetypeConfig.developerMode == '1'){
+        if(config && scope.archetypeConfig.developerMode == '1'){
             console.log("Config post-eval: " + config); 
         }
 
         //try to convert the defaultValue to a JS object
-        if(typeof defaultValue == 'string'){
+        if(defaultValue && typeof defaultValue == 'string'){
             try{
                 if(scope.archetypeConfig.developerMode == '1'){
                     console.log("Trying to eval default value: " + defaultValue); 
@@ -67,7 +67,7 @@
             }
         }
 
-        if(scope.archetypeConfig.developerMode == '1'){
+        if(defaultValue && scope.archetypeConfig.developerMode == '1'){
             console.log("Default value post-eval: " + defaultValue); 
         }
 

app/less/archetype.less

@@ -32,6 +32,7 @@
 .archetypeEditor .archetypeProperty{
     clear: both;
     overflow: hidden;
+    margin-top: 3px;
 }
 
 .archetypeEditor .umb-contentpicker{
@@ -95,7 +96,7 @@
 }
 
 .archetypeConfig label{
-    width: 100px;
+    width: 120px;
 }
 
 .archetypeConfig .archetypeFieldsetWrapper{
@@ -184,4 +185,6 @@
     background-color: #8b0000;
     color: #fff;
     margin-bottom: 5px;
+    padding-top: 3px;
+    padding-bottom: 3px;
 }

app/views/archetype.config.html

@@ -16,7 +16,7 @@
                         <label>Alias</label><input type="text" ng-model="fieldset.alias" />
                     </div>
                     <div class="archetypeFieldsetOption">
-                        <label>Label Expr.</label><input type="text" ng-model="fieldset.labelExpression" />
+                        <label>Label Template</label><input type="text" ng-model="fieldset.labelTemplate" />
                     </div>
                     <div class="archetypeFieldsetOption">
                         <label>Tooltip</label><input type="text" ng-model="fieldset.tooltip" />