☰

IMDb Face Cake - get a better look at actor images

Make people's faces larger when you hover over their names on IMDb title pages

目前為 2015-09-11 提交的版本，檢視 最新版本。

// ==UserScript==
// @name        IMDb Face Cake - get a better look at actor images
// @namespace   driver8.net
// @description Make people's faces larger when you hover over their names on IMDb title pages
// @match       *://*.imdb.com/title/tt*/reference
// @match       *://*.imdb.com/title/tt*/
// @match       *://*.imdb.com/name/nm*
// @version     0.3
// @grant       GM_addStyle
// @require     https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js
// ==/UserScript==

var MULT = 8;
var IMG_WIDTH = 23 * MULT;
var IMG_HEIGHT = 30 * MULT;
var OFFSET_TOP = -40;
var OFFSET_LEFT = -6;
//var OFFSET_BOTTOM = 94;
var OFFSET_BOTTOM = 2;
var THUMB_OFFSET = -200; // -275
var OFFSET_MULTIPLIER = 0;
var IMDB_WIDTH = 640;
var IMDB_HEIGHT = 720;
var LEFT_SIDE = true;
var LOGGING = false;
var AND_BUTTS = false;

function log(msg) {
    if (LOGGING) console.log(msg);
}

AND_BUTTS && $('#tn15title > h1 > span:first').before($('<h1> and Butts </h1>').css({'display': 'inline'}));

var bigImages = [];
var bigDivs = [];
var thumbDivs = [];

//var $rows = $('table.cast tr.odd, table.cast tr.even');
var $rows = $('table.cast, table.cast_list').find('tr.odd, tr.even');
var $thumbs = $('.media_strip_thumb img, .mediastrip img, .mediastrip_big img, #primary-poster, .photo img');

function setUpRows() {
    $rows.each(function(idx) {
        var $hovaImg, $hovaDiv;
        var $el = $(this);
        var $hsImg = $el.find('td.hs img, td.primary_photo img');
        var hsSrc = $hsImg.attr('src');
        hsSrc = hsSrc.replace(/http:\/\/ia\.media-imdb\.com\/images\/([a-zA-Z0-9@]\/[a-zA-Z0-9@]+)\._V[0-9].+\.jpg/,
            'http://ia.media-imdb.com/images/$1._SX' + IMG_WIDTH + '_.jpg');
        $hovaImg = $('<img>').attr('src', hsSrc);
        $hovaDiv = $('<div></div>');
        $hovaDiv.append($hovaImg);
        $hovaDiv.attr('id', 'hova' + idx);
        $hovaDiv.addClass('hovaImg');
        var pos = $el.offset();
        var newPos = { 'top': pos.top + OFFSET_TOP, 'left': pos.left + OFFSET_LEFT - IMG_WIDTH };
        if (!LEFT_SIDE) {
            var trWidth = $el.outerWidth();
            newPos = { 'top': pos.top + OFFSET_TOP, 'left': pos.left - OFFSET_LEFT + trWidth };
        }
        $hovaDiv.offset(newPos);
        $hovaDiv.hide();
        $('body').append($hovaDiv);
        bigDivs[idx] = $hovaDiv;
    });
}

function setUpThumbs() {
    $thumbs.each(function(idx) {
        var $el = $(this);
        var thumbSrc = $el.attr('src');
        thumbSrc = thumbSrc.replace(/http:\/\/ia\.media-imdb\.com\/images\/([a-zA-Z0-9@]\/[a-zA-Z0-9@]+)\._V[0-9].+\.jpg/,
            'http://ia.media-imdb.com/images/$1._V1_SX' + IMDB_WIDTH + '_SY' + IMDB_HEIGHT + '_.jpg');
        var $hovaImg = $('<img>').attr('src', thumbSrc);
        var $hovaDiv = $('<div></div>').append($hovaImg).attr('id', 'hovat' + idx).addClass('hovaThumb');
        var pos = $el.offset();
        var height = $el.outerHeight();
        var newPos = { 'top': pos.top + height + OFFSET_BOTTOM, 'left': pos.left + THUMB_OFFSET + idx * OFFSET_MULTIPLIER };
        $hovaDiv.offset(newPos);
        $hovaDiv.hide();
        $('body').append($hovaDiv);
        thumbDivs[idx] = $hovaDiv;
    });
}

$rows.each(function(idx) {
    var $el = $(this);
    $el.mouseenter(function() {
        $el.addClass('trHova');
        if (!bigDivs[idx]) {
            setUpRows();
        }
        bigDivs[idx].show();
    });

    $el.mouseleave(function() {
        $el.removeClass('trHova');
        bigDivs[idx].hide();
    });
});

$thumbs.each(function(idx) {
    var $el = $(this);
    $el.mouseenter(function() {
        if (!thumbDivs[idx]) {
            setUpThumbs();
        }
        thumbDivs[idx].show();
    });

    $el.mouseleave(function() {
        thumbDivs[idx].hide();
    });
});

var userStyles =
    ".hovaImg, .hovaThumb { " +
    "position: absolute;" +
    "padding: 0px;" +
    "border-style: solid;" +
    "border-width: 2px;" +
//        "border-color: #00FF00;" +
    "border-color: #AAAAFF;" +
    "z-index: 4;" +
    "}" +
    ".hovaImg img {" +
    "width: " + IMG_WIDTH + "px;" +
    "display: block;" +
    "}" +
    ".hovaThumb img { display: block; }" +
    "tr.trHova {" +
    "background-color: #AAAAFF !important;" +
    "}" +
    "div#tn15content div.info div.info-content.block {" +
    //"width: 90% !important;" +
    "}" +
    "td.hs img {" +
    "height: auto !important;" +
    "width: auto !important;" +
    "max-width: 23px !important;" +
    "max-height: 32px !important;" +
    "}" +
    "";

GM_addStyle(userStyles);