Para fazer a integração do calendário, siga os seguintes passos:
-
Exemplo no codepen: Clique aqui
-
Faça o import do script para onde deseja utilizar https://unpkg.com/@andremhirai1/calendar@1.8.4/dist/js/Calendar.js
-
Crie uma div com uma classe identificadora.
<div class="calendar"> </div>
Obs: essa classe identificadora é para escopar os estilos do calendário.
- Instancie um objeto dessa forma:
<script>
const options = {
url: "URL-BACKEND",
parameters:{
month: "mes",
year: "ano"
},
weekdays: "short",
language: "pt-BR"
}
const calendar = new Calendar(".calendar", options)
</script>
- O segundo parâmetro recebe um objeto com as possíveis opções (Esse parâmetro é opcional):
| url (String) | Url para fazer a requisicao pro servidor e buscar a lista de eventos do mes |
| language (String) | Tradução do calendário para a lingua desejada. Ex: pt-BR (obs: para ambientes Liferay, pode se passar o parâmetro da seguinte forma: themeDisplay.getLanguageId().replace("_","-") ) Default: default |
| weekdays (String) | Apresentação dos dias da semana. Opções: short(3 letras) ou narrow(1 letra) Default: narrow |
| parameters (Objeto) | Objeto que tem 2 parâmetros. (month & year) |
| month (String) | Nome do parâmetro do mês. Default= month |
| year (string) | Nome do parâmetro do year. Default = year |