Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Índice

A Timeline é um feed de posts realizados por usuários que o usuário segue ou comunidades que ele participa.
Através dela é possível interagir com os posts, seja comentando-os, curtindo-os ou os compartilhando.


Bem como todos os componentes da camada social do Fluig, a Timeline utiliza o facilitador SuperWidget na camada de Javascript.
Para saber mais sobre o funcionamento da SuperWidget consulte o manual em https://gist.github.com/chambs/e0799862508c3ba3c1cc

Bind de elementos HTML a funções

Para associar um evento a um elemento HTML, é preciso seguir o formato abaixo.
O componente HTML deve possuir um atributo data- o qual receberá o bind de funções da widget.

Exemplo de um bind da função salvar em um botão

No HTML:

<button data-salvar-dados>Salvar dados</button>

...

Note que não é necessário adicionar o prefixo data-.
O array atribuido é uma string no padrão EVENTO_FUNÇÃO. Várias combinações de evento x função podem ser atribuidos a um único elemento.
Os bindings feitos no objeto local são referentes a elementos HTML dentro do div da widget. E os binds feitos no objeto global são para elementos fora do div da widget, ou retirados do div da widget por outro script, como é o caso das modais do jQueryUI.

Funções do componente

Segue abaixo o detlhamento das funções da Timeline.

linkLikePost(el, ev)

Ação do elemento data-linkLikePost. É responsável pelo evento de curtir posts e outros objetos sociais.

sendComment(el, ev)

Evento do elemento data-send-comment, resopnsável por criar o comentário de um post ou outro objeto social.

linkRemovePost(el, ev)

Ação para o elemento data-linkRemovePost, responsável por remover o post.

linkRemovePostComment(el, ev)

Ação para o elemento data-linkRemovePostComment, responsável por remover o comentário de um post.

linkLikePostComment(el, ev)

Ação para o elemento data-linkLikePostComment, responsável pela ação de curtir um comentário de um post.

timelineLinkSupported(el, ev)

Ação para o elemento data-timeline-link-supported, responsável por exibir uma lista com os usuarios que apoiaram um post ou objeto social.

timelineLinkRecommend(el, ev)

Ação para o elemento data-timeline-link-recommend, responsável por compartilhar um post ou objeto social.

supportListBtnFollow(el, ev)

Ação para o elemento data-support-list-btn-follow que aparece no modal da lista de pessoas que apoiaram um post ou objeto social.
É responsável por solicitar relacionamento com o usuário.

showMore(el, ev)

Ação do elemento data-showMore.
Quando a timeline é renderizada, é exibido um tamanho máximo de posts.
Se houverem posts mais antigos do que o limite apresentado, este link é exibido ao usuário, para exibir os próximo N posts

btnShowMoreComments(el, ev)

Ação do elemento data-btn-show-more-comments.
Quando a timeline é renderizada, é exibido um limite máximo de comentários por post.
Se houverem comentários mais antigos do que o limite apresentado, este link é exibido ao usuário, para exibir os próximo N comentários.

timelineLinkSocial(el, ev)

Ação do elemento timeline-link-community.
Esta função é um facilitador para redirecionar a página para o perfil de um usuário, comunidade ou objeto social que possua alias.

timelineLinkComment(el, ev)

Ação do elemento data-timeline-link-comment, responsável por exibir o campo de texto de comentários.

showPostedPost(eventName, data)

Ação disparada pelo evento "newPostEvent".
Este evento é disparado pela widget poster, quando um novo post é realizado pelo usuário, e é imediatamente renderizado para ele.  

showRealtimePost(eventName, data)

Ação disparada pelo evento "newpostalert".
Este evento acontece quando um novo post relacionado ao usuário logado é criado.
Um serviço Java então identifica quem são os usuários que precisam ser notificados e dispara um evento para o Node Server com os ids do usuário receptor e o id do post.
O Node Server então avisa o usuário através do evento "newpostalert" que renderiza o post na tela.

removeRealtimePost(eventName, data)

Ação disparada pelo evento "removepostalert", que notifica a timeline para remover o post.

validateTitleNotPublish()

Esta função verifica se a timeline do usuário possui posts.
Se estiver vazia, exibe no título uma mensagem internacionalizada "Não há posts".
Caso contrário, exibe a mensagem "Últimas publicações"

renderPost(postId)

Realiza uma chamada REST e recupera os dados de um post, e então o renderiza.

renderComment(commentId)

Realiza uma chamada REST e recupera os dados (em HTML) de um comentário e o retorna.

listPosts(event)

Esta função é chamada somente pela função showMore.

listComments(event, domElement)

Esta função é usada apenas pela função btnShowMoreComments.

countLength(el, ev)

...

Função para fazer a contagem de caracteres no campo de texto de recomendação.
Quando o limite de caracteres for ultrapassado ele desabilita o botão e coloca uma borda vermelha no campo.

getYoutubeInfo()

Esta função itera sobre a timeline já renderizada, em busca de posts que possuem videos do Youtube.
Para cada post encontrado, através do atributo "data-post-youtube-id" é feita uma requisição JSONP a um serviço do Youtube para recuperar o título do video.
Essa função pode ser executada diversas vezes, pois cada vez que um post com video do Youtube é encontrado, o atributo "data-post-youtube-id" é consumido, evitando a operação de se repetir.

linkRecommendedPost(el, ev)

Este evento é disparado quando o usuário tenta clicar em um link de um post recomendado por outro usuário.
Embora o sistema valide se o usuário tem permissão de visualizar o post, é feita uma validação no lado do client, acessando um serviço REST que retorna o permissionamento

...