fixed bug in format rendering

This commit is contained in:
dcore94 2022-11-04 18:22:39 +01:00
parent 73d00edb45
commit 7157173ea3
2 changed files with 27 additions and 11 deletions

View File

@ -161,7 +161,7 @@ class SecretInputRenderer extends Renderer{
<span class="ccp-help-icon" title="${this.description}" alt="${this.description}">?</span>
</label>
<input type="password" class="ccp-input-widget form-control" name="${this.name}" value="${this.schema.default}" ${required} ${readonly}></input>
<span style="user-select:none;position:relative;top:-1.6rem;left:90%;cursor:pointer" name="password_toggle">&#128065;</span>
<span style="user-select:none;position:relative;top:-1.6rem;float:right;cursor:pointer" name="password_toggle">&#128065;</span>
</div>
`
return this.#html

View File

@ -23,6 +23,23 @@ class CCPInputWidgetEditorController extends HTMLElement{
return this.#index
}
computeDefaultInputType(){
if(this.#input.schema.format === "secret"){
return "password"
}else if(this.#input.schema.format === "date"){
return "date"
}else if(this.#input.schema.format === "time"){
return "type"
}else if(this.#input.schema.format === "dateTime"){
return "dateTime"
}
return "text"
}
isSelectedFormat(fmt){
return this.#input.schema.format === fmt ? 'selected="selected"' : ""
}
render(input, i){
this.#index = i
this.#input = input
@ -76,12 +93,12 @@ class CCPInputWidgetEditorController extends HTMLElement{
<div class="form-field" title="Format">
<label>Format</label>
<select value="${this.#input.schema.format}" name="format" class="form-control">
<option value="none">None</option>
<option value="date">Date</option>
<option value="time">Time</option>
<option value="dateTime">Date time</option>
<option value="code">Code</option>
<option value="secret">Secret</option>
<option value="none" selected="${this.isSelectedFormat('none')}">None</option>
<option value="date" selected="${this.isSelectedFormat('date')}">Date</option>
<option value="time" selected="${this.isSelectedFormat('time')}">Time</option>
<option value="dateTime" selected="${this.isSelectedFormat('dateTime')}">Date time</option>
<option value="code" selected="${this.isSelectedFormat('code')}">Code</option>
<option value="secret" ${this.isSelectedFormat('secret')}>Secret</option>
</select>
</div>
</div>
@ -100,14 +117,13 @@ class CCPInputWidgetEditorController extends HTMLElement{
</div>
<div name="input-default" class="mb-3">
<div class="form-field" title="Default value">
<input value="${this.#input.schema.default}" name="default" class="form-control" placeholder="default"/>
<span style="user-select:none;position:relative;top:-1.6rem;left:95%;cursor:pointer" name="password_toggle" class="d-none">&#128065;</span>
<input type="${this.computeDefaultInputType()}" value="${this.#input.schema.default}" name="default" class="form-control" placeholder="default"/>
<span style="user-select:none;position:relative;top:-1.6rem;float:right;cursor:pointer" name="password_toggle" class="${this.isSelectedFormat('secret') === '' ? 'd-none' : 'inline'}">&#128065;</span>
</div>
</div>
</div>
</details>
`
`
this.addEventListener("click", ev=>{
const ename = ev.target.getAttribute("name")
if(ename === "password_toggle"){