From 4e64180cb3397310ef0a4b2b7ce3529cd7a4e9d5 Mon Sep 17 00:00:00 2001 From: mrfry Date: Sun, 22 Nov 2020 12:54:13 +0100 Subject: [PATCH] Image handling in messages --- stable.user.js | 151 +++++++++++++++++++++++++++++++++---------------- 1 file changed, 103 insertions(+), 48 deletions(-) diff --git a/stable.user.js b/stable.user.js index 33a5614..628ae4b 100755 --- a/stable.user.js +++ b/stable.user.js @@ -199,7 +199,7 @@ resolve({ type: 'img', val: res, - node: elem, + node: img, }) }) }) @@ -229,34 +229,34 @@ function getImagesFromElements(elements) { return elements.reduce((acc, element) => { if (element.type === 'img') { - acc.push(element.val) + // FIXME: include check needed? + if (!acc.includes(element.val)) { + acc.push({ val: element.val, node: element.node }) + } } return acc }, []) } - function oldGetImageFormResult(img) { + function getLegacyImageID(imgArray) { + // TODO: legacy image ids go into question.images, next to 'val' and 'elem' try { - var imgURL = [] - for (var j = 0; j < img.length; j++) { - if (!img[j].src.includes('brokenfile')) { - var filePart = img[j].src.split('/') + return imgArray.map(img => { + if (!img.src.includes('brokenfile')) { + let filePart = img.src.split('/') filePart = filePart[filePart.length - 1] // shorten string - var result = '' - var i = 0 + let result = '' + let i = 0 while (i < filePart.length && i < 30) { result += filePart[i] i++ } - imgURL.push(decodeURI(result)) + return decodeURI(result) } - } - if (imgURL.length > 0) { - return imgURL - } + }) } catch (e) { log("Couldn't get images from result (old)") } @@ -308,20 +308,21 @@ data: question.data, subj: getCurrentSubjectName(), } - promises.push(GetXHRQuestionAnswer(questionObj)) + promises.push( + new Promise(resolve => { + GetXHRQuestionAnswer(questionObj).then(res => { + resolve({ + answers: res, + question: question, + }) + }) + }) + ) }) - Promise.all(promises).then(result => { - const answers = result.reduce((acc, res) => { - const prepared = PrepareAnswers(res) - if (prepared) { - acc.push(prepared) - } - return acc - }, []) - + Promise.all(promises).then(results => { removeLoadingMessage() - ShowAnswers(answers) + ShowAnswers(results) }) }) .catch(err => { @@ -397,6 +398,23 @@ } } + function getImgNodesFromArray(arr) { + return arr.reduce((acc, x) => { + if (Array.isArray(x)) { + x.forEach(y => { + if (y.type === 'img') { + acc.push(y.node) + } + }) + } else { + if (x.type === 'img') { + acc.push(x.node) + } + } + return acc + }, []) + } + function getQuestionPromiseForSingleQuestion(node) { return new Promise(resolve => { try { @@ -430,8 +448,15 @@ return [...acc, ...x] }, []), ]) - images = uniq(images) - const data = getDataFromTest(images, possibleAnswerArray) + const imageNodes = getImgNodesFromArray([ + ...question, + ...possibleAnswerArray, + ]) + const data = getDataFromTest( + images, + possibleAnswerArray, + getLegacyImageID(imageNodes) + ) resolve({ question: questionText, @@ -454,15 +479,22 @@ }) } - function getDataFromTest(images) { - if (images.length > 0) { + function getDataFromTest(hashedImages, possibleAnswers, legacyImages) { + if (hashedImages.length > 0) { return { type: 'image', - images: images, + possibleAnswers, + images: hashedImages.map(x => { + return x.val + }), + // TODO + // images: legacyImages, + hashedImages: hashedImages, } } else { return { type: 'simple', + possibleAnswers, } } } @@ -864,8 +896,9 @@ function appendBelowElement(el, toAppend) { const rect = el.getBoundingClientRect() - const left = rect.left + window.scrollX - const top = rect.top + window.scrollY + const correction = 8 + const left = rect.left + window.scrollX - correction + const top = rect.top + window.scrollY - correction SetStyle(toAppend, { position: 'absolute', @@ -1189,33 +1222,56 @@ // : Answering stuffs {{{ function PrepareAnswers(result) { - if (result.length > 0) { - return result.map(res => { - let msg = res.q.Q + '\n' + const { answers, question } = result + if (answers.length > 0) { + return answers.map(answer => { + const { Q, A, data } = answer.q + let msg = Q + '\n' + A - msg += res.q.A - - if (res.q.data.type === 'image') { - msg += - '\n\nKépek fenti válaszok sorrendjében: ' + - res.q.data.images.join(', ') // if it has image part, adding that too + // TODO: show 'képek sorrendben' if there are no new kind of image ids + if (data.type === 'image') { + question.images.forEach((img, i) => { + const regex = new RegExp(`\\[${img.val}\\]`, 'g') + msg = msg.replace(regex, '[' + i.toString() + ']') + }) } return { m: msg, - p: res.match, - header: res.detailedMatch.matchedSubjName, + p: answer.match, + header: answer.detailedMatch.matchedSubjName, } }) } } - function ShowAnswers(answers) { - assert(answers) + function addImageIdsToImageNodes(imgs) { + imgs.images.forEach((img, i) => { + const text = document.createElement('div') + text.innerText = `[${i}]` + SetStyle(text, { + backgroundColor: '#333', + borderRadius: '5px', + color: 'white', + opacity: 0.7, + fontSize: '13px', + }) + appendBelowElement(img.node, text) + }) + } + + function ShowAnswers(results) { + const answers = results.reduce((acc, res) => { + const prepared = PrepareAnswers(res) + addImageIdsToImageNodes(res.question) + if (prepared) { + acc.push(prepared) + } + return acc + }, []) // TODO: show which image belongs to which text - console.log(answers) if (answers.length > 0) { ShowMessage(answers) } else { @@ -1458,8 +1514,7 @@ var mainDiv = document.createElement('div') // the main divider, wich items will be attached to mainDiv.setAttribute('id', 'messageMainDiv') if (funct) { - // if there is a function as parameter - addEventListener(mainDiv, 'click', funct) // adding it as click + addEventListener(mainDiv, 'click', funct) } // lotsa crap style SetStyle(mainDiv, {