microboard-temp 0.5.16 → 0.5.18

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.
@@ -21735,8 +21735,8 @@ class BaseItem extends Mbr {
21735
21735
  }
21736
21736
  renderHTML(documentFactory) {
21737
21737
  const div = documentFactory.createElement("base-item");
21738
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
21739
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
21738
+ const { translateX, translateY } = this.transformation.matrix;
21739
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
21740
21740
  div.style.backgroundColor = "#b2b0c3";
21741
21741
  div.id = this.getId();
21742
21742
  div.style.width = `${this.getWidth()}px`;
@@ -48136,15 +48136,21 @@ class Deck extends BaseItem {
48136
48136
  }
48137
48137
  renderHTML(documentFactory) {
48138
48138
  const div = super.renderHTML(documentFactory);
48139
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
48139
+ const cards = this.index?.list();
48140
+ const topCard = cards[cards.length - 1];
48141
+ if (!topCard) {
48140
48142
  return div;
48141
48143
  }
48142
48144
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
48143
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
48144
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
48145
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
48146
+ const topCardElement = topCard.renderHTML(documentFactory);
48147
+ div.appendChild(topCardElement);
48148
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
48149
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
48145
48150
  div.id = this.getId();
48146
48151
  div.style.width = `${this.getWidth()}px`;
48147
48152
  div.style.height = `${this.getHeight()}px`;
48153
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
48148
48154
  div.style.transformOrigin = "top left";
48149
48155
  div.style.transform = transform;
48150
48156
  div.style.position = "absolute";
package/dist/cjs/index.js CHANGED
@@ -21735,8 +21735,8 @@ class BaseItem extends Mbr {
21735
21735
  }
21736
21736
  renderHTML(documentFactory) {
21737
21737
  const div = documentFactory.createElement("base-item");
21738
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
21739
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
21738
+ const { translateX, translateY } = this.transformation.matrix;
21739
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
21740
21740
  div.style.backgroundColor = "#b2b0c3";
21741
21741
  div.id = this.getId();
21742
21742
  div.style.width = `${this.getWidth()}px`;
@@ -48136,15 +48136,21 @@ class Deck extends BaseItem {
48136
48136
  }
48137
48137
  renderHTML(documentFactory) {
48138
48138
  const div = super.renderHTML(documentFactory);
48139
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
48139
+ const cards = this.index?.list();
48140
+ const topCard = cards[cards.length - 1];
48141
+ if (!topCard) {
48140
48142
  return div;
48141
48143
  }
48142
48144
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
48143
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
48144
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
48145
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
48146
+ const topCardElement = topCard.renderHTML(documentFactory);
48147
+ div.appendChild(topCardElement);
48148
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
48149
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
48145
48150
  div.id = this.getId();
48146
48151
  div.style.width = `${this.getWidth()}px`;
48147
48152
  div.style.height = `${this.getHeight()}px`;
48153
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
48148
48154
  div.style.transformOrigin = "top left";
48149
48155
  div.style.transform = transform;
48150
48156
  div.style.position = "absolute";
package/dist/cjs/node.js CHANGED
@@ -24207,8 +24207,8 @@ class BaseItem extends Mbr {
24207
24207
  }
24208
24208
  renderHTML(documentFactory) {
24209
24209
  const div = documentFactory.createElement("base-item");
24210
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
24211
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
24210
+ const { translateX, translateY } = this.transformation.matrix;
24211
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
24212
24212
  div.style.backgroundColor = "#b2b0c3";
24213
24213
  div.id = this.getId();
24214
24214
  div.style.width = `${this.getWidth()}px`;
@@ -50609,15 +50609,21 @@ class Deck extends BaseItem {
50609
50609
  }
50610
50610
  renderHTML(documentFactory) {
50611
50611
  const div = super.renderHTML(documentFactory);
50612
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
50612
+ const cards = this.index?.list();
50613
+ const topCard = cards[cards.length - 1];
50614
+ if (!topCard) {
50613
50615
  return div;
50614
50616
  }
50615
50617
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
50616
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
50617
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
50618
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
50619
+ const topCardElement = topCard.renderHTML(documentFactory);
50620
+ div.appendChild(topCardElement);
50621
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
50622
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
50618
50623
  div.id = this.getId();
50619
50624
  div.style.width = `${this.getWidth()}px`;
50620
50625
  div.style.height = `${this.getHeight()}px`;
50626
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
50621
50627
  div.style.transformOrigin = "top left";
50622
50628
  div.style.transform = transform;
50623
50629
  div.style.position = "absolute";
@@ -21581,8 +21581,8 @@ class BaseItem extends Mbr {
21581
21581
  }
21582
21582
  renderHTML(documentFactory) {
21583
21583
  const div = documentFactory.createElement("base-item");
21584
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
21585
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
21584
+ const { translateX, translateY } = this.transformation.matrix;
21585
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
21586
21586
  div.style.backgroundColor = "#b2b0c3";
21587
21587
  div.id = this.getId();
21588
21588
  div.style.width = `${this.getWidth()}px`;
@@ -47982,15 +47982,21 @@ class Deck extends BaseItem {
47982
47982
  }
47983
47983
  renderHTML(documentFactory) {
47984
47984
  const div = super.renderHTML(documentFactory);
47985
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
47985
+ const cards = this.index?.list();
47986
+ const topCard = cards[cards.length - 1];
47987
+ if (!topCard) {
47986
47988
  return div;
47987
47989
  }
47988
47990
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
47989
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
47990
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
47991
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
47992
+ const topCardElement = topCard.renderHTML(documentFactory);
47993
+ div.appendChild(topCardElement);
47994
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
47995
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
47991
47996
  div.id = this.getId();
47992
47997
  div.style.width = `${this.getWidth()}px`;
47993
47998
  div.style.height = `${this.getHeight()}px`;
47999
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
47994
48000
  div.style.transformOrigin = "top left";
47995
48001
  div.style.transform = transform;
47996
48002
  div.style.position = "absolute";
package/dist/esm/index.js CHANGED
@@ -21574,8 +21574,8 @@ class BaseItem extends Mbr {
21574
21574
  }
21575
21575
  renderHTML(documentFactory) {
21576
21576
  const div = documentFactory.createElement("base-item");
21577
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
21578
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
21577
+ const { translateX, translateY } = this.transformation.matrix;
21578
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
21579
21579
  div.style.backgroundColor = "#b2b0c3";
21580
21580
  div.id = this.getId();
21581
21581
  div.style.width = `${this.getWidth()}px`;
@@ -47975,15 +47975,21 @@ class Deck extends BaseItem {
47975
47975
  }
47976
47976
  renderHTML(documentFactory) {
47977
47977
  const div = super.renderHTML(documentFactory);
47978
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
47978
+ const cards = this.index?.list();
47979
+ const topCard = cards[cards.length - 1];
47980
+ if (!topCard) {
47979
47981
  return div;
47980
47982
  }
47981
47983
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
47982
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
47983
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
47984
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
47985
+ const topCardElement = topCard.renderHTML(documentFactory);
47986
+ div.appendChild(topCardElement);
47987
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
47988
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
47984
47989
  div.id = this.getId();
47985
47990
  div.style.width = `${this.getWidth()}px`;
47986
47991
  div.style.height = `${this.getHeight()}px`;
47992
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
47987
47993
  div.style.transformOrigin = "top left";
47988
47994
  div.style.transform = transform;
47989
47995
  div.style.position = "absolute";
package/dist/esm/node.js CHANGED
@@ -24041,8 +24041,8 @@ class BaseItem extends Mbr {
24041
24041
  }
24042
24042
  renderHTML(documentFactory) {
24043
24043
  const div = documentFactory.createElement("base-item");
24044
- const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
24045
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
24044
+ const { translateX, translateY } = this.transformation.matrix;
24045
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
24046
24046
  div.style.backgroundColor = "#b2b0c3";
24047
24047
  div.id = this.getId();
24048
24048
  div.style.width = `${this.getWidth()}px`;
@@ -50443,15 +50443,21 @@ class Deck extends BaseItem {
50443
50443
  }
50444
50444
  renderHTML(documentFactory) {
50445
50445
  const div = super.renderHTML(documentFactory);
50446
- if (!this.cachedCanvas || !this.cachedCanvas.width || !this.cachedCanvas.height) {
50446
+ const cards = this.index?.list();
50447
+ const topCard = cards[cards.length - 1];
50448
+ if (!topCard) {
50447
50449
  return div;
50448
50450
  }
50449
50451
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
50450
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
50451
- div.style.backgroundImage = `url(${this.cachedCanvas.toDataURL("image/png")})`;
50452
+ const transform = `translate(${translateX}px, ${translateY}px) scale(1, 1)`;
50453
+ const topCardElement = topCard.renderHTML(documentFactory);
50454
+ div.appendChild(topCardElement);
50455
+ const offset = ((this.index?.list().length || 0) - 1) * 2;
50456
+ topCardElement.style.transform = `translate(${offset}px, ${0}px) scale(1, 1)`;
50452
50457
  div.id = this.getId();
50453
50458
  div.style.width = `${this.getWidth()}px`;
50454
50459
  div.style.height = `${this.getHeight()}px`;
50460
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
50455
50461
  div.style.transformOrigin = "top left";
50456
50462
  div.style.transform = transform;
50457
50463
  div.style.position = "absolute";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "microboard-temp",
3
- "version": "0.5.16",
3
+ "version": "0.5.18",
4
4
  "description": "A flexible interactive whiteboard library",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",