זה הקוד של האתר (הוספתי שם גם סתם בדיקה שינסה לשאוב את הנתונים והוא בכלל לא מקבל רק כשהקובץ בלי הגרפים)
<!DOCTYPE html>
<html lang="he">
<head>
<meta charset="utf-8">
<title>תצוגת נתונים ApprovalAll.ymgr - גמר</title>
<style>
body {
direction: rtl;
font-family: 'Heebo', Arial, sans-serif;
background: linear-gradient(120deg, #e3f2fd 0%, #bbdefb 100%);
margin: 0;
padding: 0;
}
.container {
width: 100vw;
max-width: 100vw;
margin: 0;
background: rgba(255,255,255,0.95);
border-radius: 24px 24px 0 0;
box-shadow: 0 8px 32px 0 rgba(44,62,80,0.12);
padding: 0 0 32px 0;
}
h2 {
margin-top: 0;
color: #1976d2;
font-size: 3.6em;
text-align: center;
letter-spacing: 2px;
text-shadow: 0 2px 8px #90caf9;
font-weight: 900;
}
.loading {
text-align: center;
color: #1976d2;
font-size: 2em;
margin-top: 40px;
font-weight: bold;
}
.error {
text-align: center;
color: #f44336;
font-size: 2em;
margin-top: 40px;
font-weight: bold;
}
#chart {
display: none;
width: 100vw!important;
height: 80vh!important;
min-height: 400px;
margin: 0;
background: #fff;
border-radius: 32px;
box-shadow: 0 4px 24px 0 rgba(44,62,80,0.10);
border: 2px solid #90caf9;
}
</style>
</head>
<body>
<div class="container">
<h2>סך נקודות לכל מתמודד - גמר</h2>
<div id="loading" class="loading">טוען נתונים...</div>
<div id="error" class="error" style="display:none;"></div>
<canvas id="chart" style="display:none;width:100vw!important;height:80vh!important;min-height:400px;margin:0;"></canvas>
</div>
<link href="https://fonts.googleapis.com/css2?family=Heebo:wght@700;900&display=swap" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2"></script>
<script>
const url = "https://www.call2all.co.il/ym/api/RenderYMGRFile?token=023130270:1****&wath=ivr2:3/ApprovalAll.ymgr&convertType=json¬LoadLang=0";
let finalists = {};
let addedPoints = {};
// טען שמות מתמודדי הגמר מהקובץ ששומר הדשבורד
function loadFinalists() {
fetch('finalists.php')
.then(r => r.json())
.then(obj => {
if (obj && typeof obj === 'object') finalists = obj;
});
}
function getRandomName(num) {
const randomNames = ["אורן", "שירה", "יואב"];
return randomNames[(num-1) % randomNames.length];
}
// צבעים ייחודיים לכל מתמודד
const colors = [
'#1976d2', '#f44336', '#4caf50'
];
let chartInstance = null;
function updateChart() {
fetch(url)
.then(response => response.json())
.then(json => {
document.getElementById('loading').style.display = 'none';
document.getElementById('error').style.display = 'none';
// הצג רק 3 מתמודדים ראשונים
const NUM_CONTESTANTS = 3;
let points = {};
if (json.data && Array.isArray(json.data)) {
json.data.forEach(row => {
if (row["נקודות"] && row["P050"]) {
// המרה למספר תקני (למניעת בעיות עם "01" וכו')
let p = String(Number(row["P050"])); // תמיד "1", "2", "3"
let name = finalists[p] || getRandomName(Number(p));
let pts = Number(row["נקודות"]);
if (!points[name]) points[name] = 0;
points[name] += pts;
}
});
}
// Build 3 contestants, always in order 1-3
let labels = [];
let data = [];
let bgColors = [];
for (let i = 1; i <= NUM_CONTESTANTS; i++) {
let name = finalists[i] || getRandomName(i);
let totalPoints = (points[name] || 0) + (addedPoints[i] || 0);
labels.push([i, name]);
data.push(totalPoints);
bgColors.push(colors[(i-1) % colors.length]);
}
if (labels.length > 0) {
document.getElementById('chart').style.display = 'block';
const ctx = document.getElementById('chart').getContext('2d');
if (chartInstance) {
chartInstance.data.labels = labels;
chartInstance.data.datasets[0].data = data;
chartInstance.data.datasets[0].backgroundColor = bgColors;
chartInstance.update();
} else {
chartInstance = new Chart(ctx, {
type: 'bar',
data: {
labels: labels,
datasets: [{
label: 'סך נקודות',
data: data,
backgroundColor: bgColors,
borderRadius: 8
}]
},
options: {
maintainAspectRatio: false,
responsive: true,
animation: {
duration: 1200,
easing: 'easeOutBounce'
},
plugins: {
legend: { display: false },
title: {
display: true,
text: 'סך נקודות לכל מתמודד - גמר',
font: { size: 54, weight: 'bold' },
color: '#1976d2',
padding: { top: 30, bottom: 30 }
},
datalabels: {
display: false // לא להציג מספר על הגרף
}
},
scales: {
x: {
title: { display: true, text: 'מתמודד', font: { size: 36 }, color: '#1976d2' },
ticks: {
font: { size: 32, weight: 'bold' },
color: function(context) {
if (context.tick && Array.isArray(context.tick.label)) {
return [
colors[context.index % colors.length],
'#1976d2'
];
}
return '#1976d2';
},
callback: function(value, index, ticks) {
const label = this.getLabelForValue(value);
if (Array.isArray(label)) {
return [label[0].toString(), label[1]];
}
return label;
}
}
},
y: {
title: { display: true, text: 'נקודות', font: { size: 36 }, color: '#1976d2' },
ticks: { font: { size: 32, weight: 'bold' }, color: '#1976d2' },
beginAtZero: true
}
},
layout: { padding: 60 }
},
plugins: [ChartDataLabels]
});
}
}
})
.catch(err => {
document.getElementById('loading').style.display = 'none';
document.getElementById('error').innerText = "שגיאה בטעינת הנתונים!";
document.getElementById('error').style.display = 'block';
});
}
// טען שמות מתמודדי הגמר והצג גרף כל 2 שניות
function refreshFinal() {
loadFinalists();
updateChart();
}
refreshFinal();
setInterval(refreshFinal, 2000);
</script>
<div class="container">
<h2>כל הנתונים מה-API</h2>
<div id="output">טוען נתונים...</div>
</div>
<script>
const url = "https://www.call2all.co.il/ym/api/RenderYMGRFile?token=023130270:1*****2&wath=ivr2:3/ApprovalAll.ymgr&convertType=json¬LoadLang=0";
function fetchAndShow() {
fetch(url)
.then(r => r.json())
.then(data => {
document.getElementById('output').innerHTML =
'<pre>' + JSON.stringify(data, null, 2) + '</pre>';
})
.catch(err => {
document.getElementById('output').innerHTML = 'שגיאה בטעינת הנתונים: ' + err;
});
}
fetchAndShow();
setInterval(fetchAndShow, 2000);
</script>
</body>
</html>