Adjust editor, add HACS actions, prep for HACS

decompil3d · Jun 7, 2022 · 5e6ba1d · 5e6ba1d
1 parent 4699cac
commit 5e6ba1d
Show file tree

Hide file tree

Showing 12 changed files with 42 additions and 30 deletions.
diff --git a/.devcontainer/configuration.yaml b/.devcontainer/configuration.yaml
@@ -2,6 +2,6 @@ default_config:
 lovelace:
   mode: yaml
   resources:
-    - url: http://127.0.0.1:5555/hourly-weather-card.js
+    - url: http://127.0.0.1:5555/hourly-weather.js
       type: module
 demo:
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -18,3 +18,8 @@ jobs:
         run: |
           npm ci
           npm run build
+      - uses: "home-assistant/actions/hassfest@master"
+      - name: HACS Action
+        uses: "hacs/action@main"
+        with:
+          category: "plugin"
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -14,7 +14,7 @@ jobs:
       # Build
       - name: Build the file
         run: |
-          cd /home/runner/work/hourly-weather-card/hourly-weather-card
+          cd /home/runner/work/lovelace-hourly-weather
           npm install
           npm run build
 
@@ -24,7 +24,7 @@ jobs:
 
         with:
           repo_token: ${{ secrets.GITHUB_TOKEN }}
-          file: /home/runner/work/hourly-weather-card/hourly-weather-card/dist/hourly-weather-card.js
-          asset_name: hourly-weather-card.js
+          file: /home/runner/work/lovelace-hourly-weather/dist/hourly-weather.js
+          asset_name: hourly-weather.js
           tag: ${{ github.ref }}
           overwrite: true
diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020 Jonathan Keslin
+Copyright (c) 2022 Jonathan Keslin
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@ An hourly weather card for Home Assistant. Visualize upcoming weather conditions
 
 [![GitHub Release][releases-shield]][releases]
 [![License][license-shield]](LICENSE.md)
-[![hacs_badge](https://img.shields.io/badge/HACS-Default-orange.svg?style=for-the-badge)](https://github.com/custom-components/hacs)
+[![hacs_badge](https://img.shields.io/badge/HACS-Custom-orange.svg?style=for-the-badge)](https://github.com/custom-components/hacs)
 
 ![Project Maintenance][maintenance-shield]
 [![GitHub Activity][commits-shield]][commits]
@@ -14,26 +14,27 @@ An hourly weather card for Home Assistant. Visualize upcoming weather conditions
 
 ## Options
 
-| Name              | Type    | Requirement  | Description                                 | Default             |
-| ----------------- | ------- | ------------ | ------------------------------------------- | ------------------- |
-| type              | string  | **Required** | `custom:hourly-weather`                     |                     |
-| entity            | string  | **Required** | Home Assistant weather entity ID.           |                     |
-| name              | string  | **Optional** | Card name                                   | Weather entity name |
-| tap_action        | object  | **Optional** | Action to take on tap                       | `action: more-info` |
-| hold_action       | object  | **Optional** | Action to take on hold                      | `none`              |
-| double_tap_action | object  | **Optional** | Action to take on double tap                | `none`              |
+| Name              | Type   | Requirement  | Description                                 | Default             |
+| ----------------- | ------ | ------------ | ------------------------------------------- | ------------------- |
+| type              | string | **Required** | `custom:hourly-weather`                     |                     |
+| entity            | string | **Required** | Home Assistant weather entity ID.           |                     |
+| name              | string | **Optional** | Card name                                   | Weather entity name |
+| num_hours         | number | **Optional** | Number of hours to show (even integer >= 2) | `12`                |
+| tap_action        | object | **Optional** | Action to take on tap                       | `action: more-info` |
+| hold_action       | object | **Optional** | Action to take on hold                      | `none`              |
+| double_tap_action | object | **Optional** | Action to take on double tap                | `none`              |
 
 ## Action Options
 
-| Name            | Type   | Requirement  | Description                                                                                                                            | Default     |
-| --------------- | ------ | ------------ | -------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| action          | string | **Required** | Action to perform (more-info, toggle, call-service, navigate url, none)                                                                | `more-info` |
-| navigation_path | string | **Optional** | Path to navigate to (e.g. /lovelace/0/) when action defined as navigate                                                                | `none`      |
-| url             | string | **Optional** | URL to open on click when action is url. The URL will open in a new tab                                                                | `none`      |
-| service         | string | **Optional** | Service to call (e.g. media_player.media_play_pause) when action defined as call-service                                               | `none`      |
-| service_data    | object | **Optional** | Service data to include (e.g. entity_id: media_player.bedroom) when action defined as call-service                                     | `none`      |
-| haptic          | string | **Optional** | Haptic feedback _success, warning, failure, light, medium, heavy, selection_ | `none`      |
-| repeat          | number | **Optional** | How often to repeat the `hold_action` in milliseconds.                                                                                 | `none`       |
+| Name            | Type   | Requirement  | Description                                                                                        | Default     |
+| --------------- | ------ | ------------ | -------------------------------------------------------------------------------------------------- | ----------- |
+| action          | string | **Required** | Action to perform (more-info, toggle, call-service, navigate url, none)                            | `more-info` |
+| navigation_path | string | **Optional** | Path to navigate to (e.g. /lovelace/0/) when action defined as navigate                            | `none`      |
+| url             | string | **Optional** | URL to open on click when action is url. The URL will open in a new tab                            | `none`      |
+| service         | string | **Optional** | Service to call (e.g. media_player.media_play_pause) when action defined as call-service           | `none`      |
+| service_data    | object | **Optional** | Service data to include (e.g. entity_id: media_player.bedroom) when action defined as call-service | `none`      |
+| haptic          | string | **Optional** | Haptic feedback _success, warning, failure, light, medium, heavy, selection_                       | `none`      |
+| repeat          | number | **Optional** | How often to repeat the `hold_action` in milliseconds.                                             | `none`      |
 
 [commits-shield]: https://img.shields.io/github/commit-activity/y/decompil3d/lovelace-hourly-weather.svg?style=for-the-badge
 [commits]: https://github.com/decompil3d/lovelace-hourly-weather/commits/master

diff --git a/hacs.json b/hacs.json
@@ -1,5 +1,6 @@
 {
     "name": "Hourly Weather Card",
     "render_readme": true,
-    "filename": "hourly-weather-card.js"
+    "filename": "hourly-weather.js",
+    "content_in_root": true
 }
diff --git a/package.json b/package.json
@@ -12,7 +12,7 @@
     "weather",
     "hourly"
   ],
-  "module": "hourly-weather-card.js",
+  "module": "src/hourly-weather.js",
   "repository": "[email protected]:decompil3d/lovelace-hourly-weather.git",
   "author": "Jonathan Keslin <[email protected]>",
   "license": "MIT",

diff --git a/rollup.config.dev.js b/rollup.config.dev.js
@@ -11,7 +11,7 @@ import { ignoreSwitchFiles } from './elements/ignore/switch';
 import { defineConfig } from 'rollup';
 
 export default defineConfig({
-  input: ['src/hourly-weather-card.ts'],
+  input: ['src/hourly-weather.ts'],
   output: {
     dir: './dist',
     format: 'es',

diff --git a/rollup.config.js b/rollup.config.js
@@ -39,7 +39,7 @@ const plugins = [
 
 export default [
   {
-    input: 'src/hourly-weather-card.ts',
+    input: 'src/hourly-weather.ts',
     output: {
       dir: 'dist',
       format: 'es',

diff --git a/src/editor.ts b/src/editor.ts
@@ -85,6 +85,9 @@ export class HourlyWeatherCardEditor extends ScopedRegistryHost(LitElement) impl
         .value=${this._numHours}
         .configValue=${'num_hours'}
         @input=${this._valueChanged}
+        .pattern=${"([1-9][0-9]*[02468])|([2468])"}
+        .autoValidate=${true}
+        validationMessage="Must be an even integer greater than or equal to 2"
       ></mwc-textfield>
     `;
   }

diff --git a/src/hourly-weather-card.ts → src/hourly-weather.ts b/src/hourly-weather-card.ts → src/hourly-weather.ts
diff --git a/src/weather-bar.ts b/src/weather-bar.ts
@@ -103,10 +103,12 @@ export class WeatherBar extends LitElement {
       overflow: hidden;
     }
     .bar > div:first-child {
-      border-radius: 10px 0 0 10px;
+      border-top-left-radius: 10px;
+      border-bottom-left-radius: 10px;
     }
     .bar > div:last-child {
-      border-radius: 0 10px 10px 0;
+      border-top-right-radius: 10px;
+      border-bottom-right-radius: 10px;
     }
     .clear-night {
       background-color: var(--color-clear-night);
@@ -179,12 +181,12 @@ export class WeatherBar extends LitElement {
       border-right: 1px solid var(--divider-color, lightgray);
     }
     .bar-block-bottom {
-      color: var(--secondary-text-color, gray);
       text-align: center;
       grid-area: bottom;
       padding-top: 5px;
     }
     .hour {
+      color: var(--secondary-text-color, gray);
       font-size: 0.9rem;
     }
     .temperature {