Repositório do frontend do projeto AJuDE - AquiJuntosDoandoEsperança da disciplina Projeto de Software 2019.2.
Assim que acessa o link, no cabeçalho da página inicial possui dois links, que na verdade são âncoras, que levam para formulários de cadasatro do usuário (Sign Up) e para o login.
O usuário pode solicitar a senha seja na view de login, ou após se logar. Em ambas opções o usuário terá que digitar o email cadastrado, sendo enviado o link para o mesmo. A partir daí o usuário possui 1 minuto para realizar a mudança.
Após realizar o usuário terá acesso à um menu dropdown no canto esquerdo superior, que possui a âncora para a view de cadastro de campanha.
Em praticamente todas as views é possível realizar buscas por campanhas, porém caso o usuário não esteja logado é solicitado o login do mesmo.
Na view de pesquisa possui um checkbox que possibilita a visualização de todas as campanhas, que por padrão se mostra apenas as ativas, retornadas no fetch.
Na página principal das campanhas, que pode ser acessada pelos links Ver mais na página inicial ou nas buscas, cuja url é formada pela âncora #campaign/${url_da_campanha_formado_pelo_short_name} é possível ver as informações (doações recebida, meta, deadline, likes e dislikes), realizar doação e, se caso o usuário que estiver acessando for o dono, um botão que encerra a campanha.
Caso o usuário que estiver acessando for o dono, os ícones de arrecadação e do calendário eles se tornam links para realizar as alterações referentes à cada informação.
Na mesma view de campanhas é possível digitar um comentário pelo textarea presente na view.
Se o usuário que estiver acessando for o mesmo que realizou o comentário, aparecerá um botão possibilitando a sua deleção.
Apenas nas views das campanhas é possível realizar likes/dislikes, se caso o usuário já realizou um like, ao clicar no ícone referente ao like ou ao dislike, o mesmo será retirado. O mesmo acontece com o dislike.
É a home, onde nela se pode ver 5 campanhas ordenadas e filtradas por meio do quanto falta para atingir a meta, pela maior quantidade likes e por maior proximidade da data de deadline.
Esse filtro é acessível passando o mouse sobre o ícone de funil na canto direito da tela.
A partir de qualquer campanha é possível acessar o link do perfil de um usuário, ou através do menu dropdown no header da página ao se realizar login.
A url é formada pela âncora #user/{username}, onde o username é formado no backend atráves dos nomes fornecidos.
O frontend utiliza SPA em toda as views, ou seja, uma única página cujo conteúdo se altera de maneira dinâmica a partir da utilização de âncoras.
O roteamento é realizado pelos scripts, mais especificamente pelo arquivo nomeado por main.js, presentes na pasta js. Na pasta é possível verificar a presença de scripts para realizar o roteamento e as mudanças das views, cada arquivo possui funções delegadas à funcionalidades referentes à alguma view em específica, por exemplo, user.js possui as funções que possibilitam mostrar as views para as suas ações específicas.
No diretório images, estão presentes os ícones utilizados em todas as views. E em css, está presente a folha de estilhos de todo o site concentrado no main.css.
O main.css e main.js é importado pelo index.html, que é quem possui todos os templates para a alteração das views.
