user interface fixes

stable.user.js

@@ -184,8 +184,6 @@
     fatalError:
       'Fatál error. Check console (f12). Kattints az üzenetre az összes kérdés/válaszért manuális kereséshez! (új böngésző tab-ban)',
     consoleErrorInfo: `Itteni hibák 100% a moodle hiba. Kivéve, ha oda van írva hogy script error ;) Ha ilyesmi szerepel itt, akkor olvasd el a segítség szekciót! ${serverAdress}`,
-    freshStartWarning:
-      '<h1>Moodle teszt userscript:<h1><h3>1.5.0 verzió: a script mostantól XMLHTTP kéréseket küld szerver fele! Erre a userscript futtató kiegészítőd is figyelmeztetni fog! Ha ez történik, a script rendes működése érdekében engedélyezd (Always allow domain)! Ha nem akarod, hogy ez történjen, akkor ne engedélyezd, vagy a menüben válaszd ki a "helyi fájl használata" opciót!</h3> <h3>Elküldött adatok: minden teszt után a kérdés-válasz páros. Fogadott adatok: Az összes eddig ismert kérdés. Érdemes help-et elolvasni!!!</h3><h5>Ez az ablak frissités után eltűnik. Ha nem, akkor a visza gombbal próbálkozz.</h5>',
     noResult:
       'Nincs találat :( Kattints az üzenetre az összes kérdés/válaszért manuális kereséshez! (új böngésző tab-ban)',
     videoHelp: 'Miután elindítottad: Play/pause: space. Seek: Bal/jobb nyíl.',
@@ -201,7 +199,6 @@
     noPeersOnline: 'Egy peer sem elérhető!',
     peerTryingError: 'Hiba peerek keresése közben!',
     pwHere: 'Jelszó ...',
-    noServerConsoleMessage: `Nem elérhető a szerver! Ha elérhető a weboldal, akkor ott meg bírod nézni a kérdéseket itt: ${serverAdress}allQuestions`,
     unhandledErrorConsoleMessage: `Kezeletlen hiba történt! Ha elérhető a weboldal, akkor ott meg bírod nézni a kérdéseket itt: ${serverAdress}allQuestions`,
     noParseableQuestionResult:
       'A tesztben nem találhatók kérdések, amit fel lehet dolgozni, vagy hiba történt feldolgozásuk közben',
@@ -216,6 +213,9 @@
     noHostText: '',
     hostHere: 'Qmining szerver domain-je...',
     invalidDomain: 'Hibás domain!\nHelyes formátum: "qmining.com"',
+    addNewPeer: 'Új hozzáadása...',
+    selectOtherPeer: 'Másik peer...',
+    back: 'Vissza',
   }
 
   var texts = huTexts
@@ -1639,7 +1639,7 @@
     }
 
     if (!serverToUse) {
-      noHostAction()
+      addNewHost()
       return
     }
 
@@ -1650,8 +1650,6 @@
     post('login', { pw: pw, script: true }).then((res) => {
       if (res.result === 'success') {
         ConnectToServer()
-        clearAllMessages()
-        resetMenu()
       } else {
         SafeGetElementById('infoMainDiv', (elem) => {
           elem.innerText = texts.invalidPW + pw
@@ -1660,32 +1658,18 @@
     })
   }
 
-  function resetMenu() {
-    SafeGetElementById('scriptMenuDiv', (elem) => {
-      elem.style.backgroundColor = '#262626'
-    })
-    SafeGetElementById('retryContainer', (elem) => {
-      elem.style.display = 'none'
-    })
-    SafeGetElementById('loginDiv', (elem) => {
-      elem.style.display = 'none'
-    })
-    SafeGetElementById('infoMainDiv', (elem) => {
-      elem.innerText = texts.connecting + getShortServerURL(serverAdress)
-    })
-  }
-
   function ConnectToServer() {
-    console.info('Connecting to:', serverAdress)
     clearAllMessages()
-    SafeGetElementById('peerSelector', (elem) => {
+    resetMenu()
-      elem.style.display = 'none'
-      updatePeerSelector(elem)
-    })
 
     GetXHRInfos()
       .then((inf) => {
         try {
+          addPeerToSavedPeersIfNotExists(serverToUse)
+          SafeGetElementById('peerSelector', (elem) => {
+            updatePeerSelector(elem)
+          })
+
           if (inf.result === 'nouser') {
             NoUserAction()
             return
@@ -1697,9 +1681,9 @@
           }
           subjInfo = inf.subjinfo
           setVal('userId', inf.uid)
-          overlay.querySelector(
+          SafeGetElementById('infoMainDiv', (elem) => {
-            '#infoMainDiv'
+            elem.innerText = `${subjInfo.subjects.toLocaleString()} tárgy, ${subjInfo.questions.toLocaleString()} kérdés`
-          ).innerText = `${subjInfo.subjects.toLocaleString()} tárgy, ${subjInfo.questions.toLocaleString()} kérdés. UID: #${getUid()}`
+          })
 
           getPeers().catch(() => warn('unable to get p2p info'))
           SafeGetElementById('peerSelector', (elem) => {
@@ -1712,7 +1696,6 @@
         }
       })
       .catch((e) => {
-        warn(texts.noServerConsoleMessage)
         warn(e)
         SafeGetElementById('infoMainDiv', (elem) => {
           elem.innerText = texts.noServer
@@ -1780,30 +1763,55 @@
     }
   }
 
-  function connectToPeer(peer) {
+  function addPeerToSavedPeersIfNotExists(peer) {
-    const newPeers = getJSONVal('peers').filter((x) => {
+    const peers = getJSONVal('peers') || []
+    const peerAlreadyExists = peers.find((x) => {
       return getPeerUrl(x) !== getPeerUrl(peer)
     })
-    if (serverToUse) {
+    if (!peerAlreadyExists) {
-      newPeers.push(serverToUse)
+      setVal('peers', JSON.stringify([peer, ...peers]))
     }
-    setVal('peers', JSON.stringify(newPeers))
+  }
-    setVal('serverToUse', JSON.stringify(peer))
-    SafeGetElementById('peerSelector', (elem) => {
-      updatePeerSelector(elem)
-    })
-
-    SafeGetElementById('scriptMenuDiv', (elem) => {
-      elem.style.backgroundColor = '#222426'
-    })
 
+  function connectToPeer(peer) {
     const url = getPeerUrl(peer)
-    serverToUse = peer
     serverAdress = url
     apiAdress = url + 'api/'
+
+    serverToUse = peer
+    setVal('serverToUse', JSON.stringify(peer))
+    p2pInfoExpireTime = 0
+    setVal('lastp2pchecktime', 0)
+    infoExpireTime = 0
+    setVal('lastInfoCheckTime', 0)
+
     ConnectToServer()
   }
 
+  function resetMenu() {
+    SafeGetElementById('scriptMenuDiv', (elem) => {
+      elem.style.backgroundColor = '#262626'
+    })
+    SafeGetElementById('peerSelector', (elem) => {
+      elem.style.display = 'none'
+    })
+    SafeGetElementById('retryContainer', (elem) => {
+      elem.style.display = 'none'
+    })
+    SafeGetElementById('loginDiv', (elem) => {
+      elem.style.display = 'none'
+    })
+    SafeGetElementById('hostInputContainer', (elem) => {
+      elem.style.display = 'none'
+    })
+    SafeGetElementById('buttonContainer', (elem) => {
+      elem.style.display = 'flex'
+    })
+    SafeGetElementById('infoMainDiv', (elem) => {
+      elem.innerText = texts.connecting + getShortServerURL(serverAdress)
+    })
+  }
+
   function connectionErrorAction(infoText) {
     SafeGetElementById('infoMainDiv', (elem) => {
       elem.innerText = infoText || texts.noServer
@@ -1831,12 +1839,9 @@
     })
   }
 
-  function noHostAction() {
+  function addNewHost() {
-    const elementIdsToHide = ['buttonContainer']
+    SafeGetElementById('buttonContainer', (elem) => {
-    elementIdsToHide.forEach((id) => {
+      elem.style.display = 'none'
-      SafeGetElementById(id, (elem) => {
-        elem.style.display = 'none'
-      })
     })
     SafeGetElementById('retryContainer', (elem) => {
       elem.style.display = 'none'
@@ -2628,7 +2633,7 @@
         height: '110px',
         position: 'fixed',
         padding: '3px 0px',
-        bottom: '30px',
+        bottom: '10px',
         left: '10px',
         zIndex: 999999,
         border: '2px solid #f2cb05',
@@ -2664,6 +2669,7 @@
             position: 'absolute',
             display: 'inline',
             right: '0px',
+            top: '0px',
             margin: '5px',
             cursor: 'pointer',
             fontSize: '18px',
@@ -2737,13 +2743,6 @@
                   })
 
                   const peers = getJSONVal('peers')
-                  if (serverToUse) {
-                    peers.push(serverToUse)
-                  }
-
-                  if (peers.length === 1) {
-                    return document.createElement('span')
-                  }
 
                   peers.forEach((peer, i) => {
                     const option = document.createElement('option')
@@ -2752,12 +2751,20 @@
 
                     peerSelector.appendChild(option)
                   })
+                  const newPeerOption = document.createElement('option')
+                  newPeerOption.innerText = texts.addNewPeer
+                  newPeerOption.value = 'new'
+                  peerSelector.appendChild(newPeerOption)
 
                   peerSelector.addEventListener('change', (e) => {
-                    skipAvailablePeerFind = true
+                    const selectedValue = e.target.value
-                    const selectedPeer = peers[e.target.value]
+                    if (selectedValue === 'new') {
-                    connectToPeer(selectedPeer)
+                      addNewHost()
-                    resetMenu()
+                    } else {
+                      skipAvailablePeerFind = true
+                      const selectedPeer = peers[selectedValue]
+                      connectToPeer(selectedPeer)
+                    }
                   })
 
                   updatePeerSelector(peerSelector)
@@ -2817,6 +2824,32 @@
                     return peerInput
                   },
                 },
+                backButton: {
+                  innerText: texts.back,
+                  style: {
+                    color: 'white',
+                    position: 'absolute',
+                    display: serverToUse ? 'inline' : 'none',
+                    right: '0px',
+                    bottom: '0px',
+                    margin: '5px',
+                    cursor: 'pointer',
+                  },
+                  onClick: () => {
+                    resetMenu()
+                    SafeGetElementById('peerSelector', (elem) => {
+                      elem.style.display = ''
+                    })
+                    SafeGetElementById('peerSelector', (elem) => {
+                      updatePeerSelector(elem)
+                    })
+                    SafeGetElementById('infoMainDiv', (elem) => {
+                      if (subjInfo) {
+                        elem.innerText = `${subjInfo.subjects.toLocaleString()} tárgy, ${subjInfo.questions.toLocaleString()} kérdés`
+                      }
+                    })
+                  },
+                },
                 connectButton: {
                   innerText: texts.connect,
                   style: buttonStyle,
@@ -2859,7 +2892,7 @@
                   },
                 },
                 anotherPeerButton: {
-                  innerText: '~Másik peer...~',
+                  innerText: texts.selectOtherPeer,
                   style: {
                     position: '',
                     padding: '0px 8px',
@@ -2870,7 +2903,7 @@
                     cursor: 'pointer',
                   },
                   onClick: () => {
-                    noHostAction()
+                    addNewHost()
                   },
                 },
               },
@@ -2894,9 +2927,7 @@
         peers.push(serverToUse)
       }
 
-      const selectedPeer = getVal('serverToUse')
+      const selectedPeer = getJSONVal('serverToUse')
-        ? JSON.parse(getVal('serverToUse'))
-        : null
       const selectedIndex = peers.findIndex((x) => {
         return getPeerUrl(x) === getPeerUrl(selectedPeer)
       })
@@ -3026,13 +3057,10 @@
     }
   }
 
-  function SafeGetElementById(id, next, silent) {
+  function SafeGetElementById(id, next) {
     const element = overlay.querySelector('#' + id)
     if (element) {
       next(element)
-    } else {
-      if (silent) return
-      log(`Unable to safe get element by id: ${id}`)
     }
   }
 
@@ -3118,15 +3146,15 @@
           getCid()
 
         get(url)
-          .then(({ responseText: infos }) => {
+          .then(({ responseText }) => {
             try {
-              const infos = JSON.parse(infos)
+              const infos = JSON.parse(responseText)
-              setVal('lastInfo', JSON.stringify(infos))
+              setJSONVal('lastInfo', infos)
               setVal('lastInfoCheckTime', now)
               resolve(infos)
             } catch (e) {
               log('Error parsing JSON in GetXHRInfos')
-              log({ infos: infos })
+              log({ infos: responseText })
               log(e)
               reject(e)
             }