|
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>UAP Pulse - Concise UFO News</title> |
|
<script src="https://cdn.tailwindcss.com"></script> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
<script src="https://cdn.jsdelivr.net/npm/[email protected]/qrcode.min.js"></script> |
|
<style> |
|
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap'); |
|
|
|
body { |
|
font-family: 'Space Grotesk', sans-serif; |
|
background-color: #0f172a; |
|
color: #e2e8f0; |
|
} |
|
|
|
.post-card { |
|
background: linear-gradient(145deg, #1e293b, #0f172a); |
|
border-left: 3px solid #3b82f6; |
|
transition: transform 0.2s; |
|
} |
|
|
|
.post-card:hover { |
|
transform: translateY(-2px); |
|
} |
|
|
|
.nav-item { |
|
position: relative; |
|
} |
|
|
|
.nav-item::after { |
|
content: ''; |
|
position: absolute; |
|
width: 0; |
|
height: 2px; |
|
bottom: 0; |
|
left: 0; |
|
background-color: #3b82f6; |
|
transition: width 0.3s; |
|
} |
|
|
|
.nav-item:hover::after { |
|
width: 100%; |
|
} |
|
|
|
.typewriter { |
|
overflow: hidden; |
|
border-right: 2px solid #3b82f6; |
|
white-space: nowrap; |
|
animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite; |
|
} |
|
|
|
@keyframes typing { |
|
from { width: 0 } |
|
to { width: 100% } |
|
} |
|
|
|
@keyframes blink-caret { |
|
from, to { border-color: transparent } |
|
50% { border-color: #3b82f6 } |
|
} |
|
|
|
.glow { |
|
text-shadow: 0 0 10px rgba(59, 130, 246, 0.7); |
|
} |
|
|
|
|
|
.breaking-panel { |
|
position: fixed; |
|
bottom: 0; |
|
left: 0; |
|
right: 0; |
|
background: linear-gradient(90deg, #ef4444, #dc2626); |
|
color: white; |
|
padding: 12px; |
|
z-index: 100; |
|
transform: translateY(100%); |
|
transition: transform 0.3s ease-out; |
|
box-shadow: 0 -5px 15px rgba(0,0,0,0.3); |
|
} |
|
|
|
.breaking-panel.show { |
|
transform: translateY(0); |
|
} |
|
|
|
|
|
.asr-modal { |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%) scale(0); |
|
background: #1e293b; |
|
border: 1px solid #3b82f6; |
|
border-radius: 8px; |
|
padding: 20px; |
|
width: 90%; |
|
max-width: 500px; |
|
z-index: 1000; |
|
opacity: 0; |
|
transition: all 0.3s ease; |
|
} |
|
|
|
.asr-modal.active { |
|
transform: translate(-50%, -50%) scale(1); |
|
opacity: 1; |
|
} |
|
|
|
.asr-modal-overlay { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
bottom: 0; |
|
background: rgba(0,0,0,0.7); |
|
z-index: 999; |
|
opacity: 0; |
|
pointer-events: none; |
|
transition: opacity 0.3s ease; |
|
} |
|
|
|
.asr-modal-overlay.active { |
|
opacity: 1; |
|
pointer-events: all; |
|
} |
|
|
|
|
|
@keyframes pulse { |
|
0% { opacity: 1; } |
|
50% { opacity: 0.5; } |
|
100% { opacity: 1; } |
|
} |
|
|
|
.recording { |
|
animation: pulse 1.5s infinite; |
|
} |
|
|
|
|
|
.qr-popup { |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%) scale(0); |
|
background: #1e293b; |
|
padding: 20px; |
|
border-radius: 8px; |
|
z-index: 1001; |
|
transition: transform 0.3s ease; |
|
text-align: center; |
|
border: 1px solid #3b82f6; |
|
width: 90%; |
|
max-width: 300px; |
|
} |
|
|
|
.qr-popup.active { |
|
transform: translate(-50%, -50%) scale(1); |
|
} |
|
|
|
|
|
.nfc-modal { |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%) scale(0); |
|
background: #1e293b; |
|
border: 1px solid #10b981; |
|
border-radius: 8px; |
|
padding: 20px; |
|
width: 90%; |
|
max-width: 400px; |
|
z-index: 1002; |
|
opacity: 0; |
|
transition: all 0.3s ease; |
|
} |
|
|
|
.nfc-modal.active { |
|
transform: translate(-50%, -50%) scale(1); |
|
opacity: 1; |
|
} |
|
|
|
|
|
@keyframes nfc-pulse { |
|
0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); } |
|
70% { box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); } |
|
100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } |
|
} |
|
|
|
.nfc-scanning { |
|
animation: nfc-pulse 2s infinite; |
|
} |
|
|
|
|
|
.shape-option { |
|
border: 2px solid transparent; |
|
transition: all 0.2s; |
|
cursor: pointer; |
|
} |
|
|
|
.shape-option:hover { |
|
transform: scale(1.05); |
|
} |
|
|
|
.shape-option.selected { |
|
border-color: #3b82f6; |
|
box-shadow: 0 0 10px rgba(59, 130, 246, 0.5); |
|
} |
|
|
|
|
|
.shape-icon { |
|
width: 40px; |
|
height: 40px; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
margin: 0 auto; |
|
} |
|
|
|
.triangle { |
|
width: 0; |
|
height: 0; |
|
border-left: 20px solid transparent; |
|
border-right: 20px solid transparent; |
|
border-bottom: 35px solid #3b82f6; |
|
} |
|
|
|
.circle { |
|
width: 30px; |
|
height: 30px; |
|
border-radius: 50%; |
|
background-color: #3b82f6; |
|
} |
|
|
|
.square { |
|
width: 30px; |
|
height: 30px; |
|
background-color: #3b82f6; |
|
} |
|
|
|
.cylinder { |
|
width: 25px; |
|
height: 35px; |
|
border-radius: 50%/10px; |
|
background-color: #3b82f6; |
|
} |
|
|
|
.chevron { |
|
width: 30px; |
|
height: 30px; |
|
position: relative; |
|
} |
|
|
|
.chevron:before, .chevron:after { |
|
content: ''; |
|
position: absolute; |
|
top: 0; |
|
width: 50%; |
|
height: 100%; |
|
background: #3b82f6; |
|
} |
|
|
|
.chevron:before { |
|
left: 0; |
|
transform: skew(0deg, 30deg); |
|
} |
|
|
|
.chevron:after { |
|
right: 0; |
|
transform: skew(0deg, -30deg); |
|
} |
|
|
|
.tictac { |
|
width: 50px; |
|
height: 20px; |
|
background-color: #3b82f6; |
|
border-radius: 10px; |
|
} |
|
|
|
|
|
.disclaimer { |
|
font-size: 0.7rem; |
|
color: #64748b; |
|
font-style: italic; |
|
} |
|
</style> |
|
</head> |
|
<body class="min-h-screen"> |
|
|
|
<header class="bg-gradient-to-r from-blue-900 to-slate-900 shadow-lg"> |
|
<div class="container mx-auto px-4 py-6"> |
|
<div class="flex flex-col md:flex-row justify-between items-center"> |
|
<div class="flex items-center mb-4 md:mb-0"> |
|
<i class="fas fa-ufo text-3xl text-blue-400 mr-3"></i> |
|
<h1 class="text-2xl md:text-3xl font-bold text-white"> |
|
<span class="typewriter glow">UAP PULSE</span> |
|
</h1> |
|
</div> |
|
<nav class="flex space-x-6"> |
|
<a href="#" class="nav-item text-blue-300 hover:text-white py-2">Latest</a> |
|
<a href="#" class="nav-item text-blue-300 hover:text-white py-2">Reports</a> |
|
<a href="#" class="nav-item text-blue-300 hover:text-white py-2">History</a> |
|
<a href="#" class="nav-item text-blue-300 hover:text-white py-2">Resources</a> |
|
</nav> |
|
</div> |
|
</div> |
|
</header> |
|
|
|
|
|
<main class="container mx-auto px-4 py-8"> |
|
|
|
<section class="mb-12"> |
|
<div class="bg-gradient-to-br from-blue-900/50 to-slate-900/50 rounded-xl p-6 shadow-xl border border-blue-800/30"> |
|
<div class="flex items-center mb-4"> |
|
<span class="bg-blue-500 text-white text-xs font-semibold px-2.5 py-0.5 rounded">BREAKING</span> |
|
<span class="text-blue-300 text-sm ml-2">June 2024</span> |
|
</div> |
|
<h2 class="text-xl md:text-2xl font-bold text-white mb-3">Pentagon confirms new UAP footage from military pilots</h2> |
|
<p class="text-blue-100 mb-4">"The footage shows unidentified objects exhibiting flight characteristics beyond known technology" - DoD spokesperson. Analysis ongoing.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-blue-300">Source: Defense.gov</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-sm flex items-center" onclick="generateQR('Pentagon confirms new UAP footage from military pilots', 'https://uap-pulse.example.com/posts/2024-pentagon-footage')"> |
|
<i class="fas fa-qrcode mr-1"></i> QR Code |
|
</button> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
|
|
<section> |
|
<h2 class="text-xl font-semibold text-white mb-6 flex items-center"> |
|
<i class="fas fa-bolt text-blue-400 mr-2"></i> 2024 Sightings |
|
</h2> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-green-500 text-white text-xs font-semibold px-2 py-0.5 rounded">NEW</span> |
|
<span class="text-slate-400 text-xs ml-2">May 15, 2024</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">Triangle UAP over Arizona</h3> |
|
<p class="text-slate-300 text-sm mb-4">Multiple witnesses report silent black triangle with lights hovering near Phoenix. No radar confirmation.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: NUFORC #123456</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('Triangle UAP over Arizona', 'https://uap-pulse.example.com/posts/2024-arizona-triangle')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-purple-500 text-white text-xs font-semibold px-2 py-0.5 rounded">HISTORIC</span> |
|
<span class="text-slate-400 text-xs ml-2">April 2024</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">Congressional Hearing Update</h3> |
|
<p class="text-slate-300 text-sm mb-4">New whistleblower testimony reveals previously undisclosed UAP retrieval program. Pentagon denies claims.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: National Archives</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('Congressional Hearing Update', 'https://uap-pulse.example.com/posts/2024-congress-hearing')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-yellow-500 text-white text-xs font-semibold px-2 py-0.5 rounded">ANALYSIS</span> |
|
<span class="text-slate-400 text-xs ml-2">March 2024</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">Navy Pilot Encounters</h3> |
|
<p class="text-slate-300 text-sm mb-4">"The objects accelerated like nothing I've ever seen" - F/A-18 pilot describes 2004 Nimitz encounter in new interview.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: Space.com</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('Navy Pilot Encounters', 'https://uap-pulse.example.com/posts/2024-navy-encounters')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-red-500 text-white text-xs font-semibold px-2 py-0.5 rounded">WARNING</span> |
|
<span class="text-slate-400 text-xs ml-2">February 2024</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">UAP Flight Safety Concerns</h3> |
|
<p class="text-slate-300 text-sm mb-4">FAA reports increase in near-misses with unidentified objects. New reporting procedures implemented for pilots.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: Defense.gov</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('UAP Flight Safety Concerns', 'https://uap-pulse.example.com/posts/2024-flight-safety')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-blue-500 text-white text-xs font-semibold px-2 py-0.5 rounded">REPORT</span> |
|
<span class="text-slate-400 text-xs ml-2">January 2024</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">Global UAP Sightings Spike</h3> |
|
<p class="text-slate-300 text-sm mb-4">NUFORC data shows 37% increase in credible reports since 2020. Most common shapes: spheres, triangles, cylinders.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: NUFORC Stats</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('Global UAP Sightings Spike', 'https://uap-pulse.example.com/posts/2024-global-spike')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-indigo-500 text-white text-xs font-semibold px-2 py-0.5 rounded">SCIENCE</span> |
|
<span class="text-slate-400 text-xs ml-2">December 2023</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">New Analysis of 1967 Malmstrom Case</h3> |
|
<p class="text-slate-300 text-sm mb-4">Researchers claim new evidence suggests UAP may have temporarily disabled nuclear missiles. Military records partially confirm.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Source: Wikipedia/UAP</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('New Analysis of 1967 Malmstrom Case', 'https://uap-pulse.example.com/posts/2023-malmstrom')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
</div> |
|
</section> |
|
|
|
|
|
<section class="mt-16"> |
|
<h2 class="text-xl font-semibold text-white mb-6 flex items-center"> |
|
<i class="fas fa-calendar text-blue-400 mr-2"></i> 2025 Projections |
|
</h2> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-pink-500 text-white text-xs font-semibold px-2 py-0.5 rounded">FUTURE</span> |
|
<span class="text-slate-400 text-xs ml-2">Q1 2025</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">NASA UAP Study Results</h3> |
|
<p class="text-slate-300 text-sm mb-4">Anticipated release of NASA's comprehensive UAP study expected to recommend new scientific approaches to phenomenon.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Projected Source: NASA</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('NASA UAP Study Results', 'https://uap-pulse.example.com/projections/2025-nasa-study')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
|
|
|
|
<article class="post-card rounded-lg p-5 shadow-md hover:shadow-blue-500/10"> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-teal-500 text-white text-xs font-semibold px-2 py-0.5 rounded">FUTURE</span> |
|
<span class="text-slate-400 text-xs ml-2">Q2 2025</span> |
|
</div> |
|
<h3 class="font-semibold text-white mb-2">International UAP Task Force</h3> |
|
<p class="text-slate-300 text-sm mb-4">Pentagon officials suggest multinational UAP investigation team may form to share data across allied nations.</p> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-xs text-slate-500">Projected Source: DoD</span> |
|
<button class="text-blue-400 hover:text-blue-200 text-xs" onclick="generateQR('International UAP Task Force', 'https://uap-pulse.example.com/projections/2025-intl-task-force')"> |
|
<i class="fas fa-qrcode"></i> |
|
</button> |
|
</div> |
|
</article> |
|
</div> |
|
</section> |
|
|
|
|
|
<section class="mt-16"> |
|
<h2 class="text-xl font-semibold text-white mb-6 flex items-center"> |
|
<i class="fas fa-book-open text-blue-400 mr-2"></i> Official Resources |
|
</h2> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
<div class="bg-slate-800/50 rounded-lg p-5 border border-slate-700"> |
|
<h3 class="font-medium text-white mb-3 flex items-center"> |
|
<i class="fas fa-shield-alt text-blue-400 mr-2"></i> Defense Department |
|
</h3> |
|
<p class="text-slate-300 text-sm mb-4">Pentagon's official UAP Task Force reports and declassified documents.</p> |
|
<span class="text-xs text-slate-500">Reference: Defense.gov/UAP</span> |
|
</div> |
|
|
|
<div class="bg-slate-800/50 rounded-lg p-5 border border-slate-700"> |
|
<h3 class="font-medium text-white mb-3 flex items-center"> |
|
<i class="fas fa-archive text-blue-400 mr-2"></i> National Archives |
|
</h3> |
|
<p class="text-slate-300 text-sm mb-4">Historical UAP records including Project Blue Book and other declassified materials.</p> |
|
<span class="text-xs text-slate-500">Reference: Archives.gov/UAP</span> |
|
</div> |
|
|
|
<div class="bg-slate-800/50 rounded-lg p-5 border border-slate-700"> |
|
<h3 class="font-medium text-white mb-3 flex items-center"> |
|
<i class="fas fa-globe-americas text-blue-400 mr-2"></i> NUFORC |
|
</h3> |
|
<p class="text-slate-300 text-sm mb-4">Largest public database of UFO sightings with global reports since 1974.</p> |
|
<span class="text-xs text-slate-500">Reference: NUFORC.org</span> |
|
</div> |
|
|
|
<div class="bg-slate-800/50 rounded-lg p-5 border border-slate-700"> |
|
<h3 class="font-medium text-white mb-3 flex items-center"> |
|
<i class="fas fa-rocket text-blue-400 mr-2"></i> Space.com |
|
</h3> |
|
<p class="text-slate-300 text-sm mb-4">Scientific analysis of UAP phenomena and space-related explanations.</p> |
|
<span class="text-xs text-slate-500">Reference: Space.com/UFO</span> |
|
</div> |
|
</div> |
|
</section> |
|
</main> |
|
|
|
|
|
<footer class="bg-slate-900 mt-16 py-8 border-t border-slate-800"> |
|
<div class="container mx-auto px-4"> |
|
<div class="flex flex-col md:flex-row justify-between items-center"> |
|
<div class="mb-4 md:mb-0"> |
|
<div class="flex items-center"> |
|
<i class="fas fa-ufo text-2xl text-blue-400 mr-2"></i> |
|
<span class="text-xl font-bold text-white">UAP PULSE</span> |
|
</div> |
|
<p class="text-slate-400 text-sm mt-1">Concise updates on unidentified aerial phenomena</p> |
|
</div> |
|
|
|
<div class="flex space-x-6"> |
|
<a href="#" class="text-slate-400 hover:text-blue-300"> |
|
<i class="fab fa-twitter"></i> |
|
</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300"> |
|
<i class="fab fa-facebook"></i> |
|
</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300"> |
|
<i class="fab fa-reddit"></i> |
|
</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300"> |
|
<i class="fas fa-rss"></i> |
|
</a> |
|
</div> |
|
</div> |
|
|
|
<div class="border-t border-slate-800 mt-6 pt-6 flex flex-col md:flex-row justify-between items-center"> |
|
<p class="text-slate-500 text-sm mb-4 md:mb-0">© 2025 UAP Pulse. All rights reserved. Sponsored by SM+</p> |
|
<div class="flex space-x-4"> |
|
<a href="#" class="text-slate-400 hover:text-blue-300 text-sm">Privacy</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300 text-sm">Terms</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300 text-sm">Contact</a> |
|
<a href="#" class="text-slate-400 hover:text-blue-300 text-sm">Submit Report</a> |
|
</div> |
|
</div> |
|
</div> |
|
</footer> |
|
|
|
|
|
<div class="breaking-panel" id="breakingPanel"> |
|
<div class="container mx-auto flex items-center justify-between"> |
|
<div class="flex items-center"> |
|
<span class="bg-white text-red-600 font-bold px-2 py-0.5 rounded mr-3">BREAKING</span> |
|
<span class="text-white font-medium" id="breakingText">Mass UAP sighting reported over New York City - multiple witnesses confirm unusual lights</span> |
|
</div> |
|
<button class="text-white hover:text-gray-200 ml-4" onclick="closeBreakingPanel()"> |
|
<i class="fas fa-times"></i> |
|
</button> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="fixed bottom-6 right-6 flex flex-col space-y-3"> |
|
<button class="bg-red-600 hover:bg-red-500 text-white w-12 h-12 rounded-full shadow-lg flex items-center justify-center transition-all" onclick="showBreakingPanel()"> |
|
<i class="fas fa-bell"></i> |
|
</button> |
|
<button class="bg-blue-600 hover:bg-blue-500 text-white w-12 h-12 rounded-full shadow-lg flex items-center justify-center transition-all" onclick="openASRModal()"> |
|
<i class="fas fa-plus"></i> |
|
</button> |
|
<button class="bg-green-600 hover:bg-green-500 text-white w-12 h-12 rounded-full shadow-lg flex items-center justify-center transition-all" id="nfcButton" onclick="openNFCModal()"> |
|
<i class="fas fa-wifi"></i> |
|
</button> |
|
</div> |
|
|
|
|
|
<div class="asr-modal" id="asrModal"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="text-lg font-semibold text-white">Create New UAP Report</h3> |
|
<button class="text-slate-400 hover:text-white" onclick="closeASRModal()"> |
|
<i class="fas fa-times"></i> |
|
</button> |
|
</div> |
|
|
|
<div class="mb-4"> |
|
<label class="block text-sm font-medium text-slate-300 mb-1">Title</label> |
|
<input type="text" id="postTitle" class="w-full bg-slate-800 border border-slate-700 rounded px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-blue-500"> |
|
</div> |
|
|
|
<div class="mb-4"> |
|
<label class="block text-sm font-medium text-slate-300 mb-1">Content</label> |
|
<textarea id="postContent" rows="4" class="w-full bg-slate-800 border border-slate-700 rounded px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-blue-500"></textarea> |
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
<label class="block text-sm font-medium text-slate-300 mb-2">UAP Shape</label> |
|
<div class="grid grid-cols-3 gap-3"> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('triangle')"> |
|
<div class="shape-icon"> |
|
<div class="triangle"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Triangle</p> |
|
</div> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('circle')"> |
|
<div class="shape-icon"> |
|
<div class="circle"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Sphere</p> |
|
</div> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('square')"> |
|
<div class="shape-icon"> |
|
<div class="square"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Cube</p> |
|
</div> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('cylinder')"> |
|
<div class="shape-icon"> |
|
<div class="cylinder"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Cylinder</p> |
|
</div> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('chevron')"> |
|
<div class="shape-icon"> |
|
<div class="chevron"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Chevron</p> |
|
</div> |
|
<div class="shape-option rounded-lg p-2" onclick="selectShape('tictac')"> |
|
<div class="shape-icon"> |
|
<div class="tictac"></div> |
|
</div> |
|
<p class="text-xs text-center mt-1 text-slate-300">Tic-Tac</p> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
<label class="block text-sm font-medium text-slate-300 mb-1">Possible Origin (Optional)</label> |
|
<div class="grid grid-cols-2 gap-3"> |
|
<div> |
|
<select id="galaxySelect" class="w-full bg-slate-800 border border-slate-700 rounded px-3 py-2 text-white text-sm focus:outline-none focus:ring-1 focus:ring-blue-500"> |
|
<option value="">Select Galaxy</option> |
|
<option value="Milky Way">Milky Way</option> |
|
<option value="Andromeda">Andromeda</option> |
|
<option value="Triangulum">Triangulum</option> |
|
<option value="Messier 87">Messier 87</option> |
|
<option value="Large Magellanic Cloud">Large Magellanic Cloud</option> |
|
<option value="Small Magellanic Cloud">Small Magellanic Cloud</option> |
|
<option value="Pinwheel">Pinwheel</option> |
|
<option value="Sombrero">Sombrero</option> |
|
<option value="Whirlpool">Whirlpool</option> |
|
<option value="Other">Other/Unknown</option> |
|
</select> |
|
</div> |
|
<div> |
|
<select id="civilizationSelect" class="w-full bg-slate-800 border border-slate-700 rounded px-3 py-2 text-white text-sm focus:outline-none focus:ring-1 focus:ring-blue-500"> |
|
<option value="">Select Civilization</option> |
|
<option value="Pleiadeans">Pleiadeans</option> |
|
<option value="Arcturians">Arcturians</option> |
|
<option value="Zeta Reticuli">Zeta Reticuli</option> |
|
<option value="Lyrans">Lyrans</option> |
|
<option value="Orion">Orion</option> |
|
<option value="Sirians">Sirians</option> |
|
<option value="Andromedans">Andromedans</option> |
|
<option value="Anunnaki">Anunnaki</option> |
|
<option value="Reptilians">Reptilians</option> |
|
<option value="Other">Other/Unknown</option> |
|
</select> |
|
</div> |
|
</div> |
|
<p class="disclaimer mt-1">Note: Origin selection represents the reporter's opinion only</p> |
|
</div> |
|
|
|
<div class="flex items-center mb-4"> |
|
<button id="recordButton" class="bg-red-600 hover:bg-red-500 text-white px-4 py-2 rounded flex items-center" onclick="toggleRecording()"> |
|
<i class="fas fa-microphone mr-2"></i> Start Recording |
|
</button> |
|
<span id="recordingStatus" class="text-slate-400 text-sm ml-3 hidden"> |
|
<i class="fas fa-circle text-red-500 mr-1"></i> Recording... |
|
</span> |
|
</div> |
|
|
|
<div class="flex justify-end space-x-3"> |
|
<button class="bg-slate-700 hover:bg-slate-600 text-white px-4 py-2 rounded" onclick="closeASRModal()"> |
|
Cancel |
|
</button> |
|
<button class="bg-blue-600 hover:bg-blue-500 text-white px-4 py-2 rounded" onclick="createPost()"> |
|
Create Post |
|
</button> |
|
</div> |
|
</div> |
|
|
|
<div class="asr-modal-overlay" id="asrModalOverlay"></div> |
|
|
|
|
|
<div class="qr-popup" id="qrPopup"> |
|
<div class="flex justify-between items-center mb-3"> |
|
<h3 class="text-sm font-semibold text-white" id="qrTitle"></h3> |
|
<button class="text-slate-400 hover:text-white" onclick="closeQRPopup()"> |
|
<i class="fas fa-times"></i> |
|
</button> |
|
</div> |
|
<div id="qrCode" class="mb-3 mx-auto"></div> |
|
<p class="text-xs text-slate-400">Scan to share this story</p> |
|
<button class="mt-3 bg-green-600 hover:bg-green-500 text-white px-3 py-1 rounded text-sm flex items-center mx-auto" onclick="sendViaNFC()"> |
|
<i class="fas fa-wifi mr-1"></i> Send via NFC |
|
</button> |
|
</div> |
|
|
|
|
|
<div class="nfc-modal" id="nfcModal"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="text-lg font-semibold text-white">NFC Transmitter</h3> |
|
<button class="text-slate-400 hover:text-white" onclick="closeNFCModal()"> |
|
<i class="fas fa-times"></i> |
|
</button> |
|
</div> |
|
|
|
<div class="text-center mb-6"> |
|
<div class="bg-green-600/20 border-2 border-green-500 rounded-full w-24 h-24 flex items-center justify-center mx-auto mb-3" id="nfcIcon"> |
|
<i class="fas fa-wifi text-3xl text-green-400"></i> |
|
</div> |
|
<p class="text-slate-300 text-sm" id="nfcStatus">Ready to transmit selected QR code</p> |
|
</div> |
|
|
|
<div class="bg-slate-800/50 rounded-lg p-4 mb-4"> |
|
<h4 class="text-sm font-medium text-white mb-2">Selected Story</h4> |
|
<p class="text-slate-300 text-sm" id="nfcStoryTitle">No story selected</p> |
|
</div> |
|
|
|
<div class="flex justify-center"> |
|
<button class="bg-green-600 hover:bg-green-500 text-white px-4 py-2 rounded flex items-center" id="nfcTransmitButton" onclick="startNFCTransmission()"> |
|
<i class="fas fa-bolt mr-2"></i> Begin Transmission |
|
</button> |
|
</div> |
|
</div> |
|
|
|
<script> |
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
const posts = document.querySelectorAll('.post-card'); |
|
|
|
const observer = new IntersectionObserver((entries) => { |
|
entries.forEach(entry => { |
|
if (entry.isIntersecting) { |
|
entry.target.style.opacity = '1'; |
|
entry.target.style.transform = 'translateY(0)'; |
|
} |
|
}); |
|
}, { threshold: 0.1 }); |
|
|
|
posts.forEach((post, index) => { |
|
post.style.opacity = '0'; |
|
post.style.transform = 'translateY(20px)'; |
|
post.style.transition = `opacity 0.5s ease ${index * 0.1}s, transform 0.5s ease ${index * 0.1}s`; |
|
observer.observe(post); |
|
}); |
|
|
|
|
|
setTimeout(() => { |
|
document.querySelector('.typewriter').style.borderRight = 'none'; |
|
}, 3500); |
|
|
|
|
|
setTimeout(showBreakingPanel, 10000); |
|
|
|
|
|
window.currentQRData = null; |
|
window.currentQRTitle = null; |
|
|
|
|
|
window.selectedShape = null; |
|
}); |
|
|
|
|
|
function showBreakingPanel() { |
|
const panel = document.getElementById('breakingPanel'); |
|
panel.classList.add('show'); |
|
|
|
|
|
const breakingTexts = [ |
|
"Mass UAP sighting reported over New York City - multiple witnesses confirm unusual lights", |
|
"Pentagon confirms leaked video shows unknown object entering ocean at hypersonic speed", |
|
"BREAKING: Congressional committee demands immediate release of all UAP-related documents", |
|
"Scientists detect unusual atmospheric anomalies coinciding with recent UAP sightings" |
|
]; |
|
|
|
let currentIndex = 0; |
|
setInterval(() => { |
|
currentIndex = (currentIndex + 1) % breakingTexts.length; |
|
document.getElementById('breakingText').textContent = breakingTexts[currentIndex]; |
|
}, 15000); |
|
} |
|
|
|
function closeBreakingPanel() { |
|
document.getElementById('breakingPanel').classList.remove('show'); |
|
} |
|
|
|
|
|
function openASRModal() { |
|
document.getElementById('asrModal').classList.add('active'); |
|
document.getElementById('asrModalOverlay').classList.add('active'); |
|
|
|
|
|
document.getElementById('postTitle').value = ''; |
|
document.getElementById('postContent').value = ''; |
|
document.getElementById('galaxySelect').value = ''; |
|
document.getElementById('civilizationSelect').value = ''; |
|
|
|
|
|
if (window.selectedShape) { |
|
document.querySelector(`.shape-option[onclick="selectShape('${window.selectedShape}')"]`).classList.remove('selected'); |
|
window.selectedShape = null; |
|
} |
|
} |
|
|
|
function closeASRModal() { |
|
document.getElementById('asrModal').classList.remove('active'); |
|
document.getElementById('asrModalOverlay').classList.remove('active'); |
|
stopRecording(); |
|
} |
|
|
|
|
|
function selectShape(shape) { |
|
|
|
document.querySelectorAll('.shape-option').forEach(option => { |
|
option.classList.remove('selected'); |
|
}); |
|
|
|
|
|
const selectedOption = document.querySelector(`.shape-option[onclick="selectShape('${shape}')"]`); |
|
selectedOption.classList.add('selected'); |
|
|
|
window.selectedShape = shape; |
|
} |
|
|
|
function toggleRecording() { |
|
const recordButton = document.getElementById('recordButton'); |
|
const recordingStatus = document.getElementById('recordingStatus'); |
|
|
|
if (recordButton.innerHTML.includes('Start')) { |
|
|
|
recordButton.innerHTML = '<i class="fas fa-stop mr-2"></i> Stop Recording'; |
|
recordButton.classList.remove('bg-red-600', 'hover:bg-red-500'); |
|
recordButton.classList.add('bg-red-700', 'hover:bg-red-600'); |
|
recordingStatus.classList.remove('hidden'); |
|
|
|
|
|
setTimeout(() => { |
|
document.getElementById('postContent').value = "I witnessed multiple bright lights in triangular formation moving silently over the city at approximately 9:30 PM. The objects made sudden 90-degree turns without slowing down. No visible propulsion or sound. Duration: about 2 minutes before disappearing behind clouds."; |
|
}, 2000); |
|
} else { |
|
|
|
stopRecording(); |
|
} |
|
} |
|
|
|
function stopRecording() { |
|
const recordButton = document.getElementById('recordButton'); |
|
const recordingStatus = document.getElementById('recordingStatus'); |
|
|
|
recordButton.innerHTML = '<i class="fas fa-microphone mr-2"></i> Start Recording'; |
|
recordButton.classList.add('bg-red-600', 'hover:bg-red-500'); |
|
recordButton.classList.remove('bg-red-700', 'hover:bg-red-600'); |
|
recordingStatus.classList.add('hidden'); |
|
} |
|
|
|
function createPost() { |
|
const title = document.getElementById('postTitle').value; |
|
const content = document.getElementById('postContent').value; |
|
const galaxy = document.getElementById('galaxySelect').value; |
|
const civilization = document.getElementById('civilizationSelect').value; |
|
|
|
if (title && content) { |
|
let originInfo = ''; |
|
if (galaxy || civilization) { |
|
originInfo = `\n\nPossible Origin: ${galaxy ? galaxy : 'Unknown galaxy'}${civilization ? ` (${civilization})` : ''}`; |
|
} |
|
|
|
alert(`New post created!\nTitle: ${title}\nContent: ${content}${originInfo}`); |
|
closeASRModal(); |
|
|
|
|
|
generateQR(title, `https://uap-pulse.example.com/posts/${Date.now()}`); |
|
} else { |
|
alert('Please fill in both title and content'); |
|
} |
|
} |
|
|
|
|
|
function generateQR(title, url) { |
|
const qrPopup = document.getElementById('qrPopup'); |
|
const qrTitle = document.getElementById('qrTitle'); |
|
const qrCode = document.getElementById('qrCode'); |
|
|
|
qrTitle.textContent = title; |
|
qrCode.innerHTML = ''; |
|
|
|
|
|
window.currentQRData = url; |
|
window.currentQRTitle = title; |
|
|
|
|
|
const qr = qrcode(0, 'L'); |
|
qr.addData(url); |
|
qr.make(); |
|
qrCode.innerHTML = qr.createImgTag(4); |
|
|
|
|
|
qrPopup.classList.add('active'); |
|
document.getElementById('asrModalOverlay').classList.add('active'); |
|
} |
|
|
|
function closeQRPopup() { |
|
document.getElementById('qrPopup').classList.remove('active'); |
|
document.getElementById('asrModalOverlay').classList.remove('active'); |
|
} |
|
|
|
|
|
function openNFCModal() { |
|
const nfcModal = document.getElementById('nfcModal'); |
|
const nfcStoryTitle = document.getElementById('nfcStoryTitle'); |
|
|
|
|
|
if (window.currentQRTitle) { |
|
nfcStoryTitle.textContent = window.currentQRTitle; |
|
document.getElementById('nfcTransmitButton').disabled = false; |
|
} else { |
|
nfcStoryTitle.textContent = "No story selected"; |
|
document.getElementById('nfcTransmitButton').disabled = true; |
|
} |
|
|
|
nfcModal.classList.add('active'); |
|
document.getElementById('asrModalOverlay').classList.add('active'); |
|
} |
|
|
|
function closeNFCModal() { |
|
document.getElementById('nfcModal').classList.remove('active'); |
|
document.getElementById('asrModalOverlay').classList.remove('active'); |
|
stopNFCTransmission(); |
|
} |
|
|
|
function sendViaNFC() { |
|
closeQRPopup(); |
|
openNFCModal(); |
|
} |
|
|
|
function startNFCTransmission() { |
|
const nfcIcon = document.getElementById('nfcIcon'); |
|
const nfcStatus = document.getElementById('nfcStatus'); |
|
const nfcButton = document.getElementById('nfcButton'); |
|
const transmitButton = document.getElementById('nfcTransmitButton'); |
|
|
|
if (!window.currentQRData) { |
|
nfcStatus.textContent = "Error: No data to transmit"; |
|
return; |
|
} |
|
|
|
|
|
nfcIcon.classList.add('nfc-sscanning'); |
|
nfcStatus.textContent = "Transmitting data via NFC..."; |
|
transmitButton.disabled = true; |
|
transmitButton.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> Transmitting'; |
|
nfcButton.classList.add('nfc-scanning'); |
|
|
|
|
|
setTimeout(() => { |
|
stopNFCTransmission(); |
|
nfcStatus.textContent = "Transmission complete!"; |
|
|
|
|
|
setTimeout(() => { |
|
nfcStatus.textContent = "Ready to transmit selected QR code"; |
|
}, 2000); |
|
}, 3000); |
|
} |
|
|
|
function stopNFCTransmission() { |
|
const nfcIcon = document.getElementById('nfcIcon'); |
|
const nfcStatus = document.getElementById('nfcStatus'); |
|
const nfcButton = document.getElementById('nfcButton'); |
|
const transmitButton = document.getElementById('nfcTransmitButton'); |
|
|
|
nfcIcon.classList.remove('nfc-scanning'); |
|
nfcButton.classList.remove('nfc-scanning'); |
|
transmitButton.disabled = false; |
|
transmitButton.innerHTML = '<i class="fas fa-bolt mr-2"></i> Begin Transmission'; |
|
} |
|
</script> |
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=privateuserh/privateuserh-uaphe-vbeta1-01" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
</html> |