Formulario Popup.js - xRAFPx/LEI GitHub Wiki

  • O componente PopupComponent é o responsável pelo botão Pedidos de Intervenção da página inicial, pela popup de resposta ao click nesse botão e pelo envio do screenshot para a página do formulário.

  • As linhas 7 à linha 18 correspondem ao construtor do componente. Os estados open e image são inicializados com o valor false e null, correspondentemente. O estado open corresponde ao estado de abertura da popup, podendo esta estar aberta (open) ou fechada (close). O estado image é o correspondente à imagem do screenshot, tomando o seu valor quando o utilizador decide tirar um screenshot ou o valor '//:0' quando o utilizador não pretende tirar um screenshot.

  • De forma a que as funções desta classe têm acesso aos estados no construtor, foi utilizada o método bind() em todas as funções na instância do construtor.

  • A função openModal, nas linhas 20 a 22, é responsável por fixar o valor do estado open com true. Ela é chamada quando o popup é aberto, isto é, quando há um click no botão Pedidos de Intervenção.

  • A função closeModal, nas linhas 24 a 26, é responsável por fixar o valor do estado open com false. Ela é chamada quando o popup é fechado, isto é, quando, por exemplo, há um click no botão de fecho do popup ou fora do mesmo.

  • A função getScreenshotHandler, nas linhas 41 a 54, é chamada quando a escolha do utilizador é positiva, isto é, este prentede tirar um screenshot ao ecrã. É uma função assíncrona para permitir aplicar um await na função responsável por tirar o screenshot, de forma a que não seja executada as linhas seguintes do código antes que esta finalize. O popup é fechado antes de ser feita a captura de ecrã para que este não apareça e corte parte da página. Como o valor da imagem do screenshot é necessária para o seu envio para a página do formulário, é importante proceder a esta espera pelos dados. O método HTMLCanvasElement.toDataURL() retorna uma data URI, contendo uma representação da imagem no formato PNG. A partir do histórico da sessão é enviada a imagem, a partir do estado image, correspondente ao screenshot e o valor true na variável showScreenshot para que seja mostrada a secção do screenshot no formulário.

  • A função getNoScreenshotHandler, nas linhas 28 a 39, aquando da escolha de não tirar um screenshot por parte do utilizador, enviando uma variável image com valor nulo e um showScreenshot com valor false para que não apareça uma secção correspondente á captura de ecrã no formulário vazia. Depois redirecciona para a página do formulário (/form).