From 64f3ae8a477f96c04652f788138ba150aacc91bd Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 18:46:34 +0100 Subject: [PATCH 1/8] Adds build action --- .github/workflows/build.yml | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 .github/workflows/build.yml diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml new file mode 100644 index 00000000..0acc48ee --- /dev/null +++ b/.github/workflows/build.yml @@ -0,0 +1,20 @@ +name: "Build" + +on: + push: + branches: + - master + pull_request: + branches: + - master + +jobs: + build: + name: Test build + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v1 + - name: Build + run: | + npm install + npm run build \ No newline at end of file From fe05d888953d097f739f971dd8a46afefb07893c Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 18:46:42 +0100 Subject: [PATCH 2/8] Adds release action --- .github/workflows/release.yml | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 .github/workflows/release.yml diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml new file mode 100644 index 00000000..ce76682f --- /dev/null +++ b/.github/workflows/release.yml @@ -0,0 +1,30 @@ +name: Release + +on: + release: + types: [published] + +jobs: + release: + name: Prepare release + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v1 + + # Build + - name: Build the file + run: | + cd /home/runner/work/boilerplate-card/boilerplate-card + npm install + npm run build + + # Upload build file to the releas as an asset. + - name: Upload zip to release + uses: svenstaro/upload-release-action@v1-release + + with: + repo_token: ${{ secrets.GITHUB_TOKEN }} + file: /home/runner/work/boilerplate-card/boilerplate-card/dist/boilerplate-card.js + asset_name: boilerplate-card.js + tag: ${{ github.ref }} + overwrite: true \ No newline at end of file From 2247daedff844b3fc474f96b034785e1fa5b4447 Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 18:47:00 +0100 Subject: [PATCH 3/8] Update hacs.json to use release assets --- hacs.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/hacs.json b/hacs.json index 5ed0ceb1..cd517a0c 100644 --- a/hacs.json +++ b/hacs.json @@ -1,4 +1,6 @@ { "name": "Boilerplate Card", - "render_readme": true + "render_readme": true, + "filename": "boilerplate-card.js", + "filename": true } \ No newline at end of file From ca7d4cf95381d6a206bf34cdccb63d034cd72b28 Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 19:38:13 +0100 Subject: [PATCH 4/8] Adds devcontainer --- .devcontainer/configuration.yaml | 4 ++ .devcontainer/devcontainer.json | 31 +++++++++++ .devcontainer/ui-lovelace.yaml | 7 +++ README.md | 31 +++++++++-- package.json | 89 ++++++++++++++++---------------- rollup.config.js | 27 +++++++--- 6 files changed, 134 insertions(+), 55 deletions(-) create mode 100644 .devcontainer/configuration.yaml create mode 100644 .devcontainer/devcontainer.json create mode 100644 .devcontainer/ui-lovelace.yaml diff --git a/.devcontainer/configuration.yaml b/.devcontainer/configuration.yaml new file mode 100644 index 00000000..9b01ded0 --- /dev/null +++ b/.devcontainer/configuration.yaml @@ -0,0 +1,4 @@ +default_config: +lovelace: + mode: yaml +demo: \ No newline at end of file diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json new file mode 100644 index 00000000..89c9a531 --- /dev/null +++ b/.devcontainer/devcontainer.json @@ -0,0 +1,31 @@ +// See https://aka.ms/vscode-remote/devcontainer.json for format details. +{ + "name": "Boilerplate Card Development", + "image": "ludeeus/devcontainer:monster", + "context": "..", + "appPort": ["5000:5000", "9123:8123"], + "postCreateCommand": "npm install", + "runArgs": [ + "-v", + "${env:HOME}${env:USERPROFILE}/.ssh:/tmp/.ssh" // This is added so you can push from inside the container + ], + "extensions": [ + "github.vscode-pull-request-github", + "tabnine.tabnine-vscode", + "dbaeumer.vscode-eslint", + "ms-vscode.vscode-typescript-tslint-plugin", + "esbenp.prettier-vscode", + "bierner.lit-html", + "runem.lit-plugin", + "ms-python.python" + ], + "settings": { + "files.eol": "\n", + "editor.tabSize": 4, + "terminal.integrated.shell.linux": "/bin/bash", + "editor.formatOnPaste": false, + "editor.formatOnSave": true, + "editor.formatOnType": true, + "files.trimTrailingWhitespace": true + } +} diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml new file mode 100644 index 00000000..31c08eb9 --- /dev/null +++ b/.devcontainer/ui-lovelace.yaml @@ -0,0 +1,7 @@ +resources: + - url: http://127.0.0.1:5000/boilerplate-card.js + type: module +views: + - cards: + - type: "custom:boilerplate-card" + name: Boilerplace card development diff --git a/README.md b/README.md index a0003933..eb9e1844 100644 --- a/README.md +++ b/README.md @@ -40,7 +40,7 @@ A community driven boilerplate of best practices for Home Assistant Lovelace cus ### Step 1 -Clone this repo +Clone this repository ### Step 2 @@ -54,16 +54,41 @@ Do a test lint & build on the project. You can see available scripts in the pack ### Step 4 -Search the repo for all instances of "TODO" and handle the changes/suggestions +Search the repository for all instances of "TODO" and handle the changes/suggestions ### Step 5 Customize to suit your needs and contribute it back to the community -[Troubleshooting](https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins) + +## Starting a new card from boilerplate-card with [devcontainer][devcontainer] + +1. Fork and clone the repository. +2. Open the [devcontainer][devcontainer] and run `npm start` when it's ready. +3. The compiled `.js` file will be accessible on + `http://127.0.0.1:5000/custom-header.js`. +4. On a running Home Assistant installation add this to your Lovelace + `resources:` + +```yaml +- url: "http://127.0.0.1:5000/custom-header.js" + type: module +``` + +_Change "127.0.0.1" to the IP of your development machine._ + +### Bonus + +If you need a fresh test instance you can install a fresh Home Assistant instance inside the devcontainer as well. + +1. Run the command `dc start`. +2. Home Assistant will install and will eventually be running on port `9123` + +## [Troubleshooting](https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins) [commits-shield]: https://img.shields.io/github/commit-activity/y/custom-cards/boilerplate-card.svg?style=for-the-badge [commits]: https://github.com/custom-cards/boilerplate-card/commits/master +[devcontainer]: https://code.visualstudio.com/docs/remote/containers [discord]: https://discord.gg/5e9yvq [discord-shield]: https://img.shields.io/discord/330944238910963714.svg?style=for-the-badge [forum-shield]: https://img.shields.io/badge/community-forum-brightgreen.svg?style=for-the-badge diff --git a/package.json b/package.json index de34451b..be31a057 100644 --- a/package.json +++ b/package.json @@ -1,46 +1,47 @@ { - "name": "boilerplate-card", - "version": "1.1.1", - "description": "Lovelace boilerplate-card", - "keywords": [ - "home-assistant", - "homeassistant", - "hass", - "automation", - "lovelace", - "custom-cards" - ], - "module": "boilerplate-card.js", - "repository": "git@github.com:custom_cards/boilerplate-card.git", - "author": "Ian Richardson ", - "license": "MIT", - "dependencies": { - "custom-card-helpers": "^1.3.5", - "home-assistant-js-websocket": "^4.4.0", - "lit-element": "^2.2.1" - }, - "devDependencies": { - "@babel/core": "^7.6.4", - "@babel/plugin-proposal-class-properties": "^7.5.5", - "@babel/plugin-proposal-decorators": "^7.4.0", - "@typescript-eslint/eslint-plugin": "^2.6.0", - "@typescript-eslint/parser": "^2.6.0", - "eslint": "^6.6.0", - "eslint-config-airbnb-base": "^14.0.0", - "eslint-plugin-import": "^2.18.2", - "prettier": "^1.18.2", - "rollup": "^1.26.0", - "rollup-plugin-babel": "^4.3.3", - "rollup-plugin-node-resolve": "^5.2.0", - "rollup-plugin-terser": "^5.1.2", - "rollup-plugin-typescript2": "^0.24.3", - "rollup-plugin-uglify": "^6.0.3", - "typescript": "^3.6.4" - }, - "scripts": { - "start": "rollup -c --watch", - "build": "npm run lint && npm run rollup", - "lint": "eslint src/*.ts", - "rollup": "rollup -c" - } + "name": "boilerplate-card", + "version": "1.1.1", + "description": "Lovelace boilerplate-card", + "keywords": [ + "home-assistant", + "homeassistant", + "hass", + "automation", + "lovelace", + "custom-cards" + ], + "module": "boilerplate-card.js", + "repository": "git@github.com:custom_cards/boilerplate-card.git", + "author": "Ian Richardson ", + "license": "MIT", + "dependencies": { + "custom-card-helpers": "^1.3.5", + "home-assistant-js-websocket": "^4.4.0", + "lit-element": "^2.2.1" + }, + "devDependencies": { + "@babel/core": "^7.6.4", + "@babel/plugin-proposal-class-properties": "^7.5.5", + "@babel/plugin-proposal-decorators": "^7.4.0", + "@typescript-eslint/eslint-plugin": "^2.6.0", + "@typescript-eslint/parser": "^2.6.0", + "eslint": "^6.6.0", + "eslint-config-airbnb-base": "^14.0.0", + "eslint-plugin-import": "^2.18.2", + "prettier": "^1.18.2", + "rollup": "^1.26.0", + "rollup-plugin-babel": "^4.3.3", + "rollup-plugin-node-resolve": "^5.2.0", + "rollup-plugin-serve": "^1.0.1", + "rollup-plugin-terser": "^5.1.2", + "rollup-plugin-typescript2": "^0.24.3", + "rollup-plugin-uglify": "^6.0.3", + "typescript": "^3.6.4" + }, + "scripts": { + "start": "rollup -c --watch", + "build": "npm run lint && npm run rollup", + "lint": "eslint src/*.ts", + "rollup": "rollup -c" + } } diff --git a/rollup.config.js b/rollup.config.js index 891d8b4b..f14a456f 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,19 +1,30 @@ -import resolve from 'rollup-plugin-node-resolve'; -import typescript from 'rollup-plugin-typescript2'; -import babel from 'rollup-plugin-babel'; +import resolve from "rollup-plugin-node-resolve"; +import typescript from "rollup-plugin-typescript2"; +import babel from "rollup-plugin-babel"; +import serve from "rollup-plugin-serve"; import { terser } from "rollup-plugin-terser"; export default { - input: ['src/boilerplate-card.ts'], + input: ["src/boilerplate-card.ts"], output: { - dir: './dist', - format: 'es', + dir: "./dist", + format: "es" }, plugins: [ resolve(), typescript(), babel({ - exclude: 'node_modules/**' + exclude: "node_modules/**" }), - terser()] + terser(), + serve({ + contentBase: "./dist", + host: "0.0.0.0", + port: 5000, + allowCrossOrigin: true, + headers: { + "Access-Control-Allow-Origin": "*" + } + }) + ] }; From 18763151c7e63ec5218840eb5c726baf63710456 Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 19:40:15 +0100 Subject: [PATCH 5/8] Use stable --- .devcontainer/devcontainer.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index 89c9a531..4dc365a4 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,7 +1,7 @@ // See https://aka.ms/vscode-remote/devcontainer.json for format details. { "name": "Boilerplate Card Development", - "image": "ludeeus/devcontainer:monster", + "image": "ludeeus/devcontainer:monster-stable", "context": "..", "appPort": ["5000:5000", "9123:8123"], "postCreateCommand": "npm install", From d6bc300e74e2173ef271b9de3c3d8ec5dd02cadc Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 19:41:28 +0100 Subject: [PATCH 6/8] Use zip_release --- hacs.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/hacs.json b/hacs.json index cd517a0c..22ccbbf4 100644 --- a/hacs.json +++ b/hacs.json @@ -2,5 +2,5 @@ "name": "Boilerplate Card", "render_readme": true, "filename": "boilerplate-card.js", - "filename": true + "zip_release": true } \ No newline at end of file From 21591db46c4882fa8d4da1c222a12ce395e748ca Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 20:00:37 +0100 Subject: [PATCH 7/8] Fix example --- .devcontainer/ui-lovelace.yaml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml index 31c08eb9..53e61833 100644 --- a/.devcontainer/ui-lovelace.yaml +++ b/.devcontainer/ui-lovelace.yaml @@ -4,4 +4,5 @@ resources: views: - cards: - type: "custom:boilerplate-card" - name: Boilerplace card development + name: Boilerplate card development + entity: sun.sun From 067e877de1be48afc861950d9fc7c3aedfc2d3f0 Mon Sep 17 00:00:00 2001 From: ludeeus Date: Tue, 5 Nov 2019 21:31:25 +0100 Subject: [PATCH 8/8] Don't serve during builds --- package.json | 2 +- rollup.config.dev.js | 30 ++++++++++++++++++++++++++++++ rollup.config.js | 10 ---------- 3 files changed, 31 insertions(+), 11 deletions(-) create mode 100644 rollup.config.dev.js diff --git a/package.json b/package.json index a1f21abd..95162dbc 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "typescript": "^3.6.4" }, "scripts": { - "start": "rollup -c --watch", + "start": "rollup -c rollup.config.dev.js --watch", "build": "npm run lint && npm run rollup", "lint": "eslint src/*.ts", "rollup": "rollup -c" diff --git a/rollup.config.dev.js b/rollup.config.dev.js new file mode 100644 index 00000000..c7fe4779 --- /dev/null +++ b/rollup.config.dev.js @@ -0,0 +1,30 @@ +import resolve from 'rollup-plugin-node-resolve'; +import typescript from 'rollup-plugin-typescript2'; +import babel from 'rollup-plugin-babel'; +import serve from 'rollup-plugin-serve'; +import { terser } from 'rollup-plugin-terser'; + +export default { + input: ['src/boilerplate-card.ts'], + output: { + dir: './dist', + format: 'es', + }, + plugins: [ + resolve(), + typescript(), + babel({ + exclude: 'node_modules/**', + }), + terser(), + serve({ + contentBase: './dist', + host: '0.0.0.0', + port: 5000, + allowCrossOrigin: true, + headers: { + 'Access-Control-Allow-Origin': '*', + }, + }), + ], +}; diff --git a/rollup.config.js b/rollup.config.js index f14a456f..41a126ee 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,7 +1,6 @@ import resolve from "rollup-plugin-node-resolve"; import typescript from "rollup-plugin-typescript2"; import babel from "rollup-plugin-babel"; -import serve from "rollup-plugin-serve"; import { terser } from "rollup-plugin-terser"; export default { @@ -17,14 +16,5 @@ export default { exclude: "node_modules/**" }), terser(), - serve({ - contentBase: "./dist", - host: "0.0.0.0", - port: 5000, - allowCrossOrigin: true, - headers: { - "Access-Control-Allow-Origin": "*" - } - }) ] };