import Consumer from '../consumer'
/**
* Display the form to create or edit consumer component.
*
* @param {Consumer} consumer - Consumer object
*/
const displayConsumer = (consumer) => {
document.querySelector('#deleteConsumerForm').classList.add('hidden')
document.querySelector('#consumerPanel').classList.add('panel-wrap-out')
document.querySelector('#consumerIdField').value = ''
document.querySelector('#consumerNameField').value = ''
document.querySelector('#consumerConsumesFrom').innerHTML = ''
const queues = window.scene.getObjectsInScene('Queue')
const selectSource = document.querySelector('#consumerConsumesFromSelect')
selectSource.options.length = 0
selectSource.options[selectSource.options.length] = new Option('---', 0)
Object.keys(queues).forEach((queue) => {
if (consumer && consumer.queues) {
const presentQueue = consumer.queues.findIndex(
(s) => s.id === queues[queue].id
)
if (presentQueue === -1) {
selectSource.options[selectSource.options.length] = new Option(
queues[queue].name,
queues[queue].id
)
}
} else {
selectSource.options[selectSource.options.length] = new Option(
queues[queue].name,
queues[queue].id
)
}
})
if (consumer) {
document.querySelector('#deleteConsumerForm').classList.remove('hidden')
document.querySelector('#consumerIdField').value = consumer.id
document.querySelector('#consumerNameField').value = consumer.name
const modes = document.getElementsByName('consumerMode')
modes.forEach((val) => {
if (consumer.mode === val.value) {
val.checked = true
}
})
let queuesDom = ''
consumer.queues.forEach((queue) => {
queuesDom += `<div id="${queue.id}" class="row">`
queuesDom += `<input type="hidden" name="consumerQueues[]" value="${queue.id}">`
queuesDom += `<div class="flex-left">${queue.name}</div>`
queuesDom += `<div class="flex-right"><a href="#" data-id="${queue.id}" class="queueDeleteLink">×</a></div>`
queuesDom += '</div>'
})
document.querySelector('#consumerConsumesFrom').innerHTML = queuesDom
document.querySelectorAll('.queueDeleteLink').forEach((item) => {
item.addEventListener('click', (e) => {
e.preventDefault()
e.stopPropagation()
e.target.parentNode.parentNode.remove()
})
})
}
}
/**
* Reset form values and remove CSS class from the consumer panel.
*
* @param {object} e - Event object
*/
const hideConsumer = (e) => {
e.preventDefault()
e.stopPropagation()
const settingsParams = ['#consumerIdField', '#consumerNameField']
settingsParams.forEach((p) => {
document.querySelector(p).value = ''
})
document.querySelector('#consumerPanel').classList.remove('panel-wrap-out')
}
/**
* Sends the form to create or edit a consumer component.
* @param {object} e - Event object
*/
const sendConsumerForm = (e) => {
e.preventDefault()
e.stopPropagation()
const id = document.querySelector('#consumerIdField').value
const name = document.querySelector('#consumerNameField').value
const modes = document.getElementsByName('consumerMode')
const consumesFrom = document.querySelector(
'#consumerConsumesFromSelect'
).value
let mode
modes.forEach((val) => {
if (val.checked) {
mode = val.value
}
})
if (id) {
const consumer = window.scene.getIdInScene(id)
const queues = document.getElementsByName('consumerQueues[]')
const idsToKeep = []
queues.forEach((queue) => {
idsToKeep.push(queue.value)
})
const restQueues = consumer.queues.filter(
(s) => idsToKeep.indexOf(s.id) !== -1
)
const removeQueues = consumer.queues.filter(
(s) => idsToKeep.indexOf(s.id) === -1
)
removeQueues.forEach((rmQueue) => {
const actor = window.scene.getIdInScene(rmQueue.id)
actor.removeConsumer(consumer)
})
consumer.name = name
consumer.mode = mode
consumer.queues = restQueues
if (consumesFrom !== '0') {
consumer.addQueue(window.scene.getIdInScene(consumesFrom))
}
} else {
const Consumer1 = new Consumer(800, 30, name, [])
Consumer1.addToScene(window.scene)
if (consumesFrom !== '0') {
Consumer1.addQueue(window.scene.getIdInScene(consumesFrom))
}
}
window.scene.render()
document.querySelector('#consumerIdField').value = ''
document.querySelector('#consumerNameField').value = ''
document.querySelector('#consumerPanel').classList.remove('panel-wrap-out')
}
/**
* Remove consumer from the scene, render and remove CSS class from the consumer panel.
*
* @param {object} e - Event object
*/
const deleteConsumerForm = (e) => {
e.preventDefault()
e.stopPropagation()
const consumer = window.scene.getIdInScene(
document.querySelector('#consumerIdField').value
)
consumer.queues.forEach((rmQueue) => {
const actor = window.scene.getIdInScene(rmQueue.id)
actor.removeConsumer(consumer)
})
window.scene.removeActor(consumer)
window.scene.render()
document.querySelector('#consumerPanel').classList.remove('panel-wrap-out')
}
export { displayConsumer, sendConsumerForm, hideConsumer, deleteConsumerForm }