Tester
// Set up the canvas where the tshirt design will be rendered
var canvas = document.getElementById('tshirt-designer-canvas');
var context = canvas.getContext('2d');
// Set up the tshirt color picker so the user can choose the tshirt color
var tshirtColorPicker = document.getElementById('tshirt-color-picker');
// Set up the tshirt image and add it to the canvas
var tshirtImage = new Image();
tshirtImage.src = 'https://www.example.com/tshirt.png';
tshirtImage.onload = function() {
// Set the tshirt color
context.fillStyle = tshirtColorPicker.value;
context.fillRect(0, 0, canvas.width, canvas.height);
// Draw the tshirt image on top of the tshirt color
context.drawImage(tshirtImage, 0, 0);
}
// Set up the text input field where the user can enter their custom text
var textInput = document.getElementById('tshirt-text-input');
// Set up the font size range input so the user can adjust the text size
var fontSizeRange = document.getElementById('font-size-range');
// Set up the color picker so the user can choose the text color
var colorPicker = document.getElementById('color-picker');
// Set up the image uploader so the user can add a custom image to the tshirt design
var imageUploader = document.getElementById('image-uploader');
// Set up the add text button so the user can add their custom text to the tshirt design
var addTextButton = document.getElementById('add-text-button');
// When the add text button is clicked, add the text to the tshirt design
addTextButton.addEventListener('click', function() {
var text = textInput.value;
var fontSize = fontSizeRange.value;
var fontColor = colorPicker.value;
context.font
var canvas = document.getElementById('tshirt-designer-canvas');
var context = canvas.getContext('2d');
// Set up the tshirt color picker so the user can choose the tshirt color
var tshirtColorPicker = document.getElementById('tshirt-color-picker');
// Set up the tshirt image and add it to the canvas
var tshirtImage = new Image();
tshirtImage.src = 'https://www.example.com/tshirt.png';
tshirtImage.onload = function() {
// Set the tshirt color
context.fillStyle = tshirtColorPicker.value;
context.fillRect(0, 0, canvas.width, canvas.height);
// Draw the tshirt image on top of the tshirt color
context.drawImage(tshirtImage, 0, 0);
}
// Set up the text input field where the user can enter their custom text
var textInput = document.getElementById('tshirt-text-input');
// Set up the font size range input so the user can adjust the text size
var fontSizeRange = document.getElementById('font-size-range');
// Set up the color picker so the user can choose the text color
var colorPicker = document.getElementById('color-picker');
// Set up the image uploader so the user can add a custom image to the tshirt design
var imageUploader = document.getElementById('image-uploader');
// Set up the add text button so the user can add their custom text to the tshirt design
var addTextButton = document.getElementById('add-text-button');
// When the add text button is clicked, add the text to the tshirt design
addTextButton.addEventListener('click', function() {
var text = textInput.value;
var fontSize = fontSizeRange.value;
var fontColor = colorPicker.value;
context.font