braid-text 0.0.1 → 0.0.2
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.
- package/README.md +6 -6
- package/braid-text-db/%2F.1 +0 -0
- package/braid-text-db/%2Ffavicon.ico.1 +0 -0
- package/editor.html +3 -3
- package/markdown-editor.html +4 -6
- package/package.json +1 -1
- package/{client.js → simpleton-client.js} +1 -1
package/README.md
CHANGED
|
@@ -90,11 +90,11 @@ Check out the `server-demo.js` file to see examples for how to add access contro
|
|
|
90
90
|
|
|
91
91
|
## Use the Library on the Client
|
|
92
92
|
|
|
93
|
-
<script src="https://unpkg.com/braid-text/client.js"></script>
|
|
93
|
+
<script src="https://unpkg.com/braid-text/simpleton-client.js"></script>
|
|
94
94
|
|
|
95
95
|
...
|
|
96
96
|
// connect to the server
|
|
97
|
-
let
|
|
97
|
+
let simpleton = simpleton_client(SERVER_URL, {
|
|
98
98
|
apply_remote_update: ({ state, patches }) => {
|
|
99
99
|
// apply incoming state / return new state
|
|
100
100
|
},
|
|
@@ -105,18 +105,18 @@ Check out the `server-demo.js` file to see examples for how to add access contro
|
|
|
105
105
|
|
|
106
106
|
...
|
|
107
107
|
|
|
108
|
-
// when changes are made, let
|
|
109
|
-
|
|
108
|
+
// when changes are made, let the client know
|
|
109
|
+
simpleton.changed()
|
|
110
110
|
|
|
111
111
|
See [editor.html](https://raw.githubusercontent.com/braid-org/braid-text/master/editor.html) for a simple working example.
|
|
112
112
|
|
|
113
113
|
## Full Client Library API
|
|
114
114
|
|
|
115
|
-
|
|
115
|
+
simpleton = simpleton_client(url, {
|
|
116
116
|
apply_remote_update,
|
|
117
117
|
generate_local_diff_update}
|
|
118
118
|
|
|
119
119
|
- `url`: The url of the resource to synchronize with.
|
|
120
120
|
- `apply_remote_update`: This function will be called whenever an update is received from the server. The function should look like `({state, patches}) => {...}`. Only one of `state` or `patches` will be set. If it is `state`, then this is the new value of the text. If it is `patches`, then patches is an array of values like `{range: [1, 3], content: "Hi"}`. Each such value represents a string-replace operation; the `range` specifies a start and end position — these characters will be deleted — and `content` says what text to put in its place. Note that these patches will always be in order, but that the range positions of each patch always reference the original string, e.g., the second patch's range values do not take into account applying the first patch. Finally, this function returns the new state, after the application of the `state` or `patches`.
|
|
121
121
|
- `generate_local_diff_update`: This function will often be called whenever an update happens locally, but the system may delay calling it if the network is congested. The function should look like `(prev_state) => {...}`. The function should basically do a diff between `prev_state` and the current state, and express this diff as an array of patches similar to the ones discussed above. Finally, if there is an actual difference detected, this function should return an object `{state, patches}`, otherwise it should return nothing.
|
|
122
|
-
- `
|
|
122
|
+
- `simpleton.changed()`: Call this to report local updates whenever they occur, e.g., in the `oninput` handler of a textarea being synchronized.
|
|
Binary file
|
|
Binary file
|
package/editor.html
CHANGED
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
</body>
|
|
7
7
|
<script src="https://braid.org/code/myers-diff1.js"></script>
|
|
8
8
|
<script src="https://unpkg.com/braid-http@~0.3/braid-http-client.js"></script>
|
|
9
|
-
<script src="https://unpkg.com/braid-text/client.js"></script>
|
|
9
|
+
<script src="https://unpkg.com/braid-text/simpleton-client.js"></script>
|
|
10
10
|
<script>
|
|
11
|
-
let
|
|
11
|
+
let simpleton = simpleton_client(location.pathname, {
|
|
12
12
|
apply_remote_update: ({ state, patches }) => {
|
|
13
13
|
if (state !== undefined) texty.value = state;
|
|
14
14
|
else apply_patches_and_update_selection(texty, patches);
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
texty.value = "";
|
|
25
|
-
texty.oninput = (e) =>
|
|
25
|
+
texty.oninput = (e) => simpleton.changed();
|
|
26
26
|
|
|
27
27
|
function diff(before, after) {
|
|
28
28
|
let diff = diff_main(before, after);
|
package/markdown-editor.html
CHANGED
|
@@ -16,19 +16,17 @@ dom.BODY = -> DIV(WIKI())
|
|
|
16
16
|
<script>
|
|
17
17
|
window.fetch = window.statebus_fetch
|
|
18
18
|
</script>
|
|
19
|
-
<script src="https://unpkg.com/braid-text/client.js"></script>
|
|
19
|
+
<script src="https://unpkg.com/braid-text/simpleton-client.js"></script>
|
|
20
20
|
|
|
21
21
|
<script>
|
|
22
22
|
|
|
23
|
-
var apply_patches_and_update_selection, diff, first_time, i, j, render_delay, scroll,
|
|
24
|
-
|
|
25
|
-
braid_text_key = location.pathname;
|
|
23
|
+
var apply_patches_and_update_selection, diff, first_time, i, j, render_delay, scroll, t, timer, ting, toggle_editor, update_markdown, update_markdown_later;
|
|
26
24
|
|
|
27
25
|
t = function() {
|
|
28
26
|
return document.getElementById('the editor');
|
|
29
27
|
};
|
|
30
28
|
|
|
31
|
-
var
|
|
29
|
+
var simpleton = simpleton_client(location.pathname, {
|
|
32
30
|
apply_remote_update: function(x) {
|
|
33
31
|
if (x.state !== void 0) {
|
|
34
32
|
t().value = x.state;
|
|
@@ -188,7 +186,7 @@ dom.WIKI = function() {
|
|
|
188
186
|
}
|
|
189
187
|
// Bail on edits that try to wipe us out
|
|
190
188
|
state.source = e.target.value;
|
|
191
|
-
|
|
189
|
+
simpleton.changed();
|
|
192
190
|
return update_markdown_later();
|
|
193
191
|
},
|
|
194
192
|
defaultValue: state.source
|
package/package.json
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
// this is for outgoing changes;
|
|
18
18
|
// diff_function = () => ({patches, new_version}).
|
|
19
19
|
//
|
|
20
|
-
function
|
|
20
|
+
function simpleton_client(url, { apply_remote_update, generate_local_diff_update, content_type }) {
|
|
21
21
|
var peer = Math.random().toString(36).substr(2)
|
|
22
22
|
var current_version = []
|
|
23
23
|
var prev_state = ""
|