ren.we
Sep 06, 2017
view1792
view9
0
Goto Top

PHP Gallery mit Kalenderfunktion

GermansolvedQuestionPHPDevelopment
Hallo,

wir sind im besitz einer zwar älteren aber dennoch funktionsfähigen Webcam 214 PTZ von AXIS,
diese sendet Bilder per FTP an unseren Webspace.
Viele meiner Segelfreunde fragten ob es nicht möglich wäre ein Bildarchiv mit einer Kalenderfunktion zu erstellen.
Leider sind meine Kenntnisse dahingehend begrenzt was die Programmierung/Erstellung eines solchen Quellcodes angeht.

Gewünscht wird sich etwas wie dieses:
www.heinzenberg-wintersport.ch/webcam/bildarchiv.php?WT=0&PT=4

Das Archiv soll dazu dienen um nach Unwettern zu sehen ob mit den Booten alles in Ordnung ist. Daher auch die benötigte Kalenderfunktion.

Über hilfreiche Tipps zur Erstellung wäre ich sehr dankbar. Oder falls jemand zufällig weiß ob und wo es so etwas geben könnte.

Die Anzeige der einzelnen Bilder konnte ich bereits lösen.
<ul id="galerie">  

<?php
// Ordnername 
$ordner = "webcam"; //auch komplette Pfade möglich ($ordner = "download/files";)  
 
// Ordner auslesen und Array in Variable speichern
$allebilder = scandir($ordner, 1); // Sortierung A-Z
// Sortierung Z-A mit scandir($ordner, 1)               
 
// Schleife um Array "$alledateien" aus scandir Funktion auszugeben 
// Einzeldateien werden dabei in der Variabel $datei abgelegt
foreach ($allebilder as $bild) {
 
 // Zusammentragen der Dateiinfo
 $bildinfo = pathinfo($ordner."/".$bild);   
 //Folgende Variablen stehen nach pathinfo zur Verfügung
 // $dateiinfo['filename'] =Dateiname ohne Dateiendung  *erst mit PHP 5.2 
 // $dateiinfo['dirname'] = Verzeichnisname 
 // $dateiinfo['extension'] = Dateityp -/endung 
 // $dateiinfo['basename'] = voller Dateiname mit Dateiendung 
 
 // Größe ermitteln für Ausgabe
 $size = ceil(filesize($ordner."/".$bild)/1024);   
 //1024 = kb | 1048576 = MB | 1073741824 = GB
 
 // scandir liest alle Dateien im Ordner aus, zusätzlich noch "." , ".." als Ordner 
 // Nur echte Dateien anzeigen lassen und keine "Punkt" Ordner 
 // _notes ist eine Ergänzung für Dreamweaver Nutzer, denn DW legt zur besseren Synchronisation diese Datei in den Orndern ab
 // Thumbs.db ist eine Ergänzung unsichtbare Dateiergänzung die von ACDSee kommt
 // um weitere ungewollte Dateien von der Anzeige auszuschließen kann man die if Funktion einfach entsprechend erweitern
 if ($bild != "." && $bild != ".."  && $bild != "_notes" && $bildinfo['basename'] != "Thumbs.db") {   
 ?>
    <li>
        <a href="<?php echo $bildinfo['dirname']."/".$bildinfo['basename'];?>">  
        <img src="<?php echo $bildinfo['dirname']."/".$bildinfo['basename'];?>" width="140" alt="Vorschau" /></a>   
        <span><?php echo $bildinfo['filename']; ?> (<?php echo $size ; ?>kb)</span>  
    </li>
<?php
 };
 };
?>



Vielen Dank
René
comment-contentCommentShareShare
Share on Facebook Share on Twitter Share on Reddit Share on Linkedin

Content-Key: 348339

Url: https://administrator.de/contentid/348339

Printed on: April 23, 2024 at 07:04 o'clock

9 Comments
Latest comment
Goto Top
Mitglied: 133883
133883 Sep 06, 2017 updated at 13:31:12 (UTC)
Goto Top
Gewünscht wird sich etwas wie dieses:
Wo wir schon beim Wünschen sind, ich wünsche mir zum Kaffee ein Stück Kuchen... :-P
Man oh man ...
heart1
Member: derinderinderin
derinderinderin Sep 06, 2017 at 13:28:18 (UTC)
Goto Top
Hallo,

Am einfachsten wäre es natürlich, wenn du in der Webcam einstellen könntest, dass die Bilder Tagweise in Ordnern abgelegt werden.
Dann müsstest du einfach nur ein simples Script schreiben, welches die erstellten Verzeichnisse Ausgibt und dein Bilder Script den Inhalt des ausgewählten Ordners anzeigt.

Wenn dies nicht geht, müsstest du ggf. mit Datenbankeinträgen arbeiten. Wobei du hierbei ganz sicher erweiterte Kenntnisse in HTML/PHP/SQL bräuchtest.

gruß derinderinderin
Member: ren.we
ren.we Sep 06, 2017 at 13:44:03 (UTC)
Goto Top
Vielen Dank für den Tipp die Bilder tagweise in Ordnern abzulegen. Leider habe ich keine passende Einstellung finden können.
Die Bilder werden/können wohl nur automatisch mit Datumstempel abgespeichert werden.

auf dem FTP sieht es dann so aus:

image17-09-06_15-32-51-83.jpg
image17-09-06_15-27-48-40.jpg
image17-09-06_15-22-43-84.jpg
image17-09-06_15-17-42-23.jpg
Mitglied: 133883
133883 Sep 06, 2017 updated at 13:51:49 (UTC)
Goto Top
Packe einfach alle Bildnamen in einer Schleife mit Datum in ein Assoziatives Array und das filterst du dann einfach mit array_search("06.09.2017", array_column($array,"Datum"))
Schon hast du alle Bilder des gewünschten Tages.
Oder per Regex "preg_match" auf den Dateinamen wenn das Datum im Dateinamen steht.

Feddich.
Member: derinderinderin
derinderinderin Sep 06, 2017 at 14:09:54 (UTC)
Goto Top
Wie Oneplus es beschrieben hat, sollte es auch gehen. Jedoch musst du hier auf das Datumformat achten face-wink
In deinem Fall ist es das JJ-MM-DD Format.
Member: ren.we
ren.we Sep 06, 2017 at 14:11:38 (UTC)
Goto Top
nochmals Danke...

Ich werde mich dazu mal schlau (versuchen) machen und versuchen etwas dazu zu lernen.
Aber dennoch benötige ich vermutlich für die Auswahl der Tage einen Datepicker in etwas dieser Form:

<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">  
  <link rel="stylesheet" href="/resources/demos/style.css">  
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>  
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>  
  <script>
  $( function() {
    $( "#datepicker" ).datepicker();  
  } );
  </script>
</head>
<body>
 
<p>Archiv-Datum: <input type="text" id="datepicker"></p>


oder liege ich da jetzt falsch und es wäre doppelt?
Das Array gibt mir doch dann nur die zu dem Datum im Datepicker ausgewählten Bilder aus.
Member: derinderinderin
derinderinderin Sep 07, 2017 at 07:09:04 (UTC)
Goto Top
ich versuch dir mal was zu bauen....
Member: derinderinderin
Solution derinderinderin Sep 07, 2017 at 08:16:10 (UTC)
Goto Top
So, dieses Script nimmt die Auswahl deines Datum Picker und durchsucht ein Array, welches mit den Daten eines Verzeichnisses
gefüllt wurde.

Das Script läuft über die Struktur:
./script.php
./bilder/<deineBilder>

Wenn das Script im gleichen Verzeichnis liegt, dann musst du die $dir variable anpassen.

Ist kein Profi Script, sollte aber funktionieren face-wink Layout ist deine Sache face-wink

<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">  
  <link rel="stylesheet" href="/resources/demos/style.css">  
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>  
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>  
  <script>
  $( function() {
    $( "#datepicker" ).datepicker();  
  } );
  </script>
</head>
<body>
    
<?php
 
echo "<form action='".$_SERVER['SCRIPT_NAME']."' method='post'>";  
echo "<p>Archiv-Datum: <input type='text' name='datum' id='datepicker'></p>";  
echo "<input type='submit' name='such_button' value='Bilder anzeigen'>";  
echo "<br><br>";  

If(isset($_POST['such_button'])){  
	
	//Suchstring zusammensetzten, damit es zum Dateinamen passt.
	$datum_tag = substr($_POST['datum'], 3, 2);  
	$datum_monat = substr($_POST['datum'], 0, 2);  
	$datum_jahr = substr($_POST['datum'], 8, 2);  
	
	
	//Such String zusammensetzen
	$such_datum = $datum_jahr."-".$datum_monat."-".$datum_tag;  
	
	//Das auszulesende Verzeichnis
	$dir = "./bilder/";  

	//Das Ziel-Array
	$file_array = Array();

	//Wenn das Verzeichnis existiert...
	if(is_dir($dir))    {
		//...öffne das Verzeichnis
		$handle = opendir($dir);
		//Wenn das Verzeichnis geöffnet werden konnte...
		if(is_resource($handle))    {
			//...lese die enthaltenen Dateien aus,...
			while($file = readdir($handle))    {
				//...prüfe ob es Directory-Verweise sind...
				if($file != "." && $file != "..")  
					//...und schreibe sie in das Ziel-Array
					array_push($file_array, $file);
			}
		}else{
			echo "Das &Ouml;ffnen des Verzeichnisses ist fehlgeschlagen";  
		}
	}else{
		echo "Das Verzeichnis existiert nicht";  
	}
	
		
	
	//Array nach dem Datum durchsuchen und in neuen Array abspeichern
	$i = 0;
	foreach ($file_array as $key => $value) {
	   $pos = strpos ($value, $such_datum);
	   if ($pos !== false) {
		$bilder_gefunden[$i]['key'] = $key;  
		$i++;
	   }
	} 
	
	//Wenn keine Bilder gefunden wurden, abbruch mit Ausgabe
	If(!isset($bilder_gefunden)){
		echo "Keine Bilder vorhanden!";  
		exit();
	}
	
	echo "Bilder vom ".$datum_tag.".".$datum_monat.".".$datum_jahr;  
	echo "<br>";  
	//Ausgabe der gefundenen Bilder mit Link
	for($i=0;$i<count($bilder_gefunden);$i++){
		$key = $bilder_gefunden[$i]['key'];  
		//echo $file_array[$key];
		echo "<a href='".$dir.$file_array[$key]."'><img src='".$dir.$file_array[$key]."' width='250px'></a>";  
	}
	
}
        
        
?>
Member: ren.we
ren.we Sep 07, 2017 at 08:48:08 (UTC)
Goto Top
Wahnsinn, vielen vielen Dank!!

Das ist genau auf den Punkt gebracht. Mehr muss und soll es nicht können müssen.
Werde Versuchen die Darstellung über eine Lightbox zu lösen, dann können die Bilder einfach durchsucht werden.

Danke auch für die Kommentare im Quelltext... so kann jemand wir ich von Leuten mit Erfahrung lernen.


webcam
GermansolvedQuestionPHPDevelopment
Hotly discussed
gleixnerdCheck of ZFW Firewallgleixnerd - 5 CommentsjstrickerWireguard VPN on UDM Pro behind Fritzbox - Handshake did not completejstricker - 3 CommentsAlexWishaHow to set up and configure a Linux GRE tunnelAlexWisha - 3 CommentsDaniEnd of Support dates for Office 2016, 2019 Apps und Productivity ServersDani - 1 Comment