שמחים על הצטרפותכם למעגל לקוחותינו

// משתני מערכת גלובליים let canvases = {}; let contexts = {}; let isDrawing = {}; let siteMailerConfig = { ajaxUrl: window.location.origin + '/wp-admin/admin-ajax.php', action: 'send_form_email', nonce: 'site_mailer_nonce_' + Date.now() }; // עדכון הגדרות אם זמינות מ-PHP if (typeof window.siteMailerConfig !== 'undefined') { siteMailerConfig = window.siteMailerConfig; siteMailerConfig.action = 'send_form_email'; } // אתחול canvases לכל הטפסים function initAllSignatureCanvases() { const canvasIds = [ 'registrationSignatureCanvas', 'retainerClientSignatureCanvas', 'retainerProviderSignatureCanvas', 'memberSignatureCanvas', 'facilitatorSignatureCanvas' ]; console.log('🎨 מאתחל canvases לחתימות...'); canvasIds.forEach(canvasId => { const canvas = document.getElementById(canvasId); if (canvas) { console.log(`✅ נמצא canvas: ${canvasId}`); setupCanvas(canvas, canvasId); } else { console.log(`⚠️ לא נמצא canvas: ${canvasId}`); } }); console.log('🎨 סיום אתחול canvases'); } // הגדרת canvas בודד function setupCanvas(canvas, canvasId) { if (!canvas) { console.log(`❌ Canvas לא נמצא: ${canvasId}`); return; } console.log(`🔧 מגדיר canvas: ${canvasId}`); const ctx = canvas.getContext('2d'); canvases[canvasId] = canvas; contexts[canvasId] = ctx; isDrawing[canvasId] = false; // הגדרת גודל canvas עם high DPI const rect = canvas.getBoundingClientRect(); canvas.width = rect.width * 2; canvas.height = rect.height * 2; canvas.style.width = rect.width + 'px'; canvas.style.height = rect.height + 'px'; // הגדרת context ctx.scale(2, 2); ctx.lineCap = 'round'; ctx.lineJoin = 'round'; ctx.strokeStyle = '#000'; ctx.lineWidth = 2; // Mouse events canvas.addEventListener('mousedown', (e) => startDrawing(e, canvasId)); canvas.addEventListener('mousemove', (e) => draw(e, canvasId)); canvas.addEventListener('mouseup', () => stopDrawing(canvasId)); canvas.addEventListener('mouseout', () => stopDrawing(canvasId)); // Touch events for mobile canvas.addEventListener('touchstart', function(e) { e.preventDefault(); const touch = e.touches[0]; const mouseEvent = new MouseEvent('mousedown', { clientX: touch.clientX, clientY: touch.clientY }); canvas.dispatchEvent(mouseEvent); }); canvas.addEventListener('touchmove', function(e) { e.preventDefault(); const touch = e.touches[0]; const mouseEvent = new MouseEvent('mousemove', { clientX: touch.clientX, clientY: touch.clientY }); canvas.dispatchEvent(mouseEvent); }); canvas.addEventListener('touchend', function(e) { e.preventDefault(); const mouseEvent = new MouseEvent('mouseup', {}); canvas.dispatchEvent(mouseEvent); }); // הוספת רמז ויזואלי שהcanvas מוכן לציור canvas.style.cursor = 'crosshair'; console.log(`✅ Canvas מוכן לשימוש: ${canvasId}`); } // התחלת ציור function startDrawing(e, canvasId) { const canvas = canvases[canvasId]; const ctx = contexts[canvasId]; if (!canvas || !ctx) return; // הסתרת הודעת הקריאה לציור hideCanvasHint(canvasId); isDrawing[canvasId] = true; const rect = canvas.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; ctx.beginPath(); ctx.moveTo(x, y); } // פונקציה להסתרת הודעת הקריאה לציור function hideCanvasHint(canvasId) { const hintMap = { 'registrationSignatureCanvas': 'registrationCanvasHint', 'retainerClientSignatureCanvas': 'retainerClientCanvasHint', 'retainerProviderSignatureCanvas': 'retainerProviderCanvasHint', 'memberSignatureCanvas': 'memberCanvasHint', 'facilitatorSignatureCanvas': 'facilitatorCanvasHint' }; const hintId = hintMap[canvasId]; const hintElement = document.getElementById(hintId); if (hintElement) { hintElement.style.display = 'none'; } } // ציור function draw(e, canvasId) { if (!isDrawing[canvasId]) return; const canvas = canvases[canvasId]; const ctx = contexts[canvasId]; if (!canvas || !ctx) return; const rect = canvas.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; ctx.lineTo(x, y); ctx.stroke(); } // סיום ציור function stopDrawing(canvasId) { isDrawing[canvasId] = false; } // מחיקת חתימה function clearSignature(type) { let canvasId; // מיפוי של סוגי חתימה ל-canvas ID const typeToCanvasMap = { 'registration': 'registrationSignatureCanvas', 'retainerClient': 'retainerClientSignatureCanvas', 'retainerProvider': 'retainerProviderSignatureCanvas', 'member': 'memberSignatureCanvas', 'facilitator': 'facilitatorSignatureCanvas' }; canvasId = typeToCanvasMap[type]; if (!canvasId || !canvases[canvasId] || !contexts[canvasId]) { alert('❌ שגיאה: לא ניתן למצוא את אזור החתימה'); return; } const canvas = canvases[canvasId]; const ctx = contexts[canvasId]; // מחיקת הcanvas ctx.clearRect(0, 0, canvas.width, canvas.height); // מחיקת השדה הנסתר const hiddenInputMap = { 'registration': 'registrationSignatureData', 'retainerClient': 'retainerClientSignatureData', 'retainerProvider': 'retainerProviderSignatureData', 'member': 'memberSignatureData', 'facilitator': 'facilitatorSignatureData' }; const hiddenInputId = hiddenInputMap[type]; const hiddenInput = document.getElementById(hiddenInputId); if (hiddenInput) { hiddenInput.value = ''; } const typeLabels = { 'registration': 'ההרשמה', 'retainerClient': 'הלקוח (ריטיינר)', 'retainerProvider': 'ניר מקו (ריטיינר)', 'member': 'החבר (TAB)', 'facilitator': 'המנחה (TAB)' }; alert(`🗑️ חתימת ${typeLabels[type]} נמחקה בהצלחה`); } // שמירת חתימה function saveSignature(type) { let canvasId; // מיפוי של סוגי חתימה ל-canvas ID const typeToCanvasMap = { 'registration': 'registrationSignatureCanvas', 'retainerClient': 'retainerClientSignatureCanvas', 'retainerProvider': 'retainerProviderSignatureCanvas', 'member': 'memberSignatureCanvas', 'facilitator': 'facilitatorSignatureCanvas' }; canvasId = typeToCanvasMap[type]; if (!canvasId || !canvases[canvasId]) { alert('❌ שגיאה: לא ניתן למצוא את אזור החתימה'); return; } const canvas = canvases[canvasId]; const ctx = canvas.getContext('2d'); // בדיקה אם יש תוכן בcanvas const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height); const data = imageData.data; let hasContent = false; for (let i = 0; i { if (input.type === 'checkbox' || input.type === 'radio') { if (input.checked) { formData[input.name] = input.value || 'כן'; } } else { formData[input.name] = input.value || ''; } }); return formData; } // פונקציה משופרת לשליחת טופס async function submitForm(formType) { const btn = event.target; const originalText = btn.innerHTML; // שינוי מצב הכפתור btn.innerHTML = '🔄 בודק נתונים...'; btn.disabled = true; try { // איסוף נתוני הטופס const formData = collectFormData(formType); if (!formData) { throw new Error('לא ניתן לאסוף את נתוני הטופס'); } // וידוא שדות חובה const requiredFields = { 'registration': ['firstName', 'lastName', 'email'], 'retainer': ['clientName', 'price'], 'tab': ['fullName', 'email'] }; const required = requiredFields[formType] || []; for (const field of required) { if (!formData[field] || formData[field].trim() === '') { const fieldNames = { 'firstName': 'שם פרטי', 'lastName': 'שם משפחה', 'email': 'אימייל', 'clientName': 'שם הלקוח', 'price': 'מחיר', 'fullName': 'שם מלא' }; throw new Error(`השדה "${fieldNames[field] || field}" הוא שדה חובה`); } } // בדיקת חתימות דרושות לכל טופס if (formType === 'registration') { if (!formData.registrationSignatureData || formData.registrationSignatureData.trim() === '') { throw new Error('נדרשת חתימה דיגיטלית. אנא חתום ושמור את החתימה.'); } } else if (formType === 'retainer') { if (!formData.retainerClientSignatureData || formData.retainerClientSignatureData.trim() === '') { throw new Error('נדרשת חתימת הלקוח. אנא חתום ושמור את החתימה.'); } } else if (formType === 'tab') { if (!formData.memberSignatureData || formData.memberSignatureData.trim() === '') { throw new Error('נדרשת חתימת החבר. אנא חתום ושמור את החתימה.'); } if (!formData.memberSignatureDate || formData.memberSignatureDate.trim() === '') { throw new Error('נדרש תאריך חתימת החבר.'); } } btn.innerHTML = '✅ הטופס הוכן בהצלחה!'; // הודעת הצלחה מפורטת const clientName = formData.firstName || formData.clientName || formData.fullName || 'לקוח'; const clientEmail = formData.email || ''; setTimeout(() => { alert(`🎉 ${formData.formTitle} הוכן בהצלחה! 👤 שם לקוח: ${clientName} ${clientEmail ? `📩 אימייל לקוח: ${clientEmail}` : ''} ✅ החתימות נשמרו בהצלחה! 📧 הטופס מוכן לשליחה 💡 שים לב: הקוד הזה כולל את כל הפונקציונליות אבל לא מתחבר לשרת מייל אמיתי.`); }, 1000); } catch (error) { console.error('Error:', error); btn.innerHTML = '❌ שגיאה בטופס'; setTimeout(() => { alert(`❌ שגיאה בטופס: ${error.message} 💡 טיפים: • וודא שכל השדות החובה מלאים • וודא שחתמת ושמרת את החתימה • ✍️ בדוק שהחתימה נשמרה (לחץ "שמור חתימה")`); }, 1000); } finally { // החזרת הכפתור למצב רגיל setTimeout(() => { btn.innerHTML = originalText; btn.disabled = false; }, 5000); } } // פונקציה פשוטה להדפסת הטאב הפעיל בלבד function printForm() { // מציאת הטאב הפעיל וקבלת כותרת const activeTab = document.querySelector('.tab-content.active'); if (!activeTab) return; let formTitle = ''; if (activeTab.id === 'registration') { formTitle = 'הרשמה ללחצות הרף'; } else if (activeTab.id === 'retainer') { formTitle = 'הסכם התקשרות - ריטיינר'; } else if (activeTab.id === 'info') { formTitle = 'הסכם הרשמה TAB'; } // שמירת כותרת מקורית const originalTitle = document.title; // עדכון כותרת הדף להדפסה document.title = formTitle; // הוספת כותרת הדפסה זמנית const printHeader = document.createElement('div'); printHeader.id = 'temp-print-header'; printHeader.innerHTML = `

${formTitle}

הודפס בתאריך: ${new Date().toLocaleDateString('he-IL')} בשעה: ${new Date().toLocaleTimeString('he-IL')}

`; // הוספת הכותרת בתחילת הטאב הפעיל activeTab.insertBefore(printHeader, activeTab.firstChild); // Convert canvas signatures to images for printing const tempImages = []; activeTab.querySelectorAll('canvas').forEach((canvas, index) => { if (canvas && canvas.id) { const img = document.createElement('img'); img.src = canvas.toDataURL(); img.style.cssText = 'max-width: 100%; height: 150px; border: 1px solid #ccc; border-radius: 5px; background: white;'; canvas.style.display = 'none'; canvas.parentNode.insertBefore(img, canvas); img.id = 'temp-signature-img-' + index; tempImages.push({ img, canvas }); } }); // הדפסה window.print(); // ניקוי אחרי ההדפסה setTimeout(() => { // הסרת כותרת ההדפסה const headerToRemove = document.getElementById('temp-print-header'); if (headerToRemove) { headerToRemove.remove(); } // Restore canvas elements tempImages.forEach(({ img, canvas }) => { if (img && canvas) { img.remove(); canvas.style.display = ''; } }); // שחזור כותרת הדף document.title = originalTitle; }, 100); } // פונקציה לחליפת טאבים function showTab(tabName) { const contents = document.querySelectorAll('.tab-content'); contents.forEach(content => content.classList.remove('active')); const tabs = document.querySelectorAll('.tab'); tabs.forEach(tab => tab.classList.remove('active')); document.getElementById(tabName).classList.add('active'); event.target.classList.add('active'); // Initialize signature canvases when tab is shown setTimeout(() => { console.log(`🔄 עבר לטאב: ${tabName}`); initAllSignatureCanvases(); // בדיקה שכל הcanvases של הטאב הנוכחי פעילים testCurrentTabSignatures(tabName); }, 100); } // פונקציה לבדיקת חתימות בטאב הנוכחי function testCurrentTabSignatures(tabName) { let canvasesToTest = []; switch(tabName) { case 'registration': canvasesToTest = ['registrationSignatureCanvas']; break; case 'retainer': canvasesToTest = ['retainerClientSignatureCanvas', 'retainerProviderSignatureCanvas']; break; case 'info': // TAB canvasesToTest = ['memberSignatureCanvas', 'facilitatorSignatureCanvas']; break; } canvasesToTest.forEach(canvasId => { const canvas = document.getElementById(canvasId); if (canvas && canvases[canvasId] && contexts[canvasId]) { console.log(`✅ Canvas פעיל ומוכן לציור: ${canvasId}`); // הוספת בדיקה ויזואלית - גבול זמני canvas.style.border = '2px solid #4a90e2'; setTimeout(() => { canvas.style.border = '2px solid #ccc'; }, 1000); } else { console.log(`❌ Canvas לא פעיל: ${canvasId}`); } }); } // פונקציה לוידוא שהציור עובד function testSignatureDrawing() { const allCanvases = [ 'registrationSignatureCanvas', 'retainerClientSignatureCanvas', 'retainerProviderSignatureCanvas', 'memberSignatureCanvas', 'facilitatorSignatureCanvas' ]; allCanvases.forEach(canvasId => { const canvas = document.getElementById(canvasId); if (canvas) { console.log(`🎯 בודק canvas: ${canvasId}`); // בדיקה שהcanvas זמין לציור const ctx = canvas.getContext('2d'); if (ctx) { console.log(`✅ Context זמין עבור: ${canvasId}`); // הוספת הודעה ויזואלית לcanvas const rect = canvas.getBoundingClientRect(); ctx.fillStyle = '#e0e0e0'; ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillStyle = '#666'; ctx.font = '16px Arial'; ctx.textAlign = 'center'; ctx.fillText('לחץ וגרור לציור חתימה', rect.width/2, rect.height/2); // מחיקת ההודעה אחרי 3 שניות setTimeout(() => { ctx.clearRect(0, 0, canvas.width, canvas.height); }, 3000); } else { console.log(`❌ Context לא זמין עבור: ${canvasId}`); } } else { console.log(`❌ Canvas לא נמצא: ${canvasId}`); } }); } // אתחול כשהדף נטען document.addEventListener('DOMContentLoaded', function() { console.log('🚀 מאתחל מערכת טפסים עם חתימות דיגיטליות...'); // אתחול חתימות initAllSignatureCanvases(); // בדיקת פונקציונליות חתימות setTimeout(testSignatureDrawing, 1000); console.log('✍️ חתימות דיגיטליות זמינות בכל הטפסים'); console.log('🖨️ הדפסה: רק הטאב הפעיל יודפס עם החתימות'); console.log('📝 שלושה טפסים: הרשמה, ריטיינר, TAB'); // הוספת מאזיני אירועים נוספים window.addEventListener('resize', function() { console.log('🔄 גודל מסך השתנה - מאתחל חתימות מחדש'); setTimeout(initAllSignatureCanvases, 100); }); });