/r/leagueoflegends red tracker

turn links red if rioter comments. tracks rioter comments on comment page.

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name        	/r/leagueoflegends red tracker
// @license			BSD License
// @description 	turn links red if rioter comments. tracks rioter comments on comment page.
// @version     	1.0.2
// @include			*://*.reddit.com/r/leagueoflegends*
// @require       	https://code.jquery.com/jquery-1.11.0.min.js
// @grant       	none
// @namespace https://greasyfork.org/users/5966
// ==/UserScript==

this.$ = this.jQuery = jQuery.noConflict(true);
$(function () {
  if (window.location.href.search('comments') == - 1) {
    var lastPost = searchPosts('');		//last comment on each page. used as reference to load next page.
    var page = [];		//for RES, keep track of what pages have been loaded already
    page.push('#page=1');
    $(window).on('hashchange', function () {
      if (page.indexOf(window.location.hash) == - 1) {		//when on a new page that hasn't been loaded before, make titles red
        //update loaded pages
        page.push(window.location.hash);
        //keep track of last comment so next page loads from correct spot
        lastPost = searchPosts(lastPost);
      }
    });
  } 
  else {
    addMarkup();
    trackComments(0);
    $('span.morecomments a').click(function () {
      $('#openRiotNav,.closeRiot,.downRiot,.upRiot').off();
      setTimeout(function () {
        trackComments(parseInt($('.counterRiot').text().substring(0, 1)));
      }, 3000);
    });
  }
});

/********************
***Start Functions***
********************/
function addMarkup() {
  //if there are no comments, stop
  if ($('p>span.flair-riot').length == 0) {
    return;
  }
  
  //add markup for comment tracker
  $('body').append('<div class=\'riotNav\'></div>');
  $('.riotNav').append('<div class=\'closeRiot\'>X</div>');
  $('.riotNav').append('<div class=\'upRiot\'></div>');
  $('.riotNav').append('<div class=\'counterRiot\'>1/' + $('p>span.flair-riot').length + '</div>');
  $('.riotNav').append('<div class=\'downRiot\'></div>');
  $('.riotNav').append('<p class=\'navAlert\'>Comment Minimized</p>');
  
  //add button on nav toggle menu to make comment tracker appear if closed
  if ($('#REScommentNavToggle').length) {
    $('#REScommentNavToggle').append('<span>|</span><div id=\'openRiotNav\' class=\'flair flair-riot\' title=\'Navigate through comments by Rioters\'></div>');
  } 
  else {
    $('.menuarea').append('<div id=\'openRiotNav\' class=\'flair flair-riot\' title=\'Navigate through comments by Rioters\'></div>');
  }
  
  //style
  $('#openRiotNav').css({
    'margin-left': '6px',
    'cursor': 'pointer'
  });
  $('.closeRiot').css({
    'margin': '2px 3px 0 0',
    'float': 'right',
    'content': '¹6',
    'font-size': '9px',
    'font-weight': 'bold',
    'cursor': 'pointer',
    'color': 'white',
    'opacity': '.3',
    'text-indent': '0'
  });
  $('.closeRiot').hover(function () {
    $(this).css({
      'opacity': 0.8
    });
  }, function () {
    $(this).css({
      'opacity': 0.3
    });
  });
  $('.counterRiot').css({
    'width': '50px',
    'height': '40px',
    'margin': '0px auto 0px auto',
    'color': 'white',
    'text-align': 'center',
    'line-height': '37px'
  });
  $('.downRiot').css({
    'width': '0px',
    'height': '0px',
    'border-right': '20px solid transparent',
    'border-left': '20px solid transparent',
    'border-top': '20px solid rgb(224, 189, 3)',
    'margin': '0px auto 0px auto',
    'position': 'relative',
    'overflow': 'hidden',
    'cursor': 'pointer'
  });
  $('.navAlert').css({
    'display': 'none',
    'position': 'relative',
    'bottom': '21px',
    'left': '8px',
    'color': 'white',
    'font-size': '8px'
  });
  $('.riotNav').css({
    'position': 'fixed',
    'background-color': '#2F4F4F',
    'top': '215px',
    'right': '450px',
    'width': '100px',
    'height': '100px',
    'border': '2px solid rgb(224, 189, 3)',
    'opacity': 0.1,
    '-moz-transition': 'opacity 0.5s, box-shadow 0.5s',
    '-o-transition': 'opacity 0.5s, box-shadow 0.5s',
    '-webkit-transition': 'opacity 0.5s, box-shadow 0.5s'
  });
  $('.riotNav').hover(function () {
    $(this).css({
      'opacity': 1,
      'box-shadow': '4px 4px 1px rgb(133, 128, 128)'
    });
  }, function () {
    $(this).css({
      'opacity': 0.1,
      'box-shadow': 'none'
    });
  });
  $('.upRiot').css({
    'width': '0px',
    'height': '0px',
    'border-right': '20px solid transparent',
    'border-left': '20px solid transparent',
    'border-bottom': '20px solid rgb(224, 189, 3)',
    'margin-top': '8px',
    'left': '30px',
    'position': 'relative',
    'overflow': 'hidden',
    'cursor': 'pointer'
  });
  $(".downRiot").mousedown(function() { $(this).css({'border-top': '20px solid rgb(119, 101, 3)'}); });
  $(".downRiot").mouseup(function() { $(this).css({'border-top': '20px solid rgb(224, 189, 3)'}); });
  $(".upRiot").mousedown(function() { $(this).css({'border-bottom': '20px solid rgb(119, 101, 3)'}); });
  $(".upRiot").mouseup(function() { $(this).css({'border-bottom': '20px solid rgb(224, 189, 3)'}); });
}

function makePostRed(toBeRed) {
  //make link red
  toBeRed.style.setProperty('color', 'red', 'important');
  //mouseover turn pink, mouseoff turn red again
  $(toBeRed).hover(function () {
    this.style.setProperty('color', '#ff69b4', 'important');
  }, function () {
    this.style.setProperty('color', 'red', 'important');
  });
}

function searchPosts(afterPost) {
  var url;			//to be used in the json request
  var postArray;	//array of reddit post objects from json request
  var jqXHR;		//jQuery XMLHttpRequest object
  var selfPost;		//jQuery object of the reddit self post <a> tag to be made red
  var decodedURL;	//external link url used to select <a> tag
  var externalPost;	//jQuery object of the external link <a> tag to be made red
  
  //form json request url
  if (window.location.search.indexOf('after') == -1) {
		if (window.location.search == "") {
			url = 'http://' + window.location.hostname + window.location.pathname + '.json?after=' + afterPost;
		} else {
			url = 'http://' + window.location.hostname + window.location.pathname + '.json'+window.location.search+'&after=' + afterPost;
		}
  } else {
    url = 'http://' + window.location.hostname + window.location.pathname + '.json' + window.location.search;	//not RES
  }
  
  //json request. Synchronous because "jqXHR" is reference in the return statement
  jqXHR = $.ajax({
    dataType: 'json',
    async: false,
    url: url
  });
  postArray = jqXHR.responseJSON.data.children;
  
  //loop through each reddit post retrieved 
  for (var i = 0; i < postArray.length; i++) {
    //get json from all the posts' comment pages
    $.getJSON('http://www.reddit.com' + postArray[i].data.permalink + '.json')
    //when done, traverse comments looking for riot
    .done(function (commentTree) {
      if (traverse(commentTree[1].data.children)) {	//if riot comment is found..
        selfPost = $('a[href="' + commentTree[0].data.children[0].data.permalink + '"]');
        decodedURL = $('<div/>').html(commentTree[0].data.children[0].data.url).text();//decode html symbols in url, specifically "&"
        externalPost = $('a[href="' + decodedURL + '"]');
        if (selfPost.length > 0) {
          makePostRed(selfPost.get(1));
        } 
        else if (externalPost.length > 0) {
          makePostRed(externalPost.get(externalPost.length - 1));
        }
      }
    });
  }
  return jqXHR.responseJSON.data.after;		//ID for the last comment
};

function trackComments(currentNum) {
  var allRiotComments = $('p>span.flair-riot');		//array of references to <p> tags that are riot comments
  var commentNum = currentNum;		//current comment number, start at 0 because no comment is navigated to by default.
  //if there are no comments, stop
  if (allRiotComments.length == 0) {
    return;
  }
  
  //doing this operation up front makes it faster the first time the up/down arrow is clicked
  $(allRiotComments[0]).is(':visible');
  
  //make button open nav on click
  $('#openRiotNav').click(function () {
    $('.riotNav').css({
      'display': 'block'
    });
  });
  //close button functionality
  $('.closeRiot').click(function () {
    $('.riotNav').css({
      'display': 'none'
    });
  });
  //Up/down arrow functionality
  $('.downRiot').click(function () {
    //remove 'comment minimized' alert
    $('.navAlert').css({
      'display': 'none'
    });
    //un-highlight previous comment
    if (commentNum != 0) {
      $(allRiotComments[commentNum - 1]).parent().parent().parent().get(0).style.setProperty('border-color', 'rgb(230, 230, 230)', 'important');
    }
    
	//update comment number -- if at last comment, go to 1st. Otherwise, go up 1.
    commentNum = (commentNum == allRiotComments.length) ? 1 : (commentNum + 1);
	
    if ($(allRiotComments[commentNum - 1]).is(':visible')) {
      //scroll to comment
      $('html,body').animate({
        scrollTop: $(allRiotComments[commentNum - 1]).offset().top - ($(window).height()) / 3
      }, 'slow');
      //highlight comment in red
      $(allRiotComments[commentNum - 1]).parent().parent().parent().get(0).style.setProperty('border-color', 'red', 'important');
    } 
    else {
      //if comment is minimized, it cannot be scrolled to. Alert user
      $('.navAlert').css({
        'display': 'block'
      });
    }
    //update counter
    $('.counterRiot').text(commentNum + '/' + allRiotComments.length);
  });
  
  $('.upRiot').click(function () {
    $('.navAlert').css({
      'display': 'none'
    });
    if (commentNum != 0) {
      $(allRiotComments[commentNum - 1]).parent().parent().parent().get(0).style.setProperty('border-color', 'rgb(230, 230, 230)', 'important');
    }
    
	//if at first comment or not yet at a comment (commentNum=0), go to last. Otherwise, go down 1.
    commentNum = (commentNum < 2) ? allRiotComments.length : (commentNum - 1);
    if ($(allRiotComments[commentNum - 1]).is(':visible')) {
      $('html,body').animate({
        scrollTop: $(allRiotComments[commentNum - 1]).offset().top - ($(window).height()) / 3
      }, 'slow');
      $(allRiotComments[commentNum - 1]).parent().parent().parent().get(0).style.setProperty('border-color', 'red', 'important');
    } 
    else {
      $('.navAlert').css({
        'display': 'block'
      });
    }
    $('.counterRiot').text(commentNum + '/' + allRiotComments.length);
  });
  //Change styling on arrows when clicked
  $('.downRiot,.upRiot').mousedown(function () {
    $(this).toggleClass('changed');
  });
  $('.downRiot,.upRiot').mouseup(function () {
    $(this).toggleClass('changed');
  });
  //update counter - only applies when trackComments is called again after more comments are loaded
  $('.counterRiot').text(commentNum + '/' + allRiotComments.length);
}
function traverse(obj) {
  var flag = 0;
  for (var i in obj) {
    //go through all comments in this level
    if (obj[i].data.author_flair_css_class == 'riot') {
      //return 1 if any riot comments are found
      return 1;
    } 
    else if (typeof (obj[i].data.replies) == 'object') {
      //if there are replies to this comment, traverse them as well
      flag = traverse(obj[i].data.replies.data.children);
      if (flag) {
        return 1;
      }
    }
  }
  return flag;
};