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

compressImage

تصفح المصدر
هذا الالتزام موجود في:
Muhammad Kadi
2026-03-30 19:08:22 +04:00
الأصل 9708ac6a37
التزام 66de18b11c
1 ملفات معدلة مع 121 إضافات و63 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

184
join.js
عرض الملف

@@ -4,79 +4,137 @@
const API_URL = `/api/join`;
const form = document.getElementById('driverForm');
const btn = document.getElementById('submitBtn');
const photoInput = document.getElementById('photoInput');
const form = document.getElementById("driverForm");
const btn = document.getElementById("submitBtn");
const photoInput = document.getElementById("photoInput");
function compressImage(file, maxWidth = 1280, quality = 0.7) {
return new Promise((resolve) => {
if (file.size <= 1024 * 1024) {
return resolve(file);
}
const img = new Image();
const url = URL.createObjectURL(file);
img.onload = () => {
URL.revokeObjectURL(url);
let width = img.width;
let height = img.height;
if (width > maxWidth) {
height = Math.round((height * maxWidth) / width);
width = maxWidth;
}
const canvas = document.createElement("canvas");
canvas.width = width;
canvas.height = height;
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height);
canvas.toBlob(
(blob) => {
const compressed = new File([blob], file.name, {
type: "image/jpeg",
lastModified: Date.now(),
});
resolve(compressed);
},
"image/jpeg",
quality,
);
};
img.onerror = () => {
URL.revokeObjectURL(url);
resolve(file);
};
img.src = url;
});
}
// --- عرض معاينة الصورة الشخصية عند اختيارها ---
photoInput.addEventListener('change', () => {
const preview = document.getElementById('fileNamePreview');
const previewContainer = document.getElementById('imagePreviewContainer');
const imagePreview = document.getElementById('imagePreview');
const file = photoInput.files[0];
if (file) {
preview.innerText = file.name;
const reader = new FileReader();
reader.onload = (e) => {
imagePreview.src = e.target.result;
previewContainer.classList.remove('hidden');
};
reader.readAsDataURL(file);
} else {
preview.innerText = '';
previewContainer.classList.add('hidden');
}
photoInput.addEventListener("change", () => {
const preview = document.getElementById("fileNamePreview");
const previewContainer = document.getElementById("imagePreviewContainer");
const imagePreview = document.getElementById("imagePreview");
const file = photoInput.files[0];
if (file) {
preview.innerText = file.name;
const reader = new FileReader();
reader.onload = (e) => {
imagePreview.src = e.target.result;
previewContainer.classList.remove("hidden");
};
reader.readAsDataURL(file);
} else {
preview.innerText = "";
previewContainer.classList.add("hidden");
}
});
// --- إرسال النموذج ---
form.addEventListener('submit', async (e) => {
e.preventDefault();
btn.disabled = true;
btn.innerText = 'جاري إرسال طلبك...';
form.addEventListener("submit", async (e) => {
e.preventDefault();
btn.disabled = true;
btn.innerText = "جاري إرسال طلبك...";
const formData = new FormData(form);
const photoFile = photoInput.files[0];
const idFrontFile = document.getElementById('idFrontInput').files[0];
const idBackFile = document.getElementById('idBackInput').files[0];
const formData = new FormData(form);
const photoFile = photoInput.files[0];
const idFrontFile = document.getElementById("idFrontInput").files[0];
const idBackFile = document.getElementById("idBackInput").files[0];
const message =
`🚀 *طلب انضمام جديد (طلباتك بلس)* \n\n` +
`👤 *الاسم:* ${formData.get('name')}\n` +
`📱 *الجوال:* ${formData.get('phone')}\n` +
`🎂 *العمر:* ${formData.get('age')}\n` +
`🆔 *الرقم الوطني:* ${formData.get('nationalId')}\n` +
`📍 *العنوان:* ${formData.get('address')}\n` +
`🛵 *نوع المركبة:* ${formData.get('vehicleType')}\n` +
`🔢 *هل منمرة:* ${formData.get('isNumbered')}\n` +
`📄 *رقم اللوحة:* ${formData.get('plateNumber') || 'لا يوجد'}\n` +
`💡 *عمل سابقاً في التوصيل:* ${formData.get('previousExperience')}\n` +
`🗺️ *خبرة بمناطق حلب:* ${formData.get('aleppKnowledge')}\n\n` +
`✅ *موافق على الشروط والتأمين*`;
const message =
`🚀 *طلب انضمام جديد (طلباتك بلس)* \n\n` +
`👤 *الاسم:* ${formData.get("name")}\n` +
`📱 *الجوال:* ${formData.get("phone")}\n` +
`🎂 *العمر:* ${formData.get("age")}\n` +
`🆔 *الرقم الوطني:* ${formData.get("nationalId")}\n` +
`📍 *العنوان:* ${formData.get("address")}\n` +
`🛵 *نوع المركبة:* ${formData.get("vehicleType")}\n` +
`🔢 *هل منمرة:* ${formData.get("isNumbered")}\n` +
`📄 *رقم اللوحة:* ${formData.get("plateNumber") || "لا يوجد"}\n` +
`💡 *عمل سابقاً في التوصيل:* ${formData.get("previousExperience")}\n` +
`🗺️ *خبرة بمناطق حلب:* ${formData.get("aleppKnowledge")}\n\n` +
`✅ *موافق على الشروط والتأمين*`;
try {
const backendFormData = new FormData();
backendFormData.append('photo', photoFile);
backendFormData.append('idFront', idFrontFile);
backendFormData.append('idBack', idBackFile);
backendFormData.append('message', message);
try {
const [compressedPhoto, compressedFront, compressedBack] =
await Promise.all([
compressImage(photoFile),
compressImage(idFrontFile),
compressImage(idBackFile),
]);
const response = await fetch(API_URL, {
method: 'POST',
body: backendFormData
});
const backendFormData = new FormData();
backendFormData.append("photo", compressedPhoto);
backendFormData.append("idFront", compressedFront);
backendFormData.append("idBack", compressedBack);
backendFormData.append("message", message);
const result = await response.json();
const response = await fetch(API_URL, {
method: "POST",
body: backendFormData,
});
if (result.ok) {
window.location.href = 'success.html';
} else {
alert('حدث خطأ في الإرسال: ' + (result.description || 'فشل إرسال الطلب.'));
}
} catch (error) {
alert('فشل الاتصال بالخادم.');
} finally {
btn.disabled = false;
btn.innerText = 'إرسال طلب الانضمام';
const result = await response.json();
if (result.ok) {
window.location.href = "success.html";
} else {
alert(
"حدث خطأ في الإرسال: " + (result.description || "فشل إرسال الطلب."),
);
}
} catch (error) {
alert("فشل الاتصال بالخادم.");
} finally {
btn.disabled = false;
btn.innerText = "إرسال طلب الانضمام";
}
});