diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..722d5e7 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.vscode diff --git a/index.html b/index.html index 98aaff7..2215911 100644 --- a/index.html +++ b/index.html @@ -6,9 +6,11 @@ Editor + -
+
Tukaj vpišite besedilo ki ga želite popraviti.
+ diff --git a/online-editor.js b/online-editor.js index 54b9881..ced3bc1 100644 --- a/online-editor.js +++ b/online-editor.js @@ -3,6 +3,10 @@ window.onload = () => { btnCheck.addEventListener('click', checkText) const textArea = document.getElementById('besana-editor') + textArea.addEventListener('click', e => { + handleClick(e) + }) + let timerId = null // textArea.addEventListener('focus', () => { @@ -15,46 +19,30 @@ window.onload = () => { // }) } +function handleClick(e) { + switch (e.target) { + case e.target.closest('span'): + const clicked = e.target.closest('span') + const infoText = clicked?.dataset.info + const myComponent = document.querySelector('my-component') + myComponent.setAttribute('my-attribute', infoText) + console.log(clicked) + break + } +} + function checkText() { const textArea = document.getElementById('besana-editor') const textAreaContent = textArea?.innerHTML const text = createFirstParagraph(textAreaContent) const paragraphs = separateParagraphs(text) - const modifiedParagraphs = paragraphs.map(paragraph => - mockSpellChecker(paragraph) + const modifiedParagraphs = paragraphs.map( + async paragraph => await ajaxCheck(paragraph) ) console.log(modifiedParagraphs) textArea.innerHTML = modifiedParagraphs.join('') } -function separateParagraphs(text) { - let paragraphs = text.match(/
.*?<\/div>/g) - return paragraphs -} - -function mockSpellChecker(text) { - const specificWords = ['Tole', 'nov', 'test'] - const words = text.split(/(?=<)|(?<=\>)|\s/g).filter(word => word !== '') - const modifiedWords = words.map(word => { - const wordWithoutTags = word.replace(/<[^>]*>/g, '') - if (specificWords.includes(wordWithoutTags)) { - return `${word}` - } - return word - }) - - // This is necessary to remove spaces between opening and closing tags - // TODO: improve this or find a better way to do it - return modifiedWords - .map((word, index) => { - if (index === 0 || index === 1 || index === modifiedWords.length - 1) { - return word - } - return ' ' + word - }) - .join('') -} - function createFirstParagraph(text) { const divRegex = /]*>/i const firstDiv = text.match(divRegex) @@ -64,3 +52,66 @@ function createFirstParagraph(text) { const newText = firstParagraph + text.slice(firstDiv.index) return newText } + +function separateParagraphs(text) { + let paragraphs = text.match(/
.*?<\/div>/g) + return paragraphs +} + +async function ajaxCheck(paragraph) { + const url = 'http://localhost:225/api/v2/check' + const data = { + format: 'html', + text: paragraph, + language: 'sl', + level: 'picky' + } + + const formData = new URLSearchParams(data) + const request = new Request(url, { + method: 'POST', + headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, + body: formData + }) + fetch(request) + .then(response => { + console.log(response.status, response.statusText) + if (!response.ok) { + throw new Error('Network response was not ok') + } + console.log(response) + return response.json() + }) + .catch(error => { + console.error( + 'Napaka pri pošiljanju zahteve za preverjanje besedila', + error + ) + }) +} + +function renderMistakes(matches, paragraph) {} + +// //TODO: Popravi dodajanje presledkov +// function mockSpellChecker(text) { +// const specificWords = ['Tole', 'nov', 'test'] +// const words = text.split(/(?=<)|(?<=\>)|\s/g).filter(word => word !== '') +// const modifiedWords = words.map(word => { +// const wordWithoutTags = word.replace(/<[^>]*>/g, '') +// if (specificWords.includes(wordWithoutTags)) { +// return `${word}` +// } +// return word +// }) + +// // This is necessary to remove spaces between opening and closing tags +// // TODO: improve this or find a better way to do it +// return modifiedWords +// .map((word, index) => { +// if (index === 0 || index === 1 || index === modifiedWords.length - 1) { +// return word +// } +// return ' ' + word +// }) +// .join('') +// } diff --git a/popup.js b/popup.js new file mode 100644 index 0000000..b2d5dbc --- /dev/null +++ b/popup.js @@ -0,0 +1,16 @@ +class MyComponent extends HTMLElement { + static get observedAttributes() { + return ['my-attribute'] + } + + attributeChangedCallback(name, oldValue, newValue) { + if (name === 'my-attribute') { + console.log( + `Value of my-attribute changed from ${oldValue} to ${newValue}` + ) + // You can perform some action based on the new value here + } + } +} + +customElements.define('my-component', MyComponent) diff --git a/styles.css b/styles.css index 26da519..aa71a1f 100644 --- a/styles.css +++ b/styles.css @@ -10,6 +10,7 @@ line-height: 1.6; white-space: pre-wrap; overflow-y: auto; + font-family: Arial, Helvetica, sans-serif; } /* Mistake types styles */