File size: 2,732 Bytes
6989a67 debd79d 6989a67 debd79d 6989a67 debd79d 6989a67 debd79d 6989a67 debd79d 6989a67 debd79d 6989a67 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 |
document.getElementById('lbw-form').addEventListener('submit', function(e) {
e.preventDefault();
const formData = new FormData(this);
fetch('/analyze', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
if (data.error) {
document.getElementById('decision').textContent = `Error: ${data.error}`;
} else {
document.getElementById('decision').textContent = `Decision: ${data.decision} (Confidence: ${data.confidence})`;
document.getElementById('details').innerHTML = `
Pitching: ${data.pitching.status}<br>
Impact: ${data.impact.status}<br>
Wickets: ${data.wicket}
`;
drawPitch(data.actual_path, data.projected_path, data.pitching, data.impact);
}
})
.catch(error => {
document.getElementById('decision').textContent = `Error: ${error.message}`;
});
});
function drawPitch(actualPath, projectedPath, pitching, impact) {
const canvas = document.getElementById('pitchCanvas');
const ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = '#90EE90';
ctx.fillRect(50, 50, 300, 500);
ctx.fillStyle = '#FFF';
ctx.fillRect(190, 50, 20, 10);
ctx.strokeStyle = '#000';
ctx.beginPath();
ctx.moveTo(50, 150); ctx.lineTo(350, 150);
ctx.moveTo(200, 50); ctx.lineTo(200, 150);
ctx.stroke();
function scalePoint(point) {
return {
x: 50 + point.x * 300,
y: 550 - point.y * 500
};
}
if (actualPath.length > 0) {
ctx.strokeStyle = 'red';
ctx.lineWidth = 2;
ctx.beginPath();
const actualScaled = actualPath.map(scalePoint);
ctx.moveTo(actualScaled[0].x, actualScaled[0].y);
for (let i = 1; i < actualScaled.length; i++) {
ctx.lineTo(actualScaled[i].x, actualScaled[i].y);
}
ctx.stroke();
}
if (projectedPath.length > 0) {
ctx.strokeStyle = 'blue';
ctx.lineWidth = 2;
ctx.beginPath();
const projectedScaled = projectedPath.map(scalePoint);
ctx.moveTo(projectedScaled[0].x, projectedScaled[0].y);
ctx.lineTo(projectedScaled[1].x, projectedScaled[1].y);
ctx.stroke();
}
const pitchPt = scalePoint(pitching);
ctx.fillStyle = 'black';
ctx.beginPath();
ctx.arc(pitchPt.x, pitchPt.y, 5, 0, 2 * Math.PI);
ctx.fill();
const impactPt = scalePoint(impact);
ctx.fillStyle = 'orange';
ctx.beginPath();
ctx.arc(impactPt.x, impactPt.y, 5, 0, 2 * Math.PI);
ctx.fill();
} |