Render create view

Load object types from API

src/Umbraco.Web.UI.Client/src/common/resources/relationtype.resource.js

@@ -38,6 +38,25 @@ function relationTypeResource($q, $http, umbRequestHelper, umbDataFormatter) {
             );
         },
 
+        /**
+         * @ngdoc method
+         * @name umbraco.resources.relationTypeResource#getRelationObjectTypes
+         * @methodof umbraco.resources.relationTypeResource
+         *
+         * @description
+         * Gets a list of Umbraco object types which can be associated with a relation.
+         *
+         * @returns {Object} A collection of Umbraco object types.
+         */
+        getRelationObjectTypes: function() {
+            return umbRequestHelper.resourcePromise(
+                $http.get(
+                    umbRequestHelper.getApiUrl("relationTypeApiBaseUrl", "GetRelationObjectTypes")
+                ),
+                "Failed to get object types"
+            );
+        },
+
         /**
          * @ngdoc method
          * @name umbraco.resources.relationTypeResource#save

src/Umbraco.Web.UI.Client/src/views/relationtypes/create.controller.js

@@ -1,5 +1,43 @@
-function RelationTypeCreateController($scope) {
+function RelationTypeCreateController($scope, relationTypeResource, navigationService, formHelper, appState) {
     var vm = this;
+    vm.relationType = {};
+    vm.objectTypes = {};
+
+    vm.createRelationType = createRelationType;
+
+    init();
+
+    function init() {
+        relationTypeResource.getRelationObjectTypes().then(function (data) {
+            vm.objectTypes = data;
+        }, function (err) {
+            alert("oh no");
+        })
+    }
+
+    function createRelationType() {
+        if (formHelper.submitForm({ scope: $scope, formCtrl: this.createRelationTypeForm, statusMessage: "Creating relation type..." })) {
+            var node = $scope.dialogOptions.currentNode;
+
+            relationTypeResource.create(vm.relationType).then(function (data) {
+                navigationService.hideMenu();
+
+                // Set the new item as active in the tree
+                var currentPath = node.path ? node.path : "-1";
+                navigationService.syncTree({ tree: "relationType", path: currentPath + "," + data, forceReload: true, activate: true });
+
+                formHelper.resetForm({ scope: $scope });
+
+                var currentSection = appState.getSectionState("currentSection");
+                $location.path("/" + currentSection + "/relationTypes/edit/" + data);
+            }, function (err) {
+                if (err.data && err.data.message) {
+                    notificationsService.error(err.data.message);
+                    navigationService.hideMenu();
+                }
+            });
+        }
+    }
 }
 
 angular.module("umbraco").controller("Umbraco.Editors.RelationTypes.CreateController", RelationTypeCreateController);

src/Umbraco.Web.UI.Client/src/views/relationtypes/create.html

@@ -1,9 +1,9 @@
 <div class="umbracoDialog umb-dialog-body with-footer" ng-controller="Umbraco.Editors.RelationTypes.CreateController as vm" ng-cloak>
     <div class="umb-pane">
-        <form novalidate name="createRelationTypeForm" val-form-manager>
+        <form name="createRelationTypeForm" val-form-manager ng-submit="vm.createRelationType()">
             <!-- Name -->
             <umb-control-group label="Name">
-                <input type="text" name="relationTypeName" class="umb-textstring textstring input-block-level" umb-auto-focus required />
+                <input type="text" name="relationTypeName" ng-model="vm.relationType.name" class="umb-textstring textstring input-block-level" umb-auto-focus required />
             </umb-control-group>
 
             <!-- Direction -->
@@ -11,13 +11,13 @@
                 <ul class="unstyled">
                     <li>
                         <label class="radio">
-                            <input type="radio" name="relationType-direction" ng-value="false">
+                            <input type="radio" name="relationType-direction" ng-model="vm.relationType.isBidirectional" ng-value="false">
                             Parent to child
                         </label>
                     </li>
                     <li>
                         <label class="radio">
-                            <input type="radio" name="relationType-direction" ng-value="true">
+                            <input type="radio" name="relationType-direction" ng-model="vm.relationType.isBidirectional" ng-value="true">
                             Bidirectional
                         </label>
                     </li>
@@ -26,25 +26,21 @@
 
             <!-- Parent -->
             <umb-control-group label="Parent">
-                <select name="relationType-parent" class="umb-property-editor umb-dropdown">
-                    <option>Document</option>
-                    <option>Media</option>
-                    <option>Member</option>
-                    <option>Media Type</option>
-                    <option>Member Type</option>
-                    <option>Document Type</option>
+                <select name="relationType-parent"
+                        ng-model="vm.relationType.parent"
+                        ng-options="objectType.name for objectType in vm.objectTypes track by objectType.id"
+                        class="umb-property-editor umb-dropdown"
+                        required>
                 </select>
             </umb-control-group>
 
             <!-- Child -->
             <umb-control-group label="Child">
-                <select name="relationType-child" class="umb-property-editor umb-dropdown">
-                    <option>Document</option>
-                    <option>Media</option>
-                    <option>Member</option>
-                    <option>Media Type</option>
-                    <option>Member Type</option>
-                    <option>Document Type</option>
+                <select name="relationType-child"
+                        ng-model="vm.relationType.child"
+                        ng-options="objectType.name for objectType in vm.objectTypes track by objectType.id"
+                        class="umb-property-editor umb-dropdown"
+                        required>
                 </select>
             </umb-control-group>
 

src/Umbraco.Web/Editors/RelationTypeController.cs

@@ -45,6 +45,30 @@ namespace Umbraco.Web.Editors
             return display;
         }
 
+        /// <summary>
+        /// Gets a list of object types which can be associated via relations.
+        /// </summary>
+        /// <returns>A list of available object types.</returns>
+        public List<ObjectType> GetRelationObjectTypes()
+        {
+            var objectTypes = new List<ObjectType>
+            {
+                new ObjectType{Id = UmbracoObjectTypes.Document.GetGuid(), Name = UmbracoObjectTypes.Document.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.Media.GetGuid(), Name = UmbracoObjectTypes.Media.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.Member.GetGuid(), Name = UmbracoObjectTypes.Member.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.DocumentType.GetGuid(), Name = UmbracoObjectTypes.DocumentType.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.MediaType.GetGuid(), Name = UmbracoObjectTypes.MediaType.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.MemberType.GetGuid(), Name = UmbracoObjectTypes.MemberType.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.DataType.GetGuid(), Name = UmbracoObjectTypes.DataType.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.MemberGroup.GetGuid(), Name = UmbracoObjectTypes.MemberGroup.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.Stylesheet.GetGuid(), Name = UmbracoObjectTypes.Stylesheet.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.ROOT.GetGuid(), Name = UmbracoObjectTypes.ROOT.GetFriendlyName()},
+                new ObjectType{Id = UmbracoObjectTypes.RecycleBin.GetGuid(), Name = UmbracoObjectTypes.RecycleBin.GetFriendlyName()},
+            };
+
+            return objectTypes;
+        }
+
         public RelationTypeDisplay PostSave(RelationTypeSave relationType)
         {
             var relationTypePersisted = Services.RelationService.GetRelationTypeById(relationType.Key);

src/Umbraco.Web/Models/ContentEditing/ObjectType.cs

@@ -0,0 +1,15 @@
+using System;
+using System.Runtime.Serialization;
+
+namespace Umbraco.Web.Models.ContentEditing
+{
+    [DataContract(Name = "objectType", Namespace = "")]
+    public class ObjectType
+    {
+        [DataMember(Name = "name")]
+        public string Name { get; set; }
+
+        [DataMember(Name = "id")]
+        public Guid Id { get; set; }
+    }
+}

src/Umbraco.Web/Umbraco.Web.csproj

@@ -148,6 +148,7 @@
     <Compile Include="Media\TypeDetector\SvgDetector.cs" />
     <Compile Include="Media\TypeDetector\TIFFDetector.cs" />
     <Compile Include="Media\UploadAutoFillProperties.cs" />
+    <Compile Include="Models\ContentEditing\ObjectType.cs" />
     <Compile Include="Models\ContentEditing\RelationDisplay.cs" />
     <Compile Include="Models\ContentEditing\RelationTypeDisplay.cs" />
     <Compile Include="Models\ContentEditing\RelationTypeSave.cs" />