Você não está conectado. Conecte-se ou registre-se

[Botão] Notificação Bugado

Ir em baixo  Mensagem [Página 1 de 1]

1 [Botão] Notificação Bugado em Ter Fev 03, 2015 3:40 pm

Júnior Duarte

avatar
Membro elite

Olá galera, gostaria de pedir ajuda para sanar esse problema.

Na skin há o botão Notificações mas ele não funciona, gostaria de deixa-lo ativo assim como no da barra de ferramentas do Forumeiros, gostaria dos ícones em numeros e a lista, alguem pode ajudar?

[Somente administradores podem ver esta imagem]

Gostaria do mesmo principio ativo das Mensagens Privadas, segue print

[Somente administradores podem ver esta imagem]

Ver perfil do usuário

2 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 4:13 pm

waghcwb

avatar
Membro elite

Olá,

Poderia nos deixar o link para o seu fórum?



"May the force be with you, young grasshopper!"

[Somente administradores podem ver esta imagem][Somente administradores podem ver esta imagem]


Não há assuntos pouco interessantes; apenas há pessoas pouco interessadas.
Ver perfil do usuário

3 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 4:17 pm

Júnior Duarte

avatar
Membro elite

Segue.

[Somente administradores podem ver este link]

Ver perfil do usuário

4 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 4:19 pm

waghcwb

avatar
Membro elite

Só uma coisinha, o senhor poderia nos fornecer acesso a uma conta de testes em seu fórum? Assim podemos fazer os testes antes de lhe dar um código válido.



"May the force be with you, young grasshopper!"

[Somente administradores podem ver esta imagem][Somente administradores podem ver esta imagem]


Não há assuntos pouco interessantes; apenas há pessoas pouco interessadas.
Ver perfil do usuário

5 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 4:21 pm

Júnior Duarte

avatar
Membro elite

Segue.

User: asan1988
Senha: junior22

Ver perfil do usuário

6 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 4:28 pm

waghcwb

avatar
Membro elite

Ta, agora para que possamos iniciar os teste, por favor ative a barra da Forumeiros em seu fórum.

Painel de controle Seta Módulos Seta Barra de Ferramentas Seta Configuração Seta Opções Seta Ativar barra de ferramentas

Marque a opção "Sim"

E então para que a barra não apareça para os outros usuários enquanto testamos, adicione isso ao CSS
Código:
#fa_toolbar {
   display: none;
}

E para que eu possa ver a barra e realizar os testes, adicione o seguinte Javascript
Código:
$(function() {
   if( _userdata.username == 'asan1988' ) {
      $('#fa_toolbar').show();
   }
});

Continuamos em seguida...



"May the force be with you, young grasshopper!"

[Somente administradores podem ver esta imagem][Somente administradores podem ver esta imagem]


Não há assuntos pouco interessantes; apenas há pessoas pouco interessadas.
Ver perfil do usuário

7 Re: [Botão] Notificação Bugado em Sex Fev 06, 2015 5:43 pm

Júnior Duarte

avatar
Membro elite

Feito como solicitado.

Ver perfil do usuário

8 Re: [Botão] Notificação Bugado em Sab Fev 07, 2015 1:11 pm

waghcwb

avatar
Membro elite

[Somente administradores podem ver este link],

Agora nosso primeiro código de testes.

Adicione esse Javascript

Código:
;$(window).load(function() {

   var _item = $('a#notify_link');
   var _offset = _item.offset();

   _item.after('<div class="notify_wrap" style="position:absolute;top:' + (_offset.top + _item.height() ) + 'px;left:' + _offset.left + 'px"><ul></ul></div>');

   var _interval = setInterval(function() {
      if( $('#fa_toolbar #notif_list li').length > 1 ) {
         loadNotifications();
         clearInterval(_interval);
      }
   }, 500);

   _item.click(function(event) {
      event.preventDefault();

      $('.notify_wrap').fadeToggle();
   });

   function loadNotifications()
   {
      var notifications = $('ul#notif_list').length;

      if( notifications ) {

         var messages = $('ul#notif_list').html();
         $('.notify_wrap ul').html( messages );

         var len = $('.notify_wrap ul li.unread').length;
         if(len > 0) _item.after('<span class="not" style="width:14px;line-height:14px;margin:5px 0 0 -5px;text-align:center;height:14px;font-size:.5em;cursor:default;background:red;border-radius:50%;position:absolute;color:#fff;">' + len + '</span>');
      }
   }
   
});

Com investimento em todas as páginas

E este CSS

Código:
a#notify_link {
  position: relative;
}

.notify_wrap {
  background: #fff;
  padding: .3em;
  font-size: .9em;
  border-radius: 3px;
  z-index: 999;
  box-shadow: rgba(0,0,0,.5) 0 0 4px;
}

.notify_wrap li {
  padding: .5em;
  border-bottom: #f4f4f4 1px solid;
  display: block!important;
}

.notify_wrap li hr {
  display: none;
}

.notify_wrap li.see_all {
  margin-top: .5em;
  text-align: center;
  border: none;
}

Vou precisar que você envie algumas MP's para o usuário que você me cedeu a conta, ele não tem postagens o suficiente para enviar MP's, assim posso testar com notificações reais.

E por favor, verifique os seus Javascripts, parece que você inseriu HTML em algum deles, e isso está dando erros no seu fórum.




E lembre-se. Este é apenas um código de testes, não é uma versão definitiva.



"May the force be with you, young grasshopper!"

[Somente administradores podem ver esta imagem][Somente administradores podem ver esta imagem]


Não há assuntos pouco interessantes; apenas há pessoas pouco interessadas.
Ver perfil do usuário

9 Re: [Botão] Notificação Bugado em Seg Fev 09, 2015 10:36 am

Júnior Duarte

avatar
Membro elite

Olá amigo, desculpe a demora em responder o tópico, já fiz o indicado por você, enviei algumas MP's ao usuário testes.

Aparece a mensagem-  You can return to the index... quando clico no botão das notificações.

Ressalto que certa vez troquei o link que veio na Skin do botão na tentativa de sanar o problema.

Troquei essa linha:

Código:
<li><a  id="notify_link" href="/fa_notification" title="Notificações">&nbsp;</a></li>

Adicionei esse link que não tem efeito algum sobre o botão antes não tinha nada.

Código:
/fa_notification




Espero ajudar de alguma forma hehehhe.

Quanto aos JS, acredito que todos que tenho estão de certa forma sendo utilizados, não sei perceber qual poderia estar ocasionando tais erros.

Ver perfil do usuário

10 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:08 pm

Cepheus

avatar
Membro elite

Olá, 
O waghcwb se refere a esse html, que você colocou como JS:
Código:
<div class="pun-crumbs"><p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p></div><div class="main"><!--BEGIN catrow--><!--BEGIN tablehead--><div class="main-head"><div class="page-title">{catrow.tablehead.L_FORUM}</div></div><div class="main-content"><table cellspacing="0"class="table"><thead><tr><th class="tcl">{L_FORUM}</th><th class="tc2">{L_TOPICS}</th><th class="tc3">{L_POSTS}</th><th class="tcr">{L_LASTPOST}</th></tr></thead><tbody class="statused"><!--END tablehead--><!--BEGIN forumrow--><tr><td class="tcl"style="padding-right: {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: {catrow.forumrow.INC_LEVEL_LEFT};"><span class="status"style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -{catrow.forumrow.INC_WIDTH_ICON};"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}"src="{catrow.forumrow.FORUM_FOLDER_IMG}"alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}"/></span><h{catrow.forumrow.LEVEL}class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}"class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}><br/>{catrow.forumrow.FORUM_DESC}<!--BEGIN switch_moderators_links--><br/>{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}<!--END switch_moderators_links-->{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}<strong>{forumrow.L_SUBFORUM_STR}</strong>{forumrow.SUBFORUMS}</td><td class="tc2">{catrow.forumrow.TOPICS}</td><td class="tc3">{catrow.forumrow.POSTS}</td><td class="tcr"><!--BEGIN avatar--><span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span><!--END avatar--><span><!--BEGIN switch_topic_title--><a href="{catrow.forumrow.U_LATEST_TOPIC}"title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br /><!--END switch_topic_title-->{catrow.forumrow.USER_LAST_POST}</span></td></tr><!--END forumrow--><!--BEGIN tablefoot--></tbody></table></div><!--END tablefoot--><!--END catrow--></div><!--BEGIN switch_on_index--><div class="main-box clearfix"><ul><li><a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a></li><li><a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a></li><li><a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a></li></ul><!--BEGIN switch_delete_cookies--><p class="right"><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a></p><!--END switch_delete_cookies--></div><!--END switch_on_index-->;$(window).load(function(){var _item=$('a#notify_link');var _offset=_item.offset();_item.after('<div class="notify_wrap" style="position:absolute;top:'+(_offset.top+_item.height())+'px;left:'+_offset.left+'px"><ul></ul></div>');var _interval=setInterval(function(){if($('#fa_toolbar #notif_list li').length>1){loadNotifications();clearInterval(_interval)}},500);_item.click(function(event){event.preventDefault();$('.notify_wrap').fadeToggle()});function loadNotifications(){var notifications=$('ul#notif_list').length;if(notifications){var messages=$('ul#notif_list').html();$('.notify_wrap ul').html(messages);var len=$('.notify_wrap ul li.unread').length;if(len>0)_item.after('<span class="not" style="width:14px;line-height:14px;margin:5px 0 0 -5px;text-align:center;height:14px;font-size:.5em;cursor:default;background:red;border-radius:50%;position:absolute;color:#fff;">'+len+'</span>')}}});

Ele se encontra no seguinte link: [Somente administradores podem ver este link]

____________________________

Sobre o código que o waghcwb postou, observei que há um (Wink ponto e virgula no inicio do JS que talvez faça com que o código não funcione.
Se o waghcwb permitir, eu fiz uma pequena mudança no css, para ficar com uma estrutura similar com a das mensagens particulares.

Siga os passos abaixo:

Crie um novo JS com investimento: como mostrado na imagem (para teste)
[Somente administradores podem ver esta imagem]
Código:
$(window).load(function() {

   var _item = $('a#notify_link');
   var _offset = _item.offset();

   _item.after('<div class="notify_wrap" style="display:none;position:absolute;top:' + (_offset.top + _item.height() ) + 'px;left:' + _offset.left + 'px"><div class="bs_inbox_header"><h4 class="bs_inbox_sectionHead">Notificações</h4></div><ul></ul></div>');

   var _interval = setInterval(function() {
      if( $('#fa_toolbar #notif_list li').length > 1 ) {
         loadNotifications();
         clearInterval(_interval);
      }
   }, 500);

   _item.click(function(event) {
      event.preventDefault();

      $('.notify_wrap').fadeToggle();
   });

   function loadNotifications()
   {
      var notifications = $('ul#notif_list').length;

      if( notifications ) {

         var messages = $('ul#notif_list').html();
         $('.notify_wrap ul').html( messages );

         var len = $('.notify_wrap ul li.unread').length;
         if(len > 0) _item.after('<span class="not" style="width:14px;line-height:14px;margin:5px 0 0 -5px;text-align:center;height:14px;font-size:.5em;cursor:default;background:red;border-radius:50%;position:absolute;color:#fff;">' + len + '</span>');
      }
   }
  
});


Na sua folha de estilo css adicione:

Código:
.notify_wrap ul li,.notify_wrap li {
opacity:100!important;
font-size:12px;
text-align:left;
}

.notify_wrap:before {
bottom:100%;
content:'';
display:block;
height:0;
left:15px;
pointer-events:none;
position:absolute;
width:0;
z-index:3;
border-color:transparent transparent #fff;
border-style:solid;
border-width:15px;
}

.notify_wrap {
margin-top:37px;
background:#fff;
font-size:.9em;
border-radius:3px;
z-index:999;
box-shadow:rgba(0,0,0,.5) 0 0 4px;
padding:0!important;
}

.notify_wrap li.see_all {
background:#fff url(http://i.imgur.com/sl0Efuz.png) repeat-x 0 0;
border-radius:0 0 3px 3px;
border-top:1px solid #e0e0e0!important;
box-shadow:0 -1px 6px rgba(0,0,0,0.07);
line-height:24px;
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
font-size:13px;
margin-top:.5em;
text-align:center;
border:none;
padding:10px;
}

.notify_wrap li.see_all a:hover,.notify_wrap > ul > li > .content > div > a:hover {
color:#cd3816!important;
}

.notify_wrap li.see_all a,.notify_wrap > ul > li > .content > div > a {
color:#255b79!important;
text-decoration:none;
}

.notify_wrap > ul > li > .content > div {
color:#9c9c9c;
}

a#notify_link {
position:relative;
}

.notify_wrap li {
border-bottom:#f4f4f4 1px solid;
display:block!important;
padding:.5em;
}

.notify_wrap li hr {
display:none;
}


O resultado provavelmente será esse:

[Somente administradores podem ver esta imagem]



Gostou? não esqueça de Reputar! Suporte Forumeiros Aqui!
Ver perfil do usuário

11 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:28 pm

Júnior Duarte

avatar
Membro elite

Funcionou amigo. Obrigado mesmo cara, tu é \Top! Pode dar como encerrado o tópico.

Ver perfil do usuário

12 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:39 pm

Júnior Duarte

avatar
Membro elite

Amigão não encontrei o link entre os JS, onde posso encontrá-lo para poder remove-lo?

Ver perfil do usuário

13 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:40 pm

Cepheus

avatar
Membro elite

Sobre o link:
Código:
<li><a  id="notify_link" href="/fa_notification" title="Notificações">&nbsp;</a></li>

deixa o padrão, caso o JS demore um pouco pra carregar, ele irá pelo menos para pagina de notificações:
no lugar de /fa_notification
adicione:
Código:
/profile?mode=editprofile&page_profil=notifications



Última edição por Cepheus em Ter Fev 10, 2015 8:07 pm, editado 1 vez(es)



Gostou? não esqueça de Reputar! Suporte Forumeiros Aqui!
Ver perfil do usuário

14 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:44 pm

waghcwb

avatar
Membro elite

[Somente administradores podem ver este link],

Excelente amigo, obrigado.

Referente ao ponto e virgula, é uma forma de se "proteger" contra o código de outros programadores que por acaso esqueçam de "fechar" os seus códigos com ponto vírgula, você garante que as duas funções não vão ser misturar dessa maneira.

Veja: [Somente administradores podem ver este link]

Note essa frase no código deles
The semi-colon before the function invocation is a safety net against concatenated scripts and/or other plugins that are not closed properly.

Talvez fique mais fácil de entender kk

Em resumo, é só proteção kk

[Somente administradores podem ver este link],

Vou fazer umas análises aqui e retorno em seguida, ok? Aguarde



"May the force be with you, young grasshopper!"

[Somente administradores podem ver esta imagem][Somente administradores podem ver esta imagem]


Não há assuntos pouco interessantes; apenas há pessoas pouco interessadas.
Ver perfil do usuário

15 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:47 pm

Cepheus

avatar
Membro elite

Opa você alterou a mensagem, 
Sobre o JS
pra mim ele se apresenta nesse link: http://invitesexpress.forumotion.com/99564.js

Mas caso não exista esse JS, teste os seus JS
procurando um termo que exista no link: [Somente administradores podem ver este link] , no caso:
Código:
<div class="pun-crumbs">

E apague todo html mostrado no link:  http://invitesexpress.forumotion.com/99564.js


Editando...
Não está avisando que há novas mensagens quando estamos escrevendo e enviando a mensagem, então estou editando...


Olá waghcwb, Obrigado pela informação, ainda estou aprendendo essa linguagem.



Última edição por Cepheus em Ter Fev 10, 2015 7:58 pm, editado 1 vez(es)



Gostou? não esqueça de Reputar! Suporte Forumeiros Aqui!
Ver perfil do usuário

16 Re: [Botão] Notificação Bugado em Ter Fev 10, 2015 7:52 pm

Júnior Duarte

avatar
Membro elite

[Somente administradores podem ver este link] escreveu:[Somente administradores podem ver este link],

Excelente amigo, obrigado.

Referente ao ponto e virgula, é uma forma de se "proteger" contra o código de outros programadores que por acaso esqueçam de "fechar" os seus códigos com ponto vírgula, você garante que as duas funções não vão ser misturar dessa maneira.

Veja: [Somente administradores podem ver este link]

Note essa frase no código deles
The semi-colon before the function invocation is a safety net against concatenated scripts and/or other plugins that are not closed properly.

Talvez fique mais fácil de entender kk

Em resumo, é só proteção kk

[Somente administradores podem ver este link],

Vou fazer umas análises aqui e retorno em seguida, ok? Aguarde

Sem problemas.

[Somente administradores podem ver este link] escreveu:Opa você alterou a mensagem, 
Sobre o JS
pra mim ele se apresenta nesse link: http://invitesexpress.forumotion.com/99564.js

Mas caso não exista esse JS, teste os seus JS
procurando um termo que exista no link: [Somente administradores podem ver este link] , no caso:
Código:
<div class="pun-crumbs">

E apague todo html mostrado no link:  http://invitesexpress.forumotion.com/99564.js

Irei fazer isso.

Ver perfil do usuário

Conteúdo patrocinado


Voltar ao Topo  Mensagem [Página 1 de 1]

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum