// Generate random background color
function getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
// Generate business card
function generateBusinessCard() {
var name = document.getElementById('name').value;
var position = document.getElementById('position').value;
var email = document.getElementById('email').value;
var phone = document.getElementById('phone').value;
var image = document.getElementById('image').files[0];
var logo = document.getElementById('logo').files[0];
var canvas = Snap('#businessCard');
var bgRect = canvas.rect(0, 0, 400, 250).attr({ fill: getRandomColor() });
var nameLabel = canvas.text(200, 100, name).attr({ 'font-size': 24, 'text-anchor': 'middle' });
var positionLabel = canvas.text(200, 140, position).attr({ 'font-size': 16, 'text-anchor': 'middle' });
var emailLabel = canvas.text(200, 170, email).attr({ 'font-size': Here's the continuation of the code:
```html
var phoneLabel = canvas.text(200, 200, phone).attr({ 'font-size': 16, 'text-anchor': 'middle' });
var imageReader = new FileReader();
imageReader.onload = function(e) {
var image = canvas.image(e.target.result, 25, 40, 100, 100);
};
imageReader.readAsDataURL(image);
var logoReader = new FileReader();
logoReader.onload = function(e) {
var logo = canvas.image(e.target.result, 275, 40, 100, 100);
};
logoReader.readAsDataURL(logo);
}
// Download business card as image
function downloadBusinessCard() {
var svg = document.getElementById('businessCard').innerHTML;
var blob = new Blob([svg], { type: 'image/svg+xml' });
saveAs(blob, 'business_card.svg');
}
document.getElementById('generateBtn').addEventListener('click', generateBusinessCard);
document.getElementById('downloadBtn').addEventListener('click', downloadBusinessCard);
```
