PTH User tagging

Tag, ignore, highlight, and change avatars for users on PTH and PTP

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         PTH User tagging
// @version      1.3
// @description  Tag, ignore, highlight, and change avatars for users on PTH and PTP
// @author       Chameleon
// @include      http*://redacted.ch/*
// @include      http*://passthepopcorn.me/*
// @grant        none
// @namespace https://greasyfork.org/users/87476
// ==/UserScript==

var current_site;

(function() {
  'use strict';
  var h=window.location.host;
  if(h==="redacted.ch")
    current_site='RED';
  else if(h==="passthepopcorn.me")
    current_site='PTP';

  window.setTimeout(checkHeight.bind(undefined, document.body.clientHeight), 800);

  if(window.location.href.indexOf('user.php?id=') != -1)
  {
    var username;
    if(current_site==="RED")
      username=document.getElementsByTagName('h2')[0].getElementsByTagName('a')[0].textContent;
    else if(current_site==="PTP")
      username=document.getElementsByTagName('h2')[0].textContent;
    var a=document.createElement('a');
    a.href='javascript:void(0);';
    a.addEventListener('click', openTags.bind(undefined, username, undefined), false);
    if(current_site==="RED")
    {
      a.innerHTML = '[User tags]';
      document.getElementsByClassName('linkbox')[0].appendChild(a);
    }
    else if(current_site==="PTP")
    {
      var e=document.getElementsByClassName('linkbox')[0];
      e.appendChild(document.createTextNode(' ['));
      a.innerHTML='User Tags';
      e.appendChild(a);
      e.appendChild(document.createTextNode(']'));
    }

    var avatar;
    if(current_site==="RED")
      avatar=document.getElementsByClassName('box_image_avatar')[0].getElementsByTagName('img')[0];
    else if(current_site==="PTP")
      avatar=document.getElementsByClassName('sidebar-cover-image')[0];
    avatar.setAttribute('originalAvatar', avatar.src);

    setProfile();
  }

  //var posts=document.getElementsByClassName('forum_post');
  var posts=document.querySelectorAll('.forum_post, .forum-post');
  for(var i=0; i<posts.length; i++)
  {
    var p=posts[i];
    if(p.getAttribute('class').indexOf('preview_wrap') != -1)
      continue;
    if(p.id=='reply_box')
      continue;
    var links;
    if(current_site==="RED")
      links=p.getElementsByTagName('td')[0].firstElementChild;
    else if(current_site==="PTP")
      links=p.getElementsByTagName('span')[0];
    var username=p.getElementsByTagName('strong')[0].getElementsByTagName('a')[0].textContent;

    var a=document.createElement('a');
    a.href='javascript:void(0);';
    a.innerHTML='Tag';
    if(current_site==="PTP")
      a.innerHTML='[Tag]';
    a.setAttribute('class', 'brackets');
    a.addEventListener('click', openTags.bind(undefined, username, p), false);
    links.appendChild(document.createTextNode(' - '));
    links.appendChild(a);

    var img;
    if(current_site==="RED")
      img=p.getElementsByTagName('img')[0];
    else if(current_site==="PTP")
      img=p.getElementsByClassName('forum-post__avatar__image')[0];
    if(img)
    {
      img.setAttribute('originalAvatar', img.src);
    }
  }
  /*
  var avatars=document.getElementsByClassName('avatar');
  for(var i=0; i<avatars.length; i++)
  {
    var avatar=avatars[i];
    addTagLinks(avatar);
    var img=avatar.getElementsByTagName('img')[0];
    if(img)
    {
      img.setAttribute('originalAvatar', img.src);
    }
  }*/

  addTags();
})();

function setProfile()
{
  if(window.location.href.indexOf('user.php?id=') === -1)
    return;
  var user;
  if(current_site==="RED")
    user=document.getElementsByTagName('h2')[0].getElementsByTagName('a')[0].textContent;
  else if(current_site==="PTP")
    user=document.getElementsByTagName('h2')[0].textContent;
  user=getUser(user)[0];
  var avatar;
    if(current_site==="RED")
      avatar=document.getElementsByClassName('box_image_avatar')[0].getElementsByTagName('img')[0];
    else if(current_site==="PTP")
      avatar=document.getElementsByClassName('sidebar-cover-image')[0];
  if(user.replacementAvatar)
  {
    avatar.src=user.replacementAvatar;
  }
  else
  {
    avatar.src=avatar.getAttribute('originalAvatar');
  }
  if(user.usernameColour)
  {
    var username;
    if(current_site==="RED")
      username=document.getElementsByTagName('h2')[0].getElementsByTagName('a')[0];
    else if(current_site==="PTP")
      username=document.getElementsByTagName('h2')[0];
    username.style.color=user.usernameColour;
  }
  if(user.customTitle)
  {
    document.getElementsByClassName('user_title')[0].innerHTML='('+user.customTitle+')';
  }
}


function checkHeight(height)
{
  if(height != document.body.clientHeight)
  {
    pageResized();
  }

  window.setTimeout(checkHeight.bind(undefined, document.body.clientHeight), 800);
}
/*
function addTagLinks(avatar)
{
  var tags=getTags();

  var postTable=avatar.parentNode;
  while(postTable.tagName != 'TABLE')
    postTable=postTable.parentNode;
  if(postTable.getAttribute('id') == 'preview_wrap_0')
    return;
  var username=postTable.getElementsByTagName('strong')[0].textContent;

  var id=postTable.getAttribute('id').split('post')[1];

  var a=document.createElement('a');
  a.setAttribute('class', 'tagLink');
  a.setAttribute('postId', id);
  var place = avatar.getBoundingClientRect();
  var style='position: absolute; z-index: 50000000; top: '+(place.top+window.scrollY)+'px; left: '+(place.left+window.scrollX)+'px; width: '+avatar.clientWidth+'px;';
  style+='text-align: center; color: blue; background: rgba(200,200,200,0.8); border-radius: 0px 0px 10px 10px;';
  a.setAttribute('style', style);

  a.innerHTML = 'Show user tags';
  a.href='javascript:void(0);';
  a.addEventListener('click', openTags.bind(undefined, username, postTable), false);
  document.body.appendChild(a);
  a.style.display='none';

  avatar.addEventListener('mouseover', mouseOver.bind(undefined, a), false);
  avatar.addEventListener('mouseout', mouseOut.bind(undefined, avatar, a), false);
}
*/
function pageResized()
{
  /*var tagLinks=document.getElementsByClassName('tagLink');
  for(var i=0; i<tagLinks.length; i++)
  {
    var t=tagLinks[i];
    var id=t.getAttribute('postId');
    var postTable=document.getElementById('post'+id);
    var avatar=postTable.getElementsByClassName('avatar')[0];

    var place = avatar.getBoundingClientRect();
    var style='position: absolute; z-index: 50000000; top: '+(place.top+window.scrollY)+'px; left: '+(place.left+window.scrollX)+'px; width: '+avatar.clientWidth+'px;';
    style+='text-align: center; color: blue; background: rgba(200,200,200,0.8); border-radius: 0px 0px 10px 10px;';
    t.setAttribute('style', style);
    t.style.display='none';
  }*/

  resetTags();
  addTags();
}

function resetTags()
{
  var ignoredQuotes=document.getElementsByClassName('toggleQuote');
  for(var i=0; i<ignoredQuotes.length; i++)
  {
    var ig=ignoredQuotes[i];
    ig.nextElementSibling.style.display='';
    ig.parentNode.removeChild(ig);
  }

  //var posts=document.getElementsByClassName('forum_post');
  var posts=document.querySelectorAll('.forum_post, .forum-post');
  var length;
  if(current_site==="RED")
    length=posts.length-1;
  else if(current_site==="PTP")
    length=posts.length;
  for(var i=0; i<length; i++)
  {
    var p=posts[i];
    var avatar;
    if(current_site==="RED")
      avatar=p.getElementsByClassName('avatar')[0];
    else if(current_site==="PTP")
      avatar=p.getElementsByClassName('forum-post__avatar')[0];

    var postTable=p;

    if(postTable.getAttribute('id') == 'preview_wrap_0')
      continue;
    if(p.id=='reply_box')
      continue;
    var u=postTable.getElementsByTagName('strong')[0].getElementsByTagName('a')[0];
    var username=u.textContent;


    var c=postTable.getElementsByClassName('user_title');
    if(c.length > 0)
    {
      var orig=c[0].getAttribute('original');
      if(orig)
        c[0].innerHTML=orig;
    }

    if(avatar)
    {
      var img=avatar.getElementsByTagName('img')[0];
      if(img)
      {
        var orig=img.getAttribute('originalAvatar');
        if(orig)
          img.src=img.getAttribute('originalAvatar');
      }
    }
    u.setAttribute('style', '');
    postTable.setAttribute('style', '');
    var tr;
    if(current_site==="RED")
      tr=postTable.getElementsByTagName('tr')[1];
    else if(current_site==="PTP")
      tr=postTable.getElementsByClassName('forum-post__avatar-and-body')[0];
    if(tr.getAttribute('stayHidden')!=="true")
    {
      tr.style.display='';
    }
    var id=postTable.getAttribute('id').split('post')[1];
    var tag=document.getElementById('tag'+id);
    if(tag)
      tag.parentNode.removeChild(tag);
  }
  var hardIgnores=document.getElementsByClassName('hardIgnoreLink');
  for(var i=0; i<hardIgnores.length; i++)
  {
    var h=hardIgnores[i];
    h.parentNode.removeChild(h);
  }
}

function addTags()
{
  var quotes=document.getElementsByTagName('blockquote');
  for(var i=0; i<quotes.length; i++)
  {
    var q=quotes[i];
    var username = q.previousElementSibling;
    if(username)
    {
      username=username.textContent.split(' ')[0];
      var user=getUser(username)[0];
      if(user.softIgnore || user.hardIgnore)
      {
        var a=document.createElement('a');
        a.href='javascript:void(0);';
        a.textContent='<Ignored>';
        a.addEventListener('click', toggleQuote.bind(undefined, a, q), false);
        a.setAttribute('class', 'toggleQuote');
        q.parentNode.insertBefore(a, q);
        if(q.getAttribute('unIgnored')=="true")
        {
          a.textContent='Ignore';
        }
        else
          q.style.display='none';
      }
    }
  }

  //var posts=document.getElementsByClassName('forum_post');
  var posts=document.querySelectorAll('.forum_post, .forum-post');
  var length;
  if(current_site==="RED")
    length=posts.length-1;
  else if(current_site==="PTP")
    length=posts.length;
  for(var i=0; i<length; i++)
  {
    var p=posts[i];
    var avatar;
    if(current_site==="RED")
      avatar=p.getElementsByClassName('avatar')[0];
    else if(current_site==="PTP")
      avatar=p.getElementsByClassName('forum-post__avatar')[0];

    var postTable=p;

    if(postTable.getAttribute('id') == 'preview_wrap_0')
      continue;
    if(p.id=='reply_box')
      continue;
    var u=postTable.getElementsByTagName('strong')[0].getElementsByTagName('a')[0];
    var username=u.textContent;

    var user=getUser(username)[0];
    if(user.replacementAvatar && avatar)
    {
      avatar.getElementsByTagName('img')[0].src=user.replacementAvatar;
    }
    if(user.usernameColour)
    {
      var style=u.getAttribute('style');
      if(!style)
        style='';
      u.setAttribute('style', style+' color: '+user.usernameColour+';');
    }
    if(user.postHighlight)
    {
      var style=postTable.getAttribute('style');
      postTable.setAttribute('style', 'box-shadow: '+user.postHighlight+' 0 0 5px 1px !important;');
    }
    if(user.customTitle)
    {
      var c=postTable.getElementsByClassName('user_title');
      if(c.length > 0)
        c=c[0];
      else
      {
        c=document.createElement('span');
        c.setAttribute('class', 'user_title');
        var before=postTable.getElementsByClassName('time')[0];
        before.parentNode.insertBefore(c, before);
      }
      if(!c.getAttribute('original'))
        c.setAttribute('original', c.innerHTML);

      c.innerHTML='('+user.customTitle+')';
    }
    if(user.tag && user.showTag)
    {
      var div=document.createElement('div');
      var id=postTable.getAttribute('id').split('post')[1];
      div.setAttribute('id', 'tag'+id);
      div.innerHTML = user.tag.replace(/\n/g,'<br />')+' ';
      if(!user.showTagInHeader)
      {
        var before=document.getElementById('bar'+id).firstElementChild;
        before.parentNode.insertBefore(div, before);
        div.setAttribute('style', 'display: inline-block; margin-right: 5px;');
        div.setAttribute('class', 'r10');
      }
      else
      {
        var first;
        if(!avatar)
        {
          avatar=postTable;
          first=avatar;
        }
        else
          first=avatar.firstElementChild;
        var place = postTable.getBoundingClientRect();
        var width=300;
        var left=place.left+window.scrollX-width-20;
        if(left<0)
          left=0;
        var style='position: absolute; z-index: 1001; top: '+(place.top+window.scrollY)+'px; left: '+left+'px; max-width: '+width+'px; text-align: center; color: white; background: rgba(20,20,20,0.7); border-radius: 20px 0px 0px 20px;';
        style+='font-size: large; box-shadow: inset '+(user.postHighlight ? user.postHighlight : 'black')+' 0 0 20px 0; padding: 10px;';
        div.setAttribute('style', style);
        document.body.appendChild(div);
        var avatarHeight=first.clientHeight;
        var top=place.top+window.scrollY+((avatarHeight-div.clientHeight)/2);
        div.style.top=top+'px';
        if(div.clientWidth < width)
        {
          left=place.left+window.scrollX-div.clientWidth;
          if(left<0)
            left=0;
          div.style.left=left+'px';
        }
      }
    }
    if(user.softIgnore)
    {

      var tr;
      if(current_site==="RED")
        tr=postTable.getElementsByTagName('tr')[1];
      else if(current_site==="PTP")
        tr=postTable.getElementsByClassName('forum-post__avatar-and-body')[0];
      tr.style.display='none';
    }
    if(user.hardIgnore)
    {
      var a=document.createElement('a');
      var hr=document.createElement('hr');
      hr.setAttribute('title', username);
      a.appendChild(hr);
      a.setAttribute('class', 'hardIgnoreLink');
      a.href=postTable.getElementsByTagName('strong')[0].getElementsByTagName('a')[0].href;
      postTable.parentNode.insertBefore(a, postTable);
      postTable.style.display='none';
    }
  }
}

function toggleQuote(a, q)
{
  if(a.innerHTML.indexOf('Ignored') != -1)
  {
    a.textContent = 'Ignore';
    q.style.display='';
    q.setAttribute('unIgnored', "true");
  }
  else
  {
    a.textContent = '<Ignored>';
    q.style.display='none';
    q.setAttribute('unIgnored', "false");
  }
}

function setEmpty(input)
{
  input.value="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E";
  input.dispatchEvent(new Event('change'));
}

function openTags(username, postTable)
{
  var div=document.getElementById('chameleonTagsDiv');
  if(!div)
  {
    div=document.createElement('div');
    div.setAttribute('id', 'chameleonTagsDiv');
    document.body.appendChild(div);
    div.setAttribute('style', 'position: fixed; top: 20px; margin: auto; left: 0; right: 0; text-align: center; background: rgba(0,0,0,0.7); color: white; width: 80%; z-index: 1000;');
  }
  div.innerHTML = '<h2>'+username+'\'s Tags<br />';

  var user=getUser(username)[0];

  var input=document.createElement('input');
  input.placeholder='Replacement avatar URL';
  input.value = user.replacementAvatar ? user.replacementAvatar : '';
  input.addEventListener('change', changeTags.bind(undefined, div, username, postTable, input), false);
  var a=document.createElement('a');
  a.href='javascript:void(0);';
  a.setAttribute('style', 'display:block;');
  a.innerHTML="Set avatar to empty image";
  a.addEventListener('click', setEmpty.bind(undefined, input));
  div.appendChild(a);
  div.appendChild(input);

  div.appendChild(document.createElement('br'));

  var input=document.createElement('input');
  div.appendChild(input);
  input.placeholder='Replacement custom title';
  input.value = user.customTitle ? user.customTitle : '';
  input.addEventListener('change', changeTags.bind(undefined, div, username, postTable, input), false);

  div.appendChild(document.createElement('br'));

  var input=document.createElement('input');
  div.appendChild(input);
  input.placeholder='Post highlight colour';
  input.value = user.postHighlight ? user.postHighlight : '';
  input.addEventListener('change', changeTags.bind(undefined, div, username, postTable, input), false);

  div.appendChild(document.createElement('br'));

  var input=document.createElement('input');
  div.appendChild(input);
  input.placeholder='Username colour';
  input.value = user.usernameColour ? user.usernameColour : '';
  input.addEventListener('change', changeTags.bind(undefined, div, username, postTable, input), false);

  div.appendChild(document.createElement('br'));

  var input=document.createElement('textarea');
  input.setAttribute('id', 'tagTextarea');
  div.appendChild(input);
  input.setAttribute('style', 'text-align: center; border: none;');
  input.placeholder='Tag';
  input.value = user.tag ? user.tag : '';
  resize('tagTextarea');
  input.addEventListener('keyup', resize.bind(undefined, 'tagTextarea'), false);
  input.addEventListener('change', changeTags.bind(undefined, div, username, postTable, input), false);

  div.appendChild(document.createElement('br'));

  var a=document.createElement('a');
  div.appendChild(a);
  a.innerHTML = 'Show tag: '+(user.showTag ? 'On' : 'Off');
  a.href='javascript:void(0);';
  a.addEventListener('click', changeTags.bind(undefined, div, username, postTable, a), false);

  div.appendChild(document.createElement('br'));

  var a=document.createElement('a');
  div.appendChild(a);
  a.innerHTML = 'Show tag left of avatar: '+(user.showTagInHeader ? 'On' : 'Off');
  a.href='javascript:void(0);';
  a.addEventListener('click', changeTags.bind(undefined, div, username, postTable, a), false);

  div.appendChild(document.createElement('br'));

  var a=document.createElement('a');
  div.appendChild(a);
  a.innerHTML = 'Soft ignore: '+(user.softIgnore ? 'On' : 'Off');
  a.href='javascript:void(0);';
  a.addEventListener('click', changeTags.bind(undefined, div, username, postTable, a), false);

  div.appendChild(document.createElement('br'));

  var a=document.createElement('a');
  div.appendChild(a);
  a.innerHTML = 'Hard ignore: '+(user.hardIgnore ? 'On' : 'Off');
  a.href='javascript:void(0);';
  a.addEventListener('click', changeTags.bind(undefined, div, username, postTable, a), false);

  div.appendChild(document.createElement('br'));

  var a=document.createElement('a');
  div.appendChild(a);
  a.innerHTML = 'Save';
  a.href='javascript:void(0);';
  a.addEventListener('click', saveAndClose.bind(undefined, div, username, postTable), false);
}

function changeTags(div, username, table, a)
{
  var user=getUser(username);
  var index=user[1];
  user=user[0];

  var inputs=div.getElementsByTagName('input');
  user.replacementAvatar = inputs[0].value;
  user.customTitle = inputs[1].value;
  user.postHighlight = inputs[2].value;
  user.usernameColour = inputs[3].value;

  var textareas=div.getElementsByTagName('textarea');
  user.tag=textareas[0].value;

  var as=div.getElementsByTagName('a');
  if(as[1] == a)
  {
    if(a.innerHTML.indexOf('On') != -1)
      user.showTag=false;
    else
      user.showTag=true;
  }
  if(as[2] == a)
  {
    if(a.innerHTML.indexOf('On') != -1)
      user.showTagInHeader=false;
    else
      user.showTagInHeader=true;
  }
  if(as[3] == a)
  {
    if(a.innerHTML.indexOf('On') != -1)
      user.softIgnore=false;
    else
      user.softIgnore=true;
  }
  if(as[4] == a)
  {
    if(a.innerHTML.indexOf('On') != -1)
      user.hardIgnore=false;
    else
      user.hardIgnore=true;
  }

  var tags=getTags();
  if(index != -1)
    tags[index]=user;
  else
  {
    user.username=username;
    tags.push(user);
  }
  window.localStorage.userTags = JSON.stringify(tags);

  openTags(username, table);
}

function saveAndClose(div, username, table)
{
  resetTags();
  addTags();
  setProfile();
  div.parentNode.removeChild(div);
}

/*
function mouseOver(a)
{
  a.style.display = 'initial';
}

function mouseOut(avatar, a, event)
{
  if(event.relatedTarget == avatar || event.relatedTarget == a)
    return;
  a.style.display = 'none';
}*/

function getUser(username)
{
  var tags=getTags();
  for(var i=0; i<tags.length; i++)
  {
    var t=tags[i];
    if(t.username === username)
      return [t, i];
  }
  return [{}, -1];
}

function getTags()
{
  var tags = window.localStorage.userTags;
  if(!tags)
  {
    tags = [];
  }
  else
    tags = JSON.parse(tags);
  return tags;  
}