MAL Season Friends Watching

mal-season-friends-watching.user.js

// ==UserScript==
// @name     MAL Season Friends Watching
// @version  1.0
// @match    http://myanimelist.net/anime/season
// @grant    none
// @require  https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js
// @require  https://cdn.rawgit.com/patik/within-viewport/1.0.0/withinviewport.js
// @require  https://cdn.rawgit.com/patik/within-viewport/1.0.0/jquery.withinviewport.js
// @require  https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js
// ==/UserScript==

(function($, _, window, withinviewport) {
    'use strict';

    // Enlarge viewport
    withinviewport.defaults.bottom  = -1080;

    var loadFriendsStatus = function () {
        var $visibleAnime = $('.seasonal-anime-list .seasonal-anime:within-viewport');
        $visibleAnime.each(function () {
            var $animeCard = $(this);
            if ($animeCard.data('load_friends_status_skip')) {
                return true;  // continue
            }
            $animeCard.data('load_friends_status_skip', true);

            var statsUrl = $animeCard.find('.link-title').attr('href') + '/stats';
            $.get(statsUrl, function (data) {
                var $avatars = $(data).find('.table-recently-updated tr td:contains("Watching")').siblings('td:first-child').find('.image-member');
                if ($avatars.length) {
                    var $avatarsPane = $('<div style="position: absolute; bottom: 25px; right: 1px; z-index: 3; max-width: 165px; background: white;"></div>');
                    $avatars.each(function () {
                        var $avatarItem = $('<div style="display: inline-block; width: 30px; height: 30px; margin-left: 2px; background-size: cover; background-repeat: no-repeat; background-position: top center;"></div>');
                        $avatarItem.css('background-image', $(this).css('background-image'));
                        $avatarsPane.append($avatarItem);
                    });
                    $animeCard.prepend($avatarsPane);
                }
            });
        });
    };

    $(function () {
        loadFriendsStatus();
        $(window).scroll(_.debounce(loadFriendsStatus, 400));
    });

})(jQuery.noConflict(true), _.noConflict(), window, withinviewport);