import FIREFOX_52_6_0esr_RELEASE from mozilla-esr52 hg repo

addon-sdk/source/examples/actor-repl/data/codemirror.css

@@ -0,0 +1,264 @@
+/* BASICS */
+
+.CodeMirror {
+  /* Set height, width, borders, and global font properties here */
+  font-family: monospace;
+  height: 300px;
+}
+.CodeMirror-scroll {
+  /* Set scrolling behaviour here */
+  overflow: auto;
+}
+
+/* PADDING */
+
+.CodeMirror-lines {
+  padding: 4px 0; /* Vertical padding around content */
+}
+.CodeMirror pre {
+  padding: 0 4px; /* Horizontal padding of content */
+}
+
+.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  background-color: white; /* The little square between H and V scrollbars */
+}
+
+/* GUTTER */
+
+.CodeMirror-gutters {
+  border-right: 1px solid #ddd;
+  background-color: #f7f7f7;
+  white-space: nowrap;
+}
+.CodeMirror-linenumbers {}
+.CodeMirror-linenumber {
+  padding: 0 3px 0 5px;
+  min-width: 20px;
+  text-align: right;
+  color: #999;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+/* CURSOR */
+
+.CodeMirror div.CodeMirror-cursor {
+  border-left: 1px solid black;
+  z-index: 3;
+}
+/* Shown when moving in bi-directional text */
+.CodeMirror div.CodeMirror-secondarycursor {
+  border-left: 1px solid silver;
+}
+.CodeMirror.cm-keymap-fat-cursor div.CodeMirror-cursor {
+  width: auto;
+  border: 0;
+  background: #7e7;
+  z-index: 1;
+}
+/* Can style cursor different in overwrite (non-insert) mode */
+.CodeMirror div.CodeMirror-cursor.CodeMirror-overwrite {}
+
+.cm-tab { display: inline-block; }
+
+.CodeMirror-ruler {
+  border-left: 1px solid #ccc;
+  position: absolute;
+}
+
+/* DEFAULT THEME */
+
+.cm-s-default .cm-keyword {color: #708;}
+.cm-s-default .cm-atom {color: #219;}
+.cm-s-default .cm-number {color: #164;}
+.cm-s-default .cm-def {color: #00f;}
+.cm-s-default .cm-variable {color: black;}
+.cm-s-default .cm-variable-2 {color: #05a;}
+.cm-s-default .cm-variable-3 {color: #085;}
+.cm-s-default .cm-property {color: black;}
+.cm-s-default .cm-operator {color: black;}
+.cm-s-default .cm-comment {color: #a50;}
+.cm-s-default .cm-string {color: #a11;}
+.cm-s-default .cm-string-2 {color: #f50;}
+.cm-s-default .cm-meta {color: #555;}
+.cm-s-default .cm-qualifier {color: #555;}
+.cm-s-default .cm-builtin {color: #30a;}
+.cm-s-default .cm-bracket {color: #997;}
+.cm-s-default .cm-tag {color: #170;}
+.cm-s-default .cm-attribute {color: #00c;}
+.cm-s-default .cm-header {color: blue;}
+.cm-s-default .cm-quote {color: #090;}
+.cm-s-default .cm-hr {color: #999;}
+.cm-s-default .cm-link {color: #00c;}
+
+.cm-negative {color: #d44;}
+.cm-positive {color: #292;}
+.cm-header, .cm-strong {font-weight: bold;}
+.cm-em {font-style: italic;}
+.cm-link {text-decoration: underline;}
+
+.cm-s-default .cm-error {color: #f00;}
+.cm-invalidchar {color: #f00;}
+
+div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
+.CodeMirror-activeline-background {background: #e8f2ff;}
+
+/* STOP */
+
+/* The rest of this file contains styles related to the mechanics of
+   the editor. You probably shouldn't touch them. */
+
+.CodeMirror {
+  line-height: 1;
+  position: relative;
+  overflow: hidden;
+  background: white;
+  color: black;
+}
+
+.CodeMirror-scroll {
+  /* 30px is the magic margin used to hide the element's real scrollbars */
+  /* See overflow: hidden in .CodeMirror */
+  margin-bottom: -30px; margin-right: -30px;
+  padding-bottom: 30px;
+  height: 100%;
+  outline: none; /* Prevent dragging from highlighting the element */
+  position: relative;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+.CodeMirror-sizer {
+  position: relative;
+  border-right: 30px solid transparent;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+/* The fake, visible scrollbars. Used to force redraw during scrolling
+   before actuall scrolling happens, thus preventing shaking and
+   flickering artifacts. */
+.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  position: absolute;
+  z-index: 6;
+  display: none;
+}
+.CodeMirror-vscrollbar {
+  right: 0; top: 0;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+.CodeMirror-hscrollbar {
+  bottom: 0; left: 0;
+  overflow-y: hidden;
+  overflow-x: scroll;
+}
+.CodeMirror-scrollbar-filler {
+  right: 0; bottom: 0;
+}
+.CodeMirror-gutter-filler {
+  left: 0; bottom: 0;
+}
+
+.CodeMirror-gutters {
+  position: absolute; left: 0; top: 0;
+  padding-bottom: 30px;
+  z-index: 3;
+}
+.CodeMirror-gutter {
+  white-space: normal;
+  height: 100%;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+  padding-bottom: 30px;
+  margin-bottom: -32px;
+  display: inline-block;
+  /* Hack to make IE7 behave */
+  *zoom:1;
+  *display:inline;
+}
+.CodeMirror-gutter-elt {
+  position: absolute;
+  cursor: default;
+  z-index: 4;
+}
+
+.CodeMirror-lines {
+  cursor: text;
+}
+.CodeMirror pre {
+  /* Reset some styles that the rest of the page might have set */
+  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
+  border-width: 0;
+  background: transparent;
+  font-family: inherit;
+  font-size: inherit;
+  margin: 0;
+  white-space: pre;
+  word-wrap: normal;
+  line-height: inherit;
+  color: inherit;
+  z-index: 2;
+  position: relative;
+  overflow: visible;
+}
+.CodeMirror-wrap pre {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  word-break: normal;
+}
+
+.CodeMirror-linebackground {
+  position: absolute;
+  left: 0; right: 0; top: 0; bottom: 0;
+  z-index: 0;
+}
+
+.CodeMirror-linewidget {
+  position: relative;
+  z-index: 2;
+  overflow: auto;
+}
+
+.CodeMirror-widget {}
+
+.CodeMirror-wrap .CodeMirror-scroll {
+  overflow-x: hidden;
+}
+
+.CodeMirror-measure {
+  position: absolute;
+  width: 100%;
+  height: 0;
+  overflow: hidden;
+  visibility: hidden;
+}
+.CodeMirror-measure pre { position: static; }
+
+.CodeMirror div.CodeMirror-cursor {
+  position: absolute;
+  visibility: hidden;
+  border-right: none;
+  width: 0;
+}
+.CodeMirror-focused div.CodeMirror-cursor {
+  visibility: visible;
+}
+
+.CodeMirror-selected { background: #d9d9d9; }
+.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
+
+.cm-searching {
+  background: #ffa;
+  background: rgba(255, 255, 0, .4);
+}
+
+/* IE7 hack to prevent it from returning funny offsetTops on the spans */
+.CodeMirror span { *vertical-align: text-bottom; }
+
+@media print {
+  /* Hide the cursor when printing */
+  .CodeMirror div.CodeMirror-cursor {
+    visibility: hidden;
+  }
+}

addon-sdk/source/examples/actor-repl/data/index.html

@@ -0,0 +1,147 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<html>
+  <head>
+      <link rel="stylesheet" href="./codemirror.css">
+      <link rel="stylesheet" href="./main.css">
+      <script src="./codemirror-compressed.js"></script>
+      <views>
+          <section class="task cm-s-default">
+            <pre class="request "></pre>
+            <pre class="response"><span class="one"></span><span class="two"></span><span class="three"></span></pre>
+          </section>
+       </views>
+  </head>
+  <body>
+      <pre class="input"></pre>
+  </body>
+  <script>
+      function debounce(fn, ms) {
+        var id;
+        return function(...args) {
+          clearTimeout(id);
+          id = setTimeout(fn, ms, ...args);
+        };
+      }
+
+      function Try(fn) {
+        return function(...args) {
+          try { return fn(...args); }
+          catch (error) { return null; }
+        };
+      }
+
+      var parse = Try(JSON.parse);
+
+      var CommandHistory = {
+        init: function() {
+          this._state = {};
+          this._state.els = document.querySelectorAll("body > section.task > .request");
+          this._state.idx = this._state.els.length;
+        },
+        get prev() {
+          if (!!this._state.els && this._state.idx > 0) {
+            this._state.idx--;
+            return this._state.els[this._state.idx].textContent;
+          }
+
+          return "";
+        },
+        get next() {
+          if (!!this._state.els && this._state.idx < this._state.els.length-1) {
+            this._state.idx++;
+            return this._state.els[this._state.idx].textContent;
+          }
+
+          return "";
+        }
+      }
+
+      function cmdHistory(fn, editor) {
+        editor.setValue(fn());
+        document.querySelector(".input").scrollIntoView();
+      }
+
+      var cmdHistoryNext = cmdHistory.bind(null, () => CommandHistory.next);
+      var cmdHistoryBack = cmdHistory.bind(null, () => CommandHistory.prev);
+
+      function send(editor) {
+          var input = editor.getWrapperElement().parentNode;
+          var code = editor.getValue().trim();
+          var packet = parse(code);
+          if (packet) {
+            var task = document.querySelector("views .task").cloneNode(true);
+            var request = task.querySelector(".request");
+            var response = task.querySelector(".response");
+
+            input.parentNode.insertBefore(task, input);
+
+            CodeMirror.runMode(JSON.stringify(packet, 2, 2),
+                               "application/json",
+                               request);
+            response.classList.add("pending");
+
+            editor.setValue("");
+
+            document.querySelector(".input").scrollIntoView();
+
+            port.postMessage(packet);
+          }
+      }
+
+      var editor = CodeMirror(document.querySelector(".input"), {
+        autofocus: true,
+        mode: "application/json",
+        matchBrackets: true,
+        value: '{"to": "root", "type": "requestTypes"}',
+        extraKeys: {"Cmd-Enter": send,
+                    "Ctrl-Enter": send,
+                    "Cmd-Down": cmdHistoryNext,
+                    "Ctrl-Down": cmdHistoryNext,
+                    "Cmd-Up": cmdHistoryBack,
+                    "Ctrl-Up": cmdHistoryBack}
+      });
+      editor.on("change", debounce(function(editor) {
+          var input = editor.getWrapperElement().parentNode;
+          if (parse(editor.getValue().trim())) {
+            input.classList.remove("invalid");
+          } else {
+            input.classList.add("invalid");
+          }
+      }, 800));
+  </script>
+  <script>
+    window.addEventListener("message", event => {
+      window.port = event.ports[0];
+      port.onmessage = onMessage;
+    });
+
+    var onMessage = (event) => {
+      var packet = event.data;
+      var code = JSON.stringify(packet, 2, 2);
+
+      var input = document.querySelector(".input");
+      var response = document.querySelector(".task .response.pending");
+
+      if (!response) {
+        message = document.querySelector("views .task").cloneNode(true);
+        response = message.querySelector(".response");
+        response.classList.add("message");
+
+        input.parentNode.insertBefore(message, input);
+      }
+
+      if (packet.error) {
+        response.classList.add("error");
+      }
+
+      CodeMirror.runMode(code, "application/json", response);
+      response.classList.remove("pending");
+
+      document.querySelector(".input").scrollIntoView();
+
+      CommandHistory.init();
+    };
+  </script>
+</html>

addon-sdk/source/examples/actor-repl/data/main.css

@@ -0,0 +1,117 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+body
+{
+  position: absolute;
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  background: white;
+}
+
+
+pre
+{
+  margin: 0;
+}
+
+section
+{
+  border-top: 1px solid rgba(150, 150, 150, 0.5);
+}
+
+.CodeMirror {
+  height: auto;
+}
+.CodeMirror-scroll {
+  overflow-y: hidden;
+  overflow-x: auto;
+}
+
+.request,
+.response,
+.input
+{
+  border-left: 5px solid;
+  padding-left: 10px;
+}
+
+.request:not(:empty),
+.response.pending
+{
+  padding: 5px;
+}
+
+.input
+{
+  padding-left: 6px;
+  border-color: lightgreen;
+}
+.input.invalid
+{
+  border-color: orange;
+}
+
+.request
+{
+  border-color: lightgrey;
+}
+
+.response
+{
+  border-color: grey;
+}
+.response.error
+{
+  border-color: red;
+}
+
+.response.message
+{
+    border-color: lightblue;
+}
+
+.response .one,
+.response .two,
+.response .three
+{
+  width: 0;
+  height: auto;
+}
+
+
+
+.response.pending .one,
+.response.pending .two,
+.response.pending .three
+{
+  width: 10px;
+  height: 10px;
+  background-color: rgba(150, 150, 150, 0.5);
+
+  border-radius: 100%;
+  display: inline-block;
+  animation: bouncedelay 1.4s infinite ease-in-out;
+  /* Prevent first frame from flickering when animation starts */
+  animation-fill-mode: both;
+}
+
+.response.pending .one
+{
+  animation-delay: -0.32s;
+}
+
+.response.pending .two
+{
+  animation-delay: -0.16s;
+}
+
+@keyframes bouncedelay {
+  0%, 80%, 100% {
+    transform: scale(0.0);
+  } 40% {
+    transform: scale(1.0);
+  }
+}