Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [PHP][JavaScript] Jak posortować automatyczną galerie., Jak wykonać sortowanie zdjęć w galerii
mirkolo
post 5.11.2014, 11:05:09
Post #1





Grupa: Zarejestrowani
Postów: 5
Pomógł: 0
Dołączył: 11.05.2007

Ostrzeżenie: (0%)
-----

Naskrobałem kiedyś z różnymi pomocami mały skrypt który tworzy prostą galerię na podstawie plików w katalogu.
Skrypt działa ładnie, z jednym małym poroblemem, zdjęcia są nie posortowane.
Na poczatku mi to nie przeszkadzało bo galeria zawierała zdjecia bez chronologi.
teraz chce stworzyć galerię która będzie chronologiczna.
nie wiem jak to poprawić.. :-( moje poprawki dają mizerne efekty.

Czy da się to jakoś prosto zrobić unikając zmiany wszystkiego na MySQL?


[PHP] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
  5. <head>
  6. 	<title>Galeria z budowy</title>
  7. 	<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
  8. 	<script type="text/javascript" src="javascript/highslide-with-gallery.js"></script>
  9. 	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
  10. <script type="text/javascript">
  11. 	hs.graphicsDir = 'javascript/images/';
  12. 	hs.align = 'center';
  13. 	hs.transitions = ['expand', 'crossfade'];
  14. 	hs.outlineType = 'rounded-white';
  15. 	hs.fadeInOut = true;
  16. 	//hs.dimmingOpacity = 0.75;
  17.  
  18. 	// Add the controlbar
  19. 	if (hs.addSlideshow) hs.addSlideshow({
  20. 		//slideshowGroup: 'group1',
  21. 		interval: 5000,
  22. 		repeat: false,
  23. 		useControls: true,
  24. 		fixedControls: 'fit',
  25. 		overlayOptions: {
  26. 			opacity: .75,
  27. 			position: 'bottom center',
  28. 			hideOnMouseOut: true
  29. 		}
  30. 	});
  31. </script>
  32.  
  33. </head>
  34. <body  bgcolor="#EEEEEE">
  35.  
  36. <table align="center" border="0" bgcolor="cccccc">
  37.  
  38. 	<tr><td colspan="3"><?php include ('menu.php') ?></td></tr>
  39. 	<tr><td colspan="3" align="center"><h4>Galeria w trakcie produkcji</h4></td></tr>
  40.   <tr><td colspan="3" align="center">
  41.  
  42. <div id="galeria">
  43. <ul>
  44. <?php
  45. $katalog = "obrazki";
  46. $katalogminiaturki = "miniaturki";
  47. $galeria = opendir( $katalog );
  48. while ( $zdjecie = readdir( $galeria ) ){
  49.  
  50. $odczyt = pathinfo( $katalog.'/'.$zdjecie );
  51.   if ( $odczyt['extension']  == 'jpg' ){
  52.  
  53.     echo '<li><a href="'.$katalog.'/'.$zdjecie.'" class="highslide" onclick="return hs.expand(this)" title="Zdjęcie: '.$zdjecie.'"><img width="100" height="78" src="'.$katalogminiaturki.'/'.$zdjecie.'" alt="Zdjęcie: '.$zdjecie.'" /></a></li>';
  54.   }
  55.  
  56. }
  57. closedir($galeria);
  58. ?>
  59. </ul>
  60. </div>
  61.  
  62. </td></tr>
  63. </table>
  64. </body>
  65. </html>
[PHP] pobierz, plaintext
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 5)
grzes999
post 5.11.2014, 11:11:45
Post #2





Grupa: Zarejestrowani
Postów: 305
Pomógł: 29
Dołączył: 5.07.2011

Ostrzeżenie: (0%)
-----

Jeżeli nie chcesz tego robić na bazie danych to masz dwa sposoby:

1. Nadawanie kolejnym plikom nazy w kolejności alfabetycznej, wtedy powinnno ci je odczytywać pokoleii.
2. Przed wyświetleniem utworzyć tablicę z nzawami plików oraz datą ich modyfikacji filemtime, posrtować i w pętli wyświetlić.

Ten post edytował grzes999 5.11.2014, 11:12:02
Go to the top of the page
+Quote Post
mirkolo
post 5.11.2014, 11:21:38
Post #3





Grupa: Zarejestrowani
Postów: 5
Pomógł: 0
Dołączył: 11.05.2007

Ostrzeżenie: (0%)
-----

Na pomysł pierwszy wpadłem, (nazwy D010,D020, D030 ...) wyświetla w losowej kolejności
albo raczej wg jakiegoś sortowania mi nieznanego, bo na wszystkich komputerach i za każdym razem jest ta sama kolejność, ale nie jest ani wg. nazwy, ani daty utworzenia, ani rozmiaru.

Data utworzenia nie wiem czy bedzie najlepszym pomysłem, bo zdjęcia pochodza z rożnych źródeł, potem są obrabiane partiami, więc data utworzenia pliku nie zawsze będzie wyznacznikiem chronologi, dlatego stosuje numerowanie co 10 aby móc po środku wstawić jakiś numer zdjecia. A potem znów sobie przenumerować automatycznie co 10.

Ten post edytował mirkolo 5.11.2014, 11:23:08
Go to the top of the page
+Quote Post
StrefaPi
post 5.11.2014, 11:25:27
Post #4





Grupa: Zarejestrowani
Postów: 235
Pomógł: 50
Dołączył: 2.03.2013

Ostrzeżenie: (0%)
-----

zapisz nazwy zdjęć/plików w tablicy posortuj tablicę i w drugiej pętli ja dopiero wyświetlaj... :)

Ten post edytował StrefaPi 5.11.2014, 11:26:20


--------------------
https://studiostawki.com - studio fotograficzne i filmowe - ul. Inflancka 11, Warszawa
Go to the top of the page
+Quote Post
grzes999
post 5.11.2014, 11:31:21
Post #5





Grupa: Zarejestrowani
Postów: 305
Pomógł: 29
Dołączył: 5.07.2011

Ostrzeżenie: (0%)
-----

Cytat(mirkolo @ 5.11.2014, 11:21:38 ) *
Na pomysł pierwszy wpadłem, (nazwy D010,D020, D030 ...) wyświetla w losowej kolejności
albo raczej wg jakiegoś sortowania mi nieznanego, bo na wszystkich komputerach i za każdym razem jest ta sama kolejność, ale nie jest ani wg. nazwy, ani daty utworzenia, ani rozmiaru.


Żeby sortowało pliki należy skorzystać z funckji scandir

Odnośnie sortowania po datach może pobrać datę utworzenia pliku; a nie ostatniej modyfikacji. Chyba, że ta obróbka tworzy nowe pliki wtedy to nie zadziała.
Go to the top of the page
+Quote Post
mirkolo
post 5.11.2014, 13:31:26
Post #6





Grupa: Zarejestrowani
Postów: 5
Pomógł: 0
Dołączył: 11.05.2007

Ostrzeżenie: (0%)
-----

czyli fragment:
[PHP] pobierz, plaintext 
  1. $galeria = opendir( $katalog );
  2. while ( $zdjecie = readdir( $galeria ) ){
  3.  
  4. $odczyt = pathinfo( $katalog.'/'.$zdjecie );
  5.   if ( $odczyt['extension']  == 'jpg' ){
  6.  
  7.     echo '<li><a href="'.$katalog.'/'.$zdjecie.'" class="highslide" onclick="return hs.expand(this)" title="Zdjęcie: '.$zdjecie.'"><img width="100" height="78" src="'.$katalogminiaturki.'/'.$zdjecie.'" alt="Zdjęcie: '.$zdjecie.'" /></a></li>';
  8.   }
  9. }
  10. closedir($galeria);
[PHP] pobierz, plaintext


mam zamienić na coś z 
[PHP] pobierz, plaintext 
  1. $odczyt2 = scandir( $galeria, 1); 
  2. //  (1 aby odwrócic sortowanie, najnowsze na górze)
  3. print_r($odczyt2);
[PHP] pobierz, plaintext


zaraz spróbuje poeksperymentować...


------------------

Zadzialało:-)
ale pojawil się problem taki że, tworzy też odniesienie do plików/katalogów "." oraz ".."
probowalem dodać linię nr 5 aby uwzględniał tylko jpg tak jak wcześniej
ale wtedy nic się nie wyświetla pomija wszystko...
[PHP] pobierz, plaintext 
  1. $odczyt2 = scandir($katalog, 1); 
  2.  
  3. foreach ($odczyt2 as $number => $zdjecie) {
  4.  
  5.   if ( $zdjecie['extension']  == 'jpg' ){
  6.  
  7.     echo '<li><a href="'.$katalog.'/'.$zdjecie.'" class="highslide" onclick="return hs.expand(this)" title="Zdjęcie: '.$zdjecie.'"><img width="100" height="78" src="'.$katalogminiaturki.'/'.$zdjecie.'" alt="Zdjęcie: '.$zdjecie.'" /></a></li>';}
  8.    }
[PHP] pobierz, plaintext

jak tą linijke poprawić aby uwzględniało tylko jpg?

-------------------
zmieniłem na:
[PHP] pobierz, plaintext 
  1. $odczyt2 = scandir($katalog, 1); 
  2.  
  3. foreach ($odczyt2 as $number => $zdjecie) {
  4.  
  5.    $file_extn = substr( $zdjecie, strrpos( $zdjecie, '.')+1);
  6.   if ($file_extn  == 'jpg' ) {
  7.  
  8.     echo '<li><a href="'.$katalog.'/'.$zdjecie.'" class="highslide" onclick="return hs.expand(this)" title="Zdjęcie: '.$zdjecie.'"><img width="100" height="78" src="'.$katalogminiaturki.'/'.$zdjecie.'" alt="Zdjęcie: '.$zdjecie.'" /></a></li>';}
  9.    }
[PHP] pobierz, plaintext

i działa. Dzięki za pomoc:-)

=============================

dla potomnych cały kod Może komuś się przyda:-)

[PHP] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
  5. <head>
  6. 	<title>Galeria z budowy</title>
  7. 	<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
  8. 	<script type="text/javascript" src="javascript/highslide-with-gallery.js"></script>
  9. 	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
  10. <script type="text/javascript">
  11. 	hs.graphicsDir = 'javascript/images/';
  12. 	hs.align = 'center';
  13. 	hs.transitions = ['expand', 'crossfade'];
  14. 	hs.outlineType = 'rounded-white';
  15. 	hs.fadeInOut = true;
  16. 	//hs.dimmingOpacity = 0.75;
  17.  
  18. 	// Add the controlbar
  19. 	if (hs.addSlideshow) hs.addSlideshow({
  20. 		//slideshowGroup: 'group1',
  21. 		interval: 5000,
  22. 		repeat: false,
  23. 		useControls: true,
  24. 		fixedControls: 'fit',
  25. 		overlayOptions: {
  26. 			opacity: .75,
  27. 			position: 'bottom center',
  28. 			hideOnMouseOut: true
  29. 		}
  30. 	});
  31. </script>
  32. </head>
  33. <body  bgcolor="#EEEEEE">
  34. <table align="center" border="0" bgcolor="cccccc">
  35.  
  36. 	<tr><td colspan="3"><?php include ('menu.php') ?></td></tr>
  37. 	<tr><td colspan="3" align="center"><h4>Galeria w trakcie produkcji</h4></td></tr>
  38.   <tr><td colspan="3" align="center">
  39.  
  40. <div id="galeria">
  41. <ul>
  42. <?php
  43. $katalog = "obrazki";
  44. $katalogminiaturki = "miniaturki";
  45.  
  46. $odczyt = scandir($katalog, 1); //scandir($katalog, 1) aby sortować od końca, jak ma sortowac normalnie usuń ,1
  47.  
  48. foreach ($odczyt as $number => $zdjecie) {
  49.  
  50.    $file_extn = substr( $zdjecie, strrpos( $zdjecie, '.')+1);
  51.   if ($file_extn  == 'jpg' ) {
  52.  
  53.     echo '<li><a href="'.$katalog.'/'.$zdjecie.'" class="highslide" onclick="return hs.expand(this)" title="Zdjęcie: '.$zdjecie.'"><img width="100" height="78" src="'.$katalogminiaturki.'/'.$zdjecie.'" alt="Zdjęcie: '.$zdjecie.'" /></a></li>';}
  54.    }
  55. ?>
  56. </ul>
  57. </div>
  58. </td></tr>
  59. </table>
  60. </body>
  61. </html>
[PHP] pobierz, plaintext


Ten post edytował mirkolo 5.11.2014, 13:18:36
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 01:03
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn