MediaWiki:Citizen.js
Página de Interface do MediaWiki
Mais ações
Nota: Após publicar, você pode ter que limpar o "cache" do seu navegador para ver as alterações.
- Firefox / Safari: Pressione Shift enquanto clica Recarregar, ou pressione Ctrl-F5 ou Ctrl-R (⌘-R no Mac)
- Google Chrome: Pressione Ctrl-Shift-R (⌘-Shift-R no Mac)
- Edge: Pressione Ctrl enquanto clica Recarregar, ou pressione Ctrl-F5.
- Opera: Pressione Ctrl-F5.
/**
* MediaWikiCitizen.js
* Adds a functional "Copy" button to code blocks (pre, .mw-highlight, .mw-code).
*/
(function () {
'use strict';
function addCopyButtons() {
// Select all code block containers
const codeBlocks = document.querySelectorAll('pre, .mw-highlight, .mw-code');
codeBlocks.forEach(function (block) {
// Check if button already exists to prevent duplicates
if (block.querySelector('.mw-copy-btn')) return;
// Create the button
const button = document.createElement('button');
button.className = 'mw-copy-btn';
button.type = 'button';
button.ariaLabel = 'Copiar código';
// Icon (SVG)
button.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
</svg>
`;
// Add click event
button.addEventListener('click', function () {
// Get text content
const code = block.innerText || block.textContent;
// Copy to clipboard
navigator.clipboard.writeText(code).then(function () {
// Success feedback
button.classList.add('copied');
const originalHTML = button.innerHTML;
// Change icon to checkmark temporarily
button.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="20 6 9 17 4 12"></polyline>
</svg>
`;
setTimeout(function () {
button.classList.remove('copied');
button.innerHTML = originalHTML;
}, 2000);
}).catch(function (err) {
console.error('Failed to copy: ', err);
});
});
// Append button to the block
// Ensure relative positioning on block so button positions correctly
if (getComputedStyle(block).position === 'static') {
block.style.position = 'relative';
}
block.appendChild(button);
});
}
// Run on load
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', addCopyButtons);
} else {
addCopyButtons();
}
// Optional: Observer for dynamic content (if MediaWiki loads content via AJAX)
const observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
if (mutation.addedNodes.length) {
addCopyButtons();
}
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
/* --- CELTA SISTEMA: Lógica de Abas (SPA) --- */
// Torna a função global para ser chamada nos onlicks do HTML
window.abrirAbaCelta = function(id, elementoBotao) {
var todasAbas = document.querySelectorAll('.erp-tab-content');
todasAbas.forEach(function(aba) {
aba.style.display = 'none';
});
var todosSubmenus = document.querySelectorAll('.erp-submenu');
todosSubmenus.forEach(function(submenu) {
submenu.style.display = 'none';
});
if (id === 'principal') {
var submenu = document.getElementById('submenu-principal');
if (submenu) {
submenu.style.display = 'block';
}
var tabPrincipal = document.getElementById('tab-principal');
if (tabPrincipal) {
tabPrincipal.style.display = 'block';
}
} else {
var alvo = document.getElementById('tab-' + id);
if (alvo) {
alvo.style.display = 'block';
}
}
if (elementoBotao) {
var todosMenus = document.querySelectorAll('.erp-menu-item');
todosMenus.forEach(function(item) {
item.classList.remove('active');
});
elementoBotao.classList.add('active');
}
};
window.abrirSubAba = function(id) {
var todasAbas = document.querySelectorAll('.erp-tab-content');
todasAbas.forEach(function(aba) {
aba.style.display = 'none';
});
var alvo = document.getElementById('tab-' + id);
if (alvo) {
alvo.style.display = 'block';
}
};
document.addEventListener('DOMContentLoaded', function() {
abrirAbaCelta('principal', document.querySelectorAll('.erp-sidebar .erp-menu-item')[1]);
});