Skip to content

Instantly share code, notes, and snippets.

@Griever
Created April 28, 2009 10:03
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Griever/103061 to your computer and use it in GitHub Desktop.
Save Griever/103061 to your computer and use it in GitHub Desktop.
// ==UserScript==
// @name imitationLightbox
// @description Simple image viewer.
// @namespace http://d.hatena.ne.jp/Griever/
// @author Griever
// @gist https://gist.github.com/103061
// @license MIT License
// @compatibility Firefox 4, Chrome, Opera 11.50
// @include http://*
// @include https://*
// @include file:///*
// @run-at document-start
// @noframes
// @version 0.0.8 くらい
// ==/UserScript==
(function(){
var REMOVE_SCROLL = true; // 画像を閉じた後で元の位置にスクロールする
/* SITEINFO の書き方
name, exampleUrl
省略可
selector
対象となるリンクや画像を指定する CSS Selector
全てのサイトでチェックするのでしっかりと書く
before, after
URL.replace(before, after) として使う
before には正規表現、after には関数も使える
before を省略すると置き換えしない
after を省略すると "" として扱う
*/
var SITEINFO = [
{
name : "Google Images"
,selector: 'a[href*="/imgres?imgurl=http"]'
,before : /^.*?imgurl=(https?:\/\/.+?)\&.*?$/i
,after : "$1"
,exampleUrl: ""
},
{
name : "Bing Images"
,selector: 'a[href^="/images/search?"] > img[src*="mm.bing.net/images/thumbnail.aspx?"][src*="url="]'
,before : /^.*\burl=/
,after : ""
,exampleUrl: "http://www.bing.com/images/search?q=Firefox"
},
{
name : "Naver Images"
,selector: 'a > img[src*=".search.naver.jp/?/jthumb/"]'
,before : /^http:\/\/tc[0-9]*\.search\.naver\.jp\/\?\/jthumb\/(.*?)\/[cr]\.[0-9x]+$/
,after : "$1"
,exampleUrl: "http://search.naver.jp/image?q=Firefox"
},
{
name : "Naver Images 2"
,selector: 'a > img[src*=".search.naver.jp/?/kaze/"]'
,before : /^http:\/\/tc[0-9]*\.search\.naver\.jp\/\?\/(kaze\/.*?\/USER\/.*?)\/[cr]\.[0-9x]+$/
,after : "http://imgcc.naver.jp/$1"
,exampleUrl: "http://search.naver.jp/image?q=Firefox"
},
// {
// name : "f.hatena.ne.jp オリジナルが.jpgじゃないと NG"
// ,selector: 'img[src^="http://cdn-ak.f.st-hatena.com/images/fotolife/"][src*="_120."]'
// ,before : "_120"
// ,after : ""
// ,exampleUrl: "http://f.hatena.ne.jp/Griever/"
// },
// {
// name : "Yahoo! News"
// ,selector: 'a > img[src*=".c.yimg.jp/"][src$="-thumb.jpg"]'
// ,before : "-thumb."
// ,after : "-view."
// ,exampleUrl: "http://dailynews.yahoo.co.jp/fc/domestic/0311eq_reconstruction/?1308554794"
// },
{
name : "wikipedia"
,selector: 'a.image > img[src^="http://upload.wikimedia.org/wikipedia/commons/"]'
,before : /(commons)(?:\/thumb)?(\/\w+\/\w+\/.*?\.(?:svg|png|jpe?g|gif|bmp))(?:\/\d+px.*)?/i
,after : "$1$2"
,exampleUrl: "http://ja.wikipedia.org/wiki/%E3%82%AF%E3%83%AA%E3%82%A8%E3%82%A4%E3%83%86%E3%82%A3%E3%83%96%E3%83%BB%E3%82%B3%E3%83%A2%E3%83%B3%E3%82%BA"
},
{
name : "Livedoor News"
,selector: 'a[href*=".livedoor.com"] > img[src*="/newsimage/"][src*="-s."],' +
'a[href*=".livedoor.com"] > img[src*="/newsimage/"][src*="-m."],' +
'a[href*=".livedoor.com"] > img[src*="/newsimage/"][src*="-st."]'
,before : /\-(?:st?|m)(\.jpg)/i
,after : "$1"
,exampleUrl: "http://news.livedoor.com/topics/detail/5571382/"
},
{
name : "itmedia.co.jp"
,selector: 'a[href^="http://image.itmedia.co.jp/l/im/"]'
,before : "/l/im"
,after : ""
,exampleUrl: "http://www.itmedia.co.jp/news/articles/1106/24/news087.html"
},
{
name : "news.kakaku.com"
,selector: 'a[href^="http://news.kakaku.com/prdnews/"][href*="/imageno="] > img[src*="prdnews/T"]'
,before : "prdnews/T"
,after : "prdnews/"
,exampleUrl: "http://news.kakaku.com/prdnews/cd=pc/ctcd=0030/id=15664/"
},
{
name : "magazine.kakaku.com"
,selector: 'a[href="javascript:void(0);"] > img[src$="_s.jpg"]'
,before : "_s.jpg"
,after : ".jpg"
,exampleUrl: "http://magazine.kakaku.com/mag/pc/id=411/"
},
{
name : "magazine.kakaku.com 2"
,selector: 'a[href="javascript:void(0);"] > img[src^="http://img.kakaku.com/images/magazinem/org/kakaku/"]'
,before : ".jpg"
,after : "l.jpg"
,exampleUrl: "http://magazine.kakaku.com/mag/pc/id=422/"
},
{
name : "bbs.kakaku.com"
,selector: 'img[src*=".kakaku.k-img.com/images/"][src$="_s.jpg"], img[src^="http://img.kakaku.com/images/Review/"][src$="_s.jpg"]'
,before : "_s.jpg"
,after : "_m.jpg"
,exampleUrl: "http://bbs.kakaku.com/bbs/K0000171147/SortID=13148202/"
},
{
name : "akiba.kakaku.com"
,selector: 'a[href="#"] > img[src^="http://image.akiba.kakaku.com/data/imgs/saved/"]'
,before : /\/saved(\/.*?)(?:_[0-9])?(\.jpg$)/i
,after : "$1$2"
,exampleUrl: "http://akiba.kakaku.com/pc/1106/21/113000.php"
},
{
name : "coneco.net"
,selector: 'img[src^="http://img2.coneco.net/review/"][src*="s.jpg?"]'
,before : "s.jpg"
,after : "l.jpg"
,exampleUrl: "http://club.coneco.net/user/15562/review/53283/"
},
{
name : "akiba-pc.watch.impress.co.jp"
,selector: 'a[href^="image/"][href$=".html"] > img[src$=".gif"]'
,before : ".gif"
,after : ".jpg"
,exampleUrl: "http://akiba-pc.watch.impress.co.jp/hotline/20110416/etc_ocz.html"
},
{
name : "journal.mycom.co.jp"
,selector: 'a[href^="/photo/news/"][href*="images/"][href$="l.jpg"] > img[src^="images/"]'
,before : /^http:\/\/journal\.mycom\.co\.jp\/(.*?\/images\/.*?)(\.(?:jpe?g|gif|png|bmp)\b).*?$/i
,after : "http://j.mycom.jp/$1l$2"
,exampleUrl: "http://akiba-pc.watch.impress.co.jp/hotline/20110416/etc_ocz.html"
},
{
name : "www.forest.impress.co.jp"
,selector: 'img.resource[src*="_s."]'
,before : /_s\.(?:jpe?g|gif|png|bmp)/
,after : ".jpg"
,exampleUrl: "http://www.forest.impress.co.jp/docs/news/20110428_443024.html"
},
{
name : "asablo.jp"
,selector: 'a[href^="/blog/imgview/"][href$=".html"][onclick]'
,before : /\/imgview\/(.*\.(?:jpe?g|gif|png|bmp))\.html/
,after : "/img/$1"
,exampleUrl: "http://puppet.asablo.jp/blog/2010/09/18/5353900"
},
{
name : "movapic.com"
,selector: 'img[src^="http://image.movapic.com/pic/s_"]'
,before : "s_"
,after : "m_"
,exampleUrl: "http://movapic.com/"
},
{
name : "www.memetodo.co.cc"
,selector: 'a[href*="/s1600-h/"]'
,before : "/s1600-h/"
,after : "/s1600/"
,exampleUrl: "http://www.memetodo.co.cc/2011/06/javascriptie.html"
},
{
name : "pc.usy.jp"
,selector: 'a[href^="http://pc.usy.jp/wiki/index.php?"][href*=".jpg&refer="],' +
'a[href^="http://pc.usy.jp/wiki/index.php?"][href*=".JPG&refer="]'
,before : "info"
,after : "open"
,exampleUrl: "http://pc.usy.jp/wiki/131.html"
},
{
name : "up.pandoravote.net"
,selector: '#main a[href^="/up"] > img[src*="/thumb/"]'
,before : "/thumb/"
,after : "/img/"
,exampleUrl: "http://up.pandoravote.net/up14/"
},
{
name : "gazo.pandoravote.net"
,selector: 'a[href^="dlreg.php?"] > img[src^="thumb/"][src$="s.jpg"]'
,before : /\/thumb\/(.*?)s(\.jpg)$/i
,after : "/src/$1$2"
,exampleUrl: "http://gazo.pandoravote.net/img.html"
},
{
name : "image.i-bbs.sijex.net"
,selector: 'img[src^="http://image.i-bbs.sijex.net/bbs/"][src$="m.jpg"]'
,before : "m.jpg"
,after : "o.jpg"
,exampleUrl: ""
},
{
name : "bbs.avi.jp"
,selector: 'img[src^="http://bbs.avi.jp/photo1/"]'
,before : /\.(jpe?g|png|gif|bmp)/i
,after : "-pc.$1"
,exampleUrl: ""
}
];
var MICROFORMAT = {
name : "MICROFORMAT"
,before : /([a-z:]+:\/\/\/?.*?\.(?:jpe?g|gif|png|bmp)\b|data:image\/\w+\;base64\,[\w/+=]+|http:\/\/img[0-9]?\.blogs\.yahoo\.co\.jp\/.*?\/img_[0-9_]+)/i
,selector: ['a[href$=".bmp"], a[href$=".BMP"], a[href*=".bmp?"], a[href*=".BMP?"], '
,'a[href$=".gif"], a[href$=".GIF"], a[href*=".gif?"], a[href*=".GIF?"], '
,'a[href$=".jpeg"], a[href$=".JPEG"], a[href*=".jpeg?"], a[href*=".JPEG?"], '
,'a[href$=".jpg"], a[href$=".JPG"], a[href*=".jpg?"], a[href*=".JPG?"], '
,'a[href$=".png"], a[href$=".PNG"], a[href*=".png?"], a[href*=".PNG?"], '
,'a[href*=".bmp&"], a[href*=".BMP&"], a[href*=".bmp."], a[href*=".BMP."], '
,'a[href*=".gif&"], a[href*=".GIF&"], a[href*=".gif."], a[href*=".GIF."], '
,'a[href*=".jpeg&"], a[href*=".JPEG&"], a[href*=".jpeg."], a[href*=".JPEG."], '
,'a[href*=".jpg&"], a[href*=".JPG&"], a[href*=".jpg."], a[href*=".JPG."], '
,'a[href*=".png&"], a[href*=".PNG&"], a[href*=".png."], a[href*=".PNG."], '
,'a[href*="data:image/bmp;base64,"], a[href*="data:image/BMP;base64,"], '
,'a[href*="data:image/gif;base64,"], a[href*="data:image/GIF;base64,"], '
,'a[href*="data:image/jpeg;base64,"], a[href*="data:image/JPEG;base64,"], '
,'a[href*="data:image/jpg;base64,"], a[href*="data:image/JPG;base64,"], '
,'a[href*="data:image/png;base64,"], a[href*="data:image/PNG;base64,"]'].join("")
}
var imitationLightbox = {
SITEINFO: SITEINFO,
REMOVE_SCROLL: true,
MICROFORMAT: MICROFORMAT,
init: function() {
this.allSelector = this.SITEINFO.map(function(info) { return info.selector }).join(", ");
document.addEventListener("click", this, true);
document.addEventListener((window.chrome ? "keydown" : "keypress"), this, true);
document.addEventListener("error", this, true);
var css = window.opera?
this.MICROFORMAT.selector + '{ border: red 1px dashed !important; display: inline-block; }' +
this.allSelector + '{ border: gold 2px dashed !important; display: inline-block; }' :
this.MICROFORMAT.selector + '{ outline: red 1px dashed !important; display: inline-block; }' +
this.allSelector + '{ outline: gold 2px dashed !important; display: inline-block; }';
if (document.body) {
addStyle(css);
} else {
document.addEventListener("DOMContentLoaded", function(event) {
addStyle(css);
}, false);
}
},
handleEvent: function(event) {
switch(event.type) {
case "click": this.onClick(event); break;
case "error": this.onError(event); break;
case "keypress": this.onKeypress(event); break;
case "keydown": this.onKeypress(event); break;
}
},
onKeypress: function(event) {
if (event.keyCode == 27 && !event.shiftKey && !event.ctrlKey && !event.altKey) {
Array.prototype.slice.call(document.getElementsByClassName("imitation-lightbox-image")).forEach(function(e) {
e.parentNode.removeChild(e);
});
event.preventDefault();
event.stopPropagation();
}
},
onError: function(event) {
var elem = event.target;
if (elem.classList.contains("imitation-lightbox-image")) {
elem.parentNode.removeChild(elem);
event.stopPropagation();
}
},
onClick: function(event) {
if (event.button != 0 || event.ctrlKey || event.shiftKey || event.altKey) return;
var elem = event.target;
if (!elem.classList) return;
var doc = document;
var win = window;
if (elem.classList.contains("imitation-lightbox-image")) {
if (!(win.frameElement instanceof HTMLIFrameElement) && this.REMOVE_SCROLL) {
win.scrollTo(parseInt(elem.style.left, 10), parseInt(elem.style.top, 10));
}
elem.parentNode.removeChild(elem);
event.preventDefault();
event.stopPropagation();
return;
}
var url = this.getNewImageURL(elem, doc);
if (!url) return;
event.preventDefault();
event.stopPropagation();
var img = doc.createElement("img");
img.src = url;
img.setAttribute("alt", "\(^o^)/");
img.setAttribute("class", "imitation-lightbox-image");
img.style.cssText = "position:absolute; z-index:20000; border:1px solid blue; max-width:100%;";
img.style.MozBoxSizing =
img.style.WebKitBoxSizing =
img.style.OBoxSizing =
img.style.boxSizing = "border-box";
img.style.top = win.pageYOffset + "px";
img.style.left = win.pageXOffset + "px";
img.style.maxWidth = "100%";
img.style.maxHeight = Math.max(doc.documentElement.scrollHeight, win.innerHeight) + "px";
(doc.body||doc.documentElement).appendChild(img);
},
getNewImageURL: function(aElement, aDocument) {
if (!machesSelector(aElement, 'a, a *, [href], [src], [data]'))
return '';
var url = "";
var elem = aElement;
var doc = aDocument || elem.ownerDocument;
for (var i = 0; i < 3; i++) {
if (machesSelector(elem, 'body,div,p,td,th,li,dt,dd,h1,h2,h3,h4,h5,h6'))
break;
if (machesSelector(elem, this.allSelector))
if (url = elem.href || elem.src || elem.data)
break;
elem = elem.parentNode;
};
if (!url) {
elem = doc.evaluate(
'ancestor-or-self::a', aElement, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (elem && this.MICROFORMAT.before.test(this.replaceUrl(elem.href))) {
this.lastInfo = this.MICROFORMAT;
return RegExp.$1;
}
return "";
}
url = this.decode(url);
for (var i = 0, info; info = this.SITEINFO[i]; i++) {
if (machesSelector(elem, info.selector)) {
var newURL = url.replace(info.before, info.after);
if (newURL === url) {
log("URL の置き換えに失敗しました");
}
this.lastInfo = info;
return newURL;
}
};
return "";
},
decode: function(str) {
try {
return decodeURIComponent(str);
} catch (e) {}
return str;
},
replaceUrl: function(url) {
return this.decode(url).replace(/\/(?:ime\.nu|pinktower\.com)/i, "");
},
};
imitationLightbox.init();
function machesSelector(elem, selector) {
if ("mozMatchesSelector" in elem)
return elem.mozMatchesSelector(selector);
if ("webkitMatchesSelector" in elem)
return elem.webkitMatchesSelector(selector);
if ("oMatchesSelector" in elem)
return elem.oMatchesSelector(selector);
return false;
}
function $(id) { return document.getElementById(id); }
function $A(args) { return Array.prototype.slice.call(args); }
function log(){
if (typeof GM_log == "function")
GM_log($A(arguments))
else if (typeof console == "object" && console.log)
console.log($A(arguments));
}
function addStyle(css) {
var style = document.createElement('style');
style.type = 'text/css';
style.appendChild(document.createTextNode(css+''));
return (document.getElementsByTagName('head')[0] || document.body).appendChild(style);
}
})();
@Griever
Copy link
Author

Griever commented Oct 14, 2010

Firefox, Opera, Chrome で動くように書いたつもり。
Chrome か Opera で拡張子.js で実行するとページ読み込み前から動作する

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment