32 lines
1.0 KiB
JavaScript
32 lines
1.0 KiB
JavaScript
|
import { Controller } from "@hotwired/stimulus"
|
||
|
|
|
||
|
|
export default class extends Controller {
|
||
|
|
static values = {
|
||
|
|
formColor: { type: Array, default: [] } // Declares 'items' as an Array value
|
||
|
|
}
|
||
|
|
static targets = ["template", "container", "networkLogo", "button"]
|
||
|
|
|
||
|
|
add(event) {
|
||
|
|
event.preventDefault()
|
||
|
|
event.stopPropagation()
|
||
|
|
|
||
|
|
const content = this.#updateTemplateNetwork()
|
||
|
|
|
||
|
|
this.buttonTarget.insertAdjacentHTML('beforebegin', content);
|
||
|
|
// this.containerTarget.insertAdjacentHTML("beforeend", content)
|
||
|
|
}
|
||
|
|
|
||
|
|
#updateTemplateNetwork() {
|
||
|
|
const nextIndex = this.networkLogoTargets.length
|
||
|
|
const num_of_colors = this.formColorValue.length
|
||
|
|
let colorIndex = 0
|
||
|
|
if (nextIndex != 0) {
|
||
|
|
colorIndex = nextIndex % num_of_colors
|
||
|
|
}
|
||
|
|
const newColor = this.formColorValue[colorIndex]
|
||
|
|
return this.templateTarget.innerHTML
|
||
|
|
.replace(/NEW_RECORD/g, nextIndex)
|
||
|
|
.replace(/NEXT_COLOR/g, newColor)
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|