Update config-editor-card.js

This commit is contained in:
htmltiger 2022-01-17 17:54:19 +00:00 committed by GitHub
parent c90e4e4f03
commit 75dc9f1789
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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);