fix issue link html

This commit is contained in:
p2405951 2025-06-21 11:27:52 +02:00
parent 2f1b9b2097
commit 699643741c
6 changed files with 148 additions and 372 deletions

View File

@ -8,7 +8,6 @@
font-family: Arial; font-family: Arial;
margin: 40px; margin: 40px;
background-color: whitesmoke; background-color: whitesmoke;
} }
h1 { h1 {
text-align: center; text-align: center;
@ -30,7 +29,7 @@
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
li:hover { li:hover {
background-color:black; background-color: black;
} }
a { a {
text-decoration: none; text-decoration: none;
@ -46,8 +45,7 @@
<body> <body>
<h1>Liste des parcours</h1> <h1>Liste des parcours</h1>
<ul> <ul>
<li><a href="./pages/parcours0.html">azea</a></li> <li><a href="pages/parcours_Bourg.html">Bourg </a></li>
<li><a href="./pages/parcours1.html">parcous123</a></li>
</ul> </ul>
</body> </body>
</html> </html>

View File

@ -169,13 +169,29 @@ void MainWindow::addNewStep()
} }
void MainWindow::exportHTMLMap(int index) void MainWindow::exportHTMLMap(int index)
{ {
std::ofstream file("./pages/parcours" + std::to_string(index) + ".html"); if (index < 0 || index >= path.size()) {
QMessageBox::warning(this, "Erreur", "Index de parcours invalide.");
if (!file.is_open()) {
QMessageBox::warning(this, "Erreur", "Impossible d'ouvrir le fichier.");
return; return;
} }
Path* p = path[index];
if (!p) {
QMessageBox::warning(this, "Erreur", "Le parcours sélectionné est nul.");
return;
}
QString safeName = p->getName().simplified().replace(" ", "_");
std::string fileName = "./pages/parcours_" + safeName.toStdString() + ".html";
std::ofstream file(fileName);
if (!file.is_open()) {
QMessageBox::warning(this, "Erreur", "Impossible d'ouvrir le fichier HTML.");
return;
}
// Début HTML
file << R"(<!DOCTYPE html> file << R"(<!DOCTYPE html>
<html lang="fr"> <html lang="fr">
<head> <head>
@ -218,8 +234,7 @@ void MainWindow::exportHTMLMap(int index)
word-break: break-word; word-break: break-word;
white-space: normal; white-space: normal;
max-width: 90%; max-width: 90%;
} }
#fiche li { #fiche li {
white-space: normal; white-space: normal;
overflow-wrap: break-word; overflow-wrap: break-word;
@ -248,26 +263,42 @@ void MainWindow::exportHTMLMap(int index)
</style> </style>
</head> </head>
<body> <body>
<h1>Fiche du parcours</h1> <a href="../index.html"><button>Revenir en arrière</button></a>
<div id="container"> <h1>Fiche du parcours</h1>
<div id="map"></div> <div id="container">
<div id="fiche"> <div id="map"></div>
<div id="fiche">
)"; )";
if (currentPath) { // Infos du parcours
Path* p = currentPath;
file << "<h2>" << p->getName().toStdString() << "</h2>\n"; file << "<h2>" << p->getName().toStdString() << "</h2>\n";
file << "<p><strong>Ville :</strong> " << p->getCity().toStdString() << "</p>\n"; file << "<p><strong>Ville :</strong> " << p->getCity().toStdString() << "</p>\n";
file << "<p><strong>Département :</strong> " << p->getDepartement() << "</p>\n"; file << "<p><strong>Département :</strong> " << p->getDepartement() << "</p>\n";
file << "<p><strong>Difficulté :</strong> " << p->getDifficulty() << "</p>\n"; file << "<p><strong>Difficulté :</strong> " << p->getDifficulty() << "</p>\n";
file << "<p><strong>Durée (heures) :</strong> " << p->getDuration() << "</p>\n"; file << "<p><strong>Durée (heures) :</strong> " << p->getDuration() << "</p>\n";
file << "<p><strong>Longueur (km) :</strong> " << p->getLength() << "</p>\n"; file << "<p><strong>Longueur (km) :</strong> " << p->getLength() << "</p>\n";
if (!p->getImage().isEmpty()) { if (!p->getImage().isEmpty()) {
file << "<img src=\"" << p->getImage().toStdString() << "\">\n"; QString imagePath = p->getImage();
QFileInfo fileInfo(imagePath);
QString imageName = fileInfo.fileName();
QString destPath = "./pages/images/" + imageName;
// Crée le dossier images sil nexiste pas
QDir().mkpath("./pages/images");
// Copie limage dans le dossier pages/images
QFile::copy(imagePath, destPath);
// Utilisation dans le HTML
file << "<img src=\"images/" << imageName.toStdString() << "\">\n";
} }
int stepNum = 1; int stepNum = 1;
for (const Step& s : p->getStep()) { for (const Step& s : p->getStep()) {
file << "<h3>Étape " << stepNum << "</h3>\n"; file << "<h3>Étape " << stepNum << "</h3>\n";
const QList<QString> persos = s.getPersonnage(); const QList<QString> persos = s.getPersonnage();
const QList<QString> textes = s.getTexte(); const QList<QString> textes = s.getTexte();
@ -289,30 +320,28 @@ void MainWindow::exportHTMLMap(int index)
stepNum++; stepNum++;
} }
}
file << R"( file << R"(
</div> </div>
</div> </div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script> <script>
var map = L.map('map').setView([45.5, 1.5], 10); // Vue centrée var map = L.map('map').setView([45.5, 1.5], 10);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors' attribution: '© OpenStreetMap contributors'
}).addTo(map); }).addTo(map);
)"; )";
if (!path.isEmpty() && path[0]) { // Ajout des étapes sur la carte
Path* p = path[0]; stepNum = 1;
int stepNum = 1;
for (const Step& s : p->getStep()) { for (const Step& s : p->getStep()) {
float lat = s.getLatitude(); float lat = s.getLatitude();
float lon = s.getLongitude(); float lon = s.getLongitude();
QList<QString> personnages = s.getPersonnage(); QList<QString> personnages = s.getPersonnage();
QList<QString> textes = s.getTexte(); QList<QString> textes = s.getTexte();
QString popupHtml = "<b>Étape " + QString::number(stepNum) + "</b><br>"; QString popupHtml = "<b>Étape " + QString::number(stepNum) + "</b><br>";
if (!personnages.isEmpty()) { if (!personnages.isEmpty()) {
popupHtml += "<b>Personnages :</b><ul>"; popupHtml += "<b>Personnages :</b><ul>";
@ -337,9 +366,7 @@ void MainWindow::exportHTMLMap(int index)
file << "var latlngs = [\n"; file << "var latlngs = [\n";
for (const Step& s : p->getStep()) { for (const Step& s : p->getStep()) {
float lat = s.getLatitude(); file << " [" << s.getLatitude() << ", " << s.getLongitude() << "],\n";
float lon = s.getLongitude();
file << " [" << lat << ", " << lon << "],\n";
} }
file << "];\n"; file << "];\n";
@ -351,11 +378,7 @@ void MainWindow::exportHTMLMap(int index)
opacity: 0.7 opacity: 0.7
}).addTo(map); }).addTo(map);
map.fitBounds(polyline.getBounds()); map.fitBounds(polyline.getBounds());
)"; </script>
}
file << R"(
</script>
</body> </body>
</html> </html>
)"; )";
@ -364,6 +387,7 @@ void MainWindow::exportHTMLMap(int index)
void MainWindow::loadImage(QString fileName) { void MainWindow::loadImage(QString fileName) {
QString ext[] = {"png", "jpeg", "jpg"}; QString ext[] = {"png", "jpeg", "jpg"};
@ -594,14 +618,14 @@ void MainWindow::on_stepNumber_valueChanged(int arg1)
void MainWindow::on_validateBtn_clicked() void MainWindow::on_validateBtn_clicked()
{ {
currentPath->setName(ui->titleEdit->text()); this->currentPath->setName(ui->titleEdit->text());
currentPath->setCity(ui->locEdit->text()); this->currentPath->setCity(ui->locEdit->text());
currentPath->setImage(ui->imagePath->text()); this->currentPath->setImage(ui->imagePath->text());
currentPath->setLength(ui->lengthSpin->value()); this->currentPath->setLength(ui->lengthSpin->value());
currentPath->setDifficulty(ui->diffSpin->value()); this->currentPath->setDifficulty(ui->diffSpin->value());
currentPath->setDuration(ui->durationSpin->value()); this->currentPath->setDuration(ui->durationSpin->value());
currentPath->getStep()[ui->stepNumber->value()-1].setTitle(ui->stepTitle->text()); this->currentPath->getStep()[ui->stepNumber->value()-1].setTitle(ui->stepTitle->text());
currentPath->getStep()[ui->stepNumber->value()-1].setResponse(ui->responseSpin->value()); this->currentPath->getStep()[ui->stepNumber->value()-1].setResponse(ui->responseSpin->value());
} }
void MainWindow::loadAndExportPaths(QStringList fichiers) { void MainWindow::loadAndExportPaths(QStringList fichiers) {

BIN
pages/images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 168 KiB

View File

@ -1,124 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Carte du parcours</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: whitesmoke;
}
#container {
display: flex;
gap: 20px;
}
#map {
height: 600px;
width: 60%;
border-radius: 5%;
border: 1px solid #aaa;
}
#fiche {
padding-right:20px;
width: 40%;
max-height: 600px;
overflow-y: auto;
border: 1px solid #aaa;
padding: 10px;
box-sizing: border-box;
background-color:#095228;
border-radius: 5%;
}
#fiche ul {
padding-left: 20px;
list-style-type: disc;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-word;
white-space: normal;
max-width: 90%;
}
#fiche li {
white-space: normal;
overflow-wrap: break-word;
}
body h1 {
display:flex;
align-items:center;
justify-content:center;
text-align: center;
color: black;
font-style: bold;
margin-bottom: 20px;
background-color:brown;
border-radius:12px;
height: 75px;
}
#fiche h2, #fiche h3, #fiche p, #fiche li {
color: white;
}
#fiche img {
max-width: 100%;
height: auto;
margin-top: 10px;
border-radius: 5px;
}
</style>
</head>
<body>
<h1>Fiche du parcours</h1>
<div id="container">
<div id="map"></div>
<div id="fiche">
<h2>parcous123</h2>
<p><strong>Ville :</strong> Bourg en bresse</p>
<p><strong>Département :</strong> 0</p>
<p><strong>Difficulté :</strong> 2</p>
<p><strong>Durée (heures) :</strong> 2.3</p>
<p><strong>Longueur (km) :</strong> 17.3</p>
<img src="data/parcours1.png">
<h3>Étape 1</h3>
<p><strong>Personnages :</strong></p>
<ul><li>Quentin</li>
</ul>
<p><strong>Dialogues :</strong></p>
<ul><li>ok c'est cool</li>
</ul>
<h3>Étape 2</h3>
<p><strong>Personnages :</strong></p>
<ul><li>Quentin</li>
</ul>
<p><strong>Dialogues :</strong></p>
<ul><li>ok c'est cool</li>
</ul>
</div>
</div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script>
var map = L.map('map').setView([45.5, 1.5], 10); // Vue centrée
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
L.marker([0, 0]).addTo(map).bindPopup("<b>Étape 1</b><br>");
var latlngs = [
[0, 0],
];
var polyline = L.polyline(latlngs, {
color: 'purple',
weight: 2,
dashArray: '10, 10',
opacity: 0.7
}).addTo(map);
map.fitBounds(polyline.getBounds());
</script>
</body>
</html>

View File

@ -1,124 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Carte du parcours</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: whitesmoke;
}
#container {
display: flex;
gap: 20px;
}
#map {
height: 600px;
width: 60%;
border-radius: 5%;
border: 1px solid #aaa;
}
#fiche {
padding-right:20px;
width: 40%;
max-height: 600px;
overflow-y: auto;
border: 1px solid #aaa;
padding: 10px;
box-sizing: border-box;
background-color:#095228;
border-radius: 5%;
}
#fiche ul {
padding-left: 20px;
list-style-type: disc;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-word;
white-space: normal;
max-width: 90%;
}
#fiche li {
white-space: normal;
overflow-wrap: break-word;
}
body h1 {
display:flex;
align-items:center;
justify-content:center;
text-align: center;
color: black;
font-style: bold;
margin-bottom: 20px;
background-color:brown;
border-radius:12px;
height: 75px;
}
#fiche h2, #fiche h3, #fiche p, #fiche li {
color: white;
}
#fiche img {
max-width: 100%;
height: auto;
margin-top: 10px;
border-radius: 5px;
}
</style>
</head>
<body>
<h1>Fiche du parcours</h1>
<div id="container">
<div id="map"></div>
<div id="fiche">
<h2>parcous123</h2>
<p><strong>Ville :</strong> Bourg en bresse</p>
<p><strong>Département :</strong> 0</p>
<p><strong>Difficulté :</strong> 2</p>
<p><strong>Durée (heures) :</strong> 2.3</p>
<p><strong>Longueur (km) :</strong> 17.3</p>
<img src="data/parcours1.png">
<h3>Étape 1</h3>
<p><strong>Personnages :</strong></p>
<ul><li>Quentin</li>
</ul>
<p><strong>Dialogues :</strong></p>
<ul><li>ok c'est cool</li>
</ul>
<h3>Étape 2</h3>
<p><strong>Personnages :</strong></p>
<ul><li>Quentin</li>
</ul>
<p><strong>Dialogues :</strong></p>
<ul><li>ok c'est cool</li>
</ul>
</div>
</div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script>
var map = L.map('map').setView([45.5, 1.5], 10); // Vue centrée
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
L.marker([0, 0]).addTo(map).bindPopup("<b>Étape 1</b><br>");
var latlngs = [
[0, 0],
];
var polyline = L.polyline(latlngs, {
color: 'purple',
weight: 2,
dashArray: '10, 10',
opacity: 0.7
}).addTo(map);
map.fitBounds(polyline.getBounds());
</script>
</body>
</html>

18
web.cpp
View File

@ -24,7 +24,6 @@ void Web::siteHtml()
font-family: Arial; font-family: Arial;
margin: 40px; margin: 40px;
background-color: whitesmoke; background-color: whitesmoke;
} }
h1 { h1 {
text-align: center; text-align: center;
@ -46,7 +45,7 @@ void Web::siteHtml()
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
li:hover { li:hover {
background-color:black; background-color: black;
} }
a { a {
text-decoration: none; text-decoration: none;
@ -64,16 +63,18 @@ void Web::siteHtml()
<ul> <ul>
)"; )";
int index = 0;
for (const Path* p : list) { for (const Path* p : list) {
QString fileName = QString("parcours%1.html").arg(index); if (!p) continue;
QString name = p->getName();
file << " <li><a href=\"./pages/" // Nom de fichier sécurisé
QString safeName = p->getName().simplified().replace(" ", "_");
QString fileName = "parcours_" + safeName + ".html";
file << " <li><a href=\"pages/"
<< fileName.toStdString() << fileName.toStdString()
<< "\">" << "\">"
<< name.toStdString() << p->getName().toStdString()
<< "</a></li>\n"; << "</a></li>\n";
++index;
} }
file << R"( </ul> file << R"( </ul>
@ -83,3 +84,4 @@ void Web::siteHtml()
file.close(); file.close();
} }