master #5
|
@ -65,6 +65,10 @@ class Renderer{
|
||||||
return this.#input.minOccurs > 0
|
return this.#input.minOccurs > 0
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get readOnly(){
|
||||||
|
return this.#input.schema.readOnly
|
||||||
|
}
|
||||||
|
|
||||||
static instance(input){
|
static instance(input){
|
||||||
if(this.isEnum(input)){
|
if(this.isEnum(input)){
|
||||||
return new EnumInputRenderer(input)
|
return new EnumInputRenderer(input)
|
||||||
|
|
|
@ -65,27 +65,27 @@ class CCPInputWidgetEditorController extends HTMLElement{
|
||||||
this.innerHTML = `
|
this.innerHTML = `
|
||||||
<details ${ reopen ? 'open' : ''}>
|
<details ${ reopen ? 'open' : ''}>
|
||||||
<summary class="mb-3">
|
<summary class="mb-3">
|
||||||
<input class="form-control" style="width:auto;display:inline" required="required" name="id" value="${this.#input.id}" title="Id of input"/>
|
<input class="form-control" style="width:auto;display:inline" required="required" name="id" value="${this.#input.id}" title="Id of input" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
${ input.id !== 'ccpimage' ? this.renderDeleteButton() : ''}
|
${ input.id !== 'ccpimage' ? this.renderDeleteButton() : ''}
|
||||||
</summary>
|
</summary>
|
||||||
<div style="padding-left: 1rem;border-left: 1px solid gray;">
|
<div style="padding-left: 1rem;border-left: 1px solid gray;">
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div class="form-field" title="Title">
|
<div class="form-field" title="Title">
|
||||||
<input name="title" class="form-control" placeholder="title" value="${this.#input.title}" required="required"/>
|
<input name="title" class="form-control" placeholder="title" value="${this.#input.title}" required="required" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
<div class="form-field" title="description">
|
<div class="form-field" title="description">
|
||||||
<input name="description" class="form-control" placeholder="description" value="${this.#input.description}" required="required"/>
|
<input name="description" class="form-control" placeholder="description" value="${this.#input.description}" required="required" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<div class="col-3">
|
<div class="col-3">
|
||||||
<div class="form-field" title="Type">
|
<div class="form-field" title="Type">
|
||||||
<label>Type</label>
|
<label>Type</label>
|
||||||
<select name="type" class="form-control" placeholder="type" value="${this.#input.schema.type}">
|
<select name="type" class="form-control" placeholder="type" value="${this.#input.schema.type}" ${ input.id === 'ccpimage' ? 'readonly' : ''}>
|
||||||
<option value="string">String</option>
|
<option value="string">String</option>
|
||||||
<option value="enum">Enum</option>
|
<option value="enum">Enum</option>
|
||||||
</select>
|
</select>
|
||||||
|
@ -94,13 +94,13 @@ class CCPInputWidgetEditorController extends HTMLElement{
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div class="form-field" title="Minimum">
|
<div class="form-field" title="Minimum">
|
||||||
<label>Min</label>
|
<label>Min</label>
|
||||||
<input value="${this.#input.minOccurs}" type="number" min="0" step="1" name="minOccurs" value="${this.#input.minOccurs}" required="required" class="form-control" placeholder="minOccurs"/>
|
<input value="${this.#input.minOccurs}" type="number" min="0" step="1" name="minOccurs" value="${this.#input.minOccurs}" required="required" class="form-control" placeholder="minOccurs" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div class="form-field" title="Maximum">
|
<div class="form-field" title="Maximum">
|
||||||
<label>Max</label>
|
<label>Max</label>
|
||||||
<input value="${this.#input.maxOccurs}" type="number" min="0" step="1" name="maxOccurs" value="${this.#input.maxOccurs}" required="required" class="form-control" placeholder="maxOccurs"/>
|
<input value="${this.#input.maxOccurs}" type="number" min="0" step="1" name="maxOccurs" value="${this.#input.maxOccurs}" required="required" class="form-control" placeholder="maxOccurs" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -108,7 +108,7 @@ class CCPInputWidgetEditorController extends HTMLElement{
|
||||||
<div class="col-3">
|
<div class="col-3">
|
||||||
<div class="form-field" title="Format">
|
<div class="form-field" title="Format">
|
||||||
<label>Format</label>
|
<label>Format</label>
|
||||||
<select value="${this.#input.schema.format}" name="format" class="form-control">
|
<select value="${this.#input.schema.format}" name="format" class="form-control" ${ input.id === 'ccpimage' ? 'readonly' : ''}>
|
||||||
<option value="none" ${this.isSelectedFormat('none') ? "selected" : ""}>None</option>
|
<option value="none" ${this.isSelectedFormat('none') ? "selected" : ""}>None</option>
|
||||||
<option value="date" ${this.isSelectedFormat('date') ? "selected" : ""}>Date</option>
|
<option value="date" ${this.isSelectedFormat('date') ? "selected" : ""}>Date</option>
|
||||||
<option value="time" ${this.isSelectedFormat('time') ? "selected" : ""}>Time</option>
|
<option value="time" ${this.isSelectedFormat('time') ? "selected" : ""}>Time</option>
|
||||||
|
@ -122,7 +122,13 @@ class CCPInputWidgetEditorController extends HTMLElement{
|
||||||
<div class="col" title="Mime type">
|
<div class="col" title="Mime type">
|
||||||
<label>Mime</label>
|
<label>Mime</label>
|
||||||
<div class="form-field">
|
<div class="form-field">
|
||||||
<input value="${this.#input.schema.contentMediaType}" name="contentMediaType" class="form-control" placeholder="mime"/>
|
<input value="${this.#input.schema.contentMediaType}" name="contentMediaType" class="form-control" placeholder="mime" ${ input.id === 'ccpimage' ? 'readonly' : ''}/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col" title="Read only">
|
||||||
|
<label>Read only</label>
|
||||||
|
<div class="form-field">
|
||||||
|
<input type="checkbox" checked="${this.#input.schema.readOnly}" name="readonly" class="form-check-input">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -195,6 +201,9 @@ class CCPInputWidgetEditorController extends HTMLElement{
|
||||||
else if(ename === "default"){
|
else if(ename === "default"){
|
||||||
this.#input.schema.default = val
|
this.#input.schema.default = val
|
||||||
}
|
}
|
||||||
|
else if(ename === "readonly"){
|
||||||
|
this.#input.schema.readOnly = ev.target.checked
|
||||||
|
}
|
||||||
else if(ename === "type"){
|
else if(ename === "type"){
|
||||||
this.#type = ev.target.value
|
this.#type = ev.target.value
|
||||||
if(this.#type === "enum"){
|
if(this.#type === "enum"){
|
||||||
|
|
Loading…
Reference in New Issue