Slideshow2 - als Alternative zum Imageslider

[Schlauchbeutelmaschine]

Hallo,

da in letzter Zeit häufiger nach der Slideshow2 gefragt wurde habe ich für ein Projekt die Slideshow2 als TYPOlight Extension umgesetzt.

Die Merkmale der Slideshow2 sind:
- Optinale Darstellung von Thumbnails
- Schickere Effekte
- Bessere Steuerung
- Umfangreiche Anpassungen möglich
- Allerdings auch deutlich größer

Link zur Extension

Viele Grüße
Sabri

[planepix]

Hallo Sabri,

danke für das Erstellen dieser Erweiterung.

Mein erstes Feedback - Installation erfolgte gestern direkt nach dem Veröffentlichen:

- Auswahl eines Ordners mit Unterordnern liefert leere Slideshow
- Template mit d am Ende "slideshow2_css_standart.tpl" - bei css und js-Template – typographische Korrektur

Elegant wäre natürlich nur die ersten X Bilder vorzuladen und den Rest nachzuladen, nachdem die ersten Bilder geladen wurden.

Mehr Feedback folgt, wenn mir noch etwas auffällt.

[Schlauchbeutelmaschine]

Hallo Thomas,

danke für dein Feedback.

• Den Rechtschreibfehler werde ich korrigieren.
  
• Zum Thema Unterordner muss ich sagen das ich da für das Erfassen der Dateien das TL-Galerie Skript übernommen habe.
  Gibt es denn ein Modul das Unterordner auch erfasst?
  Du hast jetzt aber nur Unterordner im ausgewählten Ordner gehabt und keine Bilder, oder?

[planepix]

Hallo Sabri,

im Unterordner waren die Bilder, im übergeordneten waren keine.
Der übergeordnete Ordner war "bilder", der untergeordnete Ordner bzw. die Ordner waren nach Monaten aufgeteilt: Januar, Februar etc.

Nein wenn man das weiß, dann kann man ja den entsprechenden Unterordner auswählen.

[Schlauchbeutelmaschine]

Ok, ich werde noch einen Hinweis unter die Bildauswahl setzen in dem das erklärt wird.

[Corazon]

ok von mir auch ein feedback..
ich bin sehr zufrieden mit der erweiterung..
aber:
ich hatte schon die nicht veröffendlicher version drauf (fotostrecke slideshow2! )
also die muß runter
und als zweitens. drauf nur es nur ein mal laufen.. ich hatte das modul ein mal im header und dann noch im artikel. die im header lauft die andere nicht !! lustig ist dann wenn man auf der 2ten auf ein tumpnail klick dann kommt man wieder auf die start seite :-)
gruß corazon

[Schlauchbeutelmaschine]

Hallo Corazon,

- Die nicht öffentliche Version brauchst ja dann auch nicht mehr, oder?

- Du kannst mehrere Slideshows auf einer Seite einbinden, allerdings nicht zweimal die gleiche. Mir fällt auch kein sinvolles Beispiel ein warum man das machen sollte? Falls du es trotzdem machen möchtest musst die Slideshow duplizieren und dann kannst du Sie auch 2 mal laufen lassen.

[Buckshot]

Hallo

ich habe die Slideshow2 mal zum testen eingebunden und stelle fest, dass es mir alle Bilder auf die in den Grunddaten angegebene Grösse verzieht. Auch wenn ich bei den einzelnen Bildern dann sep. Angaben mache, es hat keinen Einfluss. Ist das so oder habe ich irgenwo was falsches gesetzt oder vergessen?

Gruss Christian

[Schlauchbeutelmaschine]

Hallo Christian,

das Slideshow Skript passt alle Bilder anscheinend automatisch auf die vorgebene Größe an. Die Option der Bildgrößen Anpassung für die Bilder selber ist dann im Grund überflüssig sofern die Bilder die richtige Größe haben. Also hast du nichts vergessen

Was würdest du denn gerne machen bzw. stört dich was an dieser Funktionsweise?

Nachtrag: Einen Vorteil hat die Bildgröße allerdings bei der Verwendung der Lightbox. Denn so kannst du für die Slides nochmal eine extra Größe definieren.

[FloB]

Sehr gute Extension und just in time! ;-)

Folgende Anmerkungen:

• Auf Seiten mit der Slideshow2 bekomme ich die Meldung:

  Fehler: Lightbox is not defined
  Quelldatei: …/index.html
  Zeile: 56

• Könnte man die JS-Datei durch den YUI-Compressor(?) jagen?
• Könnte man mehr JS aus der HTML-Datei in die externe verlagern? Im Dokument sollten nur die Parameter selber stehen, keine Programmlogik (IMO).
• Könnte man das CSS komplett in eine Datei auslagern? Außerdem halte ich es nicht für nötig, ein Template für das CSS zu führen; wenn man Standardeinstellungen dort verändern möchte, reicht es doch, die alten Werte durch neue in einem eigenen Stylesheet zu überschreiben, oder nicht? CSS bitte auch komprimieren.

Elegant wäre natürlich nur die ersten X Bilder vorzuladen und den Rest nachzuladen, nachdem die ersten Bilder geladen wurden.

Das wünsche ich mir auch!


Edit: Da die Thumbnails ja auch ohne JS angezeigt werden, ist folgender Code überhaupt nötig?

['a', 'b'].each(function(p){
new Element('div', { 'class': 'overlay ' + p }).inject(show_1.slideshow.retrieve('thumbnails'));
}, show_1);

Im Übrigen hast du in Templates am Ende der Zeilen manchmal noch 'nen Tab hinzugefügt, die sollten auch raus – aber das nur am Rande .

[skraddy]

Ich habe eine Fehlermeldung:
Ausganglage: Ich habe Accordions mit Überschriften aus "graphicaltext". Eigentlich sollte das alles eingeklappt sein.
Fehler: Bei aktivierter Galerie ist das Accordion ohne Funktion und alle Felder sind ausgeklappt.

[Schlauchbeutelmaschine]

Hallo FloB,

danke für das ausführliche Feedback!

Ich mach es mal kurz und knapp:

• Die Lightbox ist noch nicht optimal da bin ich noch dran, aber mit der Slimbox von TYPOlight läuft es nicht.
• Ich habe alle JS und CSS Dateien gzippt, was im Endeffekt von der Größe dann gleich ist. Ich werde für die finale Version nochmal schauen ob es mit dem YUI Kompressor auch klappt.
• Alle statischen CSS und JS Parameter habe ich in die Dateien ausgelagert, die jetzt noch drin sind dynamisch.
• Das CSS Template halte ich für notwendig weil dort auch dynamische Werte drin stehen. Wie soll ich das sonst lösen?
• Zum Thema Bilder vorladen kann ich Euch nicht ganz folgen. Was ist der Effekt der dadurch entsteht? Wie kann ich mir das angucken?
• Der Code den du gepostet hast, erstellt am Rand der Thumbnails einen weichen Übergang. Ich werde Ihn als optionale Option anbieten.

Ich kann verstehen das du soviel wie möglich auslagern willst, das war auch mein Ziel, aber das Skript lief dann nicht mehr richtig wenn es zuviel war.

Hallo Skraddy,

hast du mal einen Link für mich, ich kann den Fehler bei mir nicht wiederholen.

Viele Grüße Sabri

[FloB]

1. Die Lightbox ist noch nicht optimal da bin ich noch dran, aber mit der Slimbox von TYPOlight läuft es nicht.
2. Ich habe alle JS und CSS Dateien gzippt, was im Endeffekt von der Größe dann gleich ist. Ich werde für die finale Version nochmal schauen ob es mit dem YUI Kompressor auch klappt.
3. Alle statischen CSS und JS Parameter habe ich in die Dateien ausgelagert, die jetzt noch drin sind dynamisch.
4. Das CSS Template halte ich für notwendig weil dort auch dynamische Werte drin stehen. Wie soll ich das sonst lösen?
5. Zum Thema Bilder vorladen kann ich Euch nicht ganz folgen. Was ist der Effekt der dadurch entsteht? Wie kann ich mir das angucken?
6. Der Code den du gepostet hast, erstellt am Rand der Thumbnails einen weichen Übergang. Ich werde Ihn als optionale Option anbieten.

1. Gibt es einen speziellen Grund, warum die Slimbox nicht funktioniert, oder funktioniert es einfach nicht?
2. gzipped ist schonmal ein Anfang, nur funktioniert das leider nicht überall … YUI wäre hervorragend, GZIP das Sahnehäubchen
3. Perfekt!
4. Müssen die CSS-Werte in der CSS-Datei gesetzt werden, oder wäre es nicht sinnvoller, die per JS-Befehl zu setzen? Denn wenn kein JS aktiviert ist, brauch ich doch auch die entsprechenden CSS-Anweisungen nicht, oder? Vielleicht wäre eine Mischung sinnvoll – die nicht veränderlichen Anweisungen in die CSS, die veränderlichen per JS setzen.
5. Wenn zunächst nur das erste Bild vorgeladen wird, kann dieses angezeigt werden, während der Rest der Bilder lädt. Sonst lädt der Browser erstmal 1-2 MB an Bilddaten, bevor die Slideshow beginnt, was bei langsamer Anbindung länger dauern kann …
6. Den Verlauf kannst du ja dann einfach nur laden, wenn überhaupt Thumbnails angezeigt werden sollen. Könntest du den Teil ebenfalls ins externe Script auslagern?

Vielen Dank für dein Bemühen!

[FloB]

Folgende Idee kam mir noch: Wenn JS deaktiviert ist, werden ja alle Bilder trotzdem geladen und angezeigt. Da man bei mir aber bei deaktiviertem JS eh nur 1 Bild sehen kann, lasten die übrigen Bilder bei mir nur ohne Nutzen alle beteiligten Systeme aus. Schön wäre eine neue Option, die bei deaktiviertem JS nur das jeweils erste Bild in den Source lädt – die restlichen Bilder werden dann bei aktiviertem JS dynamisch hinzugefügt.

Ist das so möglich umzusetzen?

[Schlauchbeutelmaschine]

Naja,

also ich finde die Überlegung nicht wirklich sinnvoll.

Warum sollte ich die Seite für Leute optimieren die kein JS aktiviert haben?
Wer wird das sein?
Ich schätze mal das auf einer normalem Seite 10% kein JS haben und dafür soll ich dann das Skript größer und langsamer machen?

Außerdem kann es von Vorteil sein wenn Suchmaschinen die Alt Texte der anderen Bilder auslesen können, was sie ja dann nicht mehr können.

Daher verstehe ich einfach nicht den Vorteil den man dadurch gewinnen soll,
den Systeme werden so oder so in Anspruch genommen, da machen ein paar Bilder nichts aus.

[schman]

Ich habe eine Fehlermeldung:
Ausganglage: Ich habe Accordions mit Überschriften aus "graphicaltext". Eigentlich sollte das alles eingeklappt sein.
Fehler: Bei aktivierter Galerie ist das Accordion ohne Funktion und alle Felder sind ausgeklappt.

Ich habe das selbe Problem auf der Rechten Seite habe ich ein Accordion und in der Main dann eine Slideshow2 sobald diese eingebunden ist funktioniert das Accordion nicht mehr, es ist einfach alles ausgeklappt

hier mal der Link zur Seite
http://dev.schman.at/lb/index.php/kultur-dornbirn.html

[Schlauchbeutelmaschine]

Hallo schman,

ich werde mir das Problem angucken und dann Bescheid geben.

[schman]

danke für deine Bemühungen

[FloB]

Meine Anfrage war nur eine Idee / Frage zur Machbarkeit der Umsetzung. Wenn es nicht klappt, dann halt nicht .

Warum sollte ich die Seite für Leute optimieren die kein JS aktiviert haben?Wer wird das sein?
Ich schätze mal das auf einer normalem Seite 10% kein JS haben und dafür soll ich dann das Skript größer und langsamer machen?

Man sollte Seiten immer auch für diejenigen optimieren, die kein JS aktiviert haben. Grade die jetzt aufkommenden Handy-Browser haben, wenn überhaupt, nur eingeschränkte JS-Möglichkeiten, bzw. sind dort die JS-Features schlicht nicht sinnvoll.

Außerdem kann es von Vorteil sein wenn Suchmaschinen die Alt Texte der anderen Bilder auslesen können, was sie ja dann nicht mehr können.

Rein gestalterische Elemente sollen ja grade für Suchmaschinen nicht sichtbar (und somit irrelevant) sein. Was hat Google davon, wenn es ein paar bedeutungslose Bilder indexiert?

Daher verstehe ich einfach nicht den Vorteil den man dadurch gewinnen soll,
den Systeme werden so oder so in Anspruch genommen, da machen ein paar Bilder nichts aus.

Ich würde durch diese Option im Endeffekt bis zu 1 MB Traffic pro Request (!) sparen. Das ist 'ne Menge Holz.

Aber wie gesagt, wenn es nicht machbar ist, dann nicht .

[Schlauchbeutelmaschine]

Hallo FloB,

also um es kurz zu machen, in der Variante in der die Slideshow2 als TL-Extension läuft bindet sie die Bilder und Thumbnails direkt als HTML ein. Das habe ich deshalb gemacht damit man ohne Javascript auch noch die Bilder bzw. Thumbnails wechseln kann.

Das ursprüngliche Slideshow2 Skript welches du bei den Demo Beispielen findest bindet die Bilder über Javascript ein was deinem Wunsch nachkommt nur dann gibt es eben kein Fallback. Ich habe mich aber entschieden eher ein Fallback anzubieten als Wert drauf zu legen den Traffic zu reduzieren, da es aus meiner Sicht einfach sinnvoller ist.

Trotzdem solltest du mit einigen Anpassung vermutlich auch in der PHP Modul Datei deine Wunschlösung hinbekommen.

[FloB]

Mir ging es darum, das Fallback, das auch durchaus sinnvoll ist, optional zu machen. Standardmäßig sollen also bei deaktiviertem JS die Bilder angezeigt werden, per Checkbox kann man das ganze dann deaktivieren. Ich schau mir mal den Code an.

Wann kann man denn mit einer neuen Version rechnen, die die anderen angesprochenen Punkte behandelt?

[schman]

Hallo Schlauchbeutelmaschine

Zitat:
Zitat von skraddy Beitrag anzeigen
Ich habe eine Fehlermeldung:
Ausganglage: Ich habe Accordions mit Überschriften aus "graphicaltext". Eigentlich sollte das alles eingeklappt sein.
Fehler: Bei aktivierter Galerie ist das Accordion ohne Funktion und alle Felder sind ausgeklappt.
Ich habe das selbe Problem auf der Rechten Seite habe ich ein Accordion und in der Main dann eine Slideshow2 sobald diese eingebunden ist funktioniert das Accordion nicht mehr, es ist einfach alles ausgeklappt

hier mal der Link zur Seite
http://dev.schman.at/lb/index.php/kultur-dornbirn.html

hattest du schon Zeit um sich den Fehler anzuschauen?
Danke nochmals im Voraus.

[Schlauchbeutelmaschine]

Hallo schman, Hallo FloB,

leider zieht es sich ein wenig hin, entschuldigt bitte.

Ich werde versuchen heute die neue Version hochzuladen,
dazu muss allerdings die alte gelöscht werden da ich nicht
auf die Gross- und Kleinschreibung geachtet habe.

Sobald die neue Version online ist werde ich es hier bekanntgeben.

@schman
Du kannst übergangsweise im Javascript Template alles ab hier löschen, dann sollte es klappen.

var box<?php echo $this->id; ?> = new Lightbox({

[schman]

Danke für deine Hilfe, ich hab jetzt den entsprechenden Teil gelöscht und es funktioniert wunderbar. Danke nochmals für die Tolle Erweiterung.

[markusger]

Hallo zusammen,
muss gerade feststellen, dass die Erweiterung aus dem Repository verschwunden ist.
Wie kommts? Mir hat sie nämlich sehr gut gefallen. Gibt es eine Chance auf Zukunft?
Grüße
Markus

[Schlauchbeutelmaschine]

Hallo Markus,

keine Sorge die Extension ist nicht für immer weg.
Leider musste Sie löschen weil die Gross- und Kleinschreibung innerhalb des Moduls nicht ok war.

Ich hoffe das ich es heute schaffe die neue Version hochzuladen, die dann auch die anderen Probleme behebt.

[schman]

Ich hab mich auch nicht mehr ausgekannt, als plötzlich in der Erweiterunsverwaltung gestanden hat das die Erweiterung nicht gefunden wird.

Freu mich auf jeden Fall aufs neue Release

PS: Gratuliere zum 111 Post Schlauchbeutelmaschine

[markusger]

na dann ;-)
Vielen Dank für deine Arbeit schlauchbeutelmaschine!!

[Schlauchbeutelmaschine]

Hallo, so wie verprochen habe ich die neue Version im Repository hochgeladen.
Bitte testet nochmal ob jetzt alles klappt.

Schönes Wochende
Sabri

[planepix]

Hallo Sabri,

wenn die bisherige Version installiert war, lautet es jetzt im Backend:
Installierte Version im Verzeichnis nicht gefunden.

Im modules Ordner ist sie jedoch vorhanden.

Heisst jetzt:
Alle Slideshows neu erstellen nach dem die bisherige gelöscht wurde?

[Schlauchbeutelmaschine]

Hallo Thomas,

danke für den Hinweis.

Bitte wie folgt vorgehen:
1. Fehlerhafte Slideshow2 aus dem Repository löschen, aber nur die Dateien nicht die Datenbankfelder.
2. Dann die neue Slideshow2 installieren und es sollte alles noch da sein.

[planepix]

Hallo Sabri,

jupp so rum gehts - Danke!!

[planepix]

Hallo Sabri,

haben die Slideshow2 auf einer Seite neu hinzugefügt.

dabei bekam ich dann die Fehlerausgabe: Header are allready sent...".

In der Datei "ContentSlideshow2.php" ist ein Leerzeichen am Anfang, vielleicht kannst Du das im ER fixen..?

[Corazon]

Hallo Sabri,

haben die Slideshow2 auf einer Seite neu hinzugefügt.

dabei bekam ich dann die Fehlerausgabe: Header are allready sent...".

In der Datei "ContentSlideshow2.php" ist ein Leerzeichen am Anfang, vielleicht kannst Du das im ER fixen..?

wenn du jetzt noch gesagt/gezeigt hättes wo.. dann hätte ich es auch schon mal änder können

[Schlauchbeutelmaschine]

Hallo Thomas, danke für den Hinweis.
Ich habe es behoben.

[planepix]

wenn du jetzt noch gesagt/gezeigt hättes wo.. dann hätte ich es auch schon mal änder können

Stand doch im letzten Satz drin, Dateiname und Position.

[Corazon]

Stand doch im letzten Satz drin, Dateiname und Position.

ja am anfang :-) nur das erste das zweite das 3te.. ne passt schon ist ja gefixt..
ich bin doch kein programmer

[bird]

Hallo Schlauchbeutelmaschine,
vielen Dank für die tolle Erweiterung.

Ich habe eine Frage zu der Ladereihenfolge der Bilder in Firefox und dem Internet Explorer.

In Firefox startet die Slideshow butterweich mit dem ersten Bild, nachdem alle Grafiken geladen wurden. Vorher bleibt der entsprechende Hintergrund weiß.

Im IE (V. 8 und abwärts) wird zunächst noch das letzte geladene Bild angezeigt, bevor die Slideshow normal startet.

Hängt das mit dem Caching des IE zusammen? Gibt es eine Möglichkeit, diese Vorabanzeige beim Laden zu "unterdrücken" und nur mit der Animation zu starten?

LG
hangover

[okapi]

Dieses Modul ist sehr schön per CSS anzupassen, allerdings habe ich ein Problem mit dem a:hover-Verhalten für die Vorschaubilder in allen IE-Versionen: beim Mouseover sollte das Vorschaubild mit voller Opazität angezeigt werden, was es beim IE leider nicht tut.

Mit CSS-IE-Hacks für das opacity-Attribut habe ich es bisher nicht hinbekommen. Hat jemand diesbezüglich Erfahrung mit slideshow2 und Thumbnails unter Internet Explorer?

Gruß
Michael

[Schlauchbeutelmaschine]

Hallo,

@hangover
Leider weiss ich nicht voran es liegt.
Vielleicht könntest du nochmal auf der Slideshow2 Demo Seite schauen ob du dort auch das Problem hast? Ansonsten würde ich es nochmal mit einem IE Kompabilitätsfix probieren, also sowas wie das IE7.js Skript.

@okapi
Da weiss ich leider keinen Rat, aber hast du das Problem auch auf der Demoseite?