Merge remote branch 'upstream/master'

pdf.js

@@ -1,4 +1,4 @@
-/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- /
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
 /* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
 
 'use strict';
@@ -18,6 +18,16 @@ function warn(msg) {
     log('Warning: ' + msg);
 }
 
+function backtrace() {
+  var stackStr;
+  try {
+    throw new Error();
+  } catch (e) {
+    stackStr = e.stack;
+  }
+  return stackStr.split('\n').slice(1).join('\n');
+}
+
 function error(msg) {
   log(backtrace());
   throw new Error(msg);
@@ -44,16 +54,6 @@ function assertWellFormed(cond, msg) {
     malformed(msg);
 }
 
-function backtrace() {
-  var stackStr;
-  try {
-    throw new Error();
-  } catch (e) {
-    stackStr = e.stack;
-  }
-  return stackStr.split('\n').slice(1).join('\n');
-}
-
 function shadow(obj, prop, value) {
   try {
     Object.defineProperty(obj, prop, { value: value,
@@ -185,7 +185,7 @@ var DecodeStream = (function() {
       var buffer2 = new Uint8Array(size);
       for (var i = 0; i < current; ++i)
         buffer2[i] = buffer[i];
-      return this.buffer = buffer2;
+      return (this.buffer = buffer2);
     },
     getByte: function decodestream_getByte() {
       var pos = this.pos;
@@ -197,11 +197,11 @@ var DecodeStream = (function() {
       return this.buffer[this.pos++];
     },
     getBytes: function decodestream_getBytes(length) {
-      var pos = this.pos;
+      var end, pos = this.pos;
 
       if (length) {
         this.ensureBuffer(pos + length);
-        var end = pos + length;
+        end = pos + length;
 
         while (!this.eof && this.bufferLength < end)
           this.readBlock();
@@ -213,7 +213,7 @@ var DecodeStream = (function() {
         while (!this.eof)
           this.readBlock();
 
-        var end = this.bufferLength;
+        end = this.bufferLength;
 
         // checking if bufferLength is still 0 then
         // the buffer has to be initialized
@@ -265,7 +265,7 @@ var FakeStream = (function() {
   function constructor(stream) {
     this.dict = stream.dict;
     DecodeStream.call(this);
-  };
+  }
 
   constructor.prototype = Object.create(DecodeStream.prototype);
   constructor.prototype.readBlock = function() {
@@ -276,11 +276,11 @@ var FakeStream = (function() {
   };
 
   constructor.prototype.getBytes = function(length) {
-    var pos = this.pos;
+    var end, pos = this.pos;
 
     if (length) {
       this.ensureBuffer(pos + length);
-      var end = pos + length;
+      end = pos + length;
 
       while (!this.eof && this.bufferLength < end)
         this.readBlock();
@@ -290,7 +290,7 @@ var FakeStream = (function() {
         end = bufEnd;
     } else {
       this.eof = true;
-      var end = this.bufferLength;
+      end = this.bufferLength;
     }
 
     this.pos = end;
@@ -532,8 +532,8 @@ var FlateStream = (function() {
 
   constructor.prototype.readBlock = function() {
     function repeat(stream, array, len, offset, what) {
-      var repeat = stream.getBits(len) + offset;
-      while (repeat-- > 0)
+      var repeatLength = stream.getBits(len) + offset;
+      while (repeatLength-- > 0)
         array[i++] = what;
     }
 
@@ -821,8 +821,8 @@ var PredictorStream = (function() {
           currentRow[i] = up + c;
         else
           currentRow[i] = upLeft + c;
-        break;
       }
+      break;
     default:
       error('Unsupported predictor: ' + predictor);
       break;
@@ -1621,6 +1621,7 @@ var CCITTFaxStream = (function() {
 
       this.err = false;
 
+      var code1, code2, code3;
       if (this.nextLine2D) {
         for (var i = 0; codingLine[i] < columns; ++i)
           refLine[i] = codingLine[i];
@@ -1633,7 +1634,7 @@ var CCITTFaxStream = (function() {
         blackPixels = 0;
 
         while (codingLine[this.codingPos] < columns) {
-          var code1 = this.getTwoDimCode();
+          code1 = this.getTwoDimCode();
           switch (code1) {
           case twoDimPass:
             this.addPixels(refLine[refPos + 1], blackPixels);
@@ -1641,9 +1642,8 @@ var CCITTFaxStream = (function() {
               refPos += 2;
             break;
           case twoDimHoriz:
-            var code1 = 0, code2 = 0;
+            code1 = code2 = 0;
             if (blackPixels) {
-              var code3;
               do {
                 code1 += (code3 = this.getBlackCode());
               } while (code3 >= 64);
@@ -1651,7 +1651,6 @@ var CCITTFaxStream = (function() {
                 code2 += (code3 = this.getWhiteCode());
               } while (code3 >= 64);
             } else {
-              var code3;
               do {
                 code1 += (code3 = this.getWhiteCode());
               } while (code3 >= 64);
@@ -1831,7 +1830,6 @@ var CCITTFaxStream = (function() {
           this.eof = true;
         }
       } else if (this.err && this.eoline) {
-        var code1;
         while (true) {
           code1 = this.lookBits(13);
           if (code1 == EOF) {
@@ -2058,7 +2056,7 @@ var CCITTFaxStream = (function() {
   constructor.prototype.eatBits = function(n) {
     if ((this.inputBits -= n) < 0)
       this.inputBits = 0;
-  }
+  };
 
   return constructor;
 })();
@@ -2361,7 +2359,7 @@ var Lexer = (function() {
 
   constructor.isSpace = function(ch) {
     return ch == ' ' || ch == '\t';
-  }
+  };
 
   // A '1' in this array means the character is white space.  A '1' or
   // '2' means the character ends a name or command.
@@ -2403,7 +2401,7 @@ var Lexer = (function() {
       var floating = false;
       var str = ch;
       var stream = this.stream;
-      do {
+      for (;;) {
         ch = stream.lookChar();
         if (ch == '.' && !floating) {
           str += ch;
@@ -2421,7 +2419,7 @@ var Lexer = (function() {
           break;
         }
         stream.skip();
-      } while (true);
+      }
       var value = parseFloat(str);
       if (isNaN(value))
         error('Invalid floating point number: ' + value);
@@ -2434,7 +2432,8 @@ var Lexer = (function() {
       var stream = this.stream;
       var ch;
       do {
-        switch (ch = stream.getChar()) {
+        ch = stream.getChar();
+        switch (ch) {
         case undefined:
           warn('Unterminated string');
           done = true;
@@ -2451,7 +2450,8 @@ var Lexer = (function() {
           }
           break;
         case '\\':
-          switch (ch = stream.getChar()) {
+          ch = stream.getChar();
+          switch (ch) {
           case undefined:
             warn('Unterminated string');
             done = true;
@@ -2541,7 +2541,7 @@ var Lexer = (function() {
     getHexString: function(ch) {
       var str = '';
       var stream = this.stream;
-      while (1) {
+      for (;;) {
         ch = stream.getChar();
         if (ch == '>') {
           break;
@@ -2804,7 +2804,7 @@ var Parser = (function() {
       if (xref)
         length = xref.fetchIfRef(length);
       if (!IsInt(length)) {
-        error('Bad ' + Length + ' attribute in stream');
+        error('Bad ' + length + ' attribute in stream');
         length = 0;
       }
 
@@ -3162,7 +3162,7 @@ var XRef = (function() {
         if (!IsCmd(obj3, 'obj')) {
           // some bad pdfs use "obj1234" and really mean 1234
           if (obj3.cmd.indexOf('obj') == 0) {
-            var num = parseInt(obj3.cmd.substring(3));
+            num = parseInt(obj3.cmd.substring(3));
             if (!isNaN(num))
               return num;
           }
@@ -3192,7 +3192,7 @@ var XRef = (function() {
       var i, entries = [], nums = [];
       // read the object numbers to populate cache
       for (i = 0; i < n; ++i) {
-        var num = parser.getObj();
+        num = parser.getObj();
         if (!IsInt(num)) {
           error('invalid object number in the ObjStm stream: ' + num);
         }
@@ -3378,15 +3378,15 @@ var Page = (function() {
     rotatePoint: function(x, y) {
       var rotate = this.rotate;
       switch (rotate) {
-        default:
-        case 0:
-          return {x: x, y: this.height - y};
         case 180:
           return {x: this.width - x, y: y};
         case 90:
           return {x: this.width - y, y: this.height - x};
         case 270:
           return {x: y, y: x};
+        case 0:
+        default:
+          return {x: x, y: this.height - y};
       }
     },
     getLinks: function() {
@@ -3548,7 +3548,7 @@ var Catalog = (function() {
       }
     },
     get destinations() {
-      function fetchDestination(ref) {
+      function fetchDestination(xref, ref) {
         var dest = xref.fetchIfRef(ref);
         return IsDict(dest) ? dest.get('D') : dest;
       }
@@ -3566,7 +3566,7 @@ var Catalog = (function() {
         obj = xref.fetchIfRef(nameDictionaryRef);
         obj.forEach(function(key, value) {
           if (!value) return;
-          dests[key] = fetchDestination(value);
+          dests[key] = fetchDestination(xref, value);
         });
       }
       if (nameTreeRef) {
@@ -3590,7 +3590,7 @@ var Catalog = (function() {
           }
           var names = obj.get('Names');
           for (i = 0, n = names.length; i < n; i += 2) {
-            dests[names[i]] = fetchDestination(names[i + 1]);
+            dests[names[i]] = fetchDestination(xref, names[i + 1]);
           }
         }
       }
@@ -4177,7 +4177,7 @@ var PartialEvaluator = (function() {
       return function(gfx) {
         for (var i = 0, length = argsArray.length; i < length; i++)
           gfx[fnArray[i]].apply(gfx, argsArray[i]);
-      }
+      };
     },
 
     translateFont: function(fontDict, xref, resources) {
@@ -4268,7 +4268,7 @@ var PartialEvaluator = (function() {
           } else if (IsName(encoding)) {
             baseEncoding = Encodings[encoding.name].slice();
           } else {
-            error("Encoding is not a Name nor a Dict");
+            error('Encoding is not a Name nor a Dict');
           }
         }
 
@@ -4310,11 +4310,11 @@ var PartialEvaluator = (function() {
 
             if (!isDisplayable(index))
               glyphsMap[glyph] = encodingMap[i] += kCmapGlyphOffset;
-            
           }
         }
 
-        if (fontType == 'TrueType' && fontDict.has('ToUnicode') && differences) {
+        if (fontType == 'TrueType' && fontDict.has('ToUnicode') &&
+            differences) {
           var cmapObj = xref.fetchIfRef(fontDict.get('ToUnicode'));
           if (IsName(cmapObj)) {
             error('ToUnicode file cmap translation not implemented');
@@ -4813,8 +4813,8 @@ var CanvasGraphics = (function() {
 
         size = (size <= kRasterizerMin) ? size * kScalePrecision : size;
 
-        var bold = fontObj.black ? (fontObj.bold ? 'bolder' : 'bold')
-                                 : (fontObj.bold ? 'bold' : 'normal');
+        var bold = fontObj.black ? (fontObj.bold ? 'bolder' : 'bold') :
+                                   (fontObj.bold ? 'bold' : 'normal');
 
         var italic = fontObj.italic ? 'italic' : 'normal';
         var rule = italic + ' ' + bold + ' ' + size + 'px "' + name + '"';
@@ -5226,7 +5226,7 @@ var CanvasGraphics = (function() {
 })();
 
 var Util = (function() {
-  function constructor() {};
+  function constructor() {}
   constructor.makeCssRgb = function makergb(r, g, b) {
     var ri = (255 * r) | 0, gi = (255 * g) | 0, bi = (255 * b) | 0;
     return 'rgb(' + ri + ',' + gi + ',' + bi + ')';
@@ -5249,7 +5249,7 @@ var ColorSpace = (function() {
   // Constructor should define this.numComps, this.defaultColor, this.name
   function constructor() {
     error('should not call ColorSpace constructor');
-  };
+  }
 
   constructor.prototype = {
     // Input: array of size numComps representing color component values
@@ -5284,18 +5284,14 @@ var ColorSpace = (function() {
       case 'DeviceGray':
       case 'G':
         return new DeviceGrayCS();
-        break;
       case 'DeviceRGB':
       case 'RGB':
         return new DeviceRgbCS();
-        break;
       case 'DeviceCMYK':
       case 'CMYK':
         return new DeviceCmykCS();
-        break;
       case 'Pattern':
         return new PatternCS(null);
-        break;
       default:
         error('unrecognized colorspace ' + mode);
       }
@@ -5307,30 +5303,25 @@ var ColorSpace = (function() {
       case 'DeviceGray':
       case 'G':
         return new DeviceGrayCS();
-        break;
       case 'DeviceRGB':
       case 'RGB':
         return new DeviceRgbCS();
-        break;
       case 'DeviceCMYK':
       case 'CMYK':
         return new DeviceCmykCS();
-        break;
       case 'CalGray':
         return new DeviceGrayCS();
-        break;
       case 'CalRGB':
         return new DeviceRgbCS();
-        break;
       case 'ICCBased':
         var stream = xref.fetchIfRef(cs[1]);
         var dict = stream.dict;
         var numComps = dict.get('N');
         if (numComps == 1)
           return new DeviceGrayCS();
-        else if (numComps == 3)
+        if (numComps == 3)
           return new DeviceRgbCS();
-        else if (numComps == 4)
+        if (numComps == 4)
           return new DeviceCmykCS();
         break;
       case 'Pattern':
@@ -5338,19 +5329,16 @@ var ColorSpace = (function() {
         if (baseCS)
           baseCS = ColorSpace.parse(baseCS, xref, res);
         return new PatternCS(baseCS);
-        break;
       case 'Indexed':
         var base = ColorSpace.parse(cs[1], xref, res);
         var hiVal = cs[2] + 1;
         var lookup = xref.fetchIfRef(cs[3]);
         return new IndexedCS(base, hiVal, lookup);
-        break;
       case 'Separation':
         var name = cs[1];
         var alt = ColorSpace.parse(cs[2], xref, res);
         var tintFn = new PDFFunction(xref, xref.fetchIfRef(cs[3]));
         return new SeparationCS(alt, tintFn);
-        break;
       case 'Lab':
       case 'DeviceN':
       default:
@@ -5440,7 +5428,7 @@ var IndexedCS = (function() {
 
   constructor.prototype = {
     getRgb: function indexcs_getRgb(color) {
-      var numComps = base.numComps;
+      var numComps = this.base.numComps;
 
       var start = color[0] * numComps;
       var c = [];
@@ -5476,7 +5464,7 @@ var DeviceGrayCS = (function() {
     this.name = 'DeviceGray';
     this.numComps = 1;
     this.defaultColor = [0];
-  };
+  }
 
   constructor.prototype = {
     getRgb: function graycs_getRgb(color) {
@@ -5611,7 +5599,7 @@ var Pattern = (function() {
   // Constructor should define this.getPattern
   function constructor() {
     error('should not call Pattern constructor');
-  };
+  }
 
   constructor.prototype = {
     // Input: current Canvas context
@@ -5675,14 +5663,14 @@ var Pattern = (function() {
     default:
       return new DummyShading();
     }
-  }
+  };
   return constructor;
 })();
 
 var DummyShading = (function() {
   function constructor() {
     this.type = 'Pattern';
-  };
+  }
   constructor.prototype = {
     getPattern: function dummy_getpattern() {
       return 'hotpink';
@@ -5712,13 +5700,15 @@ var RadialAxialShading = (function() {
     var t0 = 0.0, t1 = 1.0;
     if (dict.has('Domain')) {
       var domainArr = dict.get('Domain');
-      t0 = domainArr[0], t1 = domainArr[1];
+      t0 = domainArr[0];
+      t1 = domainArr[1];
     }
 
     var extendStart = false, extendEnd = false;
     if (dict.has('Extend')) {
       var extendArr = dict.get('Extend');
-      extendStart = extendArr[0], extendEnd = extendArr[1];
+      extendStart = extendArr[0];
+      extendEnd = extendArr[1];
       TODO('Support extend');
     }
 
@@ -5747,7 +5737,7 @@ var RadialAxialShading = (function() {
     }
 
     this.colorStops = colorStops;
-  };
+  }
 
   constructor.prototype = {
     getPattern: function() {
@@ -5812,7 +5802,7 @@ var TilingPattern = (function() {
         var e = m[4] * tm[0] + m[5] * tm[2] + tm[4];
         var f = m[4] * tm[1] + m[5] * tm[3] + tm[5];
         return [a, b, c, d, e, f];
-      };
+      }
 
       TODO('TilingType');
 
@@ -5884,7 +5874,7 @@ var TilingPattern = (function() {
       graphics.execute(code, xref, res);
 
       this.canvas = tmpCanvas;
-  };
+  }
 
   constructor.prototype = {
     getPattern: function tiling_getPattern() {
@@ -5963,7 +5953,7 @@ var PDFImage = (function() {
     } else if (smask) {
       this.smask = new PDFImage(xref, res, smask);
     }
-  };
+  }
 
   constructor.prototype = {
     getComponents: function getComponents(buffer, decodeMap) {
@@ -6138,7 +6128,7 @@ var PDFFunction = (function() {
       error('Unknown type of function');
 
     typeFn.call(this, fn, dict, xref);
-  };
+  }
 
   constructor.prototype = {
     constructSampled: function(str, dict) {
@@ -6184,7 +6174,7 @@ var PDFFunction = (function() {
           else if (v < min)
             v = min;
           return v;
-        }
+        };
 
         if (inputSize != args.length)
           error('Incorrect number of arguments: ' + inputSize + ' != ' +
@@ -6234,7 +6224,7 @@ var PDFFunction = (function() {
         }
 
         return output;
-      }
+      };
     },
     getSampleArray: function(size, outputSize, bps, str) {
       var length = 1;
@@ -6282,7 +6272,7 @@ var PDFFunction = (function() {
           out.push(c0[j] + (x^n * diff[i]));
 
         return out;
-      }
+      };
     },
     constructStiched: function(fn, dict, xref) {
       var domain = dict.get('Domain');
@@ -6310,7 +6300,7 @@ var PDFFunction = (function() {
           else if (v < min)
             v = min;
           return v;
-        }
+        };
 
         // clip to domain
         var v = clip(args[0], domain[0], domain[1]);
@@ -6335,11 +6325,13 @@ var PDFFunction = (function() {
 
         // call the appropropriate function
         return fns[i].func([v2]);
-      }
+      };
     },
     constructPostScript: function() {
       TODO('unhandled type of function');
-      this.func = function() { return [255, 105, 180]; }
+      this.func = function() {
+        return [255, 105, 180];
+      };
     }
   };
 

web/images/zoom-in.svg

@@ -0,0 +1,436 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="48px"
+   height="48px"
+   id="svg6431"
+   sodipodi:version="0.32"
+   inkscape:version="0.46"
+   sodipodi:docbase="/home/jimmac/src/cvs/tango-icon-theme/scalable/actions"
+   sodipodi:docname="list-add.svg"
+   inkscape:output_extension="org.inkscape.output.svg.inkscape">
+  <defs
+     id="defs6433">
+    <inkscape:perspective
+       sodipodi:type="inkscape:persp3d"
+       inkscape:vp_x="0 : 24 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_z="48 : 24 : 1"
+       inkscape:persp3d-origin="24 : 16 : 1"
+       id="perspective70" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2091">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop2093" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop2095" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient7916">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop7918" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.34020618;"
+         offset="1.0000000"
+         id="stop7920" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient8662">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop8664" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop8666" />
+    </linearGradient>
+    <radialGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient8662"
+       id="radialGradient1503"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1.000000,0.000000,0.000000,0.536723,-1.018989e-13,16.87306)"
+       cx="24.837126"
+       cy="36.421127"
+       fx="24.837126"
+       fy="36.421127"
+       r="15.644737" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2847">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2849" />
+      <stop
+         style="stop-color:#3465a4;stop-opacity:0;"
+         offset="1"
+         id="stop2851" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2847"
+       id="linearGradient1488"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(-1.000000,0.000000,0.000000,-1.000000,-1.242480,40.08170)"
+       x1="37.128052"
+       y1="29.729605"
+       x2="37.065414"
+       y2="26.194071" />
+    <linearGradient
+       id="linearGradient2831">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2833" />
+      <stop
+         id="stop2855"
+         offset="0.33333334"
+         style="stop-color:#5b86be;stop-opacity:1;" />
+      <stop
+         style="stop-color:#83a8d8;stop-opacity:0;"
+         offset="1"
+         id="stop2835" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2831"
+       id="linearGradient1486"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.30498,-6.043298)"
+       x1="13.478554"
+       y1="10.612206"
+       x2="15.419417"
+       y2="19.115122" />
+    <linearGradient
+       id="linearGradient2380">
+      <stop
+         style="stop-color:#b9cfe7;stop-opacity:1"
+         offset="0"
+         id="stop2382" />
+      <stop
+         style="stop-color:#729fcf;stop-opacity:1"
+         offset="1"
+         id="stop2384" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2682">
+      <stop
+         style="stop-color:#3977c3;stop-opacity:1;"
+         offset="0"
+         id="stop2684" />
+      <stop
+         style="stop-color:#89aedc;stop-opacity:0;"
+         offset="1"
+         id="stop2686" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2682"
+       id="linearGradient2688"
+       x1="36.713837"
+       y1="31.455952"
+       x2="37.124462"
+       y2="24.842253"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.77039,-5.765705)" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2690">
+      <stop
+         style="stop-color:#c4d7eb;stop-opacity:1;"
+         offset="0"
+         id="stop2692" />
+      <stop
+         style="stop-color:#c4d7eb;stop-opacity:0;"
+         offset="1"
+         id="stop2694" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2690"
+       id="linearGradient2696"
+       x1="32.647972"
+       y1="30.748846"
+       x2="37.124462"
+       y2="24.842253"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.77039,-5.765705)" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2871">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2873" />
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1"
+         offset="1"
+         id="stop2875" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2402">
+      <stop
+         style="stop-color:#729fcf;stop-opacity:1;"
+         offset="0"
+         id="stop2404" />
+      <stop
+         style="stop-color:#528ac5;stop-opacity:1;"
+         offset="1"
+         id="stop2406" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2797"
+       id="linearGradient1493"
+       gradientUnits="userSpaceOnUse"
+       x1="5.9649176"
+       y1="26.048164"
+       x2="52.854097"
+       y2="26.048164" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2797">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop2799" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop2801" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2797"
+       id="linearGradient1491"
+       gradientUnits="userSpaceOnUse"
+       x1="5.9649176"
+       y1="26.048164"
+       x2="52.854097"
+       y2="26.048164" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient7179">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop7181" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop7183" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2316">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop2318" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.65979379;"
+         offset="1"
+         id="stop2320" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient1322">
+      <stop
+         id="stop1324"
+         offset="0.0000000"
+         style="stop-color:#729fcf" />
+      <stop
+         id="stop1326"
+         offset="1.0000000"
+         style="stop-color:#5187d6;stop-opacity:1.0000000;" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient1322"
+       id="linearGradient4975"
+       x1="34.892849"
+       y1="36.422989"
+       x2="45.918697"
+       y2="48.547989"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-18.01785,-13.57119)" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7179"
+       id="linearGradient7185"
+       x1="13.435029"
+       y1="13.604306"
+       x2="22.374878"
+       y2="23.554308"
+       gradientUnits="userSpaceOnUse" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7179"
+       id="linearGradient7189"
+       gradientUnits="userSpaceOnUse"
+       x1="13.435029"
+       y1="13.604306"
+       x2="22.374878"
+       y2="23.554308"
+       gradientTransform="matrix(-1.000000,0.000000,0.000000,-1.000000,47.93934,50.02474)" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2380"
+       id="linearGradient7180"
+       gradientUnits="userSpaceOnUse"
+       x1="62.513836"
+       y1="36.061237"
+       x2="15.984863"
+       y2="20.60858" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2871"
+       id="linearGradient7182"
+       gradientUnits="userSpaceOnUse"
+       x1="46.834816"
+       y1="45.264122"
+       x2="45.380436"
+       y2="50.939667" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2402"
+       id="linearGradient7184"
+       gradientUnits="userSpaceOnUse"
+       x1="18.935766"
+       y1="23.667896"
+       x2="53.588622"
+       y2="26.649362" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2871"
+       id="linearGradient7186"
+       gradientUnits="userSpaceOnUse"
+       x1="46.834816"
+       y1="45.264122"
+       x2="45.380436"
+       y2="50.939667" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7916"
+       id="linearGradient7922"
+       x1="16.874998"
+       y1="22.851799"
+       x2="27.900846"
+       y2="34.976799"
+       gradientUnits="userSpaceOnUse" />
+    <radialGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2091"
+       id="radialGradient2097"
+       cx="23.070683"
+       cy="35.127438"
+       fx="23.070683"
+       fy="35.127438"
+       r="10.319340"
+       gradientTransform="matrix(0.914812,1.265023e-2,-8.21502e-3,0.213562,2.253914,27.18889)"
+       gradientUnits="userSpaceOnUse" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="0.15686275"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1"
+     inkscape:cx="-123.56934"
+     inkscape:cy="0.031886897"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:grid-bbox="true"
+     inkscape:document-units="px"
+     inkscape:window-width="1280"
+     inkscape:window-height="818"
+     inkscape:window-x="0"
+     inkscape:window-y="30"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:showpageshadow="false" />
+  <metadata
+     id="metadata6436">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>Add</dc:title>
+        <dc:date>2006-01-04</dc:date>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Andreas Nilsson</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:source>http://tango-project.org</dc:source>
+        <dc:subject>
+          <rdf:Bag>
+            <rdf:li>add</rdf:li>
+            <rdf:li>plus</rdf:li>
+          </rdf:Bag>
+        </dc:subject>
+        <cc:license
+           rdf:resource="http://creativecommons.org/licenses/publicdomain/" />
+      </cc:Work>
+      <cc:License
+         rdf:about="http://creativecommons.org/licenses/publicdomain/">
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Reproduction" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Distribution" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#DerivativeWorks" />
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer">
+    <path
+       sodipodi:type="arc"
+       style="opacity:0.10824742;fill:url(#radialGradient2097);fill-opacity:1;stroke:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       id="path1361"
+       sodipodi:cx="22.958872"
+       sodipodi:cy="34.94062"
+       sodipodi:rx="10.31934"
+       sodipodi:ry="2.320194"
+       d="M 33.278212 34.94062 A 10.31934 2.320194 0 1 1  12.639532,34.94062 A 10.31934 2.320194 0 1 1  33.278212 34.94062 z"
+       transform="matrix(1.550487,0,0,1.978714,-12.4813,-32.49103)" />
+    <path
+       style="font-size:59.901077px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125.00000%;writing-mode:lr-tb;text-anchor:start;fill:#75a1d0;fill-opacity:1.0000000;stroke:#3465a4;stroke-width:1.0000004px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;font-family:Bitstream Vera Sans"
+       d="M 27.514356,37.542682 L 27.514356,28.515722 L 37.492820,28.475543 L 37.492820,21.480219 L 27.523285,21.480219 L 27.514356,11.520049 L 20.498082,11.531210 L 20.502546,21.462362 L 10.512920,21.536022 L 10.477206,28.504561 L 20.511475,28.475543 L 20.518171,37.515896 L 27.514356,37.542682 z "
+       id="text1314"
+       sodipodi:nodetypes="ccccccccccccc" />
+    <path
+       style="font-size:59.901077px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125.00000%;writing-mode:lr-tb;text-anchor:start;opacity:0.40860215;fill:url(#linearGradient4975);fill-opacity:1.0000000;stroke:url(#linearGradient7922);stroke-width:1.0000006px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;font-family:Bitstream Vera Sans"
+       d="M 26.498702,36.533920 L 26.498702,27.499738 L 36.501304,27.499738 L 36.494607,22.475309 L 26.507630,22.475309 L 26.507630,12.480335 L 21.512796,12.498193 L 21.521725,22.475309 L 11.495536,22.493166 L 11.468750,27.466256 L 21.533143,27.475185 L 21.519750,36.502670 L 26.498702,36.533920 z "
+       id="path7076"
+       sodipodi:nodetypes="ccccccccccccc" />
+    <path
+       style="fill:#ffffff;fill-opacity:1.0000000;fill-rule:evenodd;stroke:none;stroke-width:1.0000000px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;opacity:0.31182796"
+       d="M 11.000000,25.000000 C 11.000000,26.937500 36.984375,24.031250 36.984375,24.968750 L 36.984375,21.968750 L 27.000000,22.000000 L 27.000000,12.034772 L 21.000000,12.034772 L 21.000000,22.000000 L 11.000000,22.000000 L 11.000000,25.000000 z "
+       id="path7914"
+       sodipodi:nodetypes="ccccccccc" />
+  </g>
+</svg>

web/images/zoom-out.svg

@@ -0,0 +1,424 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="48px"
+   height="48px"
+   id="svg6431"
+   sodipodi:version="0.32"
+   inkscape:version="0.46"
+   sodipodi:docbase="/home/jimmac/src/cvs/tango-icon-theme/scalable/actions"
+   sodipodi:docname="list-remove.svg"
+   inkscape:output_extension="org.inkscape.output.svg.inkscape">
+  <defs
+     id="defs6433">
+    <inkscape:perspective
+       sodipodi:type="inkscape:persp3d"
+       inkscape:vp_x="0 : 24 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_z="48 : 24 : 1"
+       inkscape:persp3d-origin="24 : 16 : 1"
+       id="perspective69" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2091">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop2093" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop2095" />
+    </linearGradient>
+    <radialGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2091"
+       id="radialGradient2097"
+       cx="23.070683"
+       cy="35.127438"
+       fx="23.070683"
+       fy="35.127438"
+       r="10.319340"
+       gradientTransform="matrix(0.914812,1.265023e-2,-8.21502e-3,0.213562,2.253914,27.18889)"
+       gradientUnits="userSpaceOnUse" />
+    <linearGradient
+       id="linearGradient7916">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop7918" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.34020618;"
+         offset="1.0000000"
+         id="stop7920" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient8662">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop8664" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop8666" />
+    </linearGradient>
+    <radialGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient8662"
+       id="radialGradient1503"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1.000000,0.000000,0.000000,0.536723,-1.018989e-13,16.87306)"
+       cx="24.837126"
+       cy="36.421127"
+       fx="24.837126"
+       fy="36.421127"
+       r="15.644737" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2847">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2849" />
+      <stop
+         style="stop-color:#3465a4;stop-opacity:0;"
+         offset="1"
+         id="stop2851" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2847"
+       id="linearGradient1488"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(-1.000000,0.000000,0.000000,-1.000000,-1.242480,40.08170)"
+       x1="37.128052"
+       y1="29.729605"
+       x2="37.065414"
+       y2="26.194071" />
+    <linearGradient
+       id="linearGradient2831">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2833" />
+      <stop
+         id="stop2855"
+         offset="0.33333334"
+         style="stop-color:#5b86be;stop-opacity:1;" />
+      <stop
+         style="stop-color:#83a8d8;stop-opacity:0;"
+         offset="1"
+         id="stop2835" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2831"
+       id="linearGradient1486"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.30498,-6.043298)"
+       x1="13.478554"
+       y1="10.612206"
+       x2="15.419417"
+       y2="19.115122" />
+    <linearGradient
+       id="linearGradient2380">
+      <stop
+         style="stop-color:#b9cfe7;stop-opacity:1"
+         offset="0"
+         id="stop2382" />
+      <stop
+         style="stop-color:#729fcf;stop-opacity:1"
+         offset="1"
+         id="stop2384" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2682">
+      <stop
+         style="stop-color:#3977c3;stop-opacity:1;"
+         offset="0"
+         id="stop2684" />
+      <stop
+         style="stop-color:#89aedc;stop-opacity:0;"
+         offset="1"
+         id="stop2686" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2682"
+       id="linearGradient2688"
+       x1="36.713837"
+       y1="31.455952"
+       x2="37.124462"
+       y2="24.842253"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.77039,-5.765705)" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2690">
+      <stop
+         style="stop-color:#c4d7eb;stop-opacity:1;"
+         offset="0"
+         id="stop2692" />
+      <stop
+         style="stop-color:#c4d7eb;stop-opacity:0;"
+         offset="1"
+         id="stop2694" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2690"
+       id="linearGradient2696"
+       x1="32.647972"
+       y1="30.748846"
+       x2="37.124462"
+       y2="24.842253"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-48.77039,-5.765705)" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2871">
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1;"
+         offset="0"
+         id="stop2873" />
+      <stop
+         style="stop-color:#3465a4;stop-opacity:1"
+         offset="1"
+         id="stop2875" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2402">
+      <stop
+         style="stop-color:#729fcf;stop-opacity:1;"
+         offset="0"
+         id="stop2404" />
+      <stop
+         style="stop-color:#528ac5;stop-opacity:1;"
+         offset="1"
+         id="stop2406" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2797"
+       id="linearGradient1493"
+       gradientUnits="userSpaceOnUse"
+       x1="5.9649176"
+       y1="26.048164"
+       x2="52.854097"
+       y2="26.048164" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient2797">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop2799" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop2801" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2797"
+       id="linearGradient1491"
+       gradientUnits="userSpaceOnUse"
+       x1="5.9649176"
+       y1="26.048164"
+       x2="52.854097"
+       y2="26.048164" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient7179">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1;"
+         offset="0"
+         id="stop7181" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0;"
+         offset="1"
+         id="stop7183" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient2316">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop2318" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.65979379;"
+         offset="1"
+         id="stop2320" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient1322">
+      <stop
+         id="stop1324"
+         offset="0.0000000"
+         style="stop-color:#729fcf" />
+      <stop
+         id="stop1326"
+         offset="1.0000000"
+         style="stop-color:#5187d6;stop-opacity:1.0000000;" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient1322"
+       id="linearGradient4975"
+       x1="34.892849"
+       y1="36.422989"
+       x2="45.918697"
+       y2="48.547989"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-18.01785,-13.57119)" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7179"
+       id="linearGradient7185"
+       x1="13.435029"
+       y1="13.604306"
+       x2="22.374878"
+       y2="23.554308"
+       gradientUnits="userSpaceOnUse" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7179"
+       id="linearGradient7189"
+       gradientUnits="userSpaceOnUse"
+       x1="13.435029"
+       y1="13.604306"
+       x2="22.374878"
+       y2="23.554308"
+       gradientTransform="matrix(-1.000000,0.000000,0.000000,-1.000000,47.93934,50.02474)" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2380"
+       id="linearGradient7180"
+       gradientUnits="userSpaceOnUse"
+       x1="62.513836"
+       y1="36.061237"
+       x2="15.984863"
+       y2="20.60858" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2871"
+       id="linearGradient7182"
+       gradientUnits="userSpaceOnUse"
+       x1="46.834816"
+       y1="45.264122"
+       x2="45.380436"
+       y2="50.939667" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2402"
+       id="linearGradient7184"
+       gradientUnits="userSpaceOnUse"
+       x1="18.935766"
+       y1="23.667896"
+       x2="53.588622"
+       y2="26.649362" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient2871"
+       id="linearGradient7186"
+       gradientUnits="userSpaceOnUse"
+       x1="46.834816"
+       y1="45.264122"
+       x2="45.380436"
+       y2="50.939667" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7916"
+       id="linearGradient7922"
+       x1="16.874998"
+       y1="22.851799"
+       x2="27.900846"
+       y2="34.976799"
+       gradientUnits="userSpaceOnUse" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="0.10980392"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1"
+     inkscape:cx="-123.27226"
+     inkscape:cy="26.474252"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:grid-bbox="true"
+     inkscape:document-units="px"
+     inkscape:window-width="1280"
+     inkscape:window-height="818"
+     inkscape:window-x="0"
+     inkscape:window-y="30"
+     inkscape:showpageshadow="false" />
+  <metadata
+     id="metadata6436">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>Remove</dc:title>
+        <dc:date>2006-01-04</dc:date>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Andreas Nilsson</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:source>http://tango-project.org</dc:source>
+        <dc:subject>
+          <rdf:Bag>
+            <rdf:li>remove</rdf:li>
+            <rdf:li>delete</rdf:li>
+          </rdf:Bag>
+        </dc:subject>
+        <cc:license
+           rdf:resource="http://creativecommons.org/licenses/publicdomain/" />
+      </cc:Work>
+      <cc:License
+         rdf:about="http://creativecommons.org/licenses/publicdomain/">
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Reproduction" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Distribution" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#DerivativeWorks" />
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer">
+    <path
+       style="font-size:59.901077px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125.00000%;writing-mode:lr-tb;text-anchor:start;fill:#75a1d0;fill-opacity:1.0000000;stroke:#3465a4;stroke-width:1.0000004px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;font-family:Bitstream Vera Sans"
+       d="M 27.514356,28.359472 L 39.633445,28.475543 L 39.633445,21.480219 L 27.523285,21.480219 L 20.502546,21.462362 L 8.5441705,21.489147 L 8.5084565,28.457686 L 20.511475,28.475543 L 27.514356,28.359472 z "
+       id="text1314"
+       sodipodi:nodetypes="ccccccccc" />
+    <path
+       style="font-size:59.901077px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125.00000%;writing-mode:lr-tb;text-anchor:start;opacity:0.40860215;fill:url(#linearGradient4975);fill-opacity:1.0000000;stroke:url(#linearGradient7922);stroke-width:1.0000006px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;font-family:Bitstream Vera Sans"
+       d="M 38.579429,27.484113 L 38.588357,22.475309 L 9.5267863,22.493166 L 9.5000003,27.466256 L 38.579429,27.484113 z "
+       id="path7076"
+       sodipodi:nodetypes="ccccc" />
+    <path
+       style="fill:#ffffff;fill-opacity:1.0000000;fill-rule:evenodd;stroke:none;stroke-width:1.0000000px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;opacity:0.31182796"
+       d="M 9.0000000,25.000000 C 9.0000000,26.937500 39.125000,24.062500 39.125000,25.000000 L 39.125000,22.000000 L 9.0000000,22.000000 L 9.0000000,25.000000 z "
+       id="path7914"
+       sodipodi:nodetypes="ccccc" />
+  </g>
+</svg>

web/viewer.css

@@ -21,6 +21,8 @@ body {
   height: 40px;
   width: 100%;
   z-index: 1;
+  white-space:nowrap;
+  overflow: hidden;
 }
 
 .separator {
@@ -109,13 +111,23 @@ span#info {
 }
 
 .thumbnail {
-  width: 104px;
+  width: 134px;
   height: 134px;
-  background-color: white;
   margin-top: 5px;
   margin-bottom: 5px;
   margin-left:auto;
   margin-right:auto;
+  line-height: 134px;
+  text-align: center;
+}
+
+.thumbnail:not([data-loaded]) {
+  background-color: gray;
+}
+
+.thumbnail > canvas {
+  vertical-align: middle;
+  display: inline-block;
 }
 
 #outlineScrollView {
@@ -220,6 +232,14 @@ canvas {
   -webkit-box-shadow: 0px 2px 10px #ff0;
 }
 
+#pageWidthOption {
+  border-top: 1px solid black;
+}
+
+#customScaleOption {
+  display: none;
+}
+
 /* === Printed media overrides === */
 @media print {
   #sidebar {

web/viewer.html

@@ -33,13 +33,25 @@
 
       <div class="separator"></div>
 
-      <select id="scaleSelect" onchange="PDFView.scale = parseInt(this.value);">
-        <option value="50">50%</option>
-        <option value="75">75%</option>
-        <option value="100">100%</option>
-        <option value="125">125%</option>
-        <option value="150" selected="selected">150%</option>
-        <option value="200">200%</option>
+      <button id="next" title="Zoom Out" onclick="PDFView.zoomOut();">
+        <img src="images/zoom-out.svg" align="top" height="32"/>
+      </button>
+      <button id="next" title="Zoom In" onclick="PDFView.zoomIn();">
+        <img src="images/zoom-in.svg" align="top" height="32"/>
+      </button>
+
+      <div class="separator"></div>
+
+      <select id="scaleSelect" onchange="PDFView.parseScale(this.value);">
+        <option id="customScaleOption" value="custom"></option>
+        <option value="0.5">50%</option>
+        <option value="0.75">75%</option>
+        <option value="1">100%</option>
+        <option value="1.25">125%</option>
+        <option value="1.5" selected="selected">150%</option>
+        <option value="2">200%</option>
+        <option id="pageWidthOption" value="page-width">Page Width</option>
+        <option id="pageFitOption" value="page-fit">Page Fit</option>
       </select>
 
       <div class="separator"></div>

web/viewer.js

@@ -4,8 +4,10 @@
 'use strict';
 
 var kDefaultURL = 'compressed.tracemonkey-pldi-09.pdf';
-var kDefaultScale = 150;
+var kDefaultScale = 1.5;
+var kDefaultScaleDelta = 1.1;
 var kCacheSize = 20;
+var kCssUnits = 96.0 / 72.0;
 
 var Cache = function(size) {
   var data = [];
@@ -21,12 +23,13 @@ var cache = new Cache(kCacheSize);
 var PDFView = {
   pages: [],
   thumbnails: [],
+  currentScale: kDefaultScale,
 
-  set scale(val) {
+  setScale: function(val, resetAutoSettings) {
     var pages = this.pages;
-    var cssUnits = 96.0 / 72.0;
     for (var i = 0; i < pages.length; i++)
-      pages[i].update(val / 100 * cssUnits);
+      pages[i].update(val * kCssUnits);
+    this.currentScale = val;
 
     if (document.location.hash == '#' + this.page)
       this.pages[this.page - 1].draw();
@@ -35,10 +38,42 @@ var PDFView = {
       document.location.hash = this.page;
 
     var event = document.createEvent('UIEvents');
-    event.initUIEvent('scalechange', false, false, window, val);
+    event.initUIEvent('scalechange', false, false, window, 0);
+    event.scale = val;
+    event.resetAutoSettings = resetAutoSettings;
     window.dispatchEvent(event);
   },
 
+  parseScale: function(value) {
+    if ('custom' == value)
+      return;
+
+    var scale = parseFloat(value);
+    if (scale) {
+      this.setScale(scale, true);
+      return;
+    }
+
+    var currentPage = this.pages[this.page - 1];
+    var scrollbarPadding = 40;
+    var pageWidthScale = (window.innerWidth - scrollbarPadding) /
+      currentPage.width / kCssUnits;
+    var pageHeightScale = (window.innerHeight - scrollbarPadding) /
+      currentPage.height / kCssUnits;
+    if ('page-width' == value)
+      this.setScale(pageWidthScale);
+    else if ('page-fit' == value)
+      this.setScale(Math.min(pageWidthScale, pageHeightScale));
+  },
+
+  zoomIn: function() {
+    this.setScale(this.currentScale * kDefaultScaleDelta, true);
+  },
+
+  zoomOut: function() {
+    this.setScale(this.currentScale / kDefaultScaleDelta, true);
+  },
+
   set page(val) {
     var pages = this.pages;
     var input = document.getElementById('pageNumber');
@@ -123,12 +158,13 @@ var PDFView = {
       var page = pdf.getPage(i);
       pages.push(new PageView(container, page, i, page.width, page.height,
                               page.stats, this.navigateTo.bind(this)));
-      thumbnails.push(new ThumbnailView(sidebar, pages[i - 1]));
+      thumbnails.push(new ThumbnailView(sidebar, pages[i - 1],
+                                        page.width / page.height));
       var pageRef = page.ref;
       pagesRefMap[pageRef.num + ' ' + pageRef.gen + ' R'] = i;
     }
 
-    this.scale = (scale || kDefaultScale);
+    this.setScale(scale || kDefaultScale, true);
     this.page = parseInt(document.location.hash.substring(1)) || 1;
     this.pagesRefMap = pagesRefMap;
     this.destinations = pdf.catalog.destinations;
@@ -273,7 +309,7 @@ var PageView = function(container, content, id, width, height,
   };
 };
 
-var ThumbnailView = function(container, page) {
+var ThumbnailView = function(container, page, pageRatio) {
   var anchor = document.createElement('a');
   anchor.href = '#' + page.id;
 
@@ -292,8 +328,13 @@ var ThumbnailView = function(container, page) {
     canvas.id = 'thumbnail' + page.id;
     canvas.mozOpaque = true;
 
-    canvas.width = 104;
-    canvas.height = 134;
+    var maxThumbSize = 134;
+    canvas.width = pageRatio >= 1 ? maxThumbSize :
+      maxThumbSize * pageRatio;
+    canvas.height = pageRatio <= 1 ? maxThumbSize :
+      maxThumbSize / pageRatio;
+
+    div.setAttribute('data-loaded', true);
     div.appendChild(canvas);
 
     var ctx = canvas.getContext('2d');
@@ -349,7 +390,7 @@ window.addEventListener('load', function(evt) {
     params[unescape(param[0])] = unescape(param[1]);
   }
 
-  PDFView.open(params.file || kDefaultURL, parseInt(params.scale));
+  PDFView.open(params.file || kDefaultURL, parseFloat(params.scale));
 
   if (!window.File || !window.FileReader || !window.FileList || !window.Blob)
     document.getElementById('fileInput').style.display = 'none';
@@ -361,7 +402,7 @@ window.addEventListener('pdfloaded', function(evt) {
   PDFView.load(evt.detail);
 }, true);
 
-window.addEventListener('scroll', function onscroll(evt) {
+function updateViewarea() {
   var visiblePages = PDFView.getVisiblePages();
   for (var i = 0; i < visiblePages.length; i++) {
     var page = visiblePages[i];
@@ -379,8 +420,19 @@ window.addEventListener('scroll', function onscroll(evt) {
     PDFView.page = lastPage.id;
   else if (currentId < firstPage.id)
     PDFView.page = firstPage.id;
+}
+
+window.addEventListener('scroll', function onscroll(evt) {
+  updateViewarea();
 }, true);
 
+window.addEventListener('resize', function onscroll(evt) {
+  if (document.getElementById('pageWidthOption').selected ||
+      document.getElementById('pageFitOption').selected)
+      PDFView.parseScale(document.getElementById('scaleSelect').value);
+  updateViewarea();
+});
+
 window.addEventListener('hashchange', function(evt) {
   PDFView.page = PDFView.page;
 });
@@ -426,13 +478,36 @@ window.addEventListener('transitionend', function(evt) {
   }, 500);
 }, true);
 
-
 window.addEventListener('scalechange', function scalechange(evt) {
+  var customScaleOption = document.getElementById('customScaleOption');
+  customScaleOption.selected = false;
+
+  if (!evt.resetAutoSettings &&
+       (document.getElementById('pageWidthOption').selected ||
+        document.getElementById('pageFitOption').selected)) {
+      updateViewarea();
+      return;
+  }
+
   var options = document.getElementById('scaleSelect').options;
+  var predefinedValueFound = false;
+  var value = '' + evt.scale;
   for (var i = 0; i < options.length; i++) {
     var option = options[i];
-    option.selected = (option.value == evt.detail);
+    if (option.value != value) {
+      option.selected = false;
+      continue;
     }
+    option.selected = true;
+    predefinedValueFound = true;
+  }
+
+  if (!predefinedValueFound) {
+    customScaleOption.textContent = Math.round(evt.scale * 10000) / 100 + '%';
+    customScaleOption.selected = true;
+  }
+
+  updateViewarea();
 }, true);
 
 window.addEventListener('pagechange', function pagechange(evt) {
@@ -442,3 +517,20 @@ window.addEventListener('pagechange', function pagechange(evt) {
   document.getElementById('previous').disabled = (page == 1);
   document.getElementById('next').disabled = (page == PDFView.pages.length);
 }, true);
+
+window.addEventListener('keydown', function keydown(evt) {
+  switch(evt.keyCode) {
+    case 61: // FF/Mac '='
+    case 107: // FF '+' and '='
+    case 187: // Chrome '+'
+      PDFView.zoomIn();
+      break;
+    case 109: // FF '-'
+    case 189: // Chrome '-'
+      PDFView.zoomOut();
+      break;
+    case 48: // '0'
+      PDFView.setScale(kDefaultScale, true);
+      break;
+  }
+});