From 7fea379b7d85d3dd8a1e2c90da0abb1e41c8bf95 Mon Sep 17 00:00:00 2001 From: Blackymas <41958506+Blackymas@users.noreply.github.com> Date: Sun, 27 Nov 2022 22:48:54 +0100 Subject: [PATCH] Created (EN) First Steps - Installation and Setup (markdown) --- (EN)-First-Steps---Installation-and-Setup.md | 159 +++++++++++++++++++ 1 file changed, 159 insertions(+) create mode 100644 (EN)-First-Steps---Installation-and-Setup.md diff --git a/(EN)-First-Steps---Installation-and-Setup.md b/(EN)-First-Steps---Installation-and-Setup.md new file mode 100644 index 0000000..5f1585f --- /dev/null +++ b/(EN)-First-Steps---Installation-and-Setup.md @@ -0,0 +1,159 @@ +# (EN) First Steps - Installation and Setup + +## This article is about the first configuration. All important steps for installation and setup of ESPHome and the Blueprint are described here. + + +  +> ### _**ATTENTION! if you have already installed the version "nspanel-lovelace-ui" from joBr99 on your NSPanel, an intermediate step is necessary - otherwise it is not possible to install this or any other version**_. + +  +  + +*** + +  +# Content: + +1. +2. +3. +4. + +  + +*** + +  +  + +## 1. short version of the setup of Esphome and Blueprint. +> _**(for those who already have experience with ESPhome and Home Assistant)**_ + +1. First you have to install the Blueprint. For this please use the following link + +[![Open your Home Assistant instance and show the blueprint import dialog with a specific blueprint pre-filled.](https://my.home-assistant.io/badges/blueprint_import.svg)](https://my.home-assistant.io/redirect/blueprint_import/?blueprint_url=https%3A%2F%2Fgithub.com%2FBlackymas%2FNSPanel_HA_Blueprint%2Fblob%2Fmain%2Fnspnael_blueprint.yaml) + +> It is also possible to copy the code from the file _**"nspnael_blueprint.yaml "**_ and paste it into HA. +> You can find instructions for this under [Using Automation Blueprints](https://www.home-assistant.io/docs/automation/using_blueprints/) und [Automation blueprint tutorial](https://www.home-assistant.io/docs/blueprint/tutorial/#create-the-blueprint-file) + +2. in the next step you have to create a new ESP32 device in ESPHome + +3. when the new ESP32 device has been created, next click _**"Edit "**_ on the device you have just created to open the web editor. Now the following code must be copied and pasted. + +> _**IMPORTANT!**_ The already existing code in the ESPHome file must be _**"COMPLETELY "**_ deleted and _**"REPLACED "**_ by the code below. + +> _**IMPORTANT!**_ in the block _**"CHANGE ME "**_ all values _**(device_name, wifi_ssid, wifi_password, ota_password)**_ in the _**""**_ must be replaced by your own values. It is also possible to work here with _**"!secret "**_. + + +> _**ATTENTION!**_ for _**"device_name "**_ max. 15 characters _**[a-z] and [0-9]**_ may be used and all must be _**"lowercase"**_. Furthermore, characters like _**[-], [SPECIAL CHARACTARS] and [SPACES]**_ are forbidden and will cause problems with the blueprint. + +**Example:** _**nspanel_blackymas**_ + +  +### CODE: +``` +substitutions: + +###### CHANGE ME ###### + + device_name: "YOUR NSPANEL_NAME" + wifi_ssid: "YOUR WIFI SSID" + wifi_password: "YOUR WIFI PASSWORD" + ota_password: "YOUR WIFI PASSWORD" + +##### CHANGE ME ##### + + + +##### DO NOT CHANGE ANYTHING! ##### + + nextion_update_url: "https://raw.githubusercontent.com/Blackymas/NSPanel_HA_Blueprint/main/nspanel.tft" +packages: + ##### download esphome code from Github + remote_package: + url: https://github.com/Blackymas/NSPanel_HA_Blueprint + ref: main + files: [nspanel_esphome.yaml] + refresh: 300s + +##### DO NOT CHANGE ANYTHING! ##### +``` + +  + +4. Now the NSPanel can be flashed with the new ESPHome code. +> how to flash the NSPanel you can see here [HOW TO - Flash Sonoff NSPanel with ESPHome](https://www.youtube.com/watch?v=p-AK4o5jOSI) + +5. After the NSPanel is flashed, you can go to _**"Settings --> Devices & Services --> Add Integration "**_ to add your new device and finish setting it up. + +6. In the last step, only the TFT must be uploaded. To do this, open your new device in the ESPHome integration and activate the item _**"Update TFT display "**_ under _**"Configuration "**_. Now the current TFT file is loaded from Github and uploaded to your NSPanel. _**ATTENTION!**_ this process may take a moment. + +7. now the setup of ESPHome and NSPanel is completed. + +8. Now you can configure your NSPanel via the Blueprint. To do this, go to _**"Settings --> Automations & Scenes --> Templates --> NSPanel Configuration --> CREATE AUTOMATION "**_ and start with the setup of the NSPanel. + +> _**NOTE!**_In the blueprint, in the _**"ESPHOME Node Name "**_ field, enter exactly the same name that you assigned in the _**"ESPHome File"**_. + +> **Beispiel:** _**nspanel_blackymas**_ + +  +  + +*** + +  +  +## 2. Version "nspanel-lovelace-ui" by joBr99 was previously installed +> _**in the version "nspanel-lovelace-ui" from joBr99 are a few special features built in, which make it not so easy to flash a new version and TFT on the NSPanel. But since we already had this problem, we have of course already a solution for you ;)**_ + +### _**It is necessary to upload a "Blank TFT" file while "Lovelace ui" is still installed on the NSPanel.**_ + +> IMPORTANT! If you have already installed the NSPanel with my version, you must first fully install "Lovelace ui" again. + +### The following steps are necessary: + +1. download the file _**"nspanel_blank.tft "**_ from the folder _**custom_configuration**_. +2. now upload the TFT file _**"nspanel_blank.tft "**_ to the folder _**"www "**_ in Home Assistant +3. now go to the item _**"Developer tools --> Services "**_ and search there for the services +  +_**"ESPHome: DEVICE_NAME_upload_tft"**_ --> (esphome.device_name_upload_tft) +4. under URL you have to enter the path to your file _**nspanel_blank.tft**_. This could look like this +_**"http://IP_HOME_ASSISTANT:8123/local/nspanel_blank.tft"**_ +5. now the TFT file should be played on the NSPanel. It may take a moment until it is ready +6. If everything worked, you should see only a white page on the NSPanel. +7. now you can continue with the setup and configuration of my version. For this see [Kurz Version der Einrichtung von Esphome und Blueprint](https://github.com/Blackymas/NSPanel_HA_Blueprint/wiki/(DE)-Erste-Schritte-%7C-Installation-und-Einrichtung#1-kurz-version-der-einrichtung-von-esphome-und-blueprint) + + + + + +  +  + +*** + +  +  +## 3. Advanced configuration for all ESPHome and Home Assistant professionals + +* Blueprint file _**"nspnael_blueprint.yaml "**_ can also be installed manually. +* ESPHome file_**"nspanel_esphome.yaml "**_ can also be installed manually. This allows to activate or add more _**"Advanced "**_ configurations. +* There is also the possibility to upload the TFT file _**"nspanel.tft "**_ manually. The whole thing can also be combined with a _**"Folder Watcher "**_. +* additionally we provide the HMI file _**"nspanel.HMI "**_ for the Nextion Editor to customize graphics and programming if needed + +> _**ATTENTION!**_ If you use this mode, you should know what you are doing. We do not give support here! + + + + + + +  +  + +*** + +  +  +## 4. Step by Step Configuration and setup of ESPHome and Blueprint +> _**(for all those who are new to ESPhome or have no experience yet)**_ \ No newline at end of file