gCubeSystem
/
cdn-experiments
15
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

add category hints from methodlist

This commit is contained in:
dcore94 2023-04-06 16:41:10 +02:00
parent 90a62f83d2
commit 92709607fc
1 changed files with 54 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
ccp/js/methodeditorcontroller.js
View File

@ -103,6 +103,18 @@ class CCPMethodEditorController extends HTMLElement{
color: #0099CC;
border: solid 1px #0099CC;
}
li.category_list_item{
display: inline-block;
padding: 0.25em 0.4em;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: 0.25rem;
background-color: #eeffff;
color: #0099CC;
border: solid 1px #0099CC;
}
</style>
`
#erase_icon = `
@ -498,16 +510,6 @@ class CCPMethodEditorController extends HTMLElement{
this.#rootdoc.querySelector("span[name=header]").innerText = this.#current.title
})
this.#rootdoc.querySelector("input[name=category]").addEventListener("input", ev=>{
const category = ev.currentTarget.value ? ev.currentTarget.value : "Uncategorized"
const fields = this.#current.metadata.filter(md=>md.role === "category")
if(fields.length === 0){
this.#current.metadata.push({ "role" : "category", "title" : category})
}else{
fields[0].title = category
}
})
this.#rootdoc.querySelector("input[name=version]").addEventListener("input", ev=>{
this.#current.version = ev.currentTarget.value
})
@ -578,6 +580,29 @@ class CCPMethodEditorController extends HTMLElement{
}
})
this.#rootdoc.querySelector("input[name=category-input]").addEventListener("keypress", ev=>{
if(ev.key === "Enter" || ev.which === 13){
ev.preventDefault()
ev.stopPropagation()
const val = ev.target.value
ev.target.value = null
if(this.#current.metadata.filter().length === 0){
this.#current.metadata.push({ role : "category", title : val})
}
}
})
this.#rootdoc.querySelector("div[name=keyword-list]").addEventListener("click", ev=>{
ev.preventDefault()
ev.stopPropagation()
if(ev.target.getAttribute('name') === "delete-category"){
const index = ev.target.getAttribute("data-index")
this.#current.metadata.filter(md=>md.role === "category").splice(index, 1)
this.reRenderCategories()
this.#rootdoc.querySelector("input[name=category-input]").focus()
}
})
this.#rootdoc.querySelector("div[name=infrastructures]").addEventListener("change", ev=>{
if(ev.target.getAttribute("name") === "infrastructure-input" && ev.target.value){
ev.preventDefault()
@ -770,16 +795,6 @@ class CCPMethodEditorController extends HTMLElement{
`
}
renderCategories(){
return `
<ul class="category_list">
${ this.#current.metadata.
filter(md=>md.role === "category").
map(c=>`<li class="category_list_item" title="${c.title}">${c.title}</li>`).join("") }
</ul>
`
}
renderContexts(){
return `
<ul class="context_list">
@ -854,6 +869,25 @@ class CCPMethodEditorController extends HTMLElement{
}
}
reRenderKeywords(){
this.#rootdoc.querySelector("div[name=category-list]").innerHTML = this.renderCategories()
}
renderCategories(){
if(this.#current.keywords){
return this.#current.metadata.filter(md=>md.role === "category").map((k,i) => {
return `
<div class="ccp-option badge ccp-category" title="${k}" alt="${k}">
<span>${k}</span>
<span class="btn text-danger ccp-toolbar-button" name="delete-category" data-index="${i}">x</span>
</div>
`
}).join("\n")
}else{
return ""
}
}
reRenderInfrastructures(){
this.#rootdoc.querySelector("select[name=infrastructure-input]").innerHTML = this.renderInfrastructureOptions()
this.#rootdoc.querySelector("div[name=infrastructure-list]").innerHTML = this.renderInfrastructures()