feat(new-tool): Add Dead Pixel detection tool

components.d.ts

@@ -24,6 +24,7 @@ declare module '@vue/runtime-core' {
     AppColorPicker: typeof import('./src/tools/pomodoro-timer/app/components/AppColorPicker.vue')['default']
     AreaConverter: typeof import('./src/tools/area-converter/area-converter.vue')['default']
     Argon2Hash: typeof import('./src/tools/argon2-hash/argon2-hash.vue')['default']
+    ArpaDecoder: typeof import('./src/tools/arpa-decoder/arpa-decoder.vue')['default']
     AsciiTextDrawer: typeof import('./src/tools/ascii-text-drawer/ascii-text-drawer.vue')['default']
     AspectRatioCalculator: typeof import('./src/tools/aspect-ratio-calculator/aspect-ratio-calculator.vue')['default']
     BarcodeGenerator: typeof import('./src/tools/barcode-generator/barcode-generator.vue')['default']
@@ -127,6 +128,7 @@ declare module '@vue/runtime-core' {
     DateTimeConverter: typeof import('./src/tools/date-time-converter/date-time-converter.vue')['default']
     DaysCalculator: typeof import('./src/tools/days-calculator/days-calculator.vue')['default']
     DbmMwConverter: typeof import('./src/tools/dbm-mw-converter/dbm-mw-converter.vue')['default']
+    DeadPixel: typeof import('./src/tools/dead-pixel/dead-pixel.vue')['default']
     'DemoHome.page': typeof import('./src/ui/demo/demo-home.page.vue')['default']
     DemoWrapper: typeof import('./src/ui/demo/demo-wrapper.vue')['default']
     DeviceInformation: typeof import('./src/tools/device-information/device-information.vue')['default']
@@ -195,6 +197,7 @@ declare module '@vue/runtime-core' {
     FortuneWheel: typeof import('./src/tools/fortune-wheel/fortune-wheel.vue')['default']
     FstabGenerator: typeof import('./src/tools/fstab-generator/fstab-generator.vue')['default']
     GeoDistanceCalculator: typeof import('./src/tools/geo-distance-calculator/geo-distance-calculator.vue')['default']
+    GitattributesGenerator: typeof import('./src/tools/gitattributes-generator/gitattributes-generator.vue')['default']
     GitignoreGenerator: typeof import('./src/tools/gitignore-generator/gitignore-generator.vue')['default']
     GitMemo: typeof import('./src/tools/git-memo/git-memo.vue')['default']
     'GitMemo.content': typeof import('./src/tools/git-memo/git-memo.content.md')['default']
@@ -231,7 +234,6 @@ declare module '@vue/runtime-core' {
     IcalParser: typeof import('./src/tools/ical-parser/ical-parser.vue')['default']
     IcoConverter: typeof import('./src/tools/ico-converter/ico-converter.vue')['default']
     'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default']
-    'IconMdi:contentCopy': typeof import('~icons/mdi/content-copy')['default']
     'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default']
     IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
     IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default']
@@ -240,14 +242,9 @@ declare module '@vue/runtime-core' {
     IconMdiEye: typeof import('~icons/mdi/eye')['default']
     IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default']
     IconMdiHeart: typeof import('~icons/mdi/heart')['default']
-    IconMdiPause: typeof import('~icons/mdi/pause')['default']
-    IconMdiPlay: typeof import('~icons/mdi/play')['default']
-    IconMdiRecord: typeof import('~icons/mdi/record')['default']
-    IconMdiRefresh: typeof import('~icons/mdi/refresh')['default']
     IconMdiSearch: typeof import('~icons/mdi/search')['default']
     IconMdiTranslate: typeof import('~icons/mdi/translate')['default']
     IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default']
-    IconMdiVideo: typeof import('~icons/mdi/video')['default']
     IesLightingGuidelines: typeof import('./src/tools/ies-lighting-guidelines/ies-lighting-guidelines.vue')['default']
     IlluminanceConverter: typeof import('./src/tools/illuminance-converter/illuminance-converter.vue')['default']
     ImageColorInverter: typeof import('./src/tools/image-color-inverter/image-color-inverter.vue')['default']
@@ -364,45 +361,27 @@ declare module '@vue/runtime-core' {
     MttdlCalculator: typeof import('./src/tools/mttdl-calculator/mttdl-calculator.vue')['default']
     MultiLinkDownloader: typeof import('./src/tools/multi-link-downloader/multi-link-downloader.vue')['default']
     MyIp: typeof import('./src/tools/my-ip/my-ip.vue')['default']
-    NA: typeof import('naive-ui')['NA']
-    NAlert: typeof import('naive-ui')['NAlert']
     NanoidGenerator: typeof import('./src/tools/nanoid-generator/nanoid-generator.vue')['default']
     NanoMemo: typeof import('./src/tools/nano-memo/nano-memo.vue')['default']
     'NanoMemo.content': typeof import('./src/tools/nano-memo/nano-memo.content.md')['default']
-    NAutoComplete: typeof import('naive-ui')['NAutoComplete']
     NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
-    NCode: typeof import('naive-ui')['NCode']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
     NEllipsis: typeof import('naive-ui')['NEllipsis']
-    NFormItem: typeof import('naive-ui')['NFormItem']
     NginxFormatter: typeof import('./src/tools/nginx-formatter/nginx-formatter.vue')['default']
     NginxMemo: typeof import('./src/tools/nginx-memo/nginx-memo.vue')['default']
     'NginxMemo.content': typeof import('./src/tools/nginx-memo/nginx-memo.content.md')['default']
     NH1: typeof import('naive-ui')['NH1']
-    NH2: typeof import('naive-ui')['NH2']
     NH3: typeof import('naive-ui')['NH3']
     NicewareBytesToPassphrase: typeof import('./src/tools/niceware-bytes-to-passphrase/niceware-bytes-to-passphrase.vue')['default']
     NIcon: typeof import('naive-ui')['NIcon']
-    NInput: typeof import('naive-ui')['NInput']
     NInputNumberI18n: typeof import('./src/ui/n-input-number-i18n/n-input-number-i18n.vue')['default']
     'NInputNumberI18n.demo': typeof import('./src/ui/n-input-number-i18n/n-input-number-i18n.demo.vue')['default']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
-    NLi: typeof import('naive-ui')['NLi']
     NMenu: typeof import('naive-ui')['NMenu']
-    NScrollbar: typeof import('naive-ui')['NScrollbar']
-    NSpace: typeof import('naive-ui')['NSpace']
-    NSpin: typeof import('naive-ui')['NSpin']
-    NStatistic: typeof import('naive-ui')['NStatistic']
-    NSwitch: typeof import('naive-ui')['NSwitch']
-    NTable: typeof import('naive-ui')['NTable']
     NTooltip: typeof import('naive-ui')['NTooltip']
-    NTree: typeof import('naive-ui')['NTree']
-    NUl: typeof import('naive-ui')['NUl']
     NumberInput: typeof import('./src/tools/pomodoro-timer/app/components/NumberInput.vue')['default']
     NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
-    NUpload: typeof import('naive-ui')['NUpload']
-    NUploadDragger: typeof import('naive-ui')['NUploadDragger']
     OcrImage: typeof import('./src/tools/ocr-image/ocr-image.vue')['default']
     Option43Generator: typeof import('./src/tools/option43-generator/option43-generator.vue')['default']
     OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
@@ -439,6 +418,7 @@ declare module '@vue/runtime-core' {
     PressureConverter: typeof import('./src/tools/pressure-converter/pressure-converter.vue')['default']
     ProgressBar: typeof import('./src/tools/pomodoro-timer/app/components/ProgressBar.vue')['default']
     PropertiesConverter: typeof import('./src/tools/properties-converter/properties-converter.vue')['default']
+    PtrDnsGenerator: typeof import('./src/tools/ptr-dns-generator/ptr-dns-generator.vue')['default']
     PunycodeConverter: typeof import('./src/tools/punycode-converter/punycode-converter.vue')['default']
     QrCodeDecoder: typeof import('./src/tools/qr-code-decoder/qr-code-decoder.vue')['default']
     QrCodeGenerator: typeof import('./src/tools/qr-code-generator/qr-code-generator.vue')['default']
@@ -565,6 +545,8 @@ declare module '@vue/runtime-core' {
     YamlToJson: typeof import('./src/tools/yaml-to-json-converter/yaml-to-json.vue')['default']
     YamlToToml: typeof import('./src/tools/yaml-to-toml/yaml-to-toml.vue')['default']
     YamlViewer: typeof import('./src/tools/yaml-viewer/yaml-viewer.vue')['default']
+    ZellijMemo: typeof import('./src/tools/zellij-memo/zellij-memo.vue')['default']
+    'ZellijMemo.content': typeof import('./src/tools/zellij-memo/zellij-memo.content.md')['default']
     'Zpool.content': typeof import('./src/tools/zpool-memo/zpool.content.md')['default']
     ZpoolCalculator: typeof import('./src/tools/zpool-calculator/zpool-calculator.vue')['default']
     ZpoolMemo: typeof import('./src/tools/zpool-memo/zpool-memo.vue')['default']

src/tools/dead-pixel/dead-pixel.vue

@@ -0,0 +1,131 @@
+<script setup lang="ts">
+import { nextTick, onMounted, onUnmounted, ref } from 'vue';
+
+const showIframe = ref(false);
+const iframeRef = ref<HTMLIFrameElement | null>(null);
+
+async function startDeadPixel() {
+  showIframe.value = true;
+  await nextTick();
+  const iframe = iframeRef.value;
+  if (!iframe) {
+    return;
+  }
+  iframe.onload = async () => {
+    try {
+      await iframe.requestFullscreen();
+    }
+    catch (e) {
+      console.warn('Fullscreen failed', e);
+    }
+  };
+}
+
+function handleFullscreenChange() {
+  if (!document.fullscreenElement && showIframe.value) {
+    showIframe.value = false;
+  }
+}
+
+onMounted(() => {
+  document.addEventListener('fullscreenchange', handleFullscreenChange);
+});
+
+onUnmounted(() => {
+  document.removeEventListener('fullscreenchange', handleFullscreenChange);
+});
+
+const iframeHTML = `
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    html, body {
+      margin: 0;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      outline: none;
+    }
+  </style>
+</head>
+<body tabindex="0">
+<script>
+(function () {
+  const colors = ["#ffffff", "#000000", "#ff0000", "#00ff00", "#0000ff"];
+  let i = 0;
+  function setColor() {
+    document.body.style.background = colors[i];
+  }
+  function next() {
+    i = (i + 1) % colors.length;
+    setColor();
+  }
+  function prev() {
+    i = (i - 1 + colors.length) % colors.length;
+    setColor();
+  }
+  function focusBody() {
+    document.body.focus();
+  }
+  setColor();
+  focusBody();
+  document.body.addEventListener("click", () => {
+    focusBody();
+    next();
+  });
+  document.addEventListener("fullscreenchange", focusBody);
+  document.addEventListener("keydown", (e) => {
+    switch (e.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+      case " ":
+        e.preventDefault();
+        next();
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        e.preventDefault();
+        prev();
+        break;
+    }
+  });
+})();
+<\/script>
+</body>
+</html>
+`;
+</script>
+
+<template>
+  <div class="flex flex-col">
+    <p>
+      Keyboard shortcuts:
+      <ul>
+        <li><strong>Arrow Right, Arrow Down, Space</strong>: Next color</li>
+        <li><strong>Arrow Left, Arrow Up</strong>: Previous color</li>
+        <li><strong>ESC</strong>: Exit Dead Pixel Mode</li>
+      </ul>
+    </p>
+    <c-button v-if="!showIframe" class="mx-auto" @click="startDeadPixel">
+      Start Dead Pixel
+    </c-button>
+  </div>
+
+  <iframe
+    v-if="showIframe" ref="iframeRef" title="dead-pixel-iframe" class="dead-pixel-iframe" :srcdoc="iframeHTML"
+    allow="fullscreen"
+  />
+</template>
+
+<style scoped>
+.dead-pixel-iframe {
+  position: fixed;
+  inset: 0;
+  width: 100vw;
+  height: 100vh;
+  border: none;
+  z-index: 9999;
+}
+</style>

src/tools/dead-pixel/index.ts

@@ -0,0 +1,14 @@
+import { DeviceDesktop } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Dead pixel',
+  path: '/dead-pixel',
+  description:
+    'Tool to check if a pixel on your screen is dead or not.',
+  keywords: ['dead', 'pixel'],
+  component: () => import('./dead-pixel.vue'),
+  icon: DeviceDesktop,
+  createdAt: new Date('2026-01-02'),
+  category: 'Forensic',
+});