Skip to content

Commit

Permalink
feat: Start on the kanji clock 0.0.1
Browse files Browse the repository at this point in the history
  • Loading branch information
sopelj committed Oct 3, 2020
1 parent 804f229 commit 7f8d23f
Show file tree
Hide file tree
Showing 17 changed files with 207 additions and 782 deletions.
8 changes: 4 additions & 4 deletions .devcontainer/ui-lovelace.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ resources:
type: module
views:
- cards:
- type: custom:boilerplate-card
name: Boilerplate Card Development
entity: sun.sun
test_gui: true
- type: custom:kanji-clock-card
use_24h: false
short_weekdays: false
kanji_numbers: false
119 changes: 21 additions & 98 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,119 +1,42 @@
# Boilerplate Card by [@iantrich](https://www.github.com/iantrich)

A community driven boilerplate of best practices for Home Assistant Lovelace custom cards
# Kanji Clock Card by [@sopelj](https://www.github.com/sopelj)

[![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
A simple clock widget using Japanese Kanji for time and date

Hey dude! Help me out for a couple of :beers: or a :coffee:!
*Please ⭐️ this repo if you find it useful*

[![coffee](https://www.buymeacoffee.com/assets/img/custom_images/black_img.png)](https://www.buymeacoffee.com/zJtVxUAgH)
![12h](./images/12h.png)
![12h Kanji](./images/12h-kanji.png)

## 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
| Name | Type | Requirement | Description | Default |
| ----------------- | ------- | ------------ | ------------------------------------------- | ------------- |
| type | string | **Required** | `custom:kanji-clock-card` | |
| use_24h | boolean | **Optional** | Use 24 hour clock | `false` |
| short_weekdays | boolean | **Optional** | Abbreviate weekdays to single kanji | `false` |
| kanji_numbers | boolean | **Optional** | Convert numbers to kanji | `false` |

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:`
## Installation with Hacs

```yaml
- url: "http://127.0.0.1:5000/boilerplate-card.js"
- url: "lovelace-kanji-clock-card/kanji-clock-card.js"
type: module
```
_Change "127.0.0.1" to the IP of your development machine._
### Bonus
## Credits
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.
```
This was created using the [Boilerplate Card](https://github.com/custom-cards/boilerplate-card) by [@iantrich](https://www.github.com/iantrich)
[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
[commits-shield]: https://img.shields.io/github/commit-activity/y/sopelj/lovelace-kanji-clock-card.svg?style=for-the-badge
[commits]: https://github.com/sopelj/lovelace-kanji-clock-card/commits/master
[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
[license-shield]: https://img.shields.io/github/license/sopelj/lovelace-kanji-clock-card.svg?style=for-the-badge
[maintenance-shield]: https://img.shields.io/maintenance/yes/2020.svg?style=for-the-badge
[releases-shield]: https://img.shields.io/github/release/sopelj/lovelace-kanji-clock-card.svg?style=for-the-badge
[releases]: https://github.com/sopelj/lovelace-kanji-clock-card/releases
4 changes: 2 additions & 2 deletions hacs.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "Boilerplate Card",
"name": "Kanji Clock Card",
"render_readme": true,
"filename": "boilerplate-card.js"
"filename": "kanji-clock-card.js"
}
Binary file added images/12h-kanji.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/12h.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
25 changes: 17 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,22 +1,29 @@
{
"name": "boilerplate-card",
"version": "1.1.9",
"description": "Lovelace boilerplate-card",
"name": "kanji-clock-card",
"version": "0.0.1",
"description": "Lovelace kanji-clock-card",
"keywords": [
"home-assistant",
"homeassistant",
"hass",
"automation",
"lovelace",
"kanji",
"clock",
"custom-cards"
],
"module": "boilerplate-card.js",
"repository": "[email protected]:custom_cards/boilerplate-card.git",
"author": "Ian Richardson <[email protected]>",
"module": "kanji-clock-card.js",
"repository": {
"type": "git",
"url": "git+https://github.com/sopelj/lovelace-kanji-clock-card.git"
},
"bugs": {
"url": "https://github.com/sopelj/lovelace-kanji-clock-card/issues"
},
"homepage": "https://github.com/sopelj/lovelace-kanji-clock-card#readme",
"author": "Jesse Sopel <[email protected]>",
"license": "MIT",
"dependencies": {
"custom-card-helpers": "^1.6.3",
"home-assistant-js-websocket": "^4.4.0",
"lit-element": "^2.2.1",
"lit-html": "^1.1.2"
},
Expand All @@ -34,6 +41,8 @@
"eslint-plugin-prettier": "^3.1.1",
"prettier": "^1.19.1",
"rollup": "^1.26.0",
"minimist": "^1.2.3",
"serialize-javascript": "^3.1.0",
"rollup-plugin-babel": "^4.3.3",
"rollup-plugin-commonjs": "^10.1.0",
"rollup-plugin-node-resolve": "^5.2.0",
Expand Down
2 changes: 1 addition & 1 deletion rollup.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const plugins = [

export default [
{
input: 'src/boilerplate-card.ts',
input: 'src/kanji-clock-card.ts',
output: {
dir: 'dist',
format: 'es',
Expand Down
Loading

0 comments on commit 7f8d23f

Please sign in to comment.