User:BZPN/PNHelper.js: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
Line 1: | Line 1: | ||
mw.loader.using( |
mw.loader.using('mediawiki.util').then(function() { |
||
// |
// Dodanie przycisku do paska bocznego |
||
mw.util.addPortletLink( |
|||
var $button = $('<li id="t-custom-task"><a href="#"></a></li>'); |
|||
'p-tb', // Sekcja na pasku bocznym |
|||
$button.find('a').text('Dodaj zadanie'); |
|||
'#', // Link (placeholder) |
|||
'Dodaj zadanie', // Tekst przycisku |
|||
'dodaj-zadanie-przycisk', // ID przycisku |
|||
'Dodaj nowe zadanie' // Opis przycisku (tooltip) |
|||
); |
|||
// Funkcja wyświetlająca popup |
|||
// Dodanie przycisku do paska narzędzi |
|||
function showPopup() { |
|||
$('#p-tb ul').append($button); |
|||
// Tworzenie elementów popupu |
|||
var $popup = $('<div>', { id: 'zadanie-popup', class: 'popup-okno' }).css({ |
|||
function createTaskModal() { |
|||
position: 'fixed', |
|||
top: '50%', |
|||
left: '50%', |
|||
$('body').append(taskModal.$element); |
|||
transform: 'translate(-50%, -50%)', |
|||
background: '#fff', |
|||
padding: '20px', |
|||
border: '1px solid #ccc', |
|||
'z-index': 1000 |
|||
}); |
|||
OO.inheritClass(TaskDialog, OO.ui.ProcessDialog); |
|||
// Pole do wpisania tytułu zadania |
|||
TaskDialog.static.name = 'taskDialog'; |
|||
var $titleInput = $('<input>', { |
|||
type: 'text', |
|||
TaskDialog.static.actions = [ |
|||
id: 'zadanie-tytul', |
|||
placeholder: 'Wpisz tytuł zadania' |
|||
}).css({ width: '100%', 'margin-bottom': '10px' }); |
|||
flags: ['primary', 'progressive'] |
|||
// Większe pole do wpisania opisu zadania |
|||
{ |
var $descriptionInput = $('<textarea>', { |
||
id: 'zadanie-opis', |
|||
placeholder: 'Wpisz opis zadania' |
|||
}).css({ width: '100%', height: '100px', 'margin-bottom': '10px' }); |
|||
// Przycisk do dodawania stylów tekstu |
|||
var $editButtons = $('<div>', { id: 'edit-buttons' }).css({ 'margin-bottom': '10px' }); |
|||
var $boldButton = $('<button>', { text: 'B' }).css({ 'font-weight': 'bold' }).on('click', function() { |
|||
document.execCommand('bold'); |
|||
}); |
|||
var $italicButton = $('<button>', { text: 'I' }).css({ 'font-style': 'italic' }).on('click', function() { |
|||
document.execCommand('italic'); |
|||
}); |
|||
$editButtons.append($boldButton, $italicButton); |
|||
// Przycisk do dodawania linków do zaznaczonych wyrazów |
|||
var $linkButton = $('<button>', { text: 'Dodaj link' }).on('click', function() { |
|||
var selectedText = window.getSelection().toString(); |
|||
if (selectedText) { |
|||
var url = prompt('Podaj URL dla zaznaczonego tekstu:'); |
|||
if (url) { |
|||
document.execCommand('createLink', false, url); |
|||
} |
|||
} else { |
|||
alert('Zaznacz tekst, aby dodać link.'); |
|||
} |
} |
||
]; |
|||
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' |
|||
}); |
}); |
||
// |
// Przycisk Anuluj |
||
var $cancelButton = $('<button>', { text: 'Anuluj' }).on('click', function() { |
|||
taskModal.addWindows([taskDialog]); |
|||
$popup.remove(); |
|||
}).css({ 'margin-top': '10px', 'background-color': '#f44336', color: '#fff' }); |
|||
// |
// Dodanie elementów do popupu |
||
$popup.append($titleInput, $descriptionInput, $editButtons, $linkButton, $cancelButton); |
|||
function openTaskModal() { |
|||
taskModal.openWindow(taskDialog); |
|||
} |
|||
// Dodanie |
// Dodanie popupu do dokumentu |
||
$ |
$('body').append($popup); |
||
e.preventDefault(); |
|||
openTaskModal(); |
|||
}); |
|||
} |
} |
||
// Podpięcie funkcji do kliknięcia przycisku |
|||
// Inicjalizacja po załadowaniu strony |
|||
$('#dodaj-zadanie-przycisk').on('click', function(e) { |
|||
$(document).ready(createTaskModal); |
|||
e.preventDefault(); |
|||
showPopup(); |
|||
}); |
|||
}); |
}); |
Revision as of 16:24, 20 November 2024
mw.loader.using('mediawiki.util').then(function() {
// Dodanie przycisku do paska bocznego
mw.util.addPortletLink(
'p-tb', // Sekcja na pasku bocznym
'#', // Link (placeholder)
'Dodaj zadanie', // Tekst przycisku
'dodaj-zadanie-przycisk', // ID przycisku
'Dodaj nowe zadanie' // Opis przycisku (tooltip)
);
// Funkcja wyświetlająca popup
function showPopup() {
// Tworzenie elementów popupu
var $popup = $('<div>', { id: 'zadanie-popup', class: 'popup-okno' }).css({
position: 'fixed',
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)',
background: '#fff',
padding: '20px',
border: '1px solid #ccc',
'z-index': 1000
});
// Pole do wpisania tytułu zadania
var $titleInput = $('<input>', {
type: 'text',
id: 'zadanie-tytul',
placeholder: 'Wpisz tytuł zadania'
}).css({ width: '100%', 'margin-bottom': '10px' });
// Większe pole do wpisania opisu zadania
var $descriptionInput = $('<textarea>', {
id: 'zadanie-opis',
placeholder: 'Wpisz opis zadania'
}).css({ width: '100%', height: '100px', 'margin-bottom': '10px' });
// Przycisk do dodawania stylów tekstu
var $editButtons = $('<div>', { id: 'edit-buttons' }).css({ 'margin-bottom': '10px' });
var $boldButton = $('<button>', { text: 'B' }).css({ 'font-weight': 'bold' }).on('click', function() {
document.execCommand('bold');
});
var $italicButton = $('<button>', { text: 'I' }).css({ 'font-style': 'italic' }).on('click', function() {
document.execCommand('italic');
});
$editButtons.append($boldButton, $italicButton);
// Przycisk do dodawania linków do zaznaczonych wyrazów
var $linkButton = $('<button>', { text: 'Dodaj link' }).on('click', function() {
var selectedText = window.getSelection().toString();
if (selectedText) {
var url = prompt('Podaj URL dla zaznaczonego tekstu:');
if (url) {
document.execCommand('createLink', false, url);
}
} else {
alert('Zaznacz tekst, aby dodać link.');
}
});
// Przycisk Anuluj
var $cancelButton = $('<button>', { text: 'Anuluj' }).on('click', function() {
$popup.remove();
}).css({ 'margin-top': '10px', 'background-color': '#f44336', color: '#fff' });
// Dodanie elementów do popupu
$popup.append($titleInput, $descriptionInput, $editButtons, $linkButton, $cancelButton);
// Dodanie popupu do dokumentu
$('body').append($popup);
}
// Podpięcie funkcji do kliknięcia przycisku
$('#dodaj-zadanie-przycisk').on('click', function(e) {
e.preventDefault();
showPopup();
});
});