Add text font retrieval and mockup text drawing in BesService
This commit is contained in:
parent
a5db3099c6
commit
f695f4b150
15
service.js
15
service.js
@ -57,6 +57,7 @@ class BesService {
|
||||
this.hostElement.setAttribute('data-gramm', 'false')
|
||||
this.hostElement.setAttribute('data-gramm_editor', 'false')
|
||||
this.hostElement.setAttribute('data-enable-grammarly', 'false')
|
||||
this.textFont = window.getComputedStyle(this.textElement).fontFamily
|
||||
|
||||
this.onScroll = this.onScroll.bind(this)
|
||||
this.hostElement.addEventListener('scroll', this.onScroll)
|
||||
@ -340,6 +341,13 @@ class BesService {
|
||||
const width = rect.width * dpr
|
||||
const height = rect.height * dpr
|
||||
|
||||
// MOCKUP text drawing
|
||||
this.ctx.font = `5px ${this.textFont}` // Font se lahko doda na sledeč način: `25px 'Times New Roman', serif`
|
||||
const text = 'To je izmišljeno besedilo'
|
||||
const textLength = this.ctx.measureText(text)
|
||||
console.log(`Dolžina texta: ${textLength.width}px`) // Dolžina texta
|
||||
this.ctx.fillText(text, x, y)
|
||||
|
||||
// Draw the underline
|
||||
this.ctx.beginPath()
|
||||
this.ctx.moveTo(x, y + height)
|
||||
@ -459,12 +467,7 @@ class BesService {
|
||||
* @param {*} match Grammar checking rule match
|
||||
*/
|
||||
highlightMistake(match) {
|
||||
// document.querySelectorAll('.bes-mistake-highlight-selected').forEach(el => {
|
||||
// el.classList.remove('bes-mistake-highlight-selected')
|
||||
// })
|
||||
// match.highlights.forEach(h =>
|
||||
// h.classList.add('bes-mistake-highlight-selected')
|
||||
// )
|
||||
console.log(match)
|
||||
}
|
||||
|
||||
/**
|
||||
|
Loading…
x
Reference in New Issue
Block a user