alfabouch / Mèl

// ==UserScript==
// @name         Mèl
// @version      1.1
// @description  try to take over the mèl!
// @author       Thomas B.
// @match        https://mel.din.developpement-durable.gouv.fr/*
// @match        https://ariane.din.developpement-durable.gouv.fr/*
// @require      http://code.jquery.com/jquery-3.5.1.slim.min.js
// @run-at       document-start
// @grant        GM_addStyle
// @license      MIT
// @noframes
// ==/UserScript==

(function () {
  'use strict';
  console.log('tampering v0.1a')
  const colors = [
    '#FFB5E8', '#FF9CEE', '#FFCCF9', '#FCC2FF',
    '#F6A6FF', '#B28DFF', '#C5A3FF', '#D5AAFF',
    '#ECD4FF', '#FBE4FF', '#DCD3FF', '#A79AFF',
    '#B5B9FF', '#97A2FF', '#AFCBFF', '#AFF8DB',
    '#C4FAF8', '#85E3FF', '#ACE7FF', '#6EB5FF',
    '#BFFCC6', '#BDFFD6', '#F3FFE3', '#E7FFAC',
    '#FFFFD1', '#FFC9DE', '#FFABAB', '#FFBEBC',
    '#FFCBC1', '#FFF5BA'
  ]
  const userDataAttributeName = 'data-username'
  let mutationObserver
  let users = []

  function updateDOM() {
    console.log('updating dom')
    let domUsers = $('li.message[' + userDataAttributeName + ']')
    domUsers.each(function (i) {
      let previousUserName = $(domUsers[i - 1]).attr(userDataAttributeName)
      let currentUserName = $(domUsers[i]).attr(userDataAttributeName)
      let nextUserName = $(domUsers[i + 1]).attr(userDataAttributeName)

      let sameThreadAsNext = $(domUsers[i]).attr('data-id') === $(domUsers[i + 1]).attr('data-tmid')
      let sameThreadAsPrevious = $(domUsers[i - 1]).attr('data-id') === $(domUsers[i]).attr('data-tmid')

      let nextIsSystem = $(domUsers[i + 1]).hasClass('system')
      let isSystem = $(domUsers[i]).hasClass('system')
      let previousIsSystem = $(domUsers[i - 1]).hasClass('system')

      if (isSystem) return

      $(domUsers[i]).removeClass('message-first').removeClass('message-middle').removeClass('message-last')

      if (currentUserName !== previousUserName && !sameThreadAsPrevious || previousIsSystem) $(domUsers[i]).addClass('message-first')
      else {
        if (!sameThreadAsPrevious) {
          $(domUsers[i]).find('div.title').remove()
          $(domUsers[i]).find('div.avatar').remove()
        }
      }
      if (currentUserName !== nextUserName && !sameThreadAsNext || nextIsSystem) $(domUsers[i]).addClass('message-last')
      if (!$(domUsers[i]).hasClass('message-first') && !$(domUsers[i]).hasClass('message-last')) $(domUsers[i]).addClass('message-middle')

      if (sameThreadAsPrevious && $(domUsers[i - 1]).hasClass('own')) $(domUsers[i]).addClass('answerOwn')

      if (!users.includes(currentUserName)) {
        console.log('new user found : ' + currentUserName)
        users.push(currentUserName)
        let style = '' +
          'li.message[' + userDataAttributeName + '="' + currentUserName + '"]:not(.system):not(.own) {' +
          '   background-color : ' + colors[Math.floor(Math.random() * colors.length)] + ';' +
          '}'
        console.log(style)
        GM_addStyle(style)
      }
    })
  }

  function addCustomCss() {
    console.log('add custom css')
    let style = '' +
      'li.message { ' +
      '   float:left;' +
      '   width: 100%;' +
      '}' +
      'li.message:not(.system) { ' +
      '   width: 80%;' +
      '}' +
      'li.message.own:not(.system) { ' +
      '   background-color: #d8d8d8;' +
      '   float: right;' +
      '}' +
      'li.message.answerOwn:not(.system) { ' +
      '   float: right;' +
      '}' +
      'li.message:not(.system) { ' +
      '   padding-bottom: 5px;' +
      '   margin: 0 20px;' +
      '}' +
      'li.message-first:not(.system) { ' +
      '   border-top-left-radius: 15px;' +
      '   border-top-right-radius: 15px;' +
      '   margin-top: 10px;' +
      '}' +
      'li.message-last:not(.system) { ' +
      '   border-bottom-left-radius: 15px;' +
      '   border-bottom-right-radius: 15px;' +
      '   margin-bottom: 10px;' +
      '}' +
      'li.message-middle:not(.system) { ' +
      '   min-height: 20px;' +
      '   padding-top: 0;' +
      '   padding-bottom: 0;' +
      '}' +
      'li.message.sequential:not(.system) { ' +
      '   min-height: 20px;' +
      '   padding-top: 0;' +
      '   padding-bottom: 0;' +
      '}' +
      'li.message.new-day { ' +
      '   margin-top: 35px;' +
      '}'
    GM_addStyle(style)
  }

  function startChatObserver(wrapper) {
    console.log('starting chat observer')
    let wrapperMutationObserver = new MutationObserver(function (mutations) {
      console.log('chat mutated')
      updateDOM()
    })
    wrapperMutationObserver.observe(wrapper[0], {
      childList: true,
      subtree: true,
    })
  }

  function startDomObserver() {
    console.log('starting dom observer')
    mutationObserver = new MutationObserver(function (mutations) {
      mutations.forEach(function (mutation) {
        console.log('dom mutated')
        console.log(mutation)
      })
      let wrapper = $('.main-content')
      // let wrapper = $('#mailview-bottom')
      if (wrapper.length === 1) {
        updateDOM()
        console.log('found wrapper')
        console.log(wrapper)
        mutationObserver.disconnect()
        startChatObserver(wrapper)
      }
    })
    mutationObserver.observe(document, {
      childList: true,
      subtree: true,
    })
  }

  startDomObserver()
  addCustomCss()
  console.log('ran')
})()