checkboxland - npm Package Compare versions

Comparing version 1.2.0 to 1.3.0

dist-src/index.js

@@ -6,3 +6,5 @@ import { Checkboxland } from './checkboxland.js';
 import dataUtils from './plugins/dataUtils.js';
-import onClick from './plugins/onClick.js'; // Add built-in plugins
+import onClick from './plugins/onClick.js';
+import renderImage from './plugins/media/renderImage.js';
+import renderVideo from './plugins/media/renderVideo.js'; // Add built-in plugins
 
@@ -14,2 +16,4 @@ Checkboxland.extend(print);
 Checkboxland.extend(onClick);
+Checkboxland.extend(renderImage);
+Checkboxland.extend(renderVideo);
 export { Checkboxland };

dist-src/index.min.js

@@ -1,2 +0,2 @@
-import{Checkboxland}from"./checkboxland.js";import print from"./plugins/print/print.js";import marquee from"./plugins/marquee.js";import transitionWipe from"./plugins/transitionWipe.js";import dataUtils from"./plugins/dataUtils.js";import onClick from"./plugins/onClick.js";Checkboxland.extend(print),Checkboxland.extend(marquee),Checkboxland.extend(transitionWipe),Checkboxland.extend(dataUtils),Checkboxland.extend(onClick);export{Checkboxland};
+import{Checkboxland}from"./checkboxland.js";import print from"./plugins/print/print.js";import marquee from"./plugins/marquee.js";import transitionWipe from"./plugins/transitionWipe.js";import dataUtils from"./plugins/dataUtils.js";import onClick from"./plugins/onClick.js";import renderImage from"./plugins/media/renderImage.js";import renderVideo from"./plugins/media/renderVideo.js";Checkboxland.extend(print),Checkboxland.extend(marquee),Checkboxland.extend(transitionWipe),Checkboxland.extend(dataUtils),Checkboxland.extend(onClick),Checkboxland.extend(renderImage),Checkboxland.extend(renderVideo);export{Checkboxland};
 //# sourceMappingURL=index.min.js.map

dist-web/index.js

@@ -575,2 +575,185 @@ class Checkboxland {
 
+let canvasEl;
+let context;
+let grayscaleThreshold;
+function renderMediaAsCheckboxes(element, options = {}, checkboxland) {
+  if (!canvasEl) {
+    canvasEl = document.createElement('canvas');
+    context = canvasEl.getContext('2d');
+  }
+
+  grayscaleThreshold = (options.threshold || 50) / 100 * 255; // Create a tiny canvas. Each pixel on the canvas will represent a checkbox.
+
+  canvasEl.width = checkboxland.dimensions[0];
+  canvasEl.height = checkboxland.dimensions[1]; // Clear the canvas before applying a new image. We use a white rectangle
+  // in order for PNGs with transparency to appear over a white background
+  // (which seems to be most appropriate in the use-cases I can think of).
+
+  context.fillStyle = 'white';
+  context.fillRect(0, 0, canvasEl.width, canvasEl.height); // Determine the ideal dimensions for our media, such that it fills
+  // as much of the checkbox grid as possible without overflowing.
+
+  const [mediaWidth, mediaHeight] = getMediaDimensions(element);
+  const [width, height] = clampDimensions(mediaWidth, mediaHeight, canvasEl.width, canvasEl.height); // Draw the image on the tiny canvas (`drawImage` will scale the image
+  // as needed to make it fit the canvas).
+
+  context.drawImage(element, 0, 0, width, height); // Loop over the canvas pixels and convert them to black and white values.
+
+  const [_, pixelMatrix] = getBlackAndWhiteImageData(context, width, height);
+  checkboxland.setData(pixelMatrix, options);
+}
+
+function getMediaDimensions(mediaEl) {
+  let width = 0,
+      height = 0;
+
+  switch (mediaEl.tagName) {
+    case 'IMG':
+      width = mediaEl.width;
+      height = mediaEl.height;
+      break;
+
+    case 'VIDEO':
+      width = mediaEl.videoWidth;
+      height = mediaEl.videoHeight;
+      break;
+  }
+
+  return [width, height];
+}
+
+function clampDimensions(imageWidth, imageHeight, canvasWidth, canvasHeight) {
+  const heightRatio = imageHeight / canvasHeight;
+  const widthRatio = imageWidth / canvasWidth; // If the image is unconstrained (ie. very small images), return the dimensions as-is.
+
+  if (heightRatio < 1 && widthRatio < 1) {
+    return [imageWidth, imageHeight];
+  }
+
+  const getDimensionsClampedByHeight = () => {
+    const reducedWidth = Math.floor(imageWidth * canvasHeight / imageHeight);
+    return [reducedWidth, canvasHeight];
+  };
+
+  const getDimensionsClampedByWidth = () => {
+    const reducedHeight = Math.floor(imageHeight * canvasWidth / imageWidth);
+    return [canvasWidth, reducedHeight];
+  }; // Determine the most constrained dimension, and clamp accordingly.
+
+
+  return heightRatio > widthRatio ? getDimensionsClampedByHeight() : getDimensionsClampedByWidth();
+}
+
+function getBlackAndWhiteImageData(context, width, height) {
+  // These toGrayScale function values were borrowed from here:
+  // https://www.jonathan-petitcolas.com/2017/12/28/converting-image-to-ascii-art.html#turning-an-image-into-gray-colors
+  const toGrayScale = (r, g, b) => 0.21 * r + 0.72 * g + 0.07 * b;
+
+  const rgbaImageArray = context.getImageData(0, 0, width, height);
+  const pixelMatrix = [];
+
+  for (let i = 0; i < rgbaImageArray.data.length; i += 4) {
+    const r = rgbaImageArray.data[i];
+    const g = rgbaImageArray.data[i + 1];
+    const b = rgbaImageArray.data[i + 2];
+    const grayScaleVal = toGrayScale(r, g, b);
+    const thresholdedVal = grayScaleVal > grayscaleThreshold ? 255 : 0; // We overwrite the pixels with their black and white counterparts and
+    // return rgbaImageArray in case we ever want to preview it on a canvas.
+
+    rgbaImageArray.data[i] = thresholdedVal;
+    rgbaImageArray.data[i + 1] = thresholdedVal;
+    rgbaImageArray.data[i + 2] = thresholdedVal; // Note: we currently ignore the transparency value;
+
+    const pixelNum = i / 4;
+    const rowNumber = Math.floor(pixelNum / width);
+    const rowIndex = pixelNum % width;
+
+    if (rowIndex === 0) {
+      pixelMatrix[rowNumber] = [];
+    }
+
+    pixelMatrix[rowNumber][rowIndex] = grayScaleVal > grayscaleThreshold ? 0 : 1;
+  }
+
+  return [rgbaImageArray, pixelMatrix];
+}
+
+function renderImage(dataSource, options) {
+  const checkboxland = this;
+  let imageEl; // FOR PASSING A URL TO AN IMAGE
+
+  if (typeof dataSource === 'string') {
+    imageEl = new Image();
+    imageEl.crossOrigin = 'anonymous'; // allow cross-origin loading.
+
+    imageEl.addEventListener('load', () => renderMediaAsCheckboxes(imageEl, options, checkboxland), {
+      once: true
+    });
+    imageEl.src = dataSource;
+  } else // FOR PASSING AN <IMG> ELEMENT
+    if (typeof dataSource === 'object') {
+      if (dataSource.complete) {
+        renderMediaAsCheckboxes(dataSource, options, checkboxland);
+      } else {
+        dataSource.addEventListener('load', () => renderMediaAsCheckboxes(dataSource, options, checkboxland), {
+          once: true
+        });
+      }
+    }
+}
+
+var renderImage$1 = {
+  name: 'renderImage',
+  exec: renderImage
+};
+
+let refreshId;
+
+function renderVideo(dataSource, options) {
+  const checkboxland = this;
+  let videoEl; // FOR PASSING A URL TO A VIDEO
+
+  if (typeof dataSource === 'string') {
+    videoEl = document.createElement("video");
+    videoEl.loop = true;
+    videoEl.controls = true;
+    videoEl.autoplay = true;
+    videoEl.muted = true; // enables autoplay on iOS
+
+    videoEl.crossOrigin = 'anonymous'; // allow cross-origin loading.
+
+    videoEl.addEventListener('loadeddata', () => {
+      videoEl.play();
+      setVideoRenderLoop(videoEl, options, checkboxland);
+    }, {
+      once: true
+    });
+    videoEl.src = dataSource;
+  } else // FOR PASSING A <VIDEO> ELEMENT
+    if (typeof dataSource === 'object') {
+      if (dataSource.readyState === 4) {
+        setVideoRenderLoop(dataSource, options, checkboxland);
+      } else {
+        dataSource.addEventListener('loadeddata', () => setVideoRenderLoop(dataSource, options, checkboxland), {
+          once: true
+        });
+      }
+    }
+}
+
+function setVideoRenderLoop(videoElement, options, checkboxland) {
+  renderMediaAsCheckboxes(videoElement, options, checkboxland);
+  refreshId = requestAnimationFrame(() => setVideoRenderLoop(videoElement, options, checkboxland));
+}
+
+function cleanUp$3() {
+  cancelAnimationFrame(refreshId);
+}
+
+var renderVideo$1 = {
+  name: 'renderVideo',
+  exec: renderVideo,
+  cleanUp: cleanUp$3
+};
+
 Checkboxland.extend(print$1);
@@ -581,4 +764,6 @@ Checkboxland.extend(marquee$1);
 Checkboxland.extend(onClick$1);
+Checkboxland.extend(renderImage$1);
+Checkboxland.extend(renderVideo$1);
 
 export { Checkboxland };
 //# sourceMappingURL=index.js.map

dist-web/index.min.js

@@ -1,2 +0,2 @@
-class Checkboxland{constructor(e={}){void 0!==e.fillValue&&_checkForValidValue(e.fillValue),this.displayEl=document.querySelector(e.selector||"#checkboxland"),this.dimensions=_textDimensionsToArray(e.dimensions||"8x8"),this._data=this.getEmptyMatrix({fillValue:e.fillValue||0}),_createInitialCheckboxDisplay(this.displayEl,this._data)}getCheckboxValue(e,t){if(!(e>=0&&t>=0&&e<this.dimensions[0]&&t<this.dimensions[1]))throw new Error(`The location (x: ${e}, y: ${t}) is outside of this checkbox display`);return this._data[t][e]}setCheckboxValue(e,t,n){const i=e>=0&&t>=0&&e<this.dimensions[0]&&t<this.dimensions[1];if(_checkForValidValue(n),!i)return;this._data[t][e]=n;const a=this.displayEl.children[t].children[e];if(2===n){if(a.indeterminate)return;a.indeterminate=!0,a.checked=!1}else{if(a.indeterminate&&(a.indeterminate=!1),a.checked===Boolean(n))return;a.checked=Boolean(n)}}getData(){return this._data.map(e=>e.slice())}setData(e,t={}){const{x:n=0,y:i=0,fillValue:a}=t,l=void 0!==a,r=this.dimensions[0],o=this.dimensions[1];_checkForValidMatrix(e);for(let t=0;t<o;t++)for(let o=0;o<r;o++){let r=o<n,s=t<i,c=o>=n+e[0].length,d=t>=i+e.length,h=r||s||c||d;if(h&&!l)continue;let u=h?a:e[t-i][o-n];this.setCheckboxValue(o,t,u)}}clearData(){const e=this.getEmptyMatrix();this.setData(e)}getEmptyMatrix(e={}){const{fillValue:t=0,width:n=this.dimensions[0],height:i=this.dimensions[1]}=e,a=[];for(let e=0;e<i;e++){a[e]=[];for(let i=0;i<n;i++)a[e][i]=t}return a}static extend(e={}){const{name:t,exec:n,cleanUp:i}=e;if(!t||!n)throw new Error('Your plugin must have a "name" and an "exec" function.');i&&(n.cleanUp=i),this.prototype[t]=n}}function _checkForValidValue(e){if(0!==e&&1!==e&&2!==e)throw new Error(`${e} is not a valid checkbox value.`)}function _checkForValidMatrix(e){if(!Array.isArray(e)||!Array.isArray(e[0]))throw new Error(`${e} is not a valid matrix.`)}function _textDimensionsToArray(e){const t="The dimensions you provided are invalid.";if("string"!=typeof e)throw new Error(t);const n=e.split("x").map(e=>Number(e));if(!(2===n.length&&!isNaN(n[0])&&!isNaN(n[0])))throw new Error(t);return e.split("x").map(e=>Number(e))}function _createInitialCheckboxDisplay(e,t){e.innerHTML="",e.style.overflowX="auto",e.setAttribute("aria-hidden",!0),t.forEach(t=>{const n=document.createElement("div");n.style.lineHeight=.75,n.style.whiteSpace="nowrap",t.forEach(e=>{const t=document.createElement("input"),i=2===e,a=!i&&Boolean(e);t.style.margin=0,t.style.verticalAlign="top",t.type="checkbox",t.tabIndex="-1",t.checked=a,t.indeterminate=i,n.appendChild(t)}),e.appendChild(n)})}const fiveBySeven={0:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,1,1],[1,0,1,0,1],[1,1,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],1:[[0,1,0],[1,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],2:[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],3:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,1,0],[0,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],4:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,0,0,0,1],[0,0,0,0,1]],5:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,0],[0,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],6:[[0,0,1,1,0],[0,1,0,0,0],[1,0,0,0,0],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],7:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,0]],8:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],9:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,1,1,0,0]],":":[[0],[1],[0],[0],[0],[1],[0]]," ":[[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0]],A:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,1],[1,0,0,0,1]],B:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0]],C:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,1],[0,1,1,1,0]],D:[[1,1,1,0,0],[1,0,0,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,1,0],[1,1,1,0,0]],E:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],F:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],G:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,0],[1,0,1,1,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1]],H:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],I:[[1,1,1],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],J:[[0,0,1,1,1],[0,0,0,1,0],[0,0,0,1,0],[0,0,0,1,0],[0,0,0,1,0],[1,0,0,1,0],[0,1,1,0,0]],K:[[1,0,0,0,1],[1,0,0,1,0],[1,0,1,0,0],[1,1,0,0,0],[1,0,1,0,0],[1,0,0,1,0],[1,0,0,0,1]],L:[[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],M:[[1,0,0,0,1],[1,1,0,1,1],[1,0,1,0,1],[1,0,1,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],N:[[1,0,0,0,1],[1,0,0,0,1],[1,1,0,0,1],[1,0,1,0,1],[1,0,0,1,1],[1,0,0,0,1],[1,0,0,0,1]],O:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],P:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],Q:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,0,1,0],[0,1,1,0,1]],R:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],S:[[0,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[0,0,0,0,1],[1,1,1,1,0]],T:[[1,1,1,1,1],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0]],U:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],V:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0]],W:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,0,1,0]],X:[[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1],[1,0,0,0,1]],Y:[[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0]],Z:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],a:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[0,1,1,1,1],[1,0,0,0,1],[1,1,1,1,1]],b:[[1,0,0,0,0],[1,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0]],c:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,1],[0,1,1,1,0]],d:[[0,0,0,0,1],[0,0,0,0,1],[0,1,1,0,1],[1,0,0,1,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1]],e:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,0],[0,1,1,1,0]],f:[[0,0,1,1,0],[0,1,0,0,1],[0,1,0,0,0],[1,1,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,0]],g:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,1,1,1,0]],h:[[1,0,0,0,0],[1,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],i:[[0,1,0],[0,0,0],[1,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],j:[[0,0,0,1],[0,0,0,0],[0,0,1,1],[0,0,0,1],[0,0,0,1],[1,0,0,1],[0,1,1,0]],k:[[1,0,0,0],[1,0,0,0],[1,0,0,1],[1,0,1,0],[1,1,0,0],[1,0,1,0],[1,0,0,1]],l:[[1,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],m:[[0,0,0,0,0],[0,0,0,0,0],[1,1,0,1,0],[1,0,1,0,1],[1,0,1,0,1],[1,0,0,0,1],[1,0,0,0,1]],n:[[0,0,0,0,0],[0,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],o:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],p:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,0],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0]],q:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,0,1],[1,0,0,1,1],[1,1,1,1,1],[0,0,0,0,1],[0,0,0,0,1]],r:[[0,0,0,0,0],[0,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],s:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[1,1,1,1,0]],t:[[0,1,0,0,0],[0,1,0,0,0],[1,1,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,1],[0,0,1,1,0]],u:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,1,1],[0,1,1,0,1]],v:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0]],w:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,0,1,0]],x:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1]],y:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,1,1,1,0]],z:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,1,1,1,1]],"`":[[1,0,0],[0,1,0],[0,0,1],[0,0,0],[0,0,0],[0,0,0],[0,0,0]],"~":[[0,0,0,0,0],[0,0,0,0,0],[0,1,0,0,0],[1,0,1,0,1],[0,0,0,1,0],[0,0,0,0,0],[0,0,0,0,0]],"!":[[1],[1],[1],[1],[1],[0],[1]],"@":[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,1,1,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,1,1,0]],"#":[[0,1,0,1,0],[0,1,0,1,0],[1,1,1,1,1],[0,1,0,1,0],[1,1,1,1,1],[0,1,0,1,0],[0,1,0,1,0]],$:[[0,0,1,0,0],[0,1,1,1,1],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[1,1,1,1,0],[0,0,1,0,0]],"%":[[1,1,0,0,1],[1,1,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,0,0,1,1],[1,0,0,1,1]],"^":[[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]],"&":[[0,1,1,0,0],[1,0,0,1,0],[1,0,1,0,0],[0,1,0,0,0],[1,0,1,0,1],[1,0,0,1,0],[1,1,1,0,1]],"*":[[0,0,0,0,0],[0,0,1,0,0],[1,0,1,0,1],[0,1,1,1,0],[1,0,1,0,1],[0,0,1,0,0],[0,0,0,0,0]],"(":[[0,0,1],[0,1,0],[1,0,0],[1,0,0],[1,0,0],[0,1,0],[0,0,1]],")":[[1,0,0],[0,1,0],[0,0,1],[0,0,1],[0,0,1],[0,1,0],[1,0,0]],"-":[[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]],_:[[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1]],"+":[[0,0,0,0,0],[0,0,1,0,0],[0,0,1,0,0],[1,1,1,1,1],[0,0,1,0,0],[0,0,1,0,0],[0,0,0,0,0]],"=":[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[0,0,0,0,0]],"[":[[1,1,1],[1,0,0],[1,0,0],[1,0,0],[1,0,0],[1,0,0],[1,1,1]],"]":[[1,1,1],[0,0,1],[0,0,1],[0,0,1],[0,0,1],[0,0,1],[1,1,1]],"{":[[0,0,1],[0,1,0],[0,1,0],[1,0,0],[0,1,0],[0,1,0],[0,0,1]],"}":[[1,0,0],[0,1,0],[0,1,0],[0,0,1],[0,1,0],[0,1,0],[1,0,0]],"|":[[1],[1],[1],[1],[1],[1],[1]],"\\":[[1,0,0],[1,0,0],[0,1,0],[0,1,0],[0,1,0],[0,0,1],[0,0,1]],"/":[[0,0,1],[0,0,1],[0,1,0],[0,1,0],[0,1,0],[1,0,0],[1,0,0]],";":[[0,0],[0,1],[0,1],[0,0],[0,0],[0,1],[1,0]],'"':[[1,0,1],[1,0,1],[1,0,1],[0,0,0],[0,0,0],[0,0,0],[0,0,0]],"'":[[1,1],[0,1],[1,0],[0,0],[0,0],[0,0],[0,0]],",":[[0,0],[0,0],[0,0],[0,0],[1,1],[0,1],[1,0]],".":[[0],[0],[0],[0],[0],[0],[1]],"<":[[0,0,0],[0,0,1],[0,1,0],[1,0,0],[0,1,0],[0,0,1],[0,0,0]],">":[[0,0,0],[1,0,0],[0,1,0],[0,0,1],[0,1,0],[1,0,0],[0,0,0]],"?":[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,0,0,0,0],[0,0,1,0,0]]};function print(e,t={}){const{dataOnly:n=!1,font:i=fiveBySeven,x:a=0,y:l=0,fillValue:r}=t,o=void 0!==r,s=e.split("").reduce((e,t)=>{return _matrixConcat(e,i[t])},[]);if(0===s.length&&s.push([]),n){if(!o)return s;let e=this.getEmptyMatrix({fillValue:r});return s.forEach((t,n)=>{t.forEach((t,i)=>{e[n+l][i+a]=t})}),e}this.setData(s,{x:a,y:l,fillValue:r})}function _matrixConcat(e,t){if(0===e.length)return t;const n=[];return e.forEach((e,i)=>{n.push(e.concat([0]).concat(t[i]))}),n}var print$1={name:"print",exec:print};let intervalId;function marquee(e,t={}){const{interval:n=200,repeat:i=!1,fillValue:a=0,callback:l=(()=>{})}=t,r=this.dimensions[1],o=this.dimensions[0],s=o+e[0].length;let c=1;intervalId=setInterval(()=>{const t=this.getData();for(let n=0;n<r;n++)for(let i=0;i<o;i++){if(i+1===o){const t=c-(o-i),l=e[n]?void 0===e[n][t]?a:e[n][t]:a;this.setCheckboxValue(i,n,l)}else this.setCheckboxValue(i,n,t[n][i+1])}c===s?i?c=1:(clearInterval(intervalId),l()):c++},n)}function cleanUp(){clearInterval(intervalId)}var marquee$1={name:"marquee",exec:marquee,cleanUp:cleanUp};let intervalId$1;function transitionWipe(e,t={}){const{interval:n=200,fillValue:i=0,direction:a="ltr",callback:l=(()=>{})}=t,r=this.dimensions[1],o=this.dimensions[0],s=o+1;let c=1;intervalId$1=setInterval(()=>{let t,n;switch(a){case"ltr":n=(t=c-1)-1;break;case"rtl":n=(t=o-c)+1}for(let a=0;a<r;a++)for(let l=0;l<o;l++)if(l===t)this.setCheckboxValue(l,a,1);else if(l===n){let t=e[a]?void 0===e[a][l]?i:e[a][l]:i;this.setCheckboxValue(l,a,t)}c===s?(clearInterval(intervalId$1),l()):c++},n)}function cleanUp$1(){clearInterval(intervalId$1)}var transitionWipe$1={name:"transitionWipe",exec:transitionWipe,cleanUp:cleanUp$1};function dataUtils(e,t,n){return{invert:invert,pad:pad}[e](t,n)}function invert(e){return e.map(e=>e.map(e=>e?0:1))}function pad(e,t={}){const n=Number.isInteger(t.all),i=n?t.all:t.top,a=n?t.all:t.right,l=n?t.all:t.bottom,r=n?t.all:t.left;let o=e.map(e=>{let t=e;return r&&(t=[...Array(r).fill(0),...t]),a&&(t=[...t,...Array(a).fill(0)]),t});const s=o[0].length,c=(e,t)=>{const n=[];for(let i=0;i<e;i++)n.push(Array(t).fill(0));return n};return i&&(o=[...c(i,s),...o]),l&&(o=[...o,...c(l,s)]),o}var dataUtils$1={name:"dataUtils",exec:dataUtils};let handleFun=null,displayEl=null;function onClick(e){displayEl=this.displayEl,handleFun=handleEvent.bind(this,e),displayEl.addEventListener("click",handleFun)}function handleEvent(e,t){const n=findCoodrs(displayEl,t.target);if(!n)return;const i={x:n.x,y:n.y,checkbox:t.target};if("function"==typeof e)e(i);else{if(!("handleEvent"in e&&"function"==typeof e.handleEvent))throw new TypeError("Callback should be a function or an EventListener object");e.handleEvent(i)}}function findCoodrs(e,t){for(let n=0;n<e.children.length;n+=1){const i=e.children[n];for(let e=0;e<i.children.length;e+=1){if(i.children[e]===t)return{x:e,y:n}}}return null}function cleanUp$2(){displayEl.removeEventListener("click",handleFun)}var onClick$1={name:"onClick",exec:onClick,cleanUp:cleanUp$2};Checkboxland.extend(print$1),Checkboxland.extend(marquee$1),Checkboxland.extend(transitionWipe$1),Checkboxland.extend(dataUtils$1),Checkboxland.extend(onClick$1);export{Checkboxland};
+class Checkboxland{constructor(e={}){void 0!==e.fillValue&&_checkForValidValue(e.fillValue),this.displayEl=document.querySelector(e.selector||"#checkboxland"),this.dimensions=_textDimensionsToArray(e.dimensions||"8x8"),this._data=this.getEmptyMatrix({fillValue:e.fillValue||0}),_createInitialCheckboxDisplay(this.displayEl,this._data)}getCheckboxValue(e,t){if(!(e>=0&&t>=0&&e<this.dimensions[0]&&t<this.dimensions[1]))throw new Error(`The location (x: ${e}, y: ${t}) is outside of this checkbox display`);return this._data[t][e]}setCheckboxValue(e,t,n){const a=e>=0&&t>=0&&e<this.dimensions[0]&&t<this.dimensions[1];if(_checkForValidValue(n),!a)return;this._data[t][e]=n;const i=this.displayEl.children[t].children[e];if(2===n){if(i.indeterminate)return;i.indeterminate=!0,i.checked=!1}else{if(i.indeterminate&&(i.indeterminate=!1),i.checked===Boolean(n))return;i.checked=Boolean(n)}}getData(){return this._data.map(e=>e.slice())}setData(e,t={}){const{x:n=0,y:a=0,fillValue:i}=t,r=void 0!==i,l=this.dimensions[0],o=this.dimensions[1];_checkForValidMatrix(e);for(let t=0;t<o;t++)for(let o=0;o<l;o++){let l=o<n,s=t<a,c=o>=n+e[0].length,d=t>=a+e.length,h=l||s||c||d;if(h&&!r)continue;let u=h?i:e[t-a][o-n];this.setCheckboxValue(o,t,u)}}clearData(){const e=this.getEmptyMatrix();this.setData(e)}getEmptyMatrix(e={}){const{fillValue:t=0,width:n=this.dimensions[0],height:a=this.dimensions[1]}=e,i=[];for(let e=0;e<a;e++){i[e]=[];for(let a=0;a<n;a++)i[e][a]=t}return i}static extend(e={}){const{name:t,exec:n,cleanUp:a}=e;if(!t||!n)throw new Error('Your plugin must have a "name" and an "exec" function.');a&&(n.cleanUp=a),this.prototype[t]=n}}function _checkForValidValue(e){if(0!==e&&1!==e&&2!==e)throw new Error(`${e} is not a valid checkbox value.`)}function _checkForValidMatrix(e){if(!Array.isArray(e)||!Array.isArray(e[0]))throw new Error(`${e} is not a valid matrix.`)}function _textDimensionsToArray(e){const t="The dimensions you provided are invalid.";if("string"!=typeof e)throw new Error(t);const n=e.split("x").map(e=>Number(e));if(!(2===n.length&&!isNaN(n[0])&&!isNaN(n[0])))throw new Error(t);return e.split("x").map(e=>Number(e))}function _createInitialCheckboxDisplay(e,t){e.innerHTML="",e.style.overflowX="auto",e.setAttribute("aria-hidden",!0),t.forEach(t=>{const n=document.createElement("div");n.style.lineHeight=.75,n.style.whiteSpace="nowrap",t.forEach(e=>{const t=document.createElement("input"),a=2===e,i=!a&&Boolean(e);t.style.margin=0,t.style.verticalAlign="top",t.type="checkbox",t.tabIndex="-1",t.checked=i,t.indeterminate=a,n.appendChild(t)}),e.appendChild(n)})}const fiveBySeven={0:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,1,1],[1,0,1,0,1],[1,1,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],1:[[0,1,0],[1,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],2:[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],3:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,1,0],[0,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],4:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,0,0,0,1],[0,0,0,0,1]],5:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,0],[0,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],6:[[0,0,1,1,0],[0,1,0,0,0],[1,0,0,0,0],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],7:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,0]],8:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],9:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,1,1,0,0]],":":[[0],[1],[0],[0],[0],[1],[0]]," ":[[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0]],A:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,1],[1,0,0,0,1]],B:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0]],C:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,1],[0,1,1,1,0]],D:[[1,1,1,0,0],[1,0,0,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,1,0],[1,1,1,0,0]],E:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],F:[[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],G:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,0],[1,0,1,1,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1]],H:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],I:[[1,1,1],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],J:[[0,0,1,1,1],[0,0,0,1,0],[0,0,0,1,0],[0,0,0,1,0],[0,0,0,1,0],[1,0,0,1,0],[0,1,1,0,0]],K:[[1,0,0,0,1],[1,0,0,1,0],[1,0,1,0,0],[1,1,0,0,0],[1,0,1,0,0],[1,0,0,1,0],[1,0,0,0,1]],L:[[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],M:[[1,0,0,0,1],[1,1,0,1,1],[1,0,1,0,1],[1,0,1,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],N:[[1,0,0,0,1],[1,0,0,0,1],[1,1,0,0,1],[1,0,1,0,1],[1,0,0,1,1],[1,0,0,0,1],[1,0,0,0,1]],O:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],P:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],Q:[[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,0,1,0],[0,1,1,0,1]],R:[[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],S:[[0,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[0,0,0,0,1],[1,1,1,1,0]],T:[[1,1,1,1,1],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0]],U:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],V:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0]],W:[[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,0,1,0]],X:[[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1],[1,0,0,0,1]],Y:[[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0],[0,0,1,0,0]],Z:[[1,1,1,1,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,0,0,0,0],[1,1,1,1,1]],a:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[0,1,1,1,1],[1,0,0,0,1],[1,1,1,1,1]],b:[[1,0,0,0,0],[1,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,0]],c:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,1],[0,1,1,1,0]],d:[[0,0,0,0,1],[0,0,0,0,1],[0,1,1,0,1],[1,0,0,1,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1]],e:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,0],[0,1,1,1,0]],f:[[0,0,1,1,0],[0,1,0,0,1],[0,1,0,0,0],[1,1,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,0]],g:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,1,1,1,0]],h:[[1,0,0,0,0],[1,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],i:[[0,1,0],[0,0,0],[1,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],j:[[0,0,0,1],[0,0,0,0],[0,0,1,1],[0,0,0,1],[0,0,0,1],[1,0,0,1],[0,1,1,0]],k:[[1,0,0,0],[1,0,0,0],[1,0,0,1],[1,0,1,0],[1,1,0,0],[1,0,1,0],[1,0,0,1]],l:[[1,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[0,1,0],[1,1,1]],m:[[0,0,0,0,0],[0,0,0,0,0],[1,1,0,1,0],[1,0,1,0,1],[1,0,1,0,1],[1,0,0,0,1],[1,0,0,0,1]],n:[[0,0,0,0,0],[0,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1]],o:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,0]],p:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,0],[1,0,0,0,1],[1,1,1,1,1],[1,0,0,0,0],[1,0,0,0,0]],q:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,0,1],[1,0,0,1,1],[1,1,1,1,1],[0,0,0,0,1],[0,0,0,0,1]],r:[[0,0,0,0,0],[0,0,0,0,0],[1,0,1,1,0],[1,1,0,0,1],[1,0,0,0,0],[1,0,0,0,0],[1,0,0,0,0]],s:[[0,0,0,0,0],[0,0,0,0,0],[0,1,1,1,0],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[1,1,1,1,0]],t:[[0,1,0,0,0],[0,1,0,0,0],[1,1,1,0,0],[0,1,0,0,0],[0,1,0,0,0],[0,1,0,0,1],[0,0,1,1,0]],u:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,1,1],[0,1,1,0,1]],v:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0]],w:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,0,1,0]],x:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[0,1,0,1,0],[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1]],y:[[0,0,0,0,0],[0,0,0,0,0],[1,0,0,0,1],[1,0,0,0,1],[0,1,1,1,1],[0,0,0,0,1],[0,1,1,1,0]],z:[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,1,1,1,1]],"`":[[1,0,0],[0,1,0],[0,0,1],[0,0,0],[0,0,0],[0,0,0],[0,0,0]],"~":[[0,0,0,0,0],[0,0,0,0,0],[0,1,0,0,0],[1,0,1,0,1],[0,0,0,1,0],[0,0,0,0,0],[0,0,0,0,0]],"!":[[1],[1],[1],[1],[1],[0],[1]],"@":[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,1,1,0,1],[1,0,1,0,1],[1,0,1,0,1],[0,1,1,1,0]],"#":[[0,1,0,1,0],[0,1,0,1,0],[1,1,1,1,1],[0,1,0,1,0],[1,1,1,1,1],[0,1,0,1,0],[0,1,0,1,0]],$:[[0,0,1,0,0],[0,1,1,1,1],[1,0,0,0,0],[0,1,1,1,0],[0,0,0,0,1],[1,1,1,1,0],[0,0,1,0,0]],"%":[[1,1,0,0,1],[1,1,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,1,0,0,0],[1,0,0,1,1],[1,0,0,1,1]],"^":[[0,0,1,0,0],[0,1,0,1,0],[1,0,0,0,1],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]],"&":[[0,1,1,0,0],[1,0,0,1,0],[1,0,1,0,0],[0,1,0,0,0],[1,0,1,0,1],[1,0,0,1,0],[1,1,1,0,1]],"*":[[0,0,0,0,0],[0,0,1,0,0],[1,0,1,0,1],[0,1,1,1,0],[1,0,1,0,1],[0,0,1,0,0],[0,0,0,0,0]],"(":[[0,0,1],[0,1,0],[1,0,0],[1,0,0],[1,0,0],[0,1,0],[0,0,1]],")":[[1,0,0],[0,1,0],[0,0,1],[0,0,1],[0,0,1],[0,1,0],[1,0,0]],"-":[[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]],_:[[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1]],"+":[[0,0,0,0,0],[0,0,1,0,0],[0,0,1,0,0],[1,1,1,1,1],[0,0,1,0,0],[0,0,1,0,0],[0,0,0,0,0]],"=":[[0,0,0,0,0],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[1,1,1,1,1],[0,0,0,0,0],[0,0,0,0,0]],"[":[[1,1,1],[1,0,0],[1,0,0],[1,0,0],[1,0,0],[1,0,0],[1,1,1]],"]":[[1,1,1],[0,0,1],[0,0,1],[0,0,1],[0,0,1],[0,0,1],[1,1,1]],"{":[[0,0,1],[0,1,0],[0,1,0],[1,0,0],[0,1,0],[0,1,0],[0,0,1]],"}":[[1,0,0],[0,1,0],[0,1,0],[0,0,1],[0,1,0],[0,1,0],[1,0,0]],"|":[[1],[1],[1],[1],[1],[1],[1]],"\\":[[1,0,0],[1,0,0],[0,1,0],[0,1,0],[0,1,0],[0,0,1],[0,0,1]],"/":[[0,0,1],[0,0,1],[0,1,0],[0,1,0],[0,1,0],[1,0,0],[1,0,0]],";":[[0,0],[0,1],[0,1],[0,0],[0,0],[0,1],[1,0]],'"':[[1,0,1],[1,0,1],[1,0,1],[0,0,0],[0,0,0],[0,0,0],[0,0,0]],"'":[[1,1],[0,1],[1,0],[0,0],[0,0],[0,0],[0,0]],",":[[0,0],[0,0],[0,0],[0,0],[1,1],[0,1],[1,0]],".":[[0],[0],[0],[0],[0],[0],[1]],"<":[[0,0,0],[0,0,1],[0,1,0],[1,0,0],[0,1,0],[0,0,1],[0,0,0]],">":[[0,0,0],[1,0,0],[0,1,0],[0,0,1],[0,1,0],[1,0,0],[0,0,0]],"?":[[0,1,1,1,0],[1,0,0,0,1],[0,0,0,0,1],[0,0,0,1,0],[0,0,1,0,0],[0,0,0,0,0],[0,0,1,0,0]]};function print(e,t={}){const{dataOnly:n=!1,font:a=fiveBySeven,x:i=0,y:r=0,fillValue:l}=t,o=void 0!==l,s=e.split("").reduce((e,t)=>{return _matrixConcat(e,a[t])},[]);if(0===s.length&&s.push([]),n){if(!o)return s;let e=this.getEmptyMatrix({fillValue:l});return s.forEach((t,n)=>{t.forEach((t,a)=>{e[n+r][a+i]=t})}),e}this.setData(s,{x:i,y:r,fillValue:l})}function _matrixConcat(e,t){if(0===e.length)return t;const n=[];return e.forEach((e,a)=>{n.push(e.concat([0]).concat(t[a]))}),n}var print$1={name:"print",exec:print};let intervalId;function marquee(e,t={}){const{interval:n=200,repeat:a=!1,fillValue:i=0,callback:r=(()=>{})}=t,l=this.dimensions[1],o=this.dimensions[0],s=o+e[0].length;let c=1;intervalId=setInterval(()=>{const t=this.getData();for(let n=0;n<l;n++)for(let a=0;a<o;a++){if(a+1===o){const t=c-(o-a),r=e[n]?void 0===e[n][t]?i:e[n][t]:i;this.setCheckboxValue(a,n,r)}else this.setCheckboxValue(a,n,t[n][a+1])}c===s?a?c=1:(clearInterval(intervalId),r()):c++},n)}function cleanUp(){clearInterval(intervalId)}var marquee$1={name:"marquee",exec:marquee,cleanUp:cleanUp};let intervalId$1;function transitionWipe(e,t={}){const{interval:n=200,fillValue:a=0,direction:i="ltr",callback:r=(()=>{})}=t,l=this.dimensions[1],o=this.dimensions[0],s=o+1;let c=1;intervalId$1=setInterval(()=>{let t,n;switch(i){case"ltr":n=(t=c-1)-1;break;case"rtl":n=(t=o-c)+1}for(let i=0;i<l;i++)for(let r=0;r<o;r++)if(r===t)this.setCheckboxValue(r,i,1);else if(r===n){let t=e[i]?void 0===e[i][r]?a:e[i][r]:a;this.setCheckboxValue(r,i,t)}c===s?(clearInterval(intervalId$1),r()):c++},n)}function cleanUp$1(){clearInterval(intervalId$1)}var transitionWipe$1={name:"transitionWipe",exec:transitionWipe,cleanUp:cleanUp$1};function dataUtils(e,t,n){return{invert:invert,pad:pad}[e](t,n)}function invert(e){return e.map(e=>e.map(e=>e?0:1))}function pad(e,t={}){const n=Number.isInteger(t.all),a=n?t.all:t.top,i=n?t.all:t.right,r=n?t.all:t.bottom,l=n?t.all:t.left;let o=e.map(e=>{let t=e;return l&&(t=[...Array(l).fill(0),...t]),i&&(t=[...t,...Array(i).fill(0)]),t});const s=o[0].length,c=(e,t)=>{const n=[];for(let a=0;a<e;a++)n.push(Array(t).fill(0));return n};return a&&(o=[...c(a,s),...o]),r&&(o=[...o,...c(r,s)]),o}var dataUtils$1={name:"dataUtils",exec:dataUtils};let handleFun=null,displayEl=null;function onClick(e){displayEl=this.displayEl,handleFun=handleEvent.bind(this,e),displayEl.addEventListener("click",handleFun)}function handleEvent(e,t){const n=findCoodrs(displayEl,t.target);if(!n)return;const a={x:n.x,y:n.y,checkbox:t.target};if("function"==typeof e)e(a);else{if(!("handleEvent"in e&&"function"==typeof e.handleEvent))throw new TypeError("Callback should be a function or an EventListener object");e.handleEvent(a)}}function findCoodrs(e,t){for(let n=0;n<e.children.length;n+=1){const a=e.children[n];for(let e=0;e<a.children.length;e+=1){if(a.children[e]===t)return{x:e,y:n}}}return null}function cleanUp$2(){displayEl.removeEventListener("click",handleFun)}var onClick$1={name:"onClick",exec:onClick,cleanUp:cleanUp$2};let canvasEl,context,grayscaleThreshold;function renderMediaAsCheckboxes(e,t={},n){canvasEl||(canvasEl=document.createElement("canvas"),context=canvasEl.getContext("2d")),grayscaleThreshold=(t.threshold||50)/100*255,canvasEl.width=n.dimensions[0],canvasEl.height=n.dimensions[1],context.fillStyle="white",context.fillRect(0,0,canvasEl.width,canvasEl.height);const[a,i]=getMediaDimensions(e),[r,l]=clampDimensions(a,i,canvasEl.width,canvasEl.height);context.drawImage(e,0,0,r,l);const[o,s]=getBlackAndWhiteImageData(context,r,l);n.setData(s,t)}function getMediaDimensions(e){let t=0,n=0;switch(e.tagName){case"IMG":t=e.width,n=e.height;break;case"VIDEO":t=e.videoWidth,n=e.videoHeight}return[t,n]}function clampDimensions(e,t,n,a){const i=t/a,r=e/n;if(i<1&&r<1)return[e,t];return i>r?[Math.floor(e*a/t),a]:(()=>{const a=Math.floor(t*n/e);return[n,a]})()}function getBlackAndWhiteImageData(e,t,n){const a=(e,t,n)=>.21*e+.72*t+.07*n,i=e.getImageData(0,0,t,n),r=[];for(let e=0;e<i.data.length;e+=4){const n=a(i.data[e],i.data[e+1],i.data[e+2]),l=n>grayscaleThreshold?255:0;i.data[e]=l,i.data[e+1]=l,i.data[e+2]=l;const o=e/4,s=Math.floor(o/t),c=o%t;0===c&&(r[s]=[]),r[s][c]=n>grayscaleThreshold?0:1}return[i,r]}function renderImage(e,t){const n=this;let a;"string"==typeof e?((a=new Image).crossOrigin="anonymous",a.addEventListener("load",()=>renderMediaAsCheckboxes(a,t,n),{once:!0}),a.src=e):"object"==typeof e&&(e.complete?renderMediaAsCheckboxes(e,t,n):e.addEventListener("load",()=>renderMediaAsCheckboxes(e,t,n),{once:!0}))}var renderImage$1={name:"renderImage",exec:renderImage};let refreshId;function renderVideo(e,t){const n=this;let a;"string"==typeof e?((a=document.createElement("video")).loop=!0,a.controls=!0,a.autoplay=!0,a.muted=!0,a.crossOrigin="anonymous",a.addEventListener("loadeddata",()=>{a.play(),setVideoRenderLoop(a,t,n)},{once:!0}),a.src=e):"object"==typeof e&&(4===e.readyState?setVideoRenderLoop(e,t,n):e.addEventListener("loadeddata",()=>setVideoRenderLoop(e,t,n),{once:!0}))}function setVideoRenderLoop(e,t,n){renderMediaAsCheckboxes(e,t,n),refreshId=requestAnimationFrame(()=>setVideoRenderLoop(e,t,n))}function cleanUp$3(){cancelAnimationFrame(refreshId)}var renderVideo$1={name:"renderVideo",exec:renderVideo,cleanUp:cleanUp$3};Checkboxland.extend(print$1),Checkboxland.extend(marquee$1),Checkboxland.extend(transitionWipe$1),Checkboxland.extend(dataUtils$1),Checkboxland.extend(onClick$1),Checkboxland.extend(renderImage$1),Checkboxland.extend(renderVideo$1);export{Checkboxland};
 //# sourceMappingURL=index.min.js.map

package.json

 {
   "name": "checkboxland",
   "description": "Render anything as HTML checkboxes",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "license": "MIT",
@@ -6,0 +6,0 @@ "files": [

No alert changes

Improved metrics

Total package byte prevSize

212342

increased by18.08%

Number of package files

32

increased by23.08%

Lines of code

1617

increased by25.06%

No dependency changes