增加创建页面自动补全

extension.json

@@ -37,6 +37,7 @@
         },
         "ext.isekai.createPage": {
             "scripts": [
+                "createPage/ext.isekai.createPageInput.js",
                 "createPage/ext.isekai.createPage.js",
                 "createPage/ext.isekai.createPage.base.js"
             ],

modules/createPage/ext.isekai.createPage.base.less

@@ -2,13 +2,16 @@
 @text-size: 0.95em;
 
 .isekai-create-page {
+	&.isekai-card {
+		overflow: visible;
+	}
+
 	.card-body {
 		flex: 1 1 auto;
 		padding: 0.25em;
 		font-size: 1.25em;
 
 		.card-content {
-			overflow-y: auto;
 			padding: 1em 0.5em;
 			margin: 0 0.4em;
 			min-height: @height;
@@ -27,4 +30,9 @@
 			}
 		}
 	}
+	
+	.oo-ui-menuSelectWidget {
+		// 修复重叠问题
+		z-index: 100;
+	}
 }

modules/createPage/ext.isekai.createPage.js

@@ -1 +1 @@
-(()=>{"use strict";function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}function t(t,i){for(var r=0;r<i.length;r++){var a=i[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(t,(void 0,n=function(t,i){if("object"!==e(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var a=r.call(t,"string");if("object"!==e(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(a.key),"symbol"===e(n)?n:String(n)),a)}var n}!function(e,t){var i="ui.CreatePageWidget".split(".");"isekai"in window||(window.isekai={});for(var r=window.isekai,a=0;a<i.length-1;a++){var n=i[a];n in r||(r[n]={}),r=r[n]}r[i[a]]=t}(0,function(){function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.baseDom=t,this.pageUrl=null,this.api=new mw.Api,this.hasError=!1,this.initDom()}var i,r;return i=e,(r=[{key:"initDom",value:function(){this.pageNameInput=new OO.ui.TextInputWidget({placeholder:mw.message("isekai-createpage-page-title").parse()}),this.pageNameInput.on("enter",this.createPage.bind(this)),this.pageNameInput.on("change",this.onPageNameChange.bind(this)),this.createButton=new OO.ui.ButtonWidget({label:mw.message("isekai-createpage-create-page-button").parse(),flags:["primary","progressive"]}),this.createButton.on("click",this.createPage.bind(this)),this.formGroup=new OO.ui.ActionFieldLayout(this.pageNameInput,this.createButton,{align:"top"}),this.baseDom.find(".card-body .card-content").append(this.formGroup.$element)}},{key:"createPage",value:function(){var e=this,t=this.pageNameInput.getValue();this.hasError&&this.clearError(),t.trim().length>0?(this.createButton.setDisabled(!0),this.pageExists(t).then((function(i){if(i)e.createButton.setDisabled(!1),e.setError(mw.message("isekai-createpage-page-exists").parse());else{var r=mw.util.getUrl(t,{veaction:"edit"});e.formGroup.setSuccess([mw.message("isekai-createpage-redirecting").parse()]),location.href=r}}))):this.setError(mw.message("isekai-createpage-title-empty").parse())}},{key:"onPageNameChange",value:function(){this.hasError&&this.clearError();var e=this.pageNameInput.getValue();if(-1!==e.indexOf("：")||-1!==e.indexOf("`")){var t=this.pageNameInput.getRange();e=e.replace(/：/g,":").replace(/`/g,"·"),this.pageNameInput.setValue(e),this.pageNameInput.selectRange(t.from,t.to)}}},{key:"setError",value:function(e){this.formGroup.setErrors([e]),this.hasError=!0}},{key:"clearError",value:function(){this.formGroup.setErrors([]),this.hasError=!1}},{key:"pageExists",value:function(e){var t=this;return new Promise((function(i,r){t.api.get({action:"query",titles:e}).done((function(e){e.query&&e.query.pages?e.query.pages[-1]?i(!1):i(!0):i(!1)})).fail(r)}))}},{key:"setTitle",value:function(e){this.title.text(e)}}])&&t(i.prototype,r),Object.defineProperty(i,"prototype",{writable:!1}),e}())})();
+(()=>{"use strict";function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}function t(t,i){for(var r=0;r<i.length;r++){var a=i[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(t,(void 0,n=function(t,i){if("object"!==e(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var a=r.call(t,"string");if("object"!==e(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(a.key),"symbol"===e(n)?n:String(n)),a)}var n}!function(e,t){var i="ui.CreatePageWidget".split(".");"isekai"in window||(window.isekai={});for(var r=window.isekai,a=0;a<i.length-1;a++){var n=i[a];n in r||(r[n]={}),r=r[n]}r[i[a]]=t}(0,function(){function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.baseDom=t,this.pageUrl=null,this.api=new mw.Api,this.hasError=!1,this.initDom()}var i,r;return i=e,(r=[{key:"initDom",value:function(){this.pageNameInput=new isekai.ui.CreatePageInputWidget({placeholder:mw.message("isekai-createpage-page-title").parse()}),this.pageNameInput.on("enter",this.createPage.bind(this)),this.pageNameInput.on("change",this.onPageNameChange.bind(this)),this.createButton=new OO.ui.ButtonWidget({label:mw.message("isekai-createpage-create-page-button").parse(),flags:["primary","progressive"]}),this.createButton.on("click",this.createPage.bind(this)),this.formGroup=new OO.ui.ActionFieldLayout(this.pageNameInput,this.createButton,{align:"top"}),this.baseDom.find(".card-body .card-content").append(this.formGroup.$element)}},{key:"createPage",value:function(){var e=this,t=this.pageNameInput.getValue();this.hasError&&this.clearError(),t.trim().length>0?(this.createButton.setDisabled(!0),this.pageExists(t).then((function(i){if(i)e.createButton.setDisabled(!1),e.setError(mw.message("isekai-createpage-page-exists").parse());else{var r=mw.util.getUrl(t,{veaction:"edit"});e.formGroup.setSuccess([mw.message("isekai-createpage-redirecting").parse()]),location.href=r}}))):this.setError(mw.message("isekai-createpage-title-empty").parse())}},{key:"onPageNameChange",value:function(){this.hasError&&this.clearError();var e=this.pageNameInput.getValue();if(-1!==e.indexOf("：")||-1!==e.indexOf("`")){var t=this.pageNameInput.getRange();e=e.replace(/：/g,":").replace(/`/g,"·"),this.pageNameInput.setValue(e),this.pageNameInput.selectRange(t.from,t.to)}}},{key:"setError",value:function(e){this.formGroup.setErrors([e]),this.hasError=!0}},{key:"clearError",value:function(){this.formGroup.setErrors([]),this.hasError=!1}},{key:"pageExists",value:function(e){var t=this;return new Promise((function(i,r){t.api.get({action:"query",titles:e}).done((function(e){e.query&&e.query.pages?e.query.pages[-1]?i(!1):i(!0):i(!1)})).fail(r)}))}},{key:"setTitle",value:function(e){this.title.text(e)}}])&&t(i.prototype,r),Object.defineProperty(i,"prototype",{writable:!1}),e}())})();

modules/createPage/ext.isekai.createPageInput.js

@@ -0,0 +1,83 @@
+if ( !window.isekai ) {
+  window.isekai = {
+    ui: {}
+  };
+}
+if ( !window.isekai.ui ) {
+  window.isekai.ui = {};
+}
+
+/**
+ * Input for create page and auto complete parent page
+ * @class
+ * @extends OO.ui.TextInputWidget
+ * @mixins OO.ui.mixin.LookupElement
+ *
+ * @constructor
+ * @param {Object} config Configuration options
+ */
+isekai.ui.CreatePageInputWidget = function IsekaiUiCreatePageInputWidget( config ) {
+	// Parent constructor
+	OO.ui.TextInputWidget.call( this, config );
+	// Mixin constructors
+	OO.ui.mixin.LookupElement.call( this, config );
+
+  this.api = new mw.Api();
+
+  this.loadedPageList = [];
+};
+OO.inheritClass( isekai.ui.CreatePageInputWidget, OO.ui.TextInputWidget );
+OO.mixinClass( isekai.ui.CreatePageInputWidget, OO.ui.mixin.LookupElement );
+
+/**
+ * @inheritdoc
+ */
+isekai.ui.CreatePageInputWidget.prototype.getLookupRequest = function () {
+	var
+		value = this.getValue(),
+		deferred = $.Deferred();
+  var api = this.api;
+  var _this = this;
+	this.getValidity().then( function () {
+    api.get( {
+      action: "opensearch",
+      search: value,
+    } ).done( function (data) {
+      if ( Array.isArray(data) && data.length > 0 ) {
+        var pageList = data[1];
+
+        deferred.resolve( pageList );
+
+        // Set cache
+        pageList.forEach( function (pageTitle) {
+          if ( !_this.loadedPageList.includes( pageTitle ) ) {
+            _this.loadedPageList.push( pageTitle );
+          }
+        } );
+      } else {
+        deferred.resolve( [] );
+      }
+    } );
+	}, function () {
+		// No results when the input contains invalid content
+		deferred.resolve( [] );
+	} );
+	return deferred.promise( { abort: function () {} } );
+};
+/**
+ * @inheritdoc
+ */
+isekai.ui.CreatePageInputWidget.prototype.getLookupCacheDataFromResponse = function ( response ) {
+	return response || [];
+};
+/**
+ * @inheritdoc
+ */
+isekai.ui.CreatePageInputWidget.prototype.getLookupMenuOptionsFromData = function ( data ) {
+	return ( data || [] ).map( function (one) {
+    return new OO.ui.MenuOptionWidget( {
+      data: one + "/",
+      label: one
+    } )
+  } );
+};

src/createPage/ext.isekai.createPage.js

@@ -12,7 +12,7 @@ class CreatePageWidget {
     }
 
     initDom() {
-        this.pageNameInput = new OO.ui.TextInputWidget({
+        this.pageNameInput = new isekai.ui.CreatePageInputWidget({
             placeholder: mw.message('isekai-createpage-page-title').parse(),
         });
         this.pageNameInput.on('enter', this.createPage.bind(this));