Web Analytics

my-skylight-calendar

⭐ 248 stars Portuguese by mohesles

🌐 Idioma

Calendário Familiar Inteligente DIY para Casa (Clone do Skylight)

Calendário Sklylight DIY Skylight

📖 Introdução

Minha esposa tem sido recentemente bombardeada nas redes sociais com anúncios de calendários inteligentes para casa (Skylight, Cozyla, Hearth) e estava pronta para gastar mais de US$ 300 em um. Antes de dar o sinal verde, pedi uma chance para pesquisar sobre eles. Percebi que a maioria oferecia funcionalidades semelhantes, mas diferiam significativamente no preço. Mais importante ainda, não vi nenhum recurso excepcional que eu não pudesse implementar no Home Assistant.

O Objetivo: Um calendário touchscreen aprovado pelo WAF (Fator de Aceitação da Esposa), amigável para bancada, que se integra profundamente à nossa casa inteligente sem taxas mensais.

💡 Por que fazer você mesmo?

Optar pela rota DIY com Home Assistant trouxe vários benefícios em relação à compra de um display Skylight/Hearth:

🛠 Seleção de Hardware

Atualmente, este projeto foi feito para exibir o painel em qualquer tela HD (1920x1080).

No meu caso, a exigência era que ele "parecesse" com um Skylight, fosse touchscreen, ficasse na bancada e pudesse ser movido para diferentes locais. Por isso, escolhi o hardware descrito abaixo. No entanto, seu caso pode ser diferente e você precisará ajustá-lo conforme necessário, por exemplo, se quiser exibir em um tablet ou outro dispositivo.

O hardware que usei originalmente foi escolhido com base no que mencionei acima, além da esperança de poder estender funcionalidades usando a webcam, alto-falante e microfone. Atualmente, provavelmente montaria diferente, já que ainda não tive tempo de implementar essas ideias adicionais de hardware.

✨ Funcionalidades

---

⚙️ Guia de Instalação

Nota: Esta configuração utiliza um Pacote YAML para criar automaticamente todos os auxiliares, scripts e variáveis necessários para você. Não é necessário criá-los manualmente.

1. Pré-requisitos (HACS)

Você deve ter o HACS instalado. Por favor, instale as seguintes integrações de Frontend:

*Nota: Em Configurações → Dispositivos & Serviços, certifique-se de que o Browser Mod apareça como uma Integração (bloco) e não apenas no HACS. Se não estiver lá, clique em Adicionar Integração → Browser Mod e finalize o fluxo, depois reinicie o HA. A instalação via HACS apenas baixa os arquivos; você deve adicionar a integração para que o HA registre suas ações/entidades.

2. O Backend (O Cérebro)

   homeassistant:
     packages: !include_dir_named packages
   ``
  • Crie uma pasta chamada packages no seu diretório de configuração do HA (caso ainda não exista).
  • Baixe packages/family_calendar.yaml deste repositório.
  • Procure pela string [ #<--- UPDATE THIS ENTITY] e atualize o ID da entidade do calendário para coincidir com o seu ambiente. Veja a seção 3 para mais detalhes.
  • Coloque o arquivo dentro da sua pasta packages/.
  • Reinicie o Home Assistant.

3. Os Calendários

Você pode usar Calendários do Google ou Calendários Locais.

#### Opção A: Reutilizar Nomes de Calendário (Mais Fácil)

  • Vá em Configurações > Dispositivos e Serviços.
  • Adicione a integração Calendário Local.
  • Crie calendários com exatamente estes nomes: calendar1, calendar2, calendar3, calendar4, Family.
Se você usar esses nomes, o código funciona imediatamente!*

#### Opção B: Calendário Personalizado

  • Vá em Configurações > Dispositivos e Serviços.
  • Adicione a integração Calendário Local ou Google Calendar.
  • Navegue até Configuração > Integrações > Calendário Local ou Google Calendar e selecione "Adicionar Entrada"
  • Para cada entrada criada, obtenha o ID da entidade para atualizar o arquivo dashboard.yaml.
  • Abra o dashboard.yaml.
  • Procure por # <--- UPDATE THIS ENTITY.
  • Atualize o ID da entidade de acordo com o seu ambiente
#### Configurando Feriados

Desde as atualizações do Home Assistant, os feriados agora são adicionados via interface:

  • Vá em Configurações > Dispositivos e Serviços > Adicionar Integração > Holiday.
  • Selecione seu país.
  • Verifique o ID da entidade (ex.: calendar.holidays). Se for diferente do padrão, atualize-o no YAML do dashboard.

4. O Dashboard (A Aparência)

  • Vá para Configurações > Painel de Controle
  • Clique em Adicionar Painel de Controle (Selecione a opção "Novo Painel de Controle do Zero" e certifique-se de selecionar "Adicionar à barra lateral").
  • No menu à esquerda, selecione o painel recém-criado e clique no ícone de lápis para editá-lo.
  • Selecione o ícone de 3 pontos e escolha "Editor de configuração bruta".
  • Copie e cole o código de dashboard.yaml.

Passo 5: O Tema (Opcional)

Para obter o visual da fonte específica (Ovo):

  • Certifique-se de que seu configuration.yaml tenha esta linha em frontend:
`yaml frontend: themes: !include_dir_merge_named themes `
  • Crie uma pasta chamada themes no seu diretório de configuração.
  • Baixe themes/skylight.yaml e coloque-o nessa pasta.
  • Use o Editor de Arquivos e faça o upload do calbackgrd.png para a pasta /www/, que é traduzida internamente como /local no painel.
  • Reinicie o Home Assistant.
  • Vá até o seu Perfil (Ícone de Usuário no canto inferior esquerdo) e altere o Tema para Skylight.
NOTA: O tema não é abrangente, então tenha isso em mente


📐 Como Funciona (Por Trás dos Bastidores)

Lógica de Filtro

O week-planner-card não suporta nativamente ocultar calendários específicos dinamicamente. Para resolver isso, utilizei Input Texts atuando como filtros Regex.

Quando você clica no botão de uma pessoa, ele alterna o filtro entre . (Mostrar tudo) e ^$ (Não mostrar nada).

  • O config-template-card injeta essas variáveis no cartão de calendário dinamicamente.

Script de Criação de Evento

O popup "Adicionar Evento" utiliza um único script que gerencia a lógica para múltiplas pessoas e tipos de eventos (Dia Inteiro vs Com Horário).

yaml

Simplified Logic Example

target_calendar: "{{ calendar_map.get(states('input_select.calendar_select')) }}"

choose:

  • conditions: "All Day Event is ON"
action: calendar.create_event (start_date, end_date)
  • conditions: "All Day Event is OFF"
action: calendar.create_event (start_date_time, end_date_time)
``

NOTAS

Minha postagem original foi apenas para dar uma visão geral de alto nível de como fazer isso e permitir que as pessoas ajustem o código para funcionar em seus cenários específicos.

Em particular, fiz isso porque cada display e necessidade são diferentes. Não posso desenvolver para todos os tamanhos potenciais de displays, dashboards, etc. Então, foi feito para funcionar no display que mencionei ou em qualquer outro (1920x1080), mas deve ser editável para outros.

Falando sobre display, originalmente sugeri aquele porque estava em promoção no Woot e era uma forma muito econômica de obter um display touchscreen na época. Isso pode não ser o caso agora, então use qualquer display que funcione para você. Tablet, touchscreen, celular, o que preferir. O principal que você precisará editar é o dashboard.

--- Tranlated By Open Ai Tx | Last indexed: 2026-03-08 ---