This never got bumped up, but most people are past that version.

UI overhaul

.gitignore

@@ -17,6 +17,9 @@ tmp/
 pkg/*.nupkg
 pkg/*.zip
 
+*_versioned*
+
+
 [Dd]ebug/
 [Bb]uild/
 [Rr]elease/

Gruntfile.js

@@ -1,13 +1,39 @@
 module.exports = function(grunt) {
   require('load-grunt-tasks')(grunt);
-  var path = require('path')
-
+  var path = require('path');
+  
   grunt.initConfig({
     pkg: grunt.file.readJSON('package.json'),
     pkgMeta: grunt.file.readJSON('config/meta.json'),
     dest: grunt.option('target') || 'dist',
     basePath: path.join('<%= dest %>', 'App_Plugins', '<%= pkgMeta.name %>'),
 
+    'string-replace': {
+      version: {
+        files: {
+          "app/controllers/controller_versioned.js": "app/controllers/controller.js",
+          "app/less/archetype_versioned.less": "app/less/archetype.less",
+          "app/views/archetype.config.developer.dialog_versioned.html": "app/views/archetype.config.developer.dialog.html",
+          "app/views/archetype.config.stylescript.dialog_versioned.html": "app/views/archetype.config.stylescript.dialog.html",
+          "app/views/archetype.config.fieldset.dialog_versioned.html": "app/views/archetype.config.fieldset.dialog.html",
+          "app/views/archetype.config_versioned.html": "app/views/archetype.config.html",
+          "app/views/archetype_versioned.html": "app/views/archetype.html",
+          "app/views/archetype.default_versioned.html": "app/views/archetype.default.html",
+          
+        },
+        options: {
+          replacements: [{
+            pattern: /{{VERSION}}/g,
+            replacement: '/* Version <%= pkgMeta.version %> */'
+          },
+          {
+            pattern: /{{VERSION_HTML}}/g,
+            replacement: '<!-- Version <%= pkgMeta.version %> -->'
+          }]
+        }
+      }
+    },
+    
     watch: {
       options: {
         spawn: false,
@@ -16,22 +42,27 @@ module.exports = function(grunt) {
 
       less: {
         files: ['app/**/*.less'],
-        tasks: ['less:dist']
+        tasks: ['string-replace', 'less:dist']
       },
 
       js: {
         files: ['app/**/*.js'],
-        tasks: ['concat:dist']
+        tasks: ['string-replace', 'concat:dist']
       },
 
       html: {
         files: ['app/**/*.html'],
-        tasks: ['copy:html']
+        tasks: ['string-replace', 'copy:html']
       },
 
       dll: {
         files: ['app/Umbraco/**/*.dll'],
         tasks: ['copy:dll']
+      },
+      
+      assets: {
+        files: ['assets/*.*'],
+        tasks: ['copy:assets']
       }
     },
 
@@ -41,7 +72,7 @@ module.exports = function(grunt) {
           paths: ["app/less", "lib/less", "vendor"],
         },
         files: {
-          '<%= basePath %>/css/archetype.css': 'app/less/archetype.less',
+          '<%= basePath %>/css/archetype.css': 'app/less/archetype_versioned.less',
         }
       }
     },
@@ -52,8 +83,9 @@ module.exports = function(grunt) {
       },
       dist: {
         src: [
-          'app/controllers/controller.js',
+          'app/controllers/controller_versioned.js',
           'app/controllers/config.controller.js',
+          'app/controllers/config.dialog.controller.js',
           'app/directives/archetypeproperty.js',
           'app/directives/archetypesubmitwatcher.js',
           'app/directives/archetypecustomview.js',
@@ -73,8 +105,24 @@ module.exports = function(grunt) {
     copy: {
       html: {
         cwd: 'app/views/',
-        src: ['archetype.html', 'archetype.default.html', 'archetype.config.html'],
-        dest: '<%= basePath %>/views',
+        src: [
+            'archetype_versioned.html', 
+            'archetype.default_versioned.html', 
+            'archetype.config_versioned.html', 
+            'archetype.config.fieldset.dialog_versioned.html', 
+            'archetype.config.stylescript.dialog_versioned.html', 
+            'archetype.config.developer.dialog_versioned.html'
+        ],
+        dest: '<%= basePath %>/views/',
+        expand: true,
+        rename: function(dest, src) {
+            return dest + src.replace('_versioned','');
+          }
+      },
+      assets: {
+        cwd: 'assets/',
+        src: ['*.*'],
+        dest: '<%= basePath %>/assets',
         expand: true
       },
       dll: {
@@ -118,31 +166,30 @@ module.exports = function(grunt) {
     },
 
     nugetpack: {
-    	dist: {
-    		src: 'tmp/nuget/package.nuspec',
-    		dest: 'pkg'
-    	}
+        dist: {
+            src: 'tmp/nuget/package.nuspec',
+            dest: 'pkg'
+        }
     },
 
     template: {
-    	'nuspec': {
-			'options': {
-    			'data': { 
-            name: '<%= pkgMeta.name %>',
-    				version: '<%= pkgMeta.version %>',
-            url: '<%= pkgMeta.url %>',
-            license: '<%= pkgMeta.license %>',
-            licenseUrl: '<%= pkgMeta.licenseUrl %>',
-            author: '<%= pkgMeta.author %>',
-            authorUrl: '<%= pkgMeta.authorUrl %>',
-
-    				files: [{ path: 'tmp/nuget/**', target: 'content/App_Plugins/Archetype'}]
-	    		}
-    		},
-    		'files': { 
-    			'tmp/nuget/package.nuspec': ['config/package.nuspec']
-    		}
-    	}
+        'nuspec': {
+            'options': {
+                'data': { 
+                    name: '<%= pkgMeta.name %>',
+                    version: '<%= pkgMeta.version %>',
+                    url: '<%= pkgMeta.url %>',
+                    license: '<%= pkgMeta.license %>',
+                    licenseUrl: '<%= pkgMeta.licenseUrl %>',
+                    author: '<%= pkgMeta.author %>',
+                    authorUrl: '<%= pkgMeta.authorUrl %>',
+                    files: [{ path: 'tmp/nuget/**', target: 'content/App_Plugins/Archetype'}]
+                }
+            },
+            'files': { 
+                'tmp/nuget/package.nuspec': ['config/package.nuspec']
+            }
+        }
     },
 
     umbracoPackage: {
@@ -163,7 +210,26 @@ module.exports = function(grunt) {
 
     clean: {
       build: '<%= grunt.config("basePath").substring(0, 4) == "dist" ? "dist/**/*" : "null" %>',
-      tmp: ['tmp']
+      tmp: ['tmp'],
+      html: [
+        'app/views/*.html',
+        '!app/views/archetype.html', 
+        '!app/views/archetype.default.html', 
+        '!app/views/archetype.config.html', 
+        '!app/views/archetype.config.fieldset.dialog.html', 
+        '!app/views/archetype.config.stylescript.dialog.html', 
+        '!app/views/archetype.config.developer.dialog.html'
+        ],
+      js: [
+        'app/controllers/*.js',
+        '!app/controllers/controller.js',
+        '!app/controllers/config.controller.js',
+        '!app/controllers/config.dialog.controller.js'
+      ],
+      less: [
+        'app/less/*.less',
+        '!app/less/archetype.less'
+      ]
     },
 
     assemblyinfo: {
@@ -182,7 +248,7 @@ module.exports = function(grunt) {
         src: ['<%= grunt.option("target") %>\\Web.config']
       }
     },
-
+    
     jshint: {
       options: {
         jshintrc: '.jshintrc'
@@ -197,7 +263,7 @@ module.exports = function(grunt) {
         stdout: true,
         verbosity: 'quiet',
         maxCpuCount: 4,
-		version: 4.0,
+        version: 4.0,
         buildParameters: {
           WarningLevel: 2,
           NoWarn: 1607
@@ -211,10 +277,9 @@ module.exports = function(grunt) {
         }
       }
     }
-
   });
 
-  grunt.registerTask('default', ['clean', 'less', 'concat', 'assemblyinfo', 'msbuild:dist', 'copy:dll', 'copy:config', 'copy:html']);
+  grunt.registerTask('default', ['clean', 'string-replace', 'less', 'concat', 'assemblyinfo', 'msbuild:dist', 'copy:dll', 'copy:assets', 'copy:config', 'clean:html', 'clean:js', 'clean:less']);
 
   grunt.registerTask('nuget',   ['clean:tmp', 'default', 'copy:nuget', 'template:nuspec', 'nugetpack', 'clean:tmp']);
   grunt.registerTask('umbraco', ['clean:tmp', 'default', 'copy:umbraco', 'umbracoPackage', 'clean:tmp']);

app/Umbraco/Umbraco.Archetype/Api/ArchetypeDataTypeController.cs

@@ -1,16 +1,16 @@
 using System.Collections.Generic;
 using System;
+using System.Diagnostics;
 using System.Linq;
 using System.Net;
+using System.Reflection;
 using System.Web.Http;
 using AutoMapper;
 using Umbraco.Core.Models;
 using Umbraco.Web.Models.ContentEditing;
 using Umbraco.Web.Mvc;
 using Umbraco.Web.Editors;
-using Umbraco.Core.PropertyEditors;
 using Archetype.Extensions;
-using Newtonsoft.Json;
 
 namespace Archetype.Api
 {
@@ -53,5 +53,18 @@ namespace Archetype.Api
             var dataTypeDisplay = Mapper.Map<IDataTypeDefinition, DataTypeDisplay>(dataType);
             return new { selectedEditor = dataTypeDisplay.SelectedEditor, preValues = dataTypeDisplay.PreValues, contentTypeAlias = contentTypeAlias, propertyTypeAlias = propertyTypeAlias, archetypeAlias = archetypeAlias, nodeId = nodeId };
         }
+
+        public object GetDllVersion()
+        {
+            return new {dllVersion = _version()};
+        }
+
+        private string _version()
+        {
+            var asm = Assembly.GetExecutingAssembly();
+            var fvi = FileVersionInfo.GetVersionInfo(asm.Location);
+
+            return fvi.FileVersion;
+        }
     }
 }

app/Umbraco/Umbraco.Archetype/Archetype.Umbraco.csproj

@@ -239,6 +239,7 @@
     <Compile Include="Models\ArchetypeModel.cs" />
     <Compile Include="Models\ArchetypePreValue.cs" />
     <Compile Include="Models\ArchetypePreValueFieldset.cs" />
+    <Compile Include="Models\ArchetypePreValueFieldsetGroup.cs" />
     <Compile Include="Models\ArchetypePreValueProperty.cs" />
     <Compile Include="Models\ArchetypeFieldsetModel.cs" />
     <Compile Include="Models\ArchetypePropertyModel.cs" />

app/Umbraco/Umbraco.Archetype/Extensions/ArchetypeHelper.cs

@@ -68,7 +68,7 @@ namespace Archetype.Extensions
                 }
                 catch (Exception ex)
                 {
-                    LogHelper.Error<ArchetypeHelper>("DeserializeJsonToArchetype", ex);
+                    LogHelper.Error<ArchetypeHelper>(string.Format("DeserializeJsonToArchetype Error DatatypeId=>{0} SourceJson=>{1}", dataTypeId, sourceJson), ex);
                 }
 
                 return archetype;

app/Umbraco/Umbraco.Archetype/Models/ArchetypeModel.cs

@@ -30,15 +30,9 @@ namespace Archetype.Models
 
         public string SerializeForPersistence()
         {
-            // clear the editor state before serializing (it's temporary state data)
-            foreach(var property in Fieldsets.SelectMany(f => f.Properties.Where(p => p.EditorState != null)).ToList())
-            {
-                property.EditorState = null;
-            }
-
             var json = JObject.Parse(JsonConvert.SerializeObject(this, new JsonSerializerSettings() { ReferenceLoopHandling = ReferenceLoopHandling.Ignore }));
 
-            var propertiesToRemove = new String[] { "propertyEditorAlias", "dataTypeId", "dataTypeGuid", "hostContentType" };
+            var propertiesToRemove = new String[] { "propertyEditorAlias", "dataTypeId", "dataTypeGuid", "hostContentType", "editorState" };
 
             json.Descendants().OfType<JProperty>()
               .Where(p => propertiesToRemove.Contains(p.Name))

app/Umbraco/Umbraco.Archetype/Models/ArchetypePreValue.cs

@@ -1,4 +1,5 @@
-using System.Collections.Generic;
+using System;
+using System.Collections.Generic;
 using Newtonsoft.Json;
 
 namespace Archetype.Models
@@ -12,6 +13,7 @@ namespace Archetype.Models
         public bool StartWithAddButton { get; set; }
 
         [JsonProperty("hideFieldsetToolbar")]
+        [Obsolete("This value is no longer used but is kept to prevent breaking changes.")]
         public bool HideFieldsetToolbar { get; set; }
 
         [JsonProperty("enableMultipleFieldsets")]
@@ -38,6 +40,9 @@ namespace Archetype.Models
         [JsonProperty("fieldsets")]
         public IEnumerable<ArchetypePreValueFieldset> Fieldsets { get; set; }
 
+        [JsonProperty("fieldsetGroups")]
+        public IEnumerable<ArchetypePreValueFieldsetGroup> FieldsetGroups { get; set; }
+
         [JsonProperty("hidePropertyLabels")]
         public bool HidePropertyLabels { get; set; }
 

app/Umbraco/Umbraco.Archetype/Models/ArchetypePreValueFieldset.cs

@@ -25,5 +25,8 @@ namespace Archetype.Models
 
         [JsonProperty("properties")]
         public IEnumerable<ArchetypePreValueProperty> Properties { get; set; }
+
+        [JsonProperty("group")]
+        public ArchetypePreValueFieldsetGroup Group { get; set; }
     }
 }

app/Umbraco/Umbraco.Archetype/Models/ArchetypePreValueFieldsetGroup.cs

@@ -0,0 +1,10 @@
+using Newtonsoft.Json;
+
+namespace Archetype.Models
+{
+    public class ArchetypePreValueFieldsetGroup
+    {
+        [JsonProperty("name")]
+        public string Name { get; set; }
+    }
+}

app/Umbraco/Umbraco.Archetype/Properties/VersionInfo.cs

@@ -1,4 +1,4 @@
 using System.Reflection;
 
-[assembly: AssemblyVersion("1.10")]
-[assembly: AssemblyFileVersion("1.10-ui-rc1")]
+[assembly: AssemblyVersion("1.11")]
+[assembly: AssemblyFileVersion("1.11")]

app/controllers/config.controller.js

@@ -5,12 +5,18 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
 
     //define empty items
     var newPropertyModel = '{"alias": "", "remove": false, "collapse": false, "label": "", "helpText": "", "dataTypeGuid": "0cc0eba1-9960-42c9-bf9b-60e150b429ae", "value": ""}';
-    var newFieldsetModel = '{"alias": "", "remove": false, "collapse": false, "labelTemplate": "", "icon": "", "label": "", "properties": [' + newPropertyModel + ']}';
-    var defaultFieldsetConfigModel = JSON.parse('{"showAdvancedOptions": false, "startWithAddButton": false, "hideFieldsetToolbar": false, "enableMultipleFieldsets": false, "hideFieldsetControls": false, "hidePropertyLabel": false, "maxFieldsets": null, "enableCollapsing": true, "enableCloning": false, "enableDisabling": true, "enableDeepDatatypeRequests": false, "fieldsets": [' + newFieldsetModel + ']}');
+    var newFieldsetModel = '{"alias": "", "remove": false, "collapse": false, "labelTemplate": "", "icon": "", "label": "", "properties": [' + newPropertyModel + '], "group": null}';
+    var defaultFieldsetConfigModel = JSON.parse('{"showAdvancedOptions": false, "startWithAddButton": false, "hideFieldsetToolbar": false, "enableMultipleFieldsets": false, "hideFieldsetControls": false, "hidePropertyLabel": false, "maxFieldsets": null, "enableCollapsing": true, "enableCloning": false, "enableDisabling": true, "enableDeepDatatypeRequests": false, "fieldsets": [' + newFieldsetModel + '], "fieldsetGroups": []}');
 
     //ini the model
     $scope.model.value = $scope.model.value || defaultFieldsetConfigModel;
 
+    $scope.dllVersion = "";
+
+    archetypePropertyEditorResource.getDllVersion().then(function(data){
+        $scope.dllVersion = data.dllVersion;
+    });
+
     //ini the render model
     initConfigRenderModel();
 
@@ -238,8 +244,18 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
     function initConfigRenderModel()
     {
         $scope.archetypeConfigRenderModel = $scope.model.value;
+        if (!$scope.archetypeConfigRenderModel.fieldsetGroups) {
+            $scope.archetypeConfigRenderModel.fieldsetGroups = [];
+        }
 
-        _.each($scope.archetypeConfigRenderModel.fieldsets, function(fieldset){
+        _.each($scope.archetypeConfigRenderModel.fieldsets, function(fieldset) {
+
+            if (fieldset.group) {
+                // tie the fieldset group back up to the actual group object, not the clone that's been persisted
+                fieldset.group = _.find($scope.archetypeConfigRenderModel.fieldsetGroups, function(fieldsetGroup) {
+                    return fieldsetGroup.name == fieldset.group.name;
+                })
+            }
 
             fieldset.remove = false;
             if (fieldset.alias.length > 0)
@@ -289,6 +305,21 @@ angular.module("umbraco").controller("Imulus.ArchetypeConfigController", functio
         $scope.model.value.fieldsets = fieldsets;
     }
 
+    $scope.showOptions = function ($event, template) {
+        $event.preventDefault();
+
+        dialogService.closeAll();
+
+        dialogService.open({
+            template: template,
+            show: true,
+            callback: function(data) {
+                $scope.archetypeConfigRenderModel = data;
+            },
+            dialogData: $scope.archetypeConfigRenderModel
+        });
+    }
+
     //archetype css
     assetsService.loadCss("../App_Plugins/Archetype/css/archetype.css");
 });

app/controllers/config.dialog.controller.js

@@ -0,0 +1,17 @@
+angular.module('umbraco').controller('ArchetypeConfigOptionsController', function ($scope) {
+	$scope.model = angular.copy($scope.dialogData);
+
+    //handles a fieldset group add
+    $scope.addFieldsetGroup = function () {
+        $scope.model.fieldsetGroups.push({ name: "" });
+    }
+
+    //handles a fieldset group removal
+    $scope.removeFieldsetGroup = function ($index) {
+        $scope.model.fieldsetGroups.splice($index, 1);
+    }
+
+    $scope.apply = function(index) {
+        $scope.submit($scope.model);
+    }
+});

app/controllers/controller.js

@@ -1,4 +1,5 @@
-angular.module("umbraco").controller("Imulus.ArchetypeController", function ($scope, $http, assetsService, angularHelper, notificationsService, $timeout, fileManager, entityResource, archetypeService, archetypeLabelService, archetypeCacheService, archetypePropertyEditorResource) {
+{{VERSION}}
+angular.module("umbraco").controller("Imulus.ArchetypeController", function ($scope, $http, $filter, assetsService, angularHelper, notificationsService, $timeout, fileManager, entityResource, archetypeService, archetypeLabelService, archetypeCacheService, archetypePropertyEditorResource) {
 
     //$scope.model.value = "";
     $scope.model.hideLabel = $scope.model.config.hideLabel == 1;
@@ -41,7 +42,7 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
     }
 
     var draggedRteSettings;
-    var rteClass = ".mce-tinymce";
+    var rteClass = ".umb-rte textarea";
 
     //sort config
     $scope.sortableOptions = {
@@ -50,30 +51,22 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
         handle: ".handle",
         start: function(ev, ui) {
             draggedRteSettings = {};
-            ui.item.parent().find(rteClass).each(function () {
-                // remove all RTEs in the dragged row and save their settings
-                var $element = $(this);
-                var wrapperId = $element.attr('id');
-                var $textarea = $element.siblings('textarea');
-                var textareaId = $textarea.attr('id');
-
-                draggedRteSettings[textareaId] = _.findWhere(tinyMCE.editors, { id: textareaId }).settings;
-                tinyMCE.execCommand('mceRemoveEditor', false, wrapperId);
+            $(rteClass, ui.item.parent()).each(function () {
+                var id = $(this).attr("id");
+                draggedRteSettings[id] = _.findWhere(tinyMCE.editors, { id: id }).settings;
+                tinymce.execCommand('mceRemoveEditor', false, id);
+                $(this).css("visibility", "hidden");
             });
         },
         update: function (ev, ui) {
             $scope.setDirty();
         },
         stop: function (ev, ui) {
-            ui.item.parent().find(rteClass).each(function () {
-                var $element = $(this);
-                var wrapperId = $element.attr('id');
-                var $textarea = $element.siblings('textarea');
-                var textareaId = $textarea.attr('id');
-
-                draggedRteSettings[textareaId] = draggedRteSettings[textareaId] || _.findWhere(tinyMCE.editors, { id: textareaId }).settings;
-                tinyMCE.execCommand('mceRemoveEditor', false, wrapperId);
-                tinyMCE.init(draggedRteSettings[textareaId]);
+            $(rteClass, ui.item.parent()).each(function () {
+                var id = $(this).attr("id");
+                draggedRteSettings[id] = draggedRteSettings[id] || _.findWhere(tinyMCE.editors, { id: id }).settings;
+                tinyMCE.execCommand("mceRemoveEditor", false, id);
+                tinyMCE.init(draggedRteSettings[id]);
             });
         }
     };
@@ -84,27 +77,38 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
             return;
         }
 
-        $scope.overlayMenu.fieldsets = [];
+        var allFieldsets = [];
         _.each($scope.model.config.fieldsets, function (fieldset) {
             var icon = fieldset.icon;
-            $scope.overlayMenu.fieldsets.push({
+            allFieldsets.push({
                 alias: fieldset.alias,
                 label: fieldset.label,
-                icon: (fieldset.icon || "icon-document-dashed-line") // default icon if none is chosen
+                icon: (fieldset.icon || "icon-document-dashed-line"), // default icon if none is chosen
+                group: fieldset.group ? fieldset.group.name : null
             });
-            $scope.overlayMenu.index = $index;
         });
-
         // sanity check
-        if ($scope.overlayMenu.fieldsets.length == 0) {
+        if (allFieldsets == 0) {
             return;
         }
-        if ($scope.overlayMenu.fieldsets.length == 1) {
+        if (allFieldsets.length == 1) {
             // only one fieldset type - no need to display the picker
-            $scope.addRow($scope.overlayMenu.fieldsets[0].alias, $index);
+            $scope.addRow(allFieldsets[0].alias, $index);
             return;
         }
 
+        $scope.overlayMenu.fieldsetGroups = [];
+        if ($scope.model.config.fieldsetGroups && $scope.model.config.fieldsetGroups.length > 0) {
+            _.each($scope.model.config.fieldsetGroups, function (fieldsetGroup) {
+                $scope.overlayMenu.fieldsetGroups.push({ name: fieldsetGroup.name, fieldsets: $filter("filter")(allFieldsets, { group: fieldsetGroup.name }, true) });
+            })
+        }
+        else {
+            $scope.overlayMenu.fieldsetGroups.push({ name: "", fieldsets: allFieldsets });
+        }
+        $scope.overlayMenu.index = $index;
+        $scope.overlayMenu.activeFieldsetGroup = $scope.overlayMenu.fieldsetGroups[0];
+
         // calculate overlay position
         // - yeah... it's jQuery (ungh!) but that's how the Grid does it.
         var offset = $(event.target).offset();

app/langs/da-dk.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."    
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset-grupper",
+  "fieldsetGroupsDescription":"Hvis du har mange fieldsets, skal du måske overveje at gruppere dem i fieldset-vælgeren. Når du først har defineret dine grupper her, vil en gruppe-vælger dukke op i fieldset-editoren, og du kan derefter vælge grupper for alle dine fieldsets.",
+  "fieldsetGroupName":"Navn",
+  "addFieldsetGroup":"Tilføj gruppe"
 }

app/langs/da.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."    
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset-grupper",
+  "fieldsetGroupsDescription":"Hvis du har mange fieldsets, skal du måske overveje at gruppere dem i fieldset-vælgeren. Når du først har defineret dine grupper her, vil en gruppe-vælger dukke op i fieldset-editoren, og du kan derefter vælge grupper for alle dine fieldsets.",
+  "fieldsetGroupName":"Navn",
+  "addFieldsetGroup":"Tilføj gruppe"    
 }

app/langs/de-de.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."  
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/de.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."  
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/en-gb.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."  
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/en-us.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."  
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/en.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."  
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/es-es.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/es.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/fr-fr.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/he-il.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/it-it.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/ja-jp.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/ko-kr.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/nb-no.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/nl-nl.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/pl-pl.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/pt-br.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/ru-ru.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/sv-se.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/langs/zh-cn.js

@@ -40,5 +40,9 @@
     "overrideDefaultConverterDescription":"Check this if you wish to use your own custom property value converter.",
     "overrideDefaultConverter":"Override Default Property Value Converter?",
     "enableCloning":"Enable Cloning?",
- 	"enableCloningDescription":"Enable Fieldset Cloning."
+ 	"enableCloningDescription":"Enable Fieldset Cloning.",
+  "fieldsetGroups":"Fieldset groups",
+  "fieldsetGroupsDescription":"If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.",
+  "fieldsetGroupName":"Name",
+  "addFieldsetGroup":"Add group"
 }

app/less/archetype.less

@@ -1,8 +1,19 @@
-/* TODO: clean this up */
+{{VERSION}}
 
 .archetypeEditor {
     width: 98%;
 
+    .usky-grid {
+        .cell-tools-menu {
+            height: 385px;
+        }
+        &.withGroups {
+            .cell-tools-menu {
+                height: 415px;
+            }
+        }
+    }
+
     .open {
         position: relative;
     }
@@ -244,15 +255,42 @@
         }
     }
 
-    .fieldsetPicker .icon {
-        color: #333;
+    .fieldsetPicker {
+        .icon {
+            color: #333;
+        }
+        ul.elements li {
+            overflow: visible;
+            vertical-align: top;  
+            height: 90px;        
+        }
+        ul.groups {
+            display: block;
+            margin: 0;
+            padding: 4px;
+            li {
+                width: auto;
+                margin: 0;
+                padding: 0 20px;
+                font-weight: bold;
+                a {
+                    color: #d9d9d9;
+                    cursor: pointer;
+                }
+                &.active a, a:hover {
+                    color: #999;
+                    text-decoration: none;
+                }
+            }
+        }
     }
 }
 
 .archetypeEditor, .archetypeConfig {
     .archetypeEditorControls {
         float: right;
-
+    }
+    .archetypeEditorControls, .archetypeFieldsetGroups {
         i {
             cursor: pointer;
             &.handle {
@@ -268,6 +306,29 @@
 .archetypeConfig {
     margin-bottom: 20px;
 
+    .archetype-headline {
+
+        img {
+            margin-right: 5px;
+        }
+
+        small {
+            margin-left: 5px;
+        }
+        
+        a {
+            float: right;
+            
+            img {
+                width: 35px;
+            }
+        }
+    }
+
+    .manual-link {
+        color: blue;
+    }
+
     ul {
         list-style: none;
     }
@@ -349,13 +410,41 @@
     }
 
     .archetypeAdvancedOptions {
-        margin-top: 15px;
-        div {
-            margin-bottom: 10px;
-        }
         label {
-            width: 400px;
+            width: 100%;
         }
+
+        input[type=checkbox] {
+            margin-top: 0;
+            margin-right: 2px;
+        }
+
+        small {
+            color: #b3b3b3;
+        }
+
+        .archetypeFieldsetGroups {
+            padding: 0 10px;
+            margin-bottom: 20px;
+
+            ul {
+                padding: 0;
+                margin: 0;
+                margin-top: 15px;
+
+                li {
+
+                    label {
+                        width: 120px;
+                    }
+
+                    input {
+                        vertical-align: middle;
+                        width: 240px;
+                    }
+                }
+            }
+        }        
     }
 
     .archetypeMaxFieldsets{
@@ -389,3 +478,7 @@
     visibility: visible !important;
     background-color:   #d0e7f1 !important;
 }
+
+.archetype-dialog {
+    margin: 10px;
+}

app/resources/archetypePropertyEditorResource.js

@@ -31,6 +31,11 @@ angular.module('umbraco.resources').factory('archetypePropertyEditorResource', f
 
                 return "";
             });
+        },
+        getDllVersion: function() {
+            return umbRequestHelper.resourcePromise(
+                $http.get("backoffice/ArchetypeApi/ArchetypeDataType/GetDllVersion", { cache: true }), 'Failed to retrieve dll version'
+            );
         }
     }
 }); 

app/views/archetype.config.developer.dialog.html

@@ -0,0 +1,33 @@
+{{VERSION_HTML}}
+<div class="umb-panel archetype-dialog archetypeConfig" ng-controller="ArchetypeConfigOptionsController">
+    <div class="umb-panel-body no-header with-footer umb-scrollable archetypeAdvancedOptions">
+        <h3><archetype-localize key="developer_options">Developer Options</archetype-localize></h3>
+        <div>
+            <label for="archetypeAdvancedOptionsDeepDatatypeRequest"><input type="checkbox" id="archetypeAdvancedOptionsDeepDatatypeRequest" ng-model="model.enableDeepDatatypeRequests"/><archetype-localize key="deepDatatypeRequest">Enable Deep Datatype Requests?</archetype-localize><small><archetype-localize key="deepDatatypeRequestDescription">Allows for easier datatype interception at the cost of caching performance.</archetype-localize></small></label>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsDeveloperMode"><input type="checkbox" id="archetypeAdvancedOptionsDeveloperMode" ng-model="model.developerMode"/><archetype-localize key="toggleDeveloperMode">Enable Developer Mode?</archetype-localize><small><archetype-localize key="toggleDeveloperModeDescription">Toggle Developer Mode</archetype-localize></small></label>
+        </div>
+        <div>
+            <label for="archetypeOverrideDefaultConverter"><input type="checkbox" id="archetypeOverrideDefaultConverter" ng-model="model.overrideDefaultPropertyValueConverter" /><archetype-localize key="overrideDefaultConverter">Override Default Property Value Converter?</archetype-localize><small><archetype-localize key="overrideDefaultConverterDescription">Check this if you wish to use your own custom property value converter.</archetype-localize></small></label>
+        </div>
+
+        <div>
+            <label for="archetypeAdvancedOptionsConfigModel"><archetype-localize key="configModel">Config Model</archetype-localize><small><archetype-localize key="configModelDescription">Be careful editing the text below, it controls the schema for this archetype.</archetype-localize></small></label>
+            <textarea class="archetypeDeveloperModel" id="archetypeAdvancedOptionsConfigModel" ng-model="model"></textarea>
+        </div>
+    </div>
+    <div class="umb-panel-footer">
+        <div class="umb-el-wrap umb-panel-buttons">
+            <div class="btn-toolbar umb-btn-toolbar pull-right">
+                <a href="" ng-click="close()" class="btn btn-link">
+                    <localize key="general_cancel" class="ng-isolate-scope ng-scope">Cancel</localize>
+                </a>
+
+                <button class="btn btn-primary" ng-click="apply()">
+                    <archetype-localize key="button_apply">Apply</archetype-localize>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>

app/views/archetype.config.fieldset.dialog.html

@@ -0,0 +1,66 @@
+{{VERSION_HTML}}
+<div class="umb-panel archetype-dialog archetypeConfig" ng-controller="ArchetypeConfigOptionsController">
+    <div class="umb-panel-body no-header with-footer umb-scrollable archetypeAdvancedOptions">
+        <h3><archetype-localize key="global_fieldset_options">Global Fieldset Options</archetype-localize></h3>
+        <div>
+            <label for="archetypeAdvancedOptionsStartWithAddButton"><input type="checkbox" id="archetypeAdvancedOptionsStartWithAddButton" ng-model="model.startWithAddButton"/><archetype-localize key="startWithAddButton">Start With Add Button?</archetype-localize><small><archetype-localize key="startWithAddButtonDescription">Empty property shows an add button instead of providing a default fieldset.</archetype-localize></small></label>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsHideLabels"><input type="checkbox" id="archetypeAdvancedOptionsHideLabels" ng-model="model.hidePropertyLabels"/><archetype-localize key="hidePropertyLabels">Hide Property Labels?</archetype-localize><small><archetype-localize key="hidePropertyLabelsDescription">Hides the property labels.</archetype-localize></small></label>       
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsCollapsing"><input type="checkbox" id="archetypeAdvancedOptionsCollapsing" ng-model="model.enableCollapsing"/><archetype-localize key="enableCollapsing">Enable Collapsing?</archetype-localize><small><archetype-localize key="enableCollapsingDescription">Enable fieldset collapsing.</archetype-localize></small></label>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsMaxFieldsets"><archetype-localize key="maxFieldsets">Max Fieldsets</archetype-localize><small><archetype-localize key="maxFieldsetsDescription">How many Fieldsets are allowed? Entering '1' will disable the controls. Default is unlimited.</archetype-localize></small></label>
+            <input type="number" id="archetypeAdvancedOptionsMaxFieldsets" class="archetypeMaxFieldsets" ng-model="model.maxFieldsets"/>
+        </div>
+
+        <h4><archetype-localize key="fieldsetControls">Fieldset controls</archetype-localize></h4>
+        <div>
+            <label for="archetypeAdvancedOptionsHideControls"><input type="checkbox" id="archetypeAdvancedOptionsHideControls" ng-model="model.hideFieldsetControls"/><archetype-localize key="hideFieldsetControls">Hide Fieldset Controls?</archetype-localize><small><archetype-localize key="hideFieldsetControlsDescription">Hides the fieldset add/remove/sort controls.</archetype-localize></small></label>
+        </div>
+
+        <div>
+            <label for="archetypeAdvancedOptionsCloning"><input type="checkbox" id="archetypeAdvancedOptionsCloning" ng-model="model.enableCloning"/><archetype-localize key="enableCloning">Enable Cloning?</archetype-localize><small><archetype-localize key="enableCloningDescription">Enable fieldset cloning.</archetype-localize></small></label>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsDisabling"><input type="checkbox" id="archetypeAdvancedOptionsDisabling" ng-model="model.enableDisabling" /><archetype-localize key="enableDisabling">Enable Fieldset Disabling?</archetype-localize><small><archetype-localize key="enableDisablingDescription">Allows fieldsets to be individually enabled/disabled.</archetype-localize></small></label>
+        </div>
+        
+        <h4><archetype-localize key="multipleFieldsets">Multiple fieldsets</archetype-localize></h4>
+        <div>
+            <label for="archetypeAdvancedOptionsMultipleFieldsets"><input type="checkbox" id="archetypeAdvancedOptionsMultipleFieldsets" ng-model="model.enableMultipleFieldsets"/><archetype-localize key="enableMultipleFieldsets">Enable Multiple Fieldsets?</archetype-localize><small><archetype-localize key="enableMultipleFieldsetsDescription">Allows multiple types of fieldsets within this archetype.</archetype-localize></small></label>
+        </div>
+
+        <div ng-show="model.enableMultipleFieldsets">
+            <label><archetype-localize key="fieldsetGroups">Fieldset groups</archetype-localize></label>
+            <small><archetype-localize key="fieldsetGroupsDescription">If you have a lot of fieldsets to choose from, you may want to consider grouping them in the fieldset picker. Once you have created your groups here, a group picker will be displayed in the fieldset editor and you can assign your fieldsets to their respective groups.</archetype-localize></small>
+            <div class="archetypeFieldsetGroups">
+              <ul ui-sortable="sortableOptions" ng-model="model.fieldsetGroups">
+                  <li ng-repeat="fieldsetGroup in model.fieldsetGroups">
+                      <div>
+                          <input id="archetypeFieldsetGroupName_{{$index}}" type="text" ng-model="fieldsetGroup.name" />
+                          <i class="icon icon-delete" ng-click="removeFieldsetGroup($index)"></i>
+                          <i class="icon icon-navigation handle" ng-show="model.fieldsetGroups.length > 1"></i>
+                      </div>
+                  </li>
+              </ul>
+              <label ng-click="addFieldsetGroup($index)"><i class="icon icon-add"></i> <archetype-localize key="addFieldsetGroup">Add fieldset group</archetype-localize></label>
+            </div>
+        </div>
+    </div>
+    <div class="umb-panel-footer">
+        <div class="umb-el-wrap umb-panel-buttons">
+            <div class="btn-toolbar umb-btn-toolbar pull-right">
+                <a href="" ng-click="close()" class="btn btn-link">
+                    <localize key="general_cancel" class="ng-isolate-scope ng-scope">Cancel</localize>
+                </a>
+
+                <button class="btn btn-primary" ng-click="apply()">
+                    <archetype-localize key="button_apply">Apply</archetype-localize>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>

app/views/archetype.config.html

@@ -1,4 +1,8 @@
+{{VERSION_HTML}}
 <div class="archetypeConfig" ng-controller="Imulus.ArchetypeConfigController">
+    <h2 class="archetype-headline"><img src="../App_Plugins/Archetype/assets/logo_50.png"/>Archetype<small>{{dllVersion}}</small><a href="https://twitter.com/archetypekit" target="_blank"><img src="../App_Plugins/Archetype/assets/twitter.png"/></a></h2>
+    <p>At a minimum your Archetype needs at least one fieldset with at least one property. You can configure it to allow for multiple types of fieldsets within a single Archetype and you can even add another Archetype as a property. Please use the link below for the full manual:</p>
+    <p><a class="manual-link" href="https://github.com/kgiszewski/ArchetypeManual" target="_blank">Archetype Manual</a></p>
     <ul class="archetypeFieldsets" ui-sortable="sortableOptions" ng-model="archetypeConfigRenderModel.fieldsets">
         <li ng-repeat="fieldset in archetypeConfigRenderModel.fieldsets" ng-hide="fieldset.remove">
             <div class="archetypeFieldsetWrapper" >
@@ -17,6 +21,10 @@
                         <label for="archetypeFieldAlias_{{$index}}"><archetype-localize key="alias">Alias</archetype-localize></label>
                         <input type="text" id="archetypeFieldAlias_{{$index}}" ng-model="fieldset.alias" on-keyup="markAliasDirty(this)" required/>
                     </div>
+                    <div class="archetypeFieldsetOption" ng-show="archetypeConfigRenderModel.fieldsetGroups.length">
+                        <label for="archetypeFieldsetGroup_{{$index}}"><archetype-localize key="fieldsetGroup">Group</archetype-localize></label>
+                        <select id="archetypeFieldsetGroup_{{$index}}" ng-model="fieldset.group" ng-options="fieldsetGroup as fieldsetGroup.name for fieldsetGroup in archetypeConfigRenderModel.fieldsetGroups"></select>
+                    </div>
                     <div class="archetypeFieldsetOption">
                         <label for="archetypeFieldLabelTemplate_{{$index}}"><archetype-localize key="labelTemplate">Label Template</archetype-localize></label>
                         <input type="text" id="archetypeFieldLabelTemplate_{{$index}}" ng-model="fieldset.labelTemplate" />
@@ -79,79 +87,9 @@
 
     <div class="archetypeOptions">
         <div>
-            <label for="archetypeOptionsToggle"><archetype-localize key="toggleAdvanced">Toggle Advanced Options</archetype-localize><small><archetype-localize key="toggleAdvancedDescription">Show advanced options.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeOptionsToggle" ng-model="archetypeConfigRenderModel.showAdvancedOptions"/>
-        </div>
-    </div>
-
-    <div class="archetypeAdvancedOptions" ng-show="archetypeConfigRenderModel.showAdvancedOptions">
-        <div>
-            <label for="archetypeAdvancedOptionsStartWithAddButton"><archetype-localize key="startWithAddButton">Start With Add Button?</archetype-localize><small><archetype-localize key="startWithAddButtonDescription">Empty property shows an add button instead of providing a default fieldset.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsStartWithAddButton" ng-model="archetypeConfigRenderModel.startWithAddButton"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsHideControls"><archetype-localize key="hideFieldsetControls">Hide Fieldset Controls?</archetype-localize><small><archetype-localize key="hideFieldsetControlsDescription">Hides the fieldset add/remove/sort controls.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsHideControls" ng-model="archetypeConfigRenderModel.hideFieldsetControls"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsHideLabels"><archetype-localize key="hidePropertyLabels">Hide Property Labels?</archetype-localize><small><archetype-localize key="hidePropertyLabelsDescription">Hides the property labels.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsHideLabels" ng-model="archetypeConfigRenderModel.hidePropertyLabels"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsMaxFieldsets"><archetype-localize key="maxFieldsets">Max Fieldsets</archetype-localize><small><archetype-localize key="maxFieldsetsDescription">How many Fieldsets are allowed? Entering '1' will disable the controls. Default is unlimited.</archetype-localize></small></label>
-            <input type="number" id="archetypeAdvancedOptionsMaxFieldsets" class="archetypeMaxFieldsets" ng-model="archetypeConfigRenderModel.maxFieldsets"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsMultipleFieldsets"><archetype-localize key="enableMultipleFieldsets">Enable Multiple Fieldsets?</archetype-localize><small><archetype-localize key="enableMultipleFieldsetsDescription">Allows multiple types of fieldsets within this archetype.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsMultipleFieldsets" ng-model="archetypeConfigRenderModel.enableMultipleFieldsets"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsCollapsing"><archetype-localize key="enableCollapsing">Enable Collapsing?</archetype-localize><small><archetype-localize key="enableCollapsingDescription">Enable fieldset collapsing.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsCollapsing" ng-model="archetypeConfigRenderModel.enableCollapsing"/>
-        </div>
-                <div>
-            <label for="archetypeAdvancedOptionsCloning"><archetype-localize key="enableCloning">Enable Cloning?</archetype-localize><small><archetype-localize key="enableCloningDescription">Enable fieldset cloning.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsCloning" ng-model="archetypeConfigRenderModel.enableCloning"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsDisabling"><archetype-localize key="enableDisabling">Enable Fieldset Disabling?</archetype-localize><small><archetype-localize key="enableDisablingDescription">Allows fieldsets to be individually enabled/disabled.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsDisabling" ng-model="archetypeConfigRenderModel.enableDisabling" />
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsFieldsetToolbar"><archetype-localize key="hideFieldsetToolbar">Hide Fieldset Toolbar?</archetype-localize><small><archetype-localize key="hideFieldsetToolbarDescription">Hides the fieldset toolbar that appears when more than one fieldset model appears.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsFieldsetToolbar" ng-model="archetypeConfigRenderModel.hideFieldsetToolbar"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsCustomClass"><archetype-localize key="customWrapperClass">Custom Wrapper Class</archetype-localize><small><archetype-localize key="customWrapperClassDescription">(Optional) Enter a custom CSS class that will be applied to the wrapper div.</archetype-localize></small></label>
-            <input type="text" id="archetypeAdvancedOptionsCustomClass" ng-model="archetypeConfigRenderModel.customCssClass"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsCustomCss"><archetype-localize key="cssFile">CSS File</archetype-localize><small><archetype-localize key="cssFileDescription">(Optional) Enter a path for a custom CSS file to be included on the page.</archetype-localize></small></label>
-            <input type="text" id="archetypeAdvancedOptionsCustomCss" ng-model="archetypeConfigRenderModel.customCssPath"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsCustomJs"><archetype-localize key="jsFile">JS File</archetype-localize><small><archetype-localize key="jsFileDescription">(Optional) Enter a path for a custom JS file to be included on the page.</archetype-localize></small></label>
-            <input type="text" id="archetypeAdvancedOptionsCustomJs" ng-model="archetypeConfigRenderModel.customJsPath"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsCustomView"><archetype-localize key="viewFile">View File</archetype-localize><small><archetype-localize key="viewFileDescription">(Optional) Enter a path for a custom view file to be used to render this Archetype.</archetype-localize></small></label>
-            <input type="text" id="archetypeAdvancedOptionsCustomView" ng-model="archetypeConfigRenderModel.customViewPath"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsDeepDatatypeRequest"><archetype-localize key="deepDatatypeRequest">Enable Deep Datatype Requests?</archetype-localize><small><archetype-localize key="deepDatatypeRequestDescription">Allows for easier datatype interception at the cost of caching performance.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsDeepDatatypeRequest" ng-model="archetypeConfigRenderModel.enableDeepDatatypeRequests"/>
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsDeveloperMode"><archetype-localize key="toggleDeveloperMode">Enable Developer Mode?</archetype-localize><small><archetype-localize key="toggleDeveloperModeDescription">Toggle Developer Mode</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeAdvancedOptionsDeveloperMode" ng-model="archetypeConfigRenderModel.developerMode"/>
-        </div>
-        <div>
-            <label for="archetypeOverrideDefaultConverter"><archetype-localize key="overrideDefaultConverter">Override Default Property Value Converter?</archetype-localize><small><archetype-localize key="overrideDefaultConverterDescription">Check this if you wish to use your own custom property value converter.</archetype-localize></small></label>
-            <input type="checkbox" id="archetypeOverrideDefaultConverter" ng-model="archetypeConfigRenderModel.overrideDefaultPropertyValueConverter" />
-        </div>
-        <div>
-            <label for="archetypeAdvancedOptionsConfigModel"><archetype-localize key="configModel">Config Model</archetype-localize><small><archetype-localize key="configModelDescription">Be careful editing the text below, it controls the schema for this archetype.</archetype-localize></small></label>
-            <textarea class="archetypeDeveloperModel" id="archetypeAdvancedOptionsConfigModel" ng-model="archetypeConfigRenderModel"></textarea>
+            <button class="btn btn-default" ng-click="showOptions($event, '../App_Plugins/archetype/views/archetype.config.fieldset.dialog.html')"><archetype-localize key="global_fieldset_options">Global Fieldset Options</archetype-localize></button>
+            <button class="btn btn-default" ng-click="showOptions($event, '../App_Plugins/archetype/views/archetype.config.stylescript.dialog.html')"><archetype-localize key="custom_style_script_options">Custom Style/Script Options</archetype-localize></button>
+            <button class="btn btn-default" ng-click="showOptions($event, '../App_Plugins/archetype/views/archetype.config.developer.dialog.html')"><archetype-localize key="developer_options">Developer Options</archetype-localize></button>
         </div>
     </div>
 </div>

app/views/archetype.config.stylescript.dialog.html

@@ -0,0 +1,35 @@
+{{VERSION_HTML}}
+<div class="umb-panel archetype-dialog archetypeConfig" ng-controller="ArchetypeConfigOptionsController">
+    <div class="umb-panel-body no-header with-footer umb-scrollable archetypeAdvancedOptions">
+        <h3><archetype-localize key="custom_style_script_options">Custom Style/Script Options</archetype-localize></h3>
+        <div>
+            <label for="archetypeAdvancedOptionsCustomClass"><archetype-localize key="customWrapperClass">Custom Wrapper Class</archetype-localize><small><archetype-localize key="customWrapperClassDescription">(Optional) Enter a custom CSS class that will be applied to the wrapper div.</archetype-localize></small></label>
+            <input type="text" id="archetypeAdvancedOptionsCustomClass" ng-model="model.customCssClass"/>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsCustomCss"><archetype-localize key="cssFile">CSS File</archetype-localize><small><archetype-localize key="cssFileDescription">(Optional) Enter a path for a custom CSS file to be included on the page.</archetype-localize></small></label>
+            <input type="text" id="archetypeAdvancedOptionsCustomCss" ng-model="model.customCssPath"/>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsCustomJs"><archetype-localize key="jsFile">JS File</archetype-localize><small><archetype-localize key="jsFileDescription">(Optional) Enter a path for a custom JS file to be included on the page.</archetype-localize></small></label>
+            <input type="text" id="archetypeAdvancedOptionsCustomJs" ng-model="model.customJsPath"/>
+        </div>
+        <div>
+            <label for="archetypeAdvancedOptionsCustomView"><archetype-localize key="viewFile">View File</archetype-localize><small><archetype-localize key="viewFileDescription">(Optional) Enter a path for a custom view file to be used to render this Archetype.</archetype-localize></small></label>
+            <input type="text" id="archetypeAdvancedOptionsCustomView" ng-model="model.customViewPath"/>
+        </div>
+    </div>
+    <div class="umb-panel-footer">
+        <div class="umb-el-wrap umb-panel-buttons">
+            <div class="btn-toolbar umb-btn-toolbar pull-right">
+                <a href="" ng-click="close()" class="btn btn-link">
+                    <localize key="general_cancel" class="ng-isolate-scope ng-scope">Cancel</localize>
+                </a>
+
+                <button class="btn btn-primary" ng-click="apply()">
+                    <archetype-localize key="button_apply">Apply</archetype-localize>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>

app/views/archetype.default.html

@@ -1,3 +1,4 @@
+{{VERSION_HTML}}
 <div class="archetypeEditor ng-class:model.config.customCssClass">
     <textarea class="archetypeDeveloperModel" ng-show="model.config.developerMode" ng-model="model.value"></textarea>
     <ul ui-sortable="sortableOptions" ng-model="model.value.fieldsets" ng-show="!showAddButton()">
@@ -46,13 +47,20 @@
             <archetype-localize key="addFieldset">Add an item</archetype-localize>
         </a>
     </div>
-    <div class="usky-grid fieldsetPicker" ng-if="overlayMenu.show">
+    <div class="usky-grid fieldsetPicker" ng-class="{withGroups: overlayMenu.fieldsetGroups.length > 1}" ng-if="overlayMenu.show">
         <div class="cell-tools-menu" ng-style="overlayMenu.style" delayed-mouseleave="closeFieldsetPicker()" archetype-click-outside="closeFieldsetPicker()">
             <h5>
                 <archetype-localize key="addFieldset">Add an item</archetype-localize>
             </h5>
+            <ul class="groups" ng-show="overlayMenu.fieldsetGroups.length > 1">
+                <li ng-repeat="fieldsetGroup in overlayMenu.fieldsetGroups" ng-class="{active: fieldsetGroup == overlayMenu.activeFieldsetGroup}">
+                    <a ng-click="overlayMenu.activeFieldsetGroup = fieldsetGroup">
+                        {{fieldsetGroup.name}}
+                    </a>
+                </li>
+            </ul>
             <ul class="elements">
-                <li ng-repeat="fieldset in overlayMenu.fieldsets">
+                <li ng-repeat="fieldset in overlayMenu.activeFieldsetGroup.fieldsets">
                     <a ng-click="pickFieldset(fieldset.alias, overlayMenu.index)" href>
                         <i class="icon {{fieldset.icon}}"></i>
                         {{fieldset.label}}

app/views/archetype.html

@@ -1 +1,2 @@
+{{VERSION_HTML}}
 <div archetype-custom-view ng-controller="Imulus.ArchetypeController"></div>

config/meta.json

@@ -1,6 +1,6 @@
 {
 	"name": "Archetype",
-	"version": "1.10-ui-rc1",
+	"version": "1.11",
 	"url": "http://github.com/imulus/archetype/",
 	"author": "Imulus - Kevin Giszewski - Tom Fulton - Lee Kelleher - Matt Brailsford - Kenn Jacobsen - Et. Al.",
 	"authorUrl": "http://imulus.com/",

config/package.nuspec

@@ -12,7 +12,7 @@
         <iconUrl>http://github.com/imulus/archetype/raw/master/assets/logo.png</iconUrl>
         <licenseUrl><%= licenseUrl %></licenseUrl>
         <dependencies>
-            <dependency id="UmbracoCms.Core" version="7.1.6" />
+            <dependency id="UmbracoCms.Core" version="7.2.2" />
         </dependencies>
     </metadata>
 </package>

package.json

@@ -29,6 +29,7 @@
     "url": "https://github.com/imulus/Archetype.git"
   },
   "devDependencies": {
-    "grunt-msbuild": "^0.1.12"
+    "grunt-msbuild": "^0.1.12",
+    "grunt-string-replace": "^1.2.0"
   }
 }