Skip to content

Instantly share code, notes, and snippets.

@cherenkov
Created October 10, 2012 08:43
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 cherenkov/3864148 to your computer and use it in GitHub Desktop.
Save cherenkov/3864148 to your computer and use it in GitHub Desktop.
// ==UserScript==
// @name fb-thumbnail-selector
// @namespace http://d.hatena.ne.jp/Cherenkov/
// @include http://www.facebook.com/*
// @include https://www.facebook.com/*
// @grant GM_addStyle
// @grant GM_log
// @version 0.1
// @date 20121010
// ==/UserScript==
function log(m) {
if (unsafeWindow.console) {
unsafeWindow.console.log.apply(this, arguments);
} else {
console.log.apply(this, arguments);
}
}
// sample link:
// http://jigokuno.com/
// http://feeds.feedburner.com/Octocats
/*
//debug: auto input url
try {
setTimeout(function(){
var textarea = document.querySelector('.mentionsTextarea');
if (textarea) {
//var event = document.createEvent('MouseEvents');
//event.initEvent('click', true, true);
//textarea.dispatchEvent(event);
//textarea.value = 'http://jigokuno.com/';
textarea.value = 'http://feeds.feedburner.com/Octocats';
}
}, 2000);
} catch (e) {}
*/
function changeThumbnail(newUrl) {
document.querySelector('form:not(.hidden_elem) .UIThumbPager_Thumbs img:not(.UIThumbPager_Hidden)').classList.add('UIThumbPager_Hidden');
document.querySelector('form:not(.hidden_elem) .UIThumbPager_Thumbs img[src="' + newUrl + '"]').classList.remove('UIThumbPager_Hidden');
var param = document.querySelector('form:not(.hidden_elem) input[name="attachment[params][images][0]"][value*="safe_image.php"]');
param.value = newUrl;
}
var btn = document.createElement('div');
btn.id = 'GMfts_btn';
btn.innerHTML = '⬚';
btn.className = 'GMfts_hide';
document.body.appendChild(btn);
btn.onclick = function() {
//viewerを複数生成しないようにする。
var viewer = document.getElementById('GMfts_viewer');
if (viewer) {
viewer.parentNode.removeChild(viewer);
return;
}
var div = document.createElement('div');
div.id = 'GMfts_viewer';
var df = document.createDocumentFragment();
Array.forEach(document.querySelectorAll('form:not(.hidden_elem) .UIThumbPager_Thumbs img'), function(e) {
var img = e.cloneNode(true);
img.className = '';
img.setAttribute('style', '');
img.onclick = function() {
var newUrl = this.src;
changeThumbnail(newUrl);
setTimeout(function(){
div.classList.add('GMfts_hide');
var viewer = document.getElementById('GMfts_viewer');
viewer.parentNode.removeChild(viewer);
}, 200);
}
df.appendChild(img);
});
div.appendChild(df)
document.body.appendChild(div);
}
//FB側で一度表示したページをキャッシュされると、MutationObserverで観測できない?
//var MutationObserver = unsafeWindow.MutationObserver || unsafeWindow.WebKitMutationObserver || unsafeWindow.MozMutationObserver;
// https://developer.mozilla.org/en-US/docs/DOM/MutationObserver
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
//console.log(mutation)
for (var i = 0, n = mutation.addedNodes.length; i < n; i++) {
var e = mutation.addedNodes[i];
if (e.querySelector && e.querySelector('.UIShareStage_HasImage')) {
var btn = document.getElementById('GMfts_btn');
btn.classList.remove('GMfts_hide');
e.querySelector('.UIThumbPagerControl_Text').appendChild(btn);
}
if (e.parentNode && e.parentNode.classList && e.parentNode.classList.contains('UIThumbPagerControl_PageNumber_Total')) {
document.querySelector('#GMfts_btn').textContent = e.textContent;
}
}
});
});
observer.observe(document.querySelector('#pagelet_composer, .timelineUnitContainer'), { childList: true, subtree: true, attributes: true });
GM_addStyle([
'.GMfts_hide { display: none; }',
'#GMfts_viewer { position: fixed; top: 50px; right: 10px; z-index: 999; background-color: azure; border: 4px solid sienna; width: 600px; height: 350px; overflow: scroll;}',
'#GMfts_viewer img { max-width: 100px; vertical-align: middle; border: 2px solid white; margin: 1px;}',
'#GMfts_viewer img:hover { border-color: red; }',
'#GMfts_btn {',
'color: white; font-size: 18px; width: 25px; padding: 0 4px; margin-left: 8px;',
'text-align: center; display: inline; border-radius: 4px; vertical-align: middle;',
'background: -moz-linear-gradient(top, #3e779d, #65a9d7); background: -webkit-linear-gradient(top, #3e779d, #65a9d7);',
'}',
'#GMfts_btn:hover { border-top-color: #28597a; background: #28597a; color: #ccc; }',
'#GMfts_btn:active { border-top-color: #1b435e; background: #1b435e; }',
].join(''));
@cherenkov
Copy link
Author

firefoxにグリモンを入れていて暇な人向け。
上記のuser.jsファイルをfirefoxにドラッグアンドドロップでインストール。

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