Merge remote-tracking branch 'upstream/master'

app/controllers/controller.js

@@ -11,6 +11,10 @@
 
     //ini the model
     $scope.model.value = $scope.model.value || getDefaultModel($scope.model.config);
+
+    // store the umbraco property alias to help generate unique IDs.  Hopefully there's a better way to get this in the future :)
+    $scope.umbracoHostPropertyAlias = $scope.$parent.$parent.model.alias;
+
     init();
 
     //helper to get $eval the labelTemplate

app/directives/archetypeproperty.js

@@ -55,7 +55,8 @@ angular.module("umbraco.directives").directive('archetypeProperty', function ($c
         var config = null;
         var alias = configFieldsetModel.properties[scope.propertyConfigIndex].alias;
         var defaultValue = configFieldsetModel.properties[scope.propertyConfigIndex].value;
-        var umbracoPropertyAlias = scope.umbracoPropertyAlias;
+        var propertyAlias = getUniquePropertyAlias(scope);
+        propertyAliasParts = [];
         // initialize container for invalid fieldset property identifiers (store on ngModelCtrl to separate Archetype validations, e.g. when there two Archetype properties on the same document)
         if(ngModelCtrl.invalidProperties == null) {
             ngModelCtrl.invalidProperties = [];
@@ -85,7 +86,7 @@ angular.module("umbraco.directives").directive('archetypeProperty', function ($c
 
                 var mergedConfig = _.extend(defaultConfigObj, config);
 
-                loadView(pathToView, mergedConfig, defaultValue, alias, umbracoPropertyAlias, scope, element, ngModelCtrl, validateProperty);
+                loadView(pathToView, mergedConfig, defaultValue, alias, propertyAlias, scope, element, ngModelCtrl, validateProperty);
             });
         });
 
@@ -155,7 +156,27 @@ angular.module("umbraco.directives").directive('archetypeProperty', function ($c
         }
     }
 
-    function loadView(view, config, defaultValue, alias, umbracoPropertyAlias, scope, element, ngModelCtrl, validateProperty) {
+    var propertyAliasParts = [];
+    var getUniquePropertyAlias = function (currentScope) {
+        if (currentScope.hasOwnProperty('fieldsetIndex') && currentScope.hasOwnProperty('property') && currentScope.hasOwnProperty('propertyConfigIndex'))
+        {
+            var currentPropertyAlias = "f" + currentScope.fieldsetIndex + "-" + currentScope.property.alias + "-p" + currentScope.propertyConfigIndex;
+            propertyAliasParts.push(currentPropertyAlias);
+        }
+        else if (currentScope.hasOwnProperty('isPreValue')) // Crappy way to identify this is the umbraco property scope
+        {
+            var umbracoPropertyAlias = currentScope.$parent.$parent.property.alias; // Crappy way to get the umbraco host alias once we identify its scope
+            propertyAliasParts.push(umbracoPropertyAlias);
+        }
+
+        if (currentScope.$parent)
+            getUniquePropertyAlias(currentScope.$parent);
+
+        return _.unique(propertyAliasParts).reverse().join("-");
+    };
+
+
+    function loadView(view, config, defaultValue, alias, propertyAlias, scope, element, ngModelCtrl, validateProperty) {
         if (view)
         {
             $http.get(view).success(function (data) {
@@ -184,7 +205,7 @@ angular.module("umbraco.directives").directive('archetypeProperty', function ($c
                     scope.model.config = config;
 
                     //some items need an alias
-                    scope.model.alias = "archetype-property-" + umbracoPropertyAlias + "-" + scope.fieldsetIndex + "-" + scope.propertyConfigIndex;
+                    scope.model.alias = "archetype-property-" + propertyAlias;
 
                     //watch for changes since there is no two-way binding with the local model.value
                     scope.$watch('model.value', function (newValue, oldValue) {

app/views/archetype.default.html

@@ -29,15 +29,15 @@
                 <div class="archetypeCollapser animate-hide" ng-hide="isCollapsed(fieldset)">
                     <form class="form-inline">
                         <div ng-class="[property.alias, (getPropertyValidity($parent.$index, property.alias) === false ? 'archetypePropertyError' : '')]" class="archetypeProperty control-group" ng-repeat="property in fieldsetConfigModel.properties">
-                            <label ng-hide="model.config.hidePropertyLabels == '1'" class="control-label" for="archetype-property-{{model.alias}}-{{$parent.$index}}-{{$index}}">
+                            <label ng-hide="archetypeConfig.hidePropertyLabels == '1'" class="control-label" for="archetype-property-{{umbracoHostPropertyAlias}}-f{{$parent.$index}}-{{property.alias}}-p{{$index}}">
                                 <span>{{property.label}}</span>
                                 <div class="archetypeFieldsetHelpText" ng-show="property.helpText">
                                     <small>{{property.helpText}}</small>
                                 </div>
                             </label>
 
-                            <div ng-class="[(model.config.hidePropertyLabels == '1' ? 'controls-no-label' : 'controls')]">
-                                <archetype-property class="archetypeEditor" property="property" fieldset-index="$parent.$index" fieldset="fieldset" archetype-config="model.config" property-config-index="$index" archetype-render-model="model.value" umbraco-property-alias="model.alias" umbraco-form = "form"></archetype-property>
+                            <div class="controls">
+                                <archetype-property class="archetypeEditor" property="property" fieldset-index="$parent.$index" fieldset="fieldset" archetype-config="model.config" property-config-index="$index" archetype-render-model="model.value" umbraco-form = "form"></archetype-property>
                             </div>
                         </div>
                     </form>