Mudanças entre as edições de "MediaWiki:Common.js"
Ir para navegação
Ir para pesquisar
| Linha 58: | Linha 58: | ||
//------- COUNTDOWN MAINPAGE--------- | //------- COUNTDOWN MAINPAGE--------- | ||
/* | |||
O countdown é um codigo pega a data e hora do computador do usuario e aplica um calculo | |||
para adaptar o mesmo ao fuso horario de brasilia, após isso ele verifica os eventos do | |||
dia começa uma contagem regressiva com base na diferença do horario do computador do | |||
usuario com a do evento. | |||
*/ | |||
const timer = $('#event-time'); | const timer = $('#event-time'); | ||
| Linha 207: | Linha 214: | ||
//------- PERSONAGENS --------- | //------- PERSONAGENS --------- | ||
//------- SKILL TAB --------- | |||
$('.tab-skill').on('click', function(){ | |||
$('.tab-skill.active').removeClass('active'); | |||
$(this).addClass('active'); | |||
}); | |||
//------- SKILL TAB --------- | |||
}); | }); | ||
Edição das 02h38min de 10 de junho de 2022
$(document).ready(function() {
//------- TOOLTIP IMAGE---------
/*
Tooltip image consiste em uma funcionalidade que insere uma tag IMG
quando o usuario passa o mouse por cima de uma imagem com a classe "tooltip-image"
ao fazer é inserido no body uma tag IMG com a mesma "src" 1.3 vezes maior do que a imagem
que o usuario está com o mouse em coma, esta tag IMG terá o mesmo X e Y do mouse + um offset
para manter um distanciamento.
*/
//Distanciamento / margem do mouse
const offset = { x: 20, y: 10 };
$('.tooltip-image').on('mouseenter',
function(e) {
var src = $(this).attr('src');
var size = $(this).width() * 1.3;
$('<img src="'+ src +'" id="bigImage" />').css('left', e.pageX + offset.x).css('top', e.pageY + offset.y).css('width', size + "px").appendTo('body').hide().fadeIn(500);
}).on('mouseleave',
function(){
$('#bigImage').remove();
});
$('.tooltip-image').mousemove(function(e) {
$('#bigImage').css('left', e.pageX + offset.x).css('top', e.pageY + offset.y);
});
//------- TOOLTIP IMAGE---------
//------- FUNCIONALIDADES PACIENTES KUREHA ---------
const pacients = {
"bafo":{ image: "/images/c/ce/Bafo_static.png", gif: "/images/e/e0/Bafo.gif"},
"espirrando": { image: "/images/thumb/5/5b/Espirro_static.png/180px-Espirro_static.png", gif: "/images/thumb/9/90/Espirro.gif/180px-Espirro.gif "},
"enjoado": { image: "/images/thumb/5/52/Enjoado_static.png/180px-Enjoado_static.png", gif: "/images/thumb/7/76/Enjoado.gif/180px-Enjoado.gif"},
"tremendo": { image: "/images/thumb/3/35/Tremendo_static.png/180px-Tremendo_static.png", gif: "/images/thumb/f/f4/Tremendo.gif/180px-Tremendo.gif"},
"tossindo": { image: "/images/thumb/e/ef/Tosse_static.png/180px-Tosse_static.png", gif: "/images/thumb/a/a4/Tosse.gif/180px-Tosse.gif"},
"solucando": { image: "/images/thumb/c/c0/Soluco_static.png/180px-Soluco_static.png", gif: "/images/thumb/6/67/Soluco.gif/180px-Soluco.gif"},
"funk": { image: "/images/thumb/e/e8/Funkeiro_static.png/180px-Funkeiro_static.png ", gif: "/images/thumb/7/79/Funkeiro.gif/180px-Funkeiro.gif"},
"fedendo": { image: "/images/thumb/1/1e/Fedido_static.png/180px-Fedido_static.png", gif: "/images/thumb/c/c9/Fedido.gif/180px-Fedido.gif"},
"febre": { image: "/images/thumb/1/14/Febre_static.png/180px-Febre_static.png", gif: "/images/thumb/7/75/Febre.gif/180px-Febre.gif"}
}
$('.interactive-pacient').on('mouseenter', function (e){
id = $(this).attr('id');
if(pacients[id])
$(this).attr('src', pacients[id].gif);
}).on('mouseleave', function(e){
id = $(this).attr('id');
if(pacients[id])
$(this).attr('src', pacients[id].image);
});
//------- FUNCIONALIDADES PACIENTES KUREHA ---------
//------- COUNTDOWN MAINPAGE---------
/*
O countdown é um codigo pega a data e hora do computador do usuario e aplica um calculo
para adaptar o mesmo ao fuso horario de brasilia, após isso ele verifica os eventos do
dia começa uma contagem regressiva com base na diferença do horario do computador do
usuario com a do evento.
*/
const timer = $('#event-time');
const eventImage = $('.event-image');
//Informações dos eventos
/*
0 - Sunday
1 - Monday
2 - Tuesday
3 - Wednesday
4 - Thursday
5 - Friday
6 - Saturday
*/
const eventsInfo = {
0: [
{name: 'Foxy race (ship)', time: '09:30:00', src: '/images/c/c0/Event_ship.png'},
{name: 'Foxy count', time: '15:00:00', src: '/images/e/e4/Event_count.png'},
{name: 'Foxy quiz', time: '19:00:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '22:00:00', src: '/images/8/84/Event_dm.png'},
],
1: [
{name: 'Foxy count', time: '09:30:00', src: '/images/e/e4/Event_count.png'},
{name: 'Foxy quiz', time: '15:00:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '19:00:00', src: '/images/8/84/Event_dm.png'},
{name: 'Foxy race (ship)', time: '22:00:00', src: '/images/c/c0/Event_ship.png'},
],
2: [
{name: 'Foxy quiz', time: '09:30:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '15:00:00', src: '/images/8/84/Event_dm.png'},
{name: 'Foxy race', time: '19:00:00', src: '/images/0/03/Event_race.png'},
{name: 'Foxy count', time: '22:00:00', src: '/images/e/e4/Event_count.png'},
],
3: [
{name: 'Deathmatch', time: '09:30:00', src: '/images/8/84/Event_dm.png'},
{name: 'Foxy race (ship)', time: '15:00:00', src: '/images/c/c0/Event_ship.png'},
{name: 'Foxy count', time: '19:00:00', src: '/images/e/e4/Event_count.png'},
{name: 'Foxy quiz', time: '22:00:00', src: '/images/6/6f/Event_quiz.png'},
],
4: [
{name: 'Foxy race', time: '09:30:00', src: '/images/0/03/Event_race.png'},
{name: 'Foxy count', time: '15:00:00', src: '/images/e/e4/Event_count.png'},
{name: 'Foxy quiz', time: '19:00:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '22:00:00', src: '/images/8/84/Event_dm.png'},
],
5: [
{name: 'Foxy count', time: '09:30:00', src: '/images/e/e4/Event_count.png'},
{name: 'Foxy quiz', time: '15:00:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '19:00:00', src: '/images/8/84/Event_dm.png'},
{name: 'Foxy race (ship)', time: '22:00:00', src: '/images/c/c0/Event_ship.png'},
],
6: [
{name: 'Foxy quiz', time: '09:30:00', src: '/images/6/6f/Event_quiz.png'},
{name: 'Deathmatch', time: '15:00:00', src: '/images/8/84/Event_dm.png'},
{name: 'Foxy race', time: '19:00:00', src: '/images/0/03/Event_race.png'},
{name: 'Foxy count', time: '22:00:00', src: '/images/e/e4/Event_count.png'},
]
};
const brazilOffset = -3;
const eventTime = new Date();
const eventStarting = new Date();
var haveEvent = false;
function pad(d) {
return (d < 10) ? '0' + String(d) : String(d);
}
function startTimer(eventTime, name){
interval = setInterval(function() {
const now = new Date().getTime();
const distance = eventTime.getTime() - now;
if(distance > 0){
const hour = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const minute = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((distance % (1000 * 60)) / 1000);
timer.html(pad(hour) + ":" + pad(minute) + ":" + pad(seconds));
}else {
haveEvent = false;
setDayEvents();
clearInterval(interval);
}
}, 1000);
}
function setDayEvents () {
const date = new Date();
const dayEvents = eventsInfo[date.getDay()];
const utcTime = date.getTime() + (date.getTimezoneOffset() * 60000);
const currentTime = new Date(utcTime + (3600000 * brazilOffset));
$.each(dayEvents, function (key, item) {
split = item.time.split(":");
eventTime.setHours(split[0], split[1], split[2]);
eventStarting.setHours(split[0], (Number(split[1]) + 1), split[2]);
if(currentTime.getTime() <= eventTime.getTime()){
eventImage.attr('src', item.src);
haveEvent = true;
startTimer(eventTime, name);
return false;
}else if(currentTime.getTime() > eventTime.getTime() && currentTime.getTime() < eventStarting.getTime()){
eventImage.attr('src', item.src);
timer.html('O evento está começando!');
haveEvent = true;
setTimeout(function(){
haveEvent = false;
return false;
}, 300000);
}
});
if(!haveEvent){
eventImage.attr('src', "/images/a/a5/AnyEvent.png");
timer.html('');
}
}
if(!haveEvent)
setDayEvents();
//------- COUNTDOWN MAINPAGE---------
//------- PERSONAGENS ---------
const characters = {
0: {name: "Monkey D. Luffy", type: ["fighter", "fruit", "bruiser"], link: "/Luffy", img: "https://cdn.discordapp.com/attachments/983933364518125578/983933387251269632/luffy.png", tier: 2},
1: {name: "Sir Crocodile", type: ["specialist", "fruit", "tank"], link: "/Crocodile", img: "https://cdn.discordapp.com/attachments/983933364518125578/983933386982826014/crocodile.png", tier: 2},
2: {name: "Monkey D. Luffy (TS)", type: ["fighter", "fruit", "dps"], link: "/Luffy_(Timeskip)",img: "https://media.discordapp.net/attachments/983933364518125578/983933387481972756/luffyts.png", tier: 1},
3: {name: "Nami (TS)", type: ["specialist", "dps"], link: "/Nami_(Timeskip)",img: "https://cdn.discordapp.com/attachments/983933364518125578/983933387813318706/namits.png", tier: 1},
4: {name: "Alvida", type: ["fighter", "support"], link: "/Alvida",img: "https://cdn.discordapp.com/attachments/983933364518125578/983936406072229958/alvida.png", tier: 3}
};
$.each(characters, function (key, item) {
$("#characters-container").append(
"<div>"+
"<a href='http://70.39.70.36/index.php"+item.link+"'>"+
"<img src='"+item.img+"' alt='imagem de"+item.name+"' />"+
"</a>"+
"</div>"
);
});
//------- PERSONAGENS ---------
//------- SKILL TAB ---------
$('.tab-skill').on('click', function(){
$('.tab-skill.active').removeClass('active');
$(this).addClass('active');
});
//------- SKILL TAB ---------
});