Merge branch 'wip-u4-3951' of https://github.com/AndyButland/Umbraco-CMS into AndyButland-wip-u4-3951

Conflicts:
	src/Umbraco.Web.UI.Client/src/views/prevalueeditors/multivalues.html

src/Umbraco.Core/Models/PreValue.cs

@@ -5,10 +5,17 @@
     /// </summary>
     public class PreValue
     {
+        public PreValue(int id, string value, int sortOrder)
+        {
+            Id = id;
+            Value = value;       
+            SortOrder = sortOrder;
+        }
+
         public PreValue(int id, string value)
         {
-            Value = value;
-            Id = id;
+            Id = id; 
+            Value = value;            
         }
 
         public PreValue(string value)
@@ -25,5 +32,10 @@
         /// The database id for the pre-value field value
         /// </summary>
         public int Id { get; private set; }
+
+        /// <summary>
+        /// The sort order stored for the pre-value field value
+        /// </summary>
+        public int SortOrder { get; private set; }
     }
 }

src/Umbraco.Core/Services/DataTypeService.cs

@@ -138,7 +138,7 @@ namespace Umbraco.Core.Services
             using (var uow = _uowProvider.GetUnitOfWork())
             {
                 var dtos = uow.Database.Fetch<DataTypePreValueDto>("WHERE datatypeNodeId = @Id", new { Id = id });
-                var list = dtos.Select(x => new Tuple<PreValue, string, int>(new PreValue(x.Id, x.Value), x.Alias, x.SortOrder)).ToList();
+                var list = dtos.Select(x => new Tuple<PreValue, string, int>(new PreValue(x.Id, x.Value, x.SortOrder), x.Alias, x.SortOrder)).ToList();
 
                 return PreValueConverter.ConvertToPreValuesCollection(list);
             }

src/Umbraco.Web.UI.Client/src/views/prevalueeditors/multivalues.controller.js

@@ -7,20 +7,25 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiValuesControl
         $scope.hasError = false;
        
         if (!angular.isArray($scope.model.value)) {
+
             //make an array from the dictionary
             var items = [];
             for (var i in $scope.model.value) { 
                 items.push({
-                    value: $scope.model.value[i],
+                    value: $scope.model.value[i].value,
+                    sortOrder: $scope.model.value[i].sortOrder,
                     id: i
                 });
             }
+
+            //ensure the items are sorted by the provided sort order
+            items.sort(function (a, b) { return (a.sortOrder > b.sortOrder) ? 1 : ((b.sortOrder > a.sortOrder) ? -1 : 0); });
+            
             //now make the editor model the array
             $scope.model.value = items;
         }
 
         $scope.remove = function(item, evt) {
-
             evt.preventDefault();
 
             $scope.model.value = _.reject($scope.model.value, function (x) {
@@ -30,7 +35,6 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiValuesControl
         };
 
         $scope.add = function (evt) {
-            
             evt.preventDefault();
             
             
@@ -47,4 +51,36 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiValuesControl
             $scope.hasError = true;            
         };
 
+        $scope.sortableOptions = {
+            axis: 'y',
+            containment: 'parent',
+            cursor: 'move',
+            items: '> div.control-group',
+            tolerance: 'pointer',
+            update: function (e, ui) {
+                // Get the new and old index for the moved element (using the text as the identifier, so 
+                // we'd have a problem if two prevalues were the same, but that would be unlikely)
+                var newIndex = ui.item.index();
+                var movedPrevalueText = $('input[type="text"]', ui.item).val();
+                var originalIndex = getElementIndexByPrevalueText(movedPrevalueText);
+
+                // Move the element in the model
+                if (originalIndex > -1) {
+                    var movedElement = $scope.model.value[originalIndex];
+                    $scope.model.value.splice(originalIndex, 1);
+                    $scope.model.value.splice(newIndex, 0, movedElement);
+                }
+            }
+        };
+
+        function getElementIndexByPrevalueText(value) {
+            for (var i = 0; i < $scope.model.value.length; i++) {
+                if ($scope.model.value[i].value === value) {
+                    return i;
+                }
+            }
+
+            return -1;
+        }
+
     });

src/Umbraco.Web.UI.Client/src/views/prevalueeditors/multivalues.html

@@ -3,10 +3,11 @@
         <input name="newItem" type="text" ng-model="newItem" val-highlight="hasError" />
         <button class="btn btn-small" ng-click="add($event)">Add</button>
     </div>
-    <div class="control-group" ng-repeat="item in model.value">
-        <input type="text" ng-model="item.value" val-server="item_{{$index}}" required />
-        <button class="btn btn-small btn-danger" ng-click="remove(item, $event)">Remove</button>
+    <div ui-sortable="sortableOptions">
+        <div class="control-group" ng-repeat="item in model.value">
+            <i class="icon icon-navigation handle"></i>
+            <input type="text" ng-model="item.value" val-server="item_{{$index}}" required />
+            <button class="btn btn-small btn-danger" ng-click="remove(item, $event)">Remove</button>
+        </div>
     </div>
-
 </div>
-

src/Umbraco.Web/PropertyEditors/ValueListPreValueEditor.cs

@@ -64,7 +64,17 @@ namespace Umbraco.Web.PropertyEditors
             var arrayOfVals = dictionary.Select(item => item.Value).ToList();
 
             //the items list will be a dictionary of it's id -> value we need to use the id for persistence for backwards compatibility
-            return new Dictionary<string, object> { { "items", arrayOfVals.ToDictionary(x => x.Id, x => x.Value) } };
+            return new Dictionary<string, object> { { "items", arrayOfVals.ToDictionary(x => x.Id, x => PreValueAsDictionary(x)) } };
+        }
+
+        /// <summary>
+        /// Formats the prevalue as a dictionary (as we need to return not just the value, but also the sort-order, to the client)
+        /// </summary>
+        /// <param name="preValue">The prevalue to format</param>
+        /// <returns>Dictionary object containing the prevalue formatted with the field names as keys and the value of those fields as the values</returns>
+        private IDictionary<string, object> PreValueAsDictionary(PreValue preValue)
+        {
+            return new Dictionary<string, object>() { { "value", preValue.Value }, {"sortOrder", preValue.SortOrder } };
         }
 
         /// <summary>