在InoReader(RSS阅读器)中用更大的版本替换Tumblr,Pinterest,Flickr图像

时间:2013-07-03 03:45:13

标签: javascript greasemonkey rss-reader

我正在制作一个Greasemonkey脚本,用于替换InoReader中更大版本的Tumblr,Pinterest,Flickr,Facebook和Webstagram RSS源中的图像。

我已成功在Google阅读器中为Tumblr和Pinterest使用以下脚本。想将它们移植到InoReader并将它们全部合并到一个脚本中。

旧版Google阅读器 Tumblr 脚本:

// ==UserScript==
// @name           Big Photos from Tumblr on Google Reader
// @include        http://*.google.com/reader/view/*
// @include        https://*.google.com/reader/view/*
// ==/UserScript==

document.getElementById("chrome").addEventListener("DOMNodeInserted", function (e) {
if (e.target.tagName && e.target.tagName == "DIV" && /entry\s?/.test(e.target.className)) {
    var t = e.target.getElementsByTagName("img");
    for (var n in t) {
        var r = t[n];
        r.style.maxHeight = "1080px";
        var i = r.src;
        if (i.indexOf("tumblr") > -1) {
            r.src = r.src.replace("_500.jpg", "_1280.jpg");
            r.onerror = function () {
                this.src = this.src.replace("_1280.jpg", "_500.jpg")
            }
        }
    }
}
}, false)

旧版Google阅读器 Pinterest 脚本:

// ==UserScript==
// @id             greader-pinteresturlreplacer
// @name           Google Reader - Pinterest URL Replacer
// @version        1.3
// @include        https://www.google.com/reader/*
// ==/UserScript==

document.getElementById("chrome").addEventListener("DOMNodeInserted", function (e) {
var t = e.target;
if (t.tagName && t.tagName == "DIV" && /entry\b/i.test(t.className)) {
    var n = t.getElementsByTagName("img");
    for (var r in n) {
        var i = n[r];
        if (/pinterest\.com.*_b\.\w+$/.test(i.src) || /pinterest\.com\/192x\//.test(i.src)) {
            i.style.width = "inherit";
            i.style.height = "inherit";
            i.src = i.src.replace(/_b\.(\w+)$/, ".$1");
            i.src = i.src.replace(/\.com\/192x\//, ".com/550x/")
        }
    }
}
}, false);
document.getElementById("chrome").addEventListener("DOMNodeInserted", function (e) {
var t = e.target;
if (t.tagName && t.tagName == "DIV" && /entry\b/i.test(t.className)) {
    var n = t.getElementsByTagName("img");
    for (var r in n) {
        var i = n[r];
        if (/pinimg\.com.*_b\.\w+$/.test(i.src) || /pinimg\.com\/192x\//.test(i.src)) {
            i.style.width = "inherit";
            i.style.height = "inherit";
            i.src = i.src.replace(/_b\.(\w+)$/, ".$1");
            i.src = i.src.replace(/\.com\/192x\//, ".com/550x/")
        }
    }
}
}, false)


以下是为Facebook,Webstagram和Flickr使用Greasemonkey InoReader脚本。

InoReader Facebook:

// ==UserScript==
// @id             inoreaderfacebookthumbs
// @name           InoReader Facebook Thumbnail Replacer
// @version        1.0
// @include        https://inoreader.com/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==

/*- The @grant directive is needed to work around a design change
introduced in GM 1.0.   It restores the sandbox.
*/

/* Facebook Thumbnails */ 
 waitForKeyElements (
"#reader_pane div.article_full_contents div.article_content a.underlink img",
swapOutFbcdnThumnails
);

function swapOutFbcdnThumnails (jNode) {
/*-- Change src from:
    https://fbcdn-photos- ... _s.jpg
    to:
    https://fbcdn-sphotos- ... _n.jpg
*/
var newSrc      = jNode[0].src.replace (/fbcdn\-photos\-/, "fbcdn-sphotos-");
newSrc          = newSrc.replace (/_s\.jpg$/, "_n.jpg");
jNode[0].src    = newSrc;
}

InoReader Webstagram:

// ==UserScript==
// @id             inoreaderwebstagramthumbs
// @name           InoReader Webstagram Thumbnail Replacer
// @version        1.0  
// @include        https://inoreader.com/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==

/* Webstagram Thumbnails */ 
waitForKeyElements (
"#reader_pane div.article_full_contents div.article_content a.underlink img",
swapOutWebstgmThumnails
);

function swapOutWebstgmThumnails (jNode) {
/*-- Change src from:
    https://*.amazonaws.com ... _6.jpg
    to:
    https://*.amazonaws.com ... _7.jpg
*/
var newSrc      = jNode[0].src.replace (/amazonaws/, "amazonaws");
newSrc          = newSrc.replace (/_6\.jpg$/, "_7.jpg");
jNode[0].src    = newSrc;
}

InoReader Flickr:

// ==UserScript==
// @id             inoreaderflickrthumbsreplacer
// @name           InoReader Flickr Thumbnail Replacer
// @version        1.0
// @include        https://inoreader.com/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==

/* Flickr Thumbnails */ 
waitForKeyElements (
"#reader_pane div.article_full_contents div.article_content a.underlink img",
swapOutFlickrThumnails
);

function swapOutFlickrThumnails (jNode) {
/*-- Change src from:
    https://*.staticflickr ... _m.jpg
    to:
    https://*.staticflickr ... _b.jpg
*/
var newSrc      = jNode[0].src.replace (/staticflickr/, "staticflickr");
newSrc          = newSrc.replace (/_m\.jpg$/, "_b.jpg");
jNode[0].src    = newSrc;
}

以下是每个的示例RSS Feed:TumblrFlickrPinterestFacebookWebstagram

如何合并这些脚本? 提前谢谢。

1 个答案:

答案 0 :(得分:1)

忘记旧的2个脚本。他们使用DOMNodeInserted which is deprecated

合并InoReader.com脚本非常简单。它们都为waitForKeyElements()使用相同的选择器,因此仅使用if()语句来确定要在回调函数中应用哪个正则表达式。

这样的事情应该这样做:

// ==UserScript==
// @name        InoReader Thumbnail Replacer
// @version     1.0
// @include     http://inoreader.com/*
// @include     http://www.inoreader.com/*
// @include     https://inoreader.com/*
// @include     https://www.inoreader.com/*
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require     https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant       GM_addStyle
// ==/UserScript==

waitForKeyElements (
    "#reader_pane div.article_full_contents div.article_content a.underlink img",
    swapOutThumbnails
);

function swapOutThumbnails (jNode) {
    var imgSrc      = jNode[0].src;

    //-- The necessary regex changes depending on where the images are hosted.

    if (/staticflickr/.test (imgSrc) ) {
        /*-- Change src from:   https://*.staticflickr ... _m.jpg
                          to:   https://*.staticflickr ... _b.jpg
        */
        imgSrc      = imgSrc.replace (/_m\.jpg$/, "_b.jpg");
    }
    else if (/amazonaws/.test (imgSrc) ) {
        /*-- Change src from:   https://*.amazonaws.com ... _6.jpg
                          to:   https://*.amazonaws.com ... _7.jpg
        */
        imgSrc      = imgSrc.replace (/_6\.jpg$/, "_7.jpg");
    }
    else if (/fbcdn\-photos/.test (imgSrc) ) {
        /*-- Change src from:   https://fbcdn-photos- ... _s.jpg
                          to:   https://fbcdn-sphotos- ... _n.jpg
        */
        imgSrc      = imgSrc.replace (/fbcdn\-photos\-/, "fbcdn-sphotos-");
        imgSrc      = imgSrc.replace (/_s\.jpg$/, "_n.jpg");
    }
    else if (/pinimg\.com.*_b\.\w+$/.test (imgSrc) || /pinimg\.com\/192x\//.test (imgSrc) ) {
        /*-- Change src from:   http://*.pinimg.com/192x/...
                          to:   http://*.pinimg.com/550x/...
        */
        imgSrc      = imgSrc.replace(/\.com\/192x\//, ".com/550x/");
    }
    else if (/pinterest\.com.*_b\.\w+$/.test (imgSrc) || /pinterest\.com\/192x\//.test (imgSrc) ) {
        /*-- Change src from:   http://*.pinterest.com/192x/...
                          to:   http://*.pinterest.com/550x/...
        */
        imgSrc      = imgSrc.replace(/\.com\/192x\//, ".com/550x/");
    }

    jNode[0].src    = imgSrc;
}

/* Tumblr */
waitForKeyElements (
    "#reader_pane div.article_full_contents div.article_content img", swapOutThumbnails2
);

function swapOutThumbnails2 (jNode) {
    var imgSrc      = jNode[0].src;
    if (/tumblr/.test (imgSrc)) {
        imgSrc      = imgSrc.replace (/_500\.jpg$/, "_1280.jpg");
        jNode[0].addEventListener ("error", tumblrImgErrFix, false);
    }
    jNode[0].src    = imgSrc;
}

function tumblrImgErrFix () {
    this.src        = this.src.replace ("_1280.jpg", "_500.jpg");
    console.log ("*** Img Err fix.");
}