Update index.html

index.html

@@ -50,6 +50,8 @@
   .hint{color:var(--sub);font-weight:600}.hint small{display:block;color:var(--mut);font-weight:400;font-size:12px;margin-top:3px}
   .cta{width:100%;height:52px;margin-top:14px;border:none;border-radius:13px;background:var(--green);color:#04130d;font-weight:800;font-size:16px;cursor:pointer;transition:.15s}
   .cta:hover{background:var(--green2)}
+a.cta{display:flex;align-items:center;justify-content:center;text-decoration:none}
+.cta.busy{opacity:.6;pointer-events:none}
   .trust{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:14px;color:var(--mut);font-size:12.5px}
   .open{display:inline-block;margin-top:16px;padding:10px 18px;border:1px solid var(--line);border-radius:11px;color:var(--ink);font-weight:600}
   .open:hover{border-color:rgba(18,185,129,.5)}
@@ -89,7 +91,6 @@
   <p class="lead">Upload a profile picture and see who's really behind it across public social media and the web — spot a catfish, verify a match, or find out who you're really talking to.</p>
 
   <div class="card">
-    <form id="searchForm" action="https://unfake.pro" method="GET" target="_blank">
       <img id="preview" alt="Selected photo preview" />
       <label class="drop" id="drop">
         <span class="ic" aria-hidden="true">
@@ -98,8 +99,7 @@
         <span class="hint" id="hint">Click, drag, or paste a photo<small>JPG, PNG or WEBP</small></span>
         <input id="file" type="file" name="image" accept="image/*" hidden />
       </label>
-      <button type="submit" class="cta">Search this face →</button>
-    </form>
+      <a id="searchBtn" class="cta" href="https://unfake.pro" target="_blank" rel="noopener">Search this face →</a>
     <div class="trust"><span>🔒 Photo deleted within 24h</span><span>⚡ Results in ~45 seconds</span><span>🕶️ 100% anonymous</span></div>
     <a class="open" href="https://unfake.pro" target="_blank" rel="noopener">Or open the full search on UnFake →</a>
   </div>
@@ -156,49 +156,43 @@
 </footer>
 
 <script>
-  var file=document.getElementById("file"),drop=document.getElementById("drop"),img=document.getElementById("preview"),hint=document.getElementById("hint");
-  function show(f){if(!f)return;img.src=URL.createObjectURL(f);img.style.display="block";hint.innerHTML=(f.name||"photo").slice(0,28)+" — ready<small>Tap search to crop &amp; scan it on UnFake</small>";}
-  file.addEventListener("change",function(){show(file.files&&file.files[0]);});
-  ["dragenter","dragover"].forEach(function(e){drop.addEventListener(e,function(v){v.preventDefault();drop.classList.add("drag");});});
-  ["dragleave","drop"].forEach(function(e){drop.addEventListener(e,function(v){v.preventDefault();drop.classList.remove("drag");});});
-  drop.addEventListener("drop",function(v){var f=v.dataTransfer.files&&v.dataTransfer.files[0];if(f){file.files=v.dataTransfer.files;show(f);}});
-  window.addEventListener("paste",function(e){var it=(e.clipboardData||{}).items||[];for(var i=0;i<it.length;i++){if(it[i].type.indexOf("image")===0){var f=it[i].getAsFile();file.files=null;show(f);var dt=new DataTransfer();dt.items.add(f);file.files=dt.files;}}});
+  var file=document.getElementById("file"),drop=document.getElementById("drop"),img=document.getElementById("preview"),hint=document.getElementById("hint"),btn=document.getElementById("searchBtn");
   // Are we embedded in Hugging Face's sandboxed iframe? (it blocks same-tab nav)
-  var inFrame = (function(){ try { return window.top !== window.self; } catch(e){ return true; } })();
-  // Hand off the uploaded photo to UnFake's crop step via URL fragment
-  var form=document.getElementById("searchForm");
+  var inFrame=(function(){ try { return window.top!==window.self; } catch(e){ return true; } })();
+  function show(f){if(!f)return;img.src=URL.createObjectURL(f);img.style.display="block";hint.innerHTML=(f.name||"photo").slice(0,28)+" — ready<small>Tap search to crop &amp; scan it on UnFake</small>";}
   function compress(file, cb){
     var im=new Image();
     im.onload=function(){
-      var max=1600, s=Math.min(1, max/Math.max(im.width,im.height));
+      var max=1280, s=Math.min(1, max/Math.max(im.width,im.height));
       var w=Math.round(im.width*s), h=Math.round(im.height*s);
       var c=document.createElement("canvas"); c.width=w; c.height=h;
       c.getContext("2d").drawImage(im,0,0,w,h);
-      cb(c.toDataURL("image/jpeg",0.85));
+      cb(c.toDataURL("image/jpeg",0.82));
     };
     im.onerror=function(){ cb(null); };
     im.src=URL.createObjectURL(file);
   }
-  function openUnfake(url){
-    if (inFrame) { window.open(url, "_blank"); }   // HF iframe: only new tab works
-    else { window.location.href = url; }           // direct subdomain: same tab
-  }
-  form.addEventListener("submit",function(e){
-    e.preventDefault();
-    var f=file.files&&file.files[0];
-    if(!f){ openUnfake("https://unfake.pro"); return; }
-    // Open a blank tab NOW, inside the tap gesture, so mobile pop-up blockers
-    // allow it; navigate it to UnFake once compression finishes.
-    var tab = inFrame ? window.open("about:blank", "_blank") : null;
+  // Compress as soon as a photo is picked and preset the button href, so the
+  // tap is a plain native link (no window.open -> no mobile pop-up blocker).
+  function handleFile(f){
+    if(!f) return;
+    show(f);
+    btn.classList.add("busy");
+    btn.textContent="Preparing photo…";
     compress(f,function(d){
-      var url = d ? "https://unfake.pro/#photo="+encodeURIComponent(d) : "https://unfake.pro";
-      if (inFrame) {
-        if (tab && !tab.closed) { try { tab.location.href = url; return; } catch(err){} }
-        window.open(url, "_blank");
-      } else {
-        window.location.href = url;
-      }
+      btn.href = d ? "https://unfake.pro/#photo="+encodeURIComponent(d) : "https://unfake.pro";
+      btn.classList.remove("busy");
+      btn.textContent="Search this face →";
     });
+  }
+  file.addEventListener("change",function(){ handleFile(file.files&&file.files[0]); });
+  ["dragenter","dragover"].forEach(function(e){drop.addEventListener(e,function(v){v.preventDefault();drop.classList.add("drag");});});
+  ["dragleave","drop"].forEach(function(e){drop.addEventListener(e,function(v){v.preventDefault();drop.classList.remove("drag");});});
+  drop.addEventListener("drop",function(v){var f=v.dataTransfer.files&&v.dataTransfer.files[0];if(f){file.files=v.dataTransfer.files;handleFile(f);}});
+  window.addEventListener("paste",function(e){var it=(e.clipboardData||{}).items||[];for(var i=0;i<it.length;i++){if(it[i].type.indexOf("image")===0){var f=it[i].getAsFile();file.files=null;handleFile(f);var dt=new DataTransfer();dt.items.add(f);file.files=dt.files;}}});
+  // Direct-subdomain visit: same tab. Inside HF's iframe: native target="_blank".
+  btn.addEventListener("click",function(e){
+    if(!inFrame){ e.preventDefault(); window.location.href = btn.href; }
   });
   document.getElementById("yr").textContent=new Date().getFullYear();
 </script>