a/qr-generator
1
0
نسخ 0
الشفرة المشكلات طلبات السحب Actions Packages المشاريع الإصدارات الويكي النشاط

first commit

تصفح المصدر
هذا الالتزام موجود في:
muath-ye
2024-09-16 08:58:13 +03:00
التزام 1d4a3d278c
7 ملفات معدلة مع 86 إضافات و0 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

ثنائية
icon-192x192.png Normal file
عرض الملف

ملف ثنائي غير معروض.
جنبًا إلى جنب

بعد

العرض:  |  الارتفاع:  |  الحجم: 19 KiB

ثنائية
icon-512x512.png Normal file
عرض الملف

ملف ثنائي غير معروض.
جنبًا إلى جنب

بعد

العرض:  |  الارتفاع:  |  الحجم: 43 KiB

19
index.html Normal file
عرض الملف

@@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR Code Generator PWA</title>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link rel="manifest" href="manifest.json">
</head>
<body class="flex items-center justify-center h-screen bg-gray-100">
<div class="bg-white p-6 rounded-lg shadow-lg">
<h1 class="text-2xl font-bold mb-4">QR Code Generator</h1>
<input type="text" id="text-input" class="w-full p-2 mb-4 border rounded" placeholder="Enter text to generate QR code">
<button id="generate-btn" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Generate QR Code</button>
<canvas id="qr-code" class="mt-4"></canvas>
</div>
<script src="script.js"></script>
</body>
</html>

20
manifest.json Normal file
عرض الملف

@@ -0,0 +1,20 @@
{
"name": "QR Code Generator",
"short_name": "QRGen",
"start_url": "/",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#000000",
"icons": [
{
"src": "icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}

24
script.js Normal file
عرض الملف

@@ -0,0 +1,24 @@
document.getElementById('generate-btn').addEventListener('click', () => {
const text = document.getElementById('text-input').value;
const canvas = document.getElementById('qr-code');
if (text) {
QRCode.toCanvas(canvas, text, function (error) {
if (error) console.error(error);
console.log('QR code generated!');
});
}
});
// Add QRCode library
const script = document.createElement('script');
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/qrcode-generator/1.4.4/qrcode.min.js';
document.body.appendChild(script);
// Register the Service Worker
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js')
.then(registration => console.log('Service Worker registered:', registration))
.catch(error => console.log('Service Worker registration failed:', error));
});
}

0
style.css Normal file
عرض الملف

23
sw.js Normal file
عرض الملف

@@ -0,0 +1,23 @@
const CACHE_NAME = 'qr-code-pwa-v1';
const assetsToCache = [
'/',
'/index.html',
'/style.css',
'/script.js',
'https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css',
'https://cdnjs.cloudflare.com/ajax/libs/qrcode-generator/1.4.4/qrcode.min.js'
];
self.addEventListener('install', event => {
event.waitUntil(
caches.open(CACHE_NAME)
.then(cache => cache.addAll(assetsToCache))
);
});
self.addEventListener('fetch', event => {
event.respondWith(
caches.match(event.request)
.then(response => response || fetch(event.request))
);
});