Messages de GeneralCoin

// ==UserScript==

// @name         NotifCite

// @namespace    http://tampermonkey.net/

// @version      1.1

// @description  Permet d'afficher une liste des citations sur le forum

// @author       GénéralCoin

// @match        *://www.jeuxvideo.com/forums/*-51-*

// @grant        none

// ==/UserScript==



(function () {

  'use strict';



  var CSS = `

@keyframes popnotif {

  from {background-color: #F3DD95;}

  to {background-color: white;}

}



@keyframes demarge {

  from {margin-bottom: 42px;}

  to {margin-bottom: 0px;}

}



.notif-box {

  border: 1px solid #D4D4D4;

  margin-bottom: 5px;

  padding: 7px;

  background-color: white;

  height: 47px;

  animation: popnotif 1s 1;

}



.marginer {

  margin-bottom: 44px;

  animation: demarge 0.5s 1 forwards;

}



.notif-box-left {

  margin-right: 60px;

}



.section-left {

  display: flex;

}



.notif-box-right {

  width: 42px;

  height: 22px;

  float: right;

  position: relative;

  bottom: 26px;

}



.section-left.section-msg {

  margin-top: 7px;

  margin-left: 11px;

}



.notif-topic, .notif-msg {

  overflow: hidden;

  white-space: nowrap;

  text-overflow: ellipsis;

  font-size: 11px;

  font-family: tahoma;

  line-height: 11px;

  text-decoration: none;

  margin-left: 5px;

}



.notif-topic {

  color: #006BD7;

  font-weight: bold;

}



.notif-msg {

  color: #535461;

}



.notif-folder {

  width: 14px;

  height: 12px;

  fill: #FFCA27;

  flex-shrink: 0

}



.notif-cite {

  width: 12px;

  height: 12px;

  fill: #84AD20;

  flex-shrink: 0

}



.notif-eye {

  width: 22px;

  height: 22px;

  fill: #B1B1B1;

  float: left;

}



.notif-eye:hover {

  fill: #FF6416;

  cursor: pointer;

}



.notif-delete {

  width: 14px;

  height: 14px;

  fill: #D48181;

  float: right;

  margin-top: 4px;

}



.notif-delete:hover {

  fill: #CF3427;

  cursor: pointer;

}



g, path, circle {

  pointer-events: none;

}



#notif-button {

  width: 100%;

  box-sizing: border-box;

  height: 32px;

  margin-bottom: 20px;

}

`



  document.head.insertAdjacentHTML("afterbegin", `<style type="text/css"> ${CSS} </style>`)



  document.querySelector(".panel-jv-forum").insertAdjacentHTML('afterend', '<button type="button" id="notif-button">Chercher des réponses</button>');



  var rightCol = document.getElementById("forum-right-col");

  var userPseudo = document.querySelector(".account-pseudo").innerText.toLowerCase();

  var savedNotifs = localStorage.getItem(`savedNotifs_${userPseudo}`);

  var saveIndex = localStorage.getItem(`saveIndex_${userPseudo}`)



  var parsedNotifs;

  var parsedIndex;



  if (savedNotifs == null) {

    parsedNotifs = {};

    parsedIndex = [];

  } else {

    parsedIndex = JSON.parse(saveIndex);

    parsedNotifs = JSON.parse(savedNotifs);

    var parsedNotifsIndex = Object.keys(parsedNotifs);

    parsedNotifsIndex.forEach(function (key) {

      var top = parsedNotifs[key];

      if (top.visible) {

        generateNotifBox(top.topicTitle, top.messageLink, top.messageAuthor, top.messageId);

      }

    });

    if (parsedIndex.length > 40) {

      var sliceAt = parsedIndex.length - 25;

      var toDelete = parsedIndex.slice(0, sliceAt);

      parsedIndex.splice(0, sliceAt);

      toDelete.forEach(function (ind) {

        delete parsedNotifs[ind];

      })

      var stringedIndex = JSON.stringify(parsedIndex);

      var stringedNotifs = JSON.stringify(parsedNotifs);

      localStorage.setItem(`saveIndex_${userPseudo}`, stringedIndex);

      localStorage.setItem(`savedNotifs_${userPseudo}`, stringedNotifs);

    }

  }



  rightCol.addEventListener('click', handleButtons, false);



  function handleButtons(e) {

    var content = e.target;

    if (content.id == "notif-button") {

      fetchCitations();

    } else if (content.className.baseVal == "notif-eye") {

      previewMsg(content, content.dataset.link);

    } else if (content.className.baseVal == "notif-delete") {

      deleteNotif(content);

    } else if (content.className == "notif-topic") {

      removeFromSavedNotifs(content.dataset.msgid);

    }

  }



  function fetchCitations() {

    fetch(`http://www.jeuxvideo.com/recherche/forums/0-51-0-1-0-1-0-blabla-18-25-ans.htm?search_in_forum=" ${userPseudo} a écrit"&type_search_in_forum=texte_message`, { method: 'GET', credentials: 'include' })

      .then(res => {

        res.text().then((text) => {

          var doc = document.implementation.createHTMLDocument();

          doc.body.innerHTML = text;

          var citations = doc.getElementsByClassName("message");

          handleCitations(citations)

        })

      })

  }



  function handleCitations(cites) {

    if (cites.length == 0) {

      return;

    }

    var bloc = document.getElementById("forum-right-col").children;

    if (bloc[2].tagName == "A") {

      bloc[2].style.display = "none";

    }

    var next = true;

    for (var i = 0; i < cites.length; i++) {

      var citation = cites[i];

      var messageA = citation.querySelector(".topic-title");

      var messageLink = messageA.href;

      var messageId = Number(messageLink.split("_")[1]);

      if (parsedNotifs[messageId]) {

        console.log('test');

        next = false;

      }

      var checkSimilar = messageA.innerText.toLowerCase();

      var messageAuthor = citation.querySelector(".text-auteur").innerText.trim().toLowerCase();

      if (next && messageAuthor != userPseudo && checkSimilar.includes(` ${userPseudo}`)) {

        var topicId = messageLink.split('-')[2];

        var topicContext = citation.parentElement.querySelector(`[data-id="${topicId}"]`);

        var topicTitle = topicContext.querySelector(".topic-title").innerText.trim();

        parsedIndex.push(messageId);

        parsedNotifs[messageId] = { topicTitle, messageLink, messageAuthor, messageId, visible: true };

        generateNotifBox(topicTitle, messageLink, messageAuthor, messageId);

      }

    }

    var stringedIndex = JSON.stringify(parsedIndex);

    var stringedNotifs = JSON.stringify(parsedNotifs);

    localStorage.setItem(`saveIndex_${userPseudo}`, stringedIndex);

    localStorage.setItem(`savedNotifs_${userPseudo}`, stringedNotifs);

  }



  function generateNotifBox(title, link, author, messageId) {

    var notifBox = `

<div class="notif-box" style="opacity:1;">

  <div class="notif-box-left">

      <div class="section-left">

          <svg class="notif-folder" viewBox="0 0 14 12">

          <path d="m13.388 1.6187h-6.2356l-1.8819-1.6187h-4.6595a0.61149 0.76445 0 0 0 -0.61149 0.76445v3.2355h14v-1.6168a0.61149 0.76445 0 0 0 -0.61149 -0.76445z"/>

          <path d="m4.9e-4 11.413a0.61149 0.58651 0 0 0 0.61149 0.58651h12.777a0.61149 0.58651 0 0 0 0.61149 -0.58651v-6.4135h-14z"/>

          </svg>



          <a class="notif-topic" data-msgid="${messageId}" href="${link}">${title}</a>

      </div>

      <div class="section-left section-msg">

          <svg class="notif-cite" viewBox="0 0 12 12">

          <g transform="matrix(.13333 0 0 .13333 -.66645 -.66667)">

          <path d="m50 5c-25.1 0.2-45.2 20.5-45 45.3 0.2 24.6 20.3 44.7 45 44.7h0.3c12-0.1 23.3-4.8 31.7-13.4s13.1-19.9 13-31.9c-0.2-24.6-20.3-44.7-45-44.7zm22.4 56c0 0.6-0.5 1.1-1.1 1.1h-20c-0.3 0-0.5 0.1-0.7 0.3l-11.2 10.3c-0.7 0.6-1.8 0.1-1.8-0.8v-8.8c0-0.6-0.5-1.1-1.1-1.1h-7.5c-0.5 0-1-0.4-1-1v-25.5c0-0.6 0.5-1.1 1.1-1.1h42.3c0.6 0 1.1 0.5 1.1 1.1v25.5z"/>

          </g>

          </svg>



          <div class="notif-msg"><b>${author}</b> Vous a cité</div>

      </div>

  </div>

  <div class="notif-box-right">

      <svg class="notif-eye" data-link="http://www.jeuxvideo.com/${author}/forums/message/${messageId}" viewBox="0 0 22 22">

      <g transform="scale(.24444)">

      <circle cx="45" cy="45" r="7.1"/>

      <path d="m76.8 13.2c-8.5-8.5-19.8-13.2-31.8-13.2s-23.3 4.7-31.8 13.2-13.2 19.8-13.2 31.8 4.7 23.3 13.2 31.8 19.8 13.2 31.8 13.2 23.3-4.7 31.8-13.2 13.2-19.8 13.2-31.8-4.7-23.3-13.2-31.8zm-0.4 33.1c-0.6 0.7-14.1 18.2-31.4 18.2s-30.9-17.4-31.4-18.2c-0.9-1.1-0.8-2.7 0.1-3.8 0.6-0.7 14.1-17 31.4-17s30.8 16.3 31.4 17c0.7 1.1 0.8 2.7-0.1 3.8z"/>

      </g>

      </svg>



      <svg class="notif-delete" data-msgid="${messageId}" viewBox="0 0 14 14">

      <g transform="matrix(.15555 0 0 .15556 .00024837 0)">

      <path d="m45 0c-24.7 0-44.8 20.1-45 44.7-0.1 12 4.5 23.4 13 31.9 8.4 8.6 19.7 13.3 31.7 13.4h0.3c24.7 0 44.8-20.1 45-44.7 0.1-24.8-19.9-45.1-45-45.3zm19 59.7c1.2 1.2 1.2 3.1 0 4.3-0.6 0.6-1.4 0.9-2.1 0.9-0.8 0-1.5-0.3-2.1-0.9l-14.8-14.7-14.7 14.7c-0.6 0.6-1.4 0.9-2.1 0.9s-1.6-0.3-2.2-0.9c-1.2-1.2-1.2-3.1 0-4.3l14.7-14.7-14.7-14.8c-1.2-1.2-1.2-3.1 0-4.3s3.1-1.2 4.3 0l14.7 14.8 14.7-14.7c1.2-1.2 3.1-1.2 4.3 0s1.2 3.1 0 4.3l-14.7 14.7z"/>

      </g>

      </svg>

  </div>

</div>

`

    document.getElementById('notif-button').insertAdjacentHTML("afterend", notifBox);

  }





  function deleteNotif(content) {

    removeFromSavedNotifs(content.dataset.msgid);

    var el = content.parentElement.parentElement;

    var marginer = document.createElement("div");

    marginer.className = "marginer";



    var decreaseOpacity = setInterval(decOp, 20);



    function decOp() {

      el.style.opacity = (el.style.opacity - 0.1);

      if (el.style.opacity <= 0) {

        stopDecOp();

      }

    }



    function stopDecOp() {

      clearInterval(decreaseOpacity);

      el.insertAdjacentElement('afterend', marginer);

      el.style.display = "none";

      setTimeout(function () { marginer.remove(); }, 2000);

    }

  }



  function removeFromSavedNotifs(id) {

    parsedNotifs[id].visible = false;

    var stringedNotifs = JSON.stringify(parsedNotifs);

    localStorage.setItem(`savedNotifs_${userPseudo}`, stringedNotifs);

  }



  function previewMsg(target, link) {

    var onclickBackUp = target.onclick;

    target.onclick = null;

    setTimeout(function () { target.onclick = onclickBackUp }, 4000);

    var coordinates = target.getBoundingClientRect();

    fetch(link)

      .then(res => {

        if (res.ok) {

          res.text().then((text) => {

            var doc = document.implementation.createHTMLDocument();

            doc.body.innerHTML = text;

            var post = doc.getElementsByClassName("bloc-message-forum")[0];

            post.style.width = "49rem";

            post.style.position = "absolute";

            post.style.left = (coordinates.left - 784) + "px";

            post.style.top = (coordinates.top + window.scrollY) + "px";

            post.style.zIndex = "2000";

            post.style.borderColor = "#FF6416";

            document.body.insertAdjacentElement('afterbegin', post);

            document.body.onclick = function () {

              post.remove()

              document.body.onclick = null;

            };

          })

        } else {

          var post = document.createElement("img");

          post.src = "http://www.jeuxvideo.com/img/erreurs/e410.png";

          post.style.position = "absolute";

          post.style.left = (coordinates.left - 550) + "px";

          post.style.top = (coordinates.top + window.scrollY) + "px";

          post.style.zIndex = "2000";

          document.body.insertAdjacentElement('afterbegin', post);

          document.body.onclick = function () {

            post.remove()

            document.body.onclick = null;

          };

        }

      })

  }

})();