Merge branch 'develop' into activitypub

public/src/admin/manage/users/custom-fields.js

@@ -0,0 +1,109 @@
+define('admin/manage/user/custom-fields', [
+	'bootbox', 'alerts', 'iconSelect', 'jquery-ui/widgets/sortable',
+], function (bootbox, alerts, iconSelect) {
+	const manageUserFields = {};
+
+	manageUserFields.init = function () {
+		const table = $('table');
+
+		table.on('click', '[data-action="edit"]', function () {
+			const row = $(this).parents('[data-key]');
+			showModal(getDataFromEl(row));
+		});
+
+		table.on('click', '[data-action="delete"]', function () {
+			const key = $(this).attr('data-key');
+			const row = $(this).parents('[data-key]');
+			bootbox.confirm(`[[admin/manage/user-custom-fields:delete-field-confirm-x, ${key}]]`, function (ok) {
+				if (!ok) {
+					return;
+				}
+				row.remove();
+			});
+		});
+
+		$('tbody').sortable({
+			handle: '[component="sort/handle"]',
+			axis: 'y',
+			zIndex: 9999,
+		});
+
+		$('#new').on('click', () => showModal());
+
+		$('#save').on('click', () => {
+			const fields = [];
+			$('tbody tr[data-key]').each((index, el) => {
+				fields.push(getDataFromEl($(el)));
+			});
+			socket.emit('admin.user.saveCustomFields', fields, function (err) {
+				if (err) {
+					alerts.error(err);
+				}
+				alerts.success('[[admin/manage/user-custom-fields:custom-fields-saved]]');
+			});
+		});
+	};
+
+	function getDataFromEl(el) {
+		return {
+			key: el.attr('data-key'),
+			name: el.attr('data-name'),
+			icon: el.attr('data-icon'),
+			type: el.attr('data-type'),
+			'select-options': el.attr('data-select-options'),
+			'min:rep': el.attr('data-min-rep'),
+		};
+	}
+
+	async function showModal(field = null) {
+		const html = await app.parseAndTranslate('admin/partials/manage-custom-user-fields-modal', field);
+
+		const modal = bootbox.dialog({
+			message: html,
+			onEscape: true,
+			title: field ?
+				'[[admin/manage/user-custom-fields:edit-field]]' :
+				'[[admin/manage/user-custom-fields:create-field]]',
+			buttons: {
+				submit: {
+					label: '[[global:save]]',
+					callback: function () {
+						const formData = modal.find('form').serializeObject();
+						if (formData.type === 'select') {
+							formData.selectOptionsFormatted = formData['select-options'].trim().split('\n').join(', ');
+						}
+
+						app.parseAndTranslate('admin/manage/users/custom-fields', 'fields', {
+							fields: [formData],
+						}, (html) => {
+							if (field) {
+								const oldKey = field.key;
+								$(`tbody [data-key="${oldKey}"]`).replaceWith(html);
+							} else {
+								$('tbody').append(html);
+							}
+						});
+					},
+				},
+			},
+		});
+
+		modal.find('#type-select').on('change', function () {
+			const type = $(this).val();
+			modal.find(`[data-input-type]`).addClass('hidden');
+			modal.find(`[data-input-type="${type}"]`).removeClass('hidden');
+		});
+
+		modal.find('#icon-select').on('click', function () {
+			iconSelect.init($(this).find('i'), function (el, icon, styles) {
+				styles.push(icon);
+				modal.find('[name="icon"]').val(styles.join(' '));
+			});
+			return false;
+		});
+	}
+
+	return manageUserFields;
+});
+
+