tykayn/osm-commerces
1
0
Fork 0
mirror of https://forge.chapril.org/tykayn/osm-commerces synced 2025-10-04 17:04:53 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

up historique

Browse source
This commit is contained in:
Tykayn 2025-06-21 11:28:31 +02:00 • committed by tykayn
parent ad4170db14
commit c274fd6a63
12 changed files with 448 additions and 616 deletions
Download patch file Download diff file Expand all files Collapse all files

118
assets/app.js
View file

@ -17,7 +17,107 @@ import './josm.js';
import './edit.js';
import Chart from 'chart.js/auto';
import ChartDataLabels from 'chartjs-plugin-datalabels';
import { genererCouleurPastel, setupCitySearch, handleAddCityFormSubmit, enableLabourageForm, getLabourerUrl, adjustListGroupFontSize } from './utils.js';
import Tablesort from 'tablesort';
window.Chart = Chart;
window.genererCouleurPastel = genererCouleurPastel;
window.setupCitySearch = setupCitySearch;
window.handleAddCityFormSubmit = handleAddCityFormSubmit;
window.getLabourerUrl = getLabourerUrl;
Chart.register(ChartDataLabels);
function initDashboardChart() {
const chartCanvas = document.getElementById('statsBubbleChart');
if (!chartCanvas) {
return;
}
if (!chartCanvas.dataset.stats || chartCanvas.dataset.stats.length <= 2) { // <= 2 pour ignorer '[]'
console.log("Les données du graphique sont vides ou absentes, le graphique ne sera pas affiché.");
return;
}
const statsData = JSON.parse(chartCanvas.dataset.stats);
if (statsData && statsData.length > 0) {
const bubbleChartData = statsData.map(stat => {
const population = parseInt(stat.population, 10);
const placesCount = parseInt(stat.placesCount, 10);
const ratio = population > 0 ? (placesCount / population) * 1000 : 0;
return {
x: population,
y: ratio,
r: Math.sqrt(placesCount) * 2,
label: stat.name,
completion: stat.completionPercent || 0
};
});
new Chart(chartCanvas.getContext('2d'), {
type: 'bubble',
data: {
datasets: [{
label: 'Villes',
data: bubbleChartData,
backgroundColor: bubbleChartData.map(d => `rgba(255, 99, 132, ${d.completion / 100})`),
borderColor: 'rgba(255, 99, 132, 1)',
}]
},
options: {
responsive: true,
plugins: {
datalabels: {
anchor: 'center',
align: 'center',
color: '#000',
font: {
weight: 'bold'
},
formatter: (value, context) => {
return context.dataset.data[context.dataIndex].label;
}
},
legend: {
display: false
},
tooltip: {
callbacks: {
label: (context) => {
const d = context.raw;
return [
`${d.label}`,
`Population: ${d.x.toLocaleString()}`,
`Lieux / 1000 hab: ${d.y.toFixed(2)}`,
`Total lieux: ${Math.round(Math.pow(d.r / 2, 2))}`,
`Complétion: ${d.completion}%`
];
}
}
}
},
scales: {
x: {
type: 'logarithmic',
title: {
display: true,
text: 'Population (échelle log)'
}
},
y: {
title: {
display: true,
text: 'Commerces pour 1000 habitants'
}
}
}
}
});
}
}
// Attendre le chargement du DOM
document.addEventListener('DOMContentLoaded', () => {
@ -79,6 +179,11 @@ document.addEventListener('DOMContentLoaded', () => {
}
updateCompletionProgress();
// Activer le tri sur tous les tableaux désignés
document.querySelectorAll('.js-sort-table').forEach(table => {
new Tablesort(table);
});
// Focus sur le premier champ texte au chargement
const firstTextInput = document.querySelector('input.form-control');
if (firstTextInput) {
@ -94,10 +199,10 @@ document.addEventListener('DOMContentLoaded', () => {
parseCuisine();
// Tri automatique des tableaux
const tables = document.querySelectorAll('table');
tables.forEach(table => {
table.classList.add('js-sort-table');
});
// const tables = document.querySelectorAll('table');
// tables.forEach(table => {
// table.classList.add('js-sort-table');
// });
// Modifier la fonction de recherche existante
@ -160,4 +265,9 @@ document.addEventListener('DOMContentLoaded', () => {
}, 300);
});
}
enableLabourageForm();
initDashboardChart();
adjustListGroupFontSize('.list-group-item');
});

94
assets/utils.js
View file

@ -71,7 +71,7 @@ function check_validity(e) {
}
}
const genererCouleurPastel = () => {
export const genererCouleurPastel = () => {
const r = Math.floor(Math.random() * 75 + 180);
const g = Math.floor(Math.random() * 75 + 180);
const b = Math.floor(Math.random() * 75 + 180);
@ -163,23 +163,26 @@ function openInPanoramax() {
window.open(panoramaxUrl);
}
function enableLabourageForm() {
export function enableLabourageForm() {
const citySearchInput = document.getElementById('citySearch');
const citySuggestionsList = document.getElementById('citySuggestions');
if (citySearchInput && citySuggestionsList) {
const form = citySearchInput.closest('form');
setupCitySearch('citySearch', 'citySuggestions', function (result_search) {
const labourageBtn = document.querySelector('.btn-labourer');
if (labourageBtn) {
labourageBtn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Chargement...';
labourageBtn.disabled = true;
if (form) {
const labourageBtn = form.querySelector('.btn-labourer');
if (labourageBtn) {
labourageBtn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Chargement...';
labourageBtn.disabled = true;
}
}
window.location.href = getLabourerUrl(result_search);
});
}
}
function setupCitySearch(inputId, suggestionListId, onSelect) {
export function setupCitySearch(inputId, suggestionListId, onSelect) {
const searchInput = document.getElementById(inputId);
const suggestionList = document.getElementById(suggestionListId);
@ -251,14 +254,14 @@ function setupCitySearch(inputId, suggestionListId, onSelect) {
});
}
function getLabourerUrl(obj) {
export function getLabourerUrl(obj) {
if (obj && obj.insee) {
return `/admin/labourer_insee/${obj.insee}`;
return `/admin/labourer/${obj.insee}`;
}
return '#';
}
function handleAddCityFormSubmit(event) {
export function handleAddCityFormSubmit(event) {
event.preventDefault();
const zipCode = document.getElementById('selectedZipCode').value;
if (zipCode && zipCode.match(/^\d{5}$/)) {
@ -268,9 +271,9 @@ function handleAddCityFormSubmit(event) {
}
}
function colorizePercentageCells(selector, color = '154, 205, 50') {
export function colorizePercentageCells(selector, color = '154, 205, 50') {
document.querySelectorAll(selector).forEach(cell => {
const percentage = parseInt(cell.textContent);
const percentage = parseInt(cell.textContent.replace('%', ''), 10);
if (!isNaN(percentage)) {
const alpha = percentage / 100;
cell.style.backgroundColor = `rgba(${color}, ${alpha})`;
@ -278,45 +281,66 @@ function colorizePercentageCells(selector, color = '154, 205, 50') {
});
}
function colorizePercentageCellsRelative(selector, color = '154, 205, 50') {
export function colorizePercentageCellsRelative(selector, color = '154, 205, 50') {
let min = Infinity;
let max = -Infinity;
const cells = document.querySelectorAll(selector);
let maxValue = 0;
cells.forEach(cell => {
const value = parseInt(cell.textContent);
if (!isNaN(value) && value > maxValue) {
maxValue = value;
const value = parseInt(cell.textContent.replace('%', ''), 10);
if (!isNaN(value)) {
min = Math.min(min, value);
max = Math.max(max, value);
}
});
cells.forEach(cell => {
const value = parseInt(cell.textContent);
if (!isNaN(value)) {
const alpha = value / maxValue;
cell.style.backgroundColor = `rgba(${color}, ${alpha})`;
}
});
if (max > min) {
cells.forEach(cell => {
const value = parseInt(cell.textContent.replace('%', ''), 10);
if (!isNaN(value)) {
const ratio = (value - min) / (max - min);
cell.style.backgroundColor = `rgba(${color}, ${ratio.toFixed(2)})`;
}
});
}
}
function adjustListGroupFontSize(selector, minFont = 0.8, maxFont = 1.2) {
const items = document.querySelectorAll(selector);
const count = items.length;
export function adjustListGroupFontSize(selector, minFont = 0.8, maxFont = 1.2) {
const listItems = document.querySelectorAll(selector);
if (listItems.length === 0) return;
let fontSize = maxFont;
const count = listItems.length;
if (count > 0) {
fontSize = Math.max(minFont, maxFont - (count - 5) * 0.05);
}
items.forEach(item => {
listItems.forEach(item => {
item.style.fontSize = fontSize + 'rem';
});
}
window.setupCitySearch = setupCitySearch;
window.handleAddCityFormSubmit = handleAddCityFormSubmit;
window.colorizePercentageCells = colorizePercentageCells;
window.colorizePercentageCellsRelative = colorizePercentageCellsRelative;
export function calculateCompletion(properties) {
let completed = 0;
const total = 7; // Nombre de critères
if (properties.name) completed++;
if (properties['addr:housenumber'] && properties['addr:street']) completed++;
if (properties.opening_hours) completed++;
if (properties.website || properties['contact:website']) completed++;
if (properties.phone || properties['contact:phone']) completed++;
if (properties.wheelchair) completed++;
if (properties.note) completed++;
return {
percentage: total > 0 ? (completed / total) * 100 : 0,
completed: completed,
total: total
};
}
window.check_validity = check_validity;
window.colorHeadingTable = colorHeadingTable;
window.openInPanoramax = openInPanoramax;
window.listChangesets = listChangesets;
window.colorHeadingTable = colorHeadingTable;
window.adjustListGroupFontSize = adjustListGroupFontSize;
window.genererCouleurPastel = genererCouleurPastel;
window.adjustListGroupFontSize = adjustListGroupFontSize;
window.calculateCompletion = calculateCompletion;