added pdf view with pdf.js

base/context_processors.py

@@ -7,7 +7,7 @@ These are referenced from the setting TEMPLATE_CONTEXT_PROCESSORS and used by
 RequestContext.
 """
 from settings import SEAFILE_VERSION, SITE_TITLE, SITE_NAME, SITE_BASE, \
-    ENABLE_SIGNUP, MAX_FILE_NAME
+    ENABLE_SIGNUP, MAX_FILE_NAME, USE_PDFJS
 try:
     from settings import BUSINESS_MODE
 except ImportError:
@@ -37,5 +37,6 @@ def base(request):
         'site_name': SITE_NAME,
         'enable_signup': ENABLE_SIGNUP,
         'max_file_name': MAX_FILE_NAME,
+        'use_pdfjs': USE_PDFJS,
         }
 

locale/zh_CN/LC_MESSAGES/django.po

@@ -7,7 +7,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2013-01-09 10:35+0800\n"
+"POT-Creation-Date: 2013-01-09 15:17+0800\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -1366,13 +1366,13 @@ msgstr "无"
 
 #: templates/repo_history.html:47 templates/repo_view_snapshot.html:51
 #: templates/sys_group_admin.html:28 templates/sys_seafadmin.html:29
-#: templates/sys_useradmin.html:41
+#: templates/sys_useradmin.html:41 templates/snippets/file_content_js.html:110
 msgid "Previous"
 msgstr "前一页"
 
 #: templates/repo_history.html:50 templates/repo_view_snapshot.html:54
 #: templates/sys_group_admin.html:31 templates/sys_seafadmin.html:32
-#: templates/sys_useradmin.html:44
+#: templates/sys_useradmin.html:44 templates/snippets/file_content_js.html:110
 msgid "Next"
 msgstr "下一页"
 
@@ -1830,7 +1830,29 @@ msgstr "请稍后尝试。"
 msgid "To view it online, you can use firefox, chrome or IE 9."
 msgstr "在线查看：请使用 firefox, chrome 或 IE 9。"
 
-#: templates/snippets/file_content_js.html:108
+#: templates/snippets/file_content_js.html:110
+msgid ""
+"<span id=\"pdf-page\"><label for=\"page-number\">Page</label> <input type="
+"\"number\" id=\"page-number\" value=\"1\" min=\"1\"></input> / <span id="
+"\"page-nums\"></span></span>"
+msgstr ""
+"<span id=\"pdf-page\"><label for=\"page-number\">第</label> <input type="
+"\"number\" id=\"page-number\" value=\"1\" min=\"1\"></input> / <span id="
+"\"page-nums\"></span> 页</span>"
+
+#: templates/snippets/file_content_js.html:110
+msgid "Full Screen"
+msgstr "全屏"
+
+#: templates/snippets/file_content_js.html:110
+msgid "loading..."
+msgstr "加载中..."
+
+#: templates/snippets/file_content_js.html:157
+msgid "You can use other browsers, for example, firefox, to view it online."
+msgstr "如果您想在线查看该文件，您可以使用其他浏览器比如 firefox 。"
+
+#: templates/snippets/file_content_js.html:162
 msgid "This type of file cannot be viewed online."
 msgstr "该类型文件无法在线查看。"
 

media/pdf_full_view/compatibility.js

@@ -0,0 +1,359 @@
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
+/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
+
+'use strict';
+
+// Checking if the typed arrays are supported
+(function checkTypedArrayCompatibility() {
+  if (typeof Uint8Array !== 'undefined') {
+    // some mobile versions do not support subarray (e.g. safari 5 / iOS)
+    if (typeof Uint8Array.prototype.subarray === 'undefined') {
+        Uint8Array.prototype.subarray = function subarray(start, end) {
+          return new Uint8Array(this.slice(start, end));
+        };
+        Float32Array.prototype.subarray = function subarray(start, end) {
+          return new Float32Array(this.slice(start, end));
+        };
+    }
+
+    // some mobile version might not support Float64Array
+    if (typeof Float64Array === 'undefined')
+      window.Float64Array = Float32Array;
+
+    return;
+  }
+
+  function subarray(start, end) {
+    return new TypedArray(this.slice(start, end));
+  }
+
+  function setArrayOffset(array, offset) {
+    if (arguments.length < 2)
+      offset = 0;
+    for (var i = 0, n = array.length; i < n; ++i, ++offset)
+      this[offset] = array[i] & 0xFF;
+  }
+
+  function TypedArray(arg1) {
+    var result;
+    if (typeof arg1 === 'number') {
+      result = [];
+      for (var i = 0; i < arg1; ++i)
+        result[i] = 0;
+    } else
+      result = arg1.slice(0);
+
+    result.subarray = subarray;
+    result.buffer = result;
+    result.byteLength = result.length;
+    result.set = setArrayOffset;
+
+    if (typeof arg1 === 'object' && arg1.buffer)
+      result.buffer = arg1.buffer;
+
+    return result;
+  }
+
+  window.Uint8Array = TypedArray;
+
+  // we don't need support for set, byteLength for 32-bit array
+  // so we can use the TypedArray as well
+  window.Uint32Array = TypedArray;
+  window.Int32Array = TypedArray;
+  window.Uint16Array = TypedArray;
+  window.Float32Array = TypedArray;
+  window.Float64Array = TypedArray;
+})();
+
+// Object.create() ?
+(function checkObjectCreateCompatibility() {
+  if (typeof Object.create !== 'undefined')
+    return;
+
+  Object.create = function objectCreate(proto) {
+    var constructor = function objectCreateConstructor() {};
+    constructor.prototype = proto;
+    return new constructor();
+  };
+})();
+
+// Object.defineProperty() ?
+(function checkObjectDefinePropertyCompatibility() {
+  if (typeof Object.defineProperty !== 'undefined') {
+    // some browsers (e.g. safari) cannot use defineProperty() on DOM objects
+    // and thus the native version is not sufficient
+    var definePropertyPossible = true;
+    try {
+      Object.defineProperty(new Image(), 'id', { value: 'test' });
+    } catch (e) {
+      definePropertyPossible = false;
+    }
+    if (definePropertyPossible) return;
+  }
+
+  Object.defineProperty = function objectDefineProperty(obj, name, def) {
+    delete obj[name];
+    if ('get' in def)
+      obj.__defineGetter__(name, def['get']);
+    if ('set' in def)
+      obj.__defineSetter__(name, def['set']);
+    if ('value' in def) {
+      obj.__defineSetter__(name, function objectDefinePropertySetter(value) {
+        this.__defineGetter__(name, function objectDefinePropertyGetter() {
+          return value;
+        });
+        return value;
+      });
+      obj[name] = def.value;
+    }
+  };
+})();
+
+// Object.keys() ?
+(function checkObjectKeysCompatibility() {
+  if (typeof Object.keys !== 'undefined')
+    return;
+
+  Object.keys = function objectKeys(obj) {
+    var result = [];
+    for (var i in obj) {
+      if (obj.hasOwnProperty(i))
+        result.push(i);
+    }
+    return result;
+  };
+})();
+
+// No XMLHttpRequest.response ?
+(function checkXMLHttpRequestResponseCompatibility() {
+  var xhrPrototype = XMLHttpRequest.prototype;
+  if ('response' in xhrPrototype ||
+      'mozResponseArrayBuffer' in xhrPrototype ||
+      'mozResponse' in xhrPrototype ||
+      'responseArrayBuffer' in xhrPrototype)
+    return;
+  // IE ?
+  if (typeof VBArray !== 'undefined') {
+    Object.defineProperty(xhrPrototype, 'response', {
+      get: function xmlHttpRequestResponseGet() {
+        return new Uint8Array(new VBArray(this.responseBody).toArray());
+      }
+    });
+    Object.defineProperty(xhrPrototype, 'overrideMimeType', {
+      value: function xmlHttpRequestOverrideMimeType(mimeType) {}
+    });
+    return;
+  }
+
+  // other browsers
+  function responseTypeSetter() {
+    // will be only called to set "arraybuffer"
+    this.overrideMimeType('text/plain; charset=x-user-defined');
+  }
+  if (typeof xhrPrototype.overrideMimeType === 'function') {
+    Object.defineProperty(xhrPrototype, 'responseType',
+                          { set: responseTypeSetter });
+  }
+  function responseGetter() {
+    var text = this.responseText;
+    var i, n = text.length;
+    var result = new Uint8Array(n);
+    for (i = 0; i < n; ++i)
+      result[i] = text.charCodeAt(i) & 0xFF;
+    return result;
+  }
+  Object.defineProperty(xhrPrototype, 'response', { get: responseGetter });
+})();
+
+// window.btoa (base64 encode function) ?
+(function checkWindowBtoaCompatibility() {
+  if ('btoa' in window)
+    return;
+
+  var digits =
+    'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
+
+  window.btoa = function windowBtoa(chars) {
+    var buffer = '';
+    var i, n;
+    for (i = 0, n = chars.length; i < n; i += 3) {
+      var b1 = chars.charCodeAt(i) & 0xFF;
+      var b2 = chars.charCodeAt(i + 1) & 0xFF;
+      var b3 = chars.charCodeAt(i + 2) & 0xFF;
+      var d1 = b1 >> 2, d2 = ((b1 & 3) << 4) | (b2 >> 4);
+      var d3 = i + 1 < n ? ((b2 & 0xF) << 2) | (b3 >> 6) : 64;
+      var d4 = i + 2 < n ? (b3 & 0x3F) : 64;
+      buffer += (digits.charAt(d1) + digits.charAt(d2) +
+                 digits.charAt(d3) + digits.charAt(d4));
+    }
+    return buffer;
+  };
+})();
+
+// Function.prototype.bind ?
+(function checkFunctionPrototypeBindCompatibility() {
+  if (typeof Function.prototype.bind !== 'undefined')
+    return;
+
+  Function.prototype.bind = function functionPrototypeBind(obj) {
+    var fn = this, headArgs = Array.prototype.slice.call(arguments, 1);
+    var bound = function functionPrototypeBindBound() {
+      var args = Array.prototype.concat.apply(headArgs, arguments);
+      return fn.apply(obj, args);
+    };
+    return bound;
+  };
+})();
+
+// IE9 text/html data URI
+(function checkDocumentDocumentModeCompatibility() {
+  if (!('documentMode' in document) || document.documentMode !== 9)
+    return;
+  // overriding the src property
+  var originalSrcDescriptor = Object.getOwnPropertyDescriptor(
+    HTMLIFrameElement.prototype, 'src');
+  Object.defineProperty(HTMLIFrameElement.prototype, 'src', {
+    get: function htmlIFrameElementPrototypeSrcGet() { return this.$src; },
+    set: function htmlIFrameElementPrototypeSrcSet(src) {
+      this.$src = src;
+      if (src.substr(0, 14) != 'data:text/html') {
+        originalSrcDescriptor.set.call(this, src);
+        return;
+      }
+      // for text/html, using blank document and then
+      // document's open, write, and close operations
+      originalSrcDescriptor.set.call(this, 'about:blank');
+      setTimeout((function htmlIFrameElementPrototypeSrcOpenWriteClose() {
+        var doc = this.contentDocument;
+        doc.open('text/html');
+        doc.write(src.substr(src.indexOf(',') + 1));
+        doc.close();
+      }).bind(this), 0);
+    },
+    enumerable: true
+  });
+})();
+
+// HTMLElement dataset property
+(function checkDatasetProperty() {
+  var div = document.createElement('div');
+  if ('dataset' in div)
+    return; // dataset property exists
+
+  Object.defineProperty(HTMLElement.prototype, 'dataset', {
+    get: function() {
+      if (this._dataset)
+        return this._dataset;
+
+      var dataset = {};
+      for (var j = 0, jj = this.attributes.length; j < jj; j++) {
+        var attribute = this.attributes[j];
+        if (attribute.name.substring(0, 5) != 'data-')
+          continue;
+        var key = attribute.name.substring(5).replace(/\-([a-z])/g,
+          function(all, ch) { return ch.toUpperCase(); });
+        dataset[key] = attribute.value;
+      }
+
+      Object.defineProperty(this, '_dataset', {
+        value: dataset,
+        writable: false,
+        enumerable: false
+      });
+      return dataset;
+    },
+    enumerable: true
+  });
+})();
+
+// HTMLElement classList property
+(function checkClassListProperty() {
+  var div = document.createElement('div');
+  if ('classList' in div)
+    return; // classList property exists
+
+  function changeList(element, itemName, add, remove) {
+    var s = element.className || '';
+    var list = s.split(/\s+/g);
+    if (list[0] == '') list.shift();
+    var index = list.indexOf(itemName);
+    if (index < 0 && add)
+      list.push(itemName);
+    if (index >= 0 && remove)
+      list.splice(index, 1);
+    element.className = list.join(' ');
+  }
+
+  var classListPrototype = {
+    add: function(name) {
+      changeList(this.element, name, true, false);
+    },
+    remove: function(name) {
+      changeList(this.element, name, false, true);
+    },
+    toggle: function(name) {
+      changeList(this.element, name, true, true);
+    }
+  };
+
+  Object.defineProperty(HTMLElement.prototype, 'classList', {
+    get: function() {
+      if (this._classList)
+        return this._classList;
+
+      var classList = Object.create(classListPrototype, {
+        element: {
+          value: this,
+          writable: false,
+          enumerable: true
+        }
+      });
+      Object.defineProperty(this, '_classList', {
+        value: classList,
+        writable: false,
+        enumerable: false
+      });
+      return classList;
+    },
+    enumerable: true
+  });
+})();
+
+// Check console compatability
+(function checkConsoleCompatibility() {
+  if (typeof console == 'undefined') {
+    console = {log: function() {}};
+  }
+})();
+
+// Check onclick compatibility in Opera
+(function checkOnClickCompatibility() {
+  // workaround for reported Opera bug DSK-354448:
+  // onclick fires on disabled buttons with opaque content
+  function ignoreIfTargetDisabled(event) {
+    if (isDisabled(event.target)) {
+      event.stopPropagation();
+    }
+  }
+  function isDisabled(node) {
+    return node.disabled || (node.parentNode && isDisabled(node.parentNode));
+  }
+  if (navigator.userAgent.indexOf('Opera') != -1) {
+    // use browser detection since we cannot feature-check this bug
+    document.addEventListener('click', ignoreIfTargetDisabled, true);
+  }
+})();
+
+// Checks if navigator.language is supported
+(function checkNavigatorLanguage() {
+  if ('language' in navigator)
+    return;
+  Object.defineProperty(navigator, 'language', {
+    get: function navigatorLanguage() {
+      var language = navigator.userLanguage || 'en-US';
+      return language.substring(0, 2).toLowerCase() +
+        language.substring(2).toUpperCase();
+    },
+    enumerable: true
+  });
+})();

media/pdf_full_view/debugger.js

@@ -0,0 +1,476 @@
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
+/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
+
+'use strict';
+
+var FontInspector = (function FontInspectorClosure() {
+  var fonts;
+  var panelWidth = 300;
+  var active = false;
+  var fontAttribute = 'data-font-name';
+  function removeSelection() {
+    var divs = document.querySelectorAll('div[' + fontAttribute + ']');
+    for (var i = 0, ii = divs.length; i < ii; ++i) {
+      var div = divs[i];
+      div.className = '';
+    }
+  }
+  function resetSelection() {
+    var divs = document.querySelectorAll('div[' + fontAttribute + ']');
+    for (var i = 0, ii = divs.length; i < ii; ++i) {
+      var div = divs[i];
+      div.className = 'debuggerHideText';
+    }
+  }
+  function selectFont(fontName, show) {
+    var divs = document.querySelectorAll('div[' + fontAttribute + '=' +
+                                         fontName + ']');
+    for (var i = 0, ii = divs.length; i < ii; ++i) {
+      var div = divs[i];
+      div.className = show ? 'debuggerShowText' : 'debuggerHideText';
+    }
+  }
+  function textLayerClick(e) {
+    if (!e.target.dataset.fontName || e.target.tagName != 'DIV')
+      return;
+    var fontName = e.target.dataset.fontName;
+    var selects = document.getElementsByTagName('input');
+    for (var i = 0; i < selects.length; ++i) {
+      var select = selects[i];
+      if (select.dataset.fontName != fontName) continue;
+      select.checked = !select.checked;
+      selectFont(fontName, select.checked);
+      select.scrollIntoView();
+    }
+  }
+  return {
+    // Poperties/functions needed by PDFBug.
+    id: 'FontInspector',
+    name: 'Font Inspector',
+    panel: null,
+    manager: null,
+    init: function init() {
+      var panel = this.panel;
+      panel.setAttribute('style', 'padding: 5px;');
+      var tmp = document.createElement('button');
+      tmp.addEventListener('click', resetSelection);
+      tmp.textContent = 'Refresh';
+      panel.appendChild(tmp);
+
+      fonts = document.createElement('div');
+      panel.appendChild(fonts);
+    },
+    enabled: false,
+    get active() {
+      return active;
+    },
+    set active(value) {
+      active = value;
+      if (active) {
+        document.body.addEventListener('click', textLayerClick, true);
+        resetSelection();
+      } else {
+        document.body.removeEventListener('click', textLayerClick, true);
+        removeSelection();
+      }
+    },
+    // FontInspector specific functions.
+    fontAdded: function fontAdded(fontObj, url) {
+      function properties(obj, list) {
+        var moreInfo = document.createElement('table');
+        for (var i = 0; i < list.length; i++) {
+          var tr = document.createElement('tr');
+          var td1 = document.createElement('td');
+          td1.textContent = list[i];
+          tr.appendChild(td1);
+          var td2 = document.createElement('td');
+          td2.textContent = obj[list[i]].toString();
+          tr.appendChild(td2);
+          moreInfo.appendChild(tr);
+        }
+        return moreInfo;
+      }
+      var moreInfo = properties(fontObj, ['name', 'type']);
+      var m = /url\(['"]?([^\)"']+)/.exec(url);
+      var fontName = fontObj.loadedName;
+      var font = document.createElement('div');
+      var name = document.createElement('span');
+      name.textContent = fontName;
+      var download = document.createElement('a');
+      download.href = m[1];
+      download.textContent = 'Download';
+      var logIt = document.createElement('a');
+      logIt.href = '';
+      logIt.textContent = 'Log';
+      logIt.addEventListener('click', function(event) {
+        event.preventDefault();
+        console.log(fontObj);
+      });
+      var select = document.createElement('input');
+      select.setAttribute('type', 'checkbox');
+      select.dataset.fontName = fontName;
+      select.addEventListener('click', (function(select, fontName) {
+        return (function() {
+           selectFont(fontName, select.checked);
+        });
+      })(select, fontName));
+      font.appendChild(select);
+      font.appendChild(name);
+      font.appendChild(document.createTextNode(' '));
+      font.appendChild(download);
+      font.appendChild(document.createTextNode(' '));
+      font.appendChild(logIt);
+      font.appendChild(moreInfo);
+      fonts.appendChild(font);
+      // Somewhat of a hack, should probably add a hook for when the text layer
+      // is done rendering.
+      setTimeout(function() {
+        if (this.active)
+          resetSelection();
+      }.bind(this), 2000);
+    }
+  };
+})();
+
+// Manages all the page steppers.
+var StepperManager = (function StepperManagerClosure() {
+  var steppers = [];
+  var stepperDiv = null;
+  var stepperControls = null;
+  var stepperChooser = null;
+  var breakPoints = {};
+  return {
+    // Poperties/functions needed by PDFBug.
+    id: 'Stepper',
+    name: 'Stepper',
+    panel: null,
+    manager: null,
+    init: function init() {
+      var self = this;
+      this.panel.setAttribute('style', 'padding: 5px;');
+      stepperControls = document.createElement('div');
+      stepperChooser = document.createElement('select');
+      stepperChooser.addEventListener('change', function(event) {
+        self.selectStepper(this.value);
+      });
+      stepperControls.appendChild(stepperChooser);
+      stepperDiv = document.createElement('div');
+      this.panel.appendChild(stepperControls);
+      this.panel.appendChild(stepperDiv);
+      if (sessionStorage.getItem('pdfjsBreakPoints'))
+        breakPoints = JSON.parse(sessionStorage.getItem('pdfjsBreakPoints'));
+    },
+    enabled: false,
+    active: false,
+    // Stepper specific functions.
+    create: function create(pageIndex) {
+      var debug = document.createElement('div');
+      debug.id = 'stepper' + pageIndex;
+      debug.setAttribute('hidden', true);
+      debug.className = 'stepper';
+      stepperDiv.appendChild(debug);
+      var b = document.createElement('option');
+      b.textContent = 'Page ' + (pageIndex + 1);
+      b.value = pageIndex;
+      stepperChooser.appendChild(b);
+      var initBreakPoints = breakPoints[pageIndex] || [];
+      var stepper = new Stepper(debug, pageIndex, initBreakPoints);
+      steppers.push(stepper);
+      if (steppers.length === 1)
+        this.selectStepper(pageIndex, false);
+      return stepper;
+    },
+    selectStepper: function selectStepper(pageIndex, selectPanel) {
+      if (selectPanel)
+        this.manager.selectPanel(1);
+      for (var i = 0; i < steppers.length; ++i) {
+        var stepper = steppers[i];
+        if (stepper.pageIndex == pageIndex)
+          stepper.panel.removeAttribute('hidden');
+        else
+          stepper.panel.setAttribute('hidden', true);
+      }
+      var options = stepperChooser.options;
+      for (var i = 0; i < options.length; ++i) {
+        var option = options[i];
+        option.selected = option.value == pageIndex;
+      }
+    },
+    saveBreakPoints: function saveBreakPoints(pageIndex, bps) {
+      breakPoints[pageIndex] = bps;
+      sessionStorage.setItem('pdfjsBreakPoints', JSON.stringify(breakPoints));
+    }
+  };
+})();
+
+// The stepper for each page's IRQueue.
+var Stepper = (function StepperClosure() {
+  function Stepper(panel, pageIndex, initialBreakPoints) {
+    this.panel = panel;
+    this.len;
+    this.breakPoint = 0;
+    this.nextBreakPoint = null;
+    this.pageIndex = pageIndex;
+    this.breakPoints = initialBreakPoints;
+    this.currentIdx = -1;
+  }
+  Stepper.prototype = {
+    init: function init(IRQueue) {
+      // Shorter way to create element and optionally set textContent.
+      function c(tag, textContent) {
+        var d = document.createElement(tag);
+        if (textContent)
+          d.textContent = textContent;
+        return d;
+      }
+      var panel = this.panel;
+      this.len = IRQueue.fnArray.length;
+      var content = c('div', 'c=continue, s=step');
+      var table = c('table');
+      content.appendChild(table);
+      table.cellSpacing = 0;
+      var headerRow = c('tr');
+      table.appendChild(headerRow);
+      headerRow.appendChild(c('th', 'Break'));
+      headerRow.appendChild(c('th', 'Idx'));
+      headerRow.appendChild(c('th', 'fn'));
+      headerRow.appendChild(c('th', 'args'));
+
+      for (var i = 0; i < IRQueue.fnArray.length; i++) {
+        var line = c('tr');
+        line.className = 'line';
+        line.dataset.idx = i;
+        table.appendChild(line);
+        var checked = this.breakPoints.indexOf(i) != -1;
+        var args = IRQueue.argsArray[i] ? IRQueue.argsArray[i] : [];
+
+        var breakCell = c('td');
+        var cbox = c('input');
+        cbox.type = 'checkbox';
+        cbox.className = 'points';
+        cbox.checked = checked;
+        var self = this;
+        cbox.onclick = (function(x) {
+          return function() {
+            if (this.checked)
+              self.breakPoints.push(x);
+            else
+              self.breakPoints.splice(self.breakPoints.indexOf(x), 1);
+            StepperManager.saveBreakPoints(self.pageIndex, self.breakPoints);
+          }
+        })(i);
+
+        breakCell.appendChild(cbox);
+        line.appendChild(breakCell);
+        line.appendChild(c('td', i.toString()));
+        line.appendChild(c('td', IRQueue.fnArray[i]));
+        line.appendChild(c('td', args.join(', ')));
+      }
+      panel.appendChild(content);
+      var self = this;
+    },
+    getNextBreakPoint: function getNextBreakPoint() {
+      this.breakPoints.sort(function(a, b) { return a - b; });
+      for (var i = 0; i < this.breakPoints.length; i++) {
+        if (this.breakPoints[i] > this.currentIdx)
+          return this.breakPoints[i];
+      }
+      return null;
+    },
+    breakIt: function breakIt(idx, callback) {
+      StepperManager.selectStepper(this.pageIndex, true);
+      var self = this;
+      var dom = document;
+      self.currentIdx = idx;
+      var listener = function(e) {
+        switch (e.keyCode) {
+          case 83: // step
+            dom.removeEventListener('keydown', listener, false);
+            self.nextBreakPoint = self.currentIdx + 1;
+            self.goTo(-1);
+            callback();
+            break;
+          case 67: // continue
+            dom.removeEventListener('keydown', listener, false);
+            var breakPoint = self.getNextBreakPoint();
+            self.nextBreakPoint = breakPoint;
+            self.goTo(-1);
+            callback();
+            break;
+        }
+      }
+      dom.addEventListener('keydown', listener, false);
+      self.goTo(idx);
+    },
+    goTo: function goTo(idx) {
+      var allRows = this.panel.getElementsByClassName('line');
+      for (var x = 0, xx = allRows.length; x < xx; ++x) {
+        var row = allRows[x];
+        if (row.dataset.idx == idx) {
+          row.style.backgroundColor = 'rgb(251,250,207)';
+          row.scrollIntoView();
+        } else {
+          row.style.backgroundColor = null;
+        }
+      }
+    }
+  };
+  return Stepper;
+})();
+
+var Stats = (function Stats() {
+  var stats = [];
+  function clear(node) {
+    while (node.hasChildNodes())
+      node.removeChild(node.lastChild);
+  }
+  function getStatIndex(pageNumber) {
+    for (var i = 0, ii = stats.length; i < ii; ++i)
+      if (stats[i].pageNumber === pageNumber)
+        return i;
+    return false;
+  }
+  return {
+    // Poperties/functions needed by PDFBug.
+    id: 'Stats',
+    name: 'Stats',
+    panel: null,
+    manager: null,
+    init: function init() {
+      this.panel.setAttribute('style', 'padding: 5px;');
+      PDFJS.enableStats = true;
+    },
+    enabled: false,
+    active: false,
+    // Stats specific functions.
+    add: function(pageNumber, stat) {
+      if (!stat)
+        return;
+      var statsIndex = getStatIndex(pageNumber);
+      if (statsIndex !== false) {
+        var b = stats[statsIndex];
+        this.panel.removeChild(b.div);
+        stats.splice(statsIndex, 1);
+      }
+      var wrapper = document.createElement('div');
+      wrapper.className = 'stats';
+      var title = document.createElement('div');
+      title.className = 'title';
+      title.textContent = 'Page: ' + pageNumber;
+      var statsDiv = document.createElement('div');
+      statsDiv.textContent = stat.toString();
+      wrapper.appendChild(title);
+      wrapper.appendChild(statsDiv);
+      stats.push({ pageNumber: pageNumber, div: wrapper });
+      stats.sort(function(a, b) { return a.pageNumber - b.pageNumber});
+      clear(this.panel);
+      for (var i = 0, ii = stats.length; i < ii; ++i)
+        this.panel.appendChild(stats[i].div);
+    }
+  };
+})();
+
+// Manages all the debugging tools.
+var PDFBug = (function PDFBugClosure() {
+  var panelWidth = 300;
+  var buttons = [];
+  var activePanel = null;
+
+  return {
+    tools: [
+      FontInspector,
+      StepperManager,
+      Stats
+    ],
+    enable: function(ids) {
+      var all = false, tools = this.tools;
+      if (ids.length === 1 && ids[0] === 'all')
+        all = true;
+      for (var i = 0; i < tools.length; ++i) {
+        var tool = tools[i];
+        if (all || ids.indexOf(tool.id) !== -1)
+          tool.enabled = true;
+      }
+      if (!all) {
+        // Sort the tools by the order they are enabled.
+        tools.sort(function(a, b) {
+          var indexA = ids.indexOf(a.id);
+          indexA = indexA < 0 ? tools.length : indexA;
+          var indexB = ids.indexOf(b.id);
+          indexB = indexB < 0 ? tools.length : indexB;
+          return indexA - indexB;
+        });
+      }
+    },
+    init: function init() {
+      /*
+       * Basic Layout:
+       * PDFBug
+       *  Controls
+       *  Panels
+       *    Panel
+       *    Panel
+       *    ...
+       */
+      var ui = document.createElement('div');
+      ui.id = 'PDFBug';
+
+      var controls = document.createElement('div');
+      controls.setAttribute('class', 'controls');
+      ui.appendChild(controls);
+
+      var panels = document.createElement('div');
+      panels.setAttribute('class', 'panels');
+      ui.appendChild(panels);
+
+      var container = document.getElementById('viewerContainer');
+      container.appendChild(ui);
+      container.style.right = panelWidth + 'px';
+
+      // Initialize all the debugging tools.
+      var tools = this.tools;
+      for (var i = 0; i < tools.length; ++i) {
+        var tool = tools[i];
+        var panel = document.createElement('div');
+        var panelButton = document.createElement('button');
+        panelButton.textContent = tool.name;
+        var self = this;
+        panelButton.addEventListener('click', (function(selected) {
+          return function(event) {
+            event.preventDefault();
+            self.selectPanel(selected);
+          };
+        })(i));
+        controls.appendChild(panelButton);
+        panels.appendChild(panel);
+        tool.panel = panel;
+        tool.manager = this;
+        if (tool.enabled)
+          tool.init();
+        else
+          panel.textContent = tool.name + ' is disabled. To enable add ' +
+                              ' "' + tool.id + '" to the pdfBug parameter ' +
+                              'and refresh (seperate multiple by commas).';
+        buttons.push(panelButton);
+      }
+      this.selectPanel(0);
+    },
+    selectPanel: function selectPanel(index) {
+      if (index === activePanel)
+        return;
+      activePanel = index;
+      var tools = this.tools;
+      for (var j = 0; j < tools.length; ++j) {
+        if (j == index) {
+          buttons[j].setAttribute('class', 'active');
+          tools[j].active = true;
+          tools[j].panel.removeAttribute('hidden');
+        } else {
+          buttons[j].setAttribute('class', '');
+          tools[j].active = false;
+          tools[j].panel.setAttribute('hidden', 'true');
+        }
+      }
+    }
+  };
+})();

media/pdf_full_view/l10n.js

@@ -0,0 +1,322 @@
+/*  Copyright (c) 2011-2012 Fabien Cazenave, Mozilla.
+  *
+  * Permission is hereby granted, free of charge, to any person obtaining a copy
+  * of this software and associated documentation files (the "Software"), to
+  * deal in the Software without restriction, including without limitation the
+  * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+  * sell copies of the Software, and to permit persons to whom the Software is
+  * furnished to do so, subject to the following conditions:
+  *
+  * The above copyright notice and this permission notice shall be included in
+  * all copies or substantial portions of the Software.
+  *
+  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+  * IN THE SOFTWARE.
+  */
+/*
+  Additional modifications for PDF.js project:
+    - Loading resources from <script type='application/l10n'>;
+    - Disabling language initialization on page loading;
+    - Add fallback argument to the translateString.
+*/
+'use strict';
+
+(function(window) {
+  var gL10nData = {};
+  var gTextData = '';
+  var gLanguage = '';
+
+  // parser
+
+  function evalString(text) {
+    return text.replace(/\\\\/g, '\\')
+               .replace(/\\n/g, '\n')
+               .replace(/\\r/g, '\r')
+               .replace(/\\t/g, '\t')
+               .replace(/\\b/g, '\b')
+               .replace(/\\f/g, '\f')
+               .replace(/\\{/g, '{')
+               .replace(/\\}/g, '}')
+               .replace(/\\"/g, '"')
+               .replace(/\\'/g, "'");
+  }
+
+  function parseProperties(text, lang) {
+    var reBlank = /^\s*|\s*$/;
+    var reComment = /^\s*#|^\s*$/;
+    var reSection = /^\s*\[(.*)\]\s*$/;
+    var reImport = /^\s*@import\s+url\((.*)\)\s*$/i;
+
+    // parse the *.properties file into an associative array
+    var currentLang = '*';
+    var supportedLang = [];
+    var skipLang = false;
+    var data = [];
+    var match = '';
+    var entries = text.replace(reBlank, '').split(/[\r\n]+/);
+    for (var i = 0; i < entries.length; i++) {
+      var line = entries[i];
+
+      // comment or blank line?
+      if (reComment.test(line))
+        continue;
+
+      // section start?
+      if (reSection.test(line)) {
+        match = reSection.exec(line);
+        currentLang = match[1];
+        skipLang = (currentLang != lang) && (currentLang != '*') &&
+          (currentLang != lang.substring(0, 2));
+        continue;
+      } else if (skipLang) {
+        continue;
+      }
+
+      // @import rule?
+      if (reImport.test(line)) {
+        match = reImport.exec(line);
+      }
+
+      // key-value pair
+      var tmp = line.split('=');
+      if (tmp.length > 1)
+        data[tmp[0]] = evalString(tmp[1]);
+    }
+
+    // find the attribute descriptions, if any
+    for (var key in data) {
+      var id, prop, index = key.lastIndexOf('.');
+      if (index > 0) { // attribute
+        id = key.substring(0, index);
+        prop = key.substr(index + 1);
+      } else { // textContent, could be innerHTML as well
+        id = key;
+        prop = 'textContent';
+      }
+      if (!gL10nData[id])
+        gL10nData[id] = {};
+      gL10nData[id][prop] = data[key];
+    }
+  }
+
+  function parse(text, lang) {
+    gTextData += text;
+    // we only support *.properties files at the moment
+    return parseProperties(text, lang);
+  }
+
+  // load and parse the specified resource file
+  function loadResource(href, lang, onSuccess, onFailure) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', href, true);
+    xhr.overrideMimeType('text/plain; charset=utf-8');
+    xhr.onreadystatechange = function() {
+      if (xhr.readyState == 4) {
+        if (xhr.status == 200 || xhr.status == 0) {
+          parse(xhr.responseText, lang);
+          if (onSuccess)
+            onSuccess();
+        } else {
+          if (onFailure)
+            onFailure();
+        }
+      }
+    };
+    xhr.send(null);
+  }
+
+  // load and parse all resources for the specified locale
+  function loadLocale(lang, callback) {
+    clear();
+
+    // check all <link type="application/l10n" href="..." /> nodes
+    // and load the resource files
+    var langLinks = document.querySelectorAll('link[type="application/l10n"]');
+    var langLinksCount = langLinks.length;
+    var langScripts = document.querySelectorAll('script[type="application/l10n"]');
+    var langScriptCount = langScripts.length;
+    var langCount = langLinksCount + langScriptCount;
+
+    // start the callback when all resources are loaded
+    var onResourceLoaded = null;
+    var gResourceCount = 0;
+    onResourceLoaded = function() {
+      gResourceCount++;
+      if (gResourceCount >= langCount) {
+        // execute the [optional] callback
+        if (callback)
+          callback();
+        // fire a 'localized' DOM event
+        var evtObject = document.createEvent('Event');
+        evtObject.initEvent('localized', false, false);
+        evtObject.language = lang;
+        window.dispatchEvent(evtObject);
+      }
+    }
+
+    // load all resource files
+    function l10nResourceLink(link) {
+      var href = link.href;
+      var type = link.type;
+      this.load = function(lang, callback) {
+        var applied = lang;
+        loadResource(href, lang, callback, function() {
+          console.warn(href + ' not found.');
+          applied = '';
+        });
+        return applied; // return lang if found, an empty string if not found
+      };
+    }
+
+    gLanguage = lang;
+    for (var i = 0; i < langLinksCount; i++) {
+      var resource = new l10nResourceLink(langLinks[i]);
+      var rv = resource.load(lang, onResourceLoaded);
+      if (rv != lang) // lang not found, used default resource instead
+        gLanguage = '';
+    }
+    for (var i = 0; i < langScriptCount; i++) {
+      var scriptText = langScripts[i].text;
+      parse(scriptText, lang);
+      onResourceLoaded();
+    }
+  }
+
+  // fetch an l10n object, warn if not found
+  function getL10nData(key) {
+    var data = gL10nData[key];
+    if (!data)
+      console.warn('[l10n] #' + key + ' missing for [' + gLanguage + ']');
+    return data;
+  }
+
+  // replace {{arguments}} with their values
+  function substArguments(str, args) {
+    var reArgs = /\{\{\s*([a-zA-Z\.]+)\s*\}\}/;
+    var match = reArgs.exec(str);
+    while (match) {
+      if (!match || match.length < 2)
+        return str; // argument key not found
+
+      var arg = match[1];
+      var sub = '';
+      if (arg in args) {
+        sub = args[arg];
+      } else if (arg in gL10nData) {
+        sub = gL10nData[arg].textContent;
+      } else {
+        console.warn('[l10n] could not find argument {{' + arg + '}}');
+        return str;
+      }
+
+      str = str.substring(0, match.index) + sub +
+            str.substr(match.index + match[0].length);
+      match = reArgs.exec(str);
+    }
+    return str;
+  }
+
+  // translate a string
+  function translateString(key, args, fallback) {
+    var data = getL10nData(key);
+    if (!data && fallback)
+      data = {textContent: fallback};
+    if (!data)
+      return '{{' + key + '}}';
+    return substArguments(data.textContent, args);
+  }
+
+  // translate an HTML element
+  function translateElement(element) {
+    if (!element || !element.dataset)
+      return;
+
+    // get the related l10n object
+    var key = element.dataset.l10nId;
+    var data = getL10nData(key);
+    if (!data)
+      return;
+
+    // get arguments (if any)
+    // TODO: more flexible parser?
+    var args;
+    if (element.dataset.l10nArgs) try {
+      args = JSON.parse(element.dataset.l10nArgs);
+    } catch (e) {
+      console.warn('[l10n] could not parse arguments for #' + key + '');
+    }
+
+    // translate element
+    // TODO: security check?
+    for (var k in data)
+      element[k] = substArguments(data[k], args);
+  }
+
+  // translate an HTML subtree
+  function translateFragment(element) {
+    element = element || document.querySelector('html');
+
+    // check all translatable children (= w/ a `data-l10n-id' attribute)
+    var children = element.querySelectorAll('*[data-l10n-id]');
+    var elementCount = children.length;
+    for (var i = 0; i < elementCount; i++)
+      translateElement(children[i]);
+
+    // translate element itself if necessary
+    if (element.dataset.l10nId)
+      translateElement(element);
+  }
+
+  // clear all l10n data
+  function clear() {
+    gL10nData = {};
+    gTextData = '';
+    gLanguage = '';
+  }
+
+  /*
+  // load the default locale on startup
+  window.addEventListener('DOMContentLoaded', function() {
+    var lang = navigator.language;
+    if (navigator.mozSettings) {
+      var req = navigator.mozSettings.getLock().get('language.current');
+      req.onsuccess = function() {
+        loadLocale(req.result['language.current'] || lang, translateFragment);
+      };
+      req.onerror = function() {
+        loadLocale(lang, translateFragment);
+      };
+    } else {
+      loadLocale(lang, translateFragment);
+    }
+  });
+  */
+
+  // Public API
+  document.mozL10n = {
+    // get a localized string
+    get: translateString,
+
+    // get|set the document language and direction
+    get language() {
+      return {
+        // get|set the document language (ISO-639-1)
+        get code() { return gLanguage; },
+        set code(lang) { loadLocale(lang, translateFragment); },
+
+        // get the direction (ltr|rtl) of the current language
+        get direction() {
+          // http://www.w3.org/International/questions/qa-scripts
+          // Arabic, Hebrew, Farsi, Pashto, Urdu
+          var rtlList = ['ar', 'he', 'fa', 'ps', 'ur'];
+          return (rtlList.indexOf(gLanguage) >= 0) ? 'rtl' : 'ltr';
+        }
+      };
+    }
+  };
+})(this);

settings.py

@@ -144,6 +144,7 @@ ACCOUNT_ACTIVATION_DAYS = 7
 
 # File preview
 FILE_PREVIEW_MAX_SIZE = 10 * 1024 * 1024
+USE_PDFJS = True
 
 # Avatar
 AVATAR_STORAGE_DIR = 'avatars'

templates/pdf_full_view.html

@@ -0,0 +1,149 @@
+<!DOCTYPE html>
+<html dir="ltr">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+        <title></title>
+        <link rel="stylesheet" href="{{ MEDIA_URL }}pdf_full_view/viewer.css"/>
+        <link rel="resource" type="application/l10n" href="{{ MEDIA_URL }}pdf_full_view/locale.properties"/>
+    </head>
+
+    <body data="{{ file_src }}">
+        <div id="outerContainer">
+
+            <div id="sidebarContainer">
+                <div id="toolbarSidebar" class="splitToolbarButton toggled">
+                    <button id="viewThumbnail" class="toolbarButton group toggled" title="Show Thumbnails" onclick="PDFView.switchSidebarView('thumbs')" tabindex="1" data-l10n-id="thumbs">
+                        <span data-l10n-id="thumbs_label">Thumbnails</span>
+                    </button>
+                    <button id="viewOutline" class="toolbarButton group" title="Show Document Outline" onclick="PDFView.switchSidebarView('outline')" tabindex="2" data-l10n-id="outline">
+                        <span data-l10n-id="outline_label">Document Outline</span>
+                    </button>
+                    <button id="viewSearch" class="toolbarButton group hidden" title="Search Document" onclick="PDFView.switchSidebarView('search')" tabindex="3" data-l10n-id="search_panel">
+                        <span data-l10n-id="search_panel_label">Search Document</span>
+                    </button>
+                </div>
+                <div id="sidebarContent">
+                    <div id="thumbnailView">
+                    </div>
+                    <div id="outlineView" class="hidden">
+                    </div>
+                    <div id="searchView" class="hidden">
+                        <div id="searchToolbar">
+                            <input id="searchTermsInput" class="toolbarField" onkeydown='if (event.keyCode == 13) PDFView.search()'>
+                            <button id="searchButton" class="textButton toolbarButton" onclick='PDFView.search()' data-l10n-id="search">Find</button>
+                        </div>
+                        <div id="searchResults"></div>
+                    </div>
+                </div>
+            </div>  <!-- sidebarContainer -->
+
+            <div id="mainContainer">
+                <div class="toolbar">
+                    <div id="toolbarContainer">
+
+                        <div id="toolbarViewer">
+                            <div id="toolbarViewerLeft">
+                                <button id="sidebarToggle" class="toolbarButton" title="Toggle Sidebar" tabindex="4" data-l10n-id="toggle_slider">
+                                    <span data-l10n-id="toggle_slider_label">Toggle Sidebar</span>
+                                </button>
+                                <div class="toolbarButtonSpacer"></div>
+                                <div class="splitToolbarButton">
+                                    <button class="toolbarButton pageUp" title="Previous Page" onclick="PDFView.page--" id="previous" tabindex="5" data-l10n-id="previous">
+                                        <span data-l10n-id="previous_label">Previous</span>
+                                    </button>
+                                    <div class="splitToolbarButtonSeparator"></div>
+                                    <button class="toolbarButton pageDown" title="Next Page" onclick="PDFView.page++" id="next" tabindex="6" data-l10n-id="next">
+                                        <span data-l10n-id="next_label">Next</span>
+                                    </button>
+                                </div>
+                                <label id="pageNumberLabel" class="toolbarLabel" for="pageNumber" data-l10n-id="page_label">Page: </label>
+                                <input type="number" id="pageNumber" class="toolbarField pageNumber" onchange="PDFView.page = this.value;" value="1" size="4" min="1" tabindex="7">
+                                </input>
+                                <span id="numPages" class="toolbarLabel"></span>
+                            </div>
+                            <div id="toolbarViewerRight">
+                                <input id="fileInput" class="fileInput" type="file" oncontextmenu="return false;" style="visibility: hidden; position: fixed; right: 0; top: 0" />
+                                <button id="openFile" class="toolbarButton openFile" title="Open File" tabindex="11" data-l10n-id="open_file" onclick="document.getElementById('fileInput').click()">
+                                    <span data-l10n-id="open_file_label">Open</span>
+                                </button>
+
+                                <button id="print" class="toolbarButton print" title="Print" tabindex="11" data-l10n-id="print" onclick="window.print()">
+                                    <span data-l10n-id="print_label">Print</span>
+                                </button>
+
+                                <button id="download" class="toolbarButton download" title="Download" onclick="PDFView.download();" tabindex="12" data-l10n-id="download">
+                                    <span data-l10n-id="download_label">Download</span>
+                                </button>
+                                <!-- <div class="toolbarButtonSpacer"></div> -->
+                                <a href="#" id="viewBookmark" class="toolbarButton bookmark" title="Current view (copy or open in new window)" tabindex="13" data-l10n-id="bookmark"><span data-l10n-id="bookmark_label">Current View</span></a>
+                            </div>
+                            <div class="outerCenter">
+                                <div class="innerCenter" id="toolbarViewerMiddle">
+                                    <div class="splitToolbarButton">
+                                        <button class="toolbarButton zoomOut" title="Zoom Out" onclick="PDFView.zoomOut();" tabindex="8" data-l10n-id="zoom_out">
+                                            <span data-l10n-id="zoom_out_label">Zoom Out</span>
+                                        </button>
+                                        <div class="splitToolbarButtonSeparator"></div>
+                                        <button class="toolbarButton zoomIn" title="Zoom In" onclick="PDFView.zoomIn();" tabindex="9" data-l10n-id="zoom_in">
+                                            <span data-l10n-id="zoom_in_label">Zoom In</span>
+                                        </button>
+                                    </div>
+                                    <span id="scaleSelectContainer" class="dropdownToolbarButton">
+                                        <select id="scaleSelect" onchange="PDFView.parseScale(this.value);" title="Zoom" oncontextmenu="return false;" tabindex="10" data-l10n-id="zoom">
+                                            <option id="pageAutoOption" value="auto" selected="selected" data-l10n-id="page_scale_auto">Automatic Zoom</option>
+                                            <option id="pageActualOption" value="page-actual" data-l10n-id="page_scale_actual">Actual Size</option>
+                                            <option id="pageFitOption" value="page-fit" data-l10n-id="page_scale_fit">Fit Page</option>
+                                            <option id="pageWidthOption" value="page-width" data-l10n-id="page_scale_width">Full Width</option>
+                                            <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">150%</option>
+                                            <option value="2">200%</option>
+                                        </select>
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div id="viewerContainer">
+                    <div id="viewer"></div>
+                </div>
+
+                <div id="loadingBox">
+                    <div id="loading"></div>
+                    <div id="loadingBar"><div class="progress"></div></div>
+                </div>
+
+                <div id="errorWrapper" hidden='true'>
+                    <div id="errorMessageLeft">
+                        <span id="errorMessage"></span>
+                        <button id="errorShowMore" onclick="" oncontextmenu="return false;" data-l10n-id="error_more_info">
+                            More Information
+                        </button>
+                        <button id="errorShowLess" onclick="" oncontextmenu="return false;" data-l10n-id="error_less_info" hidden='true'>
+                            Less Information
+                        </button>
+                    </div>
+                    <div id="errorMessageRight">
+                        <button id="errorClose" oncontextmenu="return false;" data-l10n-id="error_close"> Close </button>
+                    </div>
+                    <div class="clearBoth"></div>
+                    <textarea id="errorMoreInfo" hidden='true' readonly="readonly"></textarea>
+                </div>
+            </div> <!-- mainContainer -->
+
+        </div> <!-- outerContainer -->
+        <div id="printContainer"></div>
+        <script type="text/javascript" src="{{ MEDIA_URL }}pdf_full_view/compatibility.js"></script>
+        <script type="text/javascript" src="{{ MEDIA_URL }}pdf_full_view/l10n.js"></script>
+        <script type="text/javascript" src="{{ MEDIA_URL }}js/pdf.js"></script>
+        <script type="text/javascript">PDFJS.workerSrc = "{{ MEDIA_URL }}js/pdf.js";</script>
+        <script type="text/javascript" src="{{ MEDIA_URL }}pdf_full_view/debugger.js"></script>
+        <script type="text/javascript" src="{{ MEDIA_URL }}pdf_full_view/view.js"></script>
+    </body>
+</html>

templates/snippets/file_content_js.html

@@ -40,7 +40,7 @@
     {% endifnotequal %}
 {% endif %}
 
-{% if filetype == 'Document' or filetype == 'PDF' %}
+{% if filetype == 'Document' or filetype == 'PDF' and not use_pdfjs %}
   $('#file-view').html('<div id="flash"></div>');
   function load_flexpaper() {
       var swf_url = '{{ DOCUMENT_CONVERTOR_ROOT }}swf/{{ obj_id }}';
@@ -104,8 +104,62 @@
   {% endif %}
 {% endif %}
 
+{% if filetype == 'PDF' and use_pdfjs %}
+if (!$.browser.msie) {
+    PDFJS.workerSrc = '{{MEDIA_URL}}js/pdf.js';
+    $('#file-view').html('<div id="pdf"><div id="pdf-op-bar" class="vh"><span id="pdf-page-left"><button id="prev">{% trans "Previous" %}</button></span>{% blocktrans %}<span id="pdf-page"><label for="page-number">Page</label> <input type="number" id="page-number" value="1" min="1"></input> / <span id="page-nums"></span></span>{% endblocktrans %}<span id="pdf-page-right"><button id="next" style="margin-right:15px;">{% trans "Next" %}</button><button id="full-screen">{% trans "Full Screen" %}</button></span></div><img src="{{ MEDIA_URL }}pdf_full_view/images/loading-icon.gif" alt="{% trans "loading..." %}" id="pdf-loading" style="margin:20px 0;" /><canvas data="{{ raw_path }}" id="pdf-view" class="hide"></canvas></div>').css({'text-align':'center'});
+    $('#pdf-page-left, #pdf-page-right').css('display', 'inline-block');
+    $('#pdf-page-left').css({'text-align':'right', 'width': $('#pdf-page-right').width()});
+    $('#pdf-op-bar').removeClass('vh');
+    var seahub_getPage = function (pdf, page_number) {
+        pdf.getPage(page_number).then(function(page) {
+            var scale = 1.5;
+            var viewport = page.getViewport(scale);
+            var canvas = $('#pdf-view')[0];
+            var context = canvas.getContext('2d');
+            canvas.height = viewport.height;
+            canvas.width = viewport.width;
+            var renderContext = { 
+                canvasContext: context,
+                viewport: viewport
+            };  
+            page.render(renderContext);
+        }); 
+    };
+    PDFJS.getDocument($('#pdf-view').attr('data')).then(function(pdf) {
+        $('#page-nums').html(pdf.numPages);
+        $('#page-number').attr('max', pdf.numPages).css('width', String(pdf.numPages).length * 6 + 10);
+        seahub_getPage(pdf, 1);
+        $('#pdf-loading').addClass('hide');
+        $('#pdf-view').removeClass('hide');
+        $('#page-number').change(function() {
+            seahub_getPage(pdf, $(this).val());
+        });
+        $('#prev').click(function() {
+            var current = $('#page-number').val();
+            if (current > 1) {
+                seahub_getPage(pdf, --current);
+                $('#page-number').val(current);
+            }
+        });
+        $('#next').click(function() {
+            var current = $('#page-number').val();
+            if (current < pdf.numPages) {
+                seahub_getPage(pdf, ++current);
+                $('#page-number').val(current);
+            }
+        });
+        $('#full-screen').click(function() {
+            window.open('{{ SITE_ROOT }}pdf_full_view/?repo_id={{ repo.id }}&obj_id={{obj_id}}&file_name=' + e('{{ file_name }}'));
+        });
+    });
+} else {
+    $('#file-view').html('<div id="file-view-tip"><p>{% trans "You can use other browsers, for example, firefox, to view it online." %}</p></div>');
+}
+{% endif %}
+
 {% if filetype == 'Unknown' %}
 $('#file-view').html('<div id="file-view-tip"><p>{% trans "This type of file cannot be viewed online." %}</p></div>');
 {% endif %}
 
-{% endif %}
+{% endif %}{# 'if not err' ends here. #}

templates/snippets/file_view_js.html

@@ -1,9 +1,12 @@
 {% if filetype == 'Text' %}
 <script type="text/javascript" src="{{MEDIA_URL}}codemirror/codemirror-2.36.js"></script>
 {% endif %}
-{% if filetype == 'Document' or filetype == 'PDF' %}
+{% if filetype == 'Document' or filetype == 'PDF' and not use_pdfjs %}
 <script type="text/javascript" src="{{MEDIA_URL}}flexpaper/js/flexpaper_flash.js"></script>
 {% endif %}
+{% if filetype == 'PDF' and use_pdfjs %}
+<script type="text/javascript" src="{{MEDIA_URL}}js/pdf.js"></script>
+{% endif %}
 {% if filetype == 'Markdown' %}
 <script type="text/javascript" src="{{MEDIA_URL}}js/showdown.js"></script>
 {% endif %}

urls.py

@@ -65,6 +65,7 @@ urlpatterns = patterns('',
     (r'^publicrepo/create/$', public_repo_create),
     (r'^events/$', events),
     (r'^file_comment/$', file_comment),
+    (r'^pdf_full_view/$', pdf_full_view),
     (r'^pubinfo/$', pubinfo),
     url(r'^i18n/$', i18n, name='i18n'),
     (r'^download/repo/$', repo_download),                       

views.py

@@ -80,7 +80,7 @@ try:
         DOCUMENT_CONVERTOR_ROOT += '/'
 except ImportError:
     DOCUMENT_CONVERTOR_ROOT = None
-from settings import FILE_PREVIEW_MAX_SIZE, INIT_PASSWD
+from settings import FILE_PREVIEW_MAX_SIZE, INIT_PASSWD, USE_PDFJS
 
 @login_required
 def root(request):
@@ -1329,7 +1329,7 @@ def repo_view_file(request, repo_id):
     swf_exists = False
     if filetype == 'Text' or filetype == 'Markdown' or filetype == 'Sf':
         err, file_content, encoding = repo_file_get(raw_path)
-    elif filetype == 'Document' or filetype == 'PDF':
+    elif filetype == 'Document' or filetype == 'PDF' and not USE_PDFJS:
         err, swf_exists = flash_prepare(raw_path, obj_id, fileext)
 
     if view_history:
@@ -2521,7 +2521,7 @@ def view_shared_file(request, token):
     swf_exists = False
     if filetype == 'Text' or filetype == 'Markdown' or filetype == 'Sf':
         err, file_content, encoding = repo_file_get(raw_path)
-    elif filetype == 'Document' or filetype == 'PDF':
+    elif filetype == 'Document' or filetype == 'PDF' and not USE_PDFJS:
         err, swf_exists = flash_prepare(raw_path, obj_id, fileext)
     
     # Increase file shared link view_cnt, this operation should be atomic
@@ -2629,7 +2629,7 @@ def view_file_via_shared_dir(request, token):
     swf_exists = False
     if filetype == 'Text' or filetype == 'Markdown' or filetype == 'Sf':
         err, file_content, encoding = repo_file_get(raw_path)
-    elif filetype == 'Document' or filetype == 'PDF':
+    elif filetype == 'Document' or filetype == 'PDF' and not USE_PDFJS:
         err, swf_exists = flash_prepare(raw_path, obj_id, fileext)
 
     zipped = gen_path_link(path, '')
@@ -2893,3 +2893,16 @@ def events(request):
 
     return HttpResponse(json.dumps({'html':html, 'more':events_more}),
                             content_type='application/json; charset=utf-8')
+
+def pdf_full_view(request):
+    '''For pdf view with pdf.js.'''
+    
+    repo_id = request.GET.get('repo_id', '')
+    obj_id = request.GET.get('obj_id', '')
+    file_name = request.GET.get('file_name', '')
+    token = seafserv_rpc.web_get_access_token(repo_id, obj_id,
+                                              'view', request.user.username)
+    file_src = gen_file_get_url(token, file_name)
+    return render_to_response('pdf_full_view.html', {
+            'file_src': file_src,
+           }, context_instance=RequestContext(request))