File size: 10,528 Bytes
2a071e1 6cf9641 2a071e1 db68987 2a071e1 3fae071 6cf9641 3fae071 2a071e1 3fae071 2a071e1 54ef709 277295b 54ef709 2a071e1 6cf9641 2a071e1 cc3c1a2 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 f5bd1fa 857d3e9 3fae071 2a071e1 f619a9b 3fae071 f619a9b 2a071e1 3fae071 2a071e1 3fae071 2a071e1 6cf9641 2a071e1 25f0a2d 3fae071 2a071e1 25f0a2d 3fae071 2a071e1 25f0a2d 3fae071 2a071e1 3fae071 2a071e1 25f0a2d 2a071e1 3fae071 2a071e1 25f0a2d 2a071e1 3fae071 2a071e1 25f0a2d 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 2a071e1 3fae071 6cf9641 2a071e1 6cf9641 2a071e1 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 | <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#312e81">
<meta name="description" content="Review suspicious Pakistani messages before you click, pay, or reply.">
<title>NoticeCheck</title>
<link rel="icon" href="/static/mark.svg" type="image/svg+xml">
<link rel="stylesheet" href="/static/styles.css">
<script>
// ZeroGPU auth handshake — required for PRO quota in HF iframe.
// Without this, gr.Server custom frontends are treated as unauthenticated.
const ZEROGPU_HEADERS_MSG = "supports-zerogpu-headers";
window.addEventListener("message", (event) => {
if (event.data === ZEROGPU_HEADERS_MSG) {
window.supports_zerogpu_headers = true;
}
});
const hostname = window.location.hostname;
if (hostname.endsWith(".hf.space") || hostname.includes(".dev.")) {
const origin = hostname.includes(".dev.")
? `https://moon-${hostname.split(".")[1]}.dev.spaces.huggingface.tech`
: "https://huggingface.co";
window.parent.postMessage(ZEROGPU_HEADERS_MSG, origin);
}
</script>
<script src="/static/app.js" defer></script>
</head>
<body>
<header class="topbar">
<div class="topbar-left">
<a class="brand" href="/" aria-label="NoticeCheck home">
<span class="brand-mark"><img src="/static/mark.svg" alt=""></span>
<span class="brand-name">NoticeCheck</span>
</a>
</div>
<div class="status-row">
<span id="modelStatus" class="status-badge"><span class="status-dot"></span><span class="status-text" data-i18n="statusChecking">Checking model</span></span>
</div>
</header>
<main>
<section class="hero">
<div>
<p class="eyebrow" data-i18n="heroEyebrow">Pause. Inspect. Decide.</p>
<h1><span data-i18n="heroTitle">Look twice before you</span> <span data-i18n="heroSafe">trust it.</span></h1>
<p class="hero-text" data-i18n="heroText">NoticeCheck reviews suspicious messages and screenshots for pressure tactics, unsafe requests, and scam warning signs.</p>
</div>
<div class="hero-art">
<img src="/static/hero.png" alt="NoticeCheck preview" class="hero-image">
</div>
</section>
<section class="workspace" aria-labelledby="checkerTitle">
<div class="section-heading">
<div>
<p class="eyebrow" data-i18n="checkerEyebrow">Message review</p>
<h2 id="checkerTitle" data-i18n="checkerTitle">What did you receive?</h2>
</div>
<p data-i18n="modelDescription">MiniCPM5-1B reviews messages; Nemotron OCR v2 reads screenshots.</p>
</div>
<form id="noticeForm">
<div class="input-grid">
<div class="field-card upload-card">
<div class="field-label"><span>1</span><span class="field-label-text" data-i18n="uploadLabel">Upload a screenshot</span></div>
<label id="dropZone" class="drop-zone" for="imageInput">
<input id="imageInput" type="file" accept="image/png,image/jpeg,image/webp">
<span class="upload-icon" aria-hidden="true">↑</span>
<strong data-i18n="dropImage">Drop an image here</strong>
<small data-i18n="browseImage">or tap to browse PNG, JPG, or WebP</small>
<img id="imagePreview" alt="Selected notice preview" data-i18n-alt="previewAlt">
<button id="removeImage" class="text-button" type="button" data-i18n="removeImage">Remove image</button>
</label>
<div id="uploadHint" class="mode-hint"><span class="hint-icon">↑</span><span data-i18n="imageMode">Screenshot mode active — text input is locked</span></div>
</div>
<div class="field-card">
<label class="field-label" for="noticeText"><span>2</span><span class="field-label-text" data-i18n="pasteLabel">Or paste the message</span></label>
<textarea id="noticeText" dir="auto" maxlength="12000" placeholder="Paste the SMS, email, bill text, or notice here..." data-i18n-placeholder="textPlaceholder"></textarea>
<div class="field-meta"><span data-i18n="languageSupport">English interface</span><span id="charCount">0 / 12,000</span></div>
<div id="textHint" class="mode-hint"><span class="hint-icon">✎</span><span data-i18n="textMode">Text mode active — image upload is locked</span></div>
</div>
</div>
<div id="formError" class="form-error" role="alert"></div>
<label class="trace-consent" for="saveTrace">
<input id="saveTrace" type="checkbox" checked>
<span>
<strong data-i18n="traceTitle">Publish privacy-safe trace</strong>
<small data-i18n="traceText">Stores automated redacted text or an image description. Raw text, screenshots, links, identifiers, and model text are not stored.</small>
</span>
</label>
<div class="form-actions">
<button id="analyzeButton" class="primary-button" type="submit">
<span class="button-label" data-i18n="checkButton">Check this notice</span>
<span class="spinner" aria-hidden="true"></span>
</button>
<button id="resetButton" class="reset-button" type="button">
<span data-i18n="startOver">Start over</span>
</button>
</div>
</form>
</section>
<section class="examples" aria-labelledby="examplesTitle">
<div class="section-heading compact">
<div><p class="eyebrow" data-i18n="examplesEyebrow">Practice cases</p><h2 id="examplesTitle" data-i18n="examplesTitle">Recognize the pressure pattern</h2></div>
</div>
<div class="example-grid">
<button class="example-card" data-example-id="text-courier" data-example="PAKISTAN POST: Your parcel address is incomplete. Pay Rs. 85 today at http://pakpost-delivery.xyz or the parcel will be destroyed.">
<span class="example-icon">PK</span><span><strong data-i18n="courierFee">Courier fee</strong><small data-i18n="courierFeeText">Urgent parcel payment link</small></span>
</button>
<button class="example-card" data-example-id="text-fbr" data-example="FBR REFUND: You are eligible for Rs 42,500. Submit your CNIC and bank card details at the link today to receive payment.">
<span class="example-icon">FBR</span><span><strong data-i18n="taxRefund">Tax refund</strong><small data-i18n="taxRefundText">Unexpected refund request</small></span>
</button>
<button class="example-card" data-example-id="text-bank" data-example="HBL Security: Your account will be suspended. Share the OTP sent to your phone with our support team immediately.">
<span class="example-icon">OTP</span><span><strong data-i18n="bankAlert">Bank alert</strong><small data-i18n="bankAlertText">Security code request</small></span>
</button>
</div>
<p class="eyebrow" style="margin:28px 0 14px" data-i18n="screenshotsTitle">Real scam screenshots</p>
<div class="example-grid example-grid-images">
<button class="example-card example-image-card" data-example-id="image-courier" data-image="/static/example-courier.jpeg">
<img src="/static/example-courier.jpeg" alt="Courier scam screenshot" class="example-thumb">
<span><strong data-i18n="courierScam">Courier scam</strong><small data-i18n="courierScamText">Fake delivery fee message</small></span>
</button>
<button class="example-card example-image-card" data-example-id="image-mobile" data-image="/static/example-mobile.png">
<img src="/static/example-mobile.png" alt="Mobile scam screenshot" class="example-thumb">
<span><strong data-i18n="mobileScam">Mobile scam</strong><small data-i18n="mobileScamText">Fake mobile operator message</small></span>
</button>
<button class="example-card example-image-card" data-example-id="image-traffic" data-image="/static/example-trafic.png">
<img src="/static/example-trafic.png" alt="Traffic challan scam screenshot" class="example-thumb">
<span><strong data-i18n="trafficScam">Traffic challan</strong><small data-i18n="trafficScamText">Fake e-challan fine message</small></span>
</button>
</div>
</section>
<section id="results" class="results" aria-live="polite" hidden>
<div class="result-header">
<div><p class="eyebrow" data-i18n="resultsEyebrow">Safety assessment</p><h2 data-i18n="resultsTitle">What we found</h2></div>
<div id="riskBadge" class="risk-badge"></div>
</div>
<p id="resultSource" class="result-source"></p>
<div class="result-grid">
<article class="result-card explanation-card">
<div class="card-title"><span>i</span><h3 data-i18n="explanationTitle">Simple explanation</h3><button class="copy-button" data-copy="explanationText" data-i18n="copy">Copy</button></div>
<p id="explanationText"></p>
</article>
<article class="result-card">
<div class="card-title"><span>!</span><h3 data-i18n="redFlagsTitle">Red flags found</h3><button class="copy-button" data-copy="redFlagsList" data-i18n="copy">Copy</button></div>
<ul id="redFlagsList"></ul>
</article>
<article class="result-card">
<div class="card-title"><span>✓</span><h3 data-i18n="nextStepsTitle">Safe next steps</h3><button class="copy-button" data-copy="nextStepsList" data-i18n="copy">Copy</button></div>
<ol id="nextStepsList"></ol>
</article>
<article id="replyCard" class="result-card reply-card">
<div class="card-title"><span>↗</span><h3 data-i18n="replyTitle">Polite reply draft</h3><button class="copy-button" data-copy="replyText" data-i18n="copy">Copy</button></div>
<p id="replyText"></p>
</article>
</div>
</section>
<section class="disclaimer">
<strong data-i18n="disclaimerTitle">Important safety note</strong>
<p data-i18n="disclaimerText">NoticeCheck does not verify senders or provide legal or financial advice. Confirm through contact details you find independently before paying, clicking, replying, or sharing information.</p>
</section>
</main>
<footer><span data-i18n="footerOne">NoticeCheck · A local-first message review tool</span><span data-i18n="footerTwo">Never share OTPs, PINs, passwords, or CVVs.</span></footer>
</body>
</html>
|