microboard-temp 0.5.17 → 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.
@@ -47857,8 +47857,6 @@ class Card extends BaseItem {
47857
47857
  createImages() {
47858
47858
  this.face = conf.documentFactory.createElement("img");
47859
47859
  this.backside = conf.documentFactory.createElement("img");
47860
- this.face.crossOrigin = "anonymous";
47861
- this.backside.crossOrigin = "anonymous";
47862
47860
  this.face.src = this.faceUrl;
47863
47861
  this.backside.src = this.backsideUrl;
47864
47862
  this.face.onload = () => {
@@ -48138,15 +48136,21 @@ class Deck extends BaseItem {
48138
48136
  }
48139
48137
  renderHTML(documentFactory) {
48140
48138
  const div = super.renderHTML(documentFactory);
48141
- 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) {
48142
48142
  return div;
48143
48143
  }
48144
48144
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
48145
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
48146
- 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)`;
48147
48150
  div.id = this.getId();
48148
48151
  div.style.width = `${this.getWidth()}px`;
48149
48152
  div.style.height = `${this.getHeight()}px`;
48153
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
48150
48154
  div.style.transformOrigin = "top left";
48151
48155
  div.style.transform = transform;
48152
48156
  div.style.position = "absolute";
package/dist/cjs/index.js CHANGED
@@ -47857,8 +47857,6 @@ class Card extends BaseItem {
47857
47857
  createImages() {
47858
47858
  this.face = conf.documentFactory.createElement("img");
47859
47859
  this.backside = conf.documentFactory.createElement("img");
47860
- this.face.crossOrigin = "anonymous";
47861
- this.backside.crossOrigin = "anonymous";
47862
47860
  this.face.src = this.faceUrl;
47863
47861
  this.backside.src = this.backsideUrl;
47864
47862
  this.face.onload = () => {
@@ -48138,15 +48136,21 @@ class Deck extends BaseItem {
48138
48136
  }
48139
48137
  renderHTML(documentFactory) {
48140
48138
  const div = super.renderHTML(documentFactory);
48141
- 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) {
48142
48142
  return div;
48143
48143
  }
48144
48144
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
48145
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
48146
- 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)`;
48147
48150
  div.id = this.getId();
48148
48151
  div.style.width = `${this.getWidth()}px`;
48149
48152
  div.style.height = `${this.getHeight()}px`;
48153
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
48150
48154
  div.style.transformOrigin = "top left";
48151
48155
  div.style.transform = transform;
48152
48156
  div.style.position = "absolute";
package/dist/cjs/node.js CHANGED
@@ -50330,8 +50330,6 @@ class Card extends BaseItem {
50330
50330
  createImages() {
50331
50331
  this.face = conf.documentFactory.createElement("img");
50332
50332
  this.backside = conf.documentFactory.createElement("img");
50333
- this.face.crossOrigin = "anonymous";
50334
- this.backside.crossOrigin = "anonymous";
50335
50333
  this.face.src = this.faceUrl;
50336
50334
  this.backside.src = this.backsideUrl;
50337
50335
  this.face.onload = () => {
@@ -50611,15 +50609,21 @@ class Deck extends BaseItem {
50611
50609
  }
50612
50610
  renderHTML(documentFactory) {
50613
50611
  const div = super.renderHTML(documentFactory);
50614
- 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) {
50615
50615
  return div;
50616
50616
  }
50617
50617
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
50618
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
50619
- 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)`;
50620
50623
  div.id = this.getId();
50621
50624
  div.style.width = `${this.getWidth()}px`;
50622
50625
  div.style.height = `${this.getHeight()}px`;
50626
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
50623
50627
  div.style.transformOrigin = "top left";
50624
50628
  div.style.transform = transform;
50625
50629
  div.style.position = "absolute";
@@ -47703,8 +47703,6 @@ class Card extends BaseItem {
47703
47703
  createImages() {
47704
47704
  this.face = conf.documentFactory.createElement("img");
47705
47705
  this.backside = conf.documentFactory.createElement("img");
47706
- this.face.crossOrigin = "anonymous";
47707
- this.backside.crossOrigin = "anonymous";
47708
47706
  this.face.src = this.faceUrl;
47709
47707
  this.backside.src = this.backsideUrl;
47710
47708
  this.face.onload = () => {
@@ -47984,15 +47982,21 @@ class Deck extends BaseItem {
47984
47982
  }
47985
47983
  renderHTML(documentFactory) {
47986
47984
  const div = super.renderHTML(documentFactory);
47987
- 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) {
47988
47988
  return div;
47989
47989
  }
47990
47990
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
47991
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
47992
- 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)`;
47993
47996
  div.id = this.getId();
47994
47997
  div.style.width = `${this.getWidth()}px`;
47995
47998
  div.style.height = `${this.getHeight()}px`;
47999
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
47996
48000
  div.style.transformOrigin = "top left";
47997
48001
  div.style.transform = transform;
47998
48002
  div.style.position = "absolute";
package/dist/esm/index.js CHANGED
@@ -47696,8 +47696,6 @@ class Card extends BaseItem {
47696
47696
  createImages() {
47697
47697
  this.face = conf.documentFactory.createElement("img");
47698
47698
  this.backside = conf.documentFactory.createElement("img");
47699
- this.face.crossOrigin = "anonymous";
47700
- this.backside.crossOrigin = "anonymous";
47701
47699
  this.face.src = this.faceUrl;
47702
47700
  this.backside.src = this.backsideUrl;
47703
47701
  this.face.onload = () => {
@@ -47977,15 +47975,21 @@ class Deck extends BaseItem {
47977
47975
  }
47978
47976
  renderHTML(documentFactory) {
47979
47977
  const div = super.renderHTML(documentFactory);
47980
- 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) {
47981
47981
  return div;
47982
47982
  }
47983
47983
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
47984
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
47985
- 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)`;
47986
47989
  div.id = this.getId();
47987
47990
  div.style.width = `${this.getWidth()}px`;
47988
47991
  div.style.height = `${this.getHeight()}px`;
47992
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
47989
47993
  div.style.transformOrigin = "top left";
47990
47994
  div.style.transform = transform;
47991
47995
  div.style.position = "absolute";
package/dist/esm/node.js CHANGED
@@ -50164,8 +50164,6 @@ class Card extends BaseItem {
50164
50164
  createImages() {
50165
50165
  this.face = conf.documentFactory.createElement("img");
50166
50166
  this.backside = conf.documentFactory.createElement("img");
50167
- this.face.crossOrigin = "anonymous";
50168
- this.backside.crossOrigin = "anonymous";
50169
50167
  this.face.src = this.faceUrl;
50170
50168
  this.backside.src = this.backsideUrl;
50171
50169
  this.face.onload = () => {
@@ -50445,15 +50443,21 @@ class Deck extends BaseItem {
50445
50443
  }
50446
50444
  renderHTML(documentFactory) {
50447
50445
  const div = super.renderHTML(documentFactory);
50448
- 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) {
50449
50449
  return div;
50450
50450
  }
50451
50451
  const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
50452
- const transform = `translate(${translateX}px, ${translateY}px) scale(${scaleX}, ${scaleY})`;
50453
- 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)`;
50454
50457
  div.id = this.getId();
50455
50458
  div.style.width = `${this.getWidth()}px`;
50456
50459
  div.style.height = `${this.getHeight()}px`;
50460
+ div.style.boxShadow = `${offset}px 0px 0px 0px rgba(34, 60, 80, 0.74) inset`;
50457
50461
  div.style.transformOrigin = "top left";
50458
50462
  div.style.transform = transform;
50459
50463
  div.style.position = "absolute";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "microboard-temp",
3
- "version": "0.5.17",
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",