From bb756cd8380b5d6b4d9e1416faba6757e6c31a75 Mon Sep 17 00:00:00 2001
From: Nikolay Vasilchuk <anonym.tsk@gmail.com>
Date: Thu, 4 Jan 2024 14:57:44 +0300
Subject: [PATCH] Sorting info tiles

---
 dist/starline-card.js  | 18 +++++++++++++-----
 src/ts/StarlineCard.ts | 19 +++++++++++++++----
 2 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/dist/starline-card.js b/dist/starline-card.js
index 21cc685..872863e 100644
--- a/dist/starline-card.js
+++ b/dist/starline-card.js
@@ -1,6 +1,6 @@
 /**
  * lovelace-starline-card v1.2.1
- * Wed, 03 Jan 2024 14:09:59 GMT
+ * Thu, 04 Jan 2024 11:57:16 GMT
  */
 const STARLINE_ENTITIES = {
     'battery': {
@@ -609,18 +609,19 @@ class StarlineCard extends HTMLElement {
         if (this._hass?.language === 'ru') {
             this.$toast.textContent = 'Нажмите дважды для выполнения';
         }
+        this._setDarkMode();
+        this._setHasTitle();
         this._setControls();
+        this._setInfo();
         this._initHandlers();
         setTimeout(() => {
             this.$wrapper.style.opacity = '1';
         }, 10);
     }
     _update() {
-        this._setDarkMode();
-        this._setHasTitle();
         this._setAlarmState();
         this._setCarState();
-        this._setInfo();
+        this._setInfoState();
     }
     _getState(entity_id) {
         const entityName = this._config.entities?.[entity_id];
@@ -714,7 +715,7 @@ class StarlineCard extends HTMLElement {
             this._stopBtnProgress();
         }
     }
-    _setInfo() {
+    _setInfoState() {
         for (const [key, data] of Object.entries(this._info)) {
             let visible = false;
             if (this._config.info.indexOf(key) > -1) {
@@ -740,6 +741,13 @@ class StarlineCard extends HTMLElement {
         this.$controlCenter.classList.add(`control-icon-${this._config.controls[1]}`);
         this.$controlRight.classList.add(`control-icon-${this._config.controls[2]}`);
     }
+    _setInfo() {
+        const $cnt = this._info.balance.element.parentNode;
+        for (const name of this._config.info) {
+            const $item = $cnt.querySelector(`info-${name}`);
+            $cnt.appendChild($item);
+        }
+    }
     _initHandlers() {
         for (const [key, data] of Object.entries(this._info)) {
             data.element.addEventListener('click', () => this._moreInfo(key));
diff --git a/src/ts/StarlineCard.ts b/src/ts/StarlineCard.ts
index d4bc86b..67d1d44 100644
--- a/src/ts/StarlineCard.ts
+++ b/src/ts/StarlineCard.ts
@@ -134,7 +134,10 @@ export class StarlineCard extends HTMLElement {
             this.$toast.textContent = 'Нажмите дважды для выполнения';
         }
 
+        this._setDarkMode();
+        this._setHasTitle();
         this._setControls();
+        this._setInfo();
         this._initHandlers();
         setTimeout(() => {
             this.$wrapper!.style.opacity = '1';
@@ -142,11 +145,9 @@ export class StarlineCard extends HTMLElement {
     }
 
     _update() {
-        this._setDarkMode();
-        this._setHasTitle();
         this._setAlarmState();
         this._setCarState();
-        this._setInfo();
+        this._setInfoState();
     }
 
     _getState(entity_id: ConfigEntity): StateValue | null {
@@ -263,7 +264,7 @@ export class StarlineCard extends HTMLElement {
         }
     }
 
-    _setInfo() {
+    _setInfoState() {
         for (const [key, data] of Object.entries(this._info) as [ConfigInfo, UIElement][]) {
             let visible = false;
 
@@ -296,6 +297,16 @@ export class StarlineCard extends HTMLElement {
         this.$controlRight!.classList.add(`control-icon-${this._config.controls[2]}`);
     }
 
+    _setInfo() {
+        // Сортируем info
+        // TODO: Переделать, чтобы в _setInfoState не нужно было проверять видимость (а лучше вообще лишние элементы удалить)
+        const $cnt = this._info.balance.element!.parentNode!;
+        for (const name of this._config.info) {
+          const $item = $cnt.querySelector(`info-${name}`)!;
+          $cnt.appendChild($item);
+        }
+    }
+
     _initHandlers() {
         for (const [key, data] of Object.entries(this._info) as [ConfigInfo, UIElement][]) {
             data.element!.addEventListener('click', () => this._moreInfo(key));