@makefully/notefully 0.1.32 → 0.1.34
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.
- package/dist/notefully.css +1 -1
- package/dist/notefully.iife.js +13 -13
- package/dist/notefully.js +33 -33
- package/package.json +1 -1
package/dist/notefully.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
#notefully{all:initial;--nf-launcher-left: 16px;--nf-launcher-bottom: 16px;--nf-radius: 10px;--nf-z: 2147483000;--nf-accent: #864093;--nf-accent-text: #ffffff;--nf-accent-hot: #e83590;--nf-btn: #864093;--nf-btn-border: #382c74;--nf-btn-text: #ffffff;--nf-panel: #f7f4fb;--nf-text: #2a2140;--nf-muted: rgba(42, 33, 64, .72);--nf-input: #efe8f8;--nf-border: rgba(56, 44, 116, .18);--nf-backdrop: rgba(20, 12, 28, .55);--nf-danger: #e83590;--nf-success: #1a7a3c;--nf-fail: #c2185b;--nf-mark: #fdd341;--nf-mark-text: #2a2140;--nf-canvas-bg: #111;font-family:ui-sans-serif,system-ui,sans-serif;color:var(--nf-text)}#notefully[data-theme=maker]{--nf-accent: #864093;--nf-accent-text: #ffffff;--nf-accent-hot: #e83590;--nf-btn: #864093;--nf-btn-border: #382c74;--nf-btn-text: #ffffff;--nf-panel: #f7f4fb;--nf-text: #2a2140;--nf-muted: rgba(42, 33, 64, .72);--nf-input: #efe8f8;--nf-border: rgba(56, 44, 116, .18);--nf-backdrop: rgba(20, 12, 28, .55);--nf-danger: #e83590;--nf-success: #1a7a3c;--nf-fail: #c2185b;--nf-mark: #fdd341;--nf-mark-text: #2a2140}#notefully[data-theme=all-business]{--nf-accent: #5c6570;--nf-accent-text: #ffffff;--nf-accent-hot: #8a4a4a;--nf-btn: #5c6570;--nf-btn-border: #3a4048;--nf-btn-text: #ffffff;--nf-panel: #ffffff;--nf-text: #1f1f23;--nf-muted: rgba(31, 31, 35, .68);--nf-input: #f0f0f2;--nf-border: rgba(0, 0, 0, .14);--nf-backdrop: rgba(20, 20, 24, .4);--nf-danger: #8a4a4a;--nf-success: #1f7a3a;--nf-fail: #b42318;--nf-mark: #3d6ea8;--nf-mark-text: #ffffff}#notefully[data-theme=brighter-day]{--nf-accent: #5aa8dc;--nf-accent-text: #ffffff;--nf-accent-hot: #f08ab8;--nf-btn: #5aa8dc;--nf-btn-border: #3d7eae;--nf-btn-text: #ffffff;--nf-panel: #fffdf6;--nf-text: #2a2440;--nf-muted: rgba(42, 36, 64, .68);--nf-input: #ffeef5;--nf-border: rgba(90, 168, 220, .28);--nf-backdrop: rgba(60, 40, 70, .35);--nf-danger: #f08ab8;--nf-success: #1f7a3a;--nf-fail: #c4476a;--nf-mark: #5aa8dc;--nf-mark-text: #ffffff}#notefully[data-theme=quiet-night]{--nf-accent: #c4aa5a;--nf-accent-text: #121416;--nf-accent-hot: #6e3a3a;--nf-btn: #3a4048;--nf-btn-border: #0e1012;--nf-btn-text: #d8dbe0;--nf-panel: #1c1f24;--nf-text: #d8dbe0;--nf-muted: rgba(216, 219, 224, .68);--nf-input: #262a30;--nf-border: rgba(255, 255, 255, .12);--nf-backdrop: rgba(0, 0, 0, .65);--nf-danger: #c88888;--nf-success: #7dcea0;--nf-fail: #e89898;--nf-mark: #c4aa5a;--nf-mark-text: #121416}#notefully *{box-sizing:border-box}#notefully .nf-launcher{position:fixed;left:var(--nf-launcher-left);bottom:var(--nf-launcher-bottom);z-index:var(--nf-z);width:48px;height:48px;padding:0;display:grid;place-items:center;background:var(--nf-btn);color:var(--nf-btn-text);border:1px solid var(--nf-btn-border);border-radius:999px;cursor:pointer;box-shadow:0 8px 24px #00000040}#notefully .nf-launcher-icon{width:22px;height:22px;display:block}#notefully .nf-launcher[hidden],#notefully .nf-dialog[hidden],#notefully .nf-stop-video[hidden],#notefully .nf-stage[hidden],#notefully .nf-reset-crop[hidden],#notefully .nf-restore[hidden],#notefully .nf-video[hidden],#notefully .nf-author[hidden]{display:none!important}#notefully .nf-dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--nf-z);background:var(--nf-backdrop);display:flex;align-items:center;justify-content:center;padding:24px}#notefully .nf-panel{width:min(920px,100%);max-height:calc(100vh - 48px);overflow:auto;background:var(--nf-panel);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:var(--nf-radius);padding:16px;display:flex;flex-direction:column;gap:12px}#notefully .nf-panel-body{display:flex;flex-direction:column;gap:12px;min-height:0}#notefully .nf-panel-body[hidden]{display:none!important}#notefully .nf-success-msg{margin:0;text-align:center;font:700 1.35rem/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.01em;color:var(--nf-success)}#notefully .nf-success-msg[hidden]{display:none!important}#notefully .nf-dialog.nf-success{pointer-events:none}#notefully .nf-dialog.nf-success .nf-panel{width:auto;min-width:11rem;max-width:min(280px,90vw);max-height:none;overflow:hidden;padding:1.75rem 2.35rem;align-items:center;justify-content:center;gap:0}@media(prefers-reduced-motion:reduce){#notefully .nf-dialog.nf-success .nf-panel{transform:none!important;transition:none!important}}#notefully .nf-stage{display:flex;flex-direction:column;gap:8px}#notefully .nf-palette{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#notefully .nf-tool,#notefully .nf-reset-crop,#notefully .nf-icon-btn{background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:6px 10px;cursor:pointer;font:13px ui-sans-serif,system-ui,sans-serif}#notefully .nf-icon-btn{width:36px;height:36px;padding:0;display:grid;place-items:center;flex:0 0 36px}#notefully .nf-icon{width:18px;height:18px;display:block}#notefully .nf-tool[data-active=true],#notefully .nf-icon-btn[data-active=true]{border-color:var(--nf-accent);color:var(--nf-accent);box-shadow:inset 0 0 0 1px var(--nf-accent)}#notefully .nf-canvas{position:relative;width:min(100%,calc(48vh * var(--nf-shot-aspect, 16 / 9)));max-height:48vh;aspect-ratio:var(--nf-shot-aspect, auto);margin-inline:auto;background:var(--nf-canvas-bg);border-radius:8px;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none}#notefully .nf-canvas[data-draw=true],#notefully .nf-canvas[data-draw=true] .nf-shot{cursor:crosshair}#notefully .nf-sticker{cursor:grab}#notefully .nf-sticker[data-preview=true]{cursor:crosshair}#notefully .nf-sticker.nf-arrow .nf-arrow-hit{cursor:grab}#notefully[data-grabbing=true] .nf-canvas,#notefully[data-grabbing=true] .nf-shot,#notefully[data-grabbing=true] .nf-sticker,#notefully[data-grabbing=true] .nf-sticker *{cursor:grabbing}#notefully .nf-shot{position:absolute;overflow:hidden;--nf-anno-stroke: 3px;--nf-anno-badge: 20px;--nf-anno-badge-font: 11px;--nf-anno-handle: 10px}#notefully .nf-shot img{position:absolute;display:block;max-height:none;pointer-events:none;-webkit-user-drag:none;user-drag:none}#notefully .nf-canvas video.nf-recording-preview{display:block;width:160px;height:auto;max-height:none;object-fit:contain;pointer-events:auto}#notefully .nf-sticker,#notefully .nf-crop{position:absolute;pointer-events:auto;color:var(--nf-mark)}#notefully .nf-sticker[data-selected=true]{z-index:4}#notefully .nf-sticker[data-preview=true],#notefully .nf-sticker.nf-arrow{pointer-events:none}#notefully .nf-sticker.nf-arrow .nf-handle{pointer-events:auto}#notefully .nf-rect,#notefully .nf-circle{border:var(--nf-anno-stroke) solid var(--nf-mark);background:transparent;box-sizing:border-box}#notefully .nf-circle{border-radius:50%}#notefully .nf-arrow-svg{display:block;overflow:visible;pointer-events:none}#notefully .nf-arrow-hit{fill:none;stroke:transparent;stroke-width:16;pointer-events:stroke}#notefully .nf-arrow-shaft{fill:none;stroke:currentColor;stroke-width:var(--nf-anno-stroke);stroke-linecap:round;pointer-events:none}#notefully .nf-arrow-head{fill:currentColor;stroke:none;pointer-events:none}#notefully .nf-badge{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);box-sizing:border-box;min-width:var(--nf-anno-badge);height:var(--nf-anno-badge);padding:0 calc(var(--nf-anno-badge-font) * .35);border-radius:50%;background:var(--nf-mark);color:var(--nf-mark-text);font:700 var(--nf-anno-badge-font)/var(--nf-anno-badge) ui-sans-serif,system-ui,sans-serif;text-align:center;pointer-events:none;z-index:4}#notefully .nf-sticker.nf-arrow .nf-badge{top:50%}#notefully .nf-handle{position:absolute;width:var(--nf-anno-handle);height:var(--nf-anno-handle);background:#fff;border:2px solid var(--nf-mark);border-radius:2px;z-index:5;box-sizing:border-box}#notefully .nf-handle[data-dir=nw]{left:-6px;top:-6px;cursor:nwse-resize}#notefully .nf-handle[data-dir=ne]{right:-6px;top:-6px;cursor:nesw-resize}#notefully .nf-handle[data-dir=sw]{left:-6px;bottom:-6px;cursor:nesw-resize}#notefully .nf-handle[data-dir=se]{right:-6px;bottom:-6px;cursor:nwse-resize}#notefully .nf-handle[data-dir=start],#notefully .nf-handle[data-dir=end]{margin:0;cursor:grab}#notefully .nf-crop{border:2px dashed var(--nf-accent);background:color-mix(in srgb,var(--nf-accent) 14%,transparent);box-shadow:0 0 0 9999px #00000073;pointer-events:none}#notefully .nf-text{width:100%;min-height:96px;resize:vertical;background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:10px;font:14px/1.4 ui-sans-serif,system-ui,sans-serif}#notefully .nf-author{width:100%;box-sizing:border-box;background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:10px;font:14px/1.4 ui-sans-serif,system-ui,sans-serif}#notefully .nf-author::placeholder{color:var(--nf-muted)}#notefully .nf-kind{display:flex;gap:8px}#notefully .nf-kind button{background:var(--nf-input);color:var(--nf-muted);border:1px solid var(--nf-border);border-radius:999px;padding:6px 12px;cursor:pointer}#notefully .nf-kind button[data-active=true]{color:var(--nf-accent-text);background:var(--nf-accent);border-color:var(--nf-accent)}#notefully .nf-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#notefully .nf-actions button{border:1px solid var(--nf-border);border-radius:8px;padding:8px 12px;cursor:pointer;font:600 13px ui-sans-serif,system-ui,sans-serif;background:var(--nf-input);color:var(--nf-text)}#notefully .nf-actions .nf-icon-btn{padding:0}#notefully .nf-submit{margin-left:auto;background:var(--nf-btn)!important;color:var(--nf-btn-text)!important;border-color:var(--nf-btn-border)!important}#notefully .nf-submit:disabled{opacity:.55;cursor:wait}#notefully .nf-restore{background:transparent;color:var(--nf-muted);border:0;cursor:pointer;font:13px ui-sans-serif,system-ui,sans-serif;text-decoration:underline}#notefully .nf-status{color:var(--nf-muted);font:13px ui-sans-serif,system-ui,sans-serif;min-height:1.2em}#notefully .nf-stop-video{position:fixed;top:16px;left:50%;transform:translate(-50%);z-index:calc(var(--nf-z) + 1);background:var(--nf-danger);color:#fff;border:0;border-radius:999px;padding:10px 18px;font:700 14px ui-sans-serif,system-ui,sans-serif;cursor:pointer}#notefully[data-nf-hidden-launcher] .nf-launcher{display:none!important}.nf-capture-chrome{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483645;display:grid;place-items:center;pointer-events:none;background:#140c1c47;animation:nf-capture-fade .16s ease-out both}.nf-capture-chrome-pill{display:inline-flex;align-items:center;gap:.55em;padding:.65em 1.1em;border-radius:999px;background:#f7f4fbf0;color:#2a2140;font:650 14px ui-sans-serif,system-ui,sans-serif;letter-spacing:.01em;box-shadow:0 10px 28px #140c1c38}.nf-capture-chrome-pill:before{content:"";width:.7em;height:.7em;border-radius:50%;border:2px solid rgba(42,33,64,.22);border-top-color:#864093;animation:nf-capture-spin .7s linear infinite}@keyframes nf-capture-fade{0%{opacity:0}to{opacity:1}}@keyframes nf-capture-spin{to{transform:rotate(360deg)}}
|
|
1
|
+
#notefully{all:initial;--nf-launcher-left: 16px;--nf-launcher-bottom: 16px;--nf-radius: 10px;--nf-z: 2147483000;--nf-accent: #864093;--nf-accent-text: #ffffff;--nf-accent-hot: #e83590;--nf-btn: #864093;--nf-btn-border: #382c74;--nf-btn-text: #ffffff;--nf-panel: #f7f4fb;--nf-text: #2a2140;--nf-muted: rgba(42, 33, 64, .72);--nf-input: #efe8f8;--nf-border: rgba(56, 44, 116, .18);--nf-backdrop: rgba(20, 12, 28, .55);--nf-danger: #e83590;--nf-success: #1a7a3c;--nf-fail: #c2185b;--nf-mark: #fdd341;--nf-mark-text: #2a2140;--nf-canvas-bg: #111;font-family:ui-sans-serif,system-ui,sans-serif;color:var(--nf-text)}#notefully[data-theme=maker]{--nf-accent: #864093;--nf-accent-text: #ffffff;--nf-accent-hot: #e83590;--nf-btn: #864093;--nf-btn-border: #382c74;--nf-btn-text: #ffffff;--nf-panel: #f7f4fb;--nf-text: #2a2140;--nf-muted: rgba(42, 33, 64, .72);--nf-input: #efe8f8;--nf-border: rgba(56, 44, 116, .18);--nf-backdrop: rgba(20, 12, 28, .55);--nf-danger: #e83590;--nf-success: #1a7a3c;--nf-fail: #c2185b;--nf-mark: #fdd341;--nf-mark-text: #2a2140}#notefully[data-theme=all-business]{--nf-accent: #5c6570;--nf-accent-text: #ffffff;--nf-accent-hot: #8a4a4a;--nf-btn: #5c6570;--nf-btn-border: #3a4048;--nf-btn-text: #ffffff;--nf-panel: #ffffff;--nf-text: #1f1f23;--nf-muted: rgba(31, 31, 35, .68);--nf-input: #f0f0f2;--nf-border: rgba(0, 0, 0, .14);--nf-backdrop: rgba(20, 20, 24, .4);--nf-danger: #8a4a4a;--nf-success: #1f7a3a;--nf-fail: #b42318;--nf-mark: #3d6ea8;--nf-mark-text: #ffffff}#notefully[data-theme=brighter-day]{--nf-accent: #5aa8dc;--nf-accent-text: #ffffff;--nf-accent-hot: #f08ab8;--nf-btn: #5aa8dc;--nf-btn-border: #3d7eae;--nf-btn-text: #ffffff;--nf-panel: #fffdf6;--nf-text: #2a2440;--nf-muted: rgba(42, 36, 64, .68);--nf-input: #ffeef5;--nf-border: rgba(90, 168, 220, .28);--nf-backdrop: rgba(60, 40, 70, .35);--nf-danger: #f08ab8;--nf-success: #1f7a3a;--nf-fail: #c4476a;--nf-mark: #5aa8dc;--nf-mark-text: #ffffff}#notefully[data-theme=quiet-night]{--nf-accent: #c4aa5a;--nf-accent-text: #121416;--nf-accent-hot: #6e3a3a;--nf-btn: #3a4048;--nf-btn-border: #0e1012;--nf-btn-text: #d8dbe0;--nf-panel: #1c1f24;--nf-text: #d8dbe0;--nf-muted: rgba(216, 219, 224, .68);--nf-input: #262a30;--nf-border: rgba(255, 255, 255, .12);--nf-backdrop: rgba(0, 0, 0, .65);--nf-danger: #c88888;--nf-success: #7dcea0;--nf-fail: #e89898;--nf-mark: #c4aa5a;--nf-mark-text: #121416}#notefully *{box-sizing:border-box}#notefully .nf-launcher{position:fixed;left:var(--nf-launcher-left);bottom:var(--nf-launcher-bottom);z-index:var(--nf-z);width:48px;height:48px;padding:0;display:grid;place-items:center;background:var(--nf-btn);color:var(--nf-btn-text);border:1px solid var(--nf-btn-border);border-radius:999px;cursor:pointer;box-shadow:0 8px 24px #00000040}#notefully .nf-launcher-icon{width:22px;height:22px;display:block}#notefully .nf-launcher[hidden],#notefully .nf-dialog[hidden],#notefully .nf-stop-video[hidden],#notefully .nf-stage[hidden],#notefully .nf-reset-crop[hidden],#notefully .nf-restore[hidden],#notefully .nf-video[hidden],#notefully .nf-author[hidden]{display:none!important}#notefully .nf-dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--nf-z);background:var(--nf-backdrop);display:flex;align-items:center;justify-content:center;padding:24px}#notefully .nf-panel{width:min(920px,100%);max-height:calc(100vh - 48px);overflow:auto;background:var(--nf-panel);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:var(--nf-radius);padding:16px;display:flex;flex-direction:column;gap:12px}#notefully .nf-panel-body{display:flex;flex-direction:column;gap:12px;min-height:0}#notefully .nf-panel-body[hidden]{display:none!important}#notefully .nf-success-msg{margin:0;text-align:center;font:700 1.35rem/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.01em;color:var(--nf-success)}#notefully .nf-success-msg[hidden]{display:none!important}#notefully .nf-dialog.nf-success{pointer-events:none}#notefully .nf-dialog.nf-success .nf-panel{width:auto;min-width:11rem;max-width:min(280px,90vw);max-height:none;overflow:hidden;padding:1.75rem 2.35rem;align-items:center;justify-content:center;gap:0}@media(prefers-reduced-motion:reduce){#notefully .nf-dialog.nf-success .nf-panel{transform:none!important;transition:none!important}}#notefully .nf-stage{display:flex;flex-direction:column;gap:8px}#notefully .nf-palette{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#notefully .nf-tool,#notefully .nf-reset-crop,#notefully .nf-icon-btn{background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:6px 10px;cursor:pointer;font:13px ui-sans-serif,system-ui,sans-serif}#notefully .nf-icon-btn{width:36px;height:36px;padding:0;display:grid;place-items:center;flex:0 0 36px}#notefully .nf-icon{width:18px;height:18px;display:block}#notefully .nf-tool[data-active=true],#notefully .nf-icon-btn[data-active=true]{border-color:var(--nf-accent);color:var(--nf-accent);box-shadow:inset 0 0 0 1px var(--nf-accent)}#notefully .nf-canvas{position:relative;width:min(100%,calc(48vh * var(--nf-shot-aspect, 16 / 9)));max-height:48vh;aspect-ratio:var(--nf-shot-aspect, auto);margin-inline:auto;background:var(--nf-canvas-bg);border-radius:8px;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none}#notefully .nf-canvas[data-draw=true],#notefully .nf-canvas[data-draw=true] .nf-shot{cursor:crosshair}#notefully .nf-sticker{cursor:grab}#notefully .nf-sticker[data-preview=true]{cursor:crosshair}#notefully .nf-sticker.nf-arrow .nf-arrow-hit{cursor:grab}#notefully[data-grabbing=true] .nf-canvas,#notefully[data-grabbing=true] .nf-shot,#notefully[data-grabbing=true] .nf-sticker,#notefully[data-grabbing=true] .nf-sticker *{cursor:grabbing}#notefully .nf-shot{position:absolute;overflow:hidden;--nf-anno-stroke: 3px;--nf-anno-badge: 20px;--nf-anno-badge-font: 11px;--nf-anno-handle: 10px}#notefully .nf-shot img{position:absolute;display:block;max-height:none;pointer-events:none;-webkit-user-drag:none;user-drag:none}#notefully .nf-canvas video.nf-recording-preview{display:block;width:160px;height:auto;max-height:none;object-fit:contain;pointer-events:auto}#notefully .nf-sticker,#notefully .nf-crop{position:absolute;pointer-events:auto;color:var(--nf-mark)}#notefully .nf-sticker[data-selected=true]{z-index:4}#notefully .nf-sticker[data-preview=true],#notefully .nf-sticker.nf-arrow{pointer-events:none}#notefully .nf-sticker.nf-arrow .nf-handle{pointer-events:auto}#notefully .nf-rect,#notefully .nf-circle{border:var(--nf-anno-stroke) solid var(--nf-mark);background:transparent;box-sizing:border-box}#notefully .nf-circle{border-radius:50%}#notefully .nf-arrow-svg{display:block;overflow:visible;pointer-events:none}#notefully .nf-arrow-hit{fill:none;stroke:transparent;stroke-width:16;pointer-events:stroke}#notefully .nf-arrow-shaft{fill:none;stroke:currentColor;stroke-width:var(--nf-anno-stroke);stroke-linecap:round;pointer-events:none}#notefully .nf-arrow-head{fill:currentColor;stroke:none;pointer-events:none}#notefully .nf-badge{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);box-sizing:border-box;min-width:var(--nf-anno-badge);height:var(--nf-anno-badge);padding:0 calc(var(--nf-anno-badge-font) * .35);border-radius:50%;background:var(--nf-mark);color:var(--nf-mark-text);font:700 var(--nf-anno-badge-font)/var(--nf-anno-badge) ui-sans-serif,system-ui,sans-serif;text-align:center;pointer-events:none;z-index:4}#notefully .nf-sticker.nf-arrow .nf-badge{top:50%}#notefully .nf-handle{position:absolute;width:var(--nf-anno-handle);height:var(--nf-anno-handle);background:#fff;border:2px solid var(--nf-mark);border-radius:2px;z-index:5;box-sizing:border-box}#notefully .nf-handle[data-dir=nw]{left:-6px;top:-6px;cursor:nwse-resize}#notefully .nf-handle[data-dir=ne]{right:-6px;top:-6px;cursor:nesw-resize}#notefully .nf-handle[data-dir=sw]{left:-6px;bottom:-6px;cursor:nesw-resize}#notefully .nf-handle[data-dir=se]{right:-6px;bottom:-6px;cursor:nwse-resize}#notefully .nf-handle[data-dir=start],#notefully .nf-handle[data-dir=end]{margin:0;cursor:grab}#notefully .nf-crop{border:2px dashed var(--nf-accent);background:color-mix(in srgb,var(--nf-accent) 14%,transparent);box-shadow:0 0 0 9999px #00000073;pointer-events:none}#notefully .nf-text{width:100%;min-height:96px;resize:vertical;background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:10px;font:14px/1.4 ui-sans-serif,system-ui,sans-serif}#notefully .nf-author{width:100%;box-sizing:border-box;background:var(--nf-input);color:var(--nf-text);border:1px solid var(--nf-border);border-radius:8px;padding:10px;font:14px/1.4 ui-sans-serif,system-ui,sans-serif}#notefully .nf-author::placeholder{color:var(--nf-muted)}#notefully .nf-kind{display:flex;gap:8px}#notefully .nf-kind button{background:var(--nf-input);color:var(--nf-muted);border:1px solid var(--nf-border);border-radius:999px;padding:6px 12px;cursor:pointer}#notefully .nf-kind button[data-active=true]{color:var(--nf-accent-text);background:var(--nf-accent);border-color:var(--nf-accent)}#notefully .nf-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#notefully .nf-actions button{border:1px solid var(--nf-border);border-radius:8px;padding:8px 12px;cursor:pointer;font:600 13px ui-sans-serif,system-ui,sans-serif;background:var(--nf-input);color:var(--nf-text)}#notefully .nf-actions .nf-icon-btn{padding:0}#notefully .nf-submit{margin-left:auto;background:var(--nf-btn)!important;color:var(--nf-btn-text)!important;border-color:var(--nf-btn-border)!important}#notefully .nf-submit:disabled{opacity:.55;cursor:wait}#notefully .nf-status{color:var(--nf-muted);font:13px ui-sans-serif,system-ui,sans-serif;min-height:1.2em}#notefully .nf-stop-video{position:fixed;top:16px;left:50%;transform:translate(-50%);z-index:calc(var(--nf-z) + 1);background:var(--nf-danger);color:#fff;border:0;border-radius:999px;padding:10px 18px;font:700 14px ui-sans-serif,system-ui,sans-serif;cursor:pointer}#notefully[data-nf-hidden-launcher] .nf-launcher{display:none!important}.nf-capture-chrome{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483645;display:grid;place-items:center;pointer-events:none;background:#140c1c47;animation:nf-capture-fade .16s ease-out both}.nf-capture-chrome-pill{display:inline-flex;align-items:center;gap:.55em;padding:.65em 1.1em;border-radius:999px;background:#f7f4fbf0;color:#2a2140;font:650 14px ui-sans-serif,system-ui,sans-serif;letter-spacing:.01em;box-shadow:0 10px 28px #140c1c38}.nf-capture-chrome-pill:before{content:"";width:.7em;height:.7em;border-radius:50%;border:2px solid rgba(42,33,64,.22);border-top-color:#864093;animation:nf-capture-spin .7s linear infinite}@keyframes nf-capture-fade{0%{opacity:0}to{opacity:1}}@keyframes nf-capture-spin{to{transform:rotate(360deg)}}
|
package/dist/notefully.iife.js
CHANGED
|
@@ -1,21 +1,22 @@
|
|
|
1
|
-
var Notefully=(function(C){"use strict";function Ie(t,e){if(t.match(/^[a-z]+:\/\//i))return t;if(t.match(/^\/\//))return window.location.protocol+t;if(t.match(/^[a-z]+:/i))return t;const n=document.implementation.createHTMLDocument(),r=n.createElement("base"),o=n.createElement("a");return n.head.appendChild(r),n.body.appendChild(o),e&&(r.href=e),o.href=t,o.href}const Oe=(()=>{let t=0;const e=()=>`0000${(Math.random()*36**4<<0).toString(36)}`.slice(-4);return()=>(t+=1,`u${e()}${t}`)})();function T(t){const e=[];for(let n=0,r=t.length;n<r;n++)e.push(t[n]);return e}let N=null;function Dt(t={}){return N||(t.includeStyleProperties?(N=t.includeStyleProperties,N):(N=T(window.getComputedStyle(document.documentElement)),N))}function Z(t,e){const r=(t.ownerDocument.defaultView||window).getComputedStyle(t).getPropertyValue(e);return r?parseFloat(r.replace("px","")):0}function He(t){const e=Z(t,"border-left-width"),n=Z(t,"border-right-width");return t.clientWidth+e+n}function Fe(t){const e=Z(t,"border-top-width"),n=Z(t,"border-bottom-width");return t.clientHeight+e+n}function Bt(t,e={}){const n=e.width||He(t),r=e.height||Fe(t);return{width:n,height:r}}function De(){let t,e;try{e=process}catch{}const n=e&&e.env?e.env.devicePixelRatio:null;return n&&(t=parseInt(n,10),Number.isNaN(t)&&(t=1)),t||window.devicePixelRatio||1}const M=16384;function Be(t){(t.width>M||t.height>M)&&(t.width>M&&t.height>M?t.width>t.height?(t.height*=M/t.width,t.width=M):(t.width*=M/t.height,t.height=M):t.width>M?(t.height*=M/t.width,t.width=M):(t.width*=M/t.height,t.height=M))}function tt(t){return new Promise((e,n)=>{const r=new Image;r.onload=()=>{r.decode().then(()=>{requestAnimationFrame(()=>e(r))})},r.onerror=n,r.crossOrigin="anonymous",r.decoding="async",r.src=t})}async function Ue(t){return Promise.resolve().then(()=>new XMLSerializer().serializeToString(t)).then(encodeURIComponent).then(e=>`data:image/svg+xml;charset=utf-8,${e}`)}async function je(t,e,n){const r="http://www.w3.org/2000/svg",o=document.createElementNS(r,"svg"),i=document.createElementNS(r,"foreignObject");return o.setAttribute("width",`${e}`),o.setAttribute("height",`${n}`),o.setAttribute("viewBox",`0 0 ${e} ${n}`),i.setAttribute("width","100%"),i.setAttribute("height","100%"),i.setAttribute("x","0"),i.setAttribute("y","0"),i.setAttribute("externalResourcesRequired","true"),o.appendChild(i),i.appendChild(t),Ue(o)}const E=(t,e)=>{if(t instanceof e)return!0;const n=Object.getPrototypeOf(t);return n===null?!1:n.constructor.name===e.name||E(n,e)};function Ne(t){const e=t.getPropertyValue("content");return`${t.cssText} content: '${e.replace(/'|"/g,"")}';`}function _e(t,e){return Dt(e).map(n=>{const r=t.getPropertyValue(n),o=t.getPropertyPriority(n);return`${n}: ${r}${o?" !important":""};`}).join(" ")}function Ve(t,e,n,r){const o=`.${t}:${e}`,i=n.cssText?Ne(n):_e(n,r);return document.createTextNode(`${o}{${i}}`)}function Ut(t,e,n,r){const o=window.getComputedStyle(t,n),i=o.getPropertyValue("content");if(i===""||i==="none")return;const a=Oe();try{e.className=`${e.className} ${a}`}catch{return}const c=document.createElement("style");c.appendChild(Ve(a,n,o,r)),e.appendChild(c)}function ze(t,e,n){Ut(t,e,":before",n),Ut(t,e,":after",n)}const jt="application/font-woff",Nt="image/jpeg",qe={woff:jt,woff2:jt,ttf:"application/font-truetype",eot:"application/vnd.ms-fontobject",png:"image/png",jpg:Nt,jpeg:Nt,gif:"image/gif",tiff:"image/tiff",svg:"image/svg+xml",webp:"image/webp"};function We(t){const e=/\.([^./]*?)$/g.exec(t);return e?e[1]:""}function dt(t){const e=We(t).toLowerCase();return qe[e]||""}function Ke(t){return t.split(/,/)[1]}function ft(t){return t.search(/^(data:)/)!==-1}function Xe(t,e){return`data:${e};base64,${t}`}async function _t(t,e,n){const r=await fetch(t,e);if(r.status===404)throw new Error(`Resource "${r.url}" not found`);const o=await r.blob();return new Promise((i,a)=>{const c=new FileReader;c.onerror=a,c.onloadend=()=>{try{i(n({res:r,result:c.result}))}catch(l){a(l)}},c.readAsDataURL(o)})}const ht={};function Ye(t,e,n){let r=t.replace(/\?.*/,"");return n&&(r=t),/ttf|otf|eot|woff2?/i.test(r)&&(r=r.replace(/.*\//,"")),e?`[${e}]${r}`:r}async function mt(t,e,n){const r=Ye(t,e,n.includeQueryParams);if(ht[r]!=null)return ht[r];n.cacheBust&&(t+=(/\?/.test(t)?"&":"?")+new Date().getTime());let o;try{const i=await _t(t,n.fetchRequestInit,({res:a,result:c})=>(e||(e=a.headers.get("Content-Type")||""),Ke(c)));o=Xe(i,e)}catch(i){o=n.imagePlaceholder||"";let a=`Failed to fetch resource: ${t}`;i&&(a=typeof i=="string"?i:i.message),a&&console.warn(a)}return ht[r]=o,o}async function Ge(t){const e=t.toDataURL();return e==="data:,"?t.cloneNode(!1):tt(e)}async function Je(t,e){if(t.currentSrc){const i=document.createElement("canvas"),a=i.getContext("2d");i.width=t.clientWidth,i.height=t.clientHeight,a==null||a.drawImage(t,0,0,i.width,i.height);const c=i.toDataURL();return tt(c)}const n=t.poster,r=dt(n),o=await mt(n,r,e);return tt(o)}async function Qe(t,e){var n;try{if(!((n=t==null?void 0:t.contentDocument)===null||n===void 0)&&n.body)return await et(t.contentDocument.body,e,!0)}catch{}return t.cloneNode(!1)}async function Ze(t,e){return E(t,HTMLCanvasElement)?Ge(t):E(t,HTMLVideoElement)?Je(t,e):E(t,HTMLIFrameElement)?Qe(t,e):t.cloneNode(Vt(t))}const tn=t=>t.tagName!=null&&t.tagName.toUpperCase()==="SLOT",Vt=t=>t.tagName!=null&&t.tagName.toUpperCase()==="SVG";async function en(t,e,n){var r,o;if(Vt(e))return e;let i=[];return tn(t)&&t.assignedNodes?i=T(t.assignedNodes()):E(t,HTMLIFrameElement)&&(!((r=t.contentDocument)===null||r===void 0)&&r.body)?i=T(t.contentDocument.body.childNodes):i=T(((o=t.shadowRoot)!==null&&o!==void 0?o:t).childNodes),i.length===0||E(t,HTMLVideoElement)||await i.reduce((a,c)=>a.then(()=>et(c,n)).then(l=>{l&&e.appendChild(l)}),Promise.resolve()),e}function nn(t,e,n){const r=e.style;if(!r)return;const o=window.getComputedStyle(t);o.cssText?(r.cssText=o.cssText,r.transformOrigin=o.transformOrigin):Dt(n).forEach(i=>{let a=o.getPropertyValue(i);i==="font-size"&&a.endsWith("px")&&(a=`${Math.floor(parseFloat(a.substring(0,a.length-2)))-.1}px`),E(t,HTMLIFrameElement)&&i==="display"&&a==="inline"&&(a="block"),i==="d"&&e.getAttribute("d")&&(a=`path(${e.getAttribute("d")})`),r.setProperty(i,a,o.getPropertyPriority(i))})}function rn(t,e){E(t,HTMLTextAreaElement)&&(e.innerHTML=t.value),E(t,HTMLInputElement)&&e.setAttribute("value",t.value)}function on(t,e){if(E(t,HTMLSelectElement)){const r=Array.from(e.children).find(o=>t.value===o.getAttribute("value"));r&&r.setAttribute("selected","")}}function an(t,e,n){return E(e,Element)&&(nn(t,e,n),ze(t,e,n),rn(t,e),on(t,e)),e}async function sn(t,e){const n=t.querySelectorAll?t.querySelectorAll("use"):[];if(n.length===0)return t;const r={};for(let i=0;i<n.length;i++){const c=n[i].getAttribute("xlink:href");if(c){const l=t.querySelector(c),u=document.querySelector(c);!l&&u&&!r[c]&&(r[c]=await et(u,e,!0))}}const o=Object.values(r);if(o.length){const i="http://www.w3.org/1999/xhtml",a=document.createElementNS(i,"svg");a.setAttribute("xmlns",i),a.style.position="absolute",a.style.width="0",a.style.height="0",a.style.overflow="hidden",a.style.display="none";const c=document.createElementNS(i,"defs");a.appendChild(c);for(let l=0;l<o.length;l++)c.appendChild(o[l]);t.appendChild(a)}return t}async function et(t,e,n){return!n&&e.filter&&!e.filter(t)?null:Promise.resolve(t).then(r=>Ze(r,e)).then(r=>en(t,r,e)).then(r=>an(t,r,e)).then(r=>sn(r,e))}const zt=/url\((['"]?)([^'"]+?)\1\)/g,cn=/url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g,ln=/src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;function un(t){const e=t.replace(/([.*+?^${}()|\[\]\/\\])/g,"\\$1");return new RegExp(`(url\\(['"]?)(${e})(['"]?\\))`,"g")}function dn(t){const e=[];return t.replace(zt,(n,r,o)=>(e.push(o),n)),e.filter(n=>!ft(n))}async function fn(t,e,n,r,o){try{const i=n?Ie(e,n):e,a=dt(e);let c;return o||(c=await mt(i,a,r)),t.replace(un(e),`$1${c}$3`)}catch{}return t}function hn(t,{preferredFontFormat:e}){return e?t.replace(ln,n=>{for(;;){const[r,,o]=cn.exec(n)||[];if(!o)return"";if(o===e)return`src: ${r};`}}):t}function qt(t){return t.search(zt)!==-1}async function Wt(t,e,n){if(!qt(t))return t;const r=hn(t,n);return dn(r).reduce((i,a)=>i.then(c=>fn(c,a,e,n)),Promise.resolve(r))}async function _(t,e,n){var r;const o=(r=e.style)===null||r===void 0?void 0:r.getPropertyValue(t);if(o){const i=await Wt(o,null,n);return e.style.setProperty(t,i,e.style.getPropertyPriority(t)),!0}return!1}async function mn(t,e){await _("background",t,e)||await _("background-image",t,e),await _("mask",t,e)||await _("-webkit-mask",t,e)||await _("mask-image",t,e)||await _("-webkit-mask-image",t,e)}async function pn(t,e){const n=E(t,HTMLImageElement);if(!(n&&!ft(t.src))&&!(E(t,SVGImageElement)&&!ft(t.href.baseVal)))return;const r=n?t.src:t.href.baseVal,o=await mt(r,dt(r),e);await new Promise((i,a)=>{t.onload=i,t.onerror=e.onImageErrorHandler?(...l)=>{try{i(e.onImageErrorHandler(...l))}catch(u){a(u)}}:a;const c=t;c.decode&&(c.decode=i),c.loading==="lazy"&&(c.loading="eager"),n?(t.srcset="",t.src=o):t.href.baseVal=o})}async function yn(t,e){const r=T(t.childNodes).map(o=>Kt(o,e));await Promise.all(r).then(()=>t)}async function Kt(t,e){E(t,Element)&&(await mn(t,e),await pn(t,e),await yn(t,e))}function gn(t,e){const{style:n}=t;e.backgroundColor&&(n.backgroundColor=e.backgroundColor),e.width&&(n.width=`${e.width}px`),e.height&&(n.height=`${e.height}px`);const r=e.style;return r!=null&&Object.keys(r).forEach(o=>{n[o]=r[o]}),t}const Xt={};async function Yt(t){let e=Xt[t];if(e!=null)return e;const r=await(await fetch(t)).text();return e={url:t,cssText:r},Xt[t]=e,e}async function Gt(t,e){let n=t.cssText;const r=/url\(["']?([^"')]+)["']?\)/g,i=(n.match(/url\([^)]+\)/g)||[]).map(async a=>{let c=a.replace(r,"$1");return c.startsWith("https://")||(c=new URL(c,t.url).href),_t(c,e.fetchRequestInit,({result:l})=>(n=n.replace(a,`url(${l})`),[a,l]))});return Promise.all(i).then(()=>n)}function Jt(t){if(t==null)return[];const e=[],n=/(\/\*[\s\S]*?\*\/)/gi;let r=t.replace(n,"");const o=new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})","gi");for(;;){const l=o.exec(r);if(l===null)break;e.push(l[0])}r=r.replace(o,"");const i=/@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi,a="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})",c=new RegExp(a,"gi");for(;;){let l=i.exec(r);if(l===null){if(l=c.exec(r),l===null)break;i.lastIndex=c.lastIndex}else c.lastIndex=i.lastIndex;e.push(l[0])}return e}async function wn(t,e){const n=[],r=[];return t.forEach(o=>{if("cssRules"in o)try{T(o.cssRules||[]).forEach((i,a)=>{if(i.type===CSSRule.IMPORT_RULE){let c=a+1;const l=i.href,u=Yt(l).then(h=>Gt(h,e)).then(h=>Jt(h).forEach(p=>{try{o.insertRule(p,p.startsWith("@import")?c+=1:o.cssRules.length)}catch(y){console.error("Error inserting rule from remote css",{rule:p,error:y})}})).catch(h=>{console.error("Error loading remote css",h.toString())});r.push(u)}})}catch(i){const a=t.find(c=>c.href==null)||document.styleSheets[0];o.href!=null&&r.push(Yt(o.href).then(c=>Gt(c,e)).then(c=>Jt(c).forEach(l=>{a.insertRule(l,a.cssRules.length)})).catch(c=>{console.error("Error loading remote stylesheet",c)})),console.error("Error inlining remote css file",i)}}),Promise.all(r).then(()=>(t.forEach(o=>{if("cssRules"in o)try{T(o.cssRules||[]).forEach(i=>{n.push(i)})}catch(i){console.error(`Error while reading CSS rules from ${o.href}`,i)}}),n))}function bn(t){return t.filter(e=>e.type===CSSRule.FONT_FACE_RULE).filter(e=>qt(e.style.getPropertyValue("src")))}async function Sn(t,e){if(t.ownerDocument==null)throw new Error("Provided element is not within a Document");const n=T(t.ownerDocument.styleSheets),r=await wn(n,e);return bn(r)}function Qt(t){return t.trim().replace(/["']/g,"")}function vn(t){const e=new Set;function n(r){(r.style.fontFamily||getComputedStyle(r).fontFamily).split(",").forEach(i=>{e.add(Qt(i))}),Array.from(r.children).forEach(i=>{i instanceof HTMLElement&&n(i)})}return n(t),e}async function xn(t,e){const n=await Sn(t,e),r=vn(t);return(await Promise.all(n.filter(i=>r.has(Qt(i.style.fontFamily))).map(i=>{const a=i.parentStyleSheet?i.parentStyleSheet.href:null;return Wt(i.cssText,a,e)}))).join(`
|
|
1
|
+
var Notefully=(function(C){"use strict";function Ie(t,e){if(t.match(/^[a-z]+:\/\//i))return t;if(t.match(/^\/\//))return window.location.protocol+t;if(t.match(/^[a-z]+:/i))return t;const n=document.implementation.createHTMLDocument(),r=n.createElement("base"),o=n.createElement("a");return n.head.appendChild(r),n.body.appendChild(o),e&&(r.href=e),o.href=t,o.href}const Oe=(()=>{let t=0;const e=()=>`0000${(Math.random()*36**4<<0).toString(36)}`.slice(-4);return()=>(t+=1,`u${e()}${t}`)})();function k(t){const e=[];for(let n=0,r=t.length;n<r;n++)e.push(t[n]);return e}let N=null;function Dt(t={}){return N||(t.includeStyleProperties?(N=t.includeStyleProperties,N):(N=k(window.getComputedStyle(document.documentElement)),N))}function Z(t,e){const r=(t.ownerDocument.defaultView||window).getComputedStyle(t).getPropertyValue(e);return r?parseFloat(r.replace("px","")):0}function He(t){const e=Z(t,"border-left-width"),n=Z(t,"border-right-width");return t.clientWidth+e+n}function Fe(t){const e=Z(t,"border-top-width"),n=Z(t,"border-bottom-width");return t.clientHeight+e+n}function Bt(t,e={}){const n=e.width||He(t),r=e.height||Fe(t);return{width:n,height:r}}function De(){let t,e;try{e=process}catch{}const n=e&&e.env?e.env.devicePixelRatio:null;return n&&(t=parseInt(n,10),Number.isNaN(t)&&(t=1)),t||window.devicePixelRatio||1}const M=16384;function Be(t){(t.width>M||t.height>M)&&(t.width>M&&t.height>M?t.width>t.height?(t.height*=M/t.width,t.width=M):(t.width*=M/t.height,t.height=M):t.width>M?(t.height*=M/t.width,t.width=M):(t.width*=M/t.height,t.height=M))}function tt(t){return new Promise((e,n)=>{const r=new Image;r.onload=()=>{r.decode().then(()=>{requestAnimationFrame(()=>e(r))})},r.onerror=n,r.crossOrigin="anonymous",r.decoding="async",r.src=t})}async function Ue(t){return Promise.resolve().then(()=>new XMLSerializer().serializeToString(t)).then(encodeURIComponent).then(e=>`data:image/svg+xml;charset=utf-8,${e}`)}async function je(t,e,n){const r="http://www.w3.org/2000/svg",o=document.createElementNS(r,"svg"),i=document.createElementNS(r,"foreignObject");return o.setAttribute("width",`${e}`),o.setAttribute("height",`${n}`),o.setAttribute("viewBox",`0 0 ${e} ${n}`),i.setAttribute("width","100%"),i.setAttribute("height","100%"),i.setAttribute("x","0"),i.setAttribute("y","0"),i.setAttribute("externalResourcesRequired","true"),o.appendChild(i),i.appendChild(t),Ue(o)}const E=(t,e)=>{if(t instanceof e)return!0;const n=Object.getPrototypeOf(t);return n===null?!1:n.constructor.name===e.name||E(n,e)};function Ne(t){const e=t.getPropertyValue("content");return`${t.cssText} content: '${e.replace(/'|"/g,"")}';`}function _e(t,e){return Dt(e).map(n=>{const r=t.getPropertyValue(n),o=t.getPropertyPriority(n);return`${n}: ${r}${o?" !important":""};`}).join(" ")}function Ve(t,e,n,r){const o=`.${t}:${e}`,i=n.cssText?Ne(n):_e(n,r);return document.createTextNode(`${o}{${i}}`)}function Ut(t,e,n,r){const o=window.getComputedStyle(t,n),i=o.getPropertyValue("content");if(i===""||i==="none")return;const a=Oe();try{e.className=`${e.className} ${a}`}catch{return}const c=document.createElement("style");c.appendChild(Ve(a,n,o,r)),e.appendChild(c)}function ze(t,e,n){Ut(t,e,":before",n),Ut(t,e,":after",n)}const jt="application/font-woff",Nt="image/jpeg",qe={woff:jt,woff2:jt,ttf:"application/font-truetype",eot:"application/vnd.ms-fontobject",png:"image/png",jpg:Nt,jpeg:Nt,gif:"image/gif",tiff:"image/tiff",svg:"image/svg+xml",webp:"image/webp"};function We(t){const e=/\.([^./]*?)$/g.exec(t);return e?e[1]:""}function dt(t){const e=We(t).toLowerCase();return qe[e]||""}function Ke(t){return t.split(/,/)[1]}function ft(t){return t.search(/^(data:)/)!==-1}function Xe(t,e){return`data:${e};base64,${t}`}async function _t(t,e,n){const r=await fetch(t,e);if(r.status===404)throw new Error(`Resource "${r.url}" not found`);const o=await r.blob();return new Promise((i,a)=>{const c=new FileReader;c.onerror=a,c.onloadend=()=>{try{i(n({res:r,result:c.result}))}catch(l){a(l)}},c.readAsDataURL(o)})}const ht={};function Ye(t,e,n){let r=t.replace(/\?.*/,"");return n&&(r=t),/ttf|otf|eot|woff2?/i.test(r)&&(r=r.replace(/.*\//,"")),e?`[${e}]${r}`:r}async function mt(t,e,n){const r=Ye(t,e,n.includeQueryParams);if(ht[r]!=null)return ht[r];n.cacheBust&&(t+=(/\?/.test(t)?"&":"?")+new Date().getTime());let o;try{const i=await _t(t,n.fetchRequestInit,({res:a,result:c})=>(e||(e=a.headers.get("Content-Type")||""),Ke(c)));o=Xe(i,e)}catch(i){o=n.imagePlaceholder||"";let a=`Failed to fetch resource: ${t}`;i&&(a=typeof i=="string"?i:i.message),a&&console.warn(a)}return ht[r]=o,o}async function Ge(t){const e=t.toDataURL();return e==="data:,"?t.cloneNode(!1):tt(e)}async function Je(t,e){if(t.currentSrc){const i=document.createElement("canvas"),a=i.getContext("2d");i.width=t.clientWidth,i.height=t.clientHeight,a==null||a.drawImage(t,0,0,i.width,i.height);const c=i.toDataURL();return tt(c)}const n=t.poster,r=dt(n),o=await mt(n,r,e);return tt(o)}async function Qe(t,e){var n;try{if(!((n=t==null?void 0:t.contentDocument)===null||n===void 0)&&n.body)return await et(t.contentDocument.body,e,!0)}catch{}return t.cloneNode(!1)}async function Ze(t,e){return E(t,HTMLCanvasElement)?Ge(t):E(t,HTMLVideoElement)?Je(t,e):E(t,HTMLIFrameElement)?Qe(t,e):t.cloneNode(Vt(t))}const tn=t=>t.tagName!=null&&t.tagName.toUpperCase()==="SLOT",Vt=t=>t.tagName!=null&&t.tagName.toUpperCase()==="SVG";async function en(t,e,n){var r,o;if(Vt(e))return e;let i=[];return tn(t)&&t.assignedNodes?i=k(t.assignedNodes()):E(t,HTMLIFrameElement)&&(!((r=t.contentDocument)===null||r===void 0)&&r.body)?i=k(t.contentDocument.body.childNodes):i=k(((o=t.shadowRoot)!==null&&o!==void 0?o:t).childNodes),i.length===0||E(t,HTMLVideoElement)||await i.reduce((a,c)=>a.then(()=>et(c,n)).then(l=>{l&&e.appendChild(l)}),Promise.resolve()),e}function nn(t,e,n){const r=e.style;if(!r)return;const o=window.getComputedStyle(t);o.cssText?(r.cssText=o.cssText,r.transformOrigin=o.transformOrigin):Dt(n).forEach(i=>{let a=o.getPropertyValue(i);i==="font-size"&&a.endsWith("px")&&(a=`${Math.floor(parseFloat(a.substring(0,a.length-2)))-.1}px`),E(t,HTMLIFrameElement)&&i==="display"&&a==="inline"&&(a="block"),i==="d"&&e.getAttribute("d")&&(a=`path(${e.getAttribute("d")})`),r.setProperty(i,a,o.getPropertyPriority(i))})}function rn(t,e){E(t,HTMLTextAreaElement)&&(e.innerHTML=t.value),E(t,HTMLInputElement)&&e.setAttribute("value",t.value)}function on(t,e){if(E(t,HTMLSelectElement)){const r=Array.from(e.children).find(o=>t.value===o.getAttribute("value"));r&&r.setAttribute("selected","")}}function an(t,e,n){return E(e,Element)&&(nn(t,e,n),ze(t,e,n),rn(t,e),on(t,e)),e}async function sn(t,e){const n=t.querySelectorAll?t.querySelectorAll("use"):[];if(n.length===0)return t;const r={};for(let i=0;i<n.length;i++){const c=n[i].getAttribute("xlink:href");if(c){const l=t.querySelector(c),u=document.querySelector(c);!l&&u&&!r[c]&&(r[c]=await et(u,e,!0))}}const o=Object.values(r);if(o.length){const i="http://www.w3.org/1999/xhtml",a=document.createElementNS(i,"svg");a.setAttribute("xmlns",i),a.style.position="absolute",a.style.width="0",a.style.height="0",a.style.overflow="hidden",a.style.display="none";const c=document.createElementNS(i,"defs");a.appendChild(c);for(let l=0;l<o.length;l++)c.appendChild(o[l]);t.appendChild(a)}return t}async function et(t,e,n){return!n&&e.filter&&!e.filter(t)?null:Promise.resolve(t).then(r=>Ze(r,e)).then(r=>en(t,r,e)).then(r=>an(t,r,e)).then(r=>sn(r,e))}const zt=/url\((['"]?)([^'"]+?)\1\)/g,cn=/url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g,ln=/src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;function un(t){const e=t.replace(/([.*+?^${}()|\[\]\/\\])/g,"\\$1");return new RegExp(`(url\\(['"]?)(${e})(['"]?\\))`,"g")}function dn(t){const e=[];return t.replace(zt,(n,r,o)=>(e.push(o),n)),e.filter(n=>!ft(n))}async function fn(t,e,n,r,o){try{const i=n?Ie(e,n):e,a=dt(e);let c;return o||(c=await mt(i,a,r)),t.replace(un(e),`$1${c}$3`)}catch{}return t}function hn(t,{preferredFontFormat:e}){return e?t.replace(ln,n=>{for(;;){const[r,,o]=cn.exec(n)||[];if(!o)return"";if(o===e)return`src: ${r};`}}):t}function qt(t){return t.search(zt)!==-1}async function Wt(t,e,n){if(!qt(t))return t;const r=hn(t,n);return dn(r).reduce((i,a)=>i.then(c=>fn(c,a,e,n)),Promise.resolve(r))}async function _(t,e,n){var r;const o=(r=e.style)===null||r===void 0?void 0:r.getPropertyValue(t);if(o){const i=await Wt(o,null,n);return e.style.setProperty(t,i,e.style.getPropertyPriority(t)),!0}return!1}async function mn(t,e){await _("background",t,e)||await _("background-image",t,e),await _("mask",t,e)||await _("-webkit-mask",t,e)||await _("mask-image",t,e)||await _("-webkit-mask-image",t,e)}async function pn(t,e){const n=E(t,HTMLImageElement);if(!(n&&!ft(t.src))&&!(E(t,SVGImageElement)&&!ft(t.href.baseVal)))return;const r=n?t.src:t.href.baseVal,o=await mt(r,dt(r),e);await new Promise((i,a)=>{t.onload=i,t.onerror=e.onImageErrorHandler?(...l)=>{try{i(e.onImageErrorHandler(...l))}catch(u){a(u)}}:a;const c=t;c.decode&&(c.decode=i),c.loading==="lazy"&&(c.loading="eager"),n?(t.srcset="",t.src=o):t.href.baseVal=o})}async function yn(t,e){const r=k(t.childNodes).map(o=>Kt(o,e));await Promise.all(r).then(()=>t)}async function Kt(t,e){E(t,Element)&&(await mn(t,e),await pn(t,e),await yn(t,e))}function gn(t,e){const{style:n}=t;e.backgroundColor&&(n.backgroundColor=e.backgroundColor),e.width&&(n.width=`${e.width}px`),e.height&&(n.height=`${e.height}px`);const r=e.style;return r!=null&&Object.keys(r).forEach(o=>{n[o]=r[o]}),t}const Xt={};async function Yt(t){let e=Xt[t];if(e!=null)return e;const r=await(await fetch(t)).text();return e={url:t,cssText:r},Xt[t]=e,e}async function Gt(t,e){let n=t.cssText;const r=/url\(["']?([^"')]+)["']?\)/g,i=(n.match(/url\([^)]+\)/g)||[]).map(async a=>{let c=a.replace(r,"$1");return c.startsWith("https://")||(c=new URL(c,t.url).href),_t(c,e.fetchRequestInit,({result:l})=>(n=n.replace(a,`url(${l})`),[a,l]))});return Promise.all(i).then(()=>n)}function Jt(t){if(t==null)return[];const e=[],n=/(\/\*[\s\S]*?\*\/)/gi;let r=t.replace(n,"");const o=new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})","gi");for(;;){const l=o.exec(r);if(l===null)break;e.push(l[0])}r=r.replace(o,"");const i=/@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi,a="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})",c=new RegExp(a,"gi");for(;;){let l=i.exec(r);if(l===null){if(l=c.exec(r),l===null)break;i.lastIndex=c.lastIndex}else c.lastIndex=i.lastIndex;e.push(l[0])}return e}async function wn(t,e){const n=[],r=[];return t.forEach(o=>{if("cssRules"in o)try{k(o.cssRules||[]).forEach((i,a)=>{if(i.type===CSSRule.IMPORT_RULE){let c=a+1;const l=i.href,u=Yt(l).then(h=>Gt(h,e)).then(h=>Jt(h).forEach(p=>{try{o.insertRule(p,p.startsWith("@import")?c+=1:o.cssRules.length)}catch(y){console.error("Error inserting rule from remote css",{rule:p,error:y})}})).catch(h=>{console.error("Error loading remote css",h.toString())});r.push(u)}})}catch(i){const a=t.find(c=>c.href==null)||document.styleSheets[0];o.href!=null&&r.push(Yt(o.href).then(c=>Gt(c,e)).then(c=>Jt(c).forEach(l=>{a.insertRule(l,a.cssRules.length)})).catch(c=>{console.error("Error loading remote stylesheet",c)})),console.error("Error inlining remote css file",i)}}),Promise.all(r).then(()=>(t.forEach(o=>{if("cssRules"in o)try{k(o.cssRules||[]).forEach(i=>{n.push(i)})}catch(i){console.error(`Error while reading CSS rules from ${o.href}`,i)}}),n))}function bn(t){return t.filter(e=>e.type===CSSRule.FONT_FACE_RULE).filter(e=>qt(e.style.getPropertyValue("src")))}async function Sn(t,e){if(t.ownerDocument==null)throw new Error("Provided element is not within a Document");const n=k(t.ownerDocument.styleSheets),r=await wn(n,e);return bn(r)}function Qt(t){return t.trim().replace(/["']/g,"")}function vn(t){const e=new Set;function n(r){(r.style.fontFamily||getComputedStyle(r).fontFamily).split(",").forEach(i=>{e.add(Qt(i))}),Array.from(r.children).forEach(i=>{i instanceof HTMLElement&&n(i)})}return n(t),e}async function xn(t,e){const n=await Sn(t,e),r=vn(t);return(await Promise.all(n.filter(i=>r.has(Qt(i.style.fontFamily))).map(i=>{const a=i.parentStyleSheet?i.parentStyleSheet.href:null;return Wt(i.cssText,a,e)}))).join(`
|
|
2
2
|
`)}async function En(t,e){const n=e.fontEmbedCSS!=null?e.fontEmbedCSS:e.skipFonts?null:await xn(t,e);if(n){const r=document.createElement("style"),o=document.createTextNode(n);r.appendChild(o),t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r)}}async function Mn(t,e={}){const{width:n,height:r}=Bt(t,e),o=await et(t,e,!0);return await En(o,e),await Kt(o,e),gn(o,e),await je(o,n,r)}async function Cn(t,e={}){const{width:n,height:r}=Bt(t,e),o=await Mn(t,e),i=await tt(o),a=document.createElement("canvas"),c=a.getContext("2d"),l=e.pixelRatio||De(),u=e.canvasWidth||n,h=e.canvasHeight||r;return a.width=u*l,a.height=h*l,e.skipAutoScale||Be(a),a.style.width=`${u}`,a.style.height=`${h}`,e.backgroundColor&&(c.fillStyle=e.backgroundColor,c.fillRect(0,0,a.width,a.height)),c.drawImage(i,0,0,a.width,a.height),a}async function Zt(t,e={}){return(await Cn(t,e)).toDataURL()}const nt="data-nf-capture-chrome",An="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==";function Ln(t){return t instanceof Element&&(t.hasAttribute(nt)||t.hasAttribute("data-nf-mask-cover")||t.id==="notefully")}function Rn(){const t=[];return Array.from(document.styleSheets).forEach(e=>{try{e.cssRules}catch{try{if(e.disabled)return;e.disabled=!0,t.push(e)}catch{const n=e.ownerNode;n&&"disabled"in n&&!n.disabled&&(n.disabled=!0,t.push({node:n}))}}}),()=>{t.forEach(e=>{try{e&&e.node?e.node.disabled=!1:e&&(e.disabled=!1)}catch{}})}}function $n(){const t=[];return document.querySelectorAll('input[type="password"], [data-notefully-mask]').forEach(n=>{const r=n.getBoundingClientRect(),o=document.createElement("div");o.setAttribute("data-nf-mask-cover","1"),o.style.cssText=["position:fixed",`left:${r.left}px`,`top:${r.top}px`,`width:${Math.max(r.width,4)}px`,`height:${Math.max(r.height,4)}px`,"background:#111","z-index:2147483646","pointer-events:none"].join(";"),document.body.appendChild(o),t.push(o)}),()=>t.forEach(n=>n.remove())}function Pn(){const t=document.querySelector(`[${nt}]`);if(t)return t;const e=document.createElement("div");return e.setAttribute(nt,"1"),e.className="nf-capture-chrome",e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.innerHTML='<span class="nf-capture-chrome-pill">Capturing…</span>',document.body.appendChild(e),e}function Tn(){document.querySelectorAll(`[${nt}]`).forEach(t=>t.remove())}async function kn(){const t=document.getElementById("notefully"),e=t?t.style.display:"",n=Pn(),r=Rn();t&&(t.style.display="none");const o=$n();await new Promise(a=>requestAnimationFrame(()=>requestAnimationFrame(a)));const i={cacheBust:!0,pixelRatio:Math.min(window.devicePixelRatio||1,2),filter:a=>!Ln(a),imagePlaceholder:An,onImageErrorHandler:()=>{}};try{try{return await Zt(document.body,i)}catch{return await Zt(document.body,{...i,skipFonts:!0})}}finally{o(),r(),n.remove(),Tn(),t&&(t.style.display=e)}}function In(t=""){const e=String(t||"");return e?/Windows NT/i.test(e)?"Windows":/iPhone|iPad|iPod/i.test(e)?"iOS":/Mac OS X|Macintosh/i.test(e)?"macOS":/Android/i.test(e)?"Android":/CrOS/i.test(e)?"ChromeOS":/Linux/i.test(e)?"Linux":"Other":""}function On(t=""){const e=String(t||"");return e?/Edg\//i.test(e)?"Edge":/OPR\/|Opera/i.test(e)?"Opera":/Firefox\//i.test(e)?"Firefox":/Chrome\//i.test(e)||/CriOS\//i.test(e)?"Chrome":/Safari\//i.test(e)?"Safari":"Other":""}function Hn(t={}){const e=navigator.userAgent;return{url:location.href,title:document.title,userAgent:e,os:In(e),browser:On(e),language:navigator.language,timezone:Intl.DateTimeFormat().resolvedOptions().timeZone,viewport:{width:window.innerWidth,height:window.innerHeight,dpr:window.devicePixelRatio||1},user:{userId:t.userId||null,email:t.email||null,displayName:t.displayName||null}}}const te=new Set(["userId","email","displayName"]),ee={id:"userId",username:"displayName",name:"displayName"},ne=new Set(["endpoint","projectKey","version","name","targets","hideLauncher","theme","video","consoleLogLimit","kinds"]),re={slug:"Use init({ name }) for a per-app report prefix (same idea as package.json name). slug is not a widget option.",projectSlug:"Use init({ name }) for a per-app report prefix. projectSlug is not a widget option.",project:"Pass projectKey (nfk_…) from Showfully Notefully settings — there is no project option on the widget.",username:"Pass people via Notefully.identify({ displayName }) (username is an identify alias), not init().",userId:"Pass people via Notefully.identify({ userId, email, displayName }), not init().",email:"Pass people via Notefully.identify({ userId, email, displayName }), not init().",displayName:"Pass people via Notefully.identify({ userId, email, displayName }), not init()."};function Fn(t={},e={}){const n=e.warn||ie,r=t&&typeof t=="object"?t:{},o={},i=[];for(const a of te)Object.prototype.hasOwnProperty.call(r,a)&&(o[a]=r[a]);for(const[a,c]of Object.entries(ee))Object.prototype.hasOwnProperty.call(r,a)&&(Object.prototype.hasOwnProperty.call(o,c)||(o[c]=r[a]));for(const a of Object.keys(r))te.has(a)||Object.prototype.hasOwnProperty.call(ee,a)||i.push(a);if(i.length){const a=i.some(c=>c==="name"||c==="slug"||c==="projectSlug")?" Pass the package/report name via Notefully.init({ name }), not identify().":"";n(`Notefully.identify: ignoring unknown key(s): ${i.join(", ")}. Supported: userId, email, displayName (aliases: id → userId; username/name → displayName).`+a)}return o}function Dn(t={},e={}){const n=e.warn||ie,r=t&&typeof t=="object"?t:{},o=Object.keys(r).filter(i=>!ne.has(i));if(o.length)for(const i of o){if(re[i]){n(`Notefully.init: ignoring "${i}". ${re[i]}`);continue}n(`Notefully.init: ignoring unknown key "${i}". Supported: ${[...ne].join(", ")}.`)}}function ie(t){typeof console<"u"&&typeof console.warn=="function"&&console.warn(t)}const Bn=80;function Un(){const t=[],e={};let n=!1;const r=(i,a)=>{let c="";try{c=a.map(l=>l instanceof Error?l.stack||l.message:typeof l=="string"?l:JSON.stringify(l)).join(" ")}catch{c=String(a[0])}t.push({level:i,text:c.slice(0,2e3),at:Date.now()}),t.length>Bn&&t.shift()};return{hook:()=>{n||typeof window>"u"||(n=!0,["log","info","warn","error"].forEach(i=>{e[i]=console[i].bind(console),console[i]=(...a)=>{r(i,a),e[i](...a)}}),window.addEventListener("error",i=>{r("error",[i.message||"window.error"])}),window.addEventListener("unhandledrejection",i=>{r("error",[i.reason||"unhandledrejection"])}))},snapshot(){return t.slice()}}}function jn(t){const e=window.SpeechRecognition||window.webkitSpeechRecognition;let n=null,r=!1;const o=()=>{if(r=!1,n)try{n.stop()}catch{}};return{start:()=>{if(!e)throw new Error("Speech recognition is not supported in this browser.");return r?(o(),!1):(n=new e,n.continuous=!0,n.interimResults=!0,n.lang=navigator.language||"en-US",n.onresult=a=>{let c="";for(let l=a.resultIndex;l<a.results.length;l+=1)a.results[l].isFinal&&(c+=a.results[l][0].transcript);c&&t(c)},n.onerror=()=>{r=!1},n.onend=()=>{r=!1},n.start(),r=!0,!0)},stop:o,isSupported:()=>!!e,isActive:()=>r}}const Nn=60*1e3;function _n({onStart:t,onStop:e,onError:n}){let r=null,o=null,i=[],a=null;const c=()=>{if(a&&(clearTimeout(a),a=null),o&&o.state!=="inactive")try{o.stop()}catch{}r&&(r.getTracks().forEach(h=>h.stop()),r=null)},l=()=>{if(o&&o.state==="recording"){o.stop();return}c(),e(null)};return{start:async()=>{var h,p;if(!((h=navigator.mediaDevices)!=null&&h.getDisplayMedia))throw new Error("Screen recording is not supported in this browser.");r=await navigator.mediaDevices.getDisplayMedia({video:{displaySurface:"browser"},audio:!1,preferCurrentTab:!0,selfBrowserSurface:"include"}),i=[],o=new MediaRecorder(r,{mimeType:MediaRecorder.isTypeSupported("video/webm;codecs=vp9")?"video/webm;codecs=vp9":"video/webm"}),o.ondataavailable=y=>{y.data&&y.data.size&&i.push(y.data)},o.onstop=()=>{const y=i.length?new Blob(i,{type:o.mimeType||"video/webm"}):null;c(),e(y)},(p=r.getVideoTracks()[0])==null||p.addEventListener("ended",()=>l()),o.start(),a=setTimeout(l,Nn)},stop:l}}function Vn(){const t=new Set;return{alloc(){let e=1;for(;t.has(e);)e+=1;return t.add(e),e},free(e){const n=Number(e);Number.isInteger(n)&&n>0&&t.delete(n)},peekUsed(){return[...t].sort((e,n)=>e-n)}}}const pt={x:0,y:0,w:1,h:1};function oe(){const t=Vn();let e=[],n={...pt},r=1;return{list:()=>e.filter(i=>qn(i,n)),all:()=>e.slice(),crop:()=>({...n}),setCrop(i){return n=zn(i),n},resetCrop(){return n={...pt},n},isCropped(){return n.x>1e-6||n.y>1e-6||n.w<.999999||n.h<.999999},add(i,a){const c={id:`s${r++}`,type:i,number:t.alloc(),x:.2,y:.2,w:i==="arrow"?.2:.22,h:i==="arrow"?.05:.16,x2:.4,y2:.28,...a};return e.push(c),c},update(i,a){const c=e.find(l=>l.id===i);return c?(Object.assign(c,a),c):null},remove(i){const a=e.findIndex(l=>l.id===i);if(a<0)return null;const[c]=e.splice(a,1);return t.free(c.number),c},reset(){for(e=[],n={...pt},r=1;t.peekUsed().length;)t.free(t.peekUsed()[0])}}}function zn(t){const e=Math.min(Math.max(t.x,0),.95),n=Math.min(Math.max(t.y,0),.95),r=Math.min(Math.max(t.w,.05),1-e),o=Math.min(Math.max(t.h,.05),1-n);return{x:e,y:n,w:r,h:o}}function qn(t,e){const n=t.type==="arrow"?(t.x+(t.x2??t.x))/2:t.x+(t.w||0)/2,r=t.type==="arrow"?(t.y+(t.y2??t.y))/2:t.y+(t.h||0)/2;return n>=e.x&&r>=e.y&&n<=e.x+e.w&&r<=e.y+e.h}function yt(t){const e=Math.max(1,Number(t)||1);return{stroke:Math.max(2,e*.0075),badgeRadius:Math.max(8,e*.025),fontSize:Math.max(10,e*.0275),arrowHead:Math.max(8,e*.035),arrowHeadAngle:.4}}function Wn(t,{stickers:e=[],crop:n={x:0,y:0,w:1,h:1},width:r,height:o,colors:i={}}){const a=i.mark||"#fdd341",c=i.markText||"#2a2140",l=yt(r);t.save(),t.lineWidth=l.stroke,t.lineCap="round",t.lineJoin="round",t.strokeStyle=a,t.fillStyle=a,t.font=`700 ${Math.round(l.fontSize)}px ui-sans-serif, system-ui, sans-serif`,e.forEach(u=>{const h=gt(u.x,n,r),p=wt(u.y,n,o),y=u.w/n.w*r,x=u.h/n.h*o,$=l.stroke/2;if(u.type==="rect")t.strokeRect(h+$,p+$,Math.max(0,y-l.stroke),Math.max(0,x-l.stroke));else if(u.type==="circle")t.beginPath(),t.ellipse(h+y/2,p+x/2,Math.max(.5,y/2-$),Math.max(.5,x/2-$),0,0,Math.PI*2),t.stroke();else if(u.type==="arrow"){const z=gt(u.x2??u.x+u.w,n,r),q=wt(u.y2??u.y,n,o);Xn(t,h,p,z,q,l)}if(u.number==null||u.number==="")return;const F=Kn(u,n,r,o,h,p,y),Q=String(u.number);t.beginPath(),t.arc(F.x,F.y,l.badgeRadius,0,Math.PI*2),t.fillStyle=a,t.fill(),t.fillStyle=c,t.textAlign="center",t.textBaseline="middle",t.fillText(Q,F.x,F.y+.5),t.fillStyle=a}),t.restore()}function gt(t,e,n){return(t-e.x)/e.w*n}function wt(t,e,n){return(t-e.y)/e.h*n}function Kn(t,e,n,r,o,i,a){if(t.type==="arrow"){const c=gt(t.x2??t.x+t.w,e,n),l=wt(t.y2??t.y,e,r);return{x:(o+c)/2,y:(i+l)/2}}return{x:o+a/2,y:i}}function ae(t,e,n,r,o){const i=Math.atan2(r-e,n-t),a=o.arrowHead,c=Math.min(o.stroke,a*.2),l=n,u=r,h=n-Math.cos(i)*a,p=r-Math.sin(i)*a,y={x:l-a*Math.cos(i-o.arrowHeadAngle),y:u-a*Math.sin(i-o.arrowHeadAngle)},x={x:l-a*Math.cos(i+o.arrowHeadAngle),y:u-a*Math.sin(i+o.arrowHeadAngle)},$={x:n-Math.cos(i)*c,y:r-Math.sin(i)*c};return{angle:i,tipX:l,tipY:u,baseX:h,baseY:p,left:y,right:x,shaftEnd:$}}function Xn(t,e,n,r,o,i){const a=ae(e,n,r,o,i);t.beginPath(),t.moveTo(e,n),t.lineTo(a.shaftEnd.x,a.shaftEnd.y),t.stroke(),t.beginPath(),t.moveTo(a.tipX,a.tipY),t.lineTo(a.left.x,a.left.y),t.lineTo(a.right.x,a.right.y),t.closePath(),t.fill()}function Yn(t,e,n,r={}){return new Promise((o,i)=>{const a=new Image;a.onload=()=>{const c=Math.round(e.x*a.width),l=Math.round(e.y*a.height),u=Math.max(1,Math.round(e.w*a.width)),h=Math.max(1,Math.round(e.h*a.height)),p=document.createElement("canvas");p.width=u,p.height=h;const y=p.getContext("2d");y.drawImage(a,c,l,u,h,0,0,u,h),Wn(y,{stickers:n,crop:e,width:u,height:h,colors:r}),p.toBlob(x=>{if(!x){i(new Error("Could not encode screenshot"));return}o(x)},"image/png")},a.onerror=()=>i(new Error("Could not load screenshot")),a.src=t})}const B=[{id:"bug",label:"Bug"},{id:"idea",label:"Idea"},{id:"other",label:"Other"}];function se(t){return String(t||"").trim().toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"").slice(0,32)}function bt(t){const e=String(t||"").trim();return e?e.split(/[-_\s]+/).filter(Boolean).map(n=>n.charAt(0).toUpperCase()+n.slice(1)).join(" "):""}function Gn(t){if(!Array.isArray(t)||!t.length)return B.map(r=>({...r}));const e=new Set,n=[];for(const r of t){let o="",i="";typeof r=="string"||typeof r=="number"?(o=se(r),i=bt(o)):r&&typeof r=="object"&&(o=se(r.id??r.value??r.kind),i=String(r.label||r.name||bt(o)).trim()||bt(o)),!(!o||e.has(o))&&(e.add(o),n.push({id:o,label:i}))}return n.length?n:B.map(r=>({...r}))}function rt(t){var n;const e=Array.isArray(t)&&t.length?t:B;return e.some(r=>r.id==="bug")?"bug":((n=e[0])==null?void 0:n.id)||"other"}const Jn=["maker","all-business","brighter-day","quiet-night"],ce="maker",Qn=new Set(["crop","arrow","rect","circle"]),St=.02,le=.05,Zn=`
|
|
3
3
|
<svg class="nf-launcher-icon" viewBox="0 0 24 24" aria-hidden="true">
|
|
4
4
|
<path fill="currentColor" d="M5.2 2.8h9.1A2.7 2.7 0 0 1 17 5.5v8.2c0 .4-.3.7-.7.7h-.1a.7.7 0 0 1-.7-.7V5.5c0-.7-.6-1.3-1.3-1.3H5.2c-.7 0-1.3.6-1.3 1.3v12.2c0 .7.6 1.3 1.3 1.3h6.4a.7.7 0 0 1 0 1.4H5.2A2.7 2.7 0 0 1 2.5 17.7V5.5A2.7 2.7 0 0 1 5.2 2.8zm1.6 4.2a.7.7 0 0 0 0 1.4h6.2a.7.7 0 0 0 0-1.4H6.8zm0 3.2a.7.7 0 0 0 0 1.4h6.2a.7.7 0 0 0 0-1.4H6.8zm0 3.2a.7.7 0 0 0 0 1.4h3.6a.7.7 0 0 0 0-1.4H6.8z"/>
|
|
5
5
|
<path fill="currentColor" d="M14.7 13.05 20.2 7.55a1.55 1.55 0 0 1 2.2 2.2l-5.5 5.5-.45 1.9a.6.6 0 0 1-.72.45l-1.9-.45.87-1.9z"/>
|
|
6
6
|
</svg>
|
|
7
|
-
`;function
|
|
7
|
+
`;function I(t){return`<svg class="nf-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${t}</svg>`}const P={crop:I('<path d="M6 3v5H1M18 21v-5h5M8 5h8a2 2 0 0 1 2 2v8M16 19H8a2 2 0 0 1-2-2V8"/>'),resetCrop:I('<path d="M3 12a9 9 0 1 0 3-6.7L3 8"/><path d="M3 3v5h5"/>'),arrow:I('<path d="M5 19 19 5"/><path d="M9 5h10v10"/>'),rect:I('<rect x="4" y="6" width="16" height="12" rx="1.5"/>'),circle:I('<circle cx="12" cy="12" r="8"/>'),discard:I('<path d="M4 7h16"/><path d="M9 7V5h6v2"/><path d="M6 7l1 13h10l1-13"/>'),audio:I('<rect x="9" y="3" width="6" height="11" rx="3"/><path d="M5 11a7 7 0 0 0 14 0"/><path d="M12 18v3"/>'),video:I('<rect x="3" y="7" width="13" height="10" rx="2"/><path d="M16 10.5 21 8v8l-5-2.5z"/>')},ue=Un();ue.hook();const de=10,tr=80,fe="notefully.author",vt="Anonymous";let d={endpoint:"",projectKey:"",version:"0.0.0",name:"",targets:null,hideLauncher:!1,theme:ce,video:!1,consoleLogLimit:de,kinds:B.map(t=>({...t}))},L={},f=null,s={},m=oe(),S="",K="",T=null,U=rt(B),O=null,R=null,w=null,b=null,it=null,j=null,X=null,H={w:0,h:0},xt=!1,Et=!1;function g(t){return f.querySelector(t)}function he(t){const e=String(t||"").trim().toLowerCase().replace(/\s+/g,"-");return Jn.includes(e)?e:ce}function me(t,e){return f&&getComputedStyle(f).getPropertyValue(t).trim()||e}async function er(t){return(await fetch(t)).blob()}function v(t,e=!1){s.status&&(s.status.textContent=t||"",it&&(clearTimeout(it),it=null),t&&!e&&(it=setTimeout(()=>{s.status.textContent=""},4e3)))}function Mt(){return f&&document.body.contains(f)||(f=document.createElement("div"),f.id="notefully",f.innerHTML=`
|
|
8
8
|
<button class="nf-launcher" type="button" title="Leave a note…" aria-label="Leave a note…">${Zn}</button>
|
|
9
9
|
<div class="nf-dialog" hidden>
|
|
10
10
|
<div class="nf-panel">
|
|
11
11
|
<div class="nf-panel-body">
|
|
12
12
|
<div class="nf-stage">
|
|
13
13
|
<div class="nf-palette">
|
|
14
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="crop" title="Crop" aria-label="Crop">${
|
|
15
|
-
<button class="nf-reset-crop nf-icon-btn" type="button" title="Reset crop" aria-label="Reset crop" hidden>${
|
|
16
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="arrow" title="Arrow" aria-label="Arrow">${
|
|
17
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="rect" title="Rectangle" aria-label="Rectangle">${
|
|
18
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="circle" title="Circle" aria-label="Circle">${
|
|
14
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="crop" title="Crop" aria-label="Crop">${P.crop}</button>
|
|
15
|
+
<button class="nf-reset-crop nf-icon-btn" type="button" title="Reset crop" aria-label="Reset crop" hidden>${P.resetCrop}</button>
|
|
16
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="arrow" title="Arrow" aria-label="Arrow">${P.arrow}</button>
|
|
17
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="rect" title="Rectangle" aria-label="Rectangle">${P.rect}</button>
|
|
18
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="circle" title="Circle" aria-label="Circle">${P.circle}</button>
|
|
19
|
+
<button class="nf-discard-shot nf-icon-btn" type="button" title="Discard screenshot" aria-label="Discard screenshot">${P.discard}</button>
|
|
19
20
|
</div>
|
|
20
21
|
<div class="nf-canvas"></div>
|
|
21
22
|
</div>
|
|
@@ -23,20 +24,19 @@ var Notefully=(function(C){"use strict";function Ie(t,e){if(t.match(/^[a-z]+:\/\
|
|
|
23
24
|
<input class="nf-author" type="text" name="author" autocomplete="nickname" placeholder="Anonymous" aria-label="Author">
|
|
24
25
|
<div class="nf-kind"></div>
|
|
25
26
|
<div class="nf-actions">
|
|
26
|
-
<button class="nf-
|
|
27
|
-
<button class="nf-audio nf-icon-btn" type="button" title="Record audio" aria-label="Record audio">${
|
|
28
|
-
<button class="nf-video nf-icon-btn" type="button" title="Record video" aria-label="Record video">${
|
|
27
|
+
<button class="nf-restore nf-icon-btn" type="button" title="Restore screenshot" aria-label="Restore screenshot" hidden>${P.resetCrop}</button>
|
|
28
|
+
<button class="nf-audio nf-icon-btn" type="button" title="Record audio" aria-label="Record audio">${P.audio}</button>
|
|
29
|
+
<button class="nf-video nf-icon-btn" type="button" title="Record video" aria-label="Record video">${P.video}</button>
|
|
29
30
|
<button class="nf-submit" type="button">Submit</button>
|
|
30
31
|
</div>
|
|
31
|
-
<button class="nf-restore" type="button" hidden>Restore screenshot</button>
|
|
32
32
|
<div class="nf-status"></div>
|
|
33
33
|
</div>
|
|
34
34
|
<p class="nf-success-msg" hidden aria-live="polite">Submitted!</p>
|
|
35
35
|
</div>
|
|
36
36
|
</div>
|
|
37
37
|
<button class="nf-stop-video" type="button" hidden>Stop</button>
|
|
38
|
-
`,document.body.appendChild(f),s={launcher:g(".nf-launcher"),dialog:g(".nf-dialog"),panel:g(".nf-panel"),panelBody:g(".nf-panel-body"),successMsg:g(".nf-success-msg"),stage:g(".nf-stage"),canvas:g(".nf-canvas"),text:g(".nf-text"),author:g(".nf-author"),restore:g(".nf-restore"),status:g(".nf-status"),audio:g(".nf-audio"),video:g(".nf-video"),discard:g(".nf-discard-shot"),stop:g(".nf-stop-video"),resetCrop:g(".nf-reset-crop"),submit:g(".nf-submit"),shot:null},nr(),Y()),f}function Y(){var t;f&&(f.dataset.theme=he(d.theme),d.hideLauncher?f.setAttribute("data-nf-hidden-launcher",""):f.removeAttribute("data-nf-hidden-launcher"),s.video&&(s.video.hidden=!d.video),ye(),(t=s.dialog)!=null&&t.hidden&&ot())}function ot(){s.launcher&&(s.launcher.hidden=!!d.hideLauncher)}function nr(){s.launcher.addEventListener("click",()=>It()),g(".nf-dialog").addEventListener("click",e=>{Et||e.target===s.dialog&&V()}),f.querySelectorAll(".nf-tool").forEach(e=>{e.addEventListener("click",()=>At(e.dataset.tool))}),s.resetCrop.addEventListener("click",lr),s.canvas.addEventListener("pointerdown",ir),s.canvas.addEventListener("dragstart",e=>e.preventDefault());const t=g(".nf-kind");t&&t.addEventListener("click",e=>{const n=e.target.closest("[data-kind]");n&&Ct(n.dataset.kind)}),s.discard.addEventListener("click",ur),s.restore.addEventListener("click",dr),s.audio.addEventListener("click",fr),s.video.addEventListener("click",hr),s.stop.addEventListener("click",()=>X==null?void 0:X.stop()),g(".nf-submit").addEventListener("click",()=>{Ot().catch(e=>v(e.message||"Submit failed."))}),ye(),At(null)}function pe(t){return String(t||"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function ye(){const t=f==null?void 0:f.querySelector(".nf-kind");if(!t)return;const e=Array.isArray(d.kinds)&&d.kinds.length?d.kinds:B;t.innerHTML=e.map(o=>`<button type="button" data-kind="${pe(o.id)}">${pe(o.label)}</button>`).join("");const r=e.map(o=>o.id).includes(U)?U:rt(e);Ct(r)}function Ct(t){U=(d.kinds||B).map(n=>n.id).includes(t)?t:rt(d.kinds),f==null||f.querySelectorAll("[data-kind]").forEach(n=>{n.dataset.active=String(n.dataset.kind===U)})}function At(t){O=Qn.has(t)?t:null,R=null,f.querySelectorAll(".nf-tool").forEach(e=>{e.dataset.active=String(e.dataset.tool===O)}),s.canvas&&(s.canvas.dataset.draw=O?"true":"false"),S&&A()}function ge(t){return Math.min(1,Math.max(0,t))}function G(){return s.shot||s.canvas}function at(t){const e=G().getBoundingClientRect();return{x:ge((t.clientX-e.left)/Math.max(e.width,1)),y:ge((t.clientY-e.top)/Math.max(e.height,1))}}function rr(t){const e=G().getBoundingClientRect();return t.clientX>=e.left&&t.clientX<=e.right&&t.clientY>=e.top&&t.clientY<=e.bottom}function we(t){const e=at(t),n=m.crop();return{x:n.x+e.x*n.w,y:n.y+e.y*n.h}}function st(t,e){const n=Math.min(t.x,e.x),r=Math.min(t.y,e.y);return{x:n,y:r,w:Math.max(St,Math.abs(e.x-t.x)),h:Math.max(St,Math.abs(e.y-t.y))}}function Lt(t){f&&(t?f.dataset.grabbing="true":delete f.dataset.grabbing)}function Rt(t){try{s.canvas.setPointerCapture(t.pointerId)}catch{}}function $t(){window.addEventListener("pointermove",Se),window.addEventListener("pointerup",ct),window.addEventListener("pointercancel",ct)}function be(){window.removeEventListener("pointermove",Se),window.removeEventListener("pointerup",ct),window.removeEventListener("pointercancel",ct)}function ir(t){if(t.button!==0||!S)return;if(!t.target.closest(".nf-sticker")&&!rr(t)){R=null,A();return}const e=t.target.closest(".nf-handle"),n=t.target.closest(".nf-sticker");if(n&&n.dataset.preview!=="true"){t.preventDefault(),t.stopPropagation(),R=n.dataset.id,Rt(t),or({kind:"sticker",id:R,dir:(e==null?void 0:e.dataset.dir)||"move"},t),A();return}if(R=null,O==="crop"){t.preventDefault(),Rt(t),w={kind:"crop",start:at(t),current:at(t)},$t(),A();return}if(O==="arrow"||O==="rect"||O==="circle"){t.preventDefault(),Rt(t);const r=we(t);w={kind:"sticker",type:O,start:r,current:r},$t(),A();return}A()}function or(t,e){e.preventDefault(),e.stopPropagation();const n=G().getBoundingClientRect(),r=m.list().find(o=>o.id===t.id);b={...t,startX:e.clientX,startY:e.clientY,crop:m.crop(),sticker:r?{...r}:null,rect:n},Lt(t.dir==="move"||t.dir==="start"||t.dir==="end"),$t()}function Se(t){if(w){w.current=w.kind==="crop"?at(t):we(t),A();return}if(!b)return;const e=(t.clientX-b.startX)/b.rect.width*b.crop.w,n=(t.clientY-b.startY)/b.rect.height*b.crop.h,r=b.sticker;if(r){if(b.dir==="end")m.update(r.id,{x2:r.x2+e,y2:r.y2+n});else if(b.dir==="start")m.update(r.id,{x:r.x+e,y:r.y+n});else if(b.dir==="move")m.update(r.id,{x:r.x+e,y:r.y+n,x2:(r.x2||r.x)+e,y2:(r.y2||r.y)+n});else{const o={x:r.x,y:r.y,w:r.w,h:r.h};ar(o,b.dir,e,n),m.update(r.id,o)}A()}}function ar(t,e,n,r){if(e.includes("e")&&(t.w=Math.max(.04,t.w+n)),e.includes("s")&&(t.h=Math.max(.04,t.h+r)),e.includes("w")){const o=Math.max(.04,t.w-n);t.x+=t.w-o,t.w=o}if(e.includes("n")){const o=Math.max(.04,t.h-r);t.y+=t.h-o,t.h=o}}function ct(t){if(be(),Lt(!1),w){sr();return}if(b){if(b.kind==="sticker"){const e=s.canvas.getBoundingClientRect();(t.clientX<e.left-24||t.clientX>e.right+24||t.clientY<e.top-24||t.clientY>e.bottom+24)&&(m.remove(b.id),R=null)}b=null,A()}}function sr(){const t=w;if(w=null,!t)return;if(t.kind==="crop"){const n=st(t.start,t.current);if(Math.abs(t.current.x-t.start.x)<le||Math.abs(t.current.y-t.start.y)<le){A();return}const o=m.crop();m.setCrop({x:o.x+n.x*o.w,y:o.y+n.y*o.h,w:n.w*o.w,h:n.h*o.h}),J();return}const e=cr(t);e&&(R=e.id),A()}function cr(t){if(t.type==="arrow"){const e=t.current.x-t.start.x,n=t.current.y-t.start.y;return Math.hypot(e,n)<St?m.add("arrow",{x:t.start.x,y:t.start.y,x2:t.start.x+.12,y2:t.start.y,w:.12,h:.02}):m.add("arrow",{x:t.start.x,y:t.start.y,x2:t.current.x,y2:t.current.y,w:Math.abs(e),h:Math.abs(n)})}return m.add(t.type,st(t.start,t.current))}function lr(){m.resetCrop(),R=null,J()}function Pt(){s.resetCrop&&(s.resetCrop.hidden=!m.isCropped())}function Tt(t){if(!s.audio)return;const e=t?"Stop audio":"Record audio";s.audio.title=e,s.audio.setAttribute("aria-label",e),s.audio.dataset.active=String(!!t)}function ur(){S&&(K=S),S="",s.stage.hidden=!0,s.restore.hidden=!K}function dr(){K&&(S=K,s.stage.hidden=!1,s.restore.hidden=!0,J())}function fr(){try{if(j||(j=jn(e=>{const n=s.text.value.trim();s.text.value=n?`${n} ${e}`:e})),!j.isSupported()){v("Audio-to-text is not supported in this browser.");return}const t=j.start();Tt(t),v(t?"Listening…":"")}catch(t){v(t.message)}}async function hr(){if(!d.video){v("Video is disabled on this host.");return}s.dialog.hidden=!0,s.stop.hidden=!1,Y(),s.launcher.hidden=!0,X=_n({onStart(){},onStop(t){P=t,s.stop.hidden=!0,ot(),s.dialog.hidden=!1,J(),v(t?"Video attached.":"Recording cancelled.")},onError(t){v(t.message)}});try{await X.start()}catch(t){s.stop.hidden=!0,ot(),s.dialog.hidden=!1,v(t.message)}}function J(){if(s.shot=null,!S){s.canvas.style.removeProperty("--nf-shot-aspect"),s.canvas.style.removeProperty("aspect-ratio"),s.canvas.innerHTML=P?`<video class="nf-recording-preview" controls src="${URL.createObjectURL(P)}"></video>`:"",Pt();return}s.canvas.innerHTML=`<div class="nf-shot"><img alt="Screenshot" src="${S}" draggable="false"></div>`,s.shot=s.canvas.querySelector(".nf-shot");const t=s.shot.querySelector("img");t.draggable=!1,t.addEventListener("dragstart",n=>n.preventDefault());const e=()=>{mr(t),A()};t.addEventListener("load",e),t.complete&&t.naturalWidth&&e()}function mr(t){const e=t.naturalWidth||H.w,n=t.naturalHeight||H.h;if(e&&n&&(H={w:e,h:n},s.canvas.style.setProperty("--nf-shot-aspect",String(e/n)),s.canvas.style.aspectRatio=`${e} / ${n}`),!s.shot||!H.w||!H.h)return;const r=m.crop(),o=H.w/H.h,i=r.w/r.h*o,a=Math.min(1,i/o),c=Math.min(1,o/i);s.shot.style.left=`${(1-a)/2*100}%`,s.shot.style.top=`${(1-c)/2*100}%`,s.shot.style.width=`${a*100}%`,s.shot.style.height=`${c*100}%`,t.style.width=`${100/r.w}%`,t.style.height=`${100/r.h}%`,t.style.left=`${-r.x/r.w*100}%`,t.style.top=`${-r.y/r.h*100}%`}function pr(t){return t.type==="arrow"?{id:"preview",type:"arrow",number:"",x:t.start.x,y:t.start.y,x2:t.current.x,y2:t.current.y,w:Math.abs(t.current.x-t.start.x),h:Math.abs(t.current.y-t.start.y)}:{id:"preview",type:t.type,number:"",...st(t.start,t.current)}}function A(){if((s.shot||s.canvas).querySelectorAll(".nf-sticker, .nf-crop").forEach(i=>i.remove()),!S||!s.shot){Pt();return}const e=m.crop(),n=G(),r=yt(n.clientWidth||400);if(s.shot.style.setProperty("--nf-anno-stroke",`${r.stroke}px`),s.shot.style.setProperty("--nf-anno-badge",`${r.badgeRadius*2}px`),s.shot.style.setProperty("--nf-anno-badge-font",`${r.fontSize}px`),s.shot.style.setProperty("--nf-anno-handle",`${Math.max(8,r.stroke*2.5)}px`),(w==null?void 0:w.kind)==="crop"){const i=document.createElement("div");i.className="nf-crop",ve(i,st(w.start,w.current),{x:0,y:0,w:1,h:1}),s.shot.appendChild(i)}const o=m.list().slice();if((w==null?void 0:w.kind)==="sticker"&&o.push(pr(w)),o.forEach(i=>{const a=i.id==="preview",c=!a&&i.id===R,l=document.createElement("div");if(l.className=`nf-sticker nf-${i.type}`,l.dataset.id=i.id,c&&(l.dataset.selected="true"),a&&(l.dataset.preview="true"),i.type==="arrow"?yr(l,i,e,c,r):(ve(l,i,e),c&&["nw","ne","sw","se"].forEach(u=>kt(l,u))),!a&&i.number){const u=document.createElement("span");u.className="nf-badge",u.textContent=String(i.number),l.appendChild(u)}s.shot.appendChild(l)}),s.canvas.querySelectorAll(":scope > .nf-recording-preview").forEach(i=>i.remove()),P){const i=document.createElement("video");i.className="nf-recording-preview",i.controls=!0,i.src=URL.createObjectURL(P),i.style.position="absolute",i.style.right="8px",i.style.bottom="8px",i.style.width="160px",s.canvas.appendChild(i)}Pt()}function yr(t,e,n,r,o=yt(400)){const i=G(),a=i.clientWidth,c=i.clientHeight,l=(e.x-n.x)/n.w*a,u=(e.y-n.y)/n.h*c,h=((e.x2??e.x+e.w)-n.x)/n.w*a,p=((e.y2??e.y)-n.y)/n.h*c,y=Math.max(18,o.arrowHead+o.stroke*2),x=Math.min(l,h)-y,$=Math.min(u,p)-y,F=Math.max(2,Math.abs(h-l))+y*2,Q=Math.max(2,Math.abs(p-u))+y*2,z=l-x,q=u-$,Ht=h-x,Ft=p-$,D=ae(z,q,Ht,Ft,o),W=document.createElementNS("http://www.w3.org/2000/svg","svg");t.style.left=`${x}px`,t.style.top=`${$}px`,t.style.width=`${F}px`,t.style.height=`${Q}px`,W.setAttribute("class","nf-arrow-svg"),W.setAttribute("viewBox",`0 0 ${F} ${Q}`),W.setAttribute("width",String(F)),W.setAttribute("height",String(Q)),W.innerHTML=`
|
|
38
|
+
`,document.body.appendChild(f),s={launcher:g(".nf-launcher"),dialog:g(".nf-dialog"),panel:g(".nf-panel"),panelBody:g(".nf-panel-body"),successMsg:g(".nf-success-msg"),stage:g(".nf-stage"),canvas:g(".nf-canvas"),text:g(".nf-text"),author:g(".nf-author"),restore:g(".nf-restore"),status:g(".nf-status"),audio:g(".nf-audio"),video:g(".nf-video"),discard:g(".nf-discard-shot"),stop:g(".nf-stop-video"),resetCrop:g(".nf-reset-crop"),submit:g(".nf-submit"),shot:null},nr(),Y()),f}function Y(){var t;f&&(f.dataset.theme=he(d.theme),d.hideLauncher?f.setAttribute("data-nf-hidden-launcher",""):f.removeAttribute("data-nf-hidden-launcher"),s.video&&(s.video.hidden=!d.video),ye(),(t=s.dialog)!=null&&t.hidden&&ot())}function ot(){s.launcher&&(s.launcher.hidden=!!d.hideLauncher)}function nr(){s.launcher.addEventListener("click",()=>It()),g(".nf-dialog").addEventListener("click",e=>{Et||e.target===s.dialog&&V()}),f.querySelectorAll(".nf-tool").forEach(e=>{e.addEventListener("click",()=>At(e.dataset.tool))}),s.resetCrop.addEventListener("click",lr),s.canvas.addEventListener("pointerdown",ir),s.canvas.addEventListener("dragstart",e=>e.preventDefault());const t=g(".nf-kind");t&&t.addEventListener("click",e=>{const n=e.target.closest("[data-kind]");n&&Ct(n.dataset.kind)}),s.discard.addEventListener("click",ur),s.restore.addEventListener("click",dr),s.audio.addEventListener("click",fr),s.video.addEventListener("click",hr),s.stop.addEventListener("click",()=>X==null?void 0:X.stop()),g(".nf-submit").addEventListener("click",()=>{Ot().catch(e=>v(e.message||"Submit failed."))}),ye(),At(null)}function pe(t){return String(t||"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function ye(){const t=f==null?void 0:f.querySelector(".nf-kind");if(!t)return;const e=Array.isArray(d.kinds)&&d.kinds.length?d.kinds:B;t.innerHTML=e.map(o=>`<button type="button" data-kind="${pe(o.id)}">${pe(o.label)}</button>`).join("");const r=e.map(o=>o.id).includes(U)?U:rt(e);Ct(r)}function Ct(t){U=(d.kinds||B).map(n=>n.id).includes(t)?t:rt(d.kinds),f==null||f.querySelectorAll("[data-kind]").forEach(n=>{n.dataset.active=String(n.dataset.kind===U)})}function At(t){O=Qn.has(t)?t:null,R=null,f.querySelectorAll(".nf-tool").forEach(e=>{e.dataset.active=String(e.dataset.tool===O)}),s.canvas&&(s.canvas.dataset.draw=O?"true":"false"),S&&A()}function ge(t){return Math.min(1,Math.max(0,t))}function G(){return s.shot||s.canvas}function at(t){const e=G().getBoundingClientRect();return{x:ge((t.clientX-e.left)/Math.max(e.width,1)),y:ge((t.clientY-e.top)/Math.max(e.height,1))}}function rr(t){const e=G().getBoundingClientRect();return t.clientX>=e.left&&t.clientX<=e.right&&t.clientY>=e.top&&t.clientY<=e.bottom}function we(t){const e=at(t),n=m.crop();return{x:n.x+e.x*n.w,y:n.y+e.y*n.h}}function st(t,e){const n=Math.min(t.x,e.x),r=Math.min(t.y,e.y);return{x:n,y:r,w:Math.max(St,Math.abs(e.x-t.x)),h:Math.max(St,Math.abs(e.y-t.y))}}function Lt(t){f&&(t?f.dataset.grabbing="true":delete f.dataset.grabbing)}function Rt(t){try{s.canvas.setPointerCapture(t.pointerId)}catch{}}function $t(){window.addEventListener("pointermove",Se),window.addEventListener("pointerup",ct),window.addEventListener("pointercancel",ct)}function be(){window.removeEventListener("pointermove",Se),window.removeEventListener("pointerup",ct),window.removeEventListener("pointercancel",ct)}function ir(t){if(t.button!==0||!S)return;if(!t.target.closest(".nf-sticker")&&!rr(t)){R=null,A();return}const e=t.target.closest(".nf-handle"),n=t.target.closest(".nf-sticker");if(n&&n.dataset.preview!=="true"){t.preventDefault(),t.stopPropagation(),R=n.dataset.id,Rt(t),or({kind:"sticker",id:R,dir:(e==null?void 0:e.dataset.dir)||"move"},t),A();return}if(R=null,O==="crop"){t.preventDefault(),Rt(t),w={kind:"crop",start:at(t),current:at(t)},$t(),A();return}if(O==="arrow"||O==="rect"||O==="circle"){t.preventDefault(),Rt(t);const r=we(t);w={kind:"sticker",type:O,start:r,current:r},$t(),A();return}A()}function or(t,e){e.preventDefault(),e.stopPropagation();const n=G().getBoundingClientRect(),r=m.list().find(o=>o.id===t.id);b={...t,startX:e.clientX,startY:e.clientY,crop:m.crop(),sticker:r?{...r}:null,rect:n},Lt(t.dir==="move"||t.dir==="start"||t.dir==="end"),$t()}function Se(t){if(w){w.current=w.kind==="crop"?at(t):we(t),A();return}if(!b)return;const e=(t.clientX-b.startX)/b.rect.width*b.crop.w,n=(t.clientY-b.startY)/b.rect.height*b.crop.h,r=b.sticker;if(r){if(b.dir==="end")m.update(r.id,{x2:r.x2+e,y2:r.y2+n});else if(b.dir==="start")m.update(r.id,{x:r.x+e,y:r.y+n});else if(b.dir==="move")m.update(r.id,{x:r.x+e,y:r.y+n,x2:(r.x2||r.x)+e,y2:(r.y2||r.y)+n});else{const o={x:r.x,y:r.y,w:r.w,h:r.h};ar(o,b.dir,e,n),m.update(r.id,o)}A()}}function ar(t,e,n,r){if(e.includes("e")&&(t.w=Math.max(.04,t.w+n)),e.includes("s")&&(t.h=Math.max(.04,t.h+r)),e.includes("w")){const o=Math.max(.04,t.w-n);t.x+=t.w-o,t.w=o}if(e.includes("n")){const o=Math.max(.04,t.h-r);t.y+=t.h-o,t.h=o}}function ct(t){if(be(),Lt(!1),w){sr();return}if(b){if(b.kind==="sticker"){const e=s.canvas.getBoundingClientRect();(t.clientX<e.left-24||t.clientX>e.right+24||t.clientY<e.top-24||t.clientY>e.bottom+24)&&(m.remove(b.id),R=null)}b=null,A()}}function sr(){const t=w;if(w=null,!t)return;if(t.kind==="crop"){const n=st(t.start,t.current);if(Math.abs(t.current.x-t.start.x)<le||Math.abs(t.current.y-t.start.y)<le){A();return}const o=m.crop();m.setCrop({x:o.x+n.x*o.w,y:o.y+n.y*o.h,w:n.w*o.w,h:n.h*o.h}),J();return}const e=cr(t);e&&(R=e.id),A()}function cr(t){if(t.type==="arrow"){const e=t.current.x-t.start.x,n=t.current.y-t.start.y;return Math.hypot(e,n)<St?m.add("arrow",{x:t.start.x,y:t.start.y,x2:t.start.x+.12,y2:t.start.y,w:.12,h:.02}):m.add("arrow",{x:t.start.x,y:t.start.y,x2:t.current.x,y2:t.current.y,w:Math.abs(e),h:Math.abs(n)})}return m.add(t.type,st(t.start,t.current))}function lr(){m.resetCrop(),R=null,J()}function Pt(){s.resetCrop&&(s.resetCrop.hidden=!m.isCropped())}function Tt(t){if(!s.audio)return;const e=t?"Stop audio":"Record audio";s.audio.title=e,s.audio.setAttribute("aria-label",e),s.audio.dataset.active=String(!!t)}function ur(){S&&(K=S),S="",s.stage.hidden=!0,s.restore.hidden=!K}function dr(){K&&(S=K,s.stage.hidden=!1,s.restore.hidden=!0,J())}function fr(){try{if(j||(j=jn(e=>{const n=s.text.value.trim();s.text.value=n?`${n} ${e}`:e})),!j.isSupported()){v("Audio-to-text is not supported in this browser.");return}const t=j.start();Tt(t),v(t?"Listening…":"")}catch(t){v(t.message)}}async function hr(){if(!d.video){v("Video is disabled on this host.");return}s.dialog.hidden=!0,s.stop.hidden=!1,Y(),s.launcher.hidden=!0,X=_n({onStart(){},onStop(t){T=t,s.stop.hidden=!0,ot(),s.dialog.hidden=!1,J(),v(t?"Video attached.":"Recording cancelled.")},onError(t){v(t.message)}});try{await X.start()}catch(t){s.stop.hidden=!0,ot(),s.dialog.hidden=!1,v(t.message)}}function J(){if(s.shot=null,!S){s.canvas.style.removeProperty("--nf-shot-aspect"),s.canvas.style.removeProperty("aspect-ratio"),s.canvas.innerHTML=T?`<video class="nf-recording-preview" controls src="${URL.createObjectURL(T)}"></video>`:"",Pt();return}s.canvas.innerHTML=`<div class="nf-shot"><img alt="Screenshot" src="${S}" draggable="false"></div>`,s.shot=s.canvas.querySelector(".nf-shot");const t=s.shot.querySelector("img");t.draggable=!1,t.addEventListener("dragstart",n=>n.preventDefault());const e=()=>{mr(t),A()};t.addEventListener("load",e),t.complete&&t.naturalWidth&&e()}function mr(t){const e=t.naturalWidth||H.w,n=t.naturalHeight||H.h;if(e&&n&&(H={w:e,h:n},s.canvas.style.setProperty("--nf-shot-aspect",String(e/n)),s.canvas.style.aspectRatio=`${e} / ${n}`),!s.shot||!H.w||!H.h)return;const r=m.crop(),o=H.w/H.h,i=r.w/r.h*o,a=Math.min(1,i/o),c=Math.min(1,o/i);s.shot.style.left=`${(1-a)/2*100}%`,s.shot.style.top=`${(1-c)/2*100}%`,s.shot.style.width=`${a*100}%`,s.shot.style.height=`${c*100}%`,t.style.width=`${100/r.w}%`,t.style.height=`${100/r.h}%`,t.style.left=`${-r.x/r.w*100}%`,t.style.top=`${-r.y/r.h*100}%`}function pr(t){return t.type==="arrow"?{id:"preview",type:"arrow",number:"",x:t.start.x,y:t.start.y,x2:t.current.x,y2:t.current.y,w:Math.abs(t.current.x-t.start.x),h:Math.abs(t.current.y-t.start.y)}:{id:"preview",type:t.type,number:"",...st(t.start,t.current)}}function A(){if((s.shot||s.canvas).querySelectorAll(".nf-sticker, .nf-crop").forEach(i=>i.remove()),!S||!s.shot){Pt();return}const e=m.crop(),n=G(),r=yt(n.clientWidth||400);if(s.shot.style.setProperty("--nf-anno-stroke",`${r.stroke}px`),s.shot.style.setProperty("--nf-anno-badge",`${r.badgeRadius*2}px`),s.shot.style.setProperty("--nf-anno-badge-font",`${r.fontSize}px`),s.shot.style.setProperty("--nf-anno-handle",`${Math.max(8,r.stroke*2.5)}px`),(w==null?void 0:w.kind)==="crop"){const i=document.createElement("div");i.className="nf-crop",ve(i,st(w.start,w.current),{x:0,y:0,w:1,h:1}),s.shot.appendChild(i)}const o=m.list().slice();if((w==null?void 0:w.kind)==="sticker"&&o.push(pr(w)),o.forEach(i=>{const a=i.id==="preview",c=!a&&i.id===R,l=document.createElement("div");if(l.className=`nf-sticker nf-${i.type}`,l.dataset.id=i.id,c&&(l.dataset.selected="true"),a&&(l.dataset.preview="true"),i.type==="arrow"?yr(l,i,e,c,r):(ve(l,i,e),c&&["nw","ne","sw","se"].forEach(u=>kt(l,u))),!a&&i.number){const u=document.createElement("span");u.className="nf-badge",u.textContent=String(i.number),l.appendChild(u)}s.shot.appendChild(l)}),s.canvas.querySelectorAll(":scope > .nf-recording-preview").forEach(i=>i.remove()),T){const i=document.createElement("video");i.className="nf-recording-preview",i.controls=!0,i.src=URL.createObjectURL(T),i.style.position="absolute",i.style.right="8px",i.style.bottom="8px",i.style.width="160px",s.canvas.appendChild(i)}Pt()}function yr(t,e,n,r,o=yt(400)){const i=G(),a=i.clientWidth,c=i.clientHeight,l=(e.x-n.x)/n.w*a,u=(e.y-n.y)/n.h*c,h=((e.x2??e.x+e.w)-n.x)/n.w*a,p=((e.y2??e.y)-n.y)/n.h*c,y=Math.max(18,o.arrowHead+o.stroke*2),x=Math.min(l,h)-y,$=Math.min(u,p)-y,F=Math.max(2,Math.abs(h-l))+y*2,Q=Math.max(2,Math.abs(p-u))+y*2,z=l-x,q=u-$,Ht=h-x,Ft=p-$,D=ae(z,q,Ht,Ft,o),W=document.createElementNS("http://www.w3.org/2000/svg","svg");t.style.left=`${x}px`,t.style.top=`${$}px`,t.style.width=`${F}px`,t.style.height=`${Q}px`,W.setAttribute("class","nf-arrow-svg"),W.setAttribute("viewBox",`0 0 ${F} ${Q}`),W.setAttribute("width",String(F)),W.setAttribute("height",String(Q)),W.innerHTML=`
|
|
39
39
|
<line class="nf-arrow-hit" x1="${z}" y1="${q}" x2="${Ht}" y2="${Ft}" />
|
|
40
40
|
<line class="nf-arrow-shaft" x1="${z}" y1="${q}" x2="${D.shaftEnd.x}" y2="${D.shaftEnd.y}" />
|
|
41
41
|
<polygon class="nf-arrow-head" points="${D.tipX},${D.tipY} ${D.left.x},${D.left.y} ${D.right.x},${D.right.y}" />
|
|
42
|
-
`,t.appendChild(W),r&&(kt(t,"start",{left:z-5,top:q-5}),kt(t,"end",{left:Ht-5,top:Ft-5}))}function kt(t,e,n){const r=document.createElement("span");r.className="nf-handle",r.dataset.dir=e,n&&(r.style.left=`${n.left}px`,r.style.top=`${n.top}px`),t.appendChild(r)}function ve(t,e,n){t.style.left=`${(e.x-n.x)/n.w*100}%`,t.style.top=`${(e.y-n.y)/n.h*100}%`,t.style.width=`${e.w/n.w*100}%`,t.style.height=`${e.h/n.h*100}%`}function gr(){try{return String(localStorage.getItem(fe)||"").trim()}catch{return""}}function wr(t){const e=String(t||"").trim();if(!(!e||e===vt))try{localStorage.setItem(fe,e)}catch{}}function xe(){return!!(String(L.userId||"").trim()||String(L.email||"").trim()||String(L.displayName||"").trim())}function br(){return String(L.displayName||L.email||L.userId||"").trim()}function Sr(){var e;if(xe())return br()||vt;const t=String(((e=s.author)==null?void 0:e.value)||"").trim();return t?(wr(t),t):vt}function Ee(){if(!s.author)return;const t=xe();if(s.author.hidden=t,t){s.author.value="";return}s.author.value=gr()}function Me(t,e=de){const n=Number(t);return Number.isFinite(n)?Math.min(tr,Math.max(0,Math.floor(n))):e}function Ce(t={}){Dn(t);const e=Object.prototype.hasOwnProperty.call(t,"kinds");d={...d,endpoint:String(t.endpoint||d.endpoint||"").replace(/\/$/,""),projectKey:t.projectKey==null?d.projectKey:String(t.projectKey),version:t.version==null?d.version:String(t.version),name:t.name==null?d.name:String(t.name||""),targets:t.targets===void 0?d.targets:t.targets,hideLauncher:t.hideLauncher==null?d.hideLauncher:!!t.hideLauncher,theme:he(t.theme??d.theme),video:t.video==null?d.video:!!t.video,consoleLogLimit:t.consoleLogLimit==null?d.consoleLogLimit:Me(t.consoleLogLimit,d.consoleLogLimit),kinds:e?Gn(t.kinds):d.kinds}}function lt(t={}){return Ce(t),f&&Y(),ut}function Ae(t={}){return Ce(t),Mt(),Y(),ut}function Le(t){return lt({theme:t})}function Re(t){const e=!!t;return!e&&f&&s.dialog&&!s.dialog.hidden&&V(),lt({hideLauncher:!e})}async function It(){Mt(),$e(),Y(),s.launcher.hidden=!0,m=oe(),H={w:0,h:0},
|
|
42
|
+
`,t.appendChild(W),r&&(kt(t,"start",{left:z-5,top:q-5}),kt(t,"end",{left:Ht-5,top:Ft-5}))}function kt(t,e,n){const r=document.createElement("span");r.className="nf-handle",r.dataset.dir=e,n&&(r.style.left=`${n.left}px`,r.style.top=`${n.top}px`),t.appendChild(r)}function ve(t,e,n){t.style.left=`${(e.x-n.x)/n.w*100}%`,t.style.top=`${(e.y-n.y)/n.h*100}%`,t.style.width=`${e.w/n.w*100}%`,t.style.height=`${e.h/n.h*100}%`}function gr(){try{return String(localStorage.getItem(fe)||"").trim()}catch{return""}}function wr(t){const e=String(t||"").trim();if(!(!e||e===vt))try{localStorage.setItem(fe,e)}catch{}}function xe(){return!!(String(L.userId||"").trim()||String(L.email||"").trim()||String(L.displayName||"").trim())}function br(){return String(L.displayName||L.email||L.userId||"").trim()}function Sr(){var e;if(xe())return br()||vt;const t=String(((e=s.author)==null?void 0:e.value)||"").trim();return t?(wr(t),t):vt}function Ee(){if(!s.author)return;const t=xe();if(s.author.hidden=t,t){s.author.value="";return}s.author.value=gr()}function Me(t,e=de){const n=Number(t);return Number.isFinite(n)?Math.min(tr,Math.max(0,Math.floor(n))):e}function Ce(t={}){Dn(t);const e=Object.prototype.hasOwnProperty.call(t,"kinds");d={...d,endpoint:String(t.endpoint||d.endpoint||"").replace(/\/$/,""),projectKey:t.projectKey==null?d.projectKey:String(t.projectKey),version:t.version==null?d.version:String(t.version),name:t.name==null?d.name:String(t.name||""),targets:t.targets===void 0?d.targets:t.targets,hideLauncher:t.hideLauncher==null?d.hideLauncher:!!t.hideLauncher,theme:he(t.theme??d.theme),video:t.video==null?d.video:!!t.video,consoleLogLimit:t.consoleLogLimit==null?d.consoleLogLimit:Me(t.consoleLogLimit,d.consoleLogLimit),kinds:e?Gn(t.kinds):d.kinds}}function lt(t={}){return Ce(t),f&&Y(),ut}function Ae(t={}){return Ce(t),Mt(),Y(),ut}function Le(t){return lt({theme:t})}function Re(t){const e=!!t;return!e&&f&&s.dialog&&!s.dialog.hidden&&V(),lt({hideLauncher:!e})}async function It(){Mt(),$e(),Y(),s.launcher.hidden=!0,m=oe(),H={w:0,h:0},T=null,R=null,w=null,b=null,U=rt(d.kinds),Ct(U),At(null),Tt(!1),s.text.value="",Ee(),v("");try{S=await kn(),K=S,s.stage.hidden=!1,s.restore.hidden=!0,v("")}catch{S="",v("Screenshot failed; you can still send text.")}s.dialog.hidden=!1,J(),s.text.focus()}function V(){f&&(j==null||j.stop(),Tt(!1),be(),w=null,b=null,Lt(!1),$e(),s.dialog.hidden=!0,s.stop.hidden=!0,ot())}function vr(){const t=s.dialog,e=s.panel,n=s.panelBody,r=s.successMsg;if(!t||!e||!n||!r)return Promise.resolve();Et=!0,v("");const o=typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches,i=e.getBoundingClientRect();if(n.hidden=!0,r.hidden=!1,t.classList.add("nf-success"),t.style.opacity="1",o)return new Promise(u=>{window.setTimeout(()=>u(),1e3)});const a=e.getBoundingClientRect(),c=a.width>0?i.width/a.width:1,l=a.height>0?i.height/a.height:1;return e.style.transformOrigin="center center",e.style.transition="none",e.style.transform=`scale(${c}, ${l})`,e.getBoundingClientRect(),new Promise(u=>{let h=!1;const p=()=>{h||(h=!0,e.removeEventListener("transitionend",y),window.setTimeout(()=>{t.style.transition="opacity 0.28s ease",t.style.opacity="0",window.setTimeout(()=>u(),280)},1e3))},y=x=>{x.target!==e||x.propertyName!=="transform"||p()};e.addEventListener("transitionend",y),requestAnimationFrame(()=>{e.style.transition="transform 0.48s cubic-bezier(0.22, 1, 0.36, 1)",e.style.transform="scale(1)"}),window.setTimeout(p,700)})}function $e(){Et=!1,s.dialog&&(s.dialog.classList.remove("nf-success"),s.dialog.style.opacity="",s.dialog.style.transition="",s.panel&&(s.panel.style.transform="",s.panel.style.transition="",s.panel.style.transformOrigin=""),s.panelBody&&(s.panelBody.hidden=!1),s.successMsg&&(s.successMsg.hidden=!0))}function Pe(t={}){L={...L,...Fn(t)},Ee()}async function Ot(){if(Mt(),xt)return null;const t=s.text.value.trim();if(!t&&!S&&!T)return v("Add a note, screenshot, or video first."),null;if(!d.endpoint||!d.projectKey)return v("Notefully is missing endpoint or projectKey."),null;xt=!0,Te(!0),v("Submitting…",!0);try{const e=Sr(),n=new FormData;if(n.append("message",t),n.append("kind",U),n.append("version",d.version||"0.0.0"),n.append("author",e),d.name&&n.append("name",d.name),n.append("context",JSON.stringify({...Hn({...L,displayName:L.displayName||e}),author:e,console:ue.snapshot().slice(-Me(d.consoleLogLimit))})),n.append("annotations",JSON.stringify(m.list())),n.append("crop",JSON.stringify(m.crop())),Array.isArray(d.targets)&&n.append("targets",JSON.stringify(d.targets)),S){const i=await er(S);if(n.append("screenshot",i,"screenshot.png"),m.list().length||m.isCropped()){const a=await Yn(S,m.crop(),m.list(),{mark:me("--nf-mark","#fdd341"),markText:me("--nf-mark-text","#2a2140")});n.append("screenshotBaked",a,"screenshot.baked.png")}}T&&n.append("recording",T,"recording.webm");const r=await fetch(`${d.endpoint}/v1/reports`,{method:"POST",headers:{"X-Notefully-Key":d.projectKey},body:n});let o=null;try{o=await r.json()}catch{o=null}if(!r.ok)throw v((o==null?void 0:o.error)||"Submit failed."),new Error((o==null?void 0:o.error)||`Submit failed (${r.status})`);return await vr(),V(),o}finally{xt=!1,Te(!1)}}function Te(t){s.submit&&(s.submit.disabled=!!t,s.submit.setAttribute("aria-busy",t?"true":"false"))}function ke(){V(),f==null||f.remove(),f=null,s={}}const ut={init:Ae,configure:lt,setTheme:Le,setVisible:Re,open:It,close:V,identify:Pe,submit:Ot,destroy:ke};return typeof window<"u"&&(window.Notefully=ut),C.close=V,C.configure=lt,C.default=ut,C.destroy=ke,C.identify=Pe,C.init=Ae,C.open=It,C.setTheme=Le,C.setVisible=Re,C.submit=Ot,Object.defineProperties(C,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),C})({});
|
package/dist/notefully.js
CHANGED
|
@@ -857,8 +857,8 @@ function jn(t, {
|
|
|
857
857
|
}
|
|
858
858
|
if (u.number == null || u.number === "")
|
|
859
859
|
return;
|
|
860
|
-
const
|
|
861
|
-
t.beginPath(), t.arc(
|
|
860
|
+
const k = Nn(u, n, r, o, f, p, m), q = String(u.number);
|
|
861
|
+
t.beginPath(), t.arc(k.x, k.y, l.badgeRadius, 0, Math.PI * 2), t.fillStyle = a, t.fill(), t.fillStyle = c, t.textAlign = "center", t.textBaseline = "middle", t.fillText(q, k.x, k.y + 0.5), t.fillStyle = a;
|
|
862
862
|
}), t.restore();
|
|
863
863
|
}
|
|
864
864
|
function yt(t, e, n) {
|
|
@@ -950,18 +950,18 @@ const qn = ["maker", "all-business", "brighter-day", "quiet-night"], de = "maker
|
|
|
950
950
|
<path fill="currentColor" d="M14.7 13.05 20.2 7.55a1.55 1.55 0 0 1 2.2 2.2l-5.5 5.5-.45 1.9a.6.6 0 0 1-.72.45l-1.9-.45.87-1.9z"/>
|
|
951
951
|
</svg>
|
|
952
952
|
`;
|
|
953
|
-
function
|
|
953
|
+
function I(t) {
|
|
954
954
|
return `<svg class="nf-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${t}</svg>`;
|
|
955
955
|
}
|
|
956
|
-
const
|
|
957
|
-
crop:
|
|
958
|
-
resetCrop:
|
|
959
|
-
arrow:
|
|
960
|
-
rect:
|
|
961
|
-
circle:
|
|
962
|
-
discard:
|
|
963
|
-
audio:
|
|
964
|
-
video:
|
|
956
|
+
const $ = {
|
|
957
|
+
crop: I('<path d="M6 3v5H1M18 21v-5h5M8 5h8a2 2 0 0 1 2 2v8M16 19H8a2 2 0 0 1-2-2V8"/>'),
|
|
958
|
+
resetCrop: I('<path d="M3 12a9 9 0 1 0 3-6.7L3 8"/><path d="M3 3v5h5"/>'),
|
|
959
|
+
arrow: I('<path d="M5 19 19 5"/><path d="M9 5h10v10"/>'),
|
|
960
|
+
rect: I('<rect x="4" y="6" width="16" height="12" rx="1.5"/>'),
|
|
961
|
+
circle: I('<circle cx="12" cy="12" r="8"/>'),
|
|
962
|
+
discard: I('<path d="M4 7h16"/><path d="M9 7V5h6v2"/><path d="M6 7l1 13h10l1-13"/>'),
|
|
963
|
+
audio: I('<rect x="9" y="3" width="6" height="11" rx="3"/><path d="M5 11a7 7 0 0 0 14 0"/><path d="M12 18v3"/>'),
|
|
964
|
+
video: I('<rect x="3" y="7" width="13" height="10" rx="2"/><path d="M16 10.5 21 8v8l-5-2.5z"/>')
|
|
965
965
|
}, fe = In();
|
|
966
966
|
fe.hook();
|
|
967
967
|
const he = 10, Xn = 80, pe = "notefully.author", bt = "Anonymous";
|
|
@@ -976,7 +976,7 @@ let d = {
|
|
|
976
976
|
video: !1,
|
|
977
977
|
consoleLogLimit: he,
|
|
978
978
|
kinds: B.map((t) => ({ ...t }))
|
|
979
|
-
}, R = {}, h = null, s = {}, y = le(), S = "", K = "",
|
|
979
|
+
}, R = {}, h = null, s = {}, y = le(), S = "", K = "", P = null, U = at(B), H = null, L = null, b = null, w = null, Q = null, D = null, W = null, O = { w: 0, h: 0 }, ht = !1, Lt = !1;
|
|
980
980
|
function g(t) {
|
|
981
981
|
return h.querySelector(t);
|
|
982
982
|
}
|
|
@@ -1003,11 +1003,12 @@ function Rt() {
|
|
|
1003
1003
|
<div class="nf-panel-body">
|
|
1004
1004
|
<div class="nf-stage">
|
|
1005
1005
|
<div class="nf-palette">
|
|
1006
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="crop" title="Crop" aria-label="Crop">${
|
|
1007
|
-
<button class="nf-reset-crop nf-icon-btn" type="button" title="Reset crop" aria-label="Reset crop" hidden>${
|
|
1008
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="arrow" title="Arrow" aria-label="Arrow">${
|
|
1009
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="rect" title="Rectangle" aria-label="Rectangle">${
|
|
1010
|
-
<button class="nf-tool nf-icon-btn" type="button" data-tool="circle" title="Circle" aria-label="Circle">${
|
|
1006
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="crop" title="Crop" aria-label="Crop">${$.crop}</button>
|
|
1007
|
+
<button class="nf-reset-crop nf-icon-btn" type="button" title="Reset crop" aria-label="Reset crop" hidden>${$.resetCrop}</button>
|
|
1008
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="arrow" title="Arrow" aria-label="Arrow">${$.arrow}</button>
|
|
1009
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="rect" title="Rectangle" aria-label="Rectangle">${$.rect}</button>
|
|
1010
|
+
<button class="nf-tool nf-icon-btn" type="button" data-tool="circle" title="Circle" aria-label="Circle">${$.circle}</button>
|
|
1011
|
+
<button class="nf-discard-shot nf-icon-btn" type="button" title="Discard screenshot" aria-label="Discard screenshot">${$.discard}</button>
|
|
1011
1012
|
</div>
|
|
1012
1013
|
<div class="nf-canvas"></div>
|
|
1013
1014
|
</div>
|
|
@@ -1015,12 +1016,11 @@ function Rt() {
|
|
|
1015
1016
|
<input class="nf-author" type="text" name="author" autocomplete="nickname" placeholder="Anonymous" aria-label="Author">
|
|
1016
1017
|
<div class="nf-kind"></div>
|
|
1017
1018
|
<div class="nf-actions">
|
|
1018
|
-
<button class="nf-
|
|
1019
|
-
<button class="nf-audio nf-icon-btn" type="button" title="Record audio" aria-label="Record audio">${
|
|
1020
|
-
<button class="nf-video nf-icon-btn" type="button" title="Record video" aria-label="Record video">${
|
|
1019
|
+
<button class="nf-restore nf-icon-btn" type="button" title="Restore screenshot" aria-label="Restore screenshot" hidden>${$.resetCrop}</button>
|
|
1020
|
+
<button class="nf-audio nf-icon-btn" type="button" title="Record audio" aria-label="Record audio">${$.audio}</button>
|
|
1021
|
+
<button class="nf-video nf-icon-btn" type="button" title="Record video" aria-label="Record video">${$.video}</button>
|
|
1021
1022
|
<button class="nf-submit" type="button">Submit</button>
|
|
1022
1023
|
</div>
|
|
1023
|
-
<button class="nf-restore" type="button" hidden>Restore screenshot</button>
|
|
1024
1024
|
<div class="nf-status"></div>
|
|
1025
1025
|
</div>
|
|
1026
1026
|
<p class="nf-success-msg" hidden aria-live="polite">Submitted!</p>
|
|
@@ -1320,7 +1320,7 @@ async function sr() {
|
|
|
1320
1320
|
onStart() {
|
|
1321
1321
|
},
|
|
1322
1322
|
onStop(t) {
|
|
1323
|
-
|
|
1323
|
+
P = t, s.stop.hidden = !0, nt(), s.dialog.hidden = !1, G(), v(t ? "Video attached." : "Recording cancelled.");
|
|
1324
1324
|
},
|
|
1325
1325
|
onError(t) {
|
|
1326
1326
|
v(t.message);
|
|
@@ -1334,7 +1334,7 @@ async function sr() {
|
|
|
1334
1334
|
}
|
|
1335
1335
|
function G() {
|
|
1336
1336
|
if (s.shot = null, !S) {
|
|
1337
|
-
s.canvas.style.removeProperty("--nf-shot-aspect"), s.canvas.style.removeProperty("aspect-ratio"), s.canvas.innerHTML =
|
|
1337
|
+
s.canvas.style.removeProperty("--nf-shot-aspect"), s.canvas.style.removeProperty("aspect-ratio"), s.canvas.innerHTML = P ? `<video class="nf-recording-preview" controls src="${URL.createObjectURL(P)}"></video>` : "", xt();
|
|
1338
1338
|
return;
|
|
1339
1339
|
}
|
|
1340
1340
|
s.canvas.innerHTML = `<div class="nf-shot"><img alt="Screenshot" src="${S}" draggable="false"></div>`, s.shot = s.canvas.querySelector(".nf-shot");
|
|
@@ -1388,18 +1388,18 @@ function M() {
|
|
|
1388
1388
|
u.className = "nf-badge", u.textContent = String(i.number), l.appendChild(u);
|
|
1389
1389
|
}
|
|
1390
1390
|
s.shot.appendChild(l);
|
|
1391
|
-
}), s.canvas.querySelectorAll(":scope > .nf-recording-preview").forEach((i) => i.remove()),
|
|
1391
|
+
}), s.canvas.querySelectorAll(":scope > .nf-recording-preview").forEach((i) => i.remove()), P) {
|
|
1392
1392
|
const i = document.createElement("video");
|
|
1393
|
-
i.className = "nf-recording-preview", i.controls = !0, i.src = URL.createObjectURL(
|
|
1393
|
+
i.className = "nf-recording-preview", i.controls = !0, i.src = URL.createObjectURL(P), i.style.position = "absolute", i.style.right = "8px", i.style.bottom = "8px", i.style.width = "160px", s.canvas.appendChild(i);
|
|
1394
1394
|
}
|
|
1395
1395
|
xt();
|
|
1396
1396
|
}
|
|
1397
1397
|
function ur(t, e, n, r, o = At(400)) {
|
|
1398
|
-
const i = Y(), a = i.clientWidth, c = i.clientHeight, l = (e.x - n.x) / n.w * a, u = (e.y - n.y) / n.h * c, f = ((e.x2 ?? e.x + e.w) - n.x) / n.w * a, p = ((e.y2 ?? e.y) - n.y) / n.h * c, m = Math.max(18, o.arrowHead + o.stroke * 2), x = Math.min(l, f) - m, A = Math.min(u, p) - m,
|
|
1399
|
-
t.style.left = `${x}px`, t.style.top = `${A}px`, t.style.width = `${
|
|
1398
|
+
const i = Y(), a = i.clientWidth, c = i.clientHeight, l = (e.x - n.x) / n.w * a, u = (e.y - n.y) / n.h * c, f = ((e.x2 ?? e.x + e.w) - n.x) / n.w * a, p = ((e.y2 ?? e.y) - n.y) / n.h * c, m = Math.max(18, o.arrowHead + o.stroke * 2), x = Math.min(l, f) - m, A = Math.min(u, p) - m, k = Math.max(2, Math.abs(f - l)) + m * 2, q = Math.max(2, Math.abs(p - u)) + m * 2, j = l - x, N = u - A, ct = f - x, lt = p - A, T = ue(j, N, ct, lt, o), _ = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
1399
|
+
t.style.left = `${x}px`, t.style.top = `${A}px`, t.style.width = `${k}px`, t.style.height = `${q}px`, _.setAttribute("class", "nf-arrow-svg"), _.setAttribute("viewBox", `0 0 ${k} ${q}`), _.setAttribute("width", String(k)), _.setAttribute("height", String(q)), _.innerHTML = `
|
|
1400
1400
|
<line class="nf-arrow-hit" x1="${j}" y1="${N}" x2="${ct}" y2="${lt}" />
|
|
1401
|
-
<line class="nf-arrow-shaft" x1="${j}" y1="${N}" x2="${
|
|
1402
|
-
<polygon class="nf-arrow-head" points="${
|
|
1401
|
+
<line class="nf-arrow-shaft" x1="${j}" y1="${N}" x2="${T.shaftEnd.x}" y2="${T.shaftEnd.y}" />
|
|
1402
|
+
<polygon class="nf-arrow-head" points="${T.tipX},${T.tipY} ${T.left.x},${T.left.y} ${T.right.x},${T.right.y}" />
|
|
1403
1403
|
`, t.appendChild(_), r && (Et(t, "start", { left: j - 5, top: N - 5 }), Et(t, "end", { left: ct - 5, top: lt - 5 }));
|
|
1404
1404
|
}
|
|
1405
1405
|
function Et(t, e, n) {
|
|
@@ -1484,7 +1484,7 @@ function gr(t) {
|
|
|
1484
1484
|
return !e && h && s.dialog && !s.dialog.hidden && J(), Tt({ hideLauncher: !e });
|
|
1485
1485
|
}
|
|
1486
1486
|
async function Ce() {
|
|
1487
|
-
Rt(), Me(), X(), s.launcher.hidden = !0, y = le(), O = { w: 0, h: 0 },
|
|
1487
|
+
Rt(), Me(), X(), s.launcher.hidden = !0, y = le(), O = { w: 0, h: 0 }, P = null, L = null, b = null, w = null, U = at(d.kinds), $t(U), St(null), kt(!1), s.text.value = "", ve(), v("");
|
|
1488
1488
|
try {
|
|
1489
1489
|
S = await An(), K = S, s.stage.hidden = !1, s.restore.hidden = !0, v("");
|
|
1490
1490
|
} catch {
|
|
@@ -1530,7 +1530,7 @@ async function Ae() {
|
|
|
1530
1530
|
if (Rt(), ht)
|
|
1531
1531
|
return null;
|
|
1532
1532
|
const t = s.text.value.trim();
|
|
1533
|
-
if (!t && !S &&
|
|
1533
|
+
if (!t && !S && !P)
|
|
1534
1534
|
return v("Add a note, screenshot, or video first."), null;
|
|
1535
1535
|
if (!d.endpoint || !d.projectKey)
|
|
1536
1536
|
return v("Notefully is missing endpoint or projectKey."), null;
|
|
@@ -1559,7 +1559,7 @@ async function Ae() {
|
|
|
1559
1559
|
n.append("screenshotBaked", a, "screenshot.baked.png");
|
|
1560
1560
|
}
|
|
1561
1561
|
}
|
|
1562
|
-
|
|
1562
|
+
P && n.append("recording", P, "recording.webm");
|
|
1563
1563
|
const r = await fetch(`${d.endpoint}/v1/reports`, {
|
|
1564
1564
|
method: "POST",
|
|
1565
1565
|
headers: {
|