@cuemath/leap 2.8.49-rj-16 → 2.8.50-as1

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 (85) hide show
  1. package/dist/assets/line-icons/icons/clear-all.js +53 -0
  2. package/dist/assets/line-icons/icons/clear-all.js.map +1 -0
  3. package/dist/assets/line-icons/icons/download.js +48 -0
  4. package/dist/assets/line-icons/icons/download.js.map +1 -0
  5. package/dist/assets/line-icons/icons/equation.js +48 -0
  6. package/dist/assets/line-icons/icons/equation.js.map +1 -0
  7. package/dist/assets/line-icons/icons/grid-icon.js +42 -0
  8. package/dist/assets/line-icons/icons/grid-icon.js.map +1 -0
  9. package/dist/assets/line-icons/icons/pan.js +98 -0
  10. package/dist/assets/line-icons/icons/pan.js.map +1 -0
  11. package/dist/assets/line-icons/icons/square-checked-grid.js +25 -0
  12. package/dist/assets/line-icons/icons/square-checked-grid.js.map +1 -0
  13. package/dist/assets/line-icons/icons/square-dots.js +32 -0
  14. package/dist/assets/line-icons/icons/square-dots.js.map +1 -0
  15. package/dist/assets/line-icons/icons/square-grid.js +17 -0
  16. package/dist/assets/line-icons/icons/square-grid.js.map +1 -0
  17. package/dist/assets/line-icons/icons/square2-grid.js +13 -0
  18. package/dist/assets/line-icons/icons/square2-grid.js.map +1 -0
  19. package/dist/assets/line-icons/icons/text-icon.js +48 -0
  20. package/dist/assets/line-icons/icons/text-icon.js.map +1 -0
  21. package/dist/assets/line-icons/icons/tri-dots.js +27 -0
  22. package/dist/assets/line-icons/icons/tri-dots.js.map +1 -0
  23. package/dist/assets/line-icons/icons/tri-grid.js +27 -0
  24. package/dist/assets/line-icons/icons/tri-grid.js.map +1 -0
  25. package/dist/assets/line-icons/icons/tri2-dots.js +27 -0
  26. package/dist/assets/line-icons/icons/tri2-dots.js.map +1 -0
  27. package/dist/assets/line-icons/icons/tri2-grid.js +27 -0
  28. package/dist/assets/line-icons/icons/tri2-grid.js.map +1 -0
  29. package/dist/assets/line-icons/icons/upload.js +48 -0
  30. package/dist/assets/line-icons/icons/upload.js.map +1 -0
  31. package/dist/assets/line-icons/icons/zoom-in.js +58 -0
  32. package/dist/assets/line-icons/icons/zoom-in.js.map +1 -0
  33. package/dist/assets/line-icons/icons/zoom-out.js +48 -0
  34. package/dist/assets/line-icons/icons/zoom-out.js.map +1 -0
  35. package/dist/features/circle-games/game-launcher/api/get-content-for-today/get-circle-home-api.js +3 -4
  36. package/dist/features/circle-games/game-launcher/api/get-content-for-today/get-circle-home-api.js.map +1 -1
  37. package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js +26 -39
  38. package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js.map +1 -1
  39. package/dist/features/circle-games/game-launcher/dal/use-post-update-circle-journey-dal/use-post-update-circle-journey-dal.js +11 -11
  40. package/dist/features/circle-games/game-launcher/dal/use-post-update-circle-journey-dal/use-post-update-circle-journey-dal.js.map +1 -1
  41. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js +9 -10
  42. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js.map +1 -1
  43. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +126 -131
  44. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -1
  45. package/dist/features/cue-canvas/cue-canvas-core.js +169 -59
  46. package/dist/features/cue-canvas/cue-canvas-core.js.map +1 -1
  47. package/dist/features/cue-canvas/cue-canvas-helpers.js +91 -29
  48. package/dist/features/cue-canvas/cue-canvas-helpers.js.map +1 -1
  49. package/dist/features/cue-canvas/cue-canvas.js +57 -49
  50. package/dist/features/cue-canvas/cue-canvas.js.map +1 -1
  51. package/dist/features/cue-canvas/cue-cavas-styled.js +96 -59
  52. package/dist/features/cue-canvas/cue-cavas-styled.js.map +1 -1
  53. package/dist/features/cue-canvas/hooks/use-tool-state.js +34 -0
  54. package/dist/features/cue-canvas/hooks/use-tool-state.js.map +1 -0
  55. package/dist/features/cue-canvas/toolbar/color-pallete.js +21 -21
  56. package/dist/features/cue-canvas/toolbar/color-pallete.js.map +1 -1
  57. package/dist/features/cue-canvas/toolbar/color-picker-button.js +62 -0
  58. package/dist/features/cue-canvas/toolbar/color-picker-button.js.map +1 -0
  59. package/dist/features/cue-canvas/toolbar/grid-menu.js +57 -0
  60. package/dist/features/cue-canvas/toolbar/grid-menu.js.map +1 -0
  61. package/dist/features/cue-canvas/toolbar/icon-map.js +58 -0
  62. package/dist/features/cue-canvas/toolbar/icon-map.js.map +1 -0
  63. package/dist/features/cue-canvas/toolbar/pen-tool-menu.js +65 -0
  64. package/dist/features/cue-canvas/toolbar/pen-tool-menu.js.map +1 -0
  65. package/dist/features/cue-canvas/toolbar/tool-buttons.js +21 -0
  66. package/dist/features/cue-canvas/toolbar/tool-buttons.js.map +1 -0
  67. package/dist/features/cue-canvas/toolbar/toolbar.js +28 -85
  68. package/dist/features/cue-canvas/toolbar/toolbar.js.map +1 -1
  69. package/dist/features/cue-canvas/toolbar/whiteboard-toolbar.js +25 -0
  70. package/dist/features/cue-canvas/toolbar/whiteboard-toolbar.js.map +1 -0
  71. package/dist/features/trial-session/comps/session-report/session-report.js +41 -41
  72. package/dist/features/trial-session/comps/session-report/session-report.js.map +1 -1
  73. package/dist/features/worksheet/worksheet/worksheet-action-bar/worksheet-action-bar.js +7 -7
  74. package/dist/features/worksheet/worksheet/worksheet-action-bar/worksheet-action-bar.js.map +1 -1
  75. package/dist/index.d.ts +17 -6
  76. package/dist/static/fonts/Athletics-Black.woff +0 -0
  77. package/dist/static/fonts/Athletics-Bold.woff +0 -0
  78. package/dist/static/fonts/Athletics-Light.woff +0 -0
  79. package/dist/static/fonts/Athletics-Medium.woff +0 -0
  80. package/dist/static/fonts/Athletics-Regular.woff +0 -0
  81. package/dist/static/fonts/untitled-sans-medium.woff +0 -0
  82. package/dist/static/fonts/untitled-sans-medium.woff2 +0 -0
  83. package/dist/static/fonts/untitled-sans-regular.woff +0 -0
  84. package/dist/static/fonts/untitled-sans-regular.woff2 +0 -0
  85. package/package.json +2 -2
@@ -1,68 +1,181 @@
1
- var c = Object.defineProperty;
2
- var d = (o, t, s) => t in o ? c(o, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : o[t] = s;
3
- var e = (o, t, s) => d(o, typeof t != "symbol" ? t + "" : t, s);
4
- import { removeMask as p, getReverseMap as u, getToolAndSubtool as l } from "./cue-canvas-helpers.js";
5
- class y {
6
- constructor(t, s, i, a, h, n, r) {
7
- e(this, "polycanvas");
8
- e(this, "publish");
9
- e(this, "height");
10
- e(this, "onUpdateHeight");
11
- e(this, "userId");
12
- e(this, "responseId");
13
- e(this, "userType");
14
- e(this, "resetViewPort", () => {
15
- this.polycanvas && this.polycanvas.resetViewport();
16
- });
17
- e(this, "onChange", (t) => {
18
- const i = Object.fromEntries(t.entries());
1
+ var l = Object.defineProperty;
2
+ var u = (r, e, t) => e in r ? l(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
3
+ var i = (r, e, t) => u(r, typeof e != "symbol" ? e + "" : e, t);
4
+ import f from "../../node_modules/lodash.debounce/index.js";
5
+ import { removeMask as g, checkTextOrEquationTool as v, getReverseMap as y, getToolAndSubtool as m } from "./cue-canvas-helpers.js";
6
+ class I {
7
+ constructor(e, t, s, o, a, n, d, h, p, c) {
8
+ i(this, "polycanvas");
9
+ i(this, "publish");
10
+ i(this, "height");
11
+ i(this, "onUpdateActiveTool");
12
+ i(this, "onUpdateHeight");
13
+ i(this, "userId");
14
+ i(this, "responseId");
15
+ i(this, "userType");
16
+ i(this, "renderAs");
17
+ i(this, "fileInput", null);
18
+ i(this, "debouncedViewportChange");
19
+ i(this, "uploadImageToS3");
20
+ i(this, "publishToChannel", (e, t, s) => {
19
21
  this.publish && this.publish({
20
22
  eventName: "cue_canvas_changed",
21
23
  eventPayload: {
22
- data: i,
24
+ data: e,
23
25
  height: this.height,
24
26
  userId: this.userId,
25
- responseId: this.responseId
27
+ responseId: this.responseId,
28
+ gridName: t,
29
+ dimension: s
26
30
  }
27
31
  });
28
32
  });
29
- e(this, "undo", () => {
33
+ i(this, "onChange", (e) => {
34
+ const s = Object.fromEntries(e.entries());
35
+ v(s), this.publishToChannel(s);
36
+ });
37
+ i(this, "undo", () => {
30
38
  if (!this.polycanvas)
31
39
  return;
32
- const t = this.polycanvas.undo();
33
- if (!t)
40
+ const e = this.polycanvas.undo();
41
+ if (!e)
34
42
  return;
35
- const s = u(t);
36
- this.onChange(s);
43
+ const t = y(e);
44
+ this.onChange(t);
37
45
  });
38
- e(this, "redo", () => {
46
+ i(this, "redo", () => {
39
47
  if (!this.polycanvas)
40
48
  return;
41
- const t = this.polycanvas.redo();
42
- t && this.onChange(t);
49
+ const e = this.polycanvas.redo();
50
+ e && this.onChange(e);
51
+ });
52
+ i(this, "clearCanvas", () => {
53
+ this.polycanvas && this.polycanvas.clear();
54
+ });
55
+ i(this, "zoomIn", () => {
56
+ if (!this.polycanvas) return;
57
+ const e = this.polycanvas.getViewport();
58
+ this.polycanvas.setViewport(e.x, e.y, e.zoom * 1.1);
59
+ });
60
+ i(this, "zoomOut", () => {
61
+ if (!this.polycanvas) return;
62
+ const e = this.polycanvas.getViewport();
63
+ this.polycanvas.setViewport(e.x, e.y, e.zoom * 0.9);
64
+ });
65
+ i(this, "downloadCanvasAsImage", async () => {
66
+ if (!this.polycanvas) return;
67
+ const e = await this.polycanvas.image(3e3, 3e3, "png");
68
+ if (!e) return;
69
+ const t = document.createElement("a");
70
+ t.href = e, t.download = `canvas-drawing-${Date.now()}.png`, t.click();
71
+ });
72
+ i(this, "uploadFileToCanvas", async (e) => new Promise((t, s) => {
73
+ this.uploadImageToS3 ? t(this.uploadImageToS3(e)) : s(new Error("Upload function not provided"));
74
+ }));
75
+ i(this, "onViewPortChange", (e) => {
76
+ if (!this.publish) return;
77
+ const t = e;
78
+ this.publishToChannel({}, void 0, t);
79
+ });
80
+ i(this, "openFileUpload", () => {
81
+ this.fileInput || (this.fileInput = document.createElement("input"), this.fileInput.type = "file", this.fileInput.accept = "image/*", this.fileInput.style.display = "none", this.fileInput.onchange = this.addImageToCanvas, document.body.appendChild(this.fileInput)), this.fileInput.click();
82
+ });
83
+ i(this, "addImageToCanvas", async (e) => {
84
+ var h;
85
+ const t = e.target, s = (h = t.files) == null ? void 0 : h[0];
86
+ if (!s || !this.polycanvas || !this.uploadImageToS3) return;
87
+ const o = await this.uploadImageToS3(s), a = this.polycanvas.getViewport(), n = {
88
+ name: "image",
89
+ href: o,
90
+ x: a.x + 88,
91
+ y: a.y + 88
92
+ }, d = this.polycanvas.add({
93
+ ...n
94
+ });
95
+ this.publishToChannel({
96
+ [d]: [void 0, { ...n, status: "locked" }]
97
+ }), t.value = "";
98
+ });
99
+ i(this, "handleBatchUpdate", (e) => {
100
+ if (this.renderAs === "whiteboard") {
101
+ e.forEach((s) => this.handleWhiteboardUpdate(s));
102
+ return;
103
+ }
104
+ const t = e.map((s) => s.height).filter(Boolean);
105
+ if (t.length > 0) {
106
+ const s = Math.max(...t);
107
+ s > this.height && this.updateHeight(s);
108
+ }
109
+ e.forEach((s) => this.updateCanvas(s));
110
+ });
111
+ i(this, "handleSingleUpdate", (e) => {
112
+ if (this.renderAs === "whiteboard") {
113
+ this.handleWhiteboardUpdate(e);
114
+ return;
115
+ }
116
+ e.height > this.height && this.updateHeight(e.height), this.updateCanvas(e);
43
117
  });
44
- e(this, "setTool", (t) => {
118
+ i(this, "handleWhiteboardUpdate", (e) => {
45
119
  if (this.polycanvas) {
46
- const [s, i] = l(t);
47
- switch (s) {
120
+ if (e.dimension) {
121
+ const t = e.dimension;
122
+ this.polycanvas.setViewport(t.x, t.y, t.zoom);
123
+ }
124
+ e.gridName && this.polycanvas.setOptions({
125
+ grid: e.gridName
126
+ }), this.updateCanvas(e);
127
+ }
128
+ });
129
+ i(this, "updateCanvas", ({ data: e, userId: t }) => {
130
+ const s = this.userType === "TEACHER" || t === this.userId;
131
+ Object.entries(e).forEach(([o, a]) => {
132
+ var n, d, h;
133
+ !a[0] && a[1] ? (n = this.polycanvas) == null || n.add({ ...a[1], cannotEdit: !s }, o) : a[0] && !a[1] ? (d = this.polycanvas) == null || d.delete(o) : a[0] && a[1] && ((h = this.polycanvas) == null || h.update(o, { ...a[1] }));
134
+ });
135
+ });
136
+ i(this, "resetViewPort", () => {
137
+ this.polycanvas && this.polycanvas.resetViewport();
138
+ });
139
+ i(this, "changeGrid", (e) => {
140
+ this.polycanvas && (this.polycanvas.setOptions({
141
+ grid: e
142
+ }), this.publishToChannel({}, e));
143
+ });
144
+ i(this, "setTool", (e) => {
145
+ if (this.polycanvas) {
146
+ const [t, s] = m(e);
147
+ switch (t) {
148
+ case "clearAll":
149
+ this.clearCanvas();
150
+ break;
151
+ case "home":
152
+ this.resetViewPort();
153
+ break;
48
154
  case "undo":
49
155
  this.undo();
50
156
  break;
51
157
  case "redo":
52
158
  this.redo();
53
159
  break;
160
+ case "zoomIn":
161
+ this.zoomIn();
162
+ break;
163
+ case "zoomOut":
164
+ this.zoomOut();
165
+ break;
166
+ case "upload":
167
+ this.openFileUpload();
168
+ break;
169
+ case "download":
170
+ this.downloadCanvasAsImage();
171
+ break;
172
+ case "grid":
173
+ break;
54
174
  default:
55
- this.polycanvas.setTool(s, i);
175
+ this.polycanvas.setTool(t, s);
56
176
  }
57
177
  }
58
178
  });
59
- e(this, "updateCanvas", ({ data: t, userId: s }) => {
60
- const i = this.userType === "TEACHER" || s === this.userId;
61
- Object.entries(t).forEach(([a, h]) => {
62
- var n, r;
63
- !h[0] && h[1] ? (n = this.polycanvas) == null || n.add({ ...h[1], cannotEdit: !i }, a) : h[0] && !h[1] && ((r = this.polycanvas) == null || r.delete(a));
64
- });
65
- });
66
179
  /**
67
180
  * The `update` method is called in two cases:
68
181
  * 1. When receiving initial data to update the canvas content.
@@ -75,36 +188,33 @@ class y {
75
188
  *
76
189
  * Additionally, if the payload contains a height greater than the current height of the canvas, the `updateHeight` method is called to update the canvas height.
77
190
  */
78
- e(this, "update", (t) => {
79
- if (Array.isArray(t)) {
80
- const s = t.map((a) => a.height), i = Math.max(...s);
81
- i > this.height && this.updateHeight(i), t.forEach((a) => this.updateCanvas(a));
82
- } else
83
- t.height > this.height && this.updateHeight(t.height), this.updateCanvas(t);
191
+ i(this, "update", (e) => {
192
+ Array.isArray(e) ? this.handleBatchUpdate(e) : this.handleSingleUpdate(e);
84
193
  });
85
- e(this, "setColor", (t) => {
86
- this.polycanvas && this.polycanvas.setColor(t);
194
+ i(this, "setColor", (e) => {
195
+ this.polycanvas && this.polycanvas.setColor(e);
87
196
  });
88
- e(this, "updateHeight", (t) => {
89
- this.height = t, this.onUpdateHeight(t);
197
+ i(this, "updateHeight", (e) => {
198
+ this.height = e, this.onUpdateHeight(e);
90
199
  });
91
- e(this, "destroy", () => {
92
- this.polycanvas && (this.polycanvas.off("change", this.onChange), this.polycanvas.destroy(), this.polycanvas = void 0);
200
+ i(this, "destroy", () => {
201
+ this.polycanvas && (this.polycanvas.off("change", this.onChange), this.polycanvas.destroy(), this.debouncedViewportChange.cancel(), this.renderAs === "whiteboard" && this.userType === "TEACHER" && this.polycanvas.off("viewport", this.debouncedViewportChange), this.polycanvas = void 0, this.fileInput && this.fileInput.parentNode && (this.fileInput.parentNode.removeChild(this.fileInput), this.fileInput = null));
93
202
  });
94
- this.onUpdateHeight = i, this.height = a, this.userId = h, this.responseId = n, this.publish = t, this.userType = r, s(this.responseId, this.update);
203
+ this.onUpdateHeight = o, this.onUpdateActiveTool = s, this.height = n, this.uploadImageToS3 = a, this.userId = d, this.responseId = h, this.publish = e, this.userType = p, this.renderAs = c, this.debouncedViewportChange = f(this.onViewPortChange, 300), t(this.responseId, this.update);
95
204
  }
96
- async create({ canvasElementRef: t, canvasConfig: s, canvasSetting: i, initialData: a }) {
97
- if (!t.current)
205
+ async create({ canvasElementRef: e, canvasConfig: t, canvasSetting: s, initialData: o }) {
206
+ if (!e.current)
98
207
  throw new Error("PolyCanvas: Div Element Not found for canvas");
99
- this.polycanvas = await window.Polypad.create(t.current, {
208
+ this.polycanvas = await window.Polypad.create(e.current, {
100
209
  initial: {
101
- options: s
210
+ options: t
102
211
  },
103
- ...i
104
- }), p(t), this.polycanvas.on("change", this.onChange), a && this.update(a);
212
+ ...s,
213
+ imageUpload: this.renderAs === "whiteboard" && this.userType === "TEACHER" ? this.uploadFileToCanvas : void 0
214
+ }), this.renderAs === "whiteboard" && this.userType === "TEACHER" && this.polycanvas.on("viewport", this.debouncedViewportChange), g(e), this.polycanvas.on("change", this.onChange), o && this.update(o);
105
215
  }
106
216
  }
107
217
  export {
108
- y as CueCanvasCore
218
+ I as CueCanvasCore
109
219
  };
110
220
  //# sourceMappingURL=cue-canvas-core.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"cue-canvas-core.js","sources":["../../../src/features/cue-canvas/cue-canvas-core.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n IActionData,\n TCueCanvasChangeData,\n TCueCanvasTool,\n TPublish,\n TSubscribe,\n} from './types/cue-canvas';\nimport type { ICreateOptions } from './types/cue-canvas';\nimport type { IPolypad, IPolyPadInstance } from './types/polypad';\n\nimport { getReverseMap, getToolAndSubtool, removeMask } from './cue-canvas-helpers';\n\ndeclare global {\n interface Window {\n Polypad: IPolypad;\n }\n}\nexport class CueCanvasCore {\n private polycanvas: IPolyPadInstance | undefined;\n private publish?: TPublish;\n private height: number;\n private onUpdateHeight: (height: number) => void;\n private userId: string;\n private responseId: string;\n private userType: TUserTypes;\n\n constructor(\n onPublish: TPublish,\n onSubscribe: TSubscribe,\n onUpdateHeight: (height: number) => void,\n height: number,\n userId: string,\n responseId: string,\n userType: TUserTypes,\n ) {\n this.onUpdateHeight = onUpdateHeight;\n this.height = height;\n this.userId = userId;\n this.responseId = responseId;\n this.publish = onPublish;\n this.userType = userType;\n onSubscribe(this.responseId, this.update);\n }\n\n async create({ canvasElementRef, canvasConfig, canvasSetting, initialData }: ICreateOptions) {\n if (!canvasElementRef.current) {\n throw new Error('PolyCanvas: Div Element Not found for canvas');\n }\n this.polycanvas = await window.Polypad.create(canvasElementRef.current, {\n initial: {\n options: canvasConfig,\n },\n ...canvasSetting,\n });\n\n removeMask(canvasElementRef);\n this.polycanvas.on('change', this.onChange);\n if (initialData) {\n this.update(initialData);\n }\n }\n\n resetViewPort = () => {\n if (this.polycanvas) {\n this.polycanvas.resetViewport();\n }\n };\n\n onChange = (e: unknown) => {\n const data = e as TCueCanvasChangeData;\n const payload = Object.fromEntries(data.entries());\n\n if (this.publish) {\n this.publish({\n eventName: 'cue_canvas_changed',\n eventPayload: {\n data: payload,\n height: this.height,\n userId: this.userId,\n responseId: this.responseId,\n },\n });\n }\n };\n\n undo = () => {\n if (!this.polycanvas) {\n return;\n }\n\n const data = this.polycanvas.undo() as TCueCanvasChangeData;\n\n if (!data) {\n return;\n }\n\n const undoData = getReverseMap(data);\n\n this.onChange(undoData);\n };\n\n redo = () => {\n if (!this.polycanvas) {\n return;\n }\n\n const data = this.polycanvas.redo() as TCueCanvasChangeData;\n\n if (!data) {\n return;\n }\n\n this.onChange(data);\n };\n\n setTool = (tool: TCueCanvasTool) => {\n if (this.polycanvas) {\n const [currTool, currSubTool] = getToolAndSubtool(tool);\n\n switch (currTool) {\n case 'undo':\n this.undo();\n break;\n case 'redo':\n this.redo();\n break;\n default:\n this.polycanvas.setTool(currTool, currSubTool);\n }\n }\n };\n\n updateCanvas = ({ data, userId }: IActionData) => {\n const canEditStroke = this.userType === 'TEACHER' || userId === this.userId;\n\n Object.entries(data).forEach(([key, value]) => {\n if (!value[0] && value[1]) {\n this.polycanvas?.add({ ...value[1], cannotEdit: !canEditStroke }, key);\n } else if (value[0] && !value[1]) {\n this.polycanvas?.delete(key);\n } else {\n // This is the case for tile edit (rotate, flip, slice etc)\n // this.polycanvas?.update(key, { ...value[1] });\n }\n });\n };\n /**\n * The `update` method is called in two cases:\n * 1. When receiving initial data to update the canvas content.\n * 2. When receiving strokes from other peers to update the canvas content.\n * Each item can contain multiple actions, which are applied to the canvas.\n *\n * The method checks if the payload is an array or a single object.\n * If it's an array, it iterates over each item and updates the canvas accordingly.\n * If it's a single object, it directly updates the canvas.\n *\n * Additionally, if the payload contains a height greater than the current height of the canvas, the `updateHeight` method is called to update the canvas height.\n */\n update = (payload: IActionData | IActionData[]) => {\n if (Array.isArray(payload)) {\n const heights = payload.map(data => data.height);\n const maxHeight = Math.max(...heights);\n\n if (maxHeight > this.height) {\n this.updateHeight(maxHeight);\n }\n payload.forEach(item => this.updateCanvas(item));\n } else {\n if (payload.height > this.height) {\n this.updateHeight(payload.height);\n }\n this.updateCanvas(payload);\n }\n };\n\n setColor = (color: string) => {\n if (this.polycanvas) {\n this.polycanvas.setColor(color);\n }\n };\n\n updateHeight = (height: number) => {\n this.height = height;\n this.onUpdateHeight(height);\n };\n\n destroy = () => {\n if (this.polycanvas) {\n this.polycanvas.off('change', this.onChange);\n this.polycanvas.destroy();\n this.polycanvas = undefined;\n }\n };\n}\n"],"names":["CueCanvasCore","onPublish","onSubscribe","onUpdateHeight","height","userId","responseId","userType","__publicField","e","payload","data","undoData","getReverseMap","tool","currTool","currSubTool","getToolAndSubtool","canEditStroke","key","value","_a","_b","heights","maxHeight","item","color","canvasElementRef","canvasConfig","canvasSetting","initialData","removeMask"],"mappings":"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"}
1
+ {"version":3,"file":"cue-canvas-core.js","sources":["../../../src/features/cue-canvas/cue-canvas-core.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n IActionData,\n IViewport,\n TCueCanvasChangeData,\n TCueCanvasGridName,\n TCueCanvasTool,\n TPublish,\n TRenderAs,\n TSubscribe,\n TCueCanvasChangeDataObject,\n} from './types/cue-canvas';\nimport type { ICreateOptions } from './types/cue-canvas';\nimport type { IPolypad, IPolyPadInstance } from './types/polypad';\n\nimport debounce from 'lodash.debounce';\n\nimport {\n checkTextOrEquationTool,\n getReverseMap,\n getToolAndSubtool,\n removeMask,\n} from './cue-canvas-helpers';\n\ndeclare global {\n interface Window {\n Polypad: IPolypad;\n }\n}\n\n/**\n * The CueCanvasCore class manages the canvas state and tool synchronization.\n * When text or equations are added, Polypad automatically switches to 'move' tool.\n * onUpdateActiveTool ensures the UI reflects this automatic tool change.\n */\n\nexport class CueCanvasCore {\n private polycanvas: IPolyPadInstance | undefined;\n private publish?: TPublish;\n private height: number;\n private onUpdateActiveTool: (tool: TCueCanvasTool) => void;\n private onUpdateHeight: (height: number) => void;\n private userId: string;\n private responseId: string;\n private userType: TUserTypes;\n private renderAs: TRenderAs;\n private fileInput: HTMLInputElement | null = null;\n private debouncedViewportChange: ReturnType<typeof debounce>;\n private uploadImageToS3?: (file: File) => string;\n\n constructor(\n onPublish: TPublish,\n onSubscribe: TSubscribe,\n onUpdateActiveTool: (tool: TCueCanvasTool) => void,\n onUpdateHeight: (height: number) => void,\n uploadImageToS3: (file: File) => string,\n height: number,\n userId: string,\n responseId: string,\n userType: TUserTypes,\n renderAs: TRenderAs,\n ) {\n this.onUpdateHeight = onUpdateHeight;\n this.onUpdateActiveTool = onUpdateActiveTool;\n this.height = height;\n this.uploadImageToS3 = uploadImageToS3;\n this.userId = userId;\n this.responseId = responseId;\n this.publish = onPublish;\n this.userType = userType;\n this.renderAs = renderAs;\n this.debouncedViewportChange = debounce(this.onViewPortChange, 300);\n onSubscribe(this.responseId, this.update);\n }\n\n async create({ canvasElementRef, canvasConfig, canvasSetting, initialData }: ICreateOptions) {\n if (!canvasElementRef.current) {\n throw new Error('PolyCanvas: Div Element Not found for canvas');\n }\n this.polycanvas = await window.Polypad.create(canvasElementRef.current, {\n initial: {\n options: canvasConfig,\n },\n ...canvasSetting,\n imageUpload:\n this.renderAs === 'whiteboard' && this.userType === 'TEACHER'\n ? this.uploadFileToCanvas\n : undefined,\n });\n\n if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n this.polycanvas.on('viewport', this.debouncedViewportChange);\n }\n\n removeMask(canvasElementRef);\n this.polycanvas.on('change', this.onChange);\n if (initialData) {\n this.update(initialData);\n }\n }\n\n private publishToChannel = (\n payload: TCueCanvasChangeDataObject,\n gridName?: TCueCanvasGridName,\n dimension?: IViewport,\n ) => {\n if (!this.publish) return;\n\n this.publish({\n eventName: 'cue_canvas_changed',\n eventPayload: {\n data: payload,\n height: this.height,\n userId: this.userId,\n responseId: this.responseId,\n gridName,\n dimension,\n },\n });\n };\n\n private onChange = (e: unknown) => {\n const data = e as TCueCanvasChangeData;\n const payload = Object.fromEntries(data.entries());\n\n if (checkTextOrEquationTool(payload)) {\n this.onUpdateActiveTool('move');\n }\n\n this.publishToChannel(payload);\n };\n\n private undo = () => {\n if (!this.polycanvas) {\n return;\n }\n\n const data = this.polycanvas.undo() as TCueCanvasChangeData;\n\n if (!data) {\n return;\n }\n\n const undoData = getReverseMap(data);\n\n this.onChange(undoData);\n };\n\n private redo = () => {\n if (!this.polycanvas) {\n return;\n }\n\n const data = this.polycanvas.redo() as TCueCanvasChangeData;\n\n if (!data) {\n return;\n }\n\n this.onChange(data);\n };\n\n private clearCanvas = () => {\n if (this.polycanvas) {\n this.polycanvas.clear();\n }\n };\n\n private zoomIn = () => {\n if (!this.polycanvas) return;\n\n const viewPort = this.polycanvas.getViewport();\n\n this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 1.1);\n };\n\n private zoomOut = () => {\n if (!this.polycanvas) return;\n\n const viewPort = this.polycanvas.getViewport();\n\n this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 0.9);\n };\n\n private downloadCanvasAsImage = async () => {\n if (!this.polycanvas) return;\n\n const image = await this.polycanvas.image(3000, 3000, 'png');\n\n if (!image) return;\n\n const downloadLink = document.createElement('a');\n\n downloadLink.href = image;\n downloadLink.download = `canvas-drawing-${Date.now()}.png`;\n downloadLink.click();\n };\n\n private uploadFileToCanvas = async (file: File): Promise<string> => {\n return new Promise((resolve, reject) => {\n this.uploadImageToS3\n ? resolve(this.uploadImageToS3(file))\n : reject(new Error('Upload function not provided'));\n });\n };\n\n private onViewPortChange = (e: IViewport): void => {\n if (!this.publish) return;\n\n const data = e as IViewport;\n\n this.publishToChannel({}, undefined, data);\n };\n\n private openFileUpload = (): void => {\n if (!this.fileInput) {\n this.fileInput = document.createElement('input');\n this.fileInput.type = 'file';\n this.fileInput.accept = 'image/*';\n this.fileInput.style.display = 'none';\n this.fileInput.onchange = this.addImageToCanvas;\n document.body.appendChild(this.fileInput);\n }\n\n this.fileInput.click();\n };\n\n private addImageToCanvas = async (event: Event): Promise<void> => {\n const target = event.target as HTMLInputElement;\n const file = target.files?.[0];\n\n if (!file || !this.polycanvas || !this.uploadImageToS3) return;\n\n const imageBase64 = await this.uploadImageToS3(file);\n const viewPort = this.polycanvas.getViewport();\n const imgJson = {\n name: 'image',\n href: imageBase64,\n x: viewPort.x + 88,\n y: viewPort.y + 88,\n };\n\n const key = this.polycanvas.add({\n ...imgJson,\n });\n\n this.publishToChannel({\n [key]: [undefined, { ...imgJson, status: 'locked' }],\n });\n\n target.value = '';\n };\n\n private handleBatchUpdate = (payloads: IActionData[]) => {\n if (this.renderAs === 'whiteboard') {\n payloads.forEach(item => this.handleWhiteboardUpdate(item));\n\n return;\n }\n\n const heights = payloads.map(data => data.height).filter(Boolean);\n\n if (heights.length > 0) {\n const maxHeight = Math.max(...heights);\n\n if (maxHeight > this.height) {\n this.updateHeight(maxHeight);\n }\n }\n\n payloads.forEach(item => this.updateCanvas(item));\n };\n\n private handleSingleUpdate = (payload: IActionData) => {\n if (this.renderAs === 'whiteboard') {\n this.handleWhiteboardUpdate(payload);\n\n return;\n }\n\n if (payload.height > this.height) {\n this.updateHeight(payload.height);\n }\n\n this.updateCanvas(payload);\n };\n\n private handleWhiteboardUpdate = (payload: IActionData) => {\n if (!this.polycanvas) return;\n\n if (payload.dimension) {\n const dimension = payload.dimension as IViewport;\n\n this.polycanvas.setViewport(dimension.x, dimension.y, dimension.zoom);\n }\n\n if (payload.gridName) {\n this.polycanvas.setOptions({\n grid: payload.gridName,\n });\n }\n\n this.updateCanvas(payload);\n };\n\n private updateCanvas = ({ data, userId }: IActionData) => {\n const canEditStroke = this.userType === 'TEACHER' || userId === this.userId;\n\n Object.entries(data).forEach(([key, value]) => {\n if (!value[0] && value[1]) {\n this.polycanvas?.add({ ...value[1], cannotEdit: !canEditStroke }, key);\n } else if (value[0] && !value[1]) {\n this.polycanvas?.delete(key);\n } else if (value[0] && value[1]) {\n this.polycanvas?.update(key, { ...value[1] });\n }\n });\n };\n\n resetViewPort = () => {\n if (this.polycanvas) {\n this.polycanvas.resetViewport();\n }\n };\n\n changeGrid = (gridName: TCueCanvasGridName) => {\n if (!this.polycanvas) return;\n\n this.polycanvas.setOptions({\n grid: gridName,\n });\n\n this.publishToChannel({}, gridName);\n };\n\n setTool = (tool: TCueCanvasTool) => {\n if (this.polycanvas) {\n const [currTool, currSubTool] = getToolAndSubtool(tool);\n\n switch (currTool) {\n case 'clearAll':\n this.clearCanvas();\n break;\n case 'home':\n this.resetViewPort();\n break;\n case 'undo':\n this.undo();\n break;\n case 'redo':\n this.redo();\n break;\n case 'zoomIn':\n this.zoomIn();\n break;\n case 'zoomOut':\n this.zoomOut();\n break;\n case 'upload':\n this.openFileUpload();\n break;\n case 'download':\n this.downloadCanvasAsImage();\n break;\n case 'grid':\n break;\n default:\n this.polycanvas.setTool(currTool, currSubTool);\n }\n }\n };\n\n /**\n * The `update` method is called in two cases:\n * 1. When receiving initial data to update the canvas content.\n * 2. When receiving strokes from other peers to update the canvas content.\n * Each item can contain multiple actions, which are applied to the canvas.\n *\n * The method checks if the payload is an array or a single object.\n * If it's an array, it iterates over each item and updates the canvas accordingly.\n * If it's a single object, it directly updates the canvas.\n *\n * Additionally, if the payload contains a height greater than the current height of the canvas, the `updateHeight` method is called to update the canvas height.\n */\n update = (payload: IActionData | IActionData[]) => {\n if (Array.isArray(payload)) {\n this.handleBatchUpdate(payload);\n } else {\n this.handleSingleUpdate(payload);\n }\n };\n\n setColor = (color: string) => {\n if (this.polycanvas) {\n this.polycanvas.setColor(color);\n }\n };\n\n updateHeight = (height: number) => {\n this.height = height;\n this.onUpdateHeight(height);\n };\n\n destroy = () => {\n if (this.polycanvas) {\n this.polycanvas.off('change', this.onChange);\n this.polycanvas.destroy();\n this.debouncedViewportChange.cancel();\n\n if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n this.polycanvas.off('viewport', this.debouncedViewportChange);\n }\n this.polycanvas = undefined;\n\n if (this.fileInput && this.fileInput.parentNode) {\n this.fileInput.parentNode.removeChild(this.fileInput);\n this.fileInput = null;\n }\n }\n };\n}\n"],"names":["CueCanvasCore","onPublish","onSubscribe","onUpdateActiveTool","onUpdateHeight","uploadImageToS3","height","userId","responseId","userType","renderAs","__publicField","payload","gridName","dimension","checkTextOrEquationTool","data","undoData","getReverseMap","viewPort","image","downloadLink","file","resolve","reject","event","target","_a","imageBase64","imgJson","key","payloads","item","heights","maxHeight","canEditStroke","value","_b","_c","tool","currTool","currSubTool","getToolAndSubtool","color","debounce","canvasElementRef","canvasConfig","canvasSetting","initialData","removeMask"],"mappings":"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"}
@@ -1,17 +1,36 @@
1
- const c = (e) => {
2
- var t;
3
- const n = (t = e.current) == null ? void 0 : t.shadowRoot;
4
- if (n) {
5
- const s = n.querySelectorAll("x-polypad");
6
- if (s[0]) {
7
- const a = s[0].querySelector("svg.canvas"), r = a == null ? void 0 : a.querySelector("path.mask");
8
- r == null || r.setAttribute("stroke", "transparent"), r == null || r.setAttribute("fill", "transparent"), r == null || r.removeAttribute("style");
1
+ const d = [
2
+ "none",
3
+ "square2-grid",
4
+ "square-checked",
5
+ "square-dots",
6
+ "tri-dots",
7
+ "tri2-dots",
8
+ "square-grid",
9
+ "tri-grid",
10
+ "tri2-grid"
11
+ ], g = /* @__PURE__ */ new Set([
12
+ "undo",
13
+ "redo",
14
+ "clearAll",
15
+ "home",
16
+ "zoomIn",
17
+ "zoomOut",
18
+ "upload",
19
+ "download"
20
+ ]), A = (e) => {
21
+ var o;
22
+ const r = (o = e.current) == null ? void 0 : o.shadowRoot;
23
+ if (r) {
24
+ const t = r.querySelectorAll("x-polypad");
25
+ if (t[0]) {
26
+ const s = t[0].querySelector("svg.canvas"), n = s == null ? void 0 : s.querySelector("path.mask");
27
+ n == null || n.setAttribute("stroke", "transparent"), n == null || n.setAttribute("fill", "transparent"), n == null || n.removeAttribute("style");
9
28
  }
10
29
  }
11
- }, i = (e, n, t) => t === "canvas" ? {
30
+ }, E = (e, r, o, t) => o === "canvas" ? {
12
31
  canvas: "notebook",
13
32
  canvasX: e,
14
- canvasY: n,
33
+ canvasY: r,
15
34
  noPinchPan: !0,
16
35
  grid: "none",
17
36
  background: "transparent",
@@ -19,9 +38,14 @@ const c = (e) => {
19
38
  } : {
20
39
  canvas: "infinite",
21
40
  canvasX: e,
22
- canvasY: n,
23
- grid: "none"
24
- }, l = (e) => e === "canvas" ? {
41
+ canvasY: r,
42
+ grid: "none",
43
+ noPinchPan: t === "STUDENT",
44
+ noDeleting: t === "STUDENT",
45
+ noCopyPaste: t === "STUDENT",
46
+ noMusic: !0,
47
+ noAudio: !0
48
+ }, T = (e) => e === "canvas" ? {
25
49
  sidebarTiles: !1,
26
50
  sidebarSettings: !1,
27
51
  settings: !1,
@@ -33,12 +57,12 @@ const c = (e) => {
33
57
  sidebarSettings: !1,
34
58
  settings: !1,
35
59
  toolbar: !1
36
- }, o = (e) => [e[1], e[0]], u = (e) => {
37
- const n = /* @__PURE__ */ new Map();
38
- return e.forEach((t, s) => {
39
- n.set(s, o(t));
40
- }), n;
41
- }, g = (e) => {
60
+ }, a = (e) => [e[1], e[0]], S = (e) => {
61
+ const r = /* @__PURE__ */ new Map();
62
+ return e.forEach((o, t) => {
63
+ r.set(t, a(o));
64
+ }), r;
65
+ }, p = (e) => {
42
66
  switch (e) {
43
67
  case "pen":
44
68
  return ["pen", "pen"];
@@ -48,10 +72,41 @@ const c = (e) => {
48
72
  return ["pen", "highlighter"];
49
73
  case "ruler":
50
74
  return ["pen", "ruler"];
75
+ case "equation":
76
+ return ["text", "equation"];
51
77
  default:
52
78
  return [e, void 0];
53
79
  }
54
- }, p = (e) => e === "TEACHER" ? [
80
+ }, i = [
81
+ "pen",
82
+ "ruler",
83
+ "marker",
84
+ "highlighter",
85
+ "eraser",
86
+ "move",
87
+ "pan",
88
+ "clearAll",
89
+ "text",
90
+ "equation",
91
+ "grid",
92
+ "home",
93
+ "undo",
94
+ "redo",
95
+ "zoomIn",
96
+ "zoomOut",
97
+ "upload",
98
+ "download"
99
+ ], c = [
100
+ "pen",
101
+ "ruler",
102
+ "marker",
103
+ "highlighter",
104
+ "move",
105
+ "text",
106
+ "undo",
107
+ "redo",
108
+ "download"
109
+ ], u = [
55
110
  "pen",
56
111
  "ruler",
57
112
  "marker",
@@ -60,15 +115,22 @@ const c = (e) => {
60
115
  "move",
61
116
  "undo",
62
117
  "redo"
63
- ] : ["pen", "ruler", "eraser", "move", "undo", "redo"], A = (e) => e === "TEACHER" ? ["CANVAS_RED", "CANVAS_YELLOW", "CANVAS_GREEN"] : ["CANVAS_BLUE", "CANVAS_PURPLE", "CANVAS_PINK"];
118
+ ], l = ["pen", "ruler", "eraser", "move", "undo", "redo"], h = (e, r) => r === "whiteboard" ? e === "TEACHER" ? i : c : e === "TEACHER" ? u : l, f = (e) => e === "TEACHER" ? ["CANVAS_RED", "CANVAS_YELLOW", "CANVAS_GREEN"] : ["CANVAS_BLUE", "CANVAS_PURPLE", "CANVAS_PINK"], m = (e) => ["pen", "ruler", "marker", "highlighter"].includes(e), v = (e) => (Object.entries(e).forEach(([, r]) => {
119
+ if (!r[0] && r[1] && "name" in r[1] && (r[1].name === "text" || r[1].name === "equation"))
120
+ return !0;
121
+ }), !1);
64
122
  export {
65
- i as getCanvasConfig,
66
- l as getCanvasSettings,
67
- A as getColorsForUser,
68
- o as getReverseAction,
69
- u as getReverseMap,
70
- g as getToolAndSubtool,
71
- p as getUserTools,
72
- c as removeMask
123
+ d as GRID_NAMES,
124
+ g as SINGLE_CLICK_TOOLS,
125
+ v as checkTextOrEquationTool,
126
+ E as getCanvasConfig,
127
+ T as getCanvasSettings,
128
+ f as getColorsForUser,
129
+ m as getIsWritingTool,
130
+ a as getReverseAction,
131
+ S as getReverseMap,
132
+ p as getToolAndSubtool,
133
+ h as getUserTools,
134
+ A as removeMask
73
135
  };
74
136
  //# sourceMappingURL=cue-canvas-helpers.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"cue-canvas-helpers.js","sources":["../../../src/features/cue-canvas/cue-canvas-helpers.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n TCueCanvasColors,\n TCueCanvasChangeData,\n TCueCanvasTool,\n TCueCanvasToolOption,\n TDrawingData,\n TRenderAs,\n} from './types/cue-canvas';\nimport type { IPolypadCreateOptions, IPolypadOptions } from './types/polypad';\n\nexport const removeMask = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n const shadowRoot = canvasElementRef.current?.shadowRoot;\n\n if (shadowRoot) {\n const xPolypad = shadowRoot.querySelectorAll('x-polypad');\n\n if (xPolypad[0]) {\n const svgCanvas = xPolypad[0].querySelector('svg.canvas');\n const maskPath = svgCanvas?.querySelector('path.mask');\n\n maskPath?.setAttribute('stroke', 'transparent');\n maskPath?.setAttribute('fill', 'transparent');\n maskPath?.removeAttribute('style');\n }\n }\n\n return undefined;\n};\n\nexport const getCanvasConfig = (\n width: number,\n height: number,\n renderAs: TRenderAs,\n): IPolypadOptions => {\n return renderAs === 'canvas'\n ? {\n canvas: 'notebook',\n canvasX: width,\n canvasY: height,\n noPinchPan: true,\n grid: 'none',\n background: 'transparent',\n noSnapping: true,\n }\n : ({\n canvas: 'infinite',\n canvasX: width,\n canvasY: height,\n grid: 'none',\n } as IPolypadOptions);\n};\n\nexport const getCanvasSettings = (renderAs: TRenderAs): IPolypadCreateOptions => {\n return renderAs === 'canvas'\n ? {\n sidebarTiles: false,\n sidebarSettings: false,\n settings: false,\n toolbar: false,\n canvasMargin: 0,\n }\n : {\n sidebarTiles: false, //userType === 'TEACHER'\n sidebarSettings: false,\n settings: false,\n toolbar: false,\n };\n};\n\nexport const getReverseAction = (action: TDrawingData[]) => [action[1], action[0]];\n\nexport const getReverseMap = (data: TCueCanvasChangeData) => {\n const newData = new Map<string, TDrawingData[]>();\n\n data.forEach((value, key) => {\n newData.set(key, getReverseAction(value));\n });\n\n return newData;\n};\n\nexport const getToolAndSubtool = (\n tool: TCueCanvasTool,\n): [\n Exclude<TCueCanvasTool, 'marker' | 'highlighter' | 'ruler'>,\n TCueCanvasToolOption | undefined,\n] => {\n switch (tool) {\n case 'pen':\n return ['pen', 'pen'];\n case 'marker':\n return ['pen', 'marker'];\n case 'highlighter':\n return ['pen', 'highlighter'];\n case 'ruler':\n return ['pen', 'ruler'];\n default:\n return [tool, undefined];\n }\n};\n\nexport const getUserTools = (userType: TUserTypes) => {\n return userType === 'TEACHER'\n ? ([\n 'pen',\n 'ruler',\n 'marker',\n 'highlighter',\n 'eraser',\n 'move',\n 'undo',\n 'redo',\n ] as TCueCanvasTool[])\n : (['pen', 'ruler', 'eraser', 'move', 'undo', 'redo'] as TCueCanvasTool[]);\n};\n\nexport const getColorsForUser = (userType: TUserTypes) => {\n return userType === 'TEACHER'\n ? (['CANVAS_RED', 'CANVAS_YELLOW', 'CANVAS_GREEN'] as TCueCanvasColors[])\n : (['CANVAS_BLUE', 'CANVAS_PURPLE', 'CANVAS_PINK'] as TCueCanvasColors[]);\n};\n"],"names":["removeMask","canvasElementRef","_a","shadowRoot","xPolypad","svgCanvas","maskPath","getCanvasConfig","width","height","renderAs","getCanvasSettings","getReverseAction","action","getReverseMap","data","newData","value","key","getToolAndSubtool","tool","getUserTools","userType","getColorsForUser"],"mappings":"AAWa,MAAAA,IAAa,CAACC,MAAsD;AAApE,MAAAC;AACL,QAAAC,KAAaD,IAAAD,EAAiB,YAAjB,gBAAAC,EAA0B;AAE7C,MAAIC,GAAY;AACR,UAAAC,IAAWD,EAAW,iBAAiB,WAAW;AAEpD,QAAAC,EAAS,CAAC,GAAG;AACf,YAAMC,IAAYD,EAAS,CAAC,EAAE,cAAc,YAAY,GAClDE,IAAWD,KAAA,gBAAAA,EAAW,cAAc;AAEhC,MAAAC,KAAA,QAAAA,EAAA,aAAa,UAAU,gBACvBA,KAAA,QAAAA,EAAA,aAAa,QAAQ,gBAC/BA,KAAA,QAAAA,EAAU,gBAAgB;AAAA,IAC5B;AAAA,EACF;AAGF,GAEaC,IAAkB,CAC7BC,GACAC,GACAC,MAEOA,MAAa,WAChB;AAAA,EACE,QAAQ;AAAA,EACR,SAASF;AAAA,EACT,SAASC;AAAA,EACT,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,YAAY;AAAA,IAEb;AAAA,EACC,QAAQ;AAAA,EACR,SAASD;AAAA,EACT,SAASC;AAAA,EACT,MAAM;AAAA,GAIDE,IAAoB,CAACD,MACzBA,MAAa,WAChB;AAAA,EACE,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,IAEhB;AAAA,EACE,cAAc;AAAA;AAAA,EACd,iBAAiB;AAAA,EACjB,UAAU;AAAA,EACV,SAAS;AAAA,GAIJE,IAAmB,CAACC,MAA2B,CAACA,EAAO,CAAC,GAAGA,EAAO,CAAC,CAAC,GAEpEC,IAAgB,CAACC,MAA+B;AACrD,QAAAC,wBAAc;AAEf,SAAAD,EAAA,QAAQ,CAACE,GAAOC,MAAQ;AAC3B,IAAAF,EAAQ,IAAIE,GAAKN,EAAiBK,CAAK,CAAC;AAAA,EAAA,CACzC,GAEMD;AACT,GAEaG,IAAoB,CAC/BC,MAIG;AACH,UAAQA,GAAM;AAAA,IACZ,KAAK;AACI,aAAA,CAAC,OAAO,KAAK;AAAA,IACtB,KAAK;AACI,aAAA,CAAC,OAAO,QAAQ;AAAA,IACzB,KAAK;AACI,aAAA,CAAC,OAAO,aAAa;AAAA,IAC9B,KAAK;AACI,aAAA,CAAC,OAAO,OAAO;AAAA,IACxB;AACS,aAAA,CAACA,GAAM,MAAS;AAAA,EAC3B;AACF,GAEaC,IAAe,CAACC,MACpBA,MAAa,YACf;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,IAED,CAAC,OAAO,SAAS,UAAU,QAAQ,QAAQ,MAAM,GAG3CC,IAAmB,CAACD,MACxBA,MAAa,YACf,CAAC,cAAc,iBAAiB,cAAc,IAC9C,CAAC,eAAe,iBAAiB,aAAa;"}
1
+ {"version":3,"file":"cue-canvas-helpers.js","sources":["../../../src/features/cue-canvas/cue-canvas-helpers.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n TCueCanvasColors,\n TCueCanvasChangeData,\n TCueCanvasTool,\n TCueCanvasToolOption,\n TDrawingData,\n TRenderAs,\n TCueCanvasGridName,\n TCueCanvasChangeDataObject,\n} from './types/cue-canvas';\nimport type { IPolypadCreateOptions, IPolypadOptions } from './types/polypad';\n\nexport const GRID_NAMES: TCueCanvasGridName[] = [\n 'none',\n 'square2-grid',\n 'square-checked',\n 'square-dots',\n 'tri-dots',\n 'tri2-dots',\n 'square-grid',\n 'tri-grid',\n 'tri2-grid',\n];\n\nexport const SINGLE_CLICK_TOOLS = new Set<TCueCanvasTool>([\n 'undo',\n 'redo',\n 'clearAll',\n 'home',\n 'zoomIn',\n 'zoomOut',\n 'upload',\n 'download',\n]);\n\nexport const removeMask = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n const shadowRoot = canvasElementRef.current?.shadowRoot;\n\n if (shadowRoot) {\n const xPolypad = shadowRoot.querySelectorAll('x-polypad');\n\n if (xPolypad[0]) {\n const svgCanvas = xPolypad[0].querySelector('svg.canvas');\n const maskPath = svgCanvas?.querySelector('path.mask');\n\n maskPath?.setAttribute('stroke', 'transparent');\n maskPath?.setAttribute('fill', 'transparent');\n maskPath?.removeAttribute('style');\n }\n }\n\n return undefined;\n};\n\nexport const getCanvasConfig = (\n width: number,\n height: number,\n renderAs: TRenderAs,\n userType: TUserTypes,\n): IPolypadOptions => {\n return renderAs === 'canvas'\n ? {\n canvas: 'notebook',\n canvasX: width,\n canvasY: height,\n noPinchPan: true,\n grid: 'none',\n background: 'transparent',\n noSnapping: true,\n }\n : {\n canvas: 'infinite',\n canvasX: width,\n canvasY: height,\n grid: 'none',\n noPinchPan: userType === 'STUDENT',\n noDeleting: userType === 'STUDENT',\n noCopyPaste: userType === 'STUDENT',\n noMusic: true,\n noAudio: true,\n };\n};\n\nexport const getCanvasSettings = (renderAs: TRenderAs): IPolypadCreateOptions => {\n return renderAs === 'canvas'\n ? {\n sidebarTiles: false,\n sidebarSettings: false,\n settings: false,\n toolbar: false,\n canvasMargin: 0,\n }\n : {\n sidebarTiles: false, //userType === 'TEACHER'\n sidebarSettings: false,\n settings: false,\n toolbar: false,\n };\n};\n\nexport const getReverseAction = (action: TDrawingData[]) => [action[1], action[0]];\n\nexport const getReverseMap = (data: TCueCanvasChangeData) => {\n const newData = new Map<string, TDrawingData[]>();\n\n data.forEach((value, key) => {\n newData.set(key, getReverseAction(value));\n });\n\n return newData;\n};\n\nexport const getToolAndSubtool = (\n tool: TCueCanvasTool,\n): [\n Exclude<TCueCanvasTool, 'marker' | 'highlighter' | 'ruler' | 'equation'>,\n TCueCanvasToolOption | undefined,\n] => {\n switch (tool) {\n case 'pen':\n return ['pen', 'pen'];\n case 'marker':\n return ['pen', 'marker'];\n case 'highlighter':\n return ['pen', 'highlighter'];\n case 'ruler':\n return ['pen', 'ruler'];\n case 'equation':\n return ['text', 'equation'];\n default:\n return [tool, undefined];\n }\n};\n\nconst TEACHER_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n 'pen',\n 'ruler',\n 'marker',\n 'highlighter',\n 'eraser',\n 'move',\n 'pan',\n 'clearAll',\n 'text',\n 'equation',\n 'grid',\n 'home',\n 'undo',\n 'redo',\n 'zoomIn',\n 'zoomOut',\n 'upload',\n 'download',\n];\n\nconst STUDENT_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n 'pen',\n 'ruler',\n 'marker',\n 'highlighter',\n 'move',\n 'text',\n 'undo',\n 'redo',\n 'download',\n];\n\nconst TEACHER_DEFAULT_TOOLS: TCueCanvasTool[] = [\n 'pen',\n 'ruler',\n 'marker',\n 'highlighter',\n 'eraser',\n 'move',\n 'undo',\n 'redo',\n];\n\nconst STUDENT_DEFAULT_TOOLS: TCueCanvasTool[] = ['pen', 'ruler', 'eraser', 'move', 'undo', 'redo'];\n\nexport const getUserTools = (userType: TUserTypes, renderAs: TRenderAs): TCueCanvasTool[] => {\n if (renderAs === 'whiteboard') {\n return userType === 'TEACHER' ? TEACHER_WHITEBOARD_TOOLS : STUDENT_WHITEBOARD_TOOLS;\n }\n\n return userType === 'TEACHER' ? TEACHER_DEFAULT_TOOLS : STUDENT_DEFAULT_TOOLS;\n};\n\nexport const getColorsForUser = (userType: TUserTypes) => {\n return userType === 'TEACHER'\n ? (['CANVAS_RED', 'CANVAS_YELLOW', 'CANVAS_GREEN'] as TCueCanvasColors[])\n : (['CANVAS_BLUE', 'CANVAS_PURPLE', 'CANVAS_PINK'] as TCueCanvasColors[]);\n};\n\nexport const getIsWritingTool = (penTool: string) => {\n return ['pen', 'ruler', 'marker', 'highlighter'].includes(penTool);\n};\n\nexport const checkTextOrEquationTool = (payload: TCueCanvasChangeDataObject) => {\n Object.entries(payload).forEach(([, value]) => {\n if (\n !value[0] &&\n value[1] &&\n 'name' in value[1] &&\n (value[1].name === 'text' || value[1].name === 'equation')\n ) {\n return true;\n }\n });\n\n return false;\n};\n"],"names":["GRID_NAMES","SINGLE_CLICK_TOOLS","removeMask","canvasElementRef","_a","shadowRoot","xPolypad","svgCanvas","maskPath","getCanvasConfig","width","height","renderAs","userType","getCanvasSettings","getReverseAction","action","getReverseMap","data","newData","value","key","getToolAndSubtool","tool","TEACHER_WHITEBOARD_TOOLS","STUDENT_WHITEBOARD_TOOLS","TEACHER_DEFAULT_TOOLS","STUDENT_DEFAULT_TOOLS","getUserTools","getColorsForUser","getIsWritingTool","penTool","checkTextOrEquationTool","payload"],"mappings":"AAaO,MAAMA,IAAmC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,wBAAyB,IAAoB;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC,GAEYC,IAAa,CAACC,MAAsD;AAvB1E,MAAAC;AAwBC,QAAAC,KAAaD,IAAAD,EAAiB,YAAjB,gBAAAC,EAA0B;AAE7C,MAAIC,GAAY;AACR,UAAAC,IAAWD,EAAW,iBAAiB,WAAW;AAEpD,QAAAC,EAAS,CAAC,GAAG;AACf,YAAMC,IAAYD,EAAS,CAAC,EAAE,cAAc,YAAY,GAClDE,IAAWD,KAAA,gBAAAA,EAAW,cAAc;AAEhC,MAAAC,KAAA,QAAAA,EAAA,aAAa,UAAU,gBACvBA,KAAA,QAAAA,EAAA,aAAa,QAAQ,gBAC/BA,KAAA,QAAAA,EAAU,gBAAgB;AAAA,IAC5B;AAAA,EACF;AAGF,GAEaC,IAAkB,CAC7BC,GACAC,GACAC,GACAC,MAEOD,MAAa,WAChB;AAAA,EACE,QAAQ;AAAA,EACR,SAASF;AAAA,EACT,SAASC;AAAA,EACT,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,YAAY;AAAA,IAEd;AAAA,EACE,QAAQ;AAAA,EACR,SAASD;AAAA,EACT,SAASC;AAAA,EACT,MAAM;AAAA,EACN,YAAYE,MAAa;AAAA,EACzB,YAAYA,MAAa;AAAA,EACzB,aAAaA,MAAa;AAAA,EAC1B,SAAS;AAAA,EACT,SAAS;AAAA,GAIJC,IAAoB,CAACF,MACzBA,MAAa,WAChB;AAAA,EACE,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,IAEhB;AAAA,EACE,cAAc;AAAA;AAAA,EACd,iBAAiB;AAAA,EACjB,UAAU;AAAA,EACV,SAAS;AAAA,GAIJG,IAAmB,CAACC,MAA2B,CAACA,EAAO,CAAC,GAAGA,EAAO,CAAC,CAAC,GAEpEC,IAAgB,CAACC,MAA+B;AACrD,QAAAC,wBAAc;AAEf,SAAAD,EAAA,QAAQ,CAACE,GAAOC,MAAQ;AAC3B,IAAAF,EAAQ,IAAIE,GAAKN,EAAiBK,CAAK,CAAC;AAAA,EAAA,CACzC,GAEMD;AACT,GAEaG,IAAoB,CAC/BC,MAIG;AACH,UAAQA,GAAM;AAAA,IACZ,KAAK;AACI,aAAA,CAAC,OAAO,KAAK;AAAA,IACtB,KAAK;AACI,aAAA,CAAC,OAAO,QAAQ;AAAA,IACzB,KAAK;AACI,aAAA,CAAC,OAAO,aAAa;AAAA,IAC9B,KAAK;AACI,aAAA,CAAC,OAAO,OAAO;AAAA,IACxB,KAAK;AACI,aAAA,CAAC,QAAQ,UAAU;AAAA,IAC5B;AACS,aAAA,CAACA,GAAM,MAAS;AAAA,EAC3B;AACF,GAEMC,IAA6C;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEMC,IAA6C;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEMC,IAA0C;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEMC,IAA0C,CAAC,OAAO,SAAS,UAAU,QAAQ,QAAQ,MAAM,GAEpFC,IAAe,CAACf,GAAsBD,MAC7CA,MAAa,eACRC,MAAa,YAAYW,IAA2BC,IAGtDZ,MAAa,YAAYa,IAAwBC,GAG7CE,IAAmB,CAAChB,MACxBA,MAAa,YACf,CAAC,cAAc,iBAAiB,cAAc,IAC9C,CAAC,eAAe,iBAAiB,aAAa,GAGxCiB,IAAmB,CAACC,MACxB,CAAC,OAAO,SAAS,UAAU,aAAa,EAAE,SAASA,CAAO,GAGtDC,IAA0B,CAACC,OAC/B,OAAA,QAAQA,CAAO,EAAE,QAAQ,CAAC,CAAG,EAAAb,CAAK,MAAM;AAE3C,MAAA,CAACA,EAAM,CAAC,KACRA,EAAM,CAAC,KACP,UAAUA,EAAM,CAAC,MAChBA,EAAM,CAAC,EAAE,SAAS,UAAUA,EAAM,CAAC,EAAE,SAAS;AAExC,WAAA;AACT,CACD,GAEM;"}