Initial commit

.devcontainer/configuration.yaml

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

.devcontainer/devcontainer.json

@@ -0,0 +1,32 @@
+// See https://aka.ms/vscode-remote/devcontainer.json for format details.
+{
+  "name": "Boilerplate Card Development",
+  "image": "ludeeus/container: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",
+    "eamodio.gitlens",
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "bierner.lit-html",
+    "runem.lit-plugin",
+    "auchenberg.vscode-browser-preview",
+    "davidanson.vscode-markdownlint",
+    "redhat.vscode-yaml"
+  ],
+  "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,9 @@
+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
+        test_gui: true

.eslintrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+    parser: '@typescript-eslint/parser',  // Specifies the ESLint parser
+    extends: [
+        'plugin:@typescript-eslint/recommended',  // Uses the recommended rules from the @typescript-eslint/eslint-plugin
+        'prettier/@typescript-eslint',  // Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
+        'plugin:prettier/recommended',  // Enables eslint-plugin-prettier and displays prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
+    ],
+    parserOptions: {
+        ecmaVersion: 2018,  // Allows for the parsing of modern ECMAScript features
+        sourceType: 'module',  // Allows for the use of imports
+        experimentalDecorators: true,
+    },
+    rules: {
+        "@typescript-eslint/camelcase": 0
+    }
+};

.github/FUNDING.yml

@@ -0,0 +1 @@
+github: [iantrich]

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,42 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: bug
+assignees: ''
+---
+
+<!-- READ THIS FIRST:
+- If you need additional help with this template please refer to https://www.home-assistant.io/help/reporting_issues/
+- Make sure you are running the latest version of Home Assistant before reporting an issue: https://github.com/home-assistant/home-assistant/releases
+- Provide as many details as possible. Do not delete any text from this template!
+-->
+
+**Checklist:**
+
+- [ ] I updated to the latest version available
+- [ ] I cleared the cache of my browser
+
+**Release with the issue:**
+
+**Last working release (if known):**
+
+**Browser and Operating System:**
+
+<!--
+Provide details about what browser (and version) you are seeing the issue in. And also which operating system this is on. If possible try to replicate the issue in other browsers and include your findings here.
+-->
+
+**Description of problem:**
+
+<!--
+Explain what the issue is, and how things should look/behave. If possible provide a screenshot with a description.
+-->
+
+**Javascript errors shown in the web inspector (if applicable):**
+
+```
+
+```
+
+**Additional information:**

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,19 @@
+---
+name: Feature request
+about: Suggest an idea for this project
+title: ''
+labels: feature request
+assignees: ''
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.

.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

.gitignore

@@ -0,0 +1,4 @@
+/node_modules/
+/.rpt2_cache/
+package-lock.json
+/dist

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+    semi: true,
+    trailingComma: 'all',
+    singleQuote: true,
+    printWidth: 120,
+    tabWidth: 2,
+};

.vscode/extensions.json

@@ -0,0 +1,13 @@
+{
+  "recommendations": [
+    "github.vscode-pull-request-github",
+    "eamodio.gitlens",
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "bierner.lit-html",
+    "runem.lit-plugin",
+    "auchenberg.vscode-browser-preview",
+    "davidanson.vscode-markdownlint",
+    "redhat.vscode-yaml"
+  ]
+}

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Custom cards for Home Assistant
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,119 @@
+# Boilerplate Card by [@iantrich](https://www.github.com/iantrich)
+
+A community driven boilerplate of best practices for Home Assistant Lovelace custom cards
+
+[![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)
+
+![Project Maintenance][maintenance-shield]
+[![GitHub Activity][commits-shield]][commits]
+
+[![Discord][discord-shield]][discord]
+[![Community Forum][forum-shield]][forum]
+
+## Support
+
+Hey dude! Help me out for a couple of :beers: or a :coffee:!
+
+[![coffee](https://www.buymeacoffee.com/assets/img/custom_images/black_img.png)](https://www.buymeacoffee.com/zJtVxUAgH)
+
+## Options
+
+| Name              | Type    | Requirement  | Description                                 | Default             |
+| ----------------- | ------- | ------------ | ------------------------------------------- | ------------------- |
+| type              | string  | **Required** | `custom:boilerplate-card`                   |
+| name              | string  | **Optional** | Card name                                   | `Boilerplate`       |
+| show_error        | boolean | **Optional** | Show what an error looks like for the card  | `false`             |
+| show_warning      | boolean | **Optional** | Show what a warning looks like for the card | `false`             |
+| entity            | string  | **Optional** | Home Assistant entity ID.                   | `none`              |
+| 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 hold                      | `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 for the [Beta IOS App](http://home-assistant.io/ios/beta) _success, warning, failure, light, medium, heavy, selection_ | `none`      |
+| repeat          | number | **Optional** | How often to repeat the `hold_action` in milliseconds.                                                                                 | `non`       |
+
+## Starting a new card from boilerplate-card
+
+### Step 1
+
+Clone this repository
+
+### Step 2
+
+Install necessary modules (verified to work in node 8.x)
+`yarn install` or `npm install`
+
+
+### Step 3
+
+Do a test lint & build on the project. You can see available scripts in the package.json
+`npm run build`
+
+### Step 4
+
+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
+
+
+## Starting a new card from boilerplate-card with [devcontainer][devcontainer]
+
+Note: this is available only in vscode ensure you have the [Remote Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers) extension installed.
+
+1. Fork and clone the repository.
+2. Open a [devcontainer][devcontainer] terminal and run `npm start` when it's ready.
+3. The compiled `.js` file will be accessible on
+   `http://127.0.0.1:5000/boilerplate-card.js`.
+4. On a running Home Assistant installation add this to your Lovelace
+   `resources:`
+
+```yaml
+- url: "http://127.0.0.1:5000/boilerplate-card.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)
+NB This will not work with node 9.x if you see the following errors try installing node 8.10.0
+```yarn install
+yarn install v1.3.2
+[1/4] 🔍  Resolving packages...
+warning [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-commonjs.
+[2/4] 🚚  Fetching packages...
+error @typescript-eslint/[email protected]: The engine "node" is incompatible with this module. Expected version "^8.10.0 || ^10.13.0 || >=11.10.1".
+error Found incompatible module
+info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
+```
+
+[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
+[forum]: https://community.home-assistant.io/c/projects/frontend
+[license-shield]: https://img.shields.io/github/license/custom-cards/boilerplate-card.svg?style=for-the-badge
+[maintenance-shield]: https://img.shields.io/maintenance/yes/2019.svg?style=for-the-badge
+[releases-shield]: https://img.shields.io/github/release/custom-cards/boilerplate-card.svg?style=for-the-badge
+[releases]: https://github.com/custom-cards/boilerplate-card/releases

hacs.json

@@ -0,0 +1,5 @@
+{
+    "name": "Boilerplate Card",
+    "render_readme": true,
+    "filename": "boilerplate-card.js"
+}