Logo de acordo com o RANK

Detalhes da questão

Endereço do fórum: http://aurea.forumeiros.com
Versão do fórum: phpBB3

Descrição

Boa tarde!

Estou utilizando o seguinte código para alterar o fundo do perfil de meus usuários, de acordo com o RANK a qual ele pertence:

Código:

$(function() {

    $('.post').each(function() {

        var getthisId = $(this).attr('id'),
            getColor = $('#' + getthisId + ' .nome span').css('color'),
            selectors = [
              '.imagem-grupo',
              ];

        if (getColor == 'rgb(116, 145, 181)') { /* azul */
            $('#' + getthisId).find(selectors.join(',')).css('backgroundImage','url(https://files.jcink.net/uploads2/chiron/MGIheir.png)');
        }

        if (getColor == 'rgb(207, 71, 71)') { /* vermelho */
            $('#' + getthisId).find(selectors.join(',')).css('backgroundImage','url(https://files.jcink.net/uploads2/chiron/MGIknight.png)');
        }

        if (getColor == 'rgb(196, 88, 139)') { /* rosa */
           $('#' + getthisId).find(selectors.join(',')).css('backgroundImage','url(https://files.jcink.net/uploads2/chiron/MGmaid.png)');
        }

        if (getColor == 'rgb(100, 134, 114)') { /* verde */
            $('#' + getthisId).find(selectors.join(',')).css('backgroundImage','url(https://files.jcink.net/uploads2/chiron/MGIpage.png)');
        }
              
    });
});

Efeito: https://aurea.forumeiros.com/t3-lorem-ipsum-dolor-sit-amet

Eu gostaria de aplica-lo ao meu logo, no entanto quando reescrevo o código, adaptando para ele, não acontece nada. De modo que as imagens não aparecem:

Código:

$(function() {

    $('.recolorir').each(function() {

        var getthisId = $(this).attr('id'),
            getColor = $('#' + getthisId + '.cor-grupo > span[style]').css('color'),
            selectors = [
              '.logo-imagem',
              ];

        if (getColor == 'rgb(207, 71, 71)') { /* vermelho */
            $('#' + getthisId).find(selectors.join(',')).css('backgroundImage','url(https://files.jcink.net/uploads2/chiron/MGIknight.png)');
        }
      
    });
});

O logo deve aparecer dentro da div

Código:

.logo-imagem

Olá,

Poderia criar uma conta teste e atribuir algum dos rank para ser feito testes? Lembrando que a conta não pode conter poderes administrativos.

Até mais!

Roevs escreveu:Olá,

Poderia criar uma conta teste e atribuir algum dos rank para ser feito testes? Lembrando que a conta não pode conter poderes administrativos.

Até mais!

Olá!

Usuário: teste
Senha: testeteste

Montei um código baseado no rank que aparece na barra de notificações.

Código:

$(function () {
    var rank = $('#fa_ranktitle').text();
   
    if (rank = 'caçadora') {
        $('.logo-imagem').css('background-image','url(https://i.imgur.com/4PMVmfp.png)');
    }
});

Basta só replicar os ifs com todos os ranks.

Key of Destiny escreveu:Montei um código baseado no rank que aparece na barra de notificações.

Código:

$(function () {
    var rank = $('#fa_ranktitle').text();
    
    if (rank = 'caçadora') {
        $('.logo-imagem').css('background-image','url(https://i.imgur.com/4PMVmfp.png)');
    }
});

Basta só replicar os ifs com todos os ranks.

Olá, boa tarde.
Primeiro, muito obrigado pelo auxílio.

O código funcionou no primeiro instante, no entanto, a ideia geral é que, para cada RANK haja um logo. Quando tentei acrescentar novos ranks/imagens ao código, o seguinte efeito surgiu:

1- Ele prioriza inserir a ultima imagem do JQ.
2- Ele não altera a imagem de acordo com o RANK, de modo que mesmo modificando o RANK sempre permanece a mesma imagem.

zHugh escreveu:

Key of Destiny escreveu:Montei um código baseado no rank que aparece na barra de notificações.

Código:

$(function () {
    var rank = $('#fa_ranktitle').text();
    
    if (rank = 'caçadora') {
        $('.logo-imagem').css('background-image','url(https://i.imgur.com/4PMVmfp.png)');
    }
});

Basta só replicar os ifs com todos os ranks.

Olá, boa tarde.
Primeiro, muito obrigado pelo auxílio.

O código funcionou no primeiro instante, no entanto, a ideia geral é que, para cada RANK haja um logo. Quando tentei acrescentar novos ranks/imagens ao código, o seguinte efeito surgiu:

1- Ele prioriza inserir a ultima imagem do JQ.
2- Ele não altera a imagem de acordo com o RANK, de modo que mesmo modificando o RANK sempre permanece a mesma imagem.

Estranho, pois fiz um teste em separado mudando manualmente o nome do rank  pelo inspecionar elemento e funcionou.

Você está usando o sistema padrão de ranks do fórum ou algum campo de perfil do usuário? A variável que eu usei no código tem relação com o sistema base, então talvez possa ser isso que esteja dando galho.

De qualquer forma, pode me passar como ficou o código depois que você fez a adição dos ifs?

---

Edit: Fiz o teste aqui de novo e aparentemente adicionando os else if, o código funciona novamente. Muito estranho, porque já tinha virado um costume não usá-los, mas basta colocar um else antes de cada if que volta a funcionar.

Código:

$(function () {
    var rank = $('#fa_ranktitle').text();
    
    if (rank = 'caçadora') {
        $('.logo-imagem').css('background-image','url(https://i.imgur.com/4PMVmfp.png)');
    }
    else if (rank = 'treinador') {
        $('.logo-imagem').css('background-image','url(https://images2.imgbox.com/75/93/mGg9GK8B_o.png)');
    }
});

Olá,

O fórum está utilizando o sistema padrão dos Ranks.

No entanto, mesmo utilizando o Else if, não funcionou. Permanece da mesma forma.

Quando insiro o código, ele inclui essa primeira imagem no logo https://i.imgur.com/4PMVmfp.png
Porém quando troco para o Rank Treinador, a imagem permanece a mesma ao atualizar a pagina.

Rapaz, às vezes a gente erra umas coisas bobas no código. Achei estranho que estava "funcionando" com as letras minúsculas mesmo. aueheuahue

Troque por esse e veja se resulta.

Código:

$(function () {
    var rank = $('#fa_ranktitle').text();
   
    if (rank == 'Caçadora') {
        $('.logo-imagem').css('background-image','url(https://i.imgur.com/4PMVmfp.png)');
    }
    else if (rank == 'Treinador') {
        $('.logo-imagem').css('background-image','url(https://images2.imgbox.com/75/93/mGg9GK8B_o.png)');
    }
});

Esse "funcionou"!

Quando eu o inseri, a imagem parou de aparecer. Fiz alguns testes usando o console e, realmente, ele esta adicionando a imagem conforme o RANK.
Porém isso só acontece quando eu executo o console com a barra de ferramentas aberta.

Creio eu que talvez seja melhor usar a DIV de base para os ranks que eu criei, captando a cor/texto direto dela.

No caso, seria a .cor-grupo

@@@@@
Edit: Percebi que mesmo com o painel fechado ele reconhece quando o codigo é inputado via console.... Não sei então o que poderia ser kkkk

Olá @zHugh e @Key of Destiny (obrigado),

Porém isso só acontece quando eu executo o console com a barra de ferramentas aberta

Exato! O código em cima usa o rank que aparece na barra de ferramentas, então, o código só deve funcionar após o carregamento da página, altere:

Código:

$(function () {

para

Código:

$(window).on('load', function() {

Atenciosamente,
pedxz.

pedxz escreveu:Olá @zHugh e @"Key of Destiny" (obrigado),

Porém isso só acontece quando eu executo o console com a barra de ferramentas aberta

Exato! O código em cima usa o rank que aparece na barra de ferramentas, então, o código só deve funcionar após o carregamento da página, altere:

Código:

$(function () {

para

Código:

$(window).on('load', function() {

Atenciosamente,
pedxz.

Opa, agora funcionou perfeitamente!

Muito obrigado aos dois pelo auxilio

Tópico resolvido Movido para "Questões resolvidas".