141 lines
3.9 KiB
JavaScript
141 lines
3.9 KiB
JavaScript
/**
|
|
* Class to receive grammar checking service notification
|
|
*
|
|
* This implementation handles the status icon in the lower-right corner of the host element.
|
|
*/
|
|
class BesStatusIconEventSink {
|
|
/**
|
|
* Called when grammar checking service is registered
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
register(service) {
|
|
this.statusDiv = document.createElement('div')
|
|
this.statusDiv.classList.add('bes-status-div')
|
|
this.statusIcon = document.createElement('div')
|
|
this.statusIcon.classList.add('bes-status-icon')
|
|
this.statusDiv.appendChild(this.statusIcon)
|
|
this.setStatusDivPosition(service)
|
|
service.textElement.parentNode.insertBefore(
|
|
this.statusDiv,
|
|
service.textElement.nextSibling
|
|
)
|
|
}
|
|
|
|
/**
|
|
* Called when grammar checking service is unregistered
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
unregister(service) {
|
|
this.statusDiv.remove()
|
|
this.statusIcon.remove()
|
|
}
|
|
|
|
/**
|
|
* Called to report repositioning
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
reposition(service) {
|
|
this.setStatusDivPosition(service)
|
|
}
|
|
|
|
/**
|
|
* Called to report resizing
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
resize(service) {
|
|
this.setStatusDivPosition(service)
|
|
}
|
|
|
|
/**
|
|
* Repositions status DIV element.
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
setStatusDivPosition(service) {
|
|
const rect = service.textElement.getBoundingClientRect()
|
|
const scrollbarWidth =
|
|
service.textElement.offsetWidth - service.textElement.clientWidth
|
|
this.statusDiv.style.left = `${rect.right - 40 - scrollbarWidth + window.scrollX}px`
|
|
const scrollbarHeight =
|
|
service.textElement.offsetHeight - service.textElement.clientHeight
|
|
this.statusDiv.style.top = `${rect.bottom - 30 - scrollbarHeight + window.scrollY}px`
|
|
}
|
|
|
|
/**
|
|
* Called to report grammar proofing started
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
startProofing(service) {
|
|
this.updateStatusIcon('bes-status-loading', 'Besana preverja pravopis.')
|
|
}
|
|
|
|
/**
|
|
* Called to report grammar-checking failed (as 500 Internal server error, timeout, etc.)
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
* @param {Response} response HTTP response
|
|
*/
|
|
failedProofing(service, response) {
|
|
this.updateStatusIcon(
|
|
'bes-status-error',
|
|
`Pri preverjanju pravopisa je prišlo do napake ${response.status} ${response.statusText}.`
|
|
)
|
|
}
|
|
|
|
/**
|
|
* Called to report grammar-checking run is ended
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
endProofing(service) {
|
|
if (service.proofingError) {
|
|
this.updateStatusIcon(
|
|
'bes-status-error',
|
|
`Pri obdelavi odgovora pravopisnega strežnika je prišlo do napake: ${service.proofingError}`
|
|
)
|
|
} else if (service.proofingMatches > 0)
|
|
this.updateStatusIcon(
|
|
'bes-status-mistakes',
|
|
`Število napak: ${service.proofingMatches}`
|
|
)
|
|
else this.updateStatusIcon('bes-status-success', 'V besedilu ni napak.')
|
|
}
|
|
|
|
/**
|
|
* Sets status icon style and title.
|
|
*
|
|
* @param {String} status CSS class name to set status icon to
|
|
* @param {String} title Title of the status icon
|
|
*/
|
|
updateStatusIcon(status, title) {
|
|
const statuses = [
|
|
'bes-status-loading',
|
|
'bes-status-success',
|
|
'bes-status-mistakes',
|
|
'bes-status-error'
|
|
]
|
|
statuses.forEach(statusClass => {
|
|
this.statusIcon.classList.remove(statusClass)
|
|
})
|
|
this.statusIcon.classList.add(status)
|
|
this.statusDiv.title = title
|
|
}
|
|
}
|
|
|
|
class BesCKStatusIconEventSink extends BesStatusIconEventSink {
|
|
/**
|
|
* Repositions status DIV element.
|
|
*
|
|
* @param {BesService} service Grammar checking service
|
|
*/
|
|
setStatusDivPosition(service) {
|
|
this.statusDiv.style.right = `10px`
|
|
this.statusDiv.style.bottom = `10px`
|
|
}
|
|
}
|