doc-survival-kit 1.1.0 → 2.0.0

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.

Potentially problematic release.

This version of doc-survival-kit might be problematic. Click here for more details.

Files changed (9) hide show
  1. package/diagram.html +46 -0
  2. package/diagram.js +550 -116
  3. package/diagrammes.js +863 -216
  4. package/images/img_1774709818351.png +0 -0
  5. package/images/img_1774711114086.png +0 -0
  6. package/images/img_1774711575731.png +0 -0
  7. package/images/img_1774712426980.png +0 -0
  8. package/package.json +1 -1
  9. package/style.css +79 -18
package/diagrammes.js CHANGED
@@ -1,231 +1,878 @@
1
1
  var diagrammesDefaut = [
2
2
  {
3
- id: 1700000000010,
4
- titre: "Architecture example",
5
- shapes: [
6
- {
7
- id: "s1",
8
- type: "rounded",
9
- x: 100,
10
- y: 322,
11
- w: 130,
12
- h: 50,
13
- text: "Client Web",
14
- color: "t-sky",
15
- },
16
- {
17
- id: "s2",
18
- type: "rect",
19
- x: 306,
20
- y: 324,
21
- w: 130,
22
- h: 50,
23
- text: "API Gateway",
24
- color: "t-green",
25
- },
26
- {
27
- id: "s3",
28
- type: "rect",
29
- x: 531,
30
- y: 228,
31
- w: 130,
32
- h: 50,
33
- text: "Auth Service",
34
- color: "t-violet",
35
- },
36
- {
37
- id: "s4",
38
- type: "rect",
39
- x: 530,
40
- y: 387,
41
- w: 130,
42
- h: 50,
43
- text: "Data Service",
44
- color: "t-amber",
45
- },
46
- {
47
- id: "s5",
48
- type: "db",
49
- x: 793,
50
- y: 414,
51
- w: 126,
52
- h: 99,
53
- text: "PostgreSQL",
54
- color: "t-rose",
55
- },
56
- {
57
- id: "s6",
58
- type: "cloud",
59
- x: 880,
60
- y: 101,
61
- w: 110,
62
- h: 65,
63
- text: "OAuth 2.0",
64
- color: "t-teal",
65
- },
66
- {
67
- id: "p2",
68
- type: "postit",
69
- x: 45,
70
- y: 134,
71
- w: 218,
72
- h: 125,
73
- text: "Créer une forme\n7 types : rect, arrondi,\nDB, cloud, texte,\npost-it. Choisir l'outil\npuis clic sur le canvas.",
74
- color: "t-amber",
75
- },
76
- {
77
- id: "p3",
78
- type: "postit",
79
- x: 772,
80
- y: 521,
81
- w: 175,
82
- h: 100,
83
- text: "Déplacer & Redim.\nDrag sur une forme\npour la déplacer.\nPoignée orange\nbas-droit = resize.",
84
- color: "t-green",
85
- },
86
- {
87
- id: "p4",
88
- type: "postit",
89
- x: 753,
90
- y: 208,
91
- w: 165,
92
- h: 100,
93
- text: "Flèches\nOutil → puis clic\nsource → cible.\nOu drag depuis un\npoint de connexion.",
94
- color: "t-violet",
95
- },
96
- {
97
- id: "p5",
98
- type: "postit",
99
- x: 16,
100
- y: 392,
101
- w: 175,
102
- h: 120,
103
- text: "Éditer le texte\nDouble-clic sur\nune forme ou flèche.\nOu bouton stylo\ndans la palette.",
104
- color: "t-sky",
105
- },
106
- {
107
- id: "p6",
108
- type: "postit",
109
- x: 16,
110
- y: 522,
111
- w: 175,
112
- h: 120,
113
- text: "Couleurs\nSélectionner une forme\npuis cliquer dans\nla palette qui\napparaît en haut.",
114
- color: "t-sky",
115
- },
116
- {
117
- id: "p8",
118
- type: "postit",
119
- x: 752,
120
- y: -59,
121
- w: 165,
122
- h: 120,
123
- text: "Sauvegarder\nLe bouton vert\n'enregistrer' apparaît\ndès qu'il y a\ndes modifications.",
124
- color: "t-violet",
125
- },
126
- {
127
- id: "p9",
128
- type: "postit",
129
- x: 1198,
130
- y: 509,
131
- w: 175,
132
- h: 120,
133
- text: "Shift+clic\nAjouter ou retirer\nune forme de la\nsélection active.\nCouleur = tout le groupe.",
134
- color: "t-sky",
135
- },
136
- {
137
- id: "p10",
138
- type: "postit",
139
- x: 1383,
140
- y: 510,
141
- w: 175,
142
- h: 120,
143
- text: "Lasso\nShift+drag sur fond\nvide pour capturer\ntoutes les formes\ndans la zone.",
144
- color: "t-green",
145
- },
146
- {
147
- id: "p11",
148
- type: "postit",
149
- x: 1290,
150
- y: 638,
151
- w: 175,
152
- h: 120,
153
- text: "Déplacer le groupe\nClic-drag sur une\nforme sélectionnée\ndéplace tout le\ngroupe ensemble.",
154
- color: "t-rose",
155
- },
156
- {
157
- id: "s1774268807966",
158
- type: "postit",
159
- x: 44,
160
- y: -5,
161
- w: 222,
162
- h: 111,
163
- text: "Bienvenue dans diagrammes !",
164
- color: "t-amber",
165
- },
166
- {
167
- id: "s1774269105490",
168
- type: "postit",
169
- x: 1107,
170
- y: 159,
171
- w: 305,
172
- h: 115,
173
- text: "Zoom & Navigation\n\nMolette = zoom centré sur curseur.\nDrag fond vide = déplacer la vue.",
174
- color: "t-amber",
175
- },
176
- {
177
- id: "s1774269591962",
178
- type: "postit",
179
- x: 618,
180
- y: 758,
181
- w: 402,
182
- h: 183,
183
- text: "GOLDEN FEATURE !\n\nCOLLER VOS IMAGES (CAPTURES D'ECRAN)\nDIRECTEMENT DANS CE BOARD !!!!",
184
- color: "t-rose",
185
- },
186
- {
187
- id: "s1774270331736",
188
- type: "image",
189
- x: 976,
190
- y: 643,
191
- w: 181,
192
- h: 280,
193
- text: "",
194
- color: "",
195
- src: "images/img_1774270331723.png",
3
+ "id": 1700000000010,
4
+ "titre": "Welcome to Diagrams !",
5
+ "shapes": [
6
+ {
7
+ "id": "p8",
8
+ "type": "postit",
9
+ "x": -21,
10
+ "y": 486,
11
+ "w": 229,
12
+ "h": 177,
13
+ "text": "(5)\n\nLe bouton 'enregistrer' apparaît dès qu'il y a des modifications.",
14
+ "color": "t-white",
15
+ "fontSize": 15,
16
+ "textValign": "top"
17
+ },
18
+ {
19
+ "id": "s1774269105490",
20
+ "type": "postit",
21
+ "x": 273,
22
+ "y": 604,
23
+ "w": 235,
24
+ "h": 180,
25
+ "text": "(6)\n\nZoom & Navigation\n\nHistorique des changements\n\nSelection Shift+Clic",
26
+ "color": "t-amber",
27
+ "fontSize": 15,
28
+ "textAlign": "center",
29
+ "textValign": "top",
30
+ "rotation": 0
31
+ },
32
+ {
33
+ "id": "s1774270331736",
34
+ "type": "image",
35
+ "x": 1194,
36
+ "y": 130,
37
+ "w": 181,
38
+ "h": 280,
39
+ "text": "",
40
+ "color": "",
41
+ "src": "images/img_1774270331723.png"
42
+ },
43
+ {
44
+ "id": "s1774709932053",
45
+ "type": "rounded",
46
+ "x": 178,
47
+ "y": 177,
48
+ "w": 60,
49
+ "h": 30,
50
+ "text": "",
51
+ "color": "t-amber"
52
+ },
53
+ {
54
+ "id": "s1774708628689",
55
+ "type": "postit",
56
+ "x": -48,
57
+ "y": -48,
58
+ "w": 232,
59
+ "h": 179,
60
+ "text": "Welcome in Diagrams !\n\nA drawing app by \nYoussef Medaghri-Alaoui\n\nwww.craftskillz.com",
61
+ "color": "t-amber",
62
+ "fontSize": 15,
63
+ "externalUrl": "https://www.craftskillz.com/posts/stay-secure-and-productive"
64
+ },
65
+ {
66
+ "id": "s1774708954487",
67
+ "type": "postit",
68
+ "x": 74,
69
+ "y": 173,
70
+ "w": 189,
71
+ "h": 88,
72
+ "text": "",
73
+ "color": "t-amber"
74
+ },
75
+ {
76
+ "id": "s1774708987586",
77
+ "type": "postit",
78
+ "x": 50,
79
+ "y": 243,
80
+ "w": 67,
81
+ "h": 76,
82
+ "text": "",
83
+ "color": "t-green"
84
+ },
85
+ {
86
+ "id": "s1774709005560",
87
+ "type": "postit",
88
+ "x": 67,
89
+ "y": 289,
90
+ "w": 132,
91
+ "h": 88,
92
+ "text": "",
93
+ "color": "t-rose"
94
+ },
95
+ {
96
+ "id": "s1774708996141",
97
+ "type": "postit",
98
+ "x": 142,
99
+ "y": 243,
100
+ "w": 67,
101
+ "h": 76,
102
+ "text": "",
103
+ "color": "t-violet",
104
+ "fontSize": 12,
105
+ "textAlign": "center",
106
+ "textValign": "middle",
107
+ "rotation": 0
108
+ },
109
+ {
110
+ "id": "s1774709000957",
111
+ "type": "postit",
112
+ "x": 224,
113
+ "y": 245,
114
+ "w": 67,
115
+ "h": 76,
116
+ "text": "",
117
+ "color": "t-sky",
118
+ "fontSize": 12,
119
+ "textAlign": "center",
120
+ "textValign": "middle",
121
+ "rotation": 0
122
+ },
123
+ {
124
+ "id": "s1774709008722",
125
+ "type": "postit",
126
+ "x": 121,
127
+ "y": 336,
128
+ "w": 132,
129
+ "h": 88,
130
+ "text": "",
131
+ "color": "t-teal"
132
+ },
133
+ {
134
+ "id": "s1774709121165",
135
+ "type": "postit",
136
+ "x": 432,
137
+ "y": -48,
138
+ "w": 440,
139
+ "h": 180,
140
+ "text": "(2)\n\n You can create various shapes, rotate them, rotate them ...",
141
+ "color": "t-white",
142
+ "fontSize": 15,
143
+ "textAlign": "center",
144
+ "textValign": "top",
145
+ "rotation": 0
146
+ },
147
+ {
148
+ "id": "s1774709178740",
149
+ "type": "rounded",
150
+ "x": 469,
151
+ "y": 158,
152
+ "w": 124,
153
+ "h": 30,
154
+ "text": "",
155
+ "color": "t-violet"
156
+ },
157
+ {
158
+ "id": "s1774709199435",
159
+ "type": "rounded",
160
+ "x": 467,
161
+ "y": 170,
162
+ "w": 124,
163
+ "h": 30,
164
+ "text": "",
165
+ "color": "t-teal",
166
+ "rotation": 15
167
+ },
168
+ {
169
+ "id": "s1774709200449",
170
+ "type": "rounded",
171
+ "x": 463,
172
+ "y": 182,
173
+ "w": 124,
174
+ "h": 30,
175
+ "text": "",
176
+ "color": "t-rose",
177
+ "rotation": 30
178
+ },
179
+ {
180
+ "id": "s1774709200885",
181
+ "type": "rounded",
182
+ "x": 455,
183
+ "y": 192,
184
+ "w": 124,
185
+ "h": 30,
186
+ "text": "",
187
+ "color": "t-green",
188
+ "rotation": 45
189
+ },
190
+ {
191
+ "id": "s1774709201193",
192
+ "type": "rounded",
193
+ "x": 444,
194
+ "y": 199,
195
+ "w": 124,
196
+ "h": 30,
197
+ "text": "",
198
+ "color": "t-amber",
199
+ "rotation": 60
200
+ },
201
+ {
202
+ "id": "s1774709261715",
203
+ "type": "rounded",
204
+ "x": 433,
205
+ "y": 203,
206
+ "w": 124,
207
+ "h": 30,
208
+ "text": "",
209
+ "color": "t-violet",
210
+ "rotation": 75
211
+ },
212
+ {
213
+ "id": "s1774709268554",
214
+ "type": "rounded",
215
+ "x": 420,
216
+ "y": 205,
217
+ "w": 124,
218
+ "h": 30,
219
+ "text": "",
220
+ "color": "t-sky",
221
+ "rotation": 90
222
+ },
223
+ {
224
+ "id": "s1774709567753",
225
+ "type": "db",
226
+ "x": 917,
227
+ "y": 155,
228
+ "w": 126,
229
+ "h": 99,
230
+ "text": "PostgreSQL",
231
+ "color": "t-rose"
232
+ },
233
+ {
234
+ "id": "s1774709573330",
235
+ "type": "postit",
236
+ "x": 888,
237
+ "y": -46,
238
+ "w": 259,
239
+ "h": 177,
240
+ "text": "(3)\n\nShortcuts are available too, Copy, Paste, Select All, Cut, Undo",
241
+ "color": "t-rose",
242
+ "fontSize": 15,
243
+ "textAlign": "center",
244
+ "textValign": "top",
245
+ "rotation": 0
246
+ },
247
+ {
248
+ "id": "s1774709607100",
249
+ "type": "db",
250
+ "x": 951,
251
+ "y": 182,
252
+ "w": 126,
253
+ "h": 99,
254
+ "text": "PostgreSQL",
255
+ "color": "t-rose"
256
+ },
257
+ {
258
+ "id": "s1774709607767",
259
+ "type": "db",
260
+ "x": 993,
261
+ "y": 208,
262
+ "w": 126,
263
+ "h": 99,
264
+ "text": "PostgreSQL",
265
+ "color": "t-rose"
266
+ },
267
+ {
268
+ "id": "s1774709608057",
269
+ "type": "db",
270
+ "x": 972,
271
+ "y": 237,
272
+ "w": 126,
273
+ "h": 99,
274
+ "text": "PostgreSQL",
275
+ "color": "t-rose"
276
+ },
277
+ {
278
+ "id": "s1774709608333",
279
+ "type": "db",
280
+ "x": 1030,
281
+ "y": 268,
282
+ "w": 126,
283
+ "h": 99,
284
+ "text": "PostgreSQL",
285
+ "color": "t-rose"
286
+ },
287
+ {
288
+ "id": "s1774709818358",
289
+ "type": "image",
290
+ "x": 391,
291
+ "y": 82,
292
+ "w": 520,
293
+ "h": 45,
294
+ "text": "",
295
+ "color": "",
296
+ "src": "images/img_1774709818351.png"
297
+ },
298
+ {
299
+ "id": "s1774709912731",
300
+ "type": "rounded",
301
+ "x": 270,
302
+ "y": 79,
303
+ "w": 60,
304
+ "h": 30,
305
+ "text": "",
306
+ "color": "t-sky"
307
+ },
308
+ {
309
+ "id": "s1774709989594",
310
+ "type": "postit",
311
+ "x": 191,
312
+ "y": -48,
313
+ "w": 232,
314
+ "h": 179,
315
+ "text": "(1)\n\n You can create colored postits or various sizes",
316
+ "color": "t-sky",
317
+ "fontSize": 15,
318
+ "textAlign": "center",
319
+ "textValign": "top",
320
+ "rotation": 0
321
+ },
322
+ {
323
+ "id": "s1774710224063",
324
+ "type": "cloud",
325
+ "x": 705,
326
+ "y": 164,
327
+ "w": 110,
328
+ "h": 65,
329
+ "text": "",
330
+ "color": "t-teal",
331
+ "rotation": 180
332
+ },
333
+ {
334
+ "id": "s1774710175406",
335
+ "type": "cloud",
336
+ "x": 705,
337
+ "y": 162,
338
+ "w": 110,
339
+ "h": 65,
340
+ "text": "",
341
+ "color": "t-teal",
342
+ "rotation": 90
343
+ },
344
+ {
345
+ "id": "s1774710179443",
346
+ "type": "cloud",
347
+ "x": 730,
348
+ "y": 171,
349
+ "w": 60,
350
+ "h": 49,
351
+ "text": "",
352
+ "color": "t-sky",
353
+ "rotation": 90
354
+ },
355
+ {
356
+ "id": "s1774710271247",
357
+ "type": "db",
358
+ "x": 568,
359
+ "y": 303,
360
+ "w": 60,
361
+ "h": 130,
362
+ "text": "",
363
+ "color": "t-sky",
364
+ "rotation": 90
365
+ },
366
+ {
367
+ "id": "s1774710294495",
368
+ "type": "db",
369
+ "x": 393,
370
+ "y": 318,
371
+ "w": 99,
372
+ "h": 102,
373
+ "text": "POSTGRES",
374
+ "color": "t-sky"
375
+ },
376
+ {
377
+ "id": "s1774710311654",
378
+ "type": "table",
379
+ "x": 704,
380
+ "y": 326,
381
+ "w": 225,
382
+ "h": 84,
383
+ "text": "",
384
+ "color": "t-sky",
385
+ "rows": 2,
386
+ "cols": 2,
387
+ "cells": [
388
+ [
389
+ "1",
390
+ "User Created with payload"
391
+ ],
392
+ [
393
+ "2",
394
+ "User 12fd43efd deleted"
395
+ ]
396
+ ],
397
+ "colWidths": [
398
+ 37.500000000000014,
399
+ 187.49999999999994
400
+ ]
401
+ },
402
+ {
403
+ "id": "s1774710402283",
404
+ "type": "text",
405
+ "x": 537,
406
+ "y": 353,
407
+ "w": 110,
408
+ "h": 34,
409
+ "text": "CDC",
410
+ "color": "t-sky",
411
+ "fontSize": 26
412
+ },
413
+ {
414
+ "id": "s1774710416752",
415
+ "type": "text",
416
+ "x": 529,
417
+ "y": 369,
418
+ "w": 140,
419
+ "h": 86,
420
+ "text": "Change Data Capture",
421
+ "color": "t-sky",
422
+ "fontSize": 11
423
+ },
424
+ {
425
+ "id": "s1774710492791",
426
+ "type": "postit",
427
+ "x": 1168,
428
+ "y": -46,
429
+ "w": 232,
430
+ "h": 179,
431
+ "text": "(4)\n\nGolden Feature !!\n\nMake screen captures, paste it in this dashboard, and keep these new PNG's",
432
+ "color": "t-green",
433
+ "fontSize": 15,
434
+ "textAlign": "center",
435
+ "textValign": "top",
436
+ "rotation": 0
437
+ },
438
+ {
439
+ "id": "s1774711067729",
440
+ "type": "db",
441
+ "x": 366,
442
+ "y": 464,
443
+ "w": 79,
444
+ "h": 50,
445
+ "text": "",
446
+ "color": "t-sky",
447
+ "rotation": 90
196
448
  },
197
- ],
198
- arrows: [
199
449
  {
200
- id: "a1",
201
- from: "s1",
202
- to: "s2",
203
- label: "HTTPS",
450
+ "id": "s1774710927712",
451
+ "type": "db",
452
+ "x": 401,
453
+ "y": 464,
454
+ "w": 79,
455
+ "h": 50,
456
+ "text": "",
457
+ "color": "t-sky",
458
+ "rotation": 90
204
459
  },
205
460
  {
206
- id: "a2",
207
- from: "s2",
208
- to: "s3",
209
- label: "",
461
+ "id": "s1774710969368",
462
+ "type": "db",
463
+ "x": 441,
464
+ "y": 469,
465
+ "w": 79,
466
+ "h": 50,
467
+ "text": "",
468
+ "color": "t-sky",
469
+ "rotation": 105
210
470
  },
211
471
  {
212
- id: "a3",
213
- from: "s2",
214
- to: "s4",
215
- label: "",
472
+ "id": "s1774710974365",
473
+ "type": "db",
474
+ "x": 476,
475
+ "y": 483,
476
+ "w": 79,
477
+ "h": 50,
478
+ "text": "",
479
+ "color": "t-sky",
480
+ "rotation": 120
216
481
  },
217
482
  {
218
- id: "a4",
219
- from: "s4",
220
- to: "s5",
221
- label: "SQL",
483
+ "id": "s1774710979009",
484
+ "type": "db",
485
+ "x": 508,
486
+ "y": 507,
487
+ "w": 79,
488
+ "h": 50,
489
+ "text": "",
490
+ "color": "t-sky",
491
+ "rotation": 135
222
492
  },
223
493
  {
224
- id: "a5",
225
- from: "s3",
226
- to: "s6",
227
- label: "",
494
+ "id": "s1774710986271",
495
+ "type": "db",
496
+ "x": 532,
497
+ "y": 538,
498
+ "w": 79,
499
+ "h": 50,
500
+ "text": "",
501
+ "color": "t-sky",
502
+ "rotation": 150
228
503
  },
504
+ {
505
+ "id": "s1774710992058",
506
+ "type": "db",
507
+ "x": 558,
508
+ "y": 570,
509
+ "w": 79,
510
+ "h": 50,
511
+ "text": "",
512
+ "color": "t-sky",
513
+ "rotation": 135
514
+ },
515
+ {
516
+ "id": "s1774710997888",
517
+ "type": "db",
518
+ "x": 591,
519
+ "y": 594,
520
+ "w": 79,
521
+ "h": 50,
522
+ "text": "",
523
+ "color": "t-sky",
524
+ "rotation": 120
525
+ },
526
+ {
527
+ "id": "s1774711003736",
528
+ "type": "db",
529
+ "x": 627,
530
+ "y": 611,
531
+ "w": 79,
532
+ "h": 50,
533
+ "text": "",
534
+ "color": "t-sky",
535
+ "rotation": 105
536
+ },
537
+ {
538
+ "id": "s1774711011422",
539
+ "type": "db",
540
+ "x": 667,
541
+ "y": 617,
542
+ "w": 79,
543
+ "h": 50,
544
+ "text": "",
545
+ "color": "t-sky",
546
+ "rotation": 90
547
+ },
548
+ {
549
+ "id": "s1774711015572",
550
+ "type": "db",
551
+ "x": 706,
552
+ "y": 614,
553
+ "w": 79,
554
+ "h": 50,
555
+ "text": "",
556
+ "color": "t-sky",
557
+ "rotation": 75
558
+ },
559
+ {
560
+ "id": "s1774711020581",
561
+ "type": "db",
562
+ "x": 742,
563
+ "y": 601,
564
+ "w": 79,
565
+ "h": 50,
566
+ "text": "",
567
+ "color": "t-sky",
568
+ "rotation": 60
569
+ },
570
+ {
571
+ "id": "s1774711024888",
572
+ "type": "db",
573
+ "x": 773,
574
+ "y": 577,
575
+ "w": 79,
576
+ "h": 50,
577
+ "text": "",
578
+ "color": "t-sky",
579
+ "rotation": 45
580
+ },
581
+ {
582
+ "id": "s1774711028918",
583
+ "type": "db",
584
+ "x": 798,
585
+ "y": 546,
586
+ "w": 79,
587
+ "h": 50,
588
+ "text": "",
589
+ "color": "t-sky",
590
+ "rotation": 30
591
+ },
592
+ {
593
+ "id": "s1774711038717",
594
+ "type": "db",
595
+ "x": 815,
596
+ "y": 517,
597
+ "w": 79,
598
+ "h": 50,
599
+ "text": "",
600
+ "color": "t-sky",
601
+ "rotation": 30
602
+ },
603
+ {
604
+ "id": "s1774711042955",
605
+ "type": "db",
606
+ "x": 831,
607
+ "y": 481,
608
+ "w": 79,
609
+ "h": 50,
610
+ "text": "",
611
+ "color": "t-sky",
612
+ "rotation": 15
613
+ },
614
+ {
615
+ "id": "s1774711054154",
616
+ "type": "db",
617
+ "x": 837,
618
+ "y": 443,
619
+ "w": 79,
620
+ "h": 50,
621
+ "text": "",
622
+ "color": "t-sky",
623
+ "rotation": 0
624
+ },
625
+ {
626
+ "id": "s1774711114096",
627
+ "type": "image",
628
+ "x": 18,
629
+ "y": 604,
630
+ "w": 152,
631
+ "h": 41,
632
+ "text": "",
633
+ "color": "",
634
+ "src": "images/img_1774711114086.png"
635
+ },
636
+ {
637
+ "id": "s1774711412963",
638
+ "type": "postit",
639
+ "x": 935,
640
+ "y": 461,
641
+ "w": 295,
642
+ "h": 189,
643
+ "text": "(6)\n\nGolden Feature !! Linked Diagrams\n\nOrder you diagrams and follow them using linkable diagram feature by clicking of the linked component",
644
+ "color": "t-violet",
645
+ "fontSize": 15,
646
+ "textAlign": "center",
647
+ "textValign": "top",
648
+ "rotation": 0,
649
+ "linkedDiagramId": "1774711428000"
650
+ },
651
+ {
652
+ "id": "s1774711945358",
653
+ "type": "postit",
654
+ "x": 1241,
655
+ "y": 593,
656
+ "w": 182,
657
+ "h": 151,
658
+ "text": "(7)\n\nGolden Feature !! Tables",
659
+ "color": "t-amber",
660
+ "fontSize": 15,
661
+ "textAlign": "center",
662
+ "textValign": "top",
663
+ "rotation": 0,
664
+ "linkedDiagramId": "1774711967648"
665
+ }
229
666
  ],
230
- },
667
+ "arrows": [
668
+ {
669
+ "id": "a1774709937524",
670
+ "from": "s1774709912731",
671
+ "to": "s1774709932053",
672
+ "label": ""
673
+ },
674
+ {
675
+ "id": "a1774710384896",
676
+ "from": "s1774710294495",
677
+ "to": "s1774710311654",
678
+ "label": ""
679
+ }
680
+ ],
681
+ "children": [
682
+ {
683
+ "id": 1774711428000,
684
+ "titre": "Cycle of Fifths",
685
+ "shapes": [
686
+ {
687
+ "id": "circle-of-fifths-major",
688
+ "type": "table",
689
+ "x": -5,
690
+ "y": -4,
691
+ "w": 551,
692
+ "h": 374,
693
+ "text": "",
694
+ "color": "t-sky",
695
+ "rows": 8,
696
+ "cols": 2,
697
+ "cells": [
698
+ [
699
+ "Flats (♭)",
700
+ "Sharps (♯)"
701
+ ],
702
+ [
703
+ "F Major — 1♭ (Bb)",
704
+ "G Major — 1♯ (F#)"
705
+ ],
706
+ [
707
+ "Bb Major — 2♭ (Bb Eb)",
708
+ "D Major — 2♯ (F# C#)"
709
+ ],
710
+ [
711
+ "Eb Major — 3♭ (Bb Eb Ab)",
712
+ "A Major — 3♯ (F# C# G#)"
713
+ ],
714
+ [
715
+ "Ab Major — 4♭ (Bb Eb Ab Db)",
716
+ "E Major — 4♯ (F# C# G# D#)"
717
+ ],
718
+ [
719
+ "Db Major — 5♭ (Bb Eb Ab Db Gb)",
720
+ "B Major — 5♯ (F# C# G# D# A#)"
721
+ ],
722
+ [
723
+ "Gb Major — 6♭ (Bb Eb Ab Db Gb Cb)",
724
+ "F# Major — 6♯ (F# C# G# D# A# E#)"
725
+ ],
726
+ [
727
+ "Cb Major — 7♭ (Bb Eb Ab Db Gb Cb Fb)",
728
+ "C# Major — 7♯ (F# C# G# D# A# E# B#)"
729
+ ]
730
+ ],
731
+ "colWidths": [
732
+ 165.5,
733
+ 385.5
734
+ ]
735
+ },
736
+ {
737
+ "id": "s1774712063042",
738
+ "type": "rect",
739
+ "x": 605,
740
+ "y": 48,
741
+ "w": 166,
742
+ "h": 75,
743
+ "text": "Version with C Major in the center",
744
+ "color": "t-sky",
745
+ "fontSize": 15,
746
+ "linkedDiagramId": "s1774712105784"
747
+ },
748
+ {
749
+ "id": "s1774712455226",
750
+ "type": "postit",
751
+ "x": 836,
752
+ "y": 33,
753
+ "w": 400,
754
+ "h": 381,
755
+ "text": "The linked diagrams are ordered in the left navigation bar",
756
+ "color": "t-white",
757
+ "fontSize": 17,
758
+ "textValign": "top"
759
+ },
760
+ {
761
+ "id": "s1774712426991",
762
+ "type": "image",
763
+ "x": 877,
764
+ "y": 111,
765
+ "w": 305,
766
+ "h": 295,
767
+ "text": "",
768
+ "color": "",
769
+ "src": "images/img_1774712426980.png"
770
+ }
771
+ ],
772
+ "arrows": [],
773
+ "children": [
774
+ {
775
+ "id": "s1774712105784",
776
+ "titre": "C Major in the center",
777
+ "shapes": [
778
+ {
779
+ "id": "circle-of-fifths-centered",
780
+ "type": "table",
781
+ "x": 25,
782
+ "y": -1,
783
+ "w": 600,
784
+ "h": 360,
785
+ "text": "",
786
+ "color": "t-sky",
787
+ "rows": 8,
788
+ "cols": 3,
789
+ "cells": [
790
+ [
791
+ "Flats (♭)",
792
+ "Center",
793
+ "Sharps (♯)"
794
+ ],
795
+ [
796
+ "F Major — 1♭",
797
+ "C Major — 0",
798
+ "G Major — 1♯"
799
+ ],
800
+ [
801
+ "Bb Major — 2♭",
802
+ "",
803
+ "D Major — 2♯"
804
+ ],
805
+ [
806
+ "Eb Major — 3♭",
807
+ "",
808
+ "A Major — 3♯"
809
+ ],
810
+ [
811
+ "Ab Major — 4♭",
812
+ "",
813
+ "E Major — 4♯"
814
+ ],
815
+ [
816
+ "Db Major — 5♭",
817
+ "",
818
+ "B Major — 5♯"
819
+ ],
820
+ [
821
+ "Gb Major — 6♭",
822
+ "",
823
+ "F# Major — 6♯"
824
+ ],
825
+ [
826
+ "Cb Major — 7♭",
827
+ "",
828
+ "C# Major — 7♯"
829
+ ]
830
+ ],
831
+ "colWidths": [
832
+ 200,
833
+ 200,
834
+ 200
835
+ ]
836
+ }
837
+ ],
838
+ "arrows": [],
839
+ "children": []
840
+ }
841
+ ]
842
+ },
843
+ {
844
+ "id": 1774711967648,
845
+ "titre": "Tables",
846
+ "shapes": [
847
+ {
848
+ "id": "s1774712237028",
849
+ "type": "image",
850
+ "x": 532,
851
+ "y": 208,
852
+ "w": 304,
853
+ "h": 226,
854
+ "text": "",
855
+ "color": "",
856
+ "src": "images/img_1774711575731.png"
857
+ },
858
+ {
859
+ "id": "s1774712582578",
860
+ "type": "postit",
861
+ "x": 492,
862
+ "y": 13,
863
+ "w": 375,
864
+ "h": 191,
865
+ "text": "Tables are resizable\n\nColumns are resizable individually\n\nRows and column can be added using + and -\n\nYou can navigate each cell in edit mode using the TAB key",
866
+ "color": "t-sky",
867
+ "fontSize": 15,
868
+ "textAlign": "left",
869
+ "textValign": "top",
870
+ "rotation": 0
871
+ }
872
+ ],
873
+ "arrows": [],
874
+ "children": []
875
+ }
876
+ ]
877
+ }
231
878
  ];