decidim-core 0.24.1 → 0.25.0.rc2

data/app/packs/src/decidim/delayed.js

@@ -0,0 +1,23 @@
+/**
+ * Returns a function, that, as long as it continues to be invoked, will not
+ * be triggered. The function will be called after it stops being called for
+ * N milliseconds.
+ * @param {Object} context - the context for the called function.
+ * @param {Function} func - the function to be executed.
+ * @param {int} wait - number of milliseconds to wait before executing the function.
+ * @private
+ * @returns {Void} - Returns nothing.
+ */
+export default function delayed(context, func, wait) {
+  let timeout = null;
+
+  return function(...args) {
+    if (timeout) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(() => {
+      timeout = null;
+      Reflect.apply(func, context, args);
+    }, wait);
+  }
+}

data/app/packs/src/decidim/dropdowns_menus.js

@@ -0,0 +1,29 @@
+/* eslint-disable require-jsdoc */
+
+// This will apply some fixes for the Foundation dropdown menu element
+// according to W3C instructions at:
+// https://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-links.html
+//
+// NOTE:
+// This needs to run AFTER Foundation has been initialized because those
+// initializers will affect the drop down menu elements.
+export default function fixDropdownMenus() {
+  $("[data-dropdown-menu]").each((_i, element) => {
+    // This will break navigation on macOS VoiceOver app since it will let the
+    // user to focus on the li element instead of the <a> element where we
+    // actually need the focus to be in.
+    $("li.is-dropdown-submenu-parent", element).removeAttr("aria-haspopup").removeAttr("aria-label");
+    // Foundation marks the wrong role for the submenu elements
+    $("ul.is-dropdown-submenu", element).attr("role", "menu");
+  })
+}
+
+// Ensure the first element is always focused when a dropdown is opened as
+// this would not always happen when using a screen reader. If this is not
+// done, the screen reader will stay quiet when the menu opens which can lead
+// to the blind user not understanding the menu has opened.
+$(() => {
+  $("[data-dropdown-menu]").on("show.zf.dropdownMenu", (_i, element) => {
+    $("li:first > a", element).focus();
+  });
+})

data/app/packs/src/decidim/editor/attribute_diff.js

@@ -0,0 +1,28 @@
+/* eslint-disable require-jsdoc */
+
+// ORGINAL: https://github.com/quilljs/delta/blob/ddda3bf088cda3ec03d5dbcc1179679d147f3a02/src/AttributeMap.ts
+export default function attributeDiff(attributes1, attributes2) {
+  let alpha = attributes1;
+  let beta = attributes2;
+  if (typeof alpha !== "object") {
+    alpha = {};
+  }
+  if (typeof beta !== "object") {
+    beta = {};
+  }
+  const attributes = Object.keys(alpha).concat(Object.keys(beta)).reduce((attrs, key) => {
+    // ORGINAL: import isEqual from 'lodash.isequal'; if (!isEqual(a[key], b[key]))
+    if ((alpha[key] !== beta[key])) {
+      attrs[key] = null;
+      if (beta[key]) {
+        attrs[key] = beta[key]
+      }
+    }
+    return attrs;
+  }, {});
+
+  if (Object.keys(attributes).length > 0) {
+    return attributes;
+  }
+  return null;
+}

data/app/packs/src/decidim/editor/history_override.js

@@ -0,0 +1,110 @@
+/* eslint-disable require-jsdoc */
+
+const History = Quill.import("modules/history");
+History.DEFAULTS = {
+  delay: 1000,
+  maxStack: 100,
+  userOnly: true
+};
+
+/**
+ * Linebreak module brokes quill's default history class.
+ * So here we are moving innerHTML to undo and redo stack
+ * instead of deltas.
+ */
+export default class HistoryOverride extends History {
+  constructor(quill, options) {
+    super(quill, options);
+    this.lastRecorded = 0;
+    this.ignoreChange = false;
+    this.init = false;
+    this.quill.emitter.on("editor-ready", () => {
+      this.clear();
+      const $input = $(this.quill.container).siblings('input[type="hidden"]');
+      this.stack.undo.push({content: $input.val() || "", index: this.quill.getLength() - 2 });
+      this.lastLength = this.quill.getLength();
+    })
+    /* eslint-disable max-params */
+    this.quill.on(Quill.events.EDITOR_CHANGE, (eventName, delta, oldDelta, source) => {
+      if (!delta) {
+        return;
+      }
+      if (!this.init && eventName === "selection-change") {
+        this.stack.undo[0].index = delta.index;
+      }
+      if (eventName !== Quill.events.TEXT_CHANGE || this.ignoreChange) {
+        return;
+      }
+
+      if (!this.options.userOnly || source === Quill.sources.USER) {
+        this.record(delta, oldDelta);
+      }
+    });
+    this.quill.keyboard.addBinding({ key: "Z", shortKey: true }, this.undo.bind(this));
+    this.quill.keyboard.addBinding({ key: "Z", shortKey: true, shiftKey: true }, this.redo.bind(this));
+    if ((/Win/i).test(navigator.platform)) {
+      this.quill.keyboard.addBinding({ key: "Y", shortKey: true }, this.redo.bind(this));
+    }
+  }
+  /* eslint-enable max-params */
+
+  change(source, dest) {
+    if (this.stack[source].length === 0) {
+      return;
+    }
+    let obj = this.updateStacks(source, dest);
+    if (!obj.content) {
+      return;
+    }
+    if (!obj.index) {
+      obj.index = 0
+    }
+    this.lastRecorded = 0;
+    this.ignoreChange = true;
+    this.quill.setContents(this.quill.clipboard.convert(obj.content));
+    this.ignoreChange = false;
+    let index = obj.index;
+    this.quill.setSelection(index);
+  }
+
+  updateStacks(source, dest) {
+    if (source === "undo") {
+      if (this.stack.undo.length === 1) {
+        return this.stack.undo[0]
+      }
+      this.stack[dest].push(this.stack.undo.pop())
+      return this.stack.undo[this.stack.undo.length - 1]
+    }
+    let content = this.stack.redo.pop();
+    this.stack.undo.push(content)
+    return content
+  }
+
+  record(changeDelta) {
+    if (changeDelta.ops.length === 0) {
+      return
+    } else if (!this.init) {
+      this.init = true;
+    }
+    this.stack.redo = [];
+    let timestamp = Date.now();
+    // Should not return after length check, because after linebreak a keypress replaces invisible characters with
+    // visible characters.
+    // For example: <br><br></p> -> [press X] -> <br>X</p>.
+    if (Math.abs(this.lastLength === this.quill.getLength()) || this.lastRecorded + this.options.delay > timestamp) {
+      if (this.stack.undo.length > 1) {
+        this.stack.undo.pop();
+      }
+    } else {
+      this.lastLength = this.quill.getLength();
+      if (this.lastRecorded + this.options.delay <= timestamp) {
+        this.lastRecorded = timestamp;
+      }
+    }
+    this.stack.undo.push({content: this.quill.container.firstChild.innerHTML, index: this.quill.getSelection()})
+  }
+
+  transform() {
+    return;
+  }
+}

data/app/packs/src/decidim/editor/linebreak_module.js

@@ -0,0 +1,183 @@
+/* eslint-disable require-jsdoc */
+
+import addEnterBindings from "src/decidim/editor/modified_enter"
+import backspaceBindingsRangeAny from "src/decidim/editor/modified_backspace_offset_any"
+import backspaceBindings from "src/decidim/editor/modified_backspace_offset1"
+import HistoryOverride from "src/decidim/editor/history_override"
+
+// Disable warning messages from overwritting modules
+Quill.debug("error");
+
+// It all started with these snippets of code: https://github.com/quilljs/quill/issues/252
+const Delta = Quill.import("delta");
+const Break = Quill.import("blots/break");
+const Embed = Quill.import("blots/embed");
+const Scroll = Quill.import("blots/scroll");
+const Parchment = Quill.import("parchment");
+Quill.register({"modules/history": HistoryOverride}, true);
+let icons = Quill.import("ui/icons");
+icons.linebreak = "⏎";
+
+class SmartBreak extends Break {
+  length() {
+    return 1;
+  }
+
+  value() {
+    return "\n";
+  }
+
+  insertInto(parent, ref) {
+    // Embed.prototype.insertInto.call(this, parent, ref);
+    Reflect.apply(Embed.prototype.insertInto, this, [parent, ref]);
+  }
+}
+Quill.register(SmartBreak);
+
+// Override quill/blots/scroll.js
+class ScrollOvderride extends Scroll {
+  optimize(mutations = [], context = {}) {
+    if (this.batch === true) {
+      return;
+    }
+
+    this.parchmentOptimize(mutations, context);
+
+    if (mutations.length > 0) {
+      // quill/core/emitter.js, Emitter.events.SCROLL_OPTIMIZE = "scroll-optimize"
+      this.emitter.emit("scroll-optimize", mutations, context);
+    }
+  }
+
+  // Override parchment/src/blot/scroll.ts
+  parchmentOptimize(mutations = [], context = {}) {
+    // super.optimize(context);
+    Reflect.apply(Parchment.Container.prototype.optimize, this, [context]);
+
+    // We must modify mutations directly, cannot make copy and then modify
+    // let records = [].slice.call(this.observer.takeRecords());
+    let records = [...this.observer.takeRecords()];
+    // Array.push currently seems to be implemented by a non-tail recursive function
+    // so we cannot just mutations.push.apply(mutations, this.observer.takeRecords());
+    while (records.length > 0) {
+      mutations.push(records.pop());
+    }
+    let mark = (blot, markParent) => {
+      if (!blot || blot === this) {
+        return;
+      }
+      if (!blot.domNode.parentNode) {
+        return;
+      }
+      if (blot.domNode.__blot && blot.domNode.__blot.mutations === null) {
+        blot.domNode.__blot.mutations = [];
+      }
+      if (markParent) {
+        mark(blot.parent);
+      }
+    };
+    let optimize = (blot) => {
+      // Post-order traversal
+      if (!blot.domNode.__blot) {
+        return;
+      }
+
+      if (blot instanceof Parchment.Container) {
+        blot.children.forEach(optimize);
+      }
+      blot.optimize(context);
+    };
+    let remaining = mutations;
+    for (let ind = 0; remaining.length > 0; ind += 1) {
+      // MAX_OPTIMIZE_ITERATIONS = 100
+      if (ind >= 100) {
+        throw new Error("[Parchment] Maximum optimize iterations reached");
+      }
+      remaining.forEach((mutation) => {
+        let blot = Parchment.find(mutation.target, true);
+        if (!blot) {
+          return;
+        }
+        if (blot.domNode === mutation.target) {
+          if (mutation.type === "childList") {
+            mark(Parchment.find(mutation.previousSibling, false));
+
+            mutation.addedNodes.forEach((node) => {
+              let child = Parchment.find(node, false);
+              mark(child, false);
+              if (child instanceof Parchment.Container) {
+                child.children.forEach(function(grandChild) {
+                  mark(grandChild, false);
+                });
+              }
+            });
+          } else if (mutation.type === "attributes") {
+            mark(blot.prev);
+          }
+        }
+        mark(blot);
+      });
+      this.children.forEach(optimize);
+      remaining = [...this.observer.takeRecords()];
+      records = remaining.slice();
+      while (records.length > 0) {
+        mutations.push(records.pop());
+      }
+    }
+  }
+};
+Quill.register("blots/scroll", ScrollOvderride, true);
+Parchment.register(ScrollOvderride);
+
+
+export default function lineBreakButtonHandler(quill) {
+  let range = quill.selection.getRange()[0];
+  let currentLeaf = quill.getLeaf(range.index)[0];
+  let nextLeaf = quill.getLeaf(range.index + 1)[0];
+  const previousChar = quill.getText(range.index - 1, 1);
+
+  // Insert a second break if:
+  // At the end of the editor, OR next leaf has a different parent (<p>)
+  if (nextLeaf === null || (currentLeaf.parent !== nextLeaf.parent)) {
+    quill.insertEmbed(range.index, "break", true, "user");
+    quill.insertEmbed(range.index, "break", true, "user");
+  } else if (previousChar === "\n") {
+    const delta = new Delta().retain(range.index).insert("\n");
+    quill.updateContents(delta, Quill.sources.USER);
+  } else {
+    quill.insertEmbed(range.index, "break", true, "user");
+  }
+
+  // Now that we've inserted a line break, move the cursor forward
+  quill.setSelection(range.index + 1, Quill.sources.SILENT);
+}
+
+Quill.register("modules/linebreak", (quill) => {
+  quill.getModule("toolbar").addHandler("linebreak", () => {
+    lineBreakButtonHandler(quill);
+  });
+
+  quill.emitter.on("editor-ready", () => {
+    const length = quill.getLength();
+    const text = quill.getText(length - 2, 2);
+
+    // Remove extraneous new lines
+    if (text === "\n\n") {
+      quill.deleteText(quill.getLength() - 2, 2);
+    }
+  });
+
+  quill.clipboard.addMatcher("BR", (node) => {
+    if (node?.parentNode?.tagName === "A") {
+      return new Delta().insert("\n");
+    }
+    return new Delta().insert({"break": ""});
+  });
+
+  addEnterBindings(quill);
+  backspaceBindingsRangeAny(quill);
+  backspaceBindings(quill);
+
+  return;
+});
+

data/app/packs/src/decidim/editor/modified_backspace_offset1.js

@@ -0,0 +1,96 @@
+/* eslint-disable require-jsdoc */
+
+import attributeDiff from "src/decidim/editor/attribute_diff"
+
+const Delta = Quill.import("delta");
+
+const previousChar = (quill, range) => {
+  return quill.getText(range.index - 1, 1);
+}
+
+const beforePreviousChar = (quill, range) => {
+  return quill.getText(range.index - 2, 1);
+}
+
+const nextChar = (quill, range) => {
+  return quill.getText(range.index, 1);
+}
+
+const handleListSelection = (quill, range) => {
+  const lastCharacterOfPreviousLine = quill.getText(range.index - 3, 1);
+  if (nextChar(quill, range) === "\n" || lastCharacterOfPreviousLine !== "\n") {
+    quill.setSelection(range.index - 1, Quill.sources.SILENT);
+  } else {
+    quill.setSelection(range.index - 3, Quill.sources.SILENT);
+  }
+}
+
+const moveSelectionToPreviousLine = (quill, range) => {
+  const lastCharacterOfPreviousLine = quill.getText(range.index - 3, 1);
+  if (nextChar(quill, range) === "\n" || lastCharacterOfPreviousLine !== "\n") {
+    quill.setSelection(range.index - 1, Quill.sources.SILENT);
+  } else {
+    quill.setSelection(range.index - 3, Quill.sources.SILENT);
+  }
+}
+
+export default function backspaceBindings(quill) {
+  quill.keyboard.addBinding({ key: 8, offset: 1, collapsed: true }, (range, context) => {
+    let length = 1
+    if ((/[\uD800-\uDBFF][\uDC00-\uDFFF]$/).test(context.prefix)) {
+      length = 2;
+    }
+
+    if (range.index === 0 || quill.getLength() <= 1) {
+      return;
+    }
+    let formats = {};
+    const [line] = quill.getLine(range.index);
+    let delta = new Delta().retain(range.index - length).delete(length);
+    if (context.offset === 1 && previousChar(quill, range) === "\n") {
+      const [prev] = quill.getLine(range.index - 2);
+      if (prev && prev.statics.blotName === "list-item") {
+        formats = handleListSelection(quill, range);
+        if (prev !== null && prev.length() > 1) {
+          let curFormats = line.formats();
+          let prevFormats = quill.getFormat(range.index - 2, 1);
+          formats = attributeDiff(curFormats, prevFormats) || {};
+          length += 1;
+        }
+        delta = new Delta().retain(range.index - 2).delete(2);
+        moveSelectionToPreviousLine(quill, range);
+      } else {
+        delta = new Delta().retain(range.index - 1).delete(1);
+        if (range.index < 2) {
+          delta = new Delta().delete(1).retain(range.index + line.length() - 1);
+        } else if (previousChar(quill, range) === "\n" && beforePreviousChar(quill, range) === "\n") {
+          delta = new Delta().retain(range.index - 2).delete(2);
+        }
+      }
+    } else {
+      const [prev] = quill.getLine(range.index - 1);
+      if (prev) {
+        const isPrevLineEmpty =
+          prev.statics.blotName === "block" && prev.length() <= 1;
+        if (!isPrevLineEmpty) {
+          const curFormats = line.formats();
+          const prevFormats = quill.getFormat(range.index - 1, 1);
+          formats = attributeDiff(curFormats, prevFormats) || {};
+          if (Object.keys(formats).length > 0) {
+            // line.length() - 1 targets \n in line, another -1 for newline being deleted
+            const formatDelta = new Delta().retain(range.index + line.length() - 2).retain(1, formats);
+            delta = delta.compose(formatDelta);
+          }
+        }
+      }
+    }
+    quill.updateContents(delta, Quill.sources.USER);
+    if (Object.keys(formats).length > 0) {
+      quill.formatLine(range.index - length, length, formats, Quill.sources.USER);
+    }
+    quill.focus();
+  });
+
+  // Put this backspace binding to second
+  quill.keyboard.bindings[8].splice(1, 0, quill.keyboard.bindings[8].pop());
+}