Улучшить читаемость сообщений в чате разделением сообщений чертой, в случае, если между сообщениями заданный интервал времени

Pokruk

• 6. September 2021 15:44
• Bearbeitet

Намного удобнее будет читать длинные чаты, если можно будет за что-то зацепиться, найти начало диалога и тд

Желательно, чтобы была отдельная настройка, чтобы этот интервал можно было задать

0

• 

  Pokruk

  • 15. September 2021 16:44

  В общем я психанул и сделал что-то подобное сам

  mods = {
      bind: "bind",
      interval: "interval",
      onfetch:"onfetch"
  }
  
  let mode = mods.onfetch
  
  function getDateOfMessage(messageHtmlElement) {
      for (const message_property of messageHtmlElement.children) {
          if (message_property.className.startsWith("contents")) {
              for (const contents_property of message_property.children) {
                  if (contents_property.className.startsWith("header")) {
                      for (const header_property of contents_property.children) {
                          if (header_property.className.startsWith("timestamp")) {
                              let date_str = header_property.firstChild.getAttribute("datetime")
                              let date = new Date(date_str)
                              return date
                          }
                      }
                  }
              }
          }
      }
  }
  
  function insertAfter(newNode, referenceNode) {
      referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
  }
  
  
  msgScroller = document.getElementsByClassName("scrollerInner-2YIMLh")[0]
  
  function separate() {
      //сообщения начинаются с 4-ого ребёнка
      let lastDate = null
      for (let i = 4; i < msgScroller.childElementCount - 1; i++) {
          if (msgScroller.children[i] != null && msgScroller.children[i + 1] != null) {
              let date1 = getDateOfMessage(msgScroller.children[i])
              if (date1 != undefined) {
                  if (lastDate == null) {
                      lastDate = date1
                  }
  
                  /*
                  let timeSpan = document.createElement("span")
                  timeSpan.innerHTML = String(date1 - lastDate / 1000)
                  insertAfter(timeSpan, msgScroller.children[i-1])
                   */
                  let dif_in_seconds = (date1 - lastDate) / 1000
  
                  if (dif_in_seconds / 60 > 20) {
                      if (msgScroller.children[i-1].className != "time-separator") {
                          let timeSpan = document.createElement("span")
                          timeSpan.innerHTML = String((dif_in_seconds / 60).toFixed(2))
                          timeSpan.setAttribute("style", "color: red")
                          timeSpan.className = "time-separator"
                          insertAfter(timeSpan, msgScroller.children[i - 1])
                      }
                  }
                  console.log(date1)
                  console.log(lastDate)
                  console.log(date1 - lastDate)
                  console.log((date1 - lastDate) / 1000 / 60)
                  console.log("---")
  
                  lastDate = date1
  
              }
          }
      }
  }
  
  if (mode == "bind") {
      document.addEventListener('keydown', function(event) {
          if (event.code == "Numpad5") {
  
              separate()
              console.log("Num")
          }
      });
  } else if (mode == "interval") {
      setInterval(separate, 1000)
  } else if (mode == "onfetch") {
      console.stdlog = console.log.bind(console);
      console.logs = [];
      console.log = function(){
          console.stdlog.apply(console, arguments);
          if (arguments.length > 2 && arguments[2].includes("Fetched")) {
              setTimeout(separate, 500)
              separate()
              //console.stdlog.apply(console, ["dadaDadadadada"])
          }
      }
  } else {
      console.log("Вы не указали режим работы программы")
  }
  
  

  0

Bitte melden Sie sich an, um einen Kommentar zu hinterlassen.