git @ Cat's Eye Technologies Lexeduct / 33fda7d
Fix and reform "live mode" so that it is actually pretty live. Chris Pressey 6 years ago
3 changed file(s) with 37 addition(s) and 40 deletion(s). Raw diff Collapse all Expand all
6969 transformer function should return either a string, or null (not yet supported),
7070 or an array of strings (not yet supported.)
7171
72 As a simple example, here is the source of the `upper` transformer, found
73 in `src/transformers/upper.js`:
74
75 module.exports = {
76 makeTransformer: function(cfg) {
77 return function(str, state) {
78 return str.toUpperCase();
79 };
80 }
81 };
72 The module may also export a couple of other things, like an English description
73 of the transformer, and the possible configuration options. For a reasonably
74 simple example, see the source of the `upper` transformer, found
75 in [src/transformers/upper.js](src/transformers/upper.js).
8276
8377 `state` is an object whose members may be read or written to store ancillary
8478 state. (Doing so will make it an 'impure' pipeline.)
9892
9993 Lexeduct was partly inspired by, and is partly a product of parallel evolution
10094 resembling, [Michael Paulukonis][]'s [TextMunger][]. It is also indebted to
101 various and sundry discussion with him and others on the
102 [GenerativeText Forum][].
103
104 TODO
105 ----
106
107 * Allow filters to do something at the very end, maybe.
108 * Allow filters return multiple, or no, strings.
109 * Many, many other things.
110
111 ### In-browser UI ###
112
113 * Dynamically allocate the number of transformer-slots.
114 * Provide "insert" and "delete" operations on each transformer-slot.
115 * Display the description for each select transformer, in a tooltip(?)
116 * Better live mode (do on each keypress in param input, input text.)
95 various and sundry discussion with him, and others on the
96 [GenerativeText Forum][], particularly [John Ohno][].
11797
11898 [Michael Paulukonis]: https://github.com/MichaelPaulukonis/
11999 [TextMunger]: https://github.com/MichaelPaulukonis/text-munger
120100 [GenerativeText Forum]: https://groups.google.com/forum/#!forum/generativetext
101 [John Ohno]: https://github.com/enkiv2/
1111
1212 function LexeductUI() {
1313 var container, input, output, processButton, tranformersPanel;
14 var liveMode;
1514 var MAX_TRANSFORMER_SLOTS = 8; // TODO dynamic
1615 var transformerSlots = [];
1716 var transformerNames;
1817
1918 this.init = function(cfg) {
19 var $this = this;
20
2021 container = cfg.container;
22 cfg.liveMode = !!cfg.liveMode;
23
2124 input = yoob.makeTextArea(container, 40, 20, cfg.initialText);
25 input.onkeyup = function() {
26 if ($this.liveMode) {
27 $this.process();
28 }
29 };
2230
2331 var transformersPanel = yoob.makeDiv(container);
2432 transformersPanel.style.border = "2px solid black";
3341 }
3442
3543 processButton = yoob.makeButton(transformersPanel, "Process", this.process);
36
37 yoob.makeCheckbox(transformersPanel, false, "Live mode", function(b) {
38 liveMode = b;
44 yoob.makeCheckbox(transformersPanel, cfg.liveMode, "Live mode", function(b) {
45 $this.setLiveMode(b);
3946 });
4047 yoob.makeLineBreak(transformersPanel);
4148
4552 }
4653
4754 output = yoob.makeTextArea(container, 40, 20);
55
56 this.setLiveMode(cfg.liveMode);
57 };
58
59 this.setLiveMode = function(b) {
60 this.liveMode = b;
61 processButton.disabled = b;
4862 };
4963
5064 this.process = function() {
7791
7892 this.makeParameterEditor = function(slot, panel, paramName, desc, def) {
7993 var label = yoob.makeSpan(panel, paramName);
80 var input = yoob.makeTextInput(panel, 24, def);
94 var paramInput = yoob.makeTextInput(panel, 24, def);
8195 slot.selectedParams[paramName] = def;
82 input.onchange = function() {
83 slot.selectedParams[paramName] = input.value;
84 if (liveMode) {
85 process();
96 var $this = this;
97 paramInput.onkeyup = function() {
98 slot.selectedParams[paramName] = paramInput.value;
99 if ($this.liveMode) {
100 $this.process();
86101 }
87 }
102 };
88103 yoob.makeLineBreak(panel);
89104 };
90105
102117 select.onchange = function(e) {
103118 transformerSlots[index].name = select.options[select.selectedIndex].value;
104119 $this.updateParametersPanel(transformerSlots[index], parametersPanel);
105 if (liveMode) {
106 process();
120 if ($this.liveMode) {
121 $this.process();
107122 }
108123 };
109124
4343 <script src="lexeduct-browser.js"></script>
4444 <script>
4545 (new LexeductUI()).init({
46 'container': document.getElementById('container'),
47 'initialText': document.getElementById('initial-text').innerHTML
46 container: document.getElementById('container'),
47 initialText: document.getElementById('initial-text').innerHTML,
48 liveMode: true
4849 });
4950 </script>