User:BZPN/PNHelper.js

From Test Wiki
Revision as of 16:23, 20 November 2024 by BZPN (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
mw.loader.using(['mediawiki.api', 'oojs-ui'], function() {
    // Tworzenie przycisku
    var $button = $('<li id="t-custom-task"><a href="#"></a></li>');
    $button.find('a').text('Dodaj zadanie');

    // Dodanie przycisku do paska narzędzi
    $('#p-tb ul').append($button);

    function createTaskModal() {
        // Główne okno modalne
        var taskModal = new OO.ui.WindowManager();
        $('body').append(taskModal.$element);

        // Klasa okna modalnego
        var TaskDialog = function() {
            TaskDialog.super.apply(this, arguments);
        };
        OO.inheritClass(TaskDialog, OO.ui.ProcessDialog);

        TaskDialog.static.name = 'taskDialog';
        TaskDialog.static.title = 'Dodaj zadanie';
        TaskDialog.static.actions = [
            {
                action: 'save',
                label: 'Zapisz',
                flags: ['primary', 'progressive']
            },
            {
                action: 'cancel',
                label: 'Anuluj',
                flags: ['safe', 'close']
            }
        ];

        TaskDialog.prototype.initialize = function() {
            TaskDialog.super.prototype.initialize.apply(this, arguments);
            
            // Pole tytułu zadania
            this.titleInput = new OO.ui.TextInputWidget({
                placeholder: 'Wprowadź tytuł zadania'
            });

            // Pole opisu zadania
            this.descriptionInput = new OO.ui.MultilineTextInputWidget({
                placeholder: 'Szczegółowy opis zadania',
                rows: 5
            });

            // Przycisk dodawania linków
            this.addLinkButton = new OO.ui.ButtonWidget({
                label: 'Dodaj linki do tekstu',
                icon: 'link'
            });

            // Przycisk stylowania tekstu
            this.styleTextButton = new OO.ui.ButtonWidget({
                label: 'Style tekstu',
                icon: 'formatting'
            });

            // Układ pionowy elementów
            var contentLayout = new OO.ui.VerticalLayout({
                items: [
                    this.titleInput,
                    this.descriptionInput,
                    new OO.ui.HorizontalLayout({
                        items: [
                            this.addLinkButton,
                            this.styleTextButton
                        ]
                    })
                ]
            });

            // Dodanie layoutu do panelu
            this.$body.append(contentLayout.$element);
        };

        TaskDialog.prototype.getActionProcess = function(action) {
            if (action === 'save') {
                return new OO.ui.Process(function() {
                    // Logika zapisu zadania
                    console.log('Tytuł:', this.titleInput.getValue());
                    console.log('Opis:', this.descriptionInput.getValue());
                    this.close();
                }, this);
            }
            if (action === 'cancel') {
                return new OO.ui.Process(function() {
                    this.close();
                }, this);
            }
            return TaskDialog.super.prototype.getActionProcess.call(this, action);
        };

        // Dodanie obsługi zdarzeń dla przycisków specjalnych
        TaskDialog.prototype.onDialogReady = function() {
            this.addLinkButton.on('click', function() {
                // Logika dodawania linków
                alert('Funkcja dodawania linków w trakcie implementacji');
            });

            this.styleTextButton.on('click', function() {
                // Logika stylowania tekstu
                alert('Funkcja stylowania tekstu w trakcie implementacji');
            });
        };

        // Stworzenie instancji dialogu
        var taskDialog = new TaskDialog({
            size: 'large'
        });

        // Dodanie dialogu do menedżera okien
        taskModal.addWindows([taskDialog]);

        // Funkcja otwierania modala
        function openTaskModal() {
            taskModal.openWindow(taskDialog);
        }

        // Dodanie zdarzenia kliknięcia do przycisku
        $button.find('a').on('click', function(e) {
            e.preventDefault();
            openTaskModal();
        });
    }

    // Inicjalizacja po załadowaniu strony
    $(document).ready(createTaskModal);
});