wat gaat hier mis?
Ik ben nu een tijdje aan het klooien met een image gallery. Ik heb een tooltje ontdekt waarmee ik AI kan gebruiken om de code te genereren waarna ik het e.e.a. kan aanpassen om het naar wens te maken. Ik ben een eind gekomen, alle probeersels gingen goed, maar met de gallery gaat het niet en ik zie niet wat er nu misgaat. Het lijkt allemaal goed te staan.
Slag om de arm, ik ben lang geleden webdesigner geweest maar werkte op de afdeling met programmeurs. Ik heb dus wel wat inzicht als het gaat om de code maar ben (nog) absoluut geen programmeur. Het ligt dus ongetwijfeld aan mij(n code) maar wil graag leren.
Kan iemand me vertellen wat hier misgaat?
Mvg Mark
PS: PHP staat aan op de server
www.markpaulussen.com/test2
---------------------------------
php
--------------------------------
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
$thumbnailDir = 'thumbnails';
$fullSizeDir = 'fullsize';
$images = array_diff(scandir($thumbnailDir), array('..', '.'));
// Sort the files by natural order and in descending order to show newest first
usort($images, function($a, $b) {
return strnatcmp($b, $a); // Reverse order
});
foreach ($images as $image) {
// Assuming file names are the same in both directories
$fullImagePath = $fullSizeDir . '/' . $image;
$thumbnailPath = $thumbnailDir . '/' . $image;
echo '<div class="thumbnail">';
echo '<img src="' . $thumbnailPath . '" alt="Thumbnail of ' . $image . '" onclick="openPopup(\'' . $fullImagePath . '\')" />';
echo '</div>';
}
?>
$thumbnailDir = 'thumbnails';
$fullSizeDir = 'fullsize';
$images = array_diff(scandir($thumbnailDir), array('..', '.'));
// Sort the files by natural order and in descending order to show newest first
usort($images, function($a, $b) {
return strnatcmp($b, $a); // Reverse order
});
foreach ($images as $image) {
// Assuming file names are the same in both directories
$fullImagePath = $fullSizeDir . '/' . $image;
$thumbnailPath = $thumbnailDir . '/' . $image;
echo '<div class="thumbnail">';
echo '<img src="' . $thumbnailPath . '" alt="Thumbnail of ' . $image . '" onclick="openPopup(\'' . $fullImagePath . '\')" />';
echo '</div>';
}
?>
---------------------------------
javascript
---------------------------------
function openPopup(fullImagePath) {
const popup = document.getElementById('popup');
const popupImg = document.getElementById('popup-img');
popup.style.display = 'flex'; // Use 'flex' to center the image
popupImg.src = fullImagePath;
}
function closePopup() {
const popup = document.getElementById('popup');
if (event.target === popup) {
popup.style.display = 'none';
}
}
window.onclick = closePopup;
Zet de foutafhandeling eens aan in PHP.
Toevoeging op 18/04/2024 19:53:54:
Als ik Google op foutafhandeling PHP dan kom ik op zaken die controleren of dingen ingevuld zijn. Zoals bij een formulier maar dat bedoel je denk ik niet.
Code (php)
1
2
3
4
5
2
3
4
5
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
?>
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
?>
In de broncode staat:
Correctie: Je bestand heet index.html, maak daar eens index.php van.
Gewijzigd op 18/04/2024 21:49:12 door - SanThe -
Op een telefoon is het jammer dat je die source niet kan zien... :-P
Gewijzigd op 18/04/2024 21:52:49 door - Ariën -
Mark Paulussen op 18/04/2024 19:06:09:
[..] Ik heb een tooltje ontdekt waarmee ik AI kan gebruiken om de code te genereren waarna ik het e.e.a. kan aanpassen [..] en ik zie niet wat er nu misgaat.
Op deze manier leren programmeren is een ontzettend lange weg, terwijl je het ook nog eens nooit helemaal onder de knie zal krijgen zo.
Ja, leren programmeren is een kwestie van doen en veel 'kilometers' maken, maar dat gaat beter op een 'verharde weg' dan door de 'blubber' van AI.
Dus kan je beter een goed leerboek erbij pakken eventueel aangevuld met tutorials, zoals deze.
Het belangrijkste verschil is dat je er zelf energie in moet steken, en niet lui kunt zijn met een of andere AI-tool. In het ene geval beklijft de intellectuele materie, in het andere geval .. niet.
https://www.yeschat.ai/ru/gpts-9t557Muv9r6-Responsive-HTML5-Gallery-Visuals-That-Adapt
Ad Fundum, dit is de tool die ik heb gebruikt. Ik leer daar veel van. Trial and error op een interactieve manier, dat werkt goed voor mij. Beter dan met een boek, al gebruik ik die dan wel weer voor naslag. Lastig is dan wel dat je soms niet weet wat je niet weet. Daar is een forum als dit weer een uitkomst voor. Lui ben ik zeker niet. Jammer dat je me die geeft omdat ik anders leer dan jij. Mensen leren niet allemaal hetzelfde. Ik ben docent dus ik kan het weten, misschien heb jij die ervaring nog niet maar geloof me dat is zo.
Mark Paulussen op 19/04/2024 10:21:56:
Ah! Juist dat is hem, html moet ook php zijn. En die code voor foutafhandeling heb ik er nu in gezet, waar kan ik zien wat dat doet?
Op php.net, de officiële website.
https://php.net/ini_set
https://php.net/error_reporting
https://php.net/include
Elke functie kan je daar vinden.
Je zal met die code dan in ieder geval ook fouten zien, als die uit zouden zijn geschakeld. Maar dat was het probleem overigens niet. Maar het kan zeker geen kwaad om dit tijdens het ontwikkelen aan te zetten, en tijdens het 'live' gaan weer uit.
In jouw situatie werd PHP niet uitgevoerd omdat het een .html bestand was.
Gewijzigd op 19/04/2024 11:07:14 door - Ariën -
Ariën, waar zouden die errors zichtbaar moeten zijn? Ik heb die code toegevoegd en alles online gezet maar snap niet waar die eventuele errors zichtbaar zouden moeten zijn. Of moet ik daar een lokale testomgeving voor inrichten o.i.d.
Wat betreft de opmerking over AI snap ik Ad Fundum wel. AI kan handig zijn op het moment dat je zelf al een bepaalde basiskennis hebt. AI kan je dan iets voorschotelen waarop je zelf kunt voortborduren. Op basis van reeds opgedane kennis kun je dan bepalen of datgene wat wordt voorgeschoteld bruikbaar is, maar bijvoorbeeld ook of het aan de benodigde veiligheidseisen voldoet.
Wat betreft je opmerking dat je zelf docent bent ... ik neem aan dat je dat niet bent geworden met behulp van AI, maar dat je daar een opleiding voor hebt gevolgd? Misschien iets om over na te denken ... ;-)
Er zijn zat mensen die het heel leuk vinden om bestaande auto's te tweaken, om te bouwen of te restaureren. Ik schat nu Ad Fundum even hoog in maar het is nu net alsof een techneut uit de autotechniek zegt tegen een tinkeraar dat hij lui is omdat hij de hts autotechniek niet heeft gevolgd. Ik heb de wens niet om php programmeur te worden maar vind het wel interessant om mee te klooien. Maargoed, hij mag me verder lui vinden hoor.
Ik ben in ieder geval blij met de hulp! Kan ik weer verder klooien en ik heb wat geleerd :-)
Super bedankt..
PS: Ja de code staat bovenin:
Code (php)
1
2
3
4
5
2
3
4
5
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
?>
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Responsive Image Gallery</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="gallery">
</div>
<div id="popup" style="display:none;" onclick="closePopup()"> <img id="popup-img" src="" alt="Large image">
<p>Image description and details here.</p>
<button onclick="window.location.href='more-info.html';">More Information</button>
</div>
<script src="script.js"></script>
</body>
</html>
Betreffende je metafoor. Ik kan ook op YouTube een tutorial zoeken hoe ik remmen van een auto moet verwisselen. Ik kan zelfs diverse tutorials lezen gedurende een paar dagen. Noem mij maar lui! Vervolgens sta ik bij jou op de stoep, want ik heb gehoord dat jouw remmen van je auto niet heel adequaat meer functioneren. Maar geen nood, ik pak m'n kruk die ik zojuist bij de bouwmarkt heb gekocht. Ik plaats 'm onder je auto en ga vervolgens sleutelen aan je remmen. Precies zoals ik heb gezien in alle YouTube tutorials die ik heb bekeken. Zeg jij het maar ... als ik klaar ben met sleutelen, ga jij dan met een goed gevoel in je auto zitten?
Wat ik wil zeggen is dat je om te kunnen programmeren heel veel kilometers moet maken. Zelfs programmeurs die al heel veel kilometers hebben gemaakt, komen nog regelmatig dingen tegen die beter kunnen op basis van nieuw opgedane ervaring.
Code schrijven is niet een kwestie van ergens een stukje code kopiëren en ergens anders neerplakken. Programmeren is een vak. Iedereen kan een paar alinea's tekst schrijven, maar dat maakt je nog geen professioneel auteur. Velen kunnen autorijden, maar het maakt je nog geen professioneel chauffeur enz.
En natuurlijk, zolang het een beetje hobby is, is het allemaal nog niet zo heel erg. Maar ga je je code live zetten en blijkt die lek te zijn en komen er klantgegevens op straat te liggen, dan wordt het allemaal net even wat anders.
Anyhow ... lang verhaal kort. Een stukje code knippen/plakken (wat AI in feite is) heeft weinig met programmeren te maken omdat het grotere verband mist. Het kan dus zeker geen kwaad om wat boeken aan te schaffen, zodat je wat basiskennis opdoet, van waaruit je kunt voortborduren.
Dat is lui, en kortzichtig van zichzelf.
Maar tegelijkertijd, als het niet werkt en je wilt het verbeteren bewandel je uiteindelijk een veel langere weg, en dat is verre van lui.
Ik heb gesteld dat je om iets te leren niet lui kunt zijn met een AI-tool, dat is algemeen bedoeld.
Te meer omdat ik de vragensteller persoonlijk helemaal niet ken.