refactor(Editform*): remove targetClassVe; change mount point for VE (qiuwenbaike#1702)

* refactor(Editform*): remove targetClassVe; change mount point for VE

Author: WaitSpringQW

dist/Editform_AiAssisted/Editform_AiAssisted.js

@@ -1,20 +1,18 @@
 import * as OPTIONS from '~/Editform_AiAssisted/options.json';
 import {getMessage} from './i18n';
 
-const processVisualEditor = ($body: JQuery<HTMLBodyElement>): void => {
+const processVisualEditor = (): void => {
 	// Guard against double inclusions
 	if (mw.config.get(OPTIONS.configKeyVe)) {
 		return;
 	}
 
-	const $targetElement: JQuery = $body.find(`.${OPTIONS.targetClassVe}`);
-	if (!$targetElement.length) {
-		return;
-	}
-
 	const {target} = window.ve.init;
 	const {saveDialog, saveFields} = target;
 	const {$saveCheckboxes} = saveDialog;
+	if (!$saveCheckboxes.length) {
+		return;
+	}
 
 	// Set guard
 	mw.config.set(OPTIONS.configKeyVe, true);

dist/Editform_Attribution/Editform_Attribution.js

@@ -3,6 +3,5 @@
 	"configKey": "gadget-Editform_AiAssisted__Initialized",
 	"configKeyVe": "gadget-Editform_AiAssisted__Initialized__VE",
 	"inputId": "editform_ai_assisted",
-	"targetClassVe": "ve-ui-mwSaveDialog-checkboxes",
 	"targetWikiEditor": ".editCheckboxes .oo-ui-horizontalLayout"
 }

src/Editform_AiAssisted/modules/processVisualEditor.ts

@@ -17,17 +17,17 @@ const getI18nMessages = () => {
 			'zh-hant': '許可證',
 		}),
 		'Sources and Licenses': localize({
-			en: 'Sources and Licenses',
-			'zh-hans': '内容来源及许可证',
-			'zh-hant': '內容來源及許可證',
+			en: 'Sources and licenses of third-party content',
+			'zh-hans': '第三方内容的来源及许可证',
+			'zh-hant': '第三方內容的來源及許可證',
 		}),
 		'Other License': localize({
 			en: 'Other license',
 			'zh-hans': '其他许可证',
 			'zh-hant': '其他許可證',
 		}),
 		'Replace With License': localize({
-			en: ' (Replace With license name and URL)',
+			en: ' (Replace with license name and URL)',
 			'zh-hans': '（替换为许可证名称和网址）',
 			'zh-hant': '（替換爲許可證名稱和網址）',
 		}),

src/Editform_AiAssisted/options.json

@@ -1,29 +1,26 @@
 import * as OPTIONS from '~/Editform_Attribution/options.json';
-import {generateVisualEditorCheckboxLayout} from './util/generateCheckboxLayout';
-import {getMessage} from './i18n';
+import {generateVisualEditorLayout} from './util/generateLayout';
 
 const processVisualEditor = ({$body}: {$body: JQuery<HTMLBodyElement>}): void => {
 	// Guard against double inclusions
 	if (mw.config.get(OPTIONS.configKeyVe)) {
 		return;
 	}
 
-	const $target: JQuery = $body.find(`.${OPTIONS.targetClassVe}`);
-	if (!$target.length) {
+	const {target} = window.ve.init;
+	const {saveDialog} = target;
+	const {$saveOptions} = saveDialog;
+	if (!$saveOptions.length) {
 		return;
 	}
 
+	// Set guard
 	mw.config.set(OPTIONS.configKeyVe, true);
 
-	const $layout = generateVisualEditorCheckboxLayout({
-		inputId: OPTIONS.inputId,
-		label: getMessage('ThirdPartyContentContained'),
-		// changeTag: OPTIONS.changeTag,
-		$body,
-	});
+	const $layout = generateVisualEditorLayout({$body});
 
 	if (!$body.find(`#${OPTIONS.inputId}`).length) {
-		$target.append($layout);
+		$saveOptions.append($layout);
 	}
 
 	// Reinitialization is required for switching between VisualEditor and New Wikitext Editor (2017)

src/Editform_Attribution/modules/i18n.ts

@@ -1,6 +1,5 @@
 import * as OPTIONS from '~/Editform_Attribution/options.json';
-import {generateWikiEditorCheckboxLayout} from './util/generateCheckboxLayout';
-import {getMessage} from './i18n';
+import {generateWikiEditorLayout} from './util/generateLayout';
 
 const processWikiEditor = ({$body, $editForm}: {$body: JQuery<HTMLBodyElement>; $editForm: JQuery}): void => {
 	// Guard against double inclusions
@@ -15,13 +14,7 @@ const processWikiEditor = ({$body, $editForm}: {$body: JQuery<HTMLBodyElement>;
 
 	mw.config.set(OPTIONS.configKey, true);
 
-	const $layout = generateWikiEditorCheckboxLayout({
-		inputId: OPTIONS.inputId,
-		label: getMessage('ThirdPartyContentContained'),
-		// changeTag: OPTIONS.changeTag,
-		$body,
-		$editForm,
-	});
+	const $layout = generateWikiEditorLayout({$body, $editForm});
 
 	if (!$body.find(`#${OPTIONS.inputId}`).length) {
 		$target.after($layout);

src/Editform_Attribution/modules/processVisualEditor.ts

@@ -0,0 +1,25 @@
+import * as OPTIONS from '~/Editform_Attribution/options.json';
+import {generateTextInputWithDropdown} from './generateTextInputWithDropdown';
+
+interface LayoutProps {
+	$body: JQuery<HTMLElement>;
+}
+
+const generateVisualEditorLayout = ({$body}: LayoutProps): JQuery<HTMLElement> => {
+	const {target} = window.ve.init;
+	const $wpSummary = target.saveDialog.editSummaryInput.$input;
+	const textInputWithDropdown = generateTextInputWithDropdown({$body, $wpSummary});
+	const $layout = $('<div>').attr('id', OPTIONS.inputId).append(textInputWithDropdown.$element);
+
+	return $layout;
+};
+
+const generateWikiEditorLayout = ({$body, $editForm}: LayoutProps & {$editForm: JQuery}): JQuery<HTMLElement> => {
+	const $wpSummary = $editForm.find('input[name=wpSummary]');
+	const textInputWithDropdown = generateTextInputWithDropdown({$body, $wpSummary});
+	const $layout = $('<div>').attr('id', OPTIONS.inputId).append(textInputWithDropdown.$element);
+
+	return $layout;
+};
+
+export {generateVisualEditorLayout, generateWikiEditorLayout};