Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Jun 26th, 2012  |  syntax: None  |  size: 12.89 KB  |  hits: 12  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. // ==UserScript==
  2. // @name Autosizer
  3. // @author Arve Bersvendsen, Edited version by shoust, should detect all images and resize.
  4. // @namespace http://virtuelvis.com/
  5. // @version 2.03
  6. // @description  Enhance image viewing in Opera by adding five
  7. //                      different sizing modes to images: "Original",
  8. //                      "Shrink to Fit", "Maximize", "Fit to Width" and
  9. //                      "Fit to Height".
  10. // @ujs:category browser: enhancements
  11. // ==/UserScript==
  12.  
  13. /*
  14.  * Copyright © 2005 by Arve Bersvendsen
  15.  *
  16.  * This program is free software; you can redistribute it and/or modify
  17.  * it under the terms of the GNU General Public License as published by
  18.  * the Free Software Foundation; either version 2 of the License.
  19.  *
  20.  * This program is distributed in the hope that it will be useful, but
  21.  * WITHOUT ANY WARRANTY; without even the implied warranty of
  22.  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
  23.  * General Public License for more details.
  24.  *
  25.  * You should have received a copy of the GNU General Public License
  26.  * along with this program; if not, write to the Free Software
  27.  * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307
  28.  * USA
  29.  */
  30.  
  31.  //Updated to work for opera 9.5, now added small fix for 10.5
  32. (function(){if( document.body && document.getElementsByTagName('link')[0] && (document.getElementsByTagName('link')[0].getAttribute('href').match(/style[s]?\/image\.css$/) || !document.getElementsByTagName('head')[0]) ) {
  33.   var allBodyParts = document.body.getElementsByTagName('*');
  34.   var firstBodyChild = document.body.firstChild;
  35.   if( ((allBodyParts.length==5 || allBodyParts.length==2) && firstBodyChild.tagName.match(/^(table|div)$/i) && (allBodyParts[1].tagName == 'IMG' || allBodyParts[4].tagName == 'IMG'))) {
  36.    window.addEventListener('load', function(ev){
  37.     if (document.body.childNodes.length != 1) return; // Not an image
  38.     var ss = document.createElement("style");
  39.     ss.setAttribute("type","text/css");
  40.     ss.innerText = "* { box-sizing: border-box }";
  41.         document.body.appendChild(ss);
  42.     var d_im = document.createElement("img");
  43.     d_im.src = document.images[0].src;
  44.     var imd = document.createElement("div");
  45.     imd.id="imgDiv";
  46.     imd.style="width:100%;height:100%;position:absolute;max-height:100%";
  47.     imd.appendChild(d_im);
  48.  
  49.     document.body.replaceChild(imd,document.body.firstChild);
  50.  
  51.     // begin:user settings
  52.      
  53.     // default mode between 0-4, corresponding to the five items in itemNames
  54.     var default_mode = 2; // Default, 1=Shrink to Fit
  55.  
  56.     // indicator mode between 0-2
  57.     // 0 = always on
  58.     // 1 = on after mode_switch / page load
  59.     // 2 = always off
  60.     var default_indicator = 0;
  61.  
  62.     // when indicator mode=1, this setting controls indicator delay in ms
  63.     this.indicator_delay = 750;
  64.  
  65.     // indicator colors and backgrounds. Uses CSS syntax
  66.     var indicator_color= "#333";
  67.     var indicator_hover_color = "red";
  68.     var indicator_background = "#eee";
  69.     var selector_background = "#f5f5f5";
  70.     var selector_selected_background = "#fff";
  71.  
  72.     // Allow script to store settings in a cookie: true/false
  73.     var cookie_allowed = true;
  74.  
  75.     // end:User settings
  76.  
  77.     // Default cookie lifetime = 24 hours
  78.     var now = new Date();
  79.     var cookieLifetime  = new Date(now.getTime() + 1000 * 60 * 60 * 24);
  80.  
  81.  
  82.     var itemNames = ["Original", "Shrink to Fit", "Maximize", "Fit to Width", "Fit to Height"];
  83.     var fit_modes = [
  84.       "cursor:crosshair;display:block; margin:auto auto", // no fit
  85.       "display:block;max-width:100%;max-height:100%;margin:0 auto;cursor:crosshair", //fit to window
  86.       "display:block;width:100%;height:auto;margin:auto;padding:0;cursor:crosshair", //fit to width
  87.       "display:block;width:auto;height:100%;margin:0 auto;padding:0;cursor:crosshair;" //fit to height
  88.     ]
  89.  
  90.     default_mode--;
  91.  
  92.     this.swapDirection = function(){
  93.       self.sizing_mode -= 2;
  94.       if (self.sizing_mode < 0) {
  95.         self.sizing_mode = itemNames.length+self.sizing_mode;
  96.       }
  97.     }
  98.  
  99.     this.lastHeight=document.documentElement.offsetHeight;
  100.     this.workerThread = function(){
  101.       if (self.lastHeight != document.documentElement.offsetHeight) {
  102.         self.reCenter();
  103.       }
  104.       self.lastHeight = document.documentElement.offsetHeight
  105.     }
  106.  
  107.     this.selector_active=false;
  108.     this.showMenu = function(){
  109.       document.getElementById("mode_selector").style.display="block";
  110.       document.getElementById("mode_indicator").style.display="block";
  111.       document.getElementById("mode_indicator").innerHTML="Select";
  112.       self.selector_active=true;
  113.       return;
  114.     }
  115.  
  116.     this.hideMenu = function(){
  117.       self.selector_active=false;
  118.       document.getElementById("mode_selector").style.display="none";
  119.       document.getElementById("mode_indicator").innerHTML=itemNames[self.sizing_mode];
  120.       if (self.indicator_mode == 1) {
  121.         self.showIndicator();
  122.         setTimeout(self.hideIndicator,self.indicator_delay);
  123.       }
  124.       return;
  125.     }
  126.  
  127.     this.showIndicator = function(){
  128.       document.getElementById('infopanel').style.display="block";
  129.       document.getElementById("mode_indicator").style.visibility="visible";
  130.       return;
  131.     }
  132.  
  133.     this.hideIndicator = function(){
  134.       if (!self.selector_active) {
  135.         document.getElementById("mode_indicator").style.visibility="hidden";
  136.       } else {
  137.         setTimeout(self.hideIndicator,self.indicator_delay);
  138.       }
  139.       return;
  140.     }
  141.  
  142.     this.changeIndicatorMode = function(){
  143.       if (self.indicator_mode++ == 2) {
  144.         self.indicator_mode = 0;
  145.       }
  146.       self.setCookie('indicatorMode',self.indicator_mode,cookieLifetime ,'/');
  147.       switch (self.indicator_mode) {
  148.         case 0:
  149.           self.showIndicator();
  150.           break;
  151.         case 1:
  152.           self.showIndicator();
  153.           setTimeout(self.hideIndicator,self.indicator_delay);
  154.           break;
  155.         case 2:
  156.           document.getElementsByTagName('infopanel').display="none";
  157.           self.hideIndicator();
  158.           break;
  159.         default:
  160.           break;
  161.       }
  162.     }
  163.  
  164.     this.setCookie = function(name, value, expires, path, domain, secure){
  165.       // Don't try to set cookie if cookies are disallowed.
  166.       if (!cookie_allowed) return;
  167.  
  168.       document.cookie = escape(name) + '=' + escape(value)
  169.       + (expires ? '; EXPIRES=' + expires.toGMTString() : '')
  170.       + (path ? '; PATH=' + path : '')
  171.       + (domain ? '; DOMAIN=' + domain : '')
  172.       + (secure ? '; SECURE' : '');
  173.     }
  174.  
  175.     this.getCookie = function (name){
  176.       var dc = document.cookie;
  177.       var prefix = name + "=";
  178.       var begin = dc.indexOf("; " + prefix);
  179.       if (begin == -1){
  180.         begin = dc.indexOf(prefix);
  181.         if (begin != 0) return null;
  182.       } else {
  183.         begin += 2;
  184.       }
  185.       var end = document.cookie.indexOf(";", begin);
  186.       if (end == -1){
  187.         end = dc.length;
  188.       }
  189.       return unescape(dc.substring(begin + prefix.length, end));
  190.     }  
  191.  
  192.     // set sizing. 0 <= val <= 4
  193.     this.setSizingMode = function(val){
  194.       var info = document.getElementById("mode_indicator");
  195.       var img = document.images[0];
  196.       info.innerHTML = itemNames[val];
  197.       if (val != 2 ) {
  198.         if (val < 2 ) {
  199.           img.style = fit_modes[val];
  200.           self.reCenter();
  201.         } else {
  202.           img.style = fit_modes[val-1];
  203.           self.reCenter();
  204.         }
  205.       } else {
  206.         while (img.height==0) self.reCenter();
  207.         if ((img.offsetWidth >= window.width) && (img.offsetHeight >= window.innerHeight)) {
  208.           img.style = fit_modes[1];
  209.         } else if ((img.width/img.height) < (window.innerWidth/window.innerHeight)){
  210.           img.style = fit_modes[3];
  211.         } else {
  212.           img.style = fit_modes[2];
  213.         }
  214.         self.reCenter();
  215.         //document.getElementsByTagName('html')[0].setAttribute('style','');
  216.       }
  217.      
  218.       for (var i = itemNames.length-1; i > -1; i--) {
  219.         document.getElementById("mode_selector").childNodes[i].style.background="transparent";
  220.       }
  221.       document.getElementById("mode_selector").childNodes[val].style.background=selector_selected_background;
  222.       self.setCookie('sizingMode',self.sizing_mode,cookieLifetime ,'/');
  223.       if (self.indicator_mode == 1) {
  224.         self.showIndicator();
  225.         setTimeout(self.hideIndicator,self.indicator_delay);
  226.       }
  227.       return;
  228.     }
  229.  
  230.     this.reCenter = function(){
  231.       // If documentElement.offsetHeight != window.innerHeight we are zoomed
  232.       document.getElementById("imgDiv").style.paddingTop=0;
  233.       if (document.documentElement.offsetHeight > document.images[0].offsetHeight)
  234.         document.getElementById("imgDiv").style.paddingTop = ((document.documentElement.offsetHeight -document.images[0].offsetHeight)/2);
  235.               document.body.className = document.body.className;
  236.       return;
  237.     }
  238.  
  239.     this.changeSizingMode = function(){
  240.       if (++self.sizing_mode > 4) self.sizing_mode = 0;
  241.       self.setCookie('sizingMode',self.sizing_mode,cookieLifetime ,'/');
  242.       self.setSizingMode(self.sizing_mode);
  243.       //document.getElementsByTagName('html')[0].setAttribute('style','');
  244.       return;
  245.     }
  246.  
  247.     document.documentElement.style="text-align:center;vertical-align:middle;padding: 0;margin: 0 auto;height:100%;width:100%;position:relative;min-height:100%;";
  248.     document.body.style="margin:auto;padding:0;height:100%;width:100%;position:relative;";
  249.  
  250.     var inf = document.createElement("div");
  251.     inf.id="infopanel";
  252.     inf.style="float:right;line-height:1;width:7.1em;display:block;color:"+indicator_color+";margin:0;padding:0;height: 11.5em; position:fixed;right:0;top:0;font-family:Arial,sans-serif;font-size:11px;";
  253.     var p = document.createElement("h2");
  254.     p.style="float:right;padding:0.25em 0.5em;background:"+indicator_background+";font-weight:bold;font-size:1em;margin:0;text-align:right;width: 100%;";
  255.     p.id="mode_indicator";    
  256.     var selector = document.createElement("ul");
  257.     selector.style="display:none;background:"+selector_background+";margin:0;padding:0.1em;";
  258.     selector.id="mode_selector";
  259.    
  260.     for (var i = itemNames.length-1; i >-1;i--) {
  261.       var item = document.createElement("li");
  262.       item.appendChild(document.createTextNode(itemNames[itemNames.length-i-1]));
  263.       item.style="display:block;margin:0;padding:0.5em;text-align:left";
  264.      
  265.       item.addEventListener("mouseover",function(ev){
  266.         event.target.style.color = indicator_hover_color;
  267.       },false);
  268.      
  269.       item.addEventListener("mouseout",function(ev){
  270.         event.target.style.color = indicator_color;
  271.       },false);
  272.  
  273.       item.addEventListener("click",function(ev){
  274.           self.sizing_mode = ev.target.sourceIndex-ev.target.parentElement.sourceIndex-1;
  275.           self.setCookie('sizingMode',self.sizing_mode,cookieLifetime ,'/');
  276.           self.setSizingMode(self.sizing_mode);
  277.           document.getElementById("mode_indicator").innerHTML="Select";
  278.       },false);
  279.       selector.appendChild(item);
  280.     }
  281.  
  282.     this.sizing_mode = parseInt(this.getCookie('sizingMode'));
  283.     if((isNaN(this.sizing_mode)) || (this.sizing_mode == null)) this.sizing_mode=default_mode;
  284.    
  285.     this.indicator_mode = parseInt(this.getCookie('indicatorMode'));
  286.     if((isNaN(this.indicator_mode)) || (this.indicator_mode == null)) this.indicator_mode=default_indicator;
  287.    
  288.     var self=this;
  289.  
  290.     if (self.indicator_mode == 2) {
  291.       inf.style.display="none";
  292.     }
  293.  
  294.     inf.appendChild(p);
  295.     inf.appendChild(selector);  
  296.    
  297.     document.body.appendChild(inf);    
  298.     this.setSizingMode(self.sizing_mode);
  299.     document.images[0].addEventListener("click",function(e){
  300.       if (e.shiftKey) {
  301.         self.swapDirection();
  302.       }
  303.       self.changeSizingMode();
  304.     },false);
  305.  
  306.  
  307.     inf.addEventListener("mouseover",function(e){
  308.       self.showMenu();
  309.     },false);
  310.  
  311.     inf.addEventListener("mouseout",function(e){
  312.       self.hideMenu();
  313.     },false);
  314.  
  315.     document.addEventListener("resize",function(){
  316.       self.setSizingMode(self.sizing_mode);
  317.     },false);
  318.  
  319.     document.onkeypress=function(e){
  320.       switch (e.keyCode) {
  321.         // 'b' or 'B': change indicator mode: Always, sometimes, never
  322.         case 66:
  323.         case 98:
  324.           self.changeIndicatorMode();
  325.           break;
  326.         // 'm' or 'M': next sizing mode
  327.         case 77:
  328.         case 109:
  329.           self.changeSizingMode();
  330.           break;
  331.         // 'n' or 'N': previous sizing mode
  332.         case 78:
  333.         case 110:
  334.           self.swapDirection();
  335.           self.changeSizingMode();
  336.           break;
  337.         case 42:
  338.         case 43:
  339.         case 45:
  340.         case 48:
  341.         case 54:
  342.         case 57:
  343.           setTimeout(self.reCenter,1);
  344.           break;
  345.         default:
  346.           break;
  347.       }
  348.  
  349.     }
  350.     self.lastHeight = document.documentElement.offsetHeight
  351.     var f = setInterval(self.workerThread,50);
  352.   }, false);
  353.   }
  354. }})()