debug: add console.log to trace PDF button click flow
This commit is contained in:
1 parent
1ab72e533a
commit
c4066b35d0
2 files changed
+118
-160
No files matched your search
+59
-80
@@ -948,105 +948,84 @@
|
||||
<script>
|
||||
(function () {
|
||||
var btn = document.querySelector('[data-resume-pdf-btn]');
|
||||
console.log('[PDF] btn found:', !!btn);
|
||||
if (!btn) return;
|
||||
|
||||
var CDN_URL = 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.2/html2pdf.bundle.min.js';
|
||||
var loading = false;
|
||||
|
||||
function setLoading(state) {
|
||||
loading = state;
|
||||
btn.setAttribute('data-loading', state);
|
||||
btn.setAttribute('aria-busy', state);
|
||||
}
|
||||
var CDN = 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.2/html2pdf.bundle.min.js';
|
||||
var busy = false;
|
||||
|
||||
function loadScript(src) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
if (document.querySelector('script[src="' + src + '"]')) { resolve(); return; }
|
||||
return new Promise(function (ok, fail) {
|
||||
if (window.html2pdf) { ok(); return; }
|
||||
var s = document.createElement('script');
|
||||
s.src = src;
|
||||
s.onload = resolve;
|
||||
s.onerror = reject;
|
||||
s.onload = ok;
|
||||
s.onerror = fail;
|
||||
document.head.appendChild(s);
|
||||
});
|
||||
}
|
||||
|
||||
function imgToDataUrl(img) {
|
||||
return new Promise(function (resolve) {
|
||||
if (img.complete && img.naturalWidth > 0) {
|
||||
btn.addEventListener('click', function () {
|
||||
console.log('[PDF] click, busy:', busy);
|
||||
if (busy) return;
|
||||
busy = true;
|
||||
btn.setAttribute('data-loading', 'true');
|
||||
|
||||
var doc = document.querySelector('.resume-doc');
|
||||
if (!doc) { busy = false; btn.removeAttribute('data-loading'); return; }
|
||||
|
||||
var photo = doc.querySelector('.resume-photo');
|
||||
var origSrc = photo ? photo.getAttribute('src') : null;
|
||||
|
||||
function toDataURL(img) {
|
||||
return new Promise(function (res) {
|
||||
try {
|
||||
var c = document.createElement('canvas');
|
||||
c.width = img.naturalWidth;
|
||||
c.height = img.naturalHeight;
|
||||
c.getContext('2d').drawImage(img, 0, 0);
|
||||
resolve(c.toDataURL('image/webp'));
|
||||
} catch (e) { resolve(null); }
|
||||
} else {
|
||||
img.onload = function () {
|
||||
try {
|
||||
var c = document.createElement('canvas');
|
||||
c.width = img.naturalWidth;
|
||||
c.height = img.naturalHeight;
|
||||
c.getContext('2d').drawImage(img, 0, 0);
|
||||
resolve(c.toDataURL('image/webp'));
|
||||
} catch (e) { resolve(null); }
|
||||
};
|
||||
img.onerror = function () { resolve(null); };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
btn.addEventListener('click', function () {
|
||||
if (loading) return;
|
||||
setLoading(true);
|
||||
|
||||
var el = document.querySelector('.resume-doc');
|
||||
if (!el) { setLoading(false); return; }
|
||||
|
||||
var photo = el.querySelector('.resume-photo');
|
||||
var photoOriginalSrc = photo ? photo.getAttribute('src') : null;
|
||||
var photoPromises = [];
|
||||
|
||||
if (photo) {
|
||||
photoPromises.push(
|
||||
imgToDataUrl(photo).then(function (dataUrl) {
|
||||
if (dataUrl) photo.setAttribute('src', dataUrl);
|
||||
})
|
||||
);
|
||||
res(c.toDataURL('image/webp'));
|
||||
} catch (e) { res(null); }
|
||||
});
|
||||
}
|
||||
|
||||
var favicons = el.querySelectorAll('link[rel="icon"], link[rel="shortcut icon"]');
|
||||
|
||||
Promise.all(photoPromises)
|
||||
.then(function () { return document.fonts ? document.fonts.ready : Promise.resolve(); })
|
||||
.then(function () { return loadScript(CDN_URL); })
|
||||
.then(function () {
|
||||
return html2pdf().from(el).set({
|
||||
margin: [10, 10, 10, 10],
|
||||
filename: 'Mamadaev_Resume.pdf',
|
||||
image: { type: 'jpeg', quality: 0.95 },
|
||||
html2canvas: {
|
||||
scale: 2,
|
||||
useCORS: true,
|
||||
letterRendering: true,
|
||||
backgroundColor: '#ffffff'
|
||||
},
|
||||
jsPDF: {
|
||||
unit: 'mm',
|
||||
format: 'a4',
|
||||
orientation: 'portrait',
|
||||
compress: true
|
||||
}
|
||||
var photoReady = photo && photo.complete && photo.naturalWidth > 0
|
||||
? toDataURL(photo)
|
||||
: new Promise(function (res) {
|
||||
photo.onload = function () { toDataURL(photo).then(res); };
|
||||
photo.onerror = function () { res(null); };
|
||||
});
|
||||
})
|
||||
.then(function () {
|
||||
if (photoOriginalSrc) photo.setAttribute('src', photoOriginalSrc);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('PDF generation failed:', err);
|
||||
if (photoOriginalSrc) photo.setAttribute('src', photoOriginalSrc);
|
||||
setLoading(false);
|
||||
|
||||
photoReady.then(function (dataUrl) {
|
||||
console.log('[PDF] photo ready, dataUrl:', !!dataUrl);
|
||||
if (dataUrl && photo) photo.setAttribute('src', dataUrl);
|
||||
return document.fonts ? document.fonts.ready : Promise.resolve();
|
||||
})
|
||||
.then(function () {
|
||||
console.log('[PDF] fonts ready, loading script...');
|
||||
return loadScript(CDN);
|
||||
})
|
||||
.then(function () {
|
||||
console.log('[PDF] script loaded, generating...');
|
||||
return html2pdf().from(doc).set({
|
||||
margin: 10,
|
||||
filename: 'Mamadaev_Resume.pdf',
|
||||
image: { type: 'jpeg', quality: 0.95 },
|
||||
html2canvas: { scale: 2, useCORS: true, backgroundColor: '#fff' },
|
||||
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
|
||||
});
|
||||
})
|
||||
.then(function () {
|
||||
if (origSrc && photo) photo.setAttribute('src', origSrc);
|
||||
busy = false;
|
||||
btn.removeAttribute('data-loading');
|
||||
})
|
||||
.catch(function (e) {
|
||||
console.error('PDF error:', e);
|
||||
if (origSrc && photo) photo.setAttribute('src', origSrc);
|
||||
busy = false;
|
||||
btn.removeAttribute('data-loading');
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
|
||||
+59
-80
@@ -842,105 +842,84 @@
|
||||
<script>
|
||||
(function () {
|
||||
var btn = document.querySelector('[data-resume-pdf-btn]');
|
||||
console.log('[PDF] btn found:', !!btn);
|
||||
if (!btn) return;
|
||||
|
||||
var CDN_URL = 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.2/html2pdf.bundle.min.js';
|
||||
var loading = false;
|
||||
|
||||
function setLoading(state) {
|
||||
loading = state;
|
||||
btn.setAttribute('data-loading', state);
|
||||
btn.setAttribute('aria-busy', state);
|
||||
}
|
||||
var CDN = 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.2/html2pdf.bundle.min.js';
|
||||
var busy = false;
|
||||
|
||||
function loadScript(src) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
if (document.querySelector('script[src="' + src + '"]')) { resolve(); return; }
|
||||
return new Promise(function (ok, fail) {
|
||||
if (window.html2pdf) { ok(); return; }
|
||||
var s = document.createElement('script');
|
||||
s.src = src;
|
||||
s.onload = resolve;
|
||||
s.onerror = reject;
|
||||
s.onload = ok;
|
||||
s.onerror = fail;
|
||||
document.head.appendChild(s);
|
||||
});
|
||||
}
|
||||
|
||||
function imgToDataUrl(img) {
|
||||
return new Promise(function (resolve) {
|
||||
if (img.complete && img.naturalWidth > 0) {
|
||||
btn.addEventListener('click', function () {
|
||||
console.log('[PDF] click, busy:', busy);
|
||||
if (busy) return;
|
||||
busy = true;
|
||||
btn.setAttribute('data-loading', 'true');
|
||||
|
||||
var doc = document.querySelector('.resume-doc');
|
||||
if (!doc) { busy = false; btn.removeAttribute('data-loading'); return; }
|
||||
|
||||
var photo = doc.querySelector('.resume-photo');
|
||||
var origSrc = photo ? photo.getAttribute('src') : null;
|
||||
|
||||
function toDataURL(img) {
|
||||
return new Promise(function (res) {
|
||||
try {
|
||||
var c = document.createElement('canvas');
|
||||
c.width = img.naturalWidth;
|
||||
c.height = img.naturalHeight;
|
||||
c.getContext('2d').drawImage(img, 0, 0);
|
||||
resolve(c.toDataURL('image/webp'));
|
||||
} catch (e) { resolve(null); }
|
||||
} else {
|
||||
img.onload = function () {
|
||||
try {
|
||||
var c = document.createElement('canvas');
|
||||
c.width = img.naturalWidth;
|
||||
c.height = img.naturalHeight;
|
||||
c.getContext('2d').drawImage(img, 0, 0);
|
||||
resolve(c.toDataURL('image/webp'));
|
||||
} catch (e) { resolve(null); }
|
||||
};
|
||||
img.onerror = function () { resolve(null); };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
btn.addEventListener('click', function () {
|
||||
if (loading) return;
|
||||
setLoading(true);
|
||||
|
||||
var el = document.querySelector('.resume-doc');
|
||||
if (!el) { setLoading(false); return; }
|
||||
|
||||
var photo = el.querySelector('.resume-photo');
|
||||
var photoOriginalSrc = photo ? photo.getAttribute('src') : null;
|
||||
var photoPromises = [];
|
||||
|
||||
if (photo) {
|
||||
photoPromises.push(
|
||||
imgToDataUrl(photo).then(function (dataUrl) {
|
||||
if (dataUrl) photo.setAttribute('src', dataUrl);
|
||||
})
|
||||
);
|
||||
res(c.toDataURL('image/webp'));
|
||||
} catch (e) { res(null); }
|
||||
});
|
||||
}
|
||||
|
||||
var favicons = el.querySelectorAll('link[rel="icon"], link[rel="shortcut icon"]');
|
||||
|
||||
Promise.all(photoPromises)
|
||||
.then(function () { return document.fonts ? document.fonts.ready : Promise.resolve(); })
|
||||
.then(function () { return loadScript(CDN_URL); })
|
||||
.then(function () {
|
||||
return html2pdf().from(el).set({
|
||||
margin: [10, 10, 10, 10],
|
||||
filename: 'Mamadaev_Resume.pdf',
|
||||
image: { type: 'jpeg', quality: 0.95 },
|
||||
html2canvas: {
|
||||
scale: 2,
|
||||
useCORS: true,
|
||||
letterRendering: true,
|
||||
backgroundColor: '#ffffff'
|
||||
},
|
||||
jsPDF: {
|
||||
unit: 'mm',
|
||||
format: 'a4',
|
||||
orientation: 'portrait',
|
||||
compress: true
|
||||
}
|
||||
var photoReady = photo && photo.complete && photo.naturalWidth > 0
|
||||
? toDataURL(photo)
|
||||
: new Promise(function (res) {
|
||||
photo.onload = function () { toDataURL(photo).then(res); };
|
||||
photo.onerror = function () { res(null); };
|
||||
});
|
||||
})
|
||||
.then(function () {
|
||||
if (photoOriginalSrc) photo.setAttribute('src', photoOriginalSrc);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('PDF generation failed:', err);
|
||||
if (photoOriginalSrc) photo.setAttribute('src', photoOriginalSrc);
|
||||
setLoading(false);
|
||||
|
||||
photoReady.then(function (dataUrl) {
|
||||
console.log('[PDF] photo ready, dataUrl:', !!dataUrl);
|
||||
if (dataUrl && photo) photo.setAttribute('src', dataUrl);
|
||||
return document.fonts ? document.fonts.ready : Promise.resolve();
|
||||
})
|
||||
.then(function () {
|
||||
console.log('[PDF] fonts ready, loading script...');
|
||||
return loadScript(CDN);
|
||||
})
|
||||
.then(function () {
|
||||
console.log('[PDF] script loaded, generating...');
|
||||
return html2pdf().from(doc).set({
|
||||
margin: 10,
|
||||
filename: 'Mamadaev_Resume.pdf',
|
||||
image: { type: 'jpeg', quality: 0.95 },
|
||||
html2canvas: { scale: 2, useCORS: true, backgroundColor: '#fff' },
|
||||
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
|
||||
});
|
||||
})
|
||||
.then(function () {
|
||||
if (origSrc && photo) photo.setAttribute('src', origSrc);
|
||||
busy = false;
|
||||
btn.removeAttribute('data-loading');
|
||||
})
|
||||
.catch(function (e) {
|
||||
console.error('PDF error:', e);
|
||||
if (origSrc && photo) photo.setAttribute('src', origSrc);
|
||||
busy = false;
|
||||
btn.removeAttribute('data-loading');
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in new issue
Block a user