Lightbox-Script integrieren / Pfad zum Vollbild ermitteln

[Doc Hudson]

Da dies mein erstes Posting hier ist, würde ich gerne mit einem freundlichen "Hallo" beginnen

Ich habe folgendes Problem: Ich würde gerne meine Coppermine 1.5.20 mit einem Lightbox-Effekt versehen und dieser soll auf jeden Fall von der Thumbnail-Seite der Alben aus aufgerufen werden können. Leider gelingt mir dies noch nicht so ganz, da ich an einem Problem hängen bleibe.


Was habe ich bisher?

1. Den Bilder auf der Thumbnail-Seite das Tag rel="lightbox" verpasst. Dies habe ich wie folgt gelöst:

In der Datei include/themes.inc.php habe ich den folgenden Block modifiziert ->

<!-- BEGIN thumb_cell -->
        <td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
                <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td align="center">
                                        <a href="{LINK_TGT}" rel="lightbox">{THUMB}<br /></a>
                                        {CAPTION}
                                        {ADMIN_MENU}
                                </td>
                        </tr>
                </table>
        </td>
<!-- END thumb_cell -->

2. Den Verweis zum Lightbox-Script in der Datei template.html eingefügt (im Theme curve-dark, welches später genutzt werden soll)

<script src="lightbox/js/jquery-1.7.2.min.js"></script>
<script src="lightbox/js/lightbox.js"></script>
<link href="lightbox/css/lightbox.css" rel="stylesheet" />

Das ganze vor dem abschließenden </head>-Tag.




Das ganze funktioniert auch eigentlich schon (fast) wie gewüscht, das Problem sind die übergebenen Links auf der Thumbnail-Seite.

Zur Zeit verlinken die Thumbs auf die Vollbilder in folgender Form ->

http://www.link-zur-seite.de/cpg15x/displayimage.php?album=1&pid=2#top_display_media

Gewünscht wäre aber ->

http://www.link-zur-seite.de/cpg15x/albums/userpics/10001/dark_flower_-_contrast.jpg


Dieses Verhalten sorgt dafür, dass die Lightbox nur leere, weiße Flächen anzeigt. Grundsätzlich scheine ich hier aber auf dem rechten Weg zu sein .



Die große Frage ist nun, welche Datei muss ich wie modifizieren, um dieses gewünschte Verhalten zu erzeugen? (Thumbnails, die per vollen Pfad auf das Vollbild verlinken)


Ich suche jetzt schon seit drei Tagen das komplette Internet nach einer Lösung ab und dies in drei Sprachen. Kann es denn sein, dass noch niemand eine Coppermine dahingehend "optimiert" hat?


Die Plug-Ins "EnlargeIt" und "Lightbox" sind keineswegs das was ich mir vorstelle, da ich wirklich von der Thumbnail-Seite aus die Lightbox öffnen möchte und dann auch durch alle Bilder des Albums surfen will.


Bin im Moment für jede Hilfe dankbar.


P.S: Es existiert noch keine öffentlich zugängliche Test-Installation. Ich hoffe aber, dass Ihr mir trotzdem helft ;-)


MfG
Doc Hudson

[Tankertom]

Hallo

vlt. hilft das hier... http://forum.coppermine-gallery.net/index.php/topic,62905.0.html

TT

[Αndré]

Die Plug-Ins "EnlargeIt" und "Lightbox" sind keineswegs das was ich mir vorstelle, da ich wirklich von der Thumbnail-Seite aus die Lightbox öffnen möchte und dann auch durch alle Bilder des Albums surfen will.

Also zumindest bei EnlargeIt bin ich mir sicher, dass der Effekt von der Thumbnail-Seite aus gestartet wird/werden kann (keine Ahnung ob das konfigurierbar ist und/oder ob es standardmäßig aktiv ist).

[Doc Hudson]

@Tankertom: Dieses Lightbox-Plugin hatte ich als allererstes installiert, nur leider ist dieses eher sinnlos, da der Effekt nur von der Einzelbildanzeige aus funktioniert. Sprich man klickt erst in den Thumbnails auf ein Bild, dieses öffnet sich dann und erst dort kann man erneut klicken um das Bild in einer Lightbox angezeigt zu bekommen. Seit mir nicht böse, aber dieses Verhalten finde ich eher unpraktisch. Sinnvoll wäre meiner Meinung nach einzig und alleine der Aufruf der Lightbox von der Thumbnail-Seite aus und dann müsste man auch durch alle Bilder innerhalb des geöffneten Albums surfen können.

@Andre: Ja, EnlargeIt arbeitet von der Thumbnail-Seite aus, allerdings habe ich nicht herausbekommen, ob dieses PlugIn mit dem "absoluten" Pfad zum Bild arbeitet oder auch mit dem displayimage...-Link.

Letztendlich ist das EnlargeIt schon gar nicht so schlecht, wäre da nicht diese elendige Navigation über die beiden Pfeile oben rechts in der Ecke :-(

Ich weiß, ich klinge jetzt sehr anspruchsvoll, aber ich habe halt gerade im Moment sehr genaue Vorstellungen wie es aussehen soll :-)

Hintergrund der ganzen Geschichte ist folgender: Ich habe zur Zeit eine 4Images-Installation laufen und diese arbeitet genau wie hier gewünscht, letztendlich stören mich aber bei der anderen Galerie-Software so ein paar Dinge (Themes, Sortierreihenfolge, automatische Thumbnails etc.) die bei CPG wesentlich besser gelöst sind. Eine Umstellung fände ich von daher sehr gut, zumal die CPG mit großen Bildermengen klasse klar kommt ( > 5000 Stück).

Mal schauen, ich gebe die Hoffnung nicht auf und suche natürlich selber auch noch mit nach einer Lösung.

Danke, für die bisher geposteten Ideen ;-)

MfG
Doc Hudson

[Αndré]

Ich weiß nicht inwieweit du dich mit den beiden Plugins schon auseinandergesetzt hast, aber du scheinst unter allen Umständen deine eigene Suppe (mit allen Vor- & Nachteilen) kochen zu wollen. Das soll mir Recht sein. Ich möchte für Personen, die auf diesen Thread später stoßen jedoch anmerken, dass man (wenn ich mich recht erinnere) in EnlargeIt mit den Pfeiltasten navigieren kann und dass im Lightbox-Plugin-Thread sicher auch eine Lösung existiert, die Lightbox direkt von der Thumbnailseite aus zu starten.

Du benötigst also den absoluten Pfad zum Bild. Dafür müsste ja nur der {LINK_TGT}-Token mit dem entsprechendem Inhalt gefüllt werden, richtig? Dies geschieht in der Funktion theme_display_thumbnails:

Code Select Expand

                // determine if thumbnail link targets should open in a pop-up
                if ($CONFIG['thumbnail_to_fullsize'] == 1) { // code for full-size pop-up
                    if (!USER_ID && $CONFIG['allow_unlogged_access'] <= 2) {
                       $target = 'javascript:;" onclick="alert(\''.sprintf($lang_errors['login_needed'],'','','','').'\');';
                    } elseif (USER_ID && USER_ACCESS_LEVEL <= 2) {
                        $target = 'javascript:;" onclick="alert(\''.sprintf($lang_errors['access_intermediate_only'],'','','','').'\');';
                    } else {
                       $target = 'javascript:;" onclick="MM_openBrWindow(\'displayimage.php?pid=' . $thumb['pid'] . '&fullsize=1\',\'' . uniqid(rand()) . '\',\'scrollbars=yes,toolbar=no,status=no,resizable=yes,width=' . ((int)$thumb['pwidth']+(int)$CONFIG['fullsize_padding_x']) .  ',height=' .   ((int)$thumb['pheight']+(int)$CONFIG['fullsize_padding_y']). '\');';
                    }
                } elseif ($aid == 'random') {
                    $target = "displayimage.php?pid={$thumb['pid']}$uid_link#top_display_media";
                } elseif ($aid == 'lastcom' || $aid == 'lastcomby') {
                    $page = cpg_get_comment_page_number($thumb['msg_id']);
                    $page = (is_numeric($page)) ? "&amp;page=$page" : '';
                    $target = "displayimage.php?album=$aid$cat_link$date_link&amp;pid={$thumb['pid']}$uid_link&amp;msg_id={$thumb['msg_id']}$page#comment{$thumb['msg_id']}";
                } else {
                    $target = "displayimage.php?album=$aid$cat_link$date_link&amp;pid={$thumb['pid']}$uid_link#top_display_media";
                }
                $params = array(
                    '{CELL_WIDTH}' => $cell_width,
                    '{LINK_TGT}'   => $target,
                    '{THUMB}'      => $thumb['image'],
                    '{CAPTION}'    => $thumb['caption'],
                    '{ADMIN_MENU}' => $thumb['admin_menu'],
                );

Etwas in der Art

Code Select Expand

$row = mysql_fetch_assoc(cpg_db_query("SELECT * FROM {$CONFIG['TABLE_PICTURES']} WHERE pid = '{$thumb['pid']}'"));
$target= get_pic_url($row, 'fullsize');
sollte dich dann weiterbringen.

[Doc Hudson]

Hi Andre,

ich habe mich wie gesagt schon die letzten 4-5 Tage mit dieser Problematik auseinander gesetzt und ja, dass EnlargeIt-Plugin kann mit den Pfeiltasten navigiert werden. Allerdings nervt die Animation zwischen zwei Bilder extrem und meines Wissens nach lässt sich dies auch nicht deaktivieren. Somit muss man bei großen Serien zwischen jedem Bild dieses "Geflacker" über sich ergehen lassen. Des weiteren finde ich die Navigation über Pfeilschaltflächen gruselig und letztendlich stellt dies auch Steinzeit-Technik aus den Anfangszeiten des Web dar.

Die Lightbox lässt sich intuitiv innerhalb des Bildes steuern (knapp 48% jeder Seite stellen Vor/Zurück dar) und ein Klick außerhalb beendet den Spuk.

Mit dem hier im Forum angebotenen Threads habe ich mich natürlich im Vorfeld auseinandergesetzt und dies in drei Sprachen (E, GER, ESP), jedoch keine adäquate Lösung gefunden. Scheinbar hat wirklich noch nie jemand versucht die Lightbox von der Thumbnail-Seite aus aufzurufen.

Von daher verstehe ich jetzt gerade die leicht verschnupfte Reaktion nicht ("...eigene Suppe kochen..."). Nachteile sehe ich insoweit keine, da ein paar Zeilen Code bei jedem Update schnell geändert sind.

Über den Lösungansatz mit der Funktion theme_display_thumbnails freue ich mich aber trotzdem und ich schätze, dass mich dass zum Ziel führen wird.

Die nächste Überlegung wird dann sein, wie man daraus eventuell ein PlugIn strickt, so könnten alle davon profitieren. Meine Lösung für die 4Images habe ich damals auch sofort in allen einschlägigen Foren gepostet. Ist ja schließlich ein Geben und Nehmen ;-)

Im Lightbox-Thread existiert übrigens keine Lösung. Diesen habe ich jetzt mehrfach durchgelesen und entweder habe ich Tomaten auf den Augen - was ich nicht abstreiten möchte - oder diese sieben Seiten liefern wirklich keinen Lösungsansatz. Scheinbar hat der PlugIn-Autor genau diese Funktion auch noch auf seinem ToDo-Zettel stehen

MfG
Doc

[Αndré]

Des weiteren finde ich die Navigation über Pfeilschaltflächen gruselig

Ich habe mich oben nicht ganz unmisverständlich ausgedrückt, ich meinte natürlich, dass man mit den Pfeiltasten auf der Tastatur navigieren kann. Ist natürlich alles Geschmackssache, aber mir persönlich gefällt das besser als jegliche Art mit der Maus zu navigieren. Egal, genug Off-Topic

Von daher verstehe ich jetzt gerade die leicht verschnupfte Reaktion nicht ("...eigene Suppe kochen...").

Die nächste Überlegung wird dann sein, wie man daraus eventuell ein PlugIn strickt

Genau das ist meiner Meinung nach die falsche Richtung. Idealerweise würde man das bereits vorhandene Plugin erweitern. Gerade bei den (schonwieder Off-Topic) Facebook-Plugins herrscht im Pluginbereich geradezu wildwuchs, über den ich nicht gerade erfreut bin. Zum einen haben die Benutzer keinen Überblick mehr, wenn es mehrere "konkurrierende" Plugins gibt und ich als Moderator verliere auch den Überblick, welches Plugin nun genau was konnte.

Nachteile sehe ich insoweit keine, da ein paar Zeilen Code bei jedem Update schnell geändert sind.

Ich weiß nicht wie das bereits existierende Lightbox-Plugin und die JS-Bibliothek ansich arbeitet, aber vermutlich werden immer nur die Bilder dargestellt, die auf der aktuellen Thumbnail-Seite zu sehen sind. Folgendes könnte also nicht auf Anhieb funktionieren:

dann müsste man auch durch alle Bilder innerhalb des geöffneten Albums surfen können.

Wie gesagt, ich weiß nicht ob oder wie dieses Problem für das Lightbox-Plugin schon gelöst wurde.



Versuch dich erstmal mit meinem Tipp, wenn du nicht weiterkommst, kannst du hier gern (neuen) Probleme schildern.

[Doc Hudson]

Das mache ich ganz bestimmt, Andre

Bezüglich der Erweiterung vorhandener PlugIns böte sich ja das Lightbox-Plugin förmlich an. Ich werde schlicht und ergreifend mal versuchen mit dem PlugIn-Autor Kontakt aufzunehmen. Eventuell hat er ja schon ganz ähnliche Überlegungen gehegt und Synergien, sprich gemeinsame Arbeit an dem Projekt, könnten sich da durchaus positiv auswirken.

Am Wochenende werde ich mich mal daran machen und den Code-Berg erklimmen :-)

Bis dahin besten Dank für alles.

MfG
Doc