From 75dc9f1789a9d7d64c3836f1df39a0ece1311896 Mon Sep 17 00:00:00 2001
From: htmltiger <1429451+htmltiger@users.noreply.github.com>
Date: Mon, 17 Jan 2022 17:54:19 +0000
Subject: [PATCH] Update config-editor-card.js

---
 config-editor-card.js | 39 ++++++++++++++++++++++-----------------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/config-editor-card.js b/config-editor-card.js
index 4ffb3ae..c2a1b14 100644
--- a/config-editor-card.js
+++ b/config-editor-card.js
@@ -10,7 +10,9 @@ static get properties() {
 		code: {type: String},
 		fileList: {type: Array},
 		openedFile: {type: String},
-		edit: {type: Object},
+		infoLine: {type: String},
+		alertLine: {type: String},
+		edit: {},
 	};
 }
 
@@ -19,6 +21,8 @@ constructor() {
 	this.code = '';
 	this.fileList = [];
 	this.openedFile = '';
+	this.infoLine = '';
+	this.alertLine = '';
 }
 
 render() {
@@ -39,7 +43,7 @@ render() {
 		<div style="text-align:right"><label style="cursor:pointer">Plain text <input type="checkbox" ?checked=${true === this.edit.plainBox } name="plain" value="1" @change=${this.plainChange}></label></div>
 		</div>
 		<div style="position: -webkit-sticky; position: sticky; bottom: 0; z-index:2; background: var(--app-header-background-color); color: var(--app-header-text-color, white)">
-			<div>${this.edit.alertLine}</div>
+			<div>${this.alertLine}</div>
 			<div>		
 			<button @click="${this.List}">Get List</button>
 			<select @change=${this.Load}>
@@ -47,7 +51,7 @@ render() {
 			</select>
 			<button @click="${this.Save}">Save</button>
 			</div>
-			<code>#${this.edit.infoLine}</code>
+			<code>#${this.infoLine}</code>
 		</div>
 	</ha-card>
 `;
@@ -71,7 +75,7 @@ Unsave(){
 	this.code = localStorage.getItem('config_editorUnsaved');
 	this.renderRoot.querySelector('#code').value=this.code;
 	localStorage.removeItem('config_editorUnsaved');
-	this.edit.alertLine = '';
+	this.alertLine = '';
 }
 
 async oldText(dhis){
@@ -90,28 +94,29 @@ async Coder(){
 	await d.routerOptions.routes.event.load();
 }
 async List(){
-	this.edit.infoLine = 'List Loading...';
+	this.infoLine = 'List Loading...';
 	const e=(await this._hass.callWS({type: "config_editor/ws", action: 'list', data: '', file: ''}));
-	this.edit.infoLine = e.msg;
+	this.infoLine = e.msg;
 	this.fileList = e.file.slice().sort();
 	if(this.openedFile){
 		setTimeout(this.oldText, 500, this);
 	}	
 }
+
 async Load(x) {
-	this.code = ''; this.renderRoot.querySelector('#code').value='';this.edit.infoLine = '';
+	this.code = ''; this.renderRoot.querySelector('#code').value='';this.infoLine = '';
 	this.openedFile = x.target.value
 	if(this.openedFile){
-		this.edit.infoLine = 'Loading: '+this.openedFile;
+		this.infoLine = 'Loading: '+this.openedFile;
 		const e=(await this._hass.callWS({type: "config_editor/ws", action: 'load', data: '', file: this.openedFile}));
 		this.openedFile = e.file;
-		this.edit.infoLine = e.msg;
+		this.infoLine = e.msg;
 		const uns={f:localStorage.getItem('config_editorOpen'),d:localStorage.getItem('config_editorText')};
 		if(uns.f == this.openedFile && uns.d && uns.d != e.data){
 			localStorage.setItem('config_editorUnsaved', uns.d);
-			this.edit.alertLine = html`<i style="background:#ff7a81;cursor:pointer" @click="${this.Unsave}"> Load unsaved from browser </i>`;
+			this.alertLine = html`<i style="background:#ff7a81;cursor:pointer" @click="${this.Unsave}"> Load unsaved from browser </i>`;
 		}else{
-			localStorage.removeItem('config_editorText');this.edit.alertLine = '';
+			localStorage.removeItem('config_editorText');this.alertLine = '';
 		}
 		this.renderRoot.querySelector('#code').value=e.data;
 		this.code = e.data;
@@ -120,17 +125,17 @@ async Load(x) {
 }
 async Save() {
 	if(this.renderRoot.querySelector('#code').value != this.code){
-		this.edit.infoLine='Something not right!';
+		this.infoLine='Something not right!';
 		return;
 	}
 	if(!this.openedFile && this.code){
 		this.openedFile=prompt("type abc.yaml or folder/abc.yaml");
 	}
 	if(this.openedFile && this.openedFile.endsWith(".yaml")){
-		if(!this.code){this.edit.infoLine='';this.edit.infoLine = 'Text is empty!'; return;}
-		this.edit.infoLine = 'Saving: '+this.openedFile;
+		if(!this.code){this.infoLine='';this.infoLine = 'Text is empty!'; return;}
+		this.infoLine = 'Saving: '+this.openedFile;
 		const e=(await this._hass.callWS({type: "config_editor/ws", action: 'save', data: this.code, file: this.openedFile}));
-		this.edit.infoLine = e.msg;
+		this.infoLine = e.msg;
 		localStorage.removeItem('config_editorText');
 	}else{this.openedFile='';}
 	
@@ -141,7 +146,7 @@ getCardSize() {
 }
 
 setConfig(config) {
-	this.edit = {options: config, alertLine:'', infoLine:'', plainBox: false};
+	this.edit = {options: config, plainBox: false};
 	this.Coder();
 }
 
@@ -150,7 +155,7 @@ set hass(hass) {
 }
 
 shouldUpdate(changedProps) {
-	if( changedProps.has('code') || changedProps.has('openedFile') || changedProps.has('fileList') || changedProps.has('edit') ){return true;}
+	if( changedProps.has('code') || changedProps.has('openedFile') || changedProps.has('fileList') || changedProps.has('infoLine') || changedProps.has('alertLine') || changedProps.has('edit') ){return true;}
 }
 
 } customElements.define('config-editor-card', ConfigEditor);