mirror of
https://gitlab.com/MrFry/moodle-test-userscript
synced 2025-04-01 20:22:48 +02:00
Menu item children click fix, style setting refactor
This commit is contained in:
MrFry
parent
5379365fdc
commit
5773a950f5
1 changed files with 111 additions and 95 deletions
204
stable.user.js
204
stable.user.js
|
|
@ -58,8 +58,8 @@
|
|||
|
||||
var data // all data, which is in the resource txt
|
||||
var addEventListener // add event listener function
|
||||
// const serverAdress = 'https://qmining.frylabs.net/'
|
||||
const serverAdress = 'http://localhost:8080/'
|
||||
const serverAdress = 'https://qmining.frylabs.net/'
|
||||
// const serverAdress = 'http://localhost:8080/'
|
||||
|
||||
// forcing pages for testing. unless you test, do not set these to true!
|
||||
// only one of these should be true for testing
|
||||
|
|
@ -92,7 +92,8 @@
|
|||
close: 'Bezárás',
|
||||
help: 'Help',
|
||||
websiteBugreport: 'Weboldal / Bug report',
|
||||
donate: 'Donate'
|
||||
donate: 'Donate',
|
||||
search: 'Keresés ...'
|
||||
}
|
||||
|
||||
var texts = huTexts
|
||||
|
|
@ -1704,19 +1705,20 @@
|
|||
addEventListener(mainDiv, 'click', funct) // adding it as click
|
||||
}
|
||||
// lotsa crap style
|
||||
mainDiv.style.position = 'fixed'
|
||||
mainDiv.style.zIndex = 999999
|
||||
mainDiv.style.textAlign = 'center'
|
||||
mainDiv.style.width = width + 'px'
|
||||
// mainDiv.style.height = height + 'px';
|
||||
mainDiv.style.padding = '0px'
|
||||
mainDiv.style.background = '#222d32' // background color
|
||||
mainDiv.style.color = '#ffffff' // text color
|
||||
mainDiv.style.borderColor = '#035a8f' // border color
|
||||
mainDiv.style.border = 'none'
|
||||
mainDiv.style.top = (startFromTop) + 'px'
|
||||
mainDiv.style.left = (window.innerWidth - width) / 2 + 'px'
|
||||
mainDiv.style.opacity = '0.9' // setting starting opacity
|
||||
SetStyle(mainDiv, {
|
||||
position: 'fixed',
|
||||
zIndex: 999999,
|
||||
textAlign: 'center',
|
||||
width: width + 'px',
|
||||
padding: '0px',
|
||||
background: '#222d32',
|
||||
color: '#ffffff',
|
||||
borderColor: '#035a8f',
|
||||
border: 'none',
|
||||
top: (startFromTop) + 'px',
|
||||
left: (window.innerWidth - width) / 2 + 'px',
|
||||
opacity: '0.9'
|
||||
})
|
||||
mainDiv.setAttribute('id', 'scriptMessage')
|
||||
var matchPercent = msgItem[0][0].p
|
||||
if (isSimpleMessage) {
|
||||
|
|
@ -1891,30 +1893,30 @@
|
|||
// mainDiv.style.left = (window.innerWidth - width) / 2 + 'px';
|
||||
|
||||
var menuButtonDiv = document.createElement('div')
|
||||
menuButtonDiv.style.width = buttonWidth + 'px'
|
||||
menuButtonDiv.style.height = buttonHeight + 'px'
|
||||
menuButtonDiv.style.top = (window.innerHeight - buttonHeight * 1.5) + 'px'
|
||||
menuButtonDiv.style.left = window.innerWidth - buttonWidth * 1.5 + 'px'
|
||||
menuButtonDiv.style.zIndex = 999999 // TO THE MAX
|
||||
menuButtonDiv.style.position = 'fixed'
|
||||
// menuButtonDiv.style.borderStyle = "solid";
|
||||
// menuButtonDiv.style.borderWidth = "1px";
|
||||
|
||||
// design
|
||||
menuButtonDiv.style.textAlign = 'center'
|
||||
menuButtonDiv.style.padding = '0px'
|
||||
menuButtonDiv.style.margin = '0px'
|
||||
menuButtonDiv.style.background = 'transparent' // background color
|
||||
SetStyle(menuButtonDiv, {
|
||||
width: buttonWidth + 'px',
|
||||
height: buttonHeight + 'px',
|
||||
top: (window.innerHeight - buttonHeight * 1.5) + 'px',
|
||||
left: window.innerWidth - buttonWidth * 1.5 + 'px',
|
||||
zIndex: 999999,
|
||||
position: 'fixed',
|
||||
textAlign: 'center',
|
||||
padding: '0px',
|
||||
margin: '0px',
|
||||
background: 'transparent'
|
||||
})
|
||||
|
||||
// menu text
|
||||
// var menuTextBox = CreateNodeWithText(menuButtonDiv, "Kérdések\nMenü");
|
||||
|
||||
var menuButton = CreateNodeWithText(menuButtonDiv, texts.menuButtonText, 'button')
|
||||
menuButton.style.width = buttonWidth + 'px'
|
||||
menuButton.style.border = 'none'
|
||||
menuButton.style.height = buttonHeight - 20 + 'px'
|
||||
menuButton.style.background = '#222d32' // background color
|
||||
menuButton.style.color = '#ffffff' // background color
|
||||
SetStyle(menuButton, {
|
||||
width: buttonWidth + 'px',
|
||||
border: 'none',
|
||||
height: buttonHeight - 20 + 'px',
|
||||
background: '#222d32',
|
||||
color: '#ffffff'
|
||||
})
|
||||
menuButton.setAttribute('id', 'HelperMenuButton')
|
||||
|
||||
menuButton.addEventListener('click', function () {
|
||||
|
|
@ -1927,12 +1929,14 @@
|
|||
|
||||
// passive mode stuff
|
||||
var questionsTickBox = document.createElement('input')
|
||||
SetStyle(questionsTickBox, {
|
||||
position: '',
|
||||
left: 10 + 'px',
|
||||
margin: '5px 5px 5px 5px',
|
||||
top: 0 + 'px'
|
||||
})
|
||||
questionsTickBox.type = 'checkbox'
|
||||
questionsTickBox.checked = getVal('skipLoad')
|
||||
questionsTickBox.style.position = ''
|
||||
questionsTickBox.style.left = 10 + 'px'
|
||||
questionsTickBox.style.margin = '5px 5px 5px 5px' // fancy margin
|
||||
questionsTickBox.style.top = 0 + 'px'
|
||||
|
||||
menuButtonDiv.appendChild(questionsTickBox) // adding to main div
|
||||
|
||||
|
|
@ -1971,21 +1975,21 @@
|
|||
var appedtTo = document.body // will be appended here
|
||||
|
||||
var menuDiv = document.createElement('div')
|
||||
SetStyle(menuDiv, {
|
||||
width: (window.innerWidth / 2) + 'px',
|
||||
top: (window.innerHeight / 10) + 'px',
|
||||
left: window.innerWidth / 2 - (window.innerWidth / 2) / 2 + 'px',
|
||||
zIndex: 999999,
|
||||
position: 'fixed',
|
||||
textAlign: 'center',
|
||||
padding: '0px',
|
||||
background: '#222d32',
|
||||
color: '#ffffff',
|
||||
borderColor: '#035a8f',
|
||||
border: 'none',
|
||||
opacity: '1'
|
||||
})
|
||||
menuDiv.setAttribute('id', 'HelperMenu')
|
||||
menuDiv.style.width = (window.innerWidth / 2) + 'px'
|
||||
menuDiv.style.top = (window.innerHeight / 10) + 'px'
|
||||
menuDiv.style.left = window.innerWidth / 2 - (window.innerWidth / 2) / 2 + 'px'
|
||||
menuDiv.style.zIndex = 999999
|
||||
menuDiv.style.position = 'fixed'
|
||||
|
||||
// design
|
||||
menuDiv.style.textAlign = 'center'
|
||||
menuDiv.style.padding = '0px'
|
||||
menuDiv.style.background = '#222d32' // background color
|
||||
menuDiv.style.color = '#ffffff' // text color
|
||||
menuDiv.style.borderColor = '#035a8f' // border color
|
||||
menuDiv.style.border = 'none'
|
||||
menuDiv.style.opacity = '1' // setting starting opacity
|
||||
|
||||
var fiveMargin = '5px 5px 5px 5px'
|
||||
var tbl = document.createElement('table')
|
||||
|
|
@ -1995,9 +1999,11 @@
|
|||
|
||||
// adding headers ---------------------------------------------------------------------------------------------------------------
|
||||
var subjTable = document.createElement('div')
|
||||
subjTable.style.margin = fiveMargin
|
||||
subjTable.style.textAlign = 'left'
|
||||
subjTable.style.width = '98%'
|
||||
SetStyle(subjTable, {
|
||||
margin: fiveMargin,
|
||||
textAlign: 'left',
|
||||
width: '98%'
|
||||
})
|
||||
|
||||
if (data && data.length > 0) {
|
||||
let grouped = data.Subjects.reduce((res, s) => {
|
||||
|
|
@ -2026,9 +2032,13 @@
|
|||
|
||||
// --------------------------------------------------------------------------------
|
||||
let searchBar = CreateNodeWithText(subjTable, '', 'input')
|
||||
searchBar.style.backgroundColor = '#222d32'
|
||||
searchBar.style.color = '#ffffff'
|
||||
searchBar.style.width = '100%'
|
||||
SetStyle(searchBar, {
|
||||
backgroundColor: '#222d32',
|
||||
color: '#ffffff',
|
||||
width: '100%',
|
||||
border: 'none'
|
||||
})
|
||||
searchBar.placeholder = texts.search
|
||||
searchBar.addEventListener('keyup', function (e) {
|
||||
collapsibles.forEach((x) => {
|
||||
if (x.innerText.toLowerCase().includes(this.value.toLowerCase())) {
|
||||
|
|
@ -2040,25 +2050,33 @@
|
|||
}) // adding click
|
||||
|
||||
Object.entries(grouped).forEach(([subjName, subjGroup], i) => {
|
||||
let b = CreateNodeWithText(subjTable, subjName, 'button')
|
||||
b.style.backgroundColor = '#222d32'
|
||||
b.style.color = '#ffffff'
|
||||
b.style.cursor = 'pointer'
|
||||
b.style.padding = '5px'
|
||||
b.style.width = '100%'
|
||||
b.style.border = 'none'
|
||||
b.style.textAlign = 'left'
|
||||
b.style.outline = 'none'
|
||||
let b = CreateNodeWithText(subjTable, subjName, 'div')
|
||||
SetStyle(b, {
|
||||
backgroundColor: '#222d32',
|
||||
color: '#ffffff',
|
||||
cursor: 'pointer',
|
||||
padding: '5px',
|
||||
width: '100%',
|
||||
border: 'none',
|
||||
textAlign: 'left',
|
||||
outline: 'none'
|
||||
})
|
||||
b.setAttribute('id', 'subjectGroup' + i)
|
||||
collapsibles.push(b)
|
||||
|
||||
let content = document.createElement('div')
|
||||
content.style.padding = '0 18px'
|
||||
content.style.overflow = 'hidden'
|
||||
content.style.backgroundColor = '#222d32'
|
||||
content.style.borderColor = '#212127'
|
||||
content.style.borderStyle = 'solid'
|
||||
content.style.borderWidth = '2px'
|
||||
SetStyle(content, {
|
||||
padding: '0 18px',
|
||||
overflow: 'hidden',
|
||||
backgroundColor: '#222d32',
|
||||
borderColor: '#212127',
|
||||
borderStyle: 'solid',
|
||||
borderWidth: '2px'
|
||||
})
|
||||
content.addEventListener('click', function (e) {
|
||||
e.stopPropagation()
|
||||
})
|
||||
|
||||
let ifGroupActive = subjGroup.some((x) => {
|
||||
return x.getIfActive()
|
||||
})
|
||||
|
|
@ -2066,10 +2084,9 @@
|
|||
|
||||
b.appendChild(content)
|
||||
|
||||
subjGroup.forEach((subj) => {
|
||||
let tbl = document.createElement('table')
|
||||
content.appendChild(tbl)
|
||||
|
||||
subjGroup.forEach((subj) => {
|
||||
var row = tbl.insertRow()
|
||||
let td = row.insertCell()
|
||||
let text = subj.getYear() || subj.Name
|
||||
|
|
@ -2092,7 +2109,7 @@
|
|||
}) // adding click
|
||||
})
|
||||
|
||||
b.addEventListener('click', function () {
|
||||
b.addEventListener('click', function (e) {
|
||||
this.classList.toggle('active')
|
||||
if (content.style.display === 'block') {
|
||||
content.style.display = 'none'
|
||||
|
|
@ -2134,13 +2151,14 @@
|
|||
var splashTickboxCell = splasTickboxRow.insertCell()
|
||||
|
||||
var splashTickBox = document.createElement('input')
|
||||
SetStyle(splashTickBox, {
|
||||
position: '',
|
||||
left: 10 + 'px',
|
||||
margin: '5px 5px 5px 5px',
|
||||
top: menuDiv.offsetHeight + 'px'
|
||||
})
|
||||
splashTickBox.type = 'checkbox'
|
||||
splashTickBox.checked = getVal('showSplash') || false
|
||||
splashTickBox.style.position = ''
|
||||
// splashTickBox.style.background = "white";
|
||||
splashTickBox.style.left = 10 + 'px'
|
||||
splashTickBox.style.margin = '5px 5px 5px 5px' // fancy margin
|
||||
splashTickBox.style.top = menuDiv.offsetHeight + 'px'
|
||||
splashTickboxCell.appendChild(splashTickBox) // adding to main div
|
||||
|
||||
splashTickBox.addEventListener('click', function () {
|
||||
|
|
@ -2166,18 +2184,14 @@
|
|||
}
|
||||
// x button ------------------------------------------------------------------------------------------------------------------------------
|
||||
let xButton = CreateNodeWithText(buttonCell, texts.close, 'button')
|
||||
Object.keys(buttonStyle).sort().forEach((key) => {
|
||||
xButton.style[key] = buttonStyle[key]
|
||||
})
|
||||
SetStyle(xButton, buttonStyle)
|
||||
|
||||
xButton.addEventListener('click', function () {
|
||||
CloseMenu()
|
||||
}) // adding clicktextNode
|
||||
// help button ----------------------------------------------------------------------------------------------------------------
|
||||
let helpButton = CreateNodeWithText(buttonCell, texts.help, 'button')
|
||||
Object.keys(buttonStyle).sort().forEach((key) => {
|
||||
helpButton.style[key] = buttonStyle[key]
|
||||
})
|
||||
SetStyle(helpButton, buttonStyle)
|
||||
|
||||
helpButton.addEventListener('click', function () {
|
||||
ShowHelp()
|
||||
|
|
@ -2186,9 +2200,7 @@
|
|||
// site link ----------------------------------------------------------------------------------------------------------------
|
||||
|
||||
let siteLink = CreateNodeWithText(buttonCell, texts.websiteBugreport, 'button')
|
||||
Object.keys(buttonStyle).sort().forEach((key) => {
|
||||
siteLink.style[key] = buttonStyle[key]
|
||||
})
|
||||
SetStyle(siteLink, buttonStyle)
|
||||
|
||||
siteLink.addEventListener('click', function () {
|
||||
location.href = serverAdress + 'menuClick' // eslint-disable-line
|
||||
|
|
@ -2197,9 +2209,7 @@
|
|||
// donate link ----------------------------------------------------------------------------------------------------------------
|
||||
|
||||
let donateLink = CreateNodeWithText(buttonCell, texts.donate, 'button')
|
||||
Object.keys(buttonStyle).sort().forEach((key) => {
|
||||
donateLink.style[key] = buttonStyle[key]
|
||||
})
|
||||
SetStyle(donateLink, buttonStyle)
|
||||
|
||||
donateLink.addEventListener('click', function () {
|
||||
location.href = serverAdress + 'donate' // eslint-disable-line
|
||||
|
|
@ -2247,6 +2257,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
function SetStyle (target, style) {
|
||||
Object.keys(style).sort().forEach((key) => {
|
||||
target.style[key] = style[key]
|
||||
})
|
||||
}
|
||||
|
||||
function CreateNodeWithText (to, text, type) {
|
||||
var paragraphElement = document.createElement(type || 'p') // new paragraph
|
||||
var textNode = document.createTextNode(text)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue