LeakIX - Host virtual-mirror.pages.dev

Open service 2606:4700:310c::ac42:2f7a:443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=cWAEFz0wfGNLoEynis2i1oznfxjsW0KolP3guV3BC2qkwQN3wRwi1SVanSn%2BbOH9CZo%2FVQO4szlqgRcSKjTdGuBlp29PKrMnUNKVIujFn9WP5QLOOTezTG0hjK8%2FfjAFfNC2Lg%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef43ebd440b-EWR
alt-svc: h3=":443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.47.122:80 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 301 Moved Permanently
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Length: 0
Connection: close
Location: https://virtual-mirror.pages.dev/
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=DjKXccT89Sfv81MuxhH1RlZbWlY3mZmKxnhISUuaTInsbwCX2sfPFy%2FRIsULpw80GXNK40KCfU9b4dVlHvu6j1wZYRkd74s1ZmiTn08E0hJgM3gjBlhTSA%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3ac0b8cb7-EWR
alt-svc: h3=":443"; ma=86400

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.44.134:8443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=GY1%2Bnp0%2FdLbvBvu3ZZMfCmqkfHYryy6RDIVxbCYsjlX2kCLK2TbLWkToXTEmlbUAGD4L4Cd1gsLLPBHL5X43bM9z2V9ZSV136u0vhDbYw1W5pKG1P3w%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3cf755437-YYZ
alt-svc: h3=":8443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.47.122:443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=2%2BGCOKrczkOpFQeKP%2BEx5DfNyKk1tIvpdc8B21vGgcS4c1y1G08IOgbW8uCUcHZkiH4%2BnMZVWbUUudD5qVfpNMnwy3Anev0ka%2Fcqgw1lYr2iGiw5Dck80Q%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3ffdcc85f-YYZ
alt-svc: h3=":443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 2606:4700:310c::ac42:2c86:443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=hgmIW%2Bs7yU30RAUBDL4TPXFJRGbp7TbYtcTEn%2BjFTcIAUCP6pyAU%2FYgvyoEuWBx0NSyPNG1Ea3tH5aHJnhHUBidPugvHNaenXsKrZKm%2BH4a9oLMeT0QRvwTKBKRp%2BPYUefmqLw%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3da86cef2-EWR
alt-svc: h3=":443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.44.134:80 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 301 Moved Permanently
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Length: 0
Connection: close
Location: https://virtual-mirror.pages.dev/
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=hApBQxItwkOelXOvKunCs31Y9202fxpuYPj4SsvEZ2yDe8lYaVILT9EK037sLXkRn2Cy6MUZ%2F4PvhhJlTkYKxqsHJUhIRKptZqZ4TdXssxuYr5%2FCqN1vsA%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef37d5f0702-YYZ
alt-svc: h3=":443"; ma=86400

Found 2 days ago by HttpPlugin

Create report

Open service 2606:4700:310c::ac42:2f7a:80 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 301 Moved Permanently
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Length: 0
Connection: close
Location: https://virtual-mirror.pages.dev/
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=o%2F42jmbldcGELhxLaLK%2F1pXNxgiJZQMRLHPSIoHiXYIaUq4BkY%2BXSAc0oumwp3xjqfkPmTDPvDNj2I1fv7V4Zyn%2Fil4zpbIGoODDpmUiaQoOXUAU7qwFVIQjaGYNiVWpTIT9qw%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef349837b82-SJC
alt-svc: h3=":443"; ma=86400

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.47.122:8443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=Lu06B4LZ1yRnRSYI0fOe9ngylp%2FiL5Mc7AKz0F0DCRYzq1C0ZTY7AyF%2Bp6vptupzhkTDU7hxtRhqNhHJx6QakawoUfRnvEZg%2FJJdWmSAPcTRlpDj4FXyJw%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3aec73448-EWR
alt-svc: h3=":8443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 2606:4700:310c::ac42:2c86:80 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 301 Moved Permanently
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Length: 0
Connection: close
Location: https://virtual-mirror.pages.dev/
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=6ClyuTq6ytPdJ%2BfBoGDQWM%2BeVGRei%2B03j9v%2Bjv4hv8P55iGbJB7iS%2BQdikK4wCneXbqgKY83vma58ip9%2Bebo5ef2qzTPw4DldEXmGe%2FjdFzsvmv%2FS6YrTuFjiC0xreKac%2BA%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef33c2fa220-YYZ
alt-svc: h3=":443"; ma=86400

Found 2 days ago by HttpPlugin

Create report

Open service 2606:4700:310c::ac42:2f7a:8443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=uwmadP6gH6lmo%2FQtviXQEmcpSbDqDchGf8aL3Gdj%2BlOsWKXz8oW4TxSR2gOnoJiSaU0zM%2BYFfb%2FjvVUjvrq%2FSDk1z853BYm0aiDiwLX9Ytg%2BS1Mblq5pZoFG2WnyGoJYctCAow%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef36c191185-YYZ
alt-svc: h3=":8443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 2606:4700:310c::ac42:2c86:8443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=n6Cx3Nhed42J8YL72evwpiSK5WWo7%2BEox%2FXpl9DBaR%2B%2FPNAgPDty%2B4lIoRndB46pjIz6V2Ru3wQCWRBGsop%2BbbkTkEF8onZvAlJTXsHYARPar9Q1sLhFBrdhW0A6VjwlDXP0CA%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef3abe024ee-YYZ
alt-svc: h3=":8443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin

Create report

Open service 172.66.44.134:443 · virtual-mirror.pages.dev

2026-01-12 16:01

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2026 16:01:09 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 38389
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: public, max-age=0, must-revalidate
ETag: "4849fbbd21fe139a0ed2442071c066d5"
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=ume78L%2B0o8M0FDwhG2ErfZ7Zm4ZyBStE%2Ffgk8U2pHCgBsFPTKgSv9eMbd0G5xOxIvJL4Jh6nDibETFRCl8U5kZ0qCogLdhoBMjbAPp7eTdYC%2FNxZ3rDFYQ%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
CF-RAY: 9bcddef38e8718b7-FRA
alt-svc: h3=":443"; ma=86400

Page title: AR Makeup App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>AR Makeup App</title>
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div id="error">Camera access denied. Please allow camera permissions.</div>
  <div class="mirror-container">
    <video id="video" autoplay muted playsinline></video>
    <canvas id="overlay"></canvas>
  </div>
  <div id="controls">
    <select id="typeSelect">
      <option value="lipstickSelect">Lipstick</option>
      <option value="liplinerSelect">Lipliner</option>
      <option value="blushSelect">Blush</option>
      <option value="eyeshadowSelect">Eyeshadow</option>
    </select>
    <button id="drawBtn">Draw</button>
  </div>
  <div id="swatchThumbnails"></div>
  <div id="productCarousel" style="display:flex;"></div>
  <div id="selectedProductTile">
    <div class="tile-info">
      <div class="name" id="tileName"></div>
      <div class="price" id="tilePrice"></div>
      <div class="rating" id="tileRating"></div>
      <a class="buy-btn" id="tileBuy" href="#" target="_blank">Buy</a>
    </div>
    <!-- The large thumbnail will be injected here by JS -->
  </div>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/face_mesh.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js"></script>
  <script>
    // This code is part of a web application that uses the MediaPipe Face Mesh library to apply virtual makeup effects in real-time using a webcam.
const video = document.getElementById('video'),
      canvas = document.getElementById('overlay'),
      ctx = canvas.getContext('2d');
const errorDiv = document.getElementById('error'),
      carousel = document.getElementById('productCarousel');
const typeSelect = document.getElementById('typeSelect');
const drawBtn = document.getElementById('drawBtn');
let hairColor = '#b57f4f';

const products = {}, colors = {};
let selectedType = typeSelect.value;
let selectedProducts = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
let selectedColors = {
  lipstickSelect: null,
  liplinerSelect: null,
  blushSelect: null,
  eyeshadowSelect: null
};
const cropRegs = {
  lipstickSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  liplinerSelect: { x: 0.15, y: 0, w: 0.7, h: 0.3 },
  blushSelect: { x: 0.1, y: 0.15, w: 0.8, h: 0.6 },
  eyeshadowSelect: { x: 0.05, y: 0.2, w: 0.9, h: 0.6 }
};

let isDrawing = false;
let drawStrokes = [];
let drawMode = false;
let currentStroke = null;

drawBtn.addEventListener('click', () => {
  drawMode = !drawMode;
  drawBtn.textContent = drawMode ? "Stop Drawing" : "Draw";
  if (!drawMode) {
    isDrawing = false;
    drawStrokes = [];
    currentStroke = null;
  }
});

canvas.addEventListener('pointerdown', e => {
  if (!drawMode) return;
  isDrawing = true;
  currentStroke = [];
  drawStrokes.push(currentStroke);
});

canvas.addEventListener('pointermove', e => {
  if (!drawMode || !isDrawing || !window.lastLandmarks) return;
  const rect = canvas.getBoundingClientRect();
  const x = canvas.width - (e.clientX - rect.left) * (canvas.width / rect.width);
  const y = (e.clientY - rect.top) * (canvas.height / rect.height);

  let minDist = Infinity, minIdx = -1;
  window.lastLandmarks.forEach((p, idx) => {
    const px = p.x * canvas.width, py = p.y * canvas.height;
    const d = (px - x) ** 2 + (py - y) ** 2;
    if (d < minDist) { minDist = d; minIdx = idx; }
  });
  if (minIdx !== -1) {
    const p = window.lastLandmarks[minIdx];
    const dx = (x / canvas.width) - p.x;
    const dy = (y / canvas.height) - p.y;
    currentStroke.push({ landmarkIdx: minIdx, dx, dy });
  }
});

canvas.addEventListener('pointerup', e => {
  if (!drawMode) return;
  isDrawing = false;
  currentStroke = null;
});

function drawUserStrokes(lm) {
  if (!drawStrokes.length) return;
  ctx.save();
  ctx.globalCompositeOperation = 'multiply';
  ctx.filter = 'blur(8px)';
  ctx.strokeSt

Found 2 days ago by HttpPlugin