Userscript for MetaFilter sites - Displays the number of new posts and comments since your last visit.

metafilter-new-posts-and-comments.user.js

// ==UserScript==
// @name        MetaFilter - New Posts and Comments
// @namespace   http://www.xqwzts.com
// @description Userscript for MetaFilter sites - Displays the number of new posts and comments since your last visit.
// @include     http://www.metafilter.com/*
// @include     https://www.metafilter.com/*
// @include     http://ask.metafilter.com/*
// @include     https://ask.metafilter.com/*
// @include     http://metatalk.metafilter.com/*
// @include     https://metatalk.metafilter.com/*
// @include     http://music.metafilter.com/*
// @include     https://music.metafilter.com/*
// @include     http://fanfare.metafilter.com/*
// @include     https://fanfare.metafilter.com/*
// @version     1.0.0
// @grant       none
// ==/UserScript==

// The number of new posts/comments since last visit can be found with 
// an ajax request to http<s>://<subsite>.metafilter.com/newcount.mefi
// We do that, and display the results in simple badges on the menu / navigation bar.

$(document).ready(function() {
  // build the url from our current location:
  var url = window.location.protocol + '//' + window.location.hostname + '/newcount.mefi';
  // the navigation element we'll be attaching to:
  var navTarget = $('nav.primary > div.container > ul > li.current');
  // the inline styling we'll be using on our badge:
  var inlineStyling = 'display: inline-block; background: none repeat scroll 0% 0% #88C2D8; color: #065A8F; text-align: center; position: absolute; right: -4px; top: 0px; font-size: 11px; line-height: 15px; min-width: 15px; height: 15px; padding: 0px 3px; border-radius: 8px;';
  // the new badge element we're generating:
  var countElement;

  // called with our results: creates or edits the countElement with the counters in it.
  displayCounts = function(data) {
    if (!data) return;
    if (!data.new) return;

    var newPosts = data.new.posts || 0;
    var newComments = data.new.comments || 0;

    if (countElement) {
      // if we already have a countELement just edit the counts in it.
      countElement.innerHTML = newPosts + '/' + newComments;
    } else {
      // else create a new span to hold the counts
      countElement = $('<span style="' + inlineStyling + '">' + newPosts + '/' + newComments + '</span>');
      // and append it to the target nav
      countElement.appendTo(navTarget);
    }
  }

  // called if the ajax request fails
  handleError = function(error) {
    console.error(error);
  }

  // make the request
  $.ajax({
    url: url,
    dataType: 'json'
  })
  .done(displayCounts)
  .fail(handleError);
});