Hi,
I’m French, sorry for my English and thanks Google Traduction.
First of all, I would like to thank the following people who allowed me to develop the product:
@Rocodamelshekima
@DaneedeKruyff
@Homey-Cornelisse
I used their excellent work to create what I decided to call “HomeyDash Reborn”.
Description:
As a user of the fabulous homeydash.com, I wanted to be able to personalize it without entering the code.
I’m not a developer, but I looked at the code on the github of my dear colleagues to understand how it worked.
From that moment, I was able to create a new category which I named ** Theme **.
Warning :
Before continuing with the tutorial, it is important to understand that this Dashboard is only compatible with Docker or a machine supporting Python.
Indeed, I added a backend to be able to increase the functionalities! It is a mandatory prerequisite (compatible with all NAS, Raspberry …).
Last point, the docker is minimalist … I will add later, WSGI, gunicorn …
The code is not perfect, far from it. and it is not yet compatible with all formats of devices (Ipad, iPhone, Samsung …). I await your feedback to find out if it works.
TUTORIAL :
Step 1: Installation
Installation on a PC / MAC / LINUX equipped with Docker, you must launch the following commands:
docker run --name "homeydash_reborn" -p <PORT>:5000 devstored/homeydash_reborn:latest
(replace with a port which is not used.)
go to http://<LOCAL_IP>:
Installation on Synology NAS:
Choose a port that you are not using. Be careful, if you have an active fragrance, you will need to add this port in the fragrance rules.
Leave the rest of the default settings. Click on the button Apply
Launch the docker, and go to http: // <NAS_IP>: in my example is http://192.168.1.88:6680
Local installation:
Go to my Github: https://github.com/Devstored/homeydash_reborn
Clone the project on your machine and install Python3 : https://www.python.org/downloads/
Go to the terminal and go to the “homeydash_reborn” folder that you just cloned, then execute the following command:
pip install -r requirements.txt or pip3 install -r requirements.txt
and then run in the terminal:
python3 app.py
Go to the address:
http://localhost:5000
You no longer need to enter a token! You can find the menu by accessing it: / config
Step 2: Use
You should see the following screen:
Just follow the instructions and click on Validate
Normally you should be on this screen (with music from Star Wars):
You are on the default theme. If you want to change the theme, just click on the “Theme” icon to access the new menu:
You can now access the information of the current theme / select. You can import as many new themes as you want. However there are a few things to know:
-Never delete the theme “default” because it may break everything
-If you don’t have a wallpaper, you can’t change the opacity (normal)
-The themes you want to import must all meet the folder standards below. Otherwise you risk breaking everything.
We will go to The last part of the tutorial, Creating a theme.
Please download the file “sample_theme.zip” which you must unzip. https://drive.google.com/open?id=1ubDOt42d8IKtnMpQj2iUCi8AB2qZojqF
In the “audios” folder you can import a “clic” sound and a “start-up” sound. Avoid too large files and favor the .mp3 format.
In the “backgrounds” folder, you can put as many wallpapers as you want. The tool will detect automatically. If you do not put it, it is absolutely necessary that you indicate colors (we will see that later).
In the “header_icons” folder you must put all the images relating to the menu icons.
The most important file is “settings.json”.
You will need the site to choose your colors and transparency (select the rgba): https://www.hexcolortool.com/
You will need the site: : https://fonts.google.com/ to choose the font (if font have spaces in the name, replace with “_”.
You just have to change the colors to your liking. If the audio / backgrounds / icons files do not have the same title as this theme, you must modify the file name in the corresponding lines.
Example: if you import a file for the settings icon which names it “settings123.png” you will have to replace
" name ":" settings.svg ",
with
" name ":" settings123.png ",
at Line 44.
If you do not want to add an image for the wallpaper, it is mandatory to add color to the background.
Replace line 30 - 34:
"gradientColors": { "color1": "", "color2": "", "color3": "" },
by :
"gradientColors": { "color1": "red", "color2": "red", "color3": "red" },
If you want a wallpaper with a unique color.
You can customize with transparency for example which gives:
"gradientColors": { "color1": "rgba (51,204,204,0.7)", "color2": "rgba (33, 114, 255, 0.9)", "color3": "rgba (255, 242, 0.0.8)" },
Remember that it is the color that takes over. If you indicate a color, you will not see your images.
Do not forget to modify the information at the top “themeInfo” by indicating your name, the date and the link of your HomeyCommunity profile.
When you are done, you must rename the folder sample_theme with the name of your choice and then compress it to .zip.
You can now import your theme:
Here is the result :
I have included new options. I let you play with:
It’s the end of the tutorial, I’ll let you have fun. But don’t forget one thing, it’s a beta version, the new words are not translated (English, French and German are ok, thanks @SVEN_STOFFELS)
Again thank you very much to the original developers
@Rocodamelshekima
@DaneedeKruyff
@Homey-Cornelisse
What I plan for The following:
-Autosize text on buttons
-Website to generate themes automatically
-Correction of anomalies that you will discover
-Support for new screen size and new “formats” (ipad / iphone etc …)
-Add WSGI gunicorn for the docker.
-Make the docker lighter
-Create a Theme Store with all user themes.
-Better translate the tutorial
-OTA update.
Do not hesitate to go and support the HomeyDash.com team:
https://community.homey.app/t/homeydash-com-een-homey-dashboard/17436
If the developers of Homeydash.com want to incorporate these changes, it would be a pleasure.
And if you want to buy me a beer you can be really cool:
https://www.paypal.me/raynconcept
CHANGELOG in comment.
