<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>News Website</title>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta name=”theme-color” content=”#ffffff”>
<link rel=”icon” href=”icon.png”>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
h1 {
color: #333;
}
.table-container {
overflow-x: auto;
}
table {
width: 100%;
border-collapse: collapse;
min-width: 600px;
}
th, td {
border: 1px solid #999;
padding: 10px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<h1>News Website</h1>
<div class=”table-container”>
<table>
<tr>
<th>What</th>
<th>When</th>
<th>Where</th>
<th>Who</th>
<th>Why</th>
</tr>
<?php
$filename = “news.csv”;
if (file_exists($filename) && ($handle = fopen($filename, “r”)) !== FALSE) {
fgetcsv($handle); // Skip header row
while (($data = fgetcsv($handle, 1000, “,”)) !== FALSE) {
echo “<tr>”;
foreach ($data as $cell) {
echo “<td>” . htmlspecialchars($cell) . “</td>”;
}
echo “</tr>”;
}
fclose($handle);
} else {
echo “<tr><td colspan=’5′>Error: news.csv not found or unreadable.</td></tr>”;
}
?>
</table>
</div>
<script>
// Inline manifest creation using Blob
const manifest = {
“name”: “News Website”,
“short_name”: “News”,
“start_url”: “./index.php”,
“display”: “standalone”,
“background_color”: “#ffffff”,
“theme_color”: “#ffffff”,
“icons”: [
{
“src”: “icon.png”,
“sizes”: “192×192”,
“type”: “image/png”
},
{
“src”: “icon.png”,
“sizes”: “512×512”,
“type”: “image/png”
}
]
};
const blob = new Blob([JSON.stringify(manifest)], { type: ‘application/json’ });
const manifestURL = URL.createObjectURL(blob);
const link = document.createElement(‘link’);
link.rel = ‘manifest’;
link.href = manifestURL;
document.head.appendChild(link);
// Register the service worker from inside this file
const swCode = `
const CACHE_NAME = ‘news-pwa-v1’;
const urlsToCache = [
‘./index.php’,
‘./news.csv’,
‘./icon.png’
];
self.addEventListener(‘install’, event => {
event.waitUntil(
caches.open(CACHE_NAME).then(cache => cache.addAll(urlsToCache))
);
});
self.addEventListener(‘fetch’, event => {
event.respondWith(
caches.match(event.request)
.then(response => response || fetch(event.request))
);
});
`;
const swBlob = new Blob([swCode], { type: ‘application/javascript’ });
const swUrl = URL.createObjectURL(swBlob);
if (‘serviceWorker’ in navigator) {
navigator.serviceWorker.register(swUrl)
.then(reg => console.log(‘✅ Service Worker registered:’, reg.scope))
.catch(err => console.error(‘❌ Service Worker registration failed:’, err));
}
</script>
</body>
</html>
Solar 