Lista responsiva - Search Journals

[paratiuid]

O que esse PR faz?

• lista de resultados da busca responsiva
• detalhes do documento. Ao clicar no documento da lista, é exibida uma lista de opções.
• função de compartilhar documento da lista
• seleção de itens da lista

Observação: O botão de copiar DOI ainda não foi implementado.

Onde a revisão poderia começar?

Acesse a lista de resultados da busca com um dispositivo mobile.

Como este poderia ser testado manualmente?

Navegue no sistema usando um dispositivo mobile.

Algum cenário de contexto que queira dar?

• botão copiar DOI ainda não foi implementado

Screenshots

Quais são tickets relevantes?

452

475

Referências

https://getbootstrap.com/docs/3.3/components/

[paratiuid]

@robertatakenaka mandei o ajuste solicitado.

[patymori]

@paratiuid UPDATE Fiz os testes conforme recomendado, iniciando a busca com a tela menor e recarregando, e o resultado foi o mesmo descrito anteriormente.

[paratiuid]

Oi @paratiuid, o resultado está ficando muito bom. Gostaria de informar que consegui reproduzir o problema apontado pela @patymori utilizando o Mozilla Firefox. Também gostaria de acrescentar que o erro acontece inclusive na versão "Desktop".

Não é um problema em si mas notei que a barra de seleção que aparece quando estamos no layout mobile é mantida se a tela é expandida. Esse comportamento é intencional?

Com relação ao problema relatado ao selecionar "Itens selecionados > Apagar todos da lista", verifiquei e realmente é um bug. O comportamento esperado é o que ocorre na produção, onde: Ao selecionar alguns itens e logo em seguida clicar em "Itens selecionados > apagar todos da lista" a lista deve se manter como está. Com os itens selecionados e na tela. Com o contador indicando o número de itens selecionados.

A questão de a barra que indica o número de itens selecionados continuar aparecendo ao redimensionar a tela também é um bug. Existe a necessidade de verificar as dimensões da tela ao redimensionar o browser. Com isso conseguimos mostrar / ocultar itens em cada caso. Será criada uma tarefa para resolver este problema.

@joffilyfe Uma dúvida: Em seus testes, você conseguiu compartilhar um item da lista utilizando o componente de compartilhar? Me refiro ao componente da imagem abaixo:

[paratiuid]

@paratiuid, testando o PR, notei que:

• os links para compartilhar item da lista não funcionam
• o novo "Remover seleção", ilustrado na figura 2, funciona mas a opção itens selecionados > Apagar todos da lista produz o resultado demonstrado na sequencia de imagens a seguir:

Com itens selecionados...

... seleciono para apagar todos da lista

Confirmo...

E obtenho o seguinte resultado:

Peço que confirme os comportamentos esperados antes de qualquer alteração. Os testes foram feitos tanto no Chrome (80.0.3987.149 (Official Build) (64-bit)) quanto no Firefox (74.0 (64-bit)).

Oi @patymori

uma dúvida:

quando você se refere ao botão de compartilhar não funciona, você se refere ao botão do topo da lista? Este da imagem?

Se sim, este realmente não foi programado nessa entrega. Este botão se refere ao compartilhamento de toda a lista de resultados.

Gostaria que fosse avaliado o compartilhamento do item da busca, que é exibido na parte de detalhes do item. Voce deve clicar sobre um item da busca. Veja a tela abaixo:

Aguardo seu retorno.

[joffilyfe]

Oi @paratiuid, o resultado está ficando muito bom. Gostaria de informar que consegui reproduzir o problema apontado pela @patymori utilizando o Mozilla Firefox. Também gostaria de acrescentar que o erro acontece inclusive na versão "Desktop".

Não é um problema em si mas notei que a barra de seleção que aparece quando estamos no layout mobile é mantida se a tela é expandida. Esse comportamento é intencional?

Retificando minha revisão

O botão de compartilhar item (quando tocamos no título do artigo) está funcionando. Na mensagem acima eu estava me referindo ao botão visível na imagem [1] (que está fora do contexto deste PR).

Uma observação: Talvez isso seja um problema de usabilidade. Sem ter um conhecimento prévio da interface eu deduzi que o botão de compartilhar estava associado a seleção da lista.

[1] Botão de compartilhar itens

[paratiuid]

Oi @paratiuid, o resultado está ficando muito bom. Gostaria de informar que consegui reproduzir o problema apontado pela @patymori utilizando o Mozilla Firefox. Também gostaria de acrescentar que o erro acontece inclusive na versão "Desktop". Não é um problema em si mas notei que a barra de seleção que aparece quando estamos no layout mobile é mantida se a tela é expandida. Esse comportamento é intencional?

Retificando minha revisão

O botão de compartilhar item (quando tocamos no título do artigo) está funcionando. Na mensagem acima eu estava me referindo ao botão visível na imagem [1] (que está fora do contexto deste PR).

~Uma observação: Talvez isso seja um problema de usabilidade. Sem ter um conhecimento prévio da interface eu deduzi que o botão de compartilhar estava associado a seleção da lista.~

[1] Botão de compartilhar itens

Ok @joffilyfe

Este botão circulado em vermelho não foi programado ainda. Ele se refere ao compartilhamento de toda a lista de resultados. Ele ainda vai sofrer ajustes de design e deverá ser programado para entregas futuras.

[patymori]

@paratiuid,

Conforme falamos em privado, seguem meus comentários:

quando você se refere ao botão de compartilhar não funciona, você se refere ao botão do topo da lista? Este da imagem?

Neste erro me referia ao botão de compartilhamento do item, nesta tela:

Se sim, este realmente não foi programado nessa entrega. Este botão se refere ao compartilhamento de toda a lista de resultados.

Para esta observação, ajudaria na avaliação do PR que você sinalizasse como fez com o botão para copiar o DOI, OK?

Gostaria que fosse avaliado o compartilhamento do item da busca, que é exibido na parte de detalhes do item. Voce deve clicar sobre um item da busca. Veja a tela abaixo:

Agora consegui efetuar o teste, pois recarreguei a página após o redimensionamento da tela. Porém, ao compartilhar o item, o link para a lista completa foi enviado. Está correto?

[paratiuid]

@paratiuid,

Conforme falamos em privado, seguem meus comentários:

quando você se refere ao botão de compartilhar não funciona, você se refere ao botão do topo da lista? Este da imagem?

Neste erro me referia ao botão de compartilhamento do item, nesta tela:

Se sim, este realmente não foi programado nessa entrega. Este botão se refere ao compartilhamento de toda a lista de resultados.

Para esta observação, ajudaria na avaliação do PR que você sinalizasse como fez com o botão para copiar o DOI, OK?

Gostaria que fosse avaliado o compartilhamento do item da busca, que é exibido na parte de detalhes do item. Voce deve clicar sobre um item da busca. Veja a tela abaixo:

Agora consegui efetuar o teste, pois recarreguei a página após o redimensionamento da tela. Porém, ao compartilhar o item, o link para a lista completa foi enviado. Está correto?

Ok @patymori

Falha minha ao não incluir o botão de compartilhamento de toda a listagem na observação citando os itens ainda não programados na abertura deste PR.

Neste componente individual do item da listagem, o correto é que seja compartilhado o link para o documento e não para a lista. Logo, este é mais um bug e precisa ser corrigido.

[paratiuid]

@patymori @joffilyfe

Fiz a correção do botão de compartilhamento de documento. Agora ele compartilha somente o documento em questão e não mais a lista completa, conforme relatado pela @patymori .

Enviei também a funcionalidade de compartilhar lista completa, no botão do início da lista. Este sim, deve compartilhar a lista completa com os resultados da busca.

Peço que façam os testes com a tela ajustada no tamanho do dispositivo mobile. Atualizem a tela após redimensionar. Estou implementando o ajuste que atualiza o sistema ao redimensionar a tela. Deve ir no próximo commit.

Resumindo: O que foi corrigido:

• função de compartilhar documento individual (detalhe do documento)
• função de compartilhar toda a lista da busca (topo da lista)

O que não foi corrigido neste envio:

• atualização do sistema ao redimensionar o browser.
• bug com itens selecionados / apagar todos da lista

[patymori]

@paratiuid, agradeço pelos maiores detalhes do que foi e do que não foi corrigido. Seguem comentários:

Fiz a correção do botão de compartilhamento de documento. Agora ele compartilha somente o documento em questão e não mais a lista completa, conforme relatado pela @patymori .

OK, testado e funcionando.

Enviei também a funcionalidade de compartilhar lista completa, no botão do início da lista. Este sim, deve compartilhar a lista completa com os resultados da busca.

Testado e funcionando.

@paratiuid, com os novos testes, percebi que, no quadro que se abre com os detalhes dos itens da busca, em alguns deles tem link para texto em idioma não existem, conforme a foto a seguir:

Neste caso o correto seria não exibir o link para os textos em "En". A única coisa que existe no idioma inglês é o resumo.

Não sei se o backend que está retornando o valor assim ou é algo no front. Pode verificar, por favor?

[jamilatta]

@patymori @joffilyfe @robertatakenaka

Verificaficando com o @paratiuid a questão dos idiomas é um item que ocorre na produção e como estou com outra atividade não consigo olhar para isso agora.

É necessário concluirmos com exatidão se devemos utiliza um campo la ou available_languages, para a formação das URL, para isso é necessário verificar qual é semântica atrelada a esses campos, talvez o processamento de inclusão dos artigos possa nos indicar .

Abri um issue para olharmos para isso, segue: https://github.com/scieloorg/search-journals/issues/487

[patymori]

É necessário concluirmos com exatidão se devemos utiliza um campo la ou available_languages, para a formação das URL, para isso é necessário verificar qual é semântica atrelada a esses campos, talvez o processamento de inclusão dos artigos possa nos indicar .

Abri um issue para olharmos para isso, segue: #487

Obrigada, @jamilatta, acabei de confirmar aqui e realmente o problema ocorre na interface web não adaptada para telas menores. Agradeço também pelo ticket.

@paratiuid pode desconsiderar a última parte do meu comentário, OK?

[paratiuid]

Muito bom @paratiuid, as funcionalidades estão de acordo com o que foi proposto. Tenho algumas ressalvas sobre diferenças no layout em relação ao que foi proposto no mockup realista, acho que o @alexxxmendonca pode ajudar a decidir se são relevantes ou não. Segue.

Screenshots

Item de seleção não apresenta borda

Idiomas com apresentação diferente e link para o DOI em desacordo com o crossref

Material de referência

1- Guidelines do Crossref

@joffilyfe

segue o ajuste visual solicitado.

O que foi corrigido:

• incluída borda no dropdown que identifica os itens selecionados
• torna os links para resumo, texto, pdf, maísculos.
• ajusta a URL do DOI.

Seguem as imagens:

Dúvida: O Dói exibido na imagem não contém o "https://doi.org/", conforme cita o Crossref. Devo deixar assim, exibindo apenas o doi carregado pelo backend, ou devo concatenar esse texto direto na interface?

[joffilyfe]

@joffilyfe

segue o ajuste visual solicitado.

O que foi corrigido:

* incluída borda no dropdown que identifica os itens selecionados

* torna os links para resumo, texto, pdf, maísculos.

* ajusta a URL do DOI.

Visualmente me parece tudo de acordo com o proposto.

Dúvida: O Dói exibido na imagem não contém o "https://doi.org/", conforme cita o Crossref. Devo deixar assim, exibindo apenas o doi carregado pelo backend, ou devo concatenar esse texto direto na interface?

Sobre os DOIs é necessário exibir o link (<a href="https://doi.org/artcicle-doi">https://doi.org/artcicle-doi</a>) de acordo com o guideline do crossref.

[paratiuid]

@joffilyfe

Acabo de enviar os ajustes.