Fórum grátis: ajuda e atendimento ao utilizador Forumeiros.com

Notificação na barra de navegação

2 participantes

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Notificação na barra de navegação

Mensagem por Nikkon 27.11.20 2:37

Detalhes da questão


Endereço do fórum: https://pernaesquerda.forumeiros.com/
Versão do fórum: ModernBB

Descrição


Eu de novo, espero não estar incomodando, eu estou muito grata com a vossa ajuda até agora u-u

Vi um tópico aqui sobre colocar as notificações na barra de navegação, mas infelizmente ela fica carregando infinitamente, não aparece nenhuma notificação e se fico no topo do fórum ela corta a parte branca.

Gostaria de colocar essa imagem no lugar do icone, a bola vermelha com os números no meio do sino e gostaria que as notificações ficassem entra as mensagens e o log off

aqui alguns erros que dá:

codigo atual:
Código:
        /**
         *! Modificação nas notificações.
         *
         *  @author Luiz~
         *  @see Fórum" target="_blank">https://ajuda.forumeiros.com">Fórum dos Fóruns
         *  @licence MIT
         */
        (function ($) {
          'use strict';
        
          var config = {
            max: 7,
            error: [
              'Houve um erro ao tentar carregar as notificações.',
              'Caso o problema continue, contate o suporte técnico.'
            ].join('\n')
          };
        
          $(window).on('load', function () {
          
              var $logout = $('ul.navlinks li a#logout');
          
              if (!$logout.length) {
                return;
              }
        
            var $faNotifyTrigger = $('<li>')
                .html([
                    '<a href="javascript:void(0)" class="mainmenu fa fa-bell" id="fa-custom-notification-trigger">',
                    ' <span class="pmlist-qtt">0</span>',
                    '</a>'
              ].join('\n'))
                .insertAfter('ul.navlinks li:first')
                .on('click', function (event) {
                  event.stopPropagation();
                  $faNotifyContent.toggleClass('hidden');
                })
            ;
        
            $(document).on('click', function () {
              if ($('.fa-notify-wrapper').is('.hidden')) {
                return;
              }
        
              $('.fa-notify-wrapper').toggleClass('hidden');
            });
        
            var $faNotifyContent = $([
              '<div class="fa-notify-wrapper hidden">',
              '  <header class="fa-notify-header">',
              '    <h4>Notificações</h4>',
              '    <a href="/profile?mode=editprofile&page_profil=notifications">Ver mais e configurações</a>',
              '  </header>',
              '  <div class="fa-notify-inner">',
              '    <div class="fa-notify-list">',
              '      <span class="fa-notify-loading">Carregando...</span>',
              '    </div>',
              '    <div class="fa-notify-date">',
              '    </div>',
              '  </div>',
              '</div>',
            ].join('\n'))
              .appendTo('#fa-custom-notification-trigger')
                .on('click', function (event) {
                  event.stopPropagation();
                })
            ;
        
            var cookiedPmlistCount = my_getcookie('fa_mplist_count');
            if (cookiedPmlistCount) {
              $faNotifyTrigger
                .find('span')
                  .text(cookiedPmlistCount)
              ;
            }
        
            $.get('/profile', {
              mode: 'editprofile',
              page_profil: 'notifications'
            })
              .done(function (context) {
        
                var $wrap = $('[name="notif_list"]', context);
                var $item = $wrap.find('table tr td:first-child');
        
                $item.each(function () {
        
                  var $this = $(this);
                  var $row = $(this).parent('tr');
        
                  var text = $this.html();
        
                  $('.fa-notify-loading').hide();
        
                  if ($row.index() < config.max) {
                    $faNotifyContent
                      .find('.fa-notify-list')
                        .append([
                          '<div class="notify-item">',
                          '  ' + text,
                          '</div>'
                        ].join('\n'))
                    ;
                  }
        
                  var notifyCount = $faNotifyContent
                    .find('.fa-notify-list .notify-item')
                      .length
                  ;
        
                  my_setcookie('fa_mplist_count', notifyCount);
                  var cookiedPmlistCount = my_getcookie('fa_mplist_count');
        
                  $faNotifyTrigger
                    .find('span')
                      .text(cookiedPmlistCount)
                  ;
        
                });
        
              })
              .fail(function () {
                console.warn(config.error);
              })
            ;
        
            var styles = [
              '@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);',
              '',
              '.hidden,',
              'html body div #fa_notifications {',
              '  opacity: 0!important;',
              '  pointer-events: none!important;',
              '}',
              '',
              'div#fa_toolbar {',
              '  display: none;',
              '}',
              '',
              'a#fa-custom-notification-trigger {',
              ' color: #666!important;',
              '  background-color: #fff;',
              '  font-size: 17px;',
              '  border-radius: 3px;',
              '  padding: 2px;',/*
              '  margin-right: 50px;',*/
              '  position: relative;',
              '}',
              '',
              'a#fa-custom-notification-trigger span {',
              '  position: absolute;',
              '  background-color: #e54732;',
              '  color: #fff;',
              '  font-size: 10px;',
              '  font-family: Arial, sans-serif;',
              '  padding: 1px 3.5px;',
              '  line-height: 11px;',
              '  border-radius: 999px;',
              '}',
              '',
              '.fa-notify-wrapper {',
              '  background: #FFF;',
              '  border-radius: 2px;',
              '  border: solid 1px #ddd;',
              '  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);',
              '  margin-top: 20px;',
              '  padding: 20px 13px;',
              '  left: 0!important;',
              '  top: 0!important;',
              '  width: 255px;',
              '  z-index: 999;',
              '  position: absolute;',
              '  display: block;',
              '  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";',
              '  font-size: 13px;',
              '}',
              '',
              '.fa-notify-wrapper,',
              '.fa-notify-wrapper * {',
              '  box-sizing: border-box;',
              '}',
              '',
              '.fa-notify-wrapper header h4 {',
              '  color: #666;',
              '  font-weight: 600;',
              '  font-size: 21px;',
              '  margin-top: 0px;',
              '  margin-bottom: 5px;',
              '  display: table;',
              '}',
              '',
              '.fa-notify-wrapper header a {',
              '  display: block;',
              '  padding-bottom: 15px;',
              '  text-align: left!important;',
              '}',
              '',
              '.fa-notify-wrapper a { ',
              '  color: black!important',
              '}',
              '',
              '.fa-notify-wrapper a, ',
              '.fa-notify-wrapper a:hover {',
              '  background-color: transparent!important;',
              '  color: grey!important;',
              '  box-shadow: none!important;',
              '  float: none!important;',
              '}',
              '',
              '.fa-notify-wrapper header {',
              '  display: block;',
              '  position: relative;',
              '  border-bottom: solid 1px #ddd;',
              '  margin-bottom: 15px;',
              '}',
              '',
              '.fa-notify-list {',
              '  counter-reset: section;',
              '}',
              '',
              '.notify-item {',
              '  text-align: left!important;',
              '  margin-bottom: 15px;',
              '  line-height: 1.2rem;',
              '}',
              '',
              '.notify-item::before {',
              '  counter-increment: section;',
              '  content: counter(section);',
              '  background-color: #ddd;',
              '  border-radius: 10px;',
              '  padding: 1.5px 7px;',
              '  color: #666666;',
              '  margin-right: 4px;',
              '}'
            ].join('\n');
        
            $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
        
          });
        }(jQuery));
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por tikky 27.11.20 11:11

Olá @Nikkon,

mas infelizmente ela fica carregando infinitamente, não aparece nenhuma notificação
Entre no Painel de controle > Módulos > Barra de Ferramentas > Configuração e ative a barra de ferramentas!

Gostaria de colocar essa imagem no lugar do icone
Altere o seu código para:
Código:
/**
         *! Modificação nas notificações.
         *
         *  @author Luiz~
         *  @see Fórum" target="_blank">https://ajuda.forumeiros.com">Fórum dos Fóruns
         *  @licence MIT
         */
        (function ($) {
          'use strict';
        
          var config = {
            max: 7,
            error: [
              'Houve um erro ao tentar carregar as notificações.',
              'Caso o problema continue, contate o suporte técnico.'
            ].join('\n')
          };
        
          $(window).on('load', function () {
          
              var $logout = $('ul.navlinks li a#logout');
          
              if (!$logout.length) {
                return;
              }
        
            var $faNotifyTrigger = $('<li>')
                .html([
                    '<a href="javascript:void(0)" class="mainmenu" id="fa-custom-notification-trigger">',
                    ' <img loading="lazy" src="https://i.ibb.co/0ZPwhMP/tgrwhhrh.png" alt="Notificações" /><span class="pmlist-qtt">0</span>',
                    '</a>'
              ].join('\n'))
                .insertAfter('ul.navlinks a[href="/privmsg?folder=inbox"]').parent()
                .on('click', function (event) {
                  event.stopPropagation();
                  $faNotifyContent.toggleClass('hidden');
                })
            ;
        
            $(document).on('click', function () {
              if ($('.fa-notify-wrapper').is('.hidden')) {
                return;
              }
        
              $('.fa-notify-wrapper').toggleClass('hidden');
            });
        
            var $faNotifyContent = $([
              '<div class="fa-notify-wrapper hidden">',
              '  <header class="fa-notify-header">',
              '    <h4>Notificações</h4>',
              '    <a href="/profile?mode=editprofile&page_profil=notifications">Ver mais e configurações</a>',
              '  </header>',
              '  <div class="fa-notify-inner">',
              '    <div class="fa-notify-list">',
              '      <span class="fa-notify-loading">Carregando...</span>',
              '    </div>',
              '    <div class="fa-notify-date">',
              '    </div>',
              '  </div>',
              '</div>',
            ].join('\n'))
              .appendTo('#fa-custom-notification-trigger')
                .on('click', function (event) {
                  event.stopPropagation();
                })
            ;
        
            var cookiedPmlistCount = my_getcookie('fa_mplist_count');
            if (cookiedPmlistCount) {
              $faNotifyTrigger
                .find('span')
                  .text(cookiedPmlistCount)
              ;
            }
        
            $.get('/profile', {
              mode: 'editprofile',
              page_profil: 'notifications'
            })
              .done(function (context) {
        
                var $wrap = $('[name="notif_list"]', context);
                var $item = $wrap.find('table tr td:first-child');
        
                $item.each(function () {
        
                  var $this = $(this);
                  var $row = $(this).parent('tr');
        
                  var text = $this.html();
        
                  $('.fa-notify-loading').hide();
        
                  if ($row.index() < config.max) {
                    $faNotifyContent
                      .find('.fa-notify-list')
                        .append([
                          '<div class="notify-item">',
                          '  ' + text,
                          '</div>'
                        ].join('\n'))
                    ;
                  }
        
                  var notifyCount = $faNotifyContent
                    .find('.fa-notify-list .notify-item')
                      .length
                  ;
        
                  my_setcookie('fa_mplist_count', notifyCount);
                  var cookiedPmlistCount = my_getcookie('fa_mplist_count');
        
                  $faNotifyTrigger
                    .find('span')
                      .text(cookiedPmlistCount)
                  ;
        
                });
        
              })
              .fail(function () {
                console.warn(config.error);
              })
            ;
        
            var styles = [
              '@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);',
              '',
              '.hidden,',
              'html body div #fa_notifications {',
              '  opacity: 0!important;',
              '  pointer-events: none!important;',
              '}',
              '',
              'div#fa_toolbar {',
              '  display: none;',
              '}',
              '',
              'a#fa-custom-notification-trigger {',
              /*' color: #666!important;',
              '  background-color: #fff;',
              '  font-size: 17px;',
              '  border-radius: 3px;',
              '  padding: 2px;',
              '  margin-right: 50px;',*/
              '  position: relative;',
              '}',
              '',
              'a#fa-custom-notification-trigger span {',
              '  position: absolute;',
              '  background-color: #e54732;',
              '  color: #fff;',
              '  font-size: 10px;',
              '  font-family: Arial, sans-serif;',
              '  padding: 1px 3.5px;',
              '  line-height: 11px;',
              '  border-radius: 999px;',
              '}',
              '',
              '.fa-notify-wrapper {',
              '  background: #FFF;',
              '  border-radius: 2px;',
              '  border: solid 1px #ddd;',
              '  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);',
              '  margin-top: 20px;',
              '  padding: 20px 13px;',
              '  left: 0!important;',
              '  top: 0!important;',
              '  width: 255px;',
              '  z-index: 999;',
              '  position: absolute;',
              '  display: block;',
              '  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";',
              '  font-size: 13px;',
              '}',
              '',
              '.fa-notify-wrapper,',
              '.fa-notify-wrapper * {',
              '  box-sizing: border-box;',
              '}',
              '',
              '.fa-notify-wrapper header h4 {',
              '  color: #666;',
              '  font-weight: 600;',
              '  font-size: 21px;',
              '  margin-top: 0px;',
              '  margin-bottom: 5px;',
              '  display: table;',
              '}',
              '',
              '.fa-notify-wrapper header a {',
              '  display: block;',
              '  padding-bottom: 15px;',
              '  text-align: left!important;',
              '}',
              '',
              '.fa-notify-wrapper a { ',
              '  color: black!important',
              '}',
              '',
              '.fa-notify-wrapper a, ',
              '.fa-notify-wrapper a:hover {',
              '  background-color: transparent!important;',
              '  color: grey!important;',
              '  box-shadow: none!important;',
              '  float: none!important;',
              '}',
              '',
              '.fa-notify-wrapper header {',
              '  display: block;',
              '  position: relative;',
              '  border-bottom: solid 1px #ddd;',
              '  margin-bottom: 15px;',
              '}',
              '',
              '.fa-notify-list {',
              '  counter-reset: section;',
              '}',
              '',
              '.notify-item {',
              '  text-align: left!important;',
              '  margin-bottom: 15px;',
              '  line-height: 1.2rem;',
              '}',
              '',
              '.notify-item::before {',
              '  counter-increment: section;',
              '  content: counter(section);',
              '  background-color: #ddd;',
              '  border-radius: 10px;',
              '  padding: 1.5px 7px;',
              '  color: #666666;',
              '  margin-right: 4px;',
              '}'
            ].join('\n');
        
            $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
        
          });
        }(jQuery));

Aqui alguns erros que dá
Não consigo replicar o/a senhor/a tem alguma conta teste no seu fórum para que possa resolver?!


Aguardamos uma resposta sua!
Atenciosamente,
pedxz.
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7970
Pontos : 9234

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 27.11.20 16:11

Olá Pedxz, Ativei a barra, gostaria que tivesse um X pra deletar cada notificação, pois ela fica la pra sempre.

Coloquei o código, mas a img não apareceu
Notificação na barra de navegação Image

Sobre a conta:Teste senha:teste123



edit, arrumei esse problema sem querer, pois mudei como o navbar funciona, o problema é o resto u-u
Notificação na barra de navegação Image
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 28.11.20 16:49

up

Modifiquei um pouco o codigo, vou colocar aqui:
está asism atualmente:

Notificação na barra de navegação Image

talvez ficou confuso o que gostaria, então vou falar tudo aqui, ainda gostaria de colocar uma img no lugar no futuro, mas por enquanto está bom assim, gostaria que colocasse o span q é o numero de notificação no meio do sino. A notificação fica para sempre na barra de notificação, gostaria de um x em cada notificação para deletar as que não quero mais, alem disso tudo, um erro interessante ocorre quando coloco pra "todas as paginas" o conteudo dos spoilers no forum desaparece nos tópicos, se eu mudo o opacity para 1 o spoiler volta a funcionar mas as notificaçoes ficam pra sempre na pagina.

Código:
'html body div #fa_notifications {',                      
                      '  pointer-events: none!important;',
                      '  opacity: 0 !important;',
                      '}',

fonte atual que estou usando, copiei algumas coisas do seu e botei no antigo
Código:
/**
                 *! Modificação nas notificações.
                 *
                 *  @author Luiz~
                 *  @see Fórum" target="_blank">Fórum" target="_blank">https://ajuda.forumeiros.com">Fórum dos Fóruns
                 *  @licence MIT
                 */
                (function ($) {
                  'use strict';
                
                  var config = {
                    max: 7,
                    error: [
                      'Houve um erro ao tentar carregar as notificações.',
                      'Caso o problema continue, contate o suporte técnico.'
                    ].join('\n')
                  };
                
                  $(window).on('load', function () {
                  
                      var $logout = $('ul.navlinks li a#logout');
                  
                      if (!$logout.length) {
                        return;
                      }
                
                    var $faNotifyTrigger = $('<li>')
                        .html([
                            '<a href="javascript:void(0)" class="mainmenu fa fa-bell" id="fa-custom-notification-trigger">',
                            ' <span class="pmlist-qtt">0</span>',
                            '</a>'
                      ].join('\n'))
                        .insertAfter('ul.navlinks a[href="/privmsg?folder=inbox"]').parent()
                        .on('click', function (event) {
                          event.stopPropagation();
                          $faNotifyContent.toggleClass('hidden');
                        })
                    ;
                
                    $(document).on('click', function () {
                      if ($('.fa-notify-wrapper').is('.hidden')) {
                        return;
                      }
                
                      $('.fa-notify-wrapper').toggleClass('hidden');
                    });
                
                    var $faNotifyContent = $([
                      '<div class="fa-notify-wrapper hidden">',
                      '  <header class="fa-notify-header">',
                      '    <h4>Notificações</h4>',
                      '    <a href="/profile?mode=editprofile&page_profil=notifications">Ver mais e configurações</a>',
                      '  </header>',
                      '  <div class="fa-notify-inner">',
                      '    <div class="fa-notify-list">',
                      '      <span class="fa-notify-loading">Carregando...</span>',
                      '    </div>',
                      '    <div class="fa-notify-date">',
                      '    </div>',
                      '  </div>',
                      '</div>',
                    ].join('\n'))
                      .appendTo('#fa-custom-notification-trigger')
                        .on('click', function (event) {
                          event.stopPropagation();
                        })
                    ;
                
                    var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                    if (cookiedPmlistCount) {
                      $faNotifyTrigger
                        .find('span')
                          .text(cookiedPmlistCount)
                      ;
                    }
                
                    $.get('/profile', {
                      mode: 'editprofile',
                      page_profil: 'notifications'
                    })
                      .done(function (context) {
                
                        var $wrap = $('[name="notif_list"]', context);
                        var $item = $wrap.find('table tr td:first-child');
                
                        $item.each(function () {
                
                          var $this = $(this);
                          var $row = $(this).parent('tr');
                
                          var text = $this.html();
                
                          $('.fa-notify-loading').hide();
                
                          if ($row.index() < config.max) {
                            $faNotifyContent
                              .find('.fa-notify-list')
                                .append([
                                  '<div class="notify-item">',
                                  '  ' + text,
                                  '</div>'
                                ].join('\n'))
                            ;
                          }
                
                          var notifyCount = $faNotifyContent
                            .find('.fa-notify-list .notify-item')
                              .length
                          ;
                
                          my_setcookie('fa_mplist_count', notifyCount);
                          var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                
                          $faNotifyTrigger
                            .find('span')
                              .text(cookiedPmlistCount)
                          ;
                
                        });
                
                      })
                      .fail(function () {
                        console.warn(config.error);
                      })
                    ;
                
                    var styles = [
                      '@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);',
                      '',
                      '.hidden,',
                      'html body div #fa_notifications {',                      
                      '  pointer-events: none!important;',
                      '  opacity: 0 !important;',
                      '}',
                      '',
                      'div#fa_toolbar {',
                      '  display: none;',
                      '}',
                      '',
                      'a#fa-custom-notification-trigger {',
                      ' color: #e93023 !important;',
                      
                   ' top: -4px;',
                      '  font-size: 28px;',
                      '  border-radius: 3px;',
                      '  position: relative;',
                      '}',
                      '',
              'a#fa-custom-notification-trigger span {',
              '  position: absolute;',

              '  color: #fff;',
              '  font-size: 12px;',
              '  font-family: Rajdhani, sans-serif;',
              '  padding: 1px 3.5px;',
              '  line-height: 11px;',
              '  border-radius: 999px;',
  
                          
                      '}',
                      '',
                      '.fa-notify-wrapper {',
                      '  background: #FFF;',
                      '  border-radius: 2px;',
                      '  border: solid 1px #ddd;',
                      '  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);',
                      '  margin-top: 20px;',
                      '  padding: 20px 13px;',
                      '  left: 0!important;',
                      '  top: 14px !important;',
                      '  width: 255px;',
                      '  z-index: 999;',
                      '  position: absolute;',
                      '  display: block;',
                      '  font-family: Rajdhani, sans-serif;',
                      '  font-size: 13px;',
                      '}',
                      '',
                      '.fa-notify-wrapper,',
                      '.fa-notify-wrapper * {',
                      '  box-sizing: border-box;',
                      '}',
                      '',
                      '.fa-notify-wrapper header h4 {',
                      '  color: #666;',
                      '  font-weight: 600;',
                      '  font-size: 21px;',
                      '  margin-top: 0px;',
                      '  margin-bottom: 5px;',
                      '  display: table;',
                      '}',
                      '',
                      '.fa-notify-wrapper header a {',
                      '  display: block;',
                      '  padding-bottom: 15px;',
                      '  text-align: left!important;',
                      '}',
                      '',
                      '.fa-notify-wrapper a { ',
                      '  color: black!important',
                      '}',
                      '',
                      '.fa-notify-wrapper a, ',
                      '.fa-notify-wrapper a:hover {',
                      '  background-color: transparent!important;',
                      '  color: grey!important;',
                      '  box-shadow: none!important;',
                      '  float: none!important;',
                      '}',
                      '',
                      '.fa-notify-wrapper header {',
                      '  display: block;',
                      '  position: relative;',
                      '  border-bottom: solid 1px #ddd;',
                      '  margin-bottom: 15px;',
                      '}',
                      '',
                      '.fa-notify-list {',
                      '  counter-reset: section;',
                      '}',
                      '',
                      '.notify-item {',
                      '  text-align: left!important;',
                      '  margin-bottom: 15px;',
                      '  line-height: 1.2rem;',
                      '}',
                      '',
                      '.notify-item::before {',
                      '  counter-increment: section;',
                      '  content: counter(section);',
                      '  background-color: #ddd;',
                      '  border-radius: 10px;',
                      '  padding: 1.5px 7px;',
                      '  color: #666666;',
                      '  margin-right: 4px;',
                      '}'
                    ].join('\n');
                
                    $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
                
                  });
                }(jQuery));
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 30.11.20 13:28

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por tikky 30.11.20 14:06

um erro interessante ocorre quando coloco pra "todas as paginas" o conteudo dos spoilers no forum desaparece nos tópicos
O/A senhor/a pode ativar o script em todas as páginas, por favor?
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7970
Pontos : 9234

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 30.11.20 15:29

@pedxz feito u-u
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por tikky 30.11.20 15:38

Altere o seu código para:
Código:
        /**
                        *! Modificação nas notificações.
                        *
                        *  @author Luiz~
                        *  @see Fórum" target="_blank">Fórum" target="_blank">https://ajuda.forumeiros.com">Fórum dos Fóruns
                        *  @licence MIT
                        */
                        (function ($) {
                          'use strict';
                       
                          var config = {
                            max: 7,
                            error: [
                              'Houve um erro ao tentar carregar as notificações.',
                              'Caso o problema continue, contate o suporte técnico.'
                            ].join('\n')
                          };
                       
                          $(window).on('load', function () {
                         
                              var $logout = $('ul.navlinks li a#logout');
                         
                              if (!$logout.length) {
                                return;
                              }
                       
                            var $faNotifyTrigger = $('<li>')
                                .html([
                                    '<a href="javascript:void(0)" class="mainmenu fa fa-bell" id="fa-custom-notification-trigger">',
                                    ' <span class="pmlist-qtt">0</span>',
                                    '</a>'
                              ].join('\n'))
                                .insertAfter('ul.navlinks a[href="/privmsg?folder=inbox"]').parent()
                                .on('click', function (event) {
                                  event.stopPropagation();
                                  $faNotifyContent.toggleClass('hidden');
                                })
                            ;
                       
                            $(document).on('click', function () {
                              if ($('.fa-notify-wrapper').is('.hidden')) {
                                return;
                              }
                       
                              $('.fa-notify-wrapper').toggleClass('hidden');
                            });
                       
                            var $faNotifyContent = $([
                              '<div class="fa-notify-wrapper hidden">',
                              '  <header class="fa-notify-header">',
                              '    <h4>Notificações</h4>',
                              '    <a href="/profile?mode=editprofile&page_profil=notifications">Ver mais e configurações</a>',
                              '  </header>',
                              '  <div class="fa-notify-inner">',
                              '    <div class="fa-notify-list">',
                              '      <span class="fa-notify-loading">Carregando...</span>',
                              '    </div>',
                              '    <div class="fa-notify-date">',
                              '    </div>',
                              '  </div>',
                              '</div>',
                            ].join('\n'))
                              .appendTo('#fa-custom-notification-trigger')
                                .on('click', function (event) {
                                  event.stopPropagation();
                                })
                            ;
                       
                            var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                            if (cookiedPmlistCount) {
                              $faNotifyTrigger
                                .find('span')
                                  .text(cookiedPmlistCount)
                              ;
                            }
                       
                            $.get('/profile', {
                              mode: 'editprofile',
                              page_profil: 'notifications'
                            })
                              .done(function (context) {
                       
                                var $wrap = $('[name="notif_list"]', context);
                                var $item = $wrap.find('table tr td:first-child');
                       
                                $item.each(function () {
                       
                                  var $this = $(this);
                                  var $row = $(this).parent('tr');
                       
                                  var text = $this.html();
                       
                                  $('.fa-notify-loading').hide();
                       
                                  if ($row.index() < config.max) {
                                    $faNotifyContent
                                      .find('.fa-notify-list')
                                        .append([
                                          '<div class="notify-item">',
                                          '  ' + text,
                                          '</div>'
                                        ].join('\n'))
                                    ;
                                  }
                       
                                  var notifyCount = $faNotifyContent
                                    .find('.fa-notify-list .notify-item')
                                      .length
                                  ;
                       
                                  my_setcookie('fa_mplist_count', notifyCount);
                                  var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                       
                                  $faNotifyTrigger
                                    .find('span')
                                      .text(cookiedPmlistCount)
                                  ;
                       
                                });
                       
                              })
                              .fail(function () {
                                console.warn(config.error);
                              })
                            ;
                       
                            var styles = [
                              '@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);',
                              '',
                              '.fa-notify-wrapper.hidden,',
                              'html body div #fa_notifications {',                     
                              '  pointer-events: none!important;',
                              '  opacity: 0 !important;',
                              '}',
                              '',
                              'div#fa_toolbar {',
                              '  display: none;',
                              '}',
                              '',
                              'a#fa-custom-notification-trigger {',
                              ' color: #e93023 !important;',
                             
                          ' top: -4px;',
                              '  font-size: 28px;',
                              '  border-radius: 3px;',
                              '  position: relative;',
                              '}',
                              '',
                      'a#fa-custom-notification-trigger span {',
                      '  position: absolute;',
       
                      '  color: #000;',
                      '  font-size: 12px;',
                      '  font-family: Rajdhani, sans-serif;',
                      '  padding: 1px 3.5px;',
                      '  line-height: 11px;',
                      '  border-radius: 50%;',
          'right: 16px;',
 'background: white;',
 'height: 16px;',
 'width: 16px;',
 'line-height: 16px;',
 'top: 3px;',
                                 
                              '}',
                              '',
                              '.fa-notify-wrapper {',
                              '  background: #FFF;',
                              '  border-radius: 2px;',
                              '  border: solid 1px #ddd;',
                              '  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);',
                              '  margin-top: 20px;',
                              '  padding: 20px 13px;',
                              '  left: 0!important;',
                              '  top: 14px !important;',
                              '  width: 255px;',
                              '  z-index: 999;',
                              '  position: absolute;',
                              '  display: block;',
                              '  font-family: Rajdhani, sans-serif;',
                              '  font-size: 13px;',
                              '}',
                              '',
                              '.fa-notify-wrapper,',
                              '.fa-notify-wrapper * {',
                              '  box-sizing: border-box;',
                              '}',
                              '',
                              '.fa-notify-wrapper header h4 {',
                              '  color: #666;',
                              '  font-weight: 600;',
                              '  font-size: 21px;',
                              '  margin-top: 0px;',
                              '  margin-bottom: 5px;',
                              '  display: table;',
                              '}',
                              '',
                              '.fa-notify-wrapper header a {',
                              '  display: block;',
                              '  padding-bottom: 15px;',
                              '  text-align: left!important;',
                              '}',
                              '',
                              '.fa-notify-wrapper a { ',
                              '  color: black!important',
                              '}',
                              '',
                              '.fa-notify-wrapper a, ',
                              '.fa-notify-wrapper a:hover {',
                              '  background-color: transparent!important;',
                              '  color: grey!important;',
                              '  box-shadow: none!important;',
                              '  float: none!important;',
                              '}',
                              '',
                              '.fa-notify-wrapper header {',
                              '  display: block;',
                              '  position: relative;',
                              '  border-bottom: solid 1px #ddd;',
                              '  margin-bottom: 15px;',
                              '}',
                              '',
                              '.fa-notify-list {',
                              '  counter-reset: section;',
                              '}',
                              '',
                              '.notify-item {',
                              '  text-align: left!important;',
                              '  margin-bottom: 15px;',
                              '  line-height: 1.2rem;',
                              '}',
                              '',
                              '.notify-item::before {',
                              '  counter-increment: section;',
                              '  content: counter(section);',
                              '  background-color: #ddd;',
                              '  border-radius: 10px;',
                              '  padding: 1.5px 7px;',
                              '  color: #666666;',
                              '  margin-right: 4px;',
                              '}'
                            ].join('\n');
                       
                            $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
                       
                          });
                        }(jQuery));
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7970
Pontos : 9234

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 30.11.20 15:46

ficou perfeito Pedxz, unica coisa q falta é o x em cada notificação

Notificação na barra de navegação Image
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 01.12.20 19:07

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 04.12.20 3:34

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 07.12.20 14:22

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 09.12.20 3:20

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 12.12.20 13:58

up...
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 16.12.20 0:35

up
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por tikky 21.12.20 15:47

Altere o seu código para:
Código:
/**
                                *! Modificação nas notificações.
                                *
                                *  @author Luiz~
                                *  @see Fórum" target="_blank">Fórum" target="_blank">https://ajuda.forumeiros.com">Fórum dos Fóruns
                                *  @licence MIT
                                */
                                (function ($) {
                                  'use strict';
                              
                                  var config = {
                                    max: 7,
                                    error: [
                                      'Houve um erro ao tentar carregar as notificações.',
                                      'Caso o problema continue, contate o suporte técnico.'
                                    ].join('\n')
                                  };
                              
                                  $(window).on('load', function () {
                                
                                      var $logout = $('ul.navlinks li a#logout');
                                
                                      if (!$logout.length) {
                                        return;
                                      }
                              
                                    var $faNotifyTrigger = $('<li>')
                                        .html([
                                            '<a href="javascript:void(0)" class="mainmenu fa fa-bell" id="fa-custom-notification-trigger">',
                                            ' <span class="pmlist-qtt">0</span>',
                                            '</a>'
                                      ].join('\n'))
                                        .insertAfter('ul.navlinks a[href="/privmsg?folder=inbox"]').parent()
                                        .on('click', function (event) {
                                          event.stopPropagation();
                                          $faNotifyContent.toggleClass('hidden');
                                        })
                                    ;
                              
                                    $(document).on('click', function () {
                                      if ($('.fa-notify-wrapper').is('.hidden')) {
                                        return;
                                      }
                              
                                      $('.fa-notify-wrapper').toggleClass('hidden');
                                    });
                              
                                    var $faNotifyContent = $([
                                      '<div class="fa-notify-wrapper hidden">',
                                      '  <header class="fa-notify-header">',
                                      '    <h4>Notificações</h4>',
                                      '    <a href="/profile?mode=editprofile&page_profil=notifications">Ver mais e configurações</a>',
                                      '  </header>',
                                      '  <div class="fa-notify-inner">',
                                      '     <form method="post" name="notif_opts" action="/profile?mode=editprofile&page_profil=notifications">',
                                      '    <div class="fa-notify-list">',
                                      '      <span class="fa-notify-loading">Carregando...</span>',
                                      '    </div>',
                                      '    <div class="fa-notify-date">',
                                      '    </div>',
                                      ' <fieldset class="submit-buttons"><input class="button1" type="submit" name="delete" value="Excluir"><input class="button1" type="submit" name="delete_all" value="Excluir Tudo" style="font-weight: bold;"></fieldset>',
                                      '    </form>',
                                      '  </div>',
                                      '</div>',
                                    ].join('\n'))
                                      .appendTo('#fa-custom-notification-trigger')
                                        .on('click', function (event) {
                                          event.stopPropagation();
                                        })
                                    ;
                              
                                    var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                                    if (cookiedPmlistCount) {
                                      $faNotifyTrigger
                                        .find('span')
                                          .text(cookiedPmlistCount)
                                      ;
                                    }
                              
                                    $.get('/profile', {
                                      mode: 'editprofile',
                                      page_profil: 'notifications'
                                    })
                                      .done(function (context) {
                              
                                        var $wrap = $('[name="notif_list"]', context);
                                        var $item = $wrap.find('table tr td:first-child');
                              
                                        $item.each(function () {
                              
                                          var $this = $(this);
                                          var $row = $(this).parent('tr');
                              
                                          var text = $this.html();
                                          var $delete = $this.parent().find('td:last').html();
                              
                                          $('.fa-notify-loading').hide();
                              
                                          if ($row.index() < config.max) {
                                            $faNotifyContent
                                              .find('.fa-notify-list')
                                                .append([
                                                  '<div class="notify-item">',
                                                  '  ' + text,
                                                  '  ' + $delete,
                                                  '</div>'
                                                ].join('\n'))
                                            ;
                                          }
                              
                                          var notifyCount = $faNotifyContent
                                            .find('.fa-notify-list .notify-item')
                                              .length
                                          ;
                              
                                          my_setcookie('fa_mplist_count', notifyCount);
                                          var cookiedPmlistCount = my_getcookie('fa_mplist_count');
                              
                                          $faNotifyTrigger
                                            .find('span')
                                              .text(cookiedPmlistCount)
                                          ;
                              
                                        });
                              
                                      })
                                      .fail(function () {
                                        console.warn(config.error);
                                      })
                                    ;
                              
                                    var styles = [
                                      '@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);',
                                      '',
                                      '.fa-notify-wrapper.hidden,',
                                      'html body div #fa_notifications {',                    
                                      '  pointer-events: none!important;',
                                      '  opacity: 0 !important;',
                                      '}',
                                      '',
                                      'div#fa_toolbar {',
                                      '  display: none;',
                                      '}',
                                      '',
                                      'a#fa-custom-notification-trigger {',
                                      ' color: #e93023 !important;',
                                    
                                  ' top: -4px;',
                                      '  font-size: 28px;',
                                      '  border-radius: 3px;',
                                      '  position: relative;',
                                      '}',
                                      '',
                              'a#fa-custom-notification-trigger span {',
                              '  position: absolute;',
              
                              '  color: #000;',
                              '  font-size: 12px;',
                              '  font-family: Rajdhani, sans-serif;',
                              '  padding: 1px 3.5px;',
                              '  line-height: 11px;',
                              '  border-radius: 50%;',
                  'right: 16px;',
         'background: white;',
         'height: 16px;',
         'width: 16px;',
         'line-height: 16px;',
         'top: 3px;',
                                        
                                      '}',
                                      '',
                                      '.fa-notify-wrapper {',
                                      '  background: #FFF;',
                                      '  border-radius: 2px;',
                                      '  border: solid 1px #ddd;',
                                      '  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);',
                                      '  margin-top: 20px;',
                                      '  padding: 20px 13px;',
                                      '  left: 0!important;',
                                      '  top: 14px !important;',
                                      '  width: 255px;',
                                      '  z-index: 999;',
                                      '  position: absolute;',
                                      '  display: block;',
                                      '  font-family: Rajdhani, sans-serif;',
                                      '  font-size: 13px;',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper,',
                                      '.fa-notify-wrapper * {',
                                      '  box-sizing: border-box;',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper header h4 {',
                                      '  color: #666;',
                                      '  font-weight: 600;',
                                      '  font-size: 21px;',
                                      '  margin-top: 0px;',
                                      '  margin-bottom: 5px;',
                                      '  display: table;',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper header a {',
                                      '  display: block;',
                                      '  padding-bottom: 15px;',
                                      '  text-align: left!important;',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper a { ',
                                      '  color: black!important',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper a, ',
                                      '.fa-notify-wrapper a:hover {',
                                      '  background-color: transparent!important;',
                                      '  color: grey!important;',
                                      '  box-shadow: none!important;',
                                      '  float: none!important;',
                                      '}',
                                      '',
                                      '.fa-notify-wrapper header {',
                                      '  display: block;',
                                      '  position: relative;',
                                      '  border-bottom: solid 1px #ddd;',
                                      '  margin-bottom: 15px;',
                                      '}',
                                      '',
                                      '.fa-notify-list {',
                                      '  counter-reset: section;',
                                      '}',
                                      '',
                                      '.notify-item {',
                                      '  text-align: left!important;',
                                      '  margin-bottom: 15px;',
                                      '  line-height: 1.2rem;',
                                      '}',
                                      '',
                                      '.notify-item [name="del_notif[]"] {',
                                      '  float: right!important;',
                                      '}',
                                      '',
                                      '.notify-item::before {',
                                      '  counter-increment: section;',
                                      '  content: counter(section);',
                                      '  background-color: #ddd;',
                                      '  border-radius: 10px;',
                                      '  padding: 1.5px 7px;',
                                      '  color: #666666;',
                                      '  margin-right: 4px;',
                                      '}'
                                    ].join('\n');
                              
                                    $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
                              
                                  });
                                }(jQuery));
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7970
Pontos : 9234

Ir para o topo Ir para baixo

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por Nikkon 25.12.20 0:01

@pedxz Agora que vi, me desculpe por demorar, coloquei o código e funcionou, porem quando aperto o botão de excluir a pagina redireciona para a pagina de notificações https://i.ibb.co/17c8B2r/image.png (tinham duas notificações e deletei só uma)
Nikkon

Nikkon
*

Membro desde : 12/10/2020
Mensagens : 32
Pontos : 48

https://pernaesquerda.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Notificação na barra de navegação

Mensagem por tikky 04.01.21 17:39

Tópico resolvido


Tópico arquivado por inatividade por parte do autor, marcado como resolvido por ter solução apropriada à questão.
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7970
Pontos : 9234

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery

Permissões neste sub-fórum
Não podes responder a tópicos