# j-MonthlyCalendar

> Os nomes de meses e dias são tirados das propriedades MONTHS e DAYS definidas na biblioteca jComponent.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: pt
Content-SHA256: 5431f493d96e9d9cdc1e3e57b7baae6c052788f5a14ad00fdeb67ea0847e90cd
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

- Suporte apenas a visão mensal

__Configuração__:

- `parent {String}` um seletor jQuery para obter altura fixa (default `auto`)
- `firstday {Number}` primeiro dia no calendário `0 = Sunday`, padrão `0`
- `noborder {Boolean}` desabilita a fronteira (default: `false`)
- `selectable {Boolean}` permite a seleção de dias (default: `true`)
- `morebutton {String}` um modelo Tangular para o botão __More__ (default: `+{{ count }} more`)
- `select {String}` um caminho para `Function(item_event, el, e)`, tenha cuidado: `item_event` pode ser `null`
- `create {String}` um caminho para `Function({ beg: Date, end: Date }, beg_element, end_element)`
- `dblclick {String}` um caminho para `Function(item_event, el, e)`
- `dblclickdate {String}` um caminho para `Function(date, el, e)`
- `contextmenu {String}` um caminho para `Function(item_event, el, e)`
- `rebind {String}` um caminho para `Function({ dates: Array, date: Date })` é executado quando o calendário é ligado
- Subtratos de `topoffset {Boolean}` `offset.top` a partir de `height` (default: `false`)
- Subtratos de `topposition {Boolean}` `position.top` a partir de `height` (default: `false`)
- Margem superior/baixo de `margin {Number}` (default: `0`)
- `marginxs {Number}` A margem superior/bottom para `xs` tela width
- `marginsm {Number}` A margem superior/bottom para `sm` tela width
- `marginmd {Number}` A margem superior/bottom para `md` tela width
- `marginlg {Number}` A margem superior/bottom para `lg` tela width
- __NEW__: `keepselected {Boolean}` mantém dias selecionados (default: `false`)
- __NEW__: `hover {String}` um caminho para `Function({ beg: Date, end: Date }, beg_element, end_element)` (também como `create`, mas é chamado em métodos de `component.hover()` e `component.unhover()`)
- __NEW__: `scalewidth {Boolean}` escala a altura de acordo com a largura do elemento-mãe

__Métodos__:

- `component.addevents(events)` adiciona eventos
	- `events` significa Array de objeto abaixo:
	- `[{ id: String, beg: Date, end: Date, html: String, icon: String, color: String, background: Boolean }]`
- `component.addevent(event)` adiciona um evento
	- Não pode ser combinado com o método `addevents`
	- Pode ser executado várias vezes
	- Objeto do evento: `{ id: String, html: String, icon: String, color: String, background: Boolean }`
- __NEW__: `component.addbadge(date, [color])` adiciona um sinal
- Título: `component.hover(beg, end)`
- Título: `component.unhover()`
- `component.clear()` remove todos os eventos e sinais

__Localização__:

Os nomes de mês e dia são tirados das propriedades `MONTHS` e `DAYS` definidas na biblioteca jComponent.

Use-o com `<ui-component name="monthlycalendar">`Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço `DEF.fallback` (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença MIT.

```html example.html
<style>
	body{margin:0;padding:0;overflow:hidden;}
</style>

<ui-component name="monthlycalendar" path="common.date" config="parent:auto;noborder:1;firstday:1"></ui-component>

<script>
	var common = { date: NOW };

	(function() {
		var events = [];
		events.push({ id: 'a', beg: NOW.add('-10 days'), end: NOW.add('2 days'), html: 'Big event', color: 'orange' });
		events.push({ id: 'b', beg: NOW, html: 'Current', icon: 'ti ti-car', color: 'blue' });
		SETTER(true, 'monthlycalendar/addevents', events);
	})();

</script>
```