exsidas
BANNED | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
/*Initialization Code*/
// Увеличивать размеры изображений из контекстного меню на странице, от 14.03.2014. ................................
(function g() {
var imgZoom = 170; // на сколько увеличить изображение из меню
var scrollZoom = 20; // на сколько увеличивать/уменьшать колесиком мыши
var scrollTop = 1; // или -1, переключение направление прокрутки для увеличение колёсиком
// добавить новый пункт в меню изображений ....
var contextMenu = document.getElementById("contentAreaContextMenu");
var menuitem = contextMenu.appendChild(document.createElement("menuitem")); // как последний пункт меню
menuitem.setAttribute("label", "Увеличить размер");
addDestructor(function() contextMenu.removeChild(menuitem));
// отслеживать открытие контекстного меню на странице ....
addEventListener("popupshowing", function(e) {
menuitem.hidden = !gContextMenu.onImage; // скрывать пункт если не контекстное меню изображений
if ( !gContextMenu.onImage ) return;
// получить координаты и размеры изображения
var trg = e.target.triggerNode;
g.win = trg.ownerDocument.defaultView;
g.rect = trg.getBoundingClientRect();
}, true, contextMenu);
// если клик или команда на пункте меню ....
menuitem.setAttribute("oncommand", "this.run();");
menuitem.run = function() {
var img = gContextMenu.target; // получить изображение
// создать и открыть всплывающую подсказку с увеличенным изображением над изображением ....
var tooltip = gBrowser.appendChild(document.createElement("tooltip")), tts = tooltip.style;
tooltip.setAttribute("onpopuphiding", "event.preventDefault();");
tts.cssText = "position: fixed; margin: 0; padding: 0; -moz-appearance: none !important; border: none; background: transparent; max-width: none";
var image = tooltip.appendChild(new Image());
image.setAttribute("validate", "never"); // изображение будет загружено из кэша, если это возможно
image.setAttribute("src", img.src );
var z = ZoomManager.useFullZoom ? ZoomManager.zoom : 1;
var rect = {
width: z * g.rect.width,
height: z * g.rect.height,
left: z * (g.rect.left + g.win.mozInnerScreenX) - mozInnerScreenX,
top: z * (g.rect.top + g.win.mozInnerScreenY) - mozInnerScreenY
};
var ratio = rect.height / rect.width;
var k = -Math.min(mozInnerScreenY, 0);
var sh = innerHeight + k;
var w = Math.min(rect.width + imgZoom, innerWidth);
if (w * ratio > sh) w = sh / ratio;
image.style.width = w + "px";
var zoom = w - rect.width;
var left = Math.max(rect.left - zoom / 2, 0);
var top = Math.max(rect.top - ratio * zoom / 2, k);
var r = left + rect.width + zoom - innerWidth;
if (r > 0) left -= r;
var b = top + rect.height + ratio * zoom - innerHeight;
if (b > 0) top -= b;
tts.left = left + "px"; tts.top = top + "px";
tooltip.openPopupAtScreen(0, 0);
// прокрутка на подсказке меняет размеры изображения, на странице закрывает его ....
function imageZoom(e) {
if (e.target != image) { removeTooltip(); return; }
var zoom = (e.detail < 0 ? scrollZoom : -scrollZoom) * scrollTop;
var zx = zoom / 2, zy = zx * ratio;
var rect = tooltip.getBoundingClientRect();
var left = rect.left - zx, top = rect.top - zy;
if ( zoom > 0 ) {
if (left - zx < 0 && rect.right < innerWidth) left = 0;
var r = rect.right + zx - innerWidth;
if (r > 0 && left > 0) left -= r;
if (top < k && rect.bottom < innerHeight) top = k;
var b = rect.bottom + zy - innerHeight;
if (b > 0 && top > k) top -= b;
}
image.style.width = rect.width + zoom + "px";
tts.left = left + "px"; tts.top = top + "px";
}
gBrowser.addEventListener('DOMMouseScroll', imageZoom, true);
// удалить подсказку и обработчики ....
function removeTooltip() {
try { gBrowser.removeChild( tooltip ) } catch(e) {};
gBrowser.removeEventListener("click", removeTooltip, true);
gBrowser.removeEventListener("DOMMouseScroll", imageZoom, true);
}
gBrowser.addEventListener("click", removeTooltip, true); // удалить по клику на странице
}
})();
|
