From 86cf962372d7c0e6059b555a2efd49933e1a151f Mon Sep 17 00:00:00 2001 From: Viet Ngoc Date: Fri, 24 Jan 2025 00:44:18 +0100 Subject: [PATCH] :robot: 24-01-25 | :recycle: Updated 11 files :fire: Deleted 5 files :sparkles: Added 7 files -------- - update: snippets/popup_footer_layout.yaml - update: snippets/style_popup_footer.yaml - update: dashboard-resources/extra-menu.js - update: themes/tablet.yaml - update: footer/footer_network.yaml - update: extra-popup/vanessa.yaml - update: config/README.md - update: dashboards/ui-lovelace-main.yaml - update: docs/README.md - update: button_card_templates/tpl_chips.yaml - update: templates/streamline-card.yaml - delete: subviews/test-lovelace.yaml - delete: subviews/kodi-recently-added.yaml - delete: subviews/github-stats.yaml - delete: subviews/kodi-library.yaml - delete: subviews/lights.yaml - add: snippets/style-git-swipe-card.yaml - add: sensors/github_repos.yaml - add: github-grid/ - add: snippets/swiper-git-parameters.yaml - add: button_card_templates/tpl_stargazers.yaml - add: views/github-view.yaml - add: snippets/layout-git-heading-content.yaml -------- Automated commit via script --- config/README.md | 8 +- .../shared/extra-popup/vanessa.yaml | 2 +- .../shared/popup/footer/footer_network.yaml | 5 +- .../snippets/layout-git-heading-content.yaml | 5 + .../shared/snippets/popup_footer_layout.yaml | 13 +- .../shared/snippets/style-git-swipe-card.yaml | 10 + .../shared/snippets/style_popup_footer.yaml | 6 +- .../snippets/swiper-git-parameters.yaml | 9 + config/dashboards/subviews/github-stats.yaml | 259 ------------- config/dashboards/subviews/kodi-library.yaml | 347 ------------------ .../subviews/kodi-recently-added.yaml | 8 - config/dashboards/subviews/lights.yaml | 208 ----------- config/dashboards/subviews/test-lovelace.yaml | 5 - .../button_card_templates/tpl_chips.yaml | 6 +- .../button_card_templates/tpl_stargazers.yaml | 45 +++ .../dashboards/templates/streamline-card.yaml | 121 +++++- config/dashboards/ui-lovelace-main.yaml | 3 +- .../views/github-grid/ha-config-stats.yaml | 100 +++++ .../views/github-grid/repo-graphs.yaml | 200 ++++++++++ config/dashboards/views/github-view.yaml | 43 +++ .../templates/sensors/github_repos.yaml | 27 ++ config/themes/tablet.yaml | 28 +- config/www/dashboard-resources/extra-menu.js | 15 +- docs/README.md | 8 +- 24 files changed, 612 insertions(+), 869 deletions(-) create mode 100644 config/dashboards/shared/snippets/layout-git-heading-content.yaml create mode 100644 config/dashboards/shared/snippets/style-git-swipe-card.yaml create mode 100644 config/dashboards/shared/snippets/swiper-git-parameters.yaml delete mode 100644 config/dashboards/subviews/github-stats.yaml delete mode 100644 config/dashboards/subviews/kodi-library.yaml delete mode 100644 config/dashboards/subviews/kodi-recently-added.yaml delete mode 100644 config/dashboards/subviews/lights.yaml delete mode 100644 config/dashboards/subviews/test-lovelace.yaml create mode 100644 config/dashboards/templates/button_card_templates/tpl_stargazers.yaml create mode 100644 config/dashboards/views/github-grid/ha-config-stats.yaml create mode 100644 config/dashboards/views/github-grid/repo-graphs.yaml create mode 100644 config/dashboards/views/github-view.yaml create mode 100644 config/packages/templates/sensors/github_repos.yaml diff --git a/config/README.md b/config/README.md index 4aee8b1..fc8453c 100644 --- a/config/README.md +++ b/config/README.md @@ -45,14 +45,14 @@ https://github.com/ngocjohn/hass-config/assets/96962827/acc1a4db-b92e-4ab1-ac9d- - 35,325 + 35,894 34 - 164 + 154 63 54 32 - 1072 - 215 + 1065 + 201 38 diff --git a/config/dashboards/shared/extra-popup/vanessa.yaml b/config/dashboards/shared/extra-popup/vanessa.yaml index 93b5f11..785814d 100644 --- a/config/dashboards/shared/extra-popup/vanessa.yaml +++ b/config/dashboards/shared/extra-popup/vanessa.yaml @@ -2,7 +2,7 @@ action: fire-dom-event extra_menu: custom_position: bottom-right card_container: - padding: 1vw + padding: 1rem cards: - type: custom:webrtc-camera entity: camera.kids_room_cam diff --git a/config/dashboards/shared/popup/footer/footer_network.yaml b/config/dashboards/shared/popup/footer/footer_network.yaml index 4c296b9..c328870 100755 --- a/config/dashboards/shared/popup/footer/footer_network.yaml +++ b/config/dashboards/shared/popup/footer/footer_network.yaml @@ -22,8 +22,7 @@ browser_mod: title: Access Points show_header_toggle: false card_mod: - class: header - + class: header nopadding entities: - type: custom:tabbed-card styles: # global styles applied to all tabs @@ -79,7 +78,7 @@ browser_mod: title: Router show_header_toggle: false card_mod: - class: header + class: header nopadding entities: - entity: binary_sensor.arris_tg3442de_wan_status name: WAN Status diff --git a/config/dashboards/shared/snippets/layout-git-heading-content.yaml b/config/dashboards/shared/snippets/layout-git-heading-content.yaml new file mode 100644 index 0000000..92172bb --- /dev/null +++ b/config/dashboards/shared/snippets/layout-git-heading-content.yaml @@ -0,0 +1,5 @@ +margin: 0 +grid-template-columns: minmax(300px, 1fr) +grid-template-rows: auto 1fr +grid-row-gap: 8px +height: 100% diff --git a/config/dashboards/shared/snippets/popup_footer_layout.yaml b/config/dashboards/shared/snippets/popup_footer_layout.yaml index 761c605..b93ca5c 100755 --- a/config/dashboards/shared/snippets/popup_footer_layout.yaml +++ b/config/dashboards/shared/snippets/popup_footer_layout.yaml @@ -1,10 +1,13 @@ -grid-template-columns: repeat(var(--max-popup-column, auto-fit), minmax(560px, 1fr)) +grid-template-columns: 1fr grid-template-rows: auto -grid-gap: 2px 1px -margin: 0 -padding: 0 mediaquery: - '(max-width: 1441px)': + '(min-width: 1441.99px)': + grid-template-columns: repeat(var(--max-popup-column, auto-fit), minmax(560px, 1fr)) + grid-template-rows: auto + grid-gap: 2px 1px + margin: 0 + padding: 0 + '(min-width: 800px)': grid-template-columns: 560px grid-template-rows: auto grid-gap: 2px 1px diff --git a/config/dashboards/shared/snippets/style-git-swipe-card.yaml b/config/dashboards/shared/snippets/style-git-swipe-card.yaml new file mode 100644 index 0000000..3b6121c --- /dev/null +++ b/config/dashboards/shared/snippets/style-git-swipe-card.yaml @@ -0,0 +1,10 @@ +$: | + #host { + --swiper-navigation-size: 24px !important; + --swiper-theme-color: rgb(179, 179, 179, .5); + } + .swiper-button-prev, .swiper-button-next { + top: 95% !important; + --swiper-navigation-size: 24px !important; + --swiper-theme-color: rgb(179, 179, 179, .5); + } diff --git a/config/dashboards/shared/snippets/style_popup_footer.yaml b/config/dashboards/shared/snippets/style_popup_footer.yaml index 979081f..1dbda06 100755 --- a/config/dashboards/shared/snippets/style_popup_footer.yaml +++ b/config/dashboards/shared/snippets/style_popup_footer.yaml @@ -5,7 +5,11 @@ style: #root > * { margin: 0px !important; } - + @media (max-width: 800px) { + #root { + display: block; + } + } hui-entities-card: $: | ha-card { diff --git a/config/dashboards/shared/snippets/swiper-git-parameters.yaml b/config/dashboards/shared/snippets/swiper-git-parameters.yaml new file mode 100644 index 0000000..39400fe --- /dev/null +++ b/config/dashboards/shared/snippets/swiper-git-parameters.yaml @@ -0,0 +1,9 @@ +navigation: +followFinger: false +grabCursor: false +roundLengths: true +centeredSlides: true +centeredSlidesBounds: true +enabled: true +createElements: false +allowTouchMove: false diff --git a/config/dashboards/subviews/github-stats.yaml b/config/dashboards/subviews/github-stats.yaml deleted file mode 100644 index fe9929c..0000000 --- a/config/dashboards/subviews/github-stats.yaml +++ /dev/null @@ -1,259 +0,0 @@ -icon: mdi:github -title: GITHUB STATS -path: github-stats -subview: false -theme: tablet -xbackground: >- - linear-gradient(170deg, rgba(22, 24, 29, 0.6) 80%, rgba(156, 156, 210, 0.6) 160%) -type: sections -max_columns: 8 -dense_section_placement: true -sections: - - type: grid - column_span: 3 - cards: - - &github_heading_card - type: custom:streamline-card - template: github_heading_card - variables: - - heading_title: 🚘 Vehicle status card - - total_entity: sensor.vehicle_status_card_total_2 - - latest_entity: sensor.vehicle_status_latest - - stars_entity: sensor.vehicle_status_card_stars - - repo_link: https://github.com/ngocjohn/vehicle-status-card - - type: custom:mod-card - grid_options: - columns: full - card_mod: &swipe_style - style: - swipe-card: - $: | - #host { - --swiper-navigation-size: 24px !important; - --swiper-theme-color: rgb(179, 179, 179, .5); - } - .swiper-button-prev, .swiper-button-next { - top: 95% !important; - --swiper-navigation-size: 24px !important; - --swiper-theme-color: rgb(179, 179, 179, .5); - } - card: - type: custom:swipe-card - parameters: &swipe_parameters - navigation: - followFinger: false - grabCursor: false - roundLengths: true - centeredSlides: true - centeredSlidesBounds: true - enabled: true - createElements: false - allowTouchMove: false - cards: - - &github_graph_card - type: custom:streamline-card - template: github_graph_card - variables: - - total_entity: sensor.vehicle_status_card_total - - latest_entity: sensor.vehicle_status_latest - - &github_logbook_card - type: custom:streamline-card - template: github_logbook_card - variables: - - latest_entity: sensor.vehicle_status_latest - - &github_diagnostic_card - type: custom:streamline-card - template: github_diagnostic_card - variables: - - device_id: ngocjohn/vehicle-status-card - - type: grid - column_span: 3 - cards: - - <<: *github_heading_card - variables: - heading_title: 🚙 Vehicle info card - total_entity: sensor.vehicle_info_card - latest_entity: sensor.vehicle_latest_release_download - stars_entity: sensor.repo_vehicle_stars - repo_link: https://github.com/ngocjohn/vehicle-info-card - - type: custom:mod-card - card_mod: *swipe_style - grid_options: - columns: full - card: - type: custom:swipe-card - parameters: *swipe_parameters - cards: - - <<: *github_graph_card - variables: - total_entity: sensor.vehicle_info_card - latest_entity: sensor.vehicle_latest_release_download - bar_color: rgb(196, 74, 34) - fill_color: 'rgba(196, 74, 34, 0.2)' - - <<: *github_logbook_card - variables: - latest_entity: sensor.vehicle_latest_release_download - bar_color: rgb(196, 74, 34) - fill_color: 'rgba(196, 74, 34, 0.2)' - - <<: *github_diagnostic_card - variables: - device_id: ngocjohn/vehicle-info-card - bar_color: rgb(196, 74, 34) - fill_color: 'rgba(196, 74, 34, 0.2)' - - - type: grid - column_span: 3 - cards: - - <<: *github_heading_card - variables: - heading_title: 🌘 Lunar Phase Card - total_entity: sensor.lunar_phase_card_total - latest_entity: sensor.lunar_phase_card_latest - stars_entity: sensor.lunar_phase_card_stars - repo_link: https://github.com/ngocjohn/lunar-phase-card - - type: custom:mod-card - card_mod: *swipe_style - grid_options: - columns: full - card: - type: custom:swipe-card - parameters: *swipe_parameters - cards: - - <<: *github_graph_card - variables: - total_entity: sensor.lunar_phase_card_total - latest_entity: sensor.lunar_phase_card_latest - bar_color: 'rgba(0, 255, 208, 0.7)' - fill_color: 'rgba(0, 255, 208, 0.2)' - - <<: *github_logbook_card - variables: - latest_entity: sensor.lunar_phase_card_latest - bar_color: 'rgba(0, 255, 208, 0.7)' - fill_color: 'rgba(0, 255, 208, 0.2)' - - <<: *github_diagnostic_card - variables: - device_id: ngocjohn/lunar-phase-card - bar_color: 'rgba(0, 255, 208, 0.7)' - fill_color: 'rgba(0, 255, 208, 0.2)' - - type: grid - column_span: 3 - cards: - - <<: *github_heading_card - variables: - heading_title: 🌘 Lunar Phase Integration - total_entity: sensor.lunar_phase_integration_total - latest_entity: sensor.lunar_phase_integration_latest - stars_entity: sensor.lunar_phase_integration_stars - repo_link: https://github.com/ngocjohn/lunar-phase - - type: custom:mod-card - card_mod: *swipe_style - grid_options: - columns: full - card: - type: custom:swipe-card - parameters: *swipe_parameters - cards: - - <<: *github_graph_card - variables: - total_entity: sensor.lunar_phase_integration_total - latest_entity: sensor.lunar_phase_integration_latest - bar_color: 'rgba(236, 79, 241, 0.7)' - fill_color: 'rgba(236, 79, 241, 0.2)' - - <<: *github_logbook_card - variables: - latest_entity: sensor.lunar_phase_integration_latest - bar_color: 'rgba(236, 79, 241, 0.7)' - fill_color: 'rgba(236, 79, 241, 0.2)' - - <<: *github_diagnostic_card - variables: - device_id: ngocjohn/lunar-phase - bar_color: 'rgba(236, 79, 241, 0.7)' - fill_color: 'rgba(236, 79, 241, 0.2)' - - type: grid - column_span: 2 - cards: - - <<: *github_heading_card - variables: - heading_title: 🛖 Hass Config - total_entity: 'sensor.hass_config_forks' - latest_entity: sensor.hass_config_latest_tag - stars_entity: 'sensor.hass_config_stars' - repo_link: https://github.com/ngocjohn/hass-config - - type: entities - grid_options: - columns: full - card_mod: - class: header nopadding - style: | - ha-card { - background: linear-gradient(to top, #2024349e 0%, transparent 100%); - } - show_header_toggle: false - state_color: false - entities: - - entity: sensor.hass_config_stars - secondary_info: last-changed - name: Stars - - entity: sensor.hass_config_forks - name: Forks - - entity: sensor.hass_config_watchers - name: Watchers - - entity: sensor.hass_config_latest_commit_formatted - secondary_info: last-changed - icon: mdi:source-commit - name: Latest Commit - tap_action: - action: fire-dom-event - browser_mod: - service: browser_mod.javascript - data: - code: > - window.open(`${hass.states['sensor.hass_config_latest_commit'].attributes.url}`, '_blank'); - - type: divider - - type: custom:multiple-logbook-card - card_mod: - style: | - ha-card .card-content-scroll { - padding: 0 !important; - max-height: 270px; - height: 100%; - } - max_items: 6 - show: - separator: true - duration: false - title: '' - date_format: relative - entities: - - entity: sensor.vehicle_latest_release_download - label: Vehicle Info - - entity: sensor.lunar_phase_integration_latest - label: Lunar Phase Integration - - entity: sensor.lunar_phase_card_latest - label: Lunar Phase Card - - entity: sensor.vehicle_status_latest - label: Vehicle Status - grid_options: - columns: full - - type: grid - column_span: 2 - cards: - - type: heading - heading: 🚀 Github stats - tap_action: - action: url - url_path: https://github.com/ngocjohn - grid_options: - columns: full - - type: markdown - grid_options: - columns: full - card_mod: - style: | - ha-markdown { - padding: 0 !important; - } - content: >- - [![GitHub Streak](https://github-readme-streak-stats.herokuapp.com?user=ngocjohn&theme=transparent&hide_border=true&short_numbers=true&date_format=j%2Fn%5B%2FY%5D&card_width=600&stroke=634EEB7A)](https://git.io/streak-stats) - ![Top Langs](https://github-readme-stats.vercel.app/api/top-langs/?username=ngocjohn&layout=compact&theme=catppuccin_mocha&hide_border=true&count_private=true&card_width=600&hide=html,shell) - ![GitHub Stats](https://github-readme-stats.vercel.app/api?username=ngocjohn&theme=one_dark_pro&show_icons=true&hide_border=true&count_private=true&hide_title=true&card_width=600&rank_icon=default&text_bold=false) diff --git a/config/dashboards/subviews/kodi-library.yaml b/config/dashboards/subviews/kodi-library.yaml deleted file mode 100644 index 07fb1b7..0000000 --- a/config/dashboards/subviews/kodi-library.yaml +++ /dev/null @@ -1,347 +0,0 @@ -icon: si:kodi -path: movies -subview: false -theme: kodi -background: >- - linear-gradient(180deg, rgb(0 0 0) 0%, rgba(23,26,37,1) 42%, - rgba(21,25,35,1) 100%) -type: custom:grid-layout -layout: - grid-template-rows: auto - grid-template-columns: 16px auto 16px - grid-template-areas: | - ". cc ." - ". . ." - grid-column-gap: 0 - margin: 0 - card_margin: 0 - mediaquery: - '(max-width: 800px)': - grid-template-columns: 8px auto 8px - grid-template-rows: auto -cards: - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - grid-template-columns: auto - grid-template-rows: min-content min-content 1fr - grid-column-gap: 16px - margin: -1px - view_layout: - grid-area: cc - - cards: - # [Header] Summary - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - grid-template-columns: auto max-content - grid-template-rows: auto - mediaquery: - '(min-width: 1024px)': - grid-template-columns: auto max-content - '(min-width: 800px)': - grid-template-columns: auto max-content - '(max-width: 799.99px)': - grid-template-columns: calc(100vw - 16px) - margin: 0 - - cards: - - type: markdown - card_mod: - style: !include ../shared/snippets/style-header-markdown.yaml - content: > - # Kodi library - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: 0 - view_layout: - place-self: center auto - cards: - - type: 'custom:swipe-card' - parameters: !include ../shared/snippets/parameters-page-title-swipe-card.yaml - card_mod: - style: !include ../shared/snippets/style-page-title-swipe-card.yaml - cards: - - type: 'custom:mushroom-entity-card' - entity: sensor.kodi_all_movies - secondary_info: last-updated - name: Recently Added - icon: mdi:filmstrip-box-multiple - tap_action: - action: fire-dom-event - local_conditional_card: - action: set - ids: - - upcomingmovie: hide - - addedmovie: show - - - type: custom:mushroom-template-card - primary: Movies in {{ now().strftime('%B') }} - secondary: >- - {{ (states('sensor.upcoming_movies_1') | int) + - (states('sensor.upcoming_movies_2') | int) }} Movies - icon: mdi:theater - icon_color: '#FF6F00' - tap_action: - action: fire-dom-event - local_conditional_card: - action: set - ids: - - upcomingmovie: show - - addedmovie: hide - - - type: custom:mushroom-entity-card - entity: automation.kodi_lib_scan - icon: mdi:sync-circle - name: Scan Library - secondary_info: last-updated - tap_action: - action: none - double_tap_action: - action: call-service - service: automation.trigger - target: - entity_id: automation.kodi_lib_scan - data: - skip_condition: true - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - grid-template-columns: 95vw - place-content: center - margin: -1px - padding: 16px 0 - cards: - # - type: custom:auto-entities - # card_param: cards - # show_empty: false - # filter: - # include: - # - entity_id: sensor.kodi_added_movie_** - # options: - # type: custom:button-card - # template: kodi_upcoming_poster - # card: - # type: custom:swipe-card - # parameters: - # spaceBetween: 25 - # speed: 8000 - # autoHeight: true - # loop: true - # autoplay: - # delay: 0 - # disableOnInteraction: false - # slidesPerView: auto - # centeredSlides: false - - type: custom:swipe-card - card_mod: - style: - .: | - :host { - --swiper-theme-color: #ffffff !important; - --swiper-pagination-color: #ffffff !important; - } - .swiper-container { - padding-bottom: 25px !important; - } - .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { - bottom: 0 !important; - } - .swiper-pagination-bullet { - background: #ffffff !important; - transition: all 0.3s ease-in-out !important; - } - .swiper-pagination-bullet-active { - width: 18px !important; - border-radius: 1rem !important; - } - .swiper-slide { - transition: filter 2s, - transform !important; - } - .swiper-slide, .swiper-slide-prev, .swiper-slide-next { - filter: blur(1px) brightness(0.5); - } - .swiper-slide-active { - filter: none; - } - parameters: - loop: false - speed: 600 - centeredSlides: true - slidesPerView: auto - grabCursor: false - followFinger: false - pagination: - type: bullets - clickable: true - effect: coverflow - coverflowEffect: - rotate: 10 - stretch: 120 - depth: 200 - modifier: 1 - slideShadows: true - scale: 1 - cards: - - &movie - type: custom:button-card - entity: sensor.upcoming_movie_01 - show_icon: false - show_state: false - show_label: false - styles: - card: - - width: 400px - - aspect-ratio: 2 - - background-image: | - [[[ return `url("${entity.attributes.fanart_url}")`; ]]] - - background-size: cover - - background-repeat: no-repeat - - <<: *movie - entity: sensor.upcoming_movie_02 - - <<: *movie - entity: sensor.upcoming_movie_03 - - <<: *movie - entity: sensor.upcoming_movie_04 - - <<: *movie - entity: sensor.upcoming_movie_05 - - <<: *movie - entity: sensor.upcoming_movie_06 - - <<: *movie - entity: sensor.upcoming_movie_07 - - - !include kodi-recently-added.yaml - - !include kodi-upcoming-movies.yaml - - # - type: custom:stack-in-card - # card_mod: - # style: | - # ha-card::before { - # transform: translate3d(0,0,0); - # -webkit-transform: translate3d(0,0,0); - # content: ""; - # position: absolute; - # height: 100%; - # width: 100%; - # background: url( '{{ state_attr('media_player.living_room_tv', "entity_picture") }}' ) center no-repeat; - # filter: blur(150px) saturate(400%); - # background-size: 100% 100%; - # } - # ha-card { - # position: fixed; - # bottom: 4px; - # width: -webkit-fill-available !important; - # margin-right: 1rem; - # transform: translate3d(0,0,0); - # -webkit-transform: translate3d(0,0,0); - # --ha-card-border-width: 0; - # background: url( '{{ state_attr("media_player.living_room_tv", "entity_picture") }}' ), linear-gradient(to left, transparent, black 70%); - # background-size: 50% auto, cover; - # background-position: right; - # background-repeat: no-repeat; - # background-blend-mode: saturation; - # transition-delay: 250ms; - # animation: slide-opacity 1000ms ease-in-out both; - # box-shadow: 0px 9px 20px 5px rgba(var(--album-art-color),.2); - # opacity: 0; - # height: 118px !important; - # --ha-card-border-width: 0; - # --rgb-state-media-player: var(--album-art-color); - # } - # :host { - # --album-art-color: {{ states('sensor.vibrant_color') }} - # } - # @keyframes slide-opacity { - # 0% { - # transform: translateX(50%); - # opacity: 0; - # } - # 100% { - # transform: translateX(0%); - # opacity: 1; - # } - # } - # cards: - # - type: custom:mushroom-media-player-card - # entity: media_player.living_room_tv - # icon: mdi:play - # use_media_info: true - # use_media_artwork: false - # show_volume_level: false - # fill_container: false - # collapsible_controls: false - # media_controls: - # - play_pause_stop - # - previous - # - next - # - on_off - # volume_controls: - # - volume_buttons - # - volume_set - # card_mod: - # style: | - # mushroom-shape-icon { - # display: flex; - # {% set media_type = state_attr(config.entity, 'media_content_type') %} - # {% if media_type == 'tvshow' %} - # --card-mod-icon: mdi:television-classic; - # animation: flicker 1s linear infinite alternate; - # {% elif media_type == 'movie' %} - # --card-mod-icon: mdi:movie-roll; - # animation: spin 2s linear infinite reverse; - # {% elif media_type == 'music' %} - # --card-mod-icon: mdi:kodi; - # animation: beat 1.3s ease-out infinite both; - # {% elif media_type == 'playlist' %} - # --card-mod-icon: mdi:kodi; - # animation: beat 1.3s ease-out infinite both; - # {% else %} - # --card-mod-icon: mdi:play; - # {% endif %} - # {{ 'animation: none;' if not is_state(config.entity, 'playing') }} - # } - # @keyframes flicker { - # 0%, 31.98%, 32.98%, 34.98%, 36.98%, 39.98%, 67.98%, 68.98%, 95.98%, 96.98%, 97.98%, 98.98%, 100% { --icon-color: rgba(var(--album-art-color), 1); } - # 32%, 33%, 35%, 36%, 37%, 40%, 68%, 69%, 96%, 97%, 98%, 99% { --icon-color: rgba(var(--album-art-color), 0.6); } - # } - # @keyframes beat { - # 0%, 60% { --icon-symbol-size: 21px; } - # 5%, 17%, 57% { --icon-symbol-size: 22px; } - # 10%, 20%, 51% { --icon-symbol-size: 23px; } - # 25%, 45% { --icon-symbol-size: 24px; } - # 30%, 39% { --icon-symbol-size: 25px; } - # 33% { --icon-symbol-size: 26px; } - # } - # .actions { - # --rgb-primary-text-color: var(--album-art-color); - # --primary-text-color: rgb(var(--album-art-color)); - # width: 40% !important; - # } - - # # STICKY MENU - - # # - type: custom:stack-in-card - # # # view_layout: - # # # show: - # # # mediaquery: '(max-width: 800px)' - # # card_mod: - # # style: !include ../shared/snippets/card-style-sticky-menu.yaml - # # cards: - # # - type: custom:mini-media-player - # # entity: media_player.living_room_tv - # # volume_stateless: true - # # toggle_power: true - # # artwork: material - # # info: scroll - # # source: icon - # # group: false - # # hide: - # # icon: true - # # power: true - # # name: false diff --git a/config/dashboards/subviews/kodi-recently-added.yaml b/config/dashboards/subviews/kodi-recently-added.yaml deleted file mode 100644 index 417f32c..0000000 --- a/config/dashboards/subviews/kodi-recently-added.yaml +++ /dev/null @@ -1,8 +0,0 @@ -type: custom:local-conditional-card -default: show -id: addedmovie -card: - type: custom:decluttering-card - template: kodi_movie_cards - variables: - - padding: 0 diff --git a/config/dashboards/subviews/lights.yaml b/config/dashboards/subviews/lights.yaml deleted file mode 100644 index 6d17a7a..0000000 --- a/config/dashboards/subviews/lights.yaml +++ /dev/null @@ -1,208 +0,0 @@ -icon: mdi:lightbulb -path: lights -subview: false - -type: panel -theme: Metro Orange -cards: - - type: custom:mod-card - card_mod: - style: | - :host { - --masonry-view-card-margin: 0 !important; - } - ha-card { - background: none; - position: relative; - overflow: hidden !important; - } - layout-card { - background: none; - position: relative; - opacity: 0; - left: 100%; - animation-name: fade-in2; - animation-duration: 1s; - animation-fill-mode: both; - animation-iteration-count: 1; - } - @keyframes fade-in2 { - 0% {opacity: 0; left: 50%;} - 100% {opacity: 1; left: 0%;} - } - card: - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-page-margin.yaml - cards: - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-page-columns.yaml - view_layout: - grid-area: cc - cards: - # [Header] Summary - - type: custom:mushroom-chips-card - view_layout: - grid-area: cc - show: - mediaquery: '(max-width: 800px)' - alignment: start - chips: - - type: back - card_mod: - style: | - :host { - overflow: hidden !important; - position: fixed !important; - z-index: 4; - } - ha-card { - background: rgb(0, 0, 0) !important; - width: 100vw; - padding: 12px; - animation: position 500ms linear both; - animation-delay: 1000ms; - top: -5px; - left: -8px; - } - @keyframes position { - 0% { - top: -56px; - opacity: 0; - } - 100% { - top: -5px; - opacity: 1; - } - } - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-page-title-with-2-badges.yaml - view_layout: - grid-column: 1/-1 - cards: - - type: markdown - style: !include ../shared/snippets/style-markdown-page-title.yaml - content: > - # Light - - {% set light = expand(states.light.all_light_group) | selectattr( 'state', 'eq', 'on') | list | count %}{% set daylight = ( state_attr('sun.sun', 'next_rising') | as_timestamp(0) - state_attr('sun.sun', 'next_setting') | as_timestamp(0) ) | abs / 60 / 60 %} - You have {{ states.group.light_all.attributes.entity_id | count }} lights and {{ light }} of them {{ iif((light == 1), 'is', 'are') }} turned on. There are {{ daylight | round(1) }} hours of daylight and {{ 24 - daylight | round(1) }} hours of nighttime today. - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: 0 - view_layout: - place-self: center auto - cards: - - type: 'custom:swipe-card' - start_card: 1 - parameters: !include ../shared/snippets/parameters-page-title-swipe-card.yaml - card_mod: - style: !include ../shared/snippets/style-page-title-swipe-card.yaml - cards: - - type: 'custom:mushroom-entity-card' - entity: binary_sensor.macbookpro - name: MBPro Server ↗ - icon_color: '#4EC5F1' - card_mod: - style: !include ../shared/snippets/style-page-title-swipe-card-tile.yaml - - - type: 'custom:mushroom-entity-card' - entity: binary_sensor.macbookpro - name: MBPro Server ↗ - icon_color: '#4EC5F1' - card_mod: - style: !include ../shared/snippets/style-page-title-swipe-card-tile.yaml - - # [Column] ALL LIGHTS - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: -1 - cards: - - type: 'custom:button-card' - template: header_card_no_link - variables: - name: ALL LIGHTS - - - !include ../shared/columns/lights-all-light.yaml - - # [Column] Living Room - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: -1 - cards: - - type: 'custom:button-card' - template: header_card - variables: - name: LIVING ROOM & KITCHEN - label: Scenes - action: more-info - link: popup.living_room_scenes - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-live-tile.yaml - cards: !include ../shared/columns/lights-living-room.yaml - - # [Column] Office Room - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: -1 - cards: - - type: 'custom:button-card' - template: header_card_no_link - variables: - name: OFFICE - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-live-tile.yaml - cards: !include ../shared/columns/lights-office-room.yaml - - # [Column] Bedroom - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: -1 - cards: - - type: 'custom:button-card' - template: header_card - variables: - name: BEDROOM - label: Scenes - action: more-info - link: popup.living_room_scenes - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-live-tile.yaml - cards: !include ../shared/columns/lights-bedroom-room.yaml - - # [Column] Bathroom - - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: - margin: -1 - cards: - - type: 'custom:button-card' - template: header_card - variables: - name: BATHROOM & HALLWAY - label: Scenes - action: more-info - link: popup.living_room_scenes - - type: 'custom:layout-card' - layout_type: 'custom:grid-layout' - layout: !include ../shared/snippets/layout-live-tile.yaml - cards: !include ../shared/columns/lights-bathroom-hallway-room.yaml diff --git a/config/dashboards/subviews/test-lovelace.yaml b/config/dashboards/subviews/test-lovelace.yaml deleted file mode 100644 index 0c64af6..0000000 --- a/config/dashboards/subviews/test-lovelace.yaml +++ /dev/null @@ -1,5 +0,0 @@ -title: Test -path: test -cards: - - type: 'custom:webrtc-camera' - entity: camera.kids_room diff --git a/config/dashboards/templates/button_card_templates/tpl_chips.yaml b/config/dashboards/templates/button_card_templates/tpl_chips.yaml index c00e833..a7ce45c 100644 --- a/config/dashboards/templates/button_card_templates/tpl_chips.yaml +++ b/config/dashboards/templates/button_card_templates/tpl_chips.yaml @@ -104,11 +104,9 @@ chips: - position: inherit - height: auto - background: rgb(150 150 150 / 30%) - - border-radius: 9999px - - padding: 10px + - border-radius: 50% + - padding: 8px - margin: 0 - - display: inline-block - - place-self: center baseline - opacity: > [[[ return variables.state_on diff --git a/config/dashboards/templates/button_card_templates/tpl_stargazers.yaml b/config/dashboards/templates/button_card_templates/tpl_stargazers.yaml new file mode 100644 index 0000000..c42775f --- /dev/null +++ b/config/dashboards/templates/button_card_templates/tpl_stargazers.yaml @@ -0,0 +1,45 @@ +stargazer_base: + variables: + avatar_url: '' + html_url: '' + follow_me: '' + layout: icon_name + show_state: false + show_label: false + show_icon: false + show_entity_picture: true + show_name: true + entity_picture: > + [[[ + return variables.avatar_url; + ]]] + tap_action: + action: url + url_path: > + [[[ + return variables.html_url; + ]]] + styles: + name: + - font-size: 1rem + - align-self: center + - justify-self: start + img-cell: + - display: inline-flex + - place-items: center + - position: relative + icon: + - width: 40% + - position: inherit + - height: auto + - background: > + [[[ + return variables.follow_me === 'True' + ? 'var(--primary-color)' + : 'rgb(150, 150, 150, 0.3)'; + ]]] + - border-radius: 9999px + - padding: 4px + - margin: 0 + - display: inline-block + - place-self: center baseline diff --git a/config/dashboards/templates/streamline-card.yaml b/config/dashboards/templates/streamline-card.yaml index bef0377..82021df 100644 --- a/config/dashboards/templates/streamline-card.yaml +++ b/config/dashboards/templates/streamline-card.yaml @@ -322,6 +322,12 @@ grid_homepods: - circle name: Homepods double_tap_action: !include ../shared/popup/popup_mass.yaml + tap_action: + action: call-service + service: media_player.turn_off + service_data: + entity_id: media_player.mass_universal_airplay + variables: media_on: > [[[ return !entity || ['on', 'paused', 'idle'].indexOf(entity.state) !== -1; ]]] @@ -1213,8 +1219,17 @@ github_heading_card: card_mod: style: .: | - .container { - flex-wrap: wrap !important; + ha-card { + padding: 0px 8px; + } + @media (max-width: 500px) { + ha-card { + padding: 0; + } + .container { + flex-wrap: wrap !important; + width: min-content !important; + } } heading: '[[heading_title]]' heading_style: title @@ -1243,6 +1258,7 @@ github_graph_card: style: | ha-card { background: linear-gradient(to top, rgb(from {{'[[bar_color]]'}} r g b / 0.1) 0%, transparent 100%); + width: min-content !important; } header: hide showCurrentValues: false @@ -1276,16 +1292,17 @@ github_logbook_card: - fill_color: 'rgba(62, 150, 205, 0.2)' card: type: custom:multiple-logbook-card + title: 'Latest' card_mod: style: | ha-card .card-content-scroll { height: 100%; - max-height: 500px; - background: linear-gradient(to top, rgb(from {{'[[bar_color]]'}} r g b / 0.1) 0%, transparent 100%); - margin-top: 1rem !important; + max-height: 435px; + margin-top: 1rem; } ha-card .card-header { - display: none !important; + padding: 0 1rem !important; + line-height: normal !important; } scroll: true show: @@ -1309,3 +1326,95 @@ github_diagnostic_card: exclude: [] card: type: entities + +github_new_graph: + default: + - history_name: '' + - total_entity: '' + - latest_entity: '' + - bar_color: 'rgba(62, 149, 205, 1)' + - fill_color: 'rgba(62, 150, 205, 0.2)' + card: + type: custom:history-explorer-card + cardName: '[[history_name]]' + header: hide + showCurrentValues: false + legendVisible: false + labelsVisible: false + defaultTimeRange: 3d + tooltip: + size: full + uiLayout: + toolbar: top + selector: hide + lineMode: curves + graphs: + - type: line + title: Total + entities: + - entity: '[[total_entity]]' + color: '[[bar_color]]' + fill: '[[fill_color]]' + - type: bar + title: Latest + entities: + - entity: '[[latest_entity]]' + color: '[[bar_color]]' +stargazer_list: + default: + - star_entity: '' + card: + type: custom:mod-card + card_mod: + style: | + ha-card::before { + content: '{{ states['[[star_entity]]'].attributes.stargazers | count }}\2605'; + position: absolute; + top: 5%; + right: 1%; + font-size: 2em; + color: #ffffff1a; + font-weight: 500; + } + card: + type: entities + title: Stargazers + card_mod: + class: 'stargazer' + + entities: + - type: custom:auto-entities + filter: + template: | + {%- set followers = state_attr('[[star_entity]]', 'stargazers') %} + [ + {%- for user in followers -%} + { + 'type': 'custom:button-card', + 'name': '{{ user.login }}', + 'template': ['stargazer_base'], + 'variables': { + 'avatar_url': '{{ user.avatar_url }}', + 'html_url': '{{ user.html_url }}', + 'follow_me': '{{ user.follow_me }}' + } + }{%- if not loop.last %},{% endif %} + {%- endfor %} + ] + card: + type: custom:layout-card + layout_type: custom:grid-layout + layout: + grid-template-columns: repeat(auto-fill, minmax(19%, 1fr)) + grid-template-rows: auto + grid-gap: 4px 8px + margin: 0 + padding: 0 + mediaquery: + '(min-width: 801px) and (max-width: 1710px)': + grid-template-columns: repeat(auto-fill, minmax(24%, 1fr)) + grid-gap: 4px + '(max-width: 800px)': + grid-template-columns: repeat(auto-fill, minmax(26%, 1fr)) + grid-gap: 4px + cards: [] diff --git a/config/dashboards/ui-lovelace-main.yaml b/config/dashboards/ui-lovelace-main.yaml index 51c03eb..341bfb4 100644 --- a/config/dashboards/ui-lovelace-main.yaml +++ b/config/dashboards/ui-lovelace-main.yaml @@ -6,7 +6,6 @@ title: Neklanka Home views: - !include views/main.yaml - !include views/system.yaml - - !include subviews/github-stats.yaml + - !include views/github-view.yaml - !include subviews/movie-panel.yaml # - !include subviews/ytube-music.yaml - # - !include subviews/test-lovelace.yaml diff --git a/config/dashboards/views/github-grid/ha-config-stats.yaml b/config/dashboards/views/github-grid/ha-config-stats.yaml new file mode 100644 index 0000000..ea3ee67 --- /dev/null +++ b/config/dashboards/views/github-grid/ha-config-stats.yaml @@ -0,0 +1,100 @@ +- type: custom:layout-card + layout_type: custom:grid-layout + layout: !include ../../shared/snippets/layout-git-heading-content.yaml + view_layout: + grid-area: hass-config + cards: + - type: custom:streamline-card + template: github_heading_card + variables: + heading_title: 🛖 Hass Config + total_entity: 'sensor.hass_config_forks' + latest_entity: sensor.hass_config_latest_tag + stars_entity: 'sensor.hass_config_stargazers' + repo_link: https://github.com/ngocjohn/hass-config + - type: entities + card_mod: + class: header nopadding + style: | + ha-card { + background: linear-gradient(to top, #2024349e 0%, transparent 100%); + } + show_header_toggle: false + state_color: false + entities: + - entity: sensor.hass_config_stargazers + secondary_info: last-changed + name: Stars + - entity: sensor.hass_config_forks + name: Forks + - entity: sensor.hass_config_watchers + name: Watchers + - entity: sensor.hass_config_latest_commit_formatted + secondary_info: last-changed + icon: mdi:source-commit + name: Latest Commit + tap_action: + action: fire-dom-event + browser_mod: + service: browser_mod.javascript + data: + code: > + window.open(`${hass.states['sensor.hass_config_latest_commit'].attributes.url}`, '_blank'); + - type: divider + - type: custom:multiple-logbook-card + card_mod: + style: | + ha-card .card-content-scroll { + padding: 0 !important; + max-height: 275px; + height: 100%; + } + max_items: 6 + show: + separator: true + duration: false + title: '' + date_format: relative + entities: + - entity: sensor.vehicle_latest_release_download + label: Vehicle Info + - entity: sensor.lunar_phase_integration_latest + label: Lunar Phase Integration + - entity: sensor.lunar_phase_card_latest + label: Lunar Phase Card + - entity: sensor.vehicle_status_latest + label: Vehicle Status +- type: custom:layout-card + layout_type: custom:grid-layout + layout: !include ../../shared/snippets/layout-git-heading-content.yaml + view_layout: + grid-area: github-stats + cards: + - type: heading + heading: 🚀 Github stats + tap_action: + action: url + url_path: https://github.com/ngocjohn + grid_options: + columns: full + - type: markdown + card_mod: + style: + .: | + ha-card { + background: linear-gradient(to top, #2024349e 0%, transparent 100%); + padding: 0 8px; + } + ha-markdown { + padding: 0 !important; + } + ha-markdown$: | + ha-markdown-element>p { + display: flex; + flex-direction: column; + gap: 0.5rem; + } + content: >- + ![GitHub Stats](https://github-readme-stats.vercel.app/api?username=ngocjohn&theme=transparent&show_icons=true&hide_border=true&count_private=true&hide_title=true&card_width=500&rank_icon=default&text_bold=false) + ![Top Langs](https://github-readme-stats.vercel.app/api/top-langs/?username=ngocjohn&layout=compact&theme=transparent&hide_border=true&count_private=true&card_width=500&hide=html,shell) + ![GitHub Streak](https://github-readme-streak-stats.herokuapp.com?user=ngocjohn&theme=transparent&hide_border=true&short_numbers=true&date_format=j%2Fn%5B%2FY%5D&stroke=634EEB7A) diff --git a/config/dashboards/views/github-grid/repo-graphs.yaml b/config/dashboards/views/github-grid/repo-graphs.yaml new file mode 100644 index 0000000..ecfe471 --- /dev/null +++ b/config/dashboards/views/github-grid/repo-graphs.yaml @@ -0,0 +1,200 @@ +- &github_grid_repo_graphs + type: custom:layout-card + layout_type: custom:grid-layout + layout: !include ../../shared/snippets/layout-git-heading-content.yaml + view_layout: + grid-area: vehicle-status + cards: + - type: custom:streamline-card + template: github_heading_card + variables: + - heading_title: 🚘 Vehicle status card + - total_entity: sensor.vehicle_status_card_total_2 + - latest_entity: sensor.vehicle_status_latest + - stars_entity: sensor.vehicle_status_card_stargazers + - repo_link: https://github.com/ngocjohn/vehicle-status-card + - type: custom:mod-card + card_mod: + style: + .: | + ha-card { + background: linear-gradient(to top, rgb(from rgba(62, 149, 205, 1) r g b / 0.1) 0%, transparent 100%); + } + swipe-card: !include ../../shared/snippets/style-git-swipe-card.yaml + card: + type: custom:swipe-card + parameters: !include ../../shared/snippets/swiper-git-parameters.yaml + cards: + - type: custom:streamline-card + template: github_new_graph + variables: + - history_name: 'vehicle_status' + - total_entity: sensor.vehicle_status_card_total_2 + - latest_entity: sensor.vehicle_status_latest + - type: custom:streamline-card + template: stargazer_list + variables: + - star_entity: sensor.vehicle_status_card_stargazers + - type: custom:streamline-card + template: github_logbook_card + variables: + - latest_entity: sensor.vehicle_status_latest + - type: custom:streamline-card + template: github_diagnostic_card + variables: + - device_id: ngocjohn/vehicle-status-card + +## Vehicle info card +- <<: *github_grid_repo_graphs + view_layout: + grid-area: vehicle-info + cards: + - type: custom:streamline-card + template: github_heading_card + variables: + heading_title: 🚙 Vehicle info card + total_entity: sensor.vehicle_info_card + latest_entity: sensor.vehicle_latest_release_download + stars_entity: sensor.vehicle_info_card_stargazers + repo_link: https://github.com/ngocjohn/vehicle-info-card + - type: custom:mod-card + card_mod: + style: + .: | + ha-card { + background: linear-gradient(to top, rgba(196, 74, 34, 0.1) 0%, transparent 100%); + } + swipe-card: !include ../../shared/snippets/style-git-swipe-card.yaml + card: + type: custom:swipe-card + parameters: !include ../../shared/snippets/swiper-git-parameters.yaml + + cards: + - type: custom:streamline-card + template: github_new_graph + variables: + - history_name: 'vehicle_info' + - total_entity: sensor.vehicle_info_card + - latest_entity: sensor.vehicle_latest_release_download + - bar_color: rgb(196, 74, 34) + - fill_color: 'rgba(196, 74, 34, 0.2)' + - type: custom:streamline-card + template: stargazer_list + variables: + - star_entity: sensor.vehicle_info_card_stargazers + - type: custom:streamline-card + template: github_logbook_card + variables: + latest_entity: sensor.vehicle_latest_release_download + bar_color: 'rgba(0, 255, 208, 0.7)' + fill_color: 'rgba(0, 255, 208, 0.2)' + - type: custom:streamline-card + template: github_diagnostic_card + variables: + device_id: ngocjohn/vehicle-info-card + bar_color: 'rgba(0, 255, 208, 0.7)' + fill_color: 'rgba(0, 255, 208, 0.2)' + +## Lunar Phase Card +- <<: *github_grid_repo_graphs + + view_layout: + grid-area: lunar-card + cards: + - type: custom:streamline-card + template: github_heading_card + variables: + heading_title: 🌘 Lunar Phase Card + total_entity: sensor.lunar_phase_card_total + latest_entity: sensor.lunar_phase_card_latest + stars_entity: sensor.lunar_phase_card_stargazers + repo_link: https://github.com/ngocjohn/lunar-phase-card + - type: custom:mod-card + card_mod: + style: + .: | + ha-card { + background: linear-gradient(to top, rgba(0, 255, 208, 0.1) 0%, transparent 100%); + } + swipe-card: !include ../../shared/snippets/style-git-swipe-card.yaml + card: + type: custom:swipe-card + parameters: !include ../../shared/snippets/swiper-git-parameters.yaml + + cards: + - type: custom:streamline-card + template: github_new_graph + variables: + - history_name: 'lunar_card' + - total_entity: sensor.lunar_phase_card_total + - latest_entity: sensor.lunar_phase_card_latest + - bar_color: 'rgba(0, 255, 208, 0.7)' + - fill_color: 'rgba(0, 255, 208, 0.2)' + - type: custom:streamline-card + template: stargazer_list + variables: + - star_entity: sensor.lunar_phase_card_stargazers + - type: custom:streamline-card + template: github_logbook_card + variables: + latest_entity: sensor.lunar_phase_card_latest + bar_color: rgb(196, 74, 34) + fill_color: 'rgba(196, 74, 34, 0.2)' + + - type: custom:streamline-card + template: github_diagnostic_card + variables: + device_id: ngocjohn/lunar-phase-card + bar_color: rgb(196, 74, 34) + fill_color: 'rgba(196, 74, 34, 0.2)' + +## Lunar Phase Integration +- <<: *github_grid_repo_graphs + view_layout: + grid-area: lunar-integration + cards: + - type: custom:streamline-card + template: github_heading_card + variables: + heading_title: 🌘 Lunar Phase Integration + total_entity: sensor.lunar_phase_integration_total + latest_entity: sensor.lunar_phase_integration_latest + stars_entity: sensor.lunar_phase_stargazers + repo_link: https://github.com/ngocjohn/lunar-phase + - type: custom:mod-card + card_mod: + style: + .: | + ha-card { + background: linear-gradient(to top, rgba(236, 79, 241, 0.1) 0%, transparent 100%); + } + swipe-card: !include ../../shared/snippets/style-git-swipe-card.yaml + card: + type: custom:swipe-card + parameters: !include ../../shared/snippets/swiper-git-parameters.yaml + + cards: + - type: custom:streamline-card + template: github_new_graph + variables: + history_name: 'lunar_integration' + total_entity: sensor.lunar_phase_integration_total + latest_entity: sensor.lunar_phase_integration_latest + bar_color: 'rgba(236, 79, 241, 0.7)' + fill_color: 'rgba(236, 79, 241, 0.2)' + - type: custom:streamline-card + template: stargazer_list + variables: + - star_entity: sensor.lunar_phase_stargazers + - type: custom:streamline-card + template: github_logbook_card + variables: + latest_entity: sensor.lunar_phase_integration_latest + bar_color: 'rgba(236, 79, 241, 0.7)' + fill_color: 'rgba(236, 79, 241, 0.2)' + - type: custom:streamline-card + template: github_diagnostic_card + variables: + device_id: ngocjohn/lunar-phase + bar_color: 'rgba(236, 79, 241, 0.7)' + fill_color: 'rgba(236, 79, 241, 0.2)' diff --git a/config/dashboards/views/github-view.yaml b/config/dashboards/views/github-view.yaml new file mode 100644 index 0000000..67dd290 --- /dev/null +++ b/config/dashboards/views/github-view.yaml @@ -0,0 +1,43 @@ +icon: mdi:github +title: GITHUB STATS +path: github-view +theme: tablet + +type: custom:grid-layout +layout: + margin: 0 + grid-gap: 1vw 0.5vw + grid-template-columns: 0 minmax(600px, 1fr) minmax(600px, 1fr) 0.5fr 0 + grid-template-rows: 0 fit-content(100%) fit-content(100%) 0 + grid-template-areas: | + ". . . . ." + ". vehicle-status vehicle-info hass-config ." + ". lunar-card lunar-integration github-stats ." + ". . . . ." + mediaquery: + #portrait + '(min-width: 1025px) and (max-width: 1720px)': + grid-gap: 2vw 1vw + grid-template-columns: 0 minmax(600px, 1fr) minmax(600px, 1fr) 0 + grid-template-rows: 0 fit-content(100%) fit-content(100%) fit-content(100%) 0 + grid-template-areas: | + ". . . ." + ". vehicle-status vehicle-info ." + ". lunar-card lunar-integration ." + ". hass-config github-stats ." + ". . . ." + # phone + '(max-width: 1024px)': + grid-gap: 1rem 0.5rem + grid-template-columns: 0 minmax(300px, 1fr) 0 + grid-template-rows: 0 repeat(6, fit-content(100%)) 0 + grid-template-areas: | + ". . ." + ". vehicle-status ." + ". lunar-integration ." + ". vehicle-info ." + ". lunar-card ." + ". hass-config ." + ". github-stats ." + ". . ." +cards: !include_dir_merge_list github-grid/ diff --git a/config/packages/templates/sensors/github_repos.yaml b/config/packages/templates/sensors/github_repos.yaml new file mode 100644 index 0000000..1c33d72 --- /dev/null +++ b/config/packages/templates/sensors/github_repos.yaml @@ -0,0 +1,27 @@ +template: + - sensor: + - name: 'Hass Config Stargazers' + state: '{{ states.sensor.hass_config_stars.state }}' + icon: 'mdi:star' + unit_of_measurement: 'stars' + unique_id: 'hass_config_stargazers' + - name: 'Lunar Phase Card Stargazers' + state: '{{ states.sensor.lunar_phase_card_stars.state }}' + icon: 'mdi:star' + unit_of_measurement: 'stars' + unique_id: 'lunar_phase_card_stargazers' + - name: 'Lunar Phase Stargazers' + state: '{{ states.sensor.lunar_phase_integration_stars.state }}' + icon: 'mdi:star' + unit_of_measurement: 'stars' + unique_id: 'lunar_phase_stargazers' + - name: 'Vehicle Info Card Stargazers' + state: '{{ states.sensor.repo_vehicle_stars.state }}' + icon: 'mdi:star' + unit_of_measurement: 'stars' + unique_id: 'vehicle_info_card_stargazers' + - name: 'Vehicle Status Card Stargazers' + state: '{{ states.sensor.vehicle_status_card_stars.state }}' + icon: 'mdi:star' + unit_of_measurement: 'stars' + unique_id: 'vehicle_status_card_stargazers' diff --git a/config/themes/tablet.yaml b/config/themes/tablet.yaml index c51961e..86274c9 100644 --- a/config/themes/tablet.yaml +++ b/config/themes/tablet.yaml @@ -292,6 +292,7 @@ tablet: .addon .card-content { padding: 0 !important; align-content: flex-start; + --total-rows: 5; } @media screen and (max-width: 1710px) { @@ -299,16 +300,34 @@ tablet: padding: 0 !important; line-height: unset !important; } - .addon .card-content { - max-height: calc(calc(128px + 7px) * 5); + max-height: calc(calc(128px + 7px) * var(--total-rows, 5)); overflow-y: auto; overflow-x: hidden; margin-top: 1rem !important; } + } + @media screen and (max-width: 800px) { + .addon .card-content { + --total-rows: 3; + } + } + .stargazer .card-header { + padding: 0 1rem !important; + line-height: normal !important; + } + .stargazer .card-content { + max-height: 435px; + overflow-y: auto; + margin-top: 1rem; } + @media screen and (max-width: 800px) { + .stargazer .card-content { + padding: 0 !important; + } + } /* * * * * * * * * * * * * * * * * * * * @@ -340,13 +359,8 @@ tablet: overflow: hidden; } - .type-custom-history-explorer-card div#graphlist { - padding: 0 !important; - } - @media screen and (min-width: 1720px) { .type-custom-history-explorer-card div#graphlist { - padding: 0 !important; display: flex; flex-direction: column; justify-content: space-between; diff --git a/config/www/dashboard-resources/extra-menu.js b/config/www/dashboard-resources/extra-menu.js index 6454ec4..c1aafb6 100644 --- a/config/www/dashboard-resources/extra-menu.js +++ b/config/www/dashboard-resources/extra-menu.js @@ -8,7 +8,7 @@ function t(t,e,s,i){var o,n=arguments.length,r=n<3?e:null===i?i=Object.getOwnPro * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause - */,{is:d,defineProperty:p,getOwnPropertyDescriptor:u,getOwnPropertyNames:f,getOwnPropertySymbols:m,getPrototypeOf:$}=Object,y=globalThis,_=y.trustedTypes,g=_?_.emptyScript:"",v=y.reactiveElementPolyfillSupport,A=(t,e)=>t,b={toAttribute(t,e){switch(e){case Boolean:t=t?g:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let s=t;switch(e){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},w=(t,e)=>!d(t,e),E={attribute:!0,type:String,converter:b,reflect:!1,hasChanged:w};Symbol.metadata??=Symbol("metadata"),y.litPropertyMetadata??=new WeakMap;class S extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=E){if(e.state&&(e.attribute=!1),this._$Ei(),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);void 0!==i&&p(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=u(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get(){return i?.call(this)},set(e){const n=i?.call(this);o.call(this,e),this.requestUpdate(t,n,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??E}static _$Ei(){if(this.hasOwnProperty(A("elementProperties")))return;const t=$(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(A("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(A("properties"))){const t=this.properties,e=[...f(t),...m(t)];for(const s of e)this.createProperty(s,t[s])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,s]of e)this.elementProperties.set(t,s)}this._$Eh=new Map;for(const[t,e]of this.elementProperties){const s=this._$Eu(t,e);void 0!==s&&this._$Eh.set(s,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)e.unshift(c(t))}else void 0!==t&&e.push(c(t));return e}static _$Eu(t,e){const s=e.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return l(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$EC(t,e){const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(void 0!==i&&!0===s.reflect){const o=(void 0!==s.converter?.toAttribute?s.converter:b).toAttribute(e,s.type);this._$Em=t,null==o?this.removeAttribute(i):this.setAttribute(i,o),this._$Em=null}}_$AK(t,e){const s=this.constructor,i=s._$Eh.get(t);if(void 0!==i&&this._$Em!==i){const t=s.getPropertyOptions(i),o="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:b;this._$Em=i,this[i]=o.fromAttribute(e,t.type),this._$Em=null}}requestUpdate(t,e,s){if(void 0!==t){if(s??=this.constructor.getPropertyOptions(t),!(s.hasChanged??w)(this[t],e))return;this.P(t,e,s)}!1===this.isUpdatePending&&(this._$ES=this._$ET())}P(t,e,s){this._$AL.has(t)||this._$AL.set(t,e),!0===s.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t)}async _$ET(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,e]of this._$Ep)this[t]=e;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,s]of t)!0!==s.wrapped||this._$AL.has(e)||void 0===this[e]||this.P(e,this[e],s)}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(e)):this._$EU()}catch(e){throw t=!1,this._$EU(),e}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EU(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU()}updated(t){}firstUpdated(t){}}S.elementStyles=[],S.shadowRootOptions={mode:"open"},S[A("elementProperties")]=new Map,S[A("finalized")]=new Map,v?.({ReactiveElement:S}),(y.reactiveElementVersions??=[]).push("2.0.4"); + */,{is:d,defineProperty:p,getOwnPropertyDescriptor:u,getOwnPropertyNames:f,getOwnPropertySymbols:m,getPrototypeOf:$}=Object,y=globalThis,_=y.trustedTypes,g=_?_.emptyScript:"",v=y.reactiveElementPolyfillSupport,A=(t,e)=>t,w={toAttribute(t,e){switch(e){case Boolean:t=t?g:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let s=t;switch(e){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},E=(t,e)=>!d(t,e),b={attribute:!0,type:String,converter:w,reflect:!1,hasChanged:E};Symbol.metadata??=Symbol("metadata"),y.litPropertyMetadata??=new WeakMap;class S extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=b){if(e.state&&(e.attribute=!1),this._$Ei(),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);void 0!==i&&p(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=u(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get(){return i?.call(this)},set(e){const n=i?.call(this);o.call(this,e),this.requestUpdate(t,n,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??b}static _$Ei(){if(this.hasOwnProperty(A("elementProperties")))return;const t=$(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(A("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(A("properties"))){const t=this.properties,e=[...f(t),...m(t)];for(const s of e)this.createProperty(s,t[s])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,s]of e)this.elementProperties.set(t,s)}this._$Eh=new Map;for(const[t,e]of this.elementProperties){const s=this._$Eu(t,e);void 0!==s&&this._$Eh.set(s,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)e.unshift(c(t))}else void 0!==t&&e.push(c(t));return e}static _$Eu(t,e){const s=e.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return l(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$EC(t,e){const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(void 0!==i&&!0===s.reflect){const o=(void 0!==s.converter?.toAttribute?s.converter:w).toAttribute(e,s.type);this._$Em=t,null==o?this.removeAttribute(i):this.setAttribute(i,o),this._$Em=null}}_$AK(t,e){const s=this.constructor,i=s._$Eh.get(t);if(void 0!==i&&this._$Em!==i){const t=s.getPropertyOptions(i),o="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:w;this._$Em=i,this[i]=o.fromAttribute(e,t.type),this._$Em=null}}requestUpdate(t,e,s){if(void 0!==t){if(s??=this.constructor.getPropertyOptions(t),!(s.hasChanged??E)(this[t],e))return;this.P(t,e,s)}!1===this.isUpdatePending&&(this._$ES=this._$ET())}P(t,e,s){this._$AL.has(t)||this._$AL.set(t,e),!0===s.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t)}async _$ET(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,e]of this._$Ep)this[t]=e;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,s]of t)!0!==s.wrapped||this._$AL.has(e)||void 0===this[e]||this.P(e,this[e],s)}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(e)):this._$EU()}catch(e){throw t=!1,this._$EU(),e}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EU(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU()}updated(t){}firstUpdated(t){}}S.elementStyles=[],S.shadowRootOptions={mode:"open"},S[A("elementProperties")]=new Map,S[A("finalized")]=new Map,v?.({ReactiveElement:S}),(y.reactiveElementVersions??=[]).push("2.0.4"); /** * @license * Copyright 2017 Google LLC @@ -35,15 +35,20 @@ const ut={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6}, * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause - */,vt={attribute:!0,type:String,converter:b,reflect:!1,hasChanged:w},At=(t=vt,e,s)=>{const{kind:i,metadata:o}=s;let n=globalThis.litPropertyMetadata.get(o);if(void 0===n&&globalThis.litPropertyMetadata.set(o,n=new Map),n.set(s.name,t),"accessor"===i){const{name:i}=s;return{set(s){const o=e.get.call(this);e.set.call(this,s),this.requestUpdate(i,o,t)},init(e){return void 0!==e&&this.P(i,void 0,t),e}}}if("setter"===i){const{name:i}=s;return function(s){const o=this[i];e.call(this,s),this.requestUpdate(i,o,t)}}throw Error("Unsupported decorator location: "+i)}; + */,vt={attribute:!0,type:String,converter:w,reflect:!1,hasChanged:E},At=(t=vt,e,s)=>{const{kind:i,metadata:o}=s;let n=globalThis.litPropertyMetadata.get(o);if(void 0===n&&globalThis.litPropertyMetadata.set(o,n=new Map),n.set(s.name,t),"accessor"===i){const{name:i}=s;return{set(s){const o=e.get.call(this);e.set.call(this,s),this.requestUpdate(i,o,t)},init(e){return void 0!==e&&this.P(i,void 0,t),e}}}if("setter"===i){const{name:i}=s;return function(s){const o=this[i];e.call(this,s),this.requestUpdate(i,o,t)}}throw Error("Unsupported decorator location: "+i)}; /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause - */function bt(t){return(e,s)=>"object"==typeof s?At(t,e,s):((t,e,s)=>{const i=e.hasOwnProperty(s);return e.constructor.createProperty(s,i?{...t,wrapped:!0}:t),i?Object.getOwnPropertyDescriptor(e,s):void 0})(t,e,s)}const wt={backgroundColor:"rgba(0, 0, 0, 0.32);",backdropFilter:"blur(5px)"},Et={maxWidth:"492px"};function St(){let t=document.querySelector("home-assistant");return t=t&&t.shadowRoot,t=t&&t.querySelector("home-assistant-main"),t=t&&t.shadowRoot,t=t&&t.querySelector("app-drawer-layout partial-panel-resolver")||t.querySelector("ha-drawer partial-panel-resolver"),t=t&&t.shadowRoot||t,t=t&&t.querySelector("ha-panel-lovelace"),t=t&&t.shadowRoot,t=t&&t.querySelector("hui-root"),t=t&&t.shadowRoot,t=t&&t.querySelector("ha-app-layout")||t,t=t&&t.querySelector("#view"),t=t&&t.querySelector("hui-view"),t}const Ct=window.loadCardHelpers?window.loadCardHelpers():void 0,xt=new function(){this.extraMenu=null,this.position={x:0,y:0},this.handleXYPosition=t=>{t instanceof MouseEvent?this.position={x:t.clientX,y:t.clientY}:t instanceof TouchEvent&&(this.position={x:t.touches[0].clientX,y:t.touches[0].clientY})}};function Pt(t){const e=St();e&&(xt.extraMenu=document.createElement("extra-menu"),xt.extraMenu.hass=e.hass,xt.extraMenu.view=e,xt.extraMenu.config=t,xt.extraMenu.position=xt.position,xt.extraMenu.createCard(t.cards))}document.body.addEventListener("ll-custom",(t=>{t.preventDefault();const e=t;e.detail.extra_menu&&Pt(e.detail.extra_menu)})),document.addEventListener("touchstart",xt.handleXYPosition,!1),document.addEventListener("mousedown",xt.handleXYPosition,!1);let Ot=class extends dt{constructor(){super(...arguments),this.cardElement=[],this._handleClose=t=>{t.stopPropagation(),this.close()}}connectedCallback(){super.connectedCallback(),window.extra_menu=this}disconnectedCallback(){super.disconnectedCallback()}async createCard(t){let e;if(window.loadCardHelpers?e=await window.loadCardHelpers():Ct&&(e=Ct),!e||!e.createCardElement)return;const s=await Promise.all(t.map((async t=>{try{const s=await e.createCardElement(t);return s.hass=this.hass,s}catch(t){return null}})));this.cardElement=s,this.cardElement&&this.cardElement.length>0&&this._handleShowCard()}render(){return Y` + */function wt(t){return(e,s)=>"object"==typeof s?At(t,e,s):((t,e,s)=>{const i=e.hasOwnProperty(s);return e.constructor.createProperty(s,i?{...t,wrapped:!0}:t),i?Object.getOwnPropertyDescriptor(e,s):void 0})(t,e,s) +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */}function Et(t){return wt({...t,state:!0,attribute:!1})}const bt={backgroundColor:"rgba(0, 0, 0, 0.32);",backdropFilter:"blur(5px)"},St={maxWidth:"492px"};function Ct(){let t=document.querySelector("home-assistant");return t=t&&t.shadowRoot,t=t&&t.querySelector("home-assistant-main"),t=t&&t.shadowRoot,t=t&&t.querySelector("app-drawer-layout partial-panel-resolver")||t.querySelector("ha-drawer partial-panel-resolver"),t=t&&t.shadowRoot||t,t=t&&t.querySelector("ha-panel-lovelace"),t=t&&t.shadowRoot,t=t&&t.querySelector("hui-root"),t=t&&t.shadowRoot,t=t&&t.querySelector("ha-app-layout")||t,t=t&&t.querySelector("#view"),t=t&&t.querySelector("hui-view"),t}function xt(t){const e=document.querySelector("home-assistant");if(e)return e.provideHass(t)}const Pt=window.loadCardHelpers?window.loadCardHelpers():void 0,Ot=new function(){this.extraMenu=null,this.position={x:0,y:0},this.handleXYPosition=t=>{t instanceof MouseEvent?this.position={x:t.clientX,y:t.clientY}:t instanceof TouchEvent&&(this.position={x:t.touches[0].clientX,y:t.touches[0].clientY})}};function Tt(t){const e=Ct();e&&(Ot.extraMenu=document.createElement("extra-menu"),Ot.extraMenu.setConfig(t),Ot.extraMenu.displayCard(e,Ot.position))}document.body.addEventListener("ll-custom",(t=>{t.preventDefault();const e=t;e.detail.extra_menu&&Tt(e.detail.extra_menu)})),document.addEventListener("touchstart",Ot.handleXYPosition,!1),document.addEventListener("mousedown",Ot.handleXYPosition,!1);let Ut=class extends dt{constructor(){super(...arguments),this.hass={},this.cardElement=[],this._handleClose=t=>{t.stopPropagation(),this.close()}}connectedCallback(){super.connectedCallback(),window.extra_menu=this}disconnectedCallback(){super.disconnectedCallback()}setConfig(t){xt(this),this.config=t}async displayCard(t,e){this.cardElement&&0!==this.cardElement.length||await this.createCard(this.config.cards),this.view=t,this.view.style.position="relative",this.view.appendChild(this),this.cardElement&&this.cardElement.length>0&&this._handleShowCard(e)}updated(t){super.updated(t),t.has("hass")&&this.hass&&this.cardElement&&this.cardElement.length>0&&this.cardElement.forEach((t=>{t.hass=this.hass}))}async createCard(t){let e;if(window.loadCardHelpers?e=await window.loadCardHelpers():Pt&&(e=Pt),!e||!e.createCardElement)return;const s=await Promise.all(t.map((async t=>{try{const s=await e.createCardElement(t);return s.hass=this.hass,s}catch(t){return null}})));this.cardElement=s}render(){return Y`
this._handleClose(t)}>
- `}_handleShowCard(){const t=this.config.custom_position;this.view.style.position="relative",this.view.appendChild(this);const e=this.config.card_container||{},s=Object.assign(Object.assign({},Et),e);setTimeout((()=>{t&&void 0!==t?this.setCustomPosition(t,s):(Object.assign(this.style,s),this.setPosition(this.position))}),200)}setCustomPosition(t,e){var s;const i=null===(s=this.shadowRoot)||void 0===s?void 0:s.querySelector("#card-container");i&&(this.classList.add(t),Object.assign(i.style,e),i.style.height="100%",i.style.width="100%",i.style.placeSelf="center center",i.classList.replace("hidden","fade-in"))}setPosition(t){var s;const i=null===(s=this.shadowRoot)||void 0===s?void 0:s.querySelector("#card-container"),o=i.getBoundingClientRect();let n=o.width/2,r=o.height/2,a={min:{x:parseFloat(window.getComputedStyle(this.view).getPropertyValue("padding-left"))+n,y:parseFloat(window.getComputedStyle(this.view).getPropertyValue("padding-top"))+r},max:{x:this.view.clientWidth-n,y:this.view.clientHeight-r}};const h=this.view.getBoundingClientRect();t.x=e(t.x-h.left,a.min.x,a.max.x-4),t.y=e(t.y-h.top,a.min.y,a.max.y-4),this.style.left=t.x-n+"px",this.style.top=t.y-r+"px",i.classList.replace("hidden","fade-in")}close(){var t,e;const s=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("#card-container"),i=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("#shadow-container");s&&i&&(s.classList.toggle("fade-out",!0),s.addEventListener("animationend",(()=>{s.classList.replace("fade-out","hidden"),xt.extraMenu=null,this.remove()})))}computeShadowStyle(){const t=this.config.shadow_container||{};return _t(Object.assign(Object.assign({},wt),t))}static get styles(){return h` + `}_handleShowCard(t){const e=this.config.custom_position,s=this.config.card_container||{},i=Object.assign(Object.assign({},St),s);setTimeout((()=>{e&&void 0!==e?this.setCustomPosition(e,i):this.setPosition(t,i)}),500)}setCustomPosition(t,e){var s;const i=null===(s=this.shadowRoot)||void 0===s?void 0:s.querySelector("#card-container");i&&(this.classList.add(t),Object.assign(i.style,e),i.style.height="100%",i.style.width="100%",i.style.placeSelf="center center",i.classList.replace("hidden","fade-in"))}setPosition(t,s){var i;Object.assign(this.style,s),this.style.width="100%";const o=null===(i=this.shadowRoot)||void 0===i?void 0:i.querySelector("#card-container"),n=o.getBoundingClientRect();let r=n.width/2,a=n.height/2,h={min:{x:parseFloat(window.getComputedStyle(this.view).getPropertyValue("padding-left"))+r,y:parseFloat(window.getComputedStyle(this.view).getPropertyValue("padding-top"))+a},max:{x:this.view.clientWidth-r,y:this.view.clientHeight-a}};const l=this.view.getBoundingClientRect();t.x=e(t.x-l.left,h.min.x,h.max.x-4),t.y=e(t.y-l.top,h.min.y,h.max.y-4),this.style.left=t.x-r+"px",this.style.top=t.y-a+"px",o.classList.replace("hidden","fade-in")}close(){var t,e;const s=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("#card-container"),i=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("#shadow-container");s&&i&&(s.classList.toggle("fade-out",!0),s.addEventListener("animationend",(()=>{s.classList.replace("fade-out","hidden"),Ot.extraMenu=null,this.remove()})))}computeShadowStyle(){const t=this.config.shadow_container||{};return _t(Object.assign(Object.assign({},bt),t))}static get styles(){return h` :host { position: absolute; z-index: 8; /*200;*/ @@ -184,4 +189,4 @@ const ut={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6}, clip-path: inset(0 100% 0 100%); } } - `}};t([bt({attribute:!1})],Ot.prototype,"hass",void 0),t([bt({attribute:!1})],Ot.prototype,"config",void 0),t([bt({attribute:!1})],Ot.prototype,"cardElement",void 0),t([bt({attribute:!1})],Ot.prototype,"view",void 0),t([bt({attribute:!1})],Ot.prototype,"position",void 0),Ot=t([gt("extra-menu")],Ot);export{Ot as ExtraMenu}; + `}};t([Et()],Ut.prototype,"hass",void 0),t([Et()],Ut.prototype,"config",void 0),t([Et()],Ut.prototype,"cardElement",void 0),t([Et()],Ut.prototype,"view",void 0),Ut=t([gt("extra-menu")],Ut);export{Ut as ExtraMenu}; diff --git a/docs/README.md b/docs/README.md index 4aee8b1..fc8453c 100644 --- a/docs/README.md +++ b/docs/README.md @@ -45,14 +45,14 @@ https://github.com/ngocjohn/hass-config/assets/96962827/acc1a4db-b92e-4ab1-ac9d- - 35,325 + 35,894 34 - 164 + 154 63 54 32 - 1072 - 215 + 1065 + 201 38