Widget:BossActions - Histórico de revisão

Edynhooo em 20h35min de 21 de abril de 2026

2026-04-21T20:35:34Z

← Edição anterior		Edição das 20h35min de 21 de abril de 2026
Linha 1:		Linha 1:
			<noinclude>
			Widget para controle de abas.
			</noinclude>
			<includeonly>
			<script>
			/<![CDATA[/
			window.showBossSection = function(sectionId, btnElement) {
			// 1. Esconde tudo o que for seção
			var sections = document.getElementsByClassName('boss-section');
			for (var i = 0; i < sections.length; i++) {
			sections[i].style.setProperty('display', 'none', 'important');
			sections[i].classList.remove('active');
			}

			// 2. Remove active dos botões
			var buttons = btnElement.parentElement.getElementsByClassName('boss-nav-btn');
			for (var j = 0; j < buttons.length; j++) {
			buttons[j].classList.remove('active');
			}

			// 3. Mostra a seção clicada
			var target = document.getElementById(sectionId);
			if (target) {
			target.style.setProperty('display', 'block', 'important');
			target.classList.add('active');
			}
			btnElement.classList.add('active');
			};
			/]]>/
			</script>
			</includeonly>

	<noinclude>		<noinclude>

Edynhooo em 20h34min de 21 de abril de 2026

2026-04-21T20:34:05Z

← Edição anterior		Edição das 20h34min de 21 de abril de 2026
Linha 1:		Linha 1:
	~~<noinclude>~~
	~~Widget para controle de abas.~~
	~~</noinclude>~~
	~~<includeonly>~~
	~~<script>~~
	~~/<![CDATA[/~~
	~~window.showBossSection = function(sectionId, btnElement) {~~
	~~// 1. Esconde tudo o que for seção~~
	~~var sections = document.getElementsByClassName('boss-section');~~
	~~for (var i = 0; i < sections.length; i++) {~~
	~~sections[i].style.setProperty('display', 'none', 'important');~~
	~~sections[i].classList.remove('active');~~
	}

	~~// 2. Remove active dos botões~~
	~~var buttons = btnElement.parentElement.getElementsByClassName('boss-nav-btn');~~
	~~for (var j = 0; j < buttons.length; j++) {~~
	~~buttons[j].classList.remove('active');~~
	}

	~~// 3. Mostra a seção clicada~~
	~~var target = document.getElementById(sectionId);~~
	~~if (target) {~~
	~~target.style.setProperty('display', 'block', 'important');~~
	~~target.classList.add('active');~~
	}
	~~btnElement.classList.add('active');~~
	};
	~~/]]>/~~
	~~</script>~~
	~~</includeonly>~~

	<noinclude>		<noinclude>

Edynhooo em 20h32min de 21 de abril de 2026

2026-04-21T20:32:41Z

← Edição anterior		Edição das 20h32min de 21 de abril de 2026
Linha 33:		Linha 33:
	<noinclude>		<noinclude>
	Widget genérico para estruturar páginas de Bosses.		Widget genérico para estruturar páginas de Bosses.
	Uso: {{#widget:~~BossLayout~~}}		Uso: {{#widget:BossActions}}
	</noinclude>		</noinclude>
	<includeonly>		<includeonly>

Edynhooo em 20h32min de 21 de abril de 2026

2026-04-21T20:32:11Z

← Edição anterior		Edição das 20h32min de 21 de abril de 2026
Linha 29:		Linha 29:
	/]]>/		/]]>/
	</script>		</script>
			</includeonly>

			<noinclude>
			Widget genérico para estruturar páginas de Bosses.
			Uso: {{#widget:BossLayout}}
			</noinclude>
			<includeonly>
			<style>
			/* Reaproveitando o padrão da Home do GLA */
			.boss-grid-container {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			gap: 20px;
			padding: 10px;
			}

			/* Estilo de Card idêntico ao da Home */
			.boss-card-item {
			width: 100%;
			display: flex;
			flex-direction: column;
			overflow: hidden;
			border: 1px solid #bbb;
			border-radius: 12px;
			background: #fff;
			transition: transform 0.2s ease, box-shadow 0.2s ease;
			box-shadow: 0 1px 3px rgba(0,0,0,0.08);
			}

			.boss-card-item:hover {
			transform: translateY(-3px);
			border-color: #007bff;
			box-shadow: 0 4px 10px rgba(0,0,0,0.12);
			}

			.boss-card-header {
			height: 4px;
			width: 100%;
			}

			.boss-card-title {
			font-weight: bold;
			padding: 10px;
			text-align: center;
			background: #f8f9fa;
			color: #0645AD;
			border-bottom: 1px solid #eee;
			text-transform: uppercase;
			}

			/* Ajuste para o Tabber parecer botões */
			.tabber__tabs {
			display: flex !important;
			justify-content: center !important;
			gap: 10px !important;
			border-bottom: none !important;
			margin-bottom: 20px !important;
			}

			.tabber__tab {
			background: #fff !important;
			border: 1px solid #007bff !important;
			border-radius: 8px !important;
			padding: 8px 20px !important;
			color: #007bff !important;
			font-weight: bold !important;
			transition: 0.3s !important;
			}

			.tabber__tab[aria-selected="true"] {
			background: #007bff !important;
			color: white !important;
			}

			/* Container de Scroll */
			.boss-scroll-box {
			max-height: 300px;
			overflow-y: auto;
			padding: 10px;
			}
			</style>
	</includeonly>		</includeonly>

Edynhooo em 20h58min de 20 de abril de 2026

2026-04-20T20:58:01Z

← Edição anterior		Edição das 20h58min de 20 de abril de 2026
Linha 1:		Linha 1:
	<noinclude>		<noinclude>
	Widget para controle de abas ~~nas páginas de World Boss~~.		Widget para controle de abas.
	</noinclude>		</noinclude>
	<includeonly>		<includeonly>
	<script ~~type="text/javascript"~~>		<script>
	~~(function() {~~		/<![CDATA[/
	// ~~Definimos a função no escopo global (window) para que o 'onclick' a encontre~~		window.showBossSection = function(sectionId, btnElement) {
	window.showBossSection = function(sectionId, btnElement) {		// 1. Esconde tudo o que for seção
	// 1. ~~Localiza todas as seções de boss na página~~		var sections = document.getElementsByClassName('boss-section');
	var sections = document.~~querySelectorAll~~('.boss-section');		for (var i = 0; i < sections.length; i++) {
	for (var i = 0; i < sections.length; i++) {		sections[i].style.setProperty('display', 'none', 'important');
	sections[i].~~classList~~.~~remove~~('~~active~~');		sections[i].classList.remove('active');
	sections[i].~~style~~.~~display =~~ '~~none~~';		}
	}

	// 2. Remove ~~a classe '~~active' dos botões ~~irmãos~~		// 2. Remove active dos botões
	var buttons = btnElement.parentElement.~~querySelectorAll~~('.boss-nav-btn');		var buttons = btnElement.parentElement.getElementsByClassName('boss-nav-btn');
	for (var j = 0; j < buttons.length; j++) {		for (var j = 0; j < buttons.length; j++) {
	buttons[j].classList.remove('active');		buttons[j].classList.remove('active');
	}		}

	// 3. ~~Ativa~~ a seção ~~alvo~~		// 3. Mostra a seção clicada
	var target = document.getElementById(sectionId);		var target = document.getElementById(sectionId);
	if (target) {		if (target) {
	target.~~classList~~.~~add~~('~~active~~');		target.style.setProperty('display', 'block', 'important');
	target.~~style~~.~~display =~~ '~~block~~';		target.classList.add('active');
	}		}
			btnElement.classList.add('active');
	~~// 4. Ativa o botão clicado~~		};
	btnElement.classList.add('active');		/]]>/
	};
	~~})();~~
	</script>		</script>
	</includeonly>		</includeonly>

Edynhooo em 20h53min de 20 de abril de 2026

2026-04-20T20:53:50Z

← Edição anterior		Edição das 20h53min de 20 de abril de 2026
Linha 1:		Linha 1:
	<noinclude>		<noinclude>
	Widget para controle de abas nas páginas de World Boss.		Widget para controle de abas nas páginas de World Boss.
	~~Uso: {{#widget:BossActions}}~~
	</noinclude>		</noinclude>
	<script>		<includeonly>
	function showBossSection(sectionId, btnElement) {		<script type="text/javascript">
	// ~~Esconde~~ todas as seções		(function() {
	~~const~~ sections = document.querySelectorAll('.boss-section');		// Definimos a função no escopo global (window) para que o 'onclick' a encontre
	sections.~~forEach(sec =>~~ {		window.showBossSection = function(sectionId, btnElement) {
	~~sec~~.classList.remove('active');		// 1. Localiza todas as seções de boss na página
	~~sec~~.style.display = 'none';		var sections = document.querySelectorAll('.boss-section');
	});		for (var i = 0; i < sections.length; i++) {
			sections[i].classList.remove('active');
			sections[i].style.display = 'none';
			}

	// Remove classe active ~~de todos os~~ botões ~~no mesmo menu~~		// 2. Remove a classe 'active' dos botões irmãos
	~~const~~ buttons = btnElement.parentElement.querySelectorAll('.boss-nav-btn');		var buttons = btnElement.parentElement.querySelectorAll('.boss-nav-btn');
	buttons.~~forEach(btn =>~~ {		for (var j = 0; j < buttons.length; j++) {
	~~btn~~.classList.remove('active');		buttons[j].classList.remove('active');
	});		}

	// Ativa a seção ~~e o botão corretos~~		// 3. Ativa a seção alvo
	~~const~~ target = document.getElementById(sectionId);		var target = document.getElementById(sectionId);
	if (target) {		if (target) {
	target.classList.add('active');		target.classList.add('active');
	target.style.display = 'block';		target.style.display = 'block';
	}		}
	btnElement.classList.add('active');
	}		// 4. Ativa o botão clicado
			btnElement.classList.add('active');
			};
			})();
	</script>		</script>
			</includeonly>

Edynhooo em 20h44min de 20 de abril de 2026

2026-04-20T20:44:41Z

← Edição anterior		Edição das 20h44min de 20 de abril de 2026
Linha 1:		Linha 1:
			<noinclude>
			Widget para controle de abas nas páginas de World Boss.
			Uso: {{#widget:BossActions}}
			</noinclude>
	<script>		<script>
	~~document.querySelectorAll~~(~~'.boss-nav-btn'~~)~~.forEach(button =>~~ {		function showBossSection(sectionId, btnElement) {
	~~button.addEventListener('click', () => {~~		// Esconde todas as seções
	const ~~target~~ = ~~button.getAttribute('data-target');~~		const sections = document.querySelectorAll('.boss-section');
			sections.forEach(sec => {
	~~// Remove 'active' de todos~~		sec.classList.remove('active');
	document.querySelectorAll('.boss-~~nav-btn~~'~~).forEach(btn => btn.classList.remove('active')~~);		sec.style.display = 'none';
	~~document.querySelectorAll('.boss-section')~~.forEach(sec => sec.classList.remove('active'));

	~~// Adiciona 'active' no alvo~~
	~~button~~.~~classList~~.~~add(~~'~~active~~');
	~~document.getElementById(target).classList.add('active')~~;
	});		});
	});
			// Remove classe active de todos os botões no mesmo menu
			const buttons = btnElement.parentElement.querySelectorAll('.boss-nav-btn');
			buttons.forEach(btn => {
			btn.classList.remove('active');
			});

			// Ativa a seção e o botão corretos
			const target = document.getElementById(sectionId);
			if (target) {
			target.classList.add('active');
			target.style.display = 'block';
			}
			btnElement.classList.add('active');
			}
	</script>		</script>

Edynhooo em 20h41min de 20 de abril de 2026

2026-04-20T20:41:35Z

← Edição anterior		Edição das 20h41min de 20 de abril de 2026
Linha 1:		Linha 1:
	<script>		<script>
			document.querySelectorAll('.boss-nav-btn').forEach(button => {
	~~/* Função para trocar de aba~~ (~~seção~~)		button.addEventListener('click', () => {
	~~sectionId: O ID da div que deve aparecer~~		const target = button.getAttribute('data-target');
	~~buttonElement: O próprio botão clicado para mudar a classe~~ '~~active~~'
	*/		// Remove 'active' de todos
	~~function showBossSection~~(~~sectionId, buttonElement~~) {		document.querySelectorAll('.boss-nav-btn').forEach(btn => btn.classList.remove('active'));
	// ~~1. Esconder todas as seções~~ de ~~conteúdo~~		document.querySelectorAll('.boss-section').forEach(sec => sec.classList.remove('active'));
	~~const sections =~~ document.querySelectorAll('.boss-~~content~~-~~section~~');
	~~sections~~.forEach(sec => {		// Adiciona 'active' no alvo
	~~sec~~.classList.~~remove~~('active');		button.classList.add('active');
	~~sec~~.~~style~~.~~display =~~ '~~none~~'; ~~// Garantia extra de esconder~~		document.getElementById(target).classList.add('active');
	});		});
			});
	~~// 2. Mostrar a seção selecionada~~
	~~const targetSection = document.getElementById(sectionId);~~
	~~if (targetSection) {~~
	~~targetSection.classList.add('active');~~
	~~targetSection.style.display = 'block';~~
	}

	~~// 3. Remover classe 'active' de todos os botões da barra de navegação~~
	~~// Procuramos os botões que estão no mesmo container do botão clicado~~
	~~const navBar = buttonElement.parentElement;~~
	~~const buttons = navBar.querySelectorAll('.btn-boss-action'~~);
	~~buttons.forEach(btn => {~~
	~~btn.classList.remove('active');~~
	~~});~~

	~~// 4. Adicionar classe 'active' ao botão clicado~~
	~~buttonElement.classList.add('active');~~
	}
	</script>		</script>

Edynhooo em 20h37min de 20 de abril de 2026

2026-04-20T20:37:31Z

← Edição anterior		Edição das 20h37min de 20 de abril de 2026
Linha 1:		Linha 1:
	<script>		<script>

	/* Função para trocar de aba (seção)		/* Função para trocar de aba (seção)
	sectionId: O ID da div que deve aparecer		sectionId: O ID da div que deve aparecer

Edynhooo: Criou página com '