vibe-editor 0.0.4 → 0.0.6

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 (78) hide show
  1. package/package.json +66 -61
  2. package/src/scripts/js/Core.js +28 -9
  3. package/src/scripts/js/entry.js +6 -5
  4. package/src/scripts/js/gui/Annotations.js +27 -12
  5. package/src/scripts/js/gui/ScoreManipulator.js +6 -4
  6. package/src/scripts/js/gui/Tabbar.js +13 -4
  7. package/src/scripts/js/handlers/AnnotationChangeHandler.js +13 -1
  8. package/src/scripts/js/handlers/InsertModeHandler.js +3 -3
  9. package/src/scripts/js/handlers/PhantomElementHandler.js +3 -10
  10. package/src/scripts/js/handlers/WindowHandler.js +7 -7
  11. package/src/scripts/js/scripts/Core.js +932 -0
  12. package/src/scripts/js/scripts/MusicProcessor.js +810 -0
  13. package/src/scripts/js/scripts/VIBE.js +219 -0
  14. package/src/scripts/js/scripts/datastructures/MeasureMatrix.js +156 -0
  15. package/src/scripts/js/scripts/gui/Annotations.js +549 -0
  16. package/src/scripts/js/scripts/gui/Cursor.js +203 -0
  17. package/src/scripts/js/scripts/gui/PhantomElement.js +132 -0
  18. package/src/scripts/js/scripts/gui/ScoreManipulator.js +188 -0
  19. package/src/scripts/js/scripts/gui/Tabbar.js +705 -0
  20. package/src/scripts/js/{gui/Toolbar copy.js → scripts/gui/Toolbar.js} +15 -11
  21. package/src/scripts/js/scripts/handlers/AnnotationChangeHandler.js +650 -0
  22. package/src/scripts/js/scripts/handlers/ClickModeHandler.js +535 -0
  23. package/src/scripts/js/{gui → scripts/handlers}/CustomAnnotationShapeDrawer.js +34 -17
  24. package/src/scripts/js/{handlers/ModHandler.js → scripts/handlers/CustomToolbarHandler.js} +54 -66
  25. package/src/scripts/js/scripts/handlers/GlobalKeyboardHandler.js +372 -0
  26. package/src/scripts/js/scripts/handlers/Handler.js +2 -0
  27. package/src/scripts/js/{handlers/InsertModeHandler_deprecated.js → scripts/handlers/InsertModeHandler.js} +117 -164
  28. package/src/scripts/js/scripts/handlers/KeyModeHandler.js +405 -0
  29. package/src/scripts/js/scripts/handlers/LabelHandler.js +463 -0
  30. package/src/scripts/js/scripts/handlers/NoteDragHandler.js +97 -0
  31. package/src/scripts/js/scripts/handlers/PhantomElementHandler.js +161 -0
  32. package/src/scripts/js/scripts/handlers/ScoreManipulatorHandler.js +233 -0
  33. package/src/scripts/js/scripts/handlers/SidebarHandler.js +506 -0
  34. package/src/scripts/js/scripts/handlers/TooltipHandler.js +132 -0
  35. package/src/scripts/js/scripts/handlers/WindowHandler.js +278 -0
  36. package/src/scripts/js/scripts/utils/MEIOperations.js +2121 -0
  37. package/src/scripts/js/{utils/Mouse2MEI.js → scripts/utils/Mouse2SVG.js} +225 -57
  38. package/src/scripts/js/scripts/utils/SVGEditor.js +453 -0
  39. package/src/scripts/js/scripts/utils/Types.js +2 -0
  40. package/src/scripts/js/{utils/VerovioWrapper copy.js → scripts/utils/VerovioWrapper.js} +32 -18
  41. package/src/scripts/js/scripts/utils/coordinates.js +78 -0
  42. package/src/scripts/js/utils/Mouse2SVG.js +11 -4
  43. package/src/scripts/js/utils/VerovioWrapper.js +4 -4
  44. package/src/scripts/js/utils/coordinates.js +26 -2
  45. package/src/styles/vibe.css +32 -6
  46. package/src/scripts/js/.DS_Store +0 -0
  47. package/src/scripts/js/MusicPlayer.js +0 -572
  48. package/src/scripts/js/datastructures/ScoreGraph copy.js +0 -432
  49. package/src/scripts/js/gui/CustomAnnotationDrawer.js +0 -114
  50. package/src/scripts/js/handlers/AnnotationDragHandler.js +0 -113
  51. package/src/scripts/js/handlers/AnnotationLineHandler.js +0 -113
  52. package/src/scripts/js/handlers/ArticulationHandler.js +0 -20
  53. package/src/scripts/js/handlers/HarmonyHandler.js +0 -282
  54. package/src/scripts/js/handlers/InsertModeHandler copy.js +0 -423
  55. package/src/scripts/js/handlers/KeyModeHandler copy.js +0 -407
  56. package/src/scripts/js/handlers/KeyModeHandler_deprecated.js +0 -411
  57. package/src/scripts/js/handlers/NoteDragHandler copy.js +0 -148
  58. package/src/scripts/js/handlers/NoteDragHandler_deprecated.js +0 -150
  59. package/src/scripts/js/handlers/SelectionHandler.js +0 -262
  60. package/src/scripts/js/utils/RectWrapper.js +0 -10
  61. package/src/scripts/js/utils/SVGFiller.js +0 -245
  62. package/src/scripts/js/utils/VerovioWrapperLocal.js +0 -156
  63. package/src/scripts/js/utils/firefoxBBoxes.js +0 -143
  64. /package/src/scripts/js/{assets → scripts/assets}/mei_template.js +0 -0
  65. /package/src/scripts/js/{constants.js → scripts/constants.js} +0 -0
  66. /package/src/scripts/js/{datastructures → scripts/datastructures}/ScoreGraph.js +0 -0
  67. /package/src/scripts/js/{datastructures → scripts/datastructures}/ScoreGraph_deprecated.js +0 -0
  68. /package/src/scripts/js/{datastructures → scripts/datastructures}/ScoreNode.js +0 -0
  69. /package/src/scripts/js/{gui → scripts/gui}/HarmonyLabel.js +0 -0
  70. /package/src/scripts/js/{gui → scripts/gui}/Label.js +0 -0
  71. /package/src/scripts/js/{gui → scripts/gui}/TempoLabel.js +0 -0
  72. /package/src/scripts/js/{handlers → scripts/handlers}/DeleteHandler.js +0 -0
  73. /package/src/scripts/js/{utils → scripts/utils}/DOMCreator.js +0 -0
  74. /package/src/scripts/js/{utils → scripts/utils}/MEIConverter.js +0 -0
  75. /package/src/scripts/js/{utils → scripts/utils}/ReactWrapper.js +0 -0
  76. /package/src/scripts/js/{utils → scripts/utils}/convenienceQueries.js +0 -0
  77. /package/src/scripts/js/{utils → scripts/utils}/mappings.js +0 -0
  78. /package/src/scripts/js/{utils → scripts/utils}/random.js +0 -0
@@ -1,423 +0,0 @@
1
- Object.defineProperty(exports, "__esModule", { value: true });
2
- exports.default = void 0;
3
- const constants_1 = require("../constants");
4
- const SelectionHandler_1 = require("./SelectionHandler");
5
- const Annotations_1 = require("../gui/Annotations");
6
- const LabelHandler_1 = require("./LabelHandler");
7
- const KeyModeHandler_1 = require("./KeyModeHandler");
8
- const ClickModeHandler_1 = require("./ClickModeHandler");
9
- const PhantomElementHandler_1 = require("./PhantomElementHandler");
10
- const MEIConverter_1 = require("../utils/MEIConverter");
11
- const ScoreManipulatorHandler_1 = require("./ScoreManipulatorHandler");
12
- const MEIOperations_1 = require("../utils/MEIOperations");
13
- const cq = require("../utils/convenienceQueries");
14
- /**
15
- * Class that handles insert mode, events, and actions.
16
- */
17
- class InsertModeHandler {
18
- constructor(containerId) {
19
- //For Callbacks
20
- this.activateHarmonyModeFunction = (function activateHarmonyModeFunction(clicked = false) {
21
- this.activateHarmonyMode(clicked);
22
- }).bind(this);
23
- this.isGlobal = true;
24
- this.annotations = new Annotations_1.default(containerId);
25
- }
26
- activateClickMode(clicked = false) {
27
- if (this.keyMode || this.annotationMode || this.harmonyMode) {
28
- this.insertDeactivate();
29
- }
30
- if (clicked) {
31
- if (this.unselectMenuItem("clickInsert")) {
32
- return;
33
- }
34
- }
35
- this.container.classList.add("clickmode");
36
- this.keyMode = false;
37
- this.clickInsertMode = true;
38
- this.annotationMode = false;
39
- this.harmonyMode = false;
40
- this.phantomNoteHandler = new PhantomElementHandler_1.default(this.containerId);
41
- this.setPhantomNote();
42
- this.clickModeHandler = this.clickModeHandler == undefined ? new ClickModeHandler_1.default() : this.clickModeHandler;
43
- this.clickModeHandler
44
- .setContainerId(this.containerId)
45
- .setInsertCallback(this.insertCallback)
46
- .setDeleteCallback(this.deleteCallback)
47
- .setAnnotations(this.annotations)
48
- .setM2M(this.m2m)
49
- .setMusicPlayer(this.musicPlayer)
50
- .setPhantomCursor(this.phantomNoteHandler)
51
- .resetListeners();
52
- // if(typeof this.selectionHandler !== "undefined"){
53
- // this.selectionHandler.removeListeners()
54
- // }
55
- this.deleteHandler.setListeners();
56
- }
57
- activateKeyMode(clicked = false) {
58
- var _a;
59
- if (this.clickInsertMode || this.annotationMode || this.harmonyMode) {
60
- this.insertDeactivate();
61
- }
62
- if (clicked) {
63
- if (this.unselectMenuItem("keyMode")) {
64
- return;
65
- }
66
- }
67
- this.container.classList.add("textmode");
68
- this.keyMode = true;
69
- this.clickInsertMode = false;
70
- this.annotationMode = false;
71
- this.harmonyMode = false;
72
- var cursor = null;
73
- if (this.keyModeHandler != undefined) {
74
- cursor = this.keyModeHandler.cursor;
75
- }
76
- this.keyModeHandler = this.keyModeHandler || new KeyModeHandler_1.default(this.containerId);
77
- var currNodeId;
78
- if (((_a = this.keyModeHandler.scoreGraph) === null || _a === void 0 ? void 0 : _a.getCurrentNode()) != undefined) {
79
- currNodeId = this.keyModeHandler.scoreGraph.getCurrentNode().getId();
80
- }
81
- this.keyModeHandler
82
- .setContainerId(this.containerId)
83
- .setInsertCallback(this.insertCallback)
84
- .setDeleteCallback(this.deleteCallback)
85
- .setScoreGraph(this.scoreGraph)
86
- .setM2M(this.m2m)
87
- .setMusicPlayer(this.musicPlayer)
88
- .resetListeners();
89
- if (currNodeId != undefined) {
90
- this.keyModeHandler.setCurrentNodeScoreGraph(currNodeId);
91
- }
92
- // if(typeof this.selectionHandler !== "undefined"){
93
- // this.selectionHandler.removeListeners()
94
- // }
95
- this.deleteHandler.setListeners();
96
- }
97
- activateSelectionMode() {
98
- //this.insertDeactivate()
99
- this.selectionHandler = new SelectionHandler_1.default(this.containerId);
100
- this.selectionHandler.setM2M(this.m2m);
101
- //this.selectionHandler.setHarmonyHandler(this.harmonyHandler)
102
- //this.deleteHandler.setListeners()
103
- return this;
104
- }
105
- activateAnnotationMode(clicked = false) {
106
- this.insertDeactivate();
107
- if (clicked) {
108
- if (this.unselectMenuItem("activateAnnot")) {
109
- return;
110
- }
111
- }
112
- if (this.annotations == undefined) {
113
- this.annotations = new Annotations_1.default(this.containerId);
114
- }
115
- else {
116
- this.annotations.update();
117
- }
118
- this.annotations
119
- .setContainerId(this.containerId)
120
- .setM2M(this.m2m)
121
- .setMusicPlayer(this.musicPlayer)
122
- .setToFront()
123
- .setMenuClickHandler();
124
- this.keyMode = false;
125
- this.clickInsertMode = false;
126
- this.annotationMode = true;
127
- this.harmonyMode = false;
128
- }
129
- activateHarmonyMode(clicked = false) {
130
- try {
131
- if (clicked) {
132
- if (this.unselectMenuItem("activateHarm")) {
133
- return;
134
- }
135
- }
136
- }
137
- catch (_a) {
138
- try {
139
- var harmonyButton = this.container.querySelector("#harmonyAnnotButton");
140
- if (!harmonyButton.classList.contains("selected")) {
141
- harmonyButton.classList.add("selected");
142
- }
143
- }
144
- catch (e) {
145
- console.error("There was a problem in activating harmonymode", e);
146
- return;
147
- }
148
- }
149
- if (this.labelHandler == undefined) {
150
- this.labelHandler = new LabelHandler_1.default(this.containerId);
151
- }
152
- //Activate/ Deactivate Global functions according to selected harmonymode
153
- if (this.container.querySelector("#activateHarm.selected, #harmonyAnnotButton.selected") !== null) {
154
- this.insertDeactivate();
155
- this.container.classList.add("harmonyMode");
156
- this.isGlobal = false;
157
- }
158
- else {
159
- this.isGlobal = true;
160
- }
161
- this.labelHandler
162
- .setContainerId(this.containerId)
163
- .setGlobal(this.isGlobal)
164
- .setListeners()
165
- .setM2M(this.m2m)
166
- .setMusicPlayer(this.musicPlayer)
167
- .setCurrentMEI(this.m2m.getCurrentMei())
168
- .setLoadDataCallback(this.loadDataCallback);
169
- //this.keyMode = false;
170
- //this.clickInsertMode = false;
171
- //this.annotationMode = false;
172
- this.harmonyMode = true;
173
- return this;
174
- }
175
- insertDeactivate() {
176
- this.container.classList.remove("textmode");
177
- this.container.classList.remove("clickmode");
178
- this.container.classList.remove("annotMode");
179
- this.container.classList.remove("harmonyMode");
180
- this.keyMode = false;
181
- this.clickInsertMode = false;
182
- this.harmonyMode = false;
183
- this.annotationMode = false;
184
- if (this.clickModeHandler != undefined) {
185
- this.clickModeHandler.removeListeners();
186
- this.phantomNoteHandler
187
- .removeListeners()
188
- .removeLines();
189
- }
190
- if (this.keyModeHandler != undefined) {
191
- this.keyModeHandler.removeListeners();
192
- }
193
- // if(typeof this.selectionHandler !== "undefined"){
194
- // this.selectionHandler.removeListeners()
195
- // }
196
- // this.selectionHandler = undefined
197
- if (this.annotations != undefined) {
198
- this.annotations.removeListeners();
199
- this.annotations.setToBack();
200
- this.annotationMode = false;
201
- }
202
- if (this.labelHandler != undefined) {
203
- //this.labelHandler.removeListeners()
204
- this.isGlobal = true;
205
- this.labelHandler.reset();
206
- }
207
- if (this.deleteHandler != undefined) {
208
- this.deleteHandler.removeListeners();
209
- }
210
- //selectionnmode should be always active.
211
- //Listeners will overwritten if another mode listen same behaviour on same element (d3.js), e.g. annotation
212
- this.activateSelectionMode();
213
- }
214
- setSMHandler() {
215
- if (this.smHandler == undefined) {
216
- this.smHandler = new ScoreManipulatorHandler_1.default();
217
- }
218
- this.smHandler
219
- .setContainerId(this.containerId)
220
- .setMEI(this.m2m.getCurrentMei())
221
- .setMusicPlayer(this.musicPlayer)
222
- .setLoadDataCallback(this.loadDataCallback)
223
- .drawElements();
224
- }
225
- setListeners() {
226
- var that = this;
227
- Array.from(this.container.querySelectorAll(".dropdown-item")).forEach(n => {
228
- n.addEventListener("click", function (e) {
229
- e.preventDefault();
230
- switch (this.id) {
231
- case "clickInsert":
232
- that.activateClickMode(true);
233
- break;
234
- case "keyMode":
235
- that.activateKeyMode(true);
236
- break;
237
- case "activateAnnot":
238
- that.activateAnnotationMode(true);
239
- break;
240
- case "activateHarm":
241
- that.activateHarmonyMode(true);
242
- break;
243
- default:
244
- that.insertDeactivate();
245
- break;
246
- }
247
- });
248
- });
249
- this.container.addEventListener("annotationButtonClicked", function (e) {
250
- var t = e.target;
251
- if (t.id === "harmonyAnnotButton") {
252
- that.activateHarmonyMode(true);
253
- }
254
- else {
255
- that.activateHarmonyMode(false);
256
- }
257
- }, true);
258
- Array.from(this.container.querySelectorAll("#noteGroup > *")).forEach(b => {
259
- b.addEventListener("click", function (e) {
260
- let dur = 0;
261
- switch (this.id) {
262
- case "fullNote":
263
- dur = 1;
264
- break;
265
- case "halfNote":
266
- dur = 2;
267
- break;
268
- case "quarterNote":
269
- dur = 4;
270
- break;
271
- case "eigthNote":
272
- dur = 8;
273
- break;
274
- case "sixteenthNote":
275
- dur = 16;
276
- break;
277
- case "thirtysecondNote":
278
- dur = 32;
279
- break;
280
- }
281
- that.m2m.setDurationNewNote(dur);
282
- if (that.m2m.setMarkedNoteDurations(dur)) {
283
- MEIOperations_1.cleanUp(that.m2m.getCurrentMei());
284
- var mei = MEIConverter_1.restoreXmlIdTags(that.m2m.getCurrentMei());
285
- that.loadDataCallback("", mei, false, constants_1.constants._TARGETDIVID_);
286
- }
287
- });
288
- });
289
- Array.from(this.container.querySelectorAll("#dotGroup > *")).forEach(b => {
290
- b.addEventListener("click", function (e) {
291
- let dots = 0;
292
- if (this.classList.contains("selected")) {
293
- switch (this.id) {
294
- case "oneDot":
295
- dots = 1;
296
- break;
297
- case "twoDot":
298
- dots = 2;
299
- }
300
- }
301
- that.m2m.setDotsNewNote(dots);
302
- if (that.m2m.setMarkedNoteDots(dots)) {
303
- MEIOperations_1.cleanUp(that.m2m.getCurrentMei());
304
- var mei = MEIConverter_1.restoreXmlIdTags(that.m2m.getCurrentMei());
305
- that.loadDataCallback("", mei, false, constants_1.constants._TARGETDIVID_);
306
- }
307
- });
308
- });
309
- this.navBarLoaded = true;
310
- return this;
311
- }
312
- removeListeners() {
313
- // No Changes in Navbar = no remove
314
- }
315
- resetModes() {
316
- //reset
317
- if (!this.navBarLoaded)
318
- this.setListeners();
319
- if (this.keyMode)
320
- this.activateKeyMode();
321
- if (this.clickInsertMode)
322
- this.activateClickMode();
323
- if (this.annotationMode)
324
- this.activateAnnotationMode();
325
- if (this.harmonyMode)
326
- this.activateHarmonyMode();
327
- this.setSMHandler();
328
- return this;
329
- }
330
- unselectMenuItem(key) {
331
- var menuitem = this.container.querySelector("#" + key);
332
- var modeButton = this.container.querySelector("#insertMode");
333
- if (menuitem.classList.contains("selected")) {
334
- menuitem.classList.remove("selected");
335
- modeButton.innerHTML = "        ";
336
- modeButton.classList.add("empty");
337
- this.insertDeactivate();
338
- return true;
339
- }
340
- else {
341
- this.container.querySelectorAll("#insertDropdown > a").forEach(a => {
342
- if (a.id !== key) {
343
- a.classList.remove("selected");
344
- }
345
- });
346
- menuitem.classList.add("selected");
347
- modeButton.textContent = menuitem.textContent;
348
- modeButton.classList.remove("empty");
349
- return false;
350
- }
351
- }
352
- /////////////// GETTER/ SETTER /////////////////
353
- setM2M(m2m) {
354
- this.m2m = m2m;
355
- //this.selectionHandler = new SelectionHandler()
356
- //this.selectionHandler?.setM2M(this.m2m)
357
- return this;
358
- }
359
- setMusicPlayer(musicPlayer) {
360
- this.musicPlayer = musicPlayer;
361
- return this;
362
- }
363
- setScoreGraph(scoreGraph) {
364
- this.scoreGraph = scoreGraph;
365
- return this;
366
- }
367
- setDeleteHandler(deleteHandler) {
368
- this.deleteHandler = deleteHandler;
369
- return this;
370
- }
371
- setLabelHandler(labelHandler) {
372
- this.labelHandler = labelHandler;
373
- return this;
374
- }
375
- setPhantomNote() {
376
- if (this.phantomNoteHandler != undefined) {
377
- this.phantomNoteHandler
378
- .setPhantomNote()
379
- .setListeners()
380
- .setM2M(this.m2m);
381
- }
382
- return this;
383
- }
384
- setInsertCallback(insertCallback) {
385
- this.insertCallback = insertCallback;
386
- return this;
387
- }
388
- setDeleteCallback(deleteCallback) {
389
- this.deleteCallback = deleteCallback;
390
- return this;
391
- }
392
- setLoadDataCallback(loadDataCallback) {
393
- this.loadDataCallback = loadDataCallback;
394
- return this;
395
- }
396
- setUndoAnnotationStacks(arr) {
397
- this.annotations.setUndoStacks(arr);
398
- return this;
399
- }
400
- setContainerId(containerId) {
401
- this.containerId = containerId;
402
- this.interactionOverlay = cq.getInteractOverlay(containerId);
403
- this.rootSVG = cq.getRootSVG(containerId);
404
- this.container = document.getElementById(containerId);
405
- return this;
406
- }
407
- resetCanvas() {
408
- if (this.annotations != undefined) {
409
- this.annotations.addCanvas();
410
- }
411
- return this;
412
- }
413
- getAnnotations() {
414
- return this.annotations;
415
- }
416
- getSMHandler() {
417
- return this.smHandler;
418
- }
419
- getPhantomNoteHandler() {
420
- return this.phantomNoteHandler;
421
- }
422
- }
423
- exports.default = InsertModeHandler;