npm - braid-text - Versions diffs - 0.2.63 → 0.2.65 - Mend

braid-text 0.2.63 → 0.2.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/editor.html CHANGED Viewed

@@ -1,81 +1,23 @@
-<body style="background: auto; margin: 0px; padding: 0px">
-  <textarea
-    id="texty"
-    style="width: 100%; height: 100%; box-sizing: border-box"
-  ></textarea>
+<body style="margin: 0px; padding: 0px; box-sizing: border-box">
+  <textarea id="the_editor" style="width: 100%; height: 100%;"></textarea>
 </body>
 <script src="https://braid.org/code/myers-diff1.js"></script>
 <script src="https://unpkg.com/braid-http@~1.3/braid-http-client.js"></script>
+<script src="/web-utils.js"></script>
 <script src="/simpleton-client.js"></script>
 <script>
   let simpleton = simpleton_client(location.pathname, {
-    on_patches: (patches) => apply_patches_and_update_selection(texty, patches),
-    get_patches: (prev_state) => diff(prev_state, texty.value),
-    get_state: () => texty.value,
-    on_error: (e) => {
-      texty.disabled = true
-      texty.style.background = '#fee'
-      texty.style.border = '4px solid red'
-    },
-    on_ack: () => texty.style.caretColor = ''
+    on_patches: (patches) => apply_patches_and_update_selection(the_editor, patches),
+    get_patches: (prev_state) => diff(prev_state, the_editor.value),
+    get_state: () => the_editor.value,
+    on_error: (e) => set_error_state(the_editor),
+    on_ack: () => set_acked_state(the_editor)
   });
-  texty.value = "";
-  texty.oninput = (e) => {
-    texty.style.caretColor = 'red'
-    simpleton.changed();
-  }
-  function diff(before, after) {
-    let diff = diff_main(before, after);
-    let patches = [];
-    let offset = 0;
-    for (let d of diff) {
-      let p = null;
-      if (d[0] == 1) p = { range: [offset, offset], content: d[1] };
-      else if (d[0] == -1) {
-        p = { range: [offset, offset + d[1].length], content: "" };
-        offset += d[1].length;
-      } else offset += d[1].length;
-      if (p) {
-        p.unit = "text";
-        patches.push(p);
-      }
-    }
-    return patches;
+  the_editor.oninput = (e) => {
+    set_acked_state(the_editor, false)
+    simpleton.changed()
   }
-  function apply_patches_and_update_selection(textarea, patches) {
-    let offset = 0;
-    for (let p of patches) {
-      p.range[0] += offset;
-      p.range[1] += offset;
-      offset -= p.range[1] - p.range[0];
-      offset += p.content.length;
-    }
-    let original = textarea.value;
-    let sel = [textarea.selectionStart, textarea.selectionEnd];
-    for (var p of patches) {
-      let range = p.range;
-      for (let i = 0; i < sel.length; i++)
-        if (sel[i] > range[0])
-          if (sel[i] > range[1]) sel[i] -= range[1] - range[0];
-          else sel[i] = range[0];
-      for (let i = 0; i < sel.length; i++)
-        if (sel[i] > range[0]) sel[i] += p.content.length;
-      original =
-        original.substring(0, range[0]) +
-        p.content +
-        original.substring(range[1]);
-    }
-    textarea.value = original;
-    textarea.selectionStart = sel[0];
-    textarea.selectionEnd = sel[1];
-  }
 </script>

package/index.js CHANGED Viewed

@@ -433,6 +433,26 @@ braid_text.put = async (key, options) => {
         })
     }
+    let resource = (typeof key == 'string') ? await get_resource(key) : key
+    if (options.transfer_encoding === 'dt') {
+        var start_i = 1 + resource.doc.getLocalVersion().reduce((a, b) => Math.max(a, b), -1)
+        resource.doc.mergeBytes(body)
+        var end_i = resource.doc.getLocalVersion().reduce((a, b) => Math.max(a, b), -1)
+        for (var i = start_i; i <= end_i; i++) {
+            let v = resource.doc.localToRemoteVersion([i])[0]
+            if (!resource.actor_seqs[v[0]]) resource.actor_seqs[v[0]] = new braid_text.RangeSet()
+            resource.actor_seqs[v[0]].add_range(v[1], v[1])
+        }
+        resource.val = resource.doc.get()
+        resource.version = resource.doc.getRemoteVersion().map(x => x.join("-")).sort()
+        await resource.db_delta(body)
+        return { change_count: end_i - start_i + 1 }
+    }
     if (version) validate_version_array(version)
     // translate a single parent of "root" to the empty array (same meaning)
@@ -445,8 +465,6 @@ braid_text.put = async (key, options) => {
     if (body != null && (typeof body !== 'string')) throw new Error(`body must be a string`)
     if (patches) validate_patches(patches)
-    let resource = (typeof key == 'string') ? await get_resource(key) : key
     if (options_parents) {
         // make sure we have all these parents
         for (let p of options_parents) {

package/markdown-editor.html CHANGED Viewed

@@ -1,309 +1,98 @@
-<html lang="en">
-<script type="statebus">
-dom.BODY = -> DIV(WIKI())
-</script>
 <meta name="viewport" content="width=device-width,initial-scale=.62"/>
-<script src="https://stateb.us/client6.js" server="none"></script>
 <script src="https://invisible.college/js/marked.min.js"></script>
 <script src="https://braid.org/code/myers-diff1.js"></script>
-<script>
-    window.statebus_fetch = window.fetch
-    window.fetch = window.og_fetch
-</script>
 <script src="https://unpkg.com/braid-http@~1.3/braid-http-client.js"></script>
-<script>
-    window.fetch = window.statebus_fetch
-</script>
+<script src="/web-utils.js"></script>
 <script src="/simpleton-client.js"></script>
+<body>
+  <div id="markdown_container" style="max-width: 750px; padding: 10px 60px"></div>
+  <div id="bottom_spacer" style="height: 50vh; display: none;"></div>
+  <textarea
+    id="the_editor"
+    style="
+      position: fixed;
+      bottom: 0;
+      right: 0;
+      width: 45vw;
+      height: 100%;
+      font-size: 15px;
+      font-family: helvetica, arial, avenir, lucida grande;
+      hyphens: none;
+    "></textarea>
+  <div
+    id="edit-button"
+    style="
+      position: fixed;
+      bottom: 0;
+      right: 0;
+      padding: 30px;
+      cursor: pointer;
+      text-decoration: none;
+      background-color: rgba(250, 250, 250, .5);
+    " onclick="toggle_editor()">edit</div>
+</body>
 <script>
-var apply_patches_and_update_selection, diff, first_time, i, j, render_delay, scroll, t, timer, ting, toggle_editor, update_markdown, update_markdown_later;
-t = function() {
-  return document.getElementById('the editor');
-};
+var editing = false
+var first_time = true
+var render_timer = null
+var render_delay = 100
 var simpleton = simpleton_client(location.pathname, {
   on_patches: (patches) => {
-    apply_patches_and_update_selection(t(), patches);
-    state.source = t().value;
-    update_markdown_later();
-  },
-  get_patches: (prev_state) => diff(prev_state, t().value),
-  get_state: () => t().value,
-  on_error: (e) => {
-    t().disabled = true
-    t().style.background = '#fee'
-    t().style.border = '4px solid red'
+    apply_patches_and_update_selection(the_editor, patches)
+    update_markdown_later()
   },
+  get_patches: (prev_state) => diff(prev_state, the_editor.value),
+  get_state: () => the_editor.value,
+  on_error: (e) => set_error_state(the_editor),
+  on_ack: () => set_acked_state(the_editor)
+})
+the_editor.oninput = (e) => {
+  set_acked_state(the_editor, false)
+  simpleton.changed()
+  update_markdown_later()
+}
-  on_ack: () => t().style.caretColor = ''
-});
-window.statebus_ready || (window.statebus_ready = []);
-window.statebus_ready.push(function() {
-  state.vert = true;
-  state.editing = false;
-  state.source = '';
-  // Toggle the editor with keyboard or edit button
-  document.body.onkeydown = function(e) {
-    if (e.keyCode === 27) { // Escape key
-      e.stopPropagation();
-      toggle_editor();
-    }
-  };
-  // Switch to vertical layout when you resize
-  window.onresize = function() {
-    return state.vert = window.innerWidth < 1200;
-  };
-  return onresize();
-});
-// Diffing and Patching Utilities
-diff = function(before, after) {
-  var d, diff2, j, len, offset, p, patches;
-  diff2 = diff_main(before, after);
-  // Now we just need to reformat the output from diff_main into some
-  // nice json objects
-  patches = [];
-  offset = 0;
-  for (j = 0, len = diff2.length; j < len; j++) {
-    d = diff2[j];
-    p = null;
-    if (d[0] === 1) {
-      p = {
-        range: [offset, offset],
-        content: d[1]
-      };
-    } else if (d[0] === -1) {
-      p = {
-        range: [offset, offset + d[1].length],
-        content: ''
-      };
-      offset += d[1].length;
-    } else {
-      offset += d[1].length;
-    }
-    if (p) {
-      patches.push(p);
-    }
-  }
-  return patches;
-};
-apply_patches_and_update_selection = function(textarea, patches) {
-  var i, j, k, l, len, len1, m, offset, original, p, range, ref, ref1, sel;
-  // convert from absolute to relative coordinates
-  offset = 0;
-  for (j = 0, len = patches.length; j < len; j++) {
-    p = patches[j];
-    p.range[0] += offset;
-    p.range[1] += offset;
-    offset -= p.range[1] - p.range[0];
-    offset += p.content.length;
-  }
-  original = textarea.value;
-  sel = [
-    textarea.selectionStart,
-    textarea.selectionEnd // Current cursor & selection
-  ];
-  for (k = 0, len1 = patches.length; k < len1; k++) {
-    p = patches[k];
-    range = p.range;
-// Update the cursor locations
-    for (i = l = 0, ref = sel.length; (0 <= ref ? l < ref : l > ref); i = 0 <= ref ? ++l : --l) {
-      if (sel[i] > range[0]) {
-        if (sel[i] > range[1]) {
-          sel[i] -= range[1] - range[0];
-        } else {
-          sel[i] = range[0];
-        }
-      }
-    }
-    for (i = m = 0, ref1 = sel.length; (0 <= ref1 ? m < ref1 : m > ref1); i = 0 <= ref1 ? ++m : --m) {
-      if (sel[i] > range[0]) {
-        sel[i] += p.content.length;
-      }
-    }
-    // Update the text with the new value
-    original = original.substring(0, range[0]) + p.content + original.substring(range[1]);
-  }
-  textarea.value = original;
-  textarea.selectionStart = sel[0];
-  return textarea.selectionEnd = sel[1];
-};
-// Render everything
-dom.WIKI = function() {
-  var o;
-  // output
-  return DIV({}, DIV({
-    className: 'pad',
-    maxWidth: 750,
-    width: state.editing && !state.vert ? '55vw' : void 0
-  }, (function() {
-    var j, len, ref, results;
-    ref = state.outputs || [];
-    results = [];
-    for (j = 0, len = ref.length; j < len; j++) {
-      o = ref[j];
-      results.push(DIV({
-        dangerouslySetInnerHTML: {
-          __html: o
-        }
-      }));
-    }
-    return results;
-  // bottom pad
-  })()), DIV({
-    height: '50vh',
-    display: !state.editing || !state.vert ? 'none' : void 0
-  }), TEXTAREA({
-    position: 'fixed',
-    hyphens: 'none',
-    bottom: 0,
-    right: 0,
-    width: state.vert ? '100%' : '45vw',
-    height: state.vert ? '50vh' : '100%',
-    display: !state.editing ? 'none' : void 0,
-    fontSize: 15,
-    fontFamily: 'helvetica, arial, avenir, lucida grande',
-    id: 'the editor',
-    onChange: function(e) {
-      if (!e.target.value && e.target.value !== '') {
-        return;
-      }
-      // Bail on edits that try to wipe us out
-      state.source = e.target.value;
-      e.target.style.caretColor = 'red'
-      simpleton.changed();
-      return update_markdown_later();
-    },
-    defaultValue: state.source
-  }), DIV({
-    position: 'fixed',
-    bottom: 0,
-    right: 0,
-    padding: 30,
-    cursor: 'pointer',
-    textDecoration: 'none',
-    backgroundColor: 'rgba(250, 250, 250, .5)',
-    onClick: toggle_editor
-  }, 'edit'));
-};
-// Render markdown after a delay
-timer = null;
-render_delay = 100;
-update_markdown_later = function() {
-  if (timer) {
-    clearTimeout(timer);
-  }
-  return timer = setTimeout(update_markdown, render_delay);
-};
-update_markdown = function() {
-  var e, i, j, len, parse_markdown, ref, results, s, sources;
-  parse_markdown = function() {
-    var match, matches;
-    matches = (function() {
-      var results;
-      results = [];
-      while (match = /\n\|{3,}([^\n]*)\n/g.exec(state.source)) {
-        results.push(match[1]);
-      }
-      return results;
-    })();
-    return matches;
-  };
-  try {
-    if (!state.source) {
-      return;
-    }
-    sources = state.source.split(/\n\|{3,}[^\n]*\n/g);
-    timer = null;
-    if (!state.sources || sources.length !== state.sources.length) {
-      state.sources = sources.splice();
-      state.outputs = (function() {
-        var j, len, results;
-        results = [];
-        for (j = 0, len = sources.length; j < len; j++) {
-          s = sources[j];
-          results.push(marked(s, {
-            sanitize: false
-          }));
-        }
-        return results;
-      })();
-      return document.body.className = 'nopad';
-    } else {
-      ref = state.sources;
-      // But most of the time we just redo one section
-      results = [];
-      for (i = j = 0, len = ref.length; j < len; i = ++j) {
-        s = ref[i];
-        if (s !== sources[i]) {
-          state.sources[i] = sources[i];
-          results.push(state.outputs[i] = marked(s, {
-            sanitize: false
-          }));
-        } else {
-          results.push(void 0);
-        }
-      }
-      return results;
-    }
-  } catch (error) {
-    e = error;
-    return console.error('parse failure with', e);
+document.body.onkeydown = (e) => {
+  if (e.keyCode === 27) { // Escape key
+    e.stopPropagation()
+    toggle_editor()
   }
-};
-update_markdown();
+}
-first_time = true;
+window.onresize = update_layout
-toggle_editor = function() {
-  state.editing = !state.editing;
-  if (state.editing) {
-    t().focus();
-  }
-  if (state.editing && first_time) {
-    first_time = false;
-    t().setSelectionRange(0, 0);
-    t().scrollTop = 0;
-  }
-  return update_markdown();
-};
+update_layout()
-// Support #hashtag scrolling into view
-ting = null;
+function update_layout() {
+  var vert = window.innerWidth < 1200
+  markdown_container.style.width = editing && !vert ? '55vw' : ''
+  bottom_spacer.style.display = !editing || !vert ? 'none' : ''
+  the_editor.style.width = vert ? '100%' : '45vw'
+  the_editor.style.height = vert ? '50vh' : '100%'
+  the_editor.style.display = !editing ? 'none' : ''
+}
-scroll = function() {
-  // We only scroll to the ting once -- if it's fresh
-  if (ting || location.hash.length === 0) {
-    return;
+function toggle_editor() {
+  editing = !editing
+  update_layout()
+  if (editing) the_editor.focus()
+  if (editing && first_time) {
+    first_time = false
+    the_editor.setSelectionRange(0, 0)
+    the_editor.scrollTop = 0
   }
-  ting = document.getElementById(location.hash.substr(1));
-  return ting && ting.scrollIntoView();
-};
+}
-for (i = j = 0; j <= 50; i = ++j) {
-  setTimeout(scroll, i / 5.0 * 1000);
+function update_markdown_later() {
+  if (render_timer) clearTimeout(render_timer)
+  render_timer = setTimeout(update_markdown, render_delay)
 }
-</script>
+function update_markdown() {
+  markdown_container.innerHTML = marked(the_editor.value, { sanitize: false })
+}
-<link rel="stylesheet" href="https://invisible.college/css/github-markdown.css">
-<style>
-  body{-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;}
-  h1,h2,h3,h4 {text-align: left; -ms-hyphens: none; -webkit-hyphens: none; hyphens: none;}
-  note {position: absolute; left: 720px; width: 270px; background-color: #F8F3B7; padding: 10px; box-shadow: -2px 2px 2px #ccc; border-radius: 2px; text-align: left;}
-</style>
+</script>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "braid-text",
-  "version": "0.2.63",
+  "version": "0.2.65",
   "description": "Library for collaborative text over http using braid.",
   "author": "Braid Working Group",
   "repository": "braid-org/braid-text",

package/server-demo.js CHANGED Viewed

@@ -1,6 +1,4 @@
 var port = process.argv[2] || 8888
 var braid_text = require("./index.js")
 // TODO: set a custom database folder
@@ -15,21 +13,16 @@ var server = require("http").createServer(async (req, res) => {
     braid_text.free_cors(res)
     if (req.method === 'OPTIONS') return res.end()
-    if (req.url.endsWith("?editor")) {
-        res.writeHead(200, { "Content-Type": "text/html", "Cache-Control": "no-cache" })
-        require("fs").createReadStream("./editor.html").pipe(res)
-        return
-    }
-    if (req.url.endsWith("?markdown-editor")) {
+    var q = req.url.split('?').slice(-1)[0]
+    if (q === 'editor' || q === 'markdown-editor') {
         res.writeHead(200, { "Content-Type": "text/html", "Cache-Control": "no-cache" })
-        require("fs").createReadStream("./markdown-editor.html").pipe(res)
+        require("fs").createReadStream(`./${q}.html`).pipe(res)
         return
     }
-    if (req.url == '/simpleton-client.js') {
+    if (req.url === '/simpleton-client.js' || req.url === '/web-utils.js') {
         res.writeHead(200, { "Content-Type": "text/javascript", "Cache-Control": "no-cache" })
-        require("fs").createReadStream("./simpleton-client.js").pipe(res)
+        require("fs").createReadStream("." + req.url).pipe(res)
         return
     }

package/test/test.html CHANGED Viewed

@@ -732,6 +732,35 @@ runTest(
     'xy'
 )
+runTest(
+    "test put with transfer-encoding: dt",
+    async () => {
+        var key = 'test-' + Math.random().toString(36).slice(2)
+        var doc = new Doc('hi')
+        doc.ins(0, 'xy')
+        var bytes = doc.toBytes()
+        var r1 = await braid_fetch(`/eval`, {
+            method: 'PUT',
+            body: `void (async () => {
+                var key = '/${key}'
+                var {change_count} = await braid_text.put(key, {
+                    body: new Uint8Array([${'' + bytes}]),
+                    transfer_encoding: "dt"
+                })
+                var {body, version} = await braid_text.get(key, {})
+                res.end('' + change_count + " " + body + " " + version)
+            })()`
+        })
+        return await r1.text()
+    },
+    '2 xy hi-1'
+)
 runTest(
     "test transfer-encoding dt (with parents)",
     async () => {

package/web-utils.js ADDED Viewed

@@ -0,0 +1,75 @@
+function set_acked_state(textarea, binary = true) {
+    if (!binary) {
+        textarea.old_caretColor = textarea.style.caretColor
+        textarea.style.caretColor = 'red'
+    } else {
+        textarea.style.caretColor = textarea.old_caretColor
+    }
+}
+function set_error_state(textarea, binary = true) {
+    if (binary) {
+        textarea.old_disabled = textarea.disabled
+        textarea.old_background = textarea.style.background
+        textarea.old_border = textarea.style.border
+        textarea.disabled = true
+        textarea.style.background = '#fee'
+        textarea.style.border = '4px solid red'
+    } else {
+        textarea.disabled = textarea.old_disabled
+        textarea.style.background = textarea.old_background
+        textarea.style.border = textarea.old_border
+    }
+}
+function diff(before, after) {
+    let diff = diff_main(before, after)
+    let patches = []
+    let offset = 0
+    for (let d of diff) {
+        let p = null
+        if (d[0] === 1) p = { range: [offset, offset], content: d[1] }
+        else if (d[0] === -1) {
+            p = { range: [offset, offset + d[1].length], content: "" }
+            offset += d[1].length
+        } else offset += d[1].length
+        if (p) {
+            p.unit = "text"
+            patches.push(p)
+        }
+    }
+    return patches
+}
+function apply_patches_and_update_selection(textarea, patches) {
+    let offset = 0
+    for (let p of patches) {
+        p.range[0] += offset
+        p.range[1] += offset
+        offset -= p.range[1] - p.range[0]
+        offset += p.content.length
+    }
+    let original = textarea.value
+    let sel = [textarea.selectionStart, textarea.selectionEnd]
+    for (var p of patches) {
+        let range = p.range
+        for (let i = 0; i < sel.length; i++)
+            if (sel[i] > range[0])
+                if (sel[i] > range[1]) sel[i] -= range[1] - range[0]
+                else sel[i] = range[0]
+        for (let i = 0; i < sel.length; i++) if (sel[i] > range[0]) sel[i] += p.content.length
+        original = original.substring(0, range[0]) + p.content + original.substring(range[1])
+    }
+    textarea.value = original
+    textarea.selectionStart = sel[0]
+    textarea.selectionEnd = sel[1]
+}