From: Alexander Ebert <ebert@woltlab.com>
Date: Sat, 12 Jan 2019 22:44:03 +0000 (+0100)
Subject: Improved behavior of sortable options
X-Git-Tag: 3.1.8~26
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=ddfc3823e951b4692e3842ebd0a66d52135e0635;p=GitHub%2FWoltLab%2FWCF.git

Improved behavior of sortable options
---

diff --git a/wcfsetup/install/files/acp/templates/useroptionsOptionType.tpl b/wcfsetup/install/files/acp/templates/useroptionsOptionType.tpl
index 8402b79d19..cdf84f5e50 100644
--- a/wcfsetup/install/files/acp/templates/useroptionsOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/useroptionsOptionType.tpl
@@ -1,7 +1,7 @@
 {if $option->issortable}
 	<script data-relocate="true">
 		document.addEventListener('DOMContentLoaded', function() {
-			require(['Dom/Traverse', 'Dom/Util', 'Ui/TabMenu'], function (DomTraverse, DomUtil, UiTabMenu) {
+			require(['Dom/Traverse', 'Dom/Util', 'Ui/TabMenu', 'WoltLabSuite/Core/Ui/Sortable/List'], function (DomTraverse, DomUtil, UiTabMenu, UiSortableList) {
 				var sortableList = elById('{$option->optionName}SortableList');
 				var tabMenu = UiTabMenu.getTabMenu(DomUtil.identify(DomTraverse.parentByClass(sortableList, 'tabMenuContainer')));
 				var activeTab = tabMenu.getActiveTab();
@@ -10,7 +10,12 @@
 				// the sortable list to be visible
 				tabMenu.select(elData(DomTraverse.parentByClass(sortableList, 'tabMenuContent'), 'name'));
 				
-				new WCF.Sortable.List('{$option->optionName}SortableList', null, 0, { }, true);
+				new UiSortableList({
+					containerId: '{$option->optionName}SortableList',
+					options: {
+						toleranceElement: ''
+					}
+				});
 				
 				// re-select the previously selected tab
 				tabMenu.select(null, activeTab);
@@ -23,7 +28,7 @@
 			{foreach from=$availableOptions item=availableOption}
 				<li class="sortableNode">
 					<span class="sortableNodeLabel">
-						<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$availableOption}"{if $availableOption|in_array:$value} checked{/if}> {lang}wcf.user.option.{$availableOption}{/lang}</label>
+						<span class="icon icon16 fa-arrows sortableNodeHandle"></span> <label><input type="checkbox" name="values[{$option->optionName}][]" value="{$availableOption}"{if $availableOption|in_array:$value} checked{/if}> {lang}wcf.user.option.{$availableOption}{/lang}</label>
 					</span>
 				</li>
 			{/foreach}
@@ -33,4 +38,4 @@
 	{foreach from=$availableOptions item=availableOption}
 		<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$availableOption}"{if $availableOption|in_array:$value} checked{/if}> {lang}wcf.user.option.{$availableOption}{/lang}</label>
 	{/foreach}
-{/if}
\ No newline at end of file
+{/if}