Publish Vulpes Preview 15 sources for desktop, Android and Tundra

Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.

assets/webapps/system.gaiamobile.org/js/view_source.js

@@ -0,0 +1,123 @@
+/* global Service */
+/* global BrowserFrame */
+/* global BaseModule */
+
+'use strict';
+
+(function() {
+  var ViewSource = function() {};
+  ViewSource.SERVICES = [
+    'viewsource'
+  ];
+
+  /**
+   * ViewSource displays source of current page in an iframe as an overlay on
+   * top of mozapps.
+   * @class ViewSource
+   * @requires Service
+   * @requires BrowserFrame
+   */
+  BaseModule.create(ViewSource, {
+    name: 'ViewSource',
+    DEBUG: false,
+    _viewer: null,
+
+    /**
+     * Entry point for module.
+     * @memberof ViewSource.prototype
+     */
+    _start: function() {
+      this._hide = this._hide.bind(this);
+      this._resize = this._resize.bind(this);
+    },
+
+    /**
+     * Toggle the source viewer, calling {@link ViewSource#_show} if hidden
+     * or {@link ViewSource#_hide} if shown.
+     * @memberof ViewSource.prototype
+     */
+    viewsource: function() {
+      this._viewer ? this._hide() : this._show();
+    },
+
+    /**
+     * Create and show viewer and point the iframe to the current page but using
+     * the "view-source:" scheme.
+     * @memberof ViewSource.prototype
+     */
+    _show: function() {
+      var url = 'view-source:' + Service.query('getTopMostWindow').config.url;
+      var config = {
+        url: url,
+        title: url,
+        oop: true
+      };
+      var frame = new BrowserFrame(config);
+
+      var container = document.createElement('div');
+      container.classList.add('view-source');
+      container.dataset.zIndexLevel = 'view-source';
+      this._viewer = container;
+
+      var header = document.createElement('gaia-header');
+      header.innerHTML = `
+        <h1 data-l10n-id="viewSourceHeader"></h1>
+        <button disabled></button>
+      `;
+      header.setAttribute('action', 'close');
+      header.addEventListener('action', this._hide);
+      container.appendChild(header);
+
+      var viewsource = frame.element;
+      container.appendChild(viewsource);
+
+      var screen = document.querySelector('#screen');
+      screen.appendChild(container);
+
+      this._resize();
+
+      window.addEventListener('home', this._hide);
+      window.addEventListener('holdhome', this._hide);
+      window.addEventListener('sleep', this._hide);
+      window.addEventListener('lockscreen-appopened', this._hide);
+      window.addEventListener('system-resize', this._resize);
+    },
+
+    /**
+     * Unlink viewer from DOM and delete node.
+     * @memberof ViewSource.prototype
+     */
+    _hide: function() {
+      var viewsource = this._viewer;
+      viewsource.parentNode.removeChild(viewsource);
+      this._viewer = null;
+
+      var header = viewsource.querySelector('gaia-header');
+      header.removeEventListener('action', this._hide);
+      window.removeEventListener('home', this._hide);
+      window.removeEventListener('holdhome', this._hide);
+      window.removeEventListener('sleep', this._hide);
+      window.removeEventListener('lockscreen-appopened', this._hide);
+      window.removeEventListener('system-resize', this._resize);
+    },
+
+    /**
+     * Size the viewer correctly according to the space that it has available.
+     * @memberof ViewSource.prototype
+     */
+    _resize: function(evt) {
+      var container = this._viewer;
+      var frame = container.querySelector('iframe');
+
+      var windowWidth = Service.query('LayoutManager.width');
+      var windowHeight = Service.query('getHeightFor', frame);
+
+      container.style.width = windowWidth + 'px';
+      container.style.height =
+        'calc(' + windowHeight + 'px - var(--statusbar-height))';
+
+      frame.style.height =
+        'calc(' + windowHeight + 'px - var(--statusbar-height) - 50px)';
+    }
+  });
+}(window));