User:DreamRimmer/EasySubpage.js Source: en.wikipedia.org/wiki/User:DreamRimmer/EasySubpage.js

// <nowiki>

(function () {
    mw.util.addPortletLink(
        'p-cactions',
        '#',
        'EasySubpage',
        'ca-easy-subpage'
    );

    document.getElementById('ca-easy-subpage').addEventListener('click', function (e) {
        e.preventDefault();

        mw.loader.using(['mediawiki.api', 'oojs-ui', 'mediawiki.util'], function () {
            var api = new mw.Api();
            var currentPage = mw.config.get('wgPageName');
            var prefix = currentPage + '/';

            api.get({
                action: 'query',
                format: 'json',
                list: 'prefixsearch',
                formatversion: '2',
                pssearch: prefix,
                pslimit: 100
            }).done(function (data) {
                var subpages = data.query.prefixsearch;

                function SubpageDialog(config) {
                    SubpageDialog.super.call(this, config);
                }
                OO.inheritClass(SubpageDialog, OO.ui.ProcessDialog);

                SubpageDialog.static.name = 'subpageDialog';
                SubpageDialog.static.title = 'EasySubpage';
                SubpageDialog.static.actions = [
                    { action: 'save', label: 'Create', flags: ['primary', 'progressive'] },
                    { action: 'cancel', label: 'Cancel', flags: 'safe' }
                ];

                SubpageDialog.prototype.initialize = function () {
                    SubpageDialog.super.prototype.initialize.apply(this, arguments);

                    this.pageNameInput = new OO.ui.TextInputWidget({
                        placeholder: 'Enter the name of the subpage'
                    });

                    var subpageList;
                    if (subpages.length > 0) {
                        subpageList = new OO.ui.SelectWidget({
                            items: subpages.map(function (subpage) {
                                return new OO.ui.OptionWidget({
                                    data: subpage.title,
                                    label: new OO.ui.HtmlSnippet(`<li><a href="https://demo.azizisearch.com/lite/wikipedia/page/${encodeURIComponent(subpage.title)}">${subpage.title}</a></li>`)
                                });
                            })
                        });
                    } else {
                        subpageList = new OO.ui.LabelWidget({
                            label: 'No subpages'
                        });
                    }

                    this.content = new OO.ui.PanelLayout({
                        padded: true,
                        expanded: false
                    });

                    this.content.$element.append(
                        new OO.ui.FieldsetLayout({
                            items: [
                                new OO.ui.FieldLayout(this.pageNameInput, {
                                    label: 'Subpage name:',
                                    align: 'top'
                                }),
                                new OO.ui.FieldLayout(subpageList, {
                                    label: 'Current subpages:',
                                    align: 'top'
                                })
                            ]
                        }).$element
                    );

                    this.$body.append(this.content.$element);
                };

                SubpageDialog.prototype.getActionProcess = function (action) {
                    if (action === 'save') {
                        var subpageName = this.pageNameInput.getValue();
                        if (subpageName) {
                            var subpageURL = `/w/index.php?title=${encodeURIComponent(currentPage)}/${encodeURIComponent(subpageName)}&action=edit`;
                            window.location.href = subpageURL;
                        }
                        return new OO.ui.Process().next(function () {
                            this.close({ action: action });
                        }, this);
                    }
                    if (action === 'cancel') {
                        return new OO.ui.Process().next(function () {
                            this.close({ action: action });
                        }, this);
                    }
                    return SubpageDialog.super.prototype.getActionProcess.call(this, action);
                };

                var windowManager = new OO.ui.WindowManager();
                $(document.body).append(windowManager.$element);
                var dialog = new SubpageDialog();
                windowManager.addWindows([dialog]);
                windowManager.openWindow(dialog);
            });
        });
    });
})();

// </nowiki>