Merge pull request #12 from custom-cards/maintainer

Maintainer

.devcontainer/configuration.yaml

@@ -0,0 +1,4 @@
+default_config:
+lovelace:
+  mode: yaml
+demo:

.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-stable",
+  "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
+  }
+}

.devcontainer/ui-lovelace.yaml

@@ -0,0 +1,8 @@
+resources:
+  - url: http://127.0.0.1:5000/boilerplate-card.js
+    type: module
+views:
+  - cards:
+      - type: "custom:boilerplate-card"
+        name: Boilerplate card development
+        entity: sun.sun

.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

.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

README.md

@@ -47,7 +47,7 @@ Hey dude! Help me out for a couple of :beers: or a :coffee:!
 
 ### Step 1
 
-Clone this repo
+Clone this repository
 
 ### Step 2
 
@@ -61,16 +61,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

hacs.json

@@ -1,4 +1,6 @@
 {
     "name": "Boilerplate Card",
-    "render_readme": true
+    "render_readme": true,
+    "filename": "boilerplate-card.js",
+    "zip_release": true
 }

package.json

@@ -35,13 +35,14 @@
     "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",
+    "start": "rollup -c rollup.config.dev.js --watch",
     "build": "npm run lint && npm run rollup",
     "lint": "eslint src/*.ts",
     "rollup": "rollup -c"

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': '*',
+      },
+    }),
+  ],
+};

rollup.config.js

@@ -1,19 +1,20 @@
-import resolve from 'rollup-plugin-node-resolve';
+import resolve from "rollup-plugin-node-resolve";
-import typescript from 'rollup-plugin-typescript2';
+import typescript from "rollup-plugin-typescript2";
-import babel from 'rollup-plugin-babel';
+import babel from "rollup-plugin-babel";
 import { terser } from "rollup-plugin-terser";
 
 export default {
-  input: ['src/boilerplate-card.ts'],
+  input: ["src/boilerplate-card.ts"],
   output: {
-    dir: './dist',
+    dir: "./dist",
-    format: 'es',
+    format: "es"
   },
   plugins: [
     resolve(),
     typescript(),
     babel({
-      exclude: 'node_modules/**'
+      exclude: "node_modules/**"
     }),
-    terser()]
+    terser(),
+  ]
 };