Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Alles rund um Module und Plugins in CONTENIDO 4.9.
Antworten
McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Beitrag von McHubi » Di 23. Sep 2014, 11:01

Hallo zusammen,

meine für die 4.8er erstellte Bildergalerie mit Templates für Bildbeschreibungen (http://forum.contenido.org/viewtopic.php?f=60&t=32166) habe ich für die 4.9er überarbeitet. Die Funktionalität ist gleich geblieben, hinzugekommen ist, dass sich nun auch die Miniaturansichtsseiten responsiv verhalten.

FEATURES:
generell:
# Thumbnails für die Vorschaubilder werden automatisch angelegt/ entfernt.
# Auswahl der Bilderordner per Dropdown.
# Der Konfigurationsbereich für das Modul kann als Popup eingestellt werden damit man sich nach dem Speichern das ggf. notwendige Runterscrollen spart.
# HTML5 Fade-Effekt für Vorschau und Einzelbildanzeige ein-/ ausschaltbar.

Vorschau der Einzelbilder:
# Anzahl der Spalten/ Zeilen pro Vorschauseite frei festlegbar.
# Größe der Thumbnails ist einstellbar, passen sich anhand der festgelegten Spalten und Zeilen der Vorschauseite responsiv an.
# Navigationsleisten zum Blättern durch die Einzelseiten der Vorschau ober- und/oder unterhalb der Thumbnailtabelle einblendbar.
# Reihenfolge der Bilder kann per Textarea individuell vorgegeben werden. Zusätzlich ist eine automatische, alphabetische Sortierung auf- und absteigend per Klick möglich.

Ansicht Einzelbild:
# Darstellung als Vollbild oder Einbindung in das Seitenlayout per Checkbox wählbar.
# Im Vollbild passt sich das Bild der Fensterbreite/ -höhe automatisch an, so dass es immer komplett sichtbar ist. Ist die Vollbilddarstellung nicht gewählt (Einbindung des Einzelbildes in das normale Seitenlayout), gelten entweder festgelegte Pixel-Abgrenzungen der "Bühne" für die Anpassung oder - responsiv - der zur Verfügung stehende Platz.
# Sollte das Bild von den Abmessungen kleiner sein als die max. Höhe/ Breite kann es - wenn per Checkbox vorgegeben - gestreckt werden.
# Im Vollbild kann der Hintergrund des Layers per css frei gestaltet werden (Hintergrundfarbe, Hintergrundbild, Farbverlauf, halbtransparente pngs für Lightbox-Effekt, ...).
# Preloading der Einzelbilder ein-/ ausschaltbar.
# Bildbeschreibungen werden in einer eigenen Datenbanktabelle hinterlegt.
# Wenn ein Bild aus dem Galerieordner entfernt wird, kann die dazu gehörende Beschreibung aus der Tabelle per Bereinigen-Funktion gelöscht werden.
# Bildbeschreibungen können per Templates am Bild positioniert werden
# Per HTML/ CSS können die Bildbeschreibungen frei gestaltet werden, auch Verlinkungen sind möglich.


INSTALLATION
Modul & Co.
# Im Kommentar vom 13.12.2022 finden sich die Sourcen zu Modul-In- und -Output, CSS und Language.
# Kopieren der Bullet-Grafiken im Ordner in einen Ordner der Wahl irgendwo im Upload-Verzeichnis, "voreingestellt" in der Modulausgabe ist "upload/module/gallery_sd/".
# "Synchronisieren" der Module unter "Style -> Module"
# Anpassen der Bildpfade im Modulreiter "CSS" auf den Ordner, in dem die Bullet-Grafiken liegen.
# Ausführen des sql-statements zum Anlegen der Tabelle (in Datei "sql-statement.txt")
# Anlegen einer Vorlage mit dem Modul.
# Anlegen eines Ordners mit Bilddateien für eine Galerie (der Vorschau-Ordner mit den Thumbnails wird automatisch angelegt).
# Anlegen eines Artikels mit entsprechender Vorlage.
# Falls nicht der "Standardmandant" "cms" verwendet wird, bitte die Moduleingabe anpassen (in Abschnitten /***** begin assigning images to gallery *****/ und /*##### sec_templates begin #####*/).

Einrichten einer Galerie über den Reiter "Konfiguration" des angelegten Artikels
1) Oberer Konfigurationsbereich
# Nicht an Fehlermeldungen stören, die verschwinden nach dem ersten Speichern. ;O)
# Aktivieren der Checkbox für "Popup"-Darstellung um nach dem Speichern nicht immer nach unten scrollen zu müssen.
# Auswahl des Ordners mit den Bilddateien für die Galerie.
# Positionierung der Navigationsleisten für die Übersicht und die Einzelbilder festlegen. Bei der Übersicht muss eine Leiste eingebunden werden, bei den Einzelbildern kann sie genutzt werden. Jedes Einzelbild ist mit einem Layer versehen, mit dem man der per Klick auf das Bild (linkes, mittleres oder rechtes Drittel) vor- und zurückblättern sowie zur Übersicht zurückkehren kann.
# Festlegen der Thumbnailgröße. Wird später eine andere Thumbnailgröße gewünscht, einfach neue Größe eintragen und die Checkbox für das Erzeugen neuer Thumbnails aktivieren. Beim Speichern werden die alten Thumbs gelöscht und die neuen angelegt. Diese Thumbs werden in der Miniaturansicht skaliert.
# Anzahl der Zeilen und Spalten für die Übersichtsseiten eintragen.
# unter "Einzelbild" für oder gegen die Vollbilddarstellung entscheiden. Bei Vollbild, ist es ratsam zunächst einen einfarbigen Hintergrund zu wählen und im entsprechenden Input-Feld z. B. "background-color: #ffffff;" einzutragen. Bei Hintergrundbildern bitte KEINE ' verwenden -> url('pfad');! (Führt in der aktuellen Version noch zum Abbruch des Programmcodes und die Galerie muss neu angelegt werden.)
Entscheidet man sich gegen die Vollbilddarstellung, muss die Größe der Bühne festgelegt werden - sprich, die Größe des Bereichs die dem Bild inkl. Beschreibung im Seitenlayout maximal zur Verfügung stehen soll. Die Darstellung passt sich diesem Bereich automatisch an. Dabei können entweder Pixelabmessungen fest vorgegeben oder eine responsive Variante gewählt werden.
# Die Einzelbilder können über ihre eigentlichen Abmessungen hinaus proportional gestreckt werden, damit sie das gesamte Fenster ausfüllen oder nicht - Checkbox also ggf. aktivieren.
# Bei Aktivierung von "Bilder vorladen" werden beim Aufruf der Galerieübersichtsseiten noch nicht angeschaute Einzelbilder in den Browsercache geladen, damit sie beim Durchblättern der Einzelbildansicht direkt erscheinen und flüssig einfaden.
# Der Einfade-Effekt kann für die Übersichtsseiten und/ oder Einzelbildansicht (de-)aktiviert werden.
# Speichern.

2) Unterer Konfigurationsbereich
a) Reihenfolge der Bilder
# Oben links werden alle im ausgewählten Ordner enthaltenen Bilder angezeigt. Sind die Miniaturen blass dargestellt, wurde das Bild nicht in der Galerie berücksichtigt. Ist es dagegen "normal" gefärbt, wurde es eingereiht. Per Klick auf "wählen" lassen sich alle Dateinamen markieren und per Strg+c kopieren.
# Oben rechts werden alle nicht berücksichtigten Bilder des ausgewählten Ordners aufgeführt Per Klick auf "wählen" lassen sich auch hier alle Dateinamen markieren und per Strg+c kopieren. WICHTIG: eingelesen werden Bilddateien mit den Dateiendungen ".gif,.png,.jpg". Auf Groß-/ Kleinschreibung achten! (Änderungen im Quelltext der Modul-Eingabe unter /*##### sec_all_pics_in_folder begin #####*/ möglich.)
# Unten links befindet sich das Textfeld, in das die oben links oder oben rechts kopierten Dateinamen eingefügt werden können. Beim Einfügen wird meist eine überflüssige Zeile am Ende mit eingefügt. Diese bitte löschen.
# Speichern.
# Wenn unten links eine Warnung "getimagesize..." erscheinen sollte, wird vermutlich vor dem ersten Dateinamen ein Leerzeichen sein, welches nur gelöscht werden muss.
# Die Reihenfolge kann per Klick auf die Buttons "A-Z" und "Z-A" alphabetisch sortiert werden. Danach speichern, damit die Änderung bei den Miniaturen links neben dem Textfeld sichtbar wird.
# Wird ein neues Bild in den Ordner hochgeladen, erscheint es automatisch oben rechts im Bereich "Nicht in Galerie berücksichtigte Bilder". Zum Einfügen in die Galerie einfach den Dateinamen kopieren und unten links in einer eigenen Zeile einfügen (ggf. erzeugte überflüssige Leerzeilen/ -zeichen löschen).
# Sollte ein Dateiname einmal nicht korrekt geschrieben oder ein Bild aus dem Ordner gelöscht worden sein, wird es in der Bildvorschau links neben dem Textfelt nicht mehr angezeigt. Statt dessen macht ein Platzhalter auf das fehlende/ nicht korrekt bezeichnete Bild aufmerksam.
# Zum Ändern der Reihenfolge der Bilder muss nur die entsprechende Zeile verschoben werden. Auch ganze Blöcke lassen sich so per cut'n'paste verschieben.
# Zur besseren Orientierung werden die Seitenzahlen der Übersichtsseiten an den Miniaturen der entsprechenden Startbilder angezeigt.
# Wem die Bilder zu klein sind, der kann per Mouseover eine vergrößerte Version anzeigen lassen.

b) Bildbeschreibung
# Die Bildbeschreibung wird in eines der vorgefertigten Templates 2 bis 4 eingefügt:
2: Bild links, Text rechts
3: Text links, Bild rechts
4: Bild oben, Text unten
Das Template Nr. 1 beinhaltet lediglich das Bild und wird bei der Darstellung automatisch ausgewählt wenn kein anderes Template zugewiesen wurde.
# Unten rechts kann im ersten Dropdown zunächst einmal das gewünschte Bild ausgewählt werden.
# Nach dem klick auf [->] kommt ein zweites Dropdown zur Templateauswahl hinzu.
# Im Textfeld für die Beschreibung kann nun ebensolche erfasst werden.
# Wer Wert auf freie Gestaltung legt, kann sich per html und css austoben. Wichtig ist hierbei, dass statt der sonst üblichen Anführungszeichen " der Platzhalter ### genutzt wird.
Die unterhalb des Textfeldes aufgeführten Klassen können direkt verwendet werden. Beispiele zur Einbindung sind aufgeführt. Die Klassen können natürlich über den Modulreiter "CSS" verändert und ergänzt werden. Damit sie im Backend zur Erläuterung erscheinen, muss die Modul-Eingabe entsprechend angepasst werden.
Wichtig: Zum Speichern der Beschreibung die Checkbox "anwenden" aktivieren. Die Checkbox ist notwendig, um ein versehentliches Überschreiben von anderen Bildbeschreibungen zu verhindern.
# Im Dropdown für die Auswahl des Bildes erhalten alle mit einer Beschreibung versehenen Bilder eine Markierung mit der Nummer des verwendeten Templates. Ändert man das Layout eines Templates, sind automatisch alle mit diesem Template versehenen Bilder von der Änderung betroffen. Gleiches gilt natürlich für die Nutzung der für die Gestaltung der Beschreibung festgelegten css-Klassen.
# Werden Bilder aus dem Galerieordner gelöscht, verbleiben ggf. erfasste Beschreibungen in der Datenbanktabelle. Damit die nicht im Laufe der Zeit zumüllt (in die Tabelle werden alle Beschreibungen aller Bilder sämtlicher Galerien gespeichert) kann die Checkbox "Datenbank bereinigen" im oberen Konfigurationsbereich aktiviert werden. Dann einfach irgendein Bild unten rechts bei der Templatezuordnung auswählen und beim anschließenden Speichern wird die Datenbank gesäubert. Statusmeldungen zur Prüfung werden angezeigt.


ANPASSEN der Bildergalerie
# Die Bullet-Grafiken können natürlich ausgetauscht und die CSS-Klassen angepasst werden.
# Die Optik der Statusanzeige für das Preloading kann in der Modulausgabe ab der Zeile /********** BEGIN THUMBTABLE **********/ geändert werden.
# Die Geschwindigkeit des Einfadens wird über die CSS-Klassen geregelt. Dort also Ausschau halten nach den Angaben zu den Sekunden für transition und duration.
# Aktuell sind vier Templates enthalten, sie können beliebig geändert und/ oder um weitere ergänzt werden. Los geht's in der Modulausgabe ab Zeile /********** templates begin **********/
Die Anpassung der Templates ist nicht ganz trivial, da für die flexible Anpassung der Einzelbildanzeige an den zur Verfügung stehenden Platz die aktuellen Fenster-/ Bühnenabmessungen gegeneinander gerechnet werden und dann auf das Template umgerechnet werden müssen. Hierzu sollte man sich ein wenig mit den Variablen beschäftigen. Am besten also die Werte beim Basteln ausgeben lassen...
Die Standardanzeigen sind ja schon enthalten und wer lediglich die Aufteilung Bild/Text (70:30%) bzw. Text/Bild (30:70 %) anpassen möchte, der kann direkt an den JS-Variablen var_left_width und var_right_width rumschrauben. So lässt sich per copy'n'paste schnell ein weiteres Template Nr. 5 zum Beispiel mit der Aufteilung 50:50% erstellen.

Viel Spaß mit der Galerie :mrgreen:
gallery_sd-4-9-screenshot-001.jpg
(128 KiB) Noch nie heruntergeladen
gallery_sd-4-9-screenshot-002.jpg
(125.91 KiB) Noch nie heruntergeladen
gallery_sd-4-9-screenshot-003.jpg
(243.64 KiB) Noch nie heruntergeladen
Zuletzt geändert von McHubi am Di 13. Dez 2022, 12:29, insgesamt 3-mal geändert.
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

rw72
Beiträge: 253
Registriert: Do 22. Jan 2004, 16:24
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von rw72 » Mi 12. Aug 2015, 22:43

Hallo,
bin dabei das Modul zu testen habe aber folgendes Problem.
Konfiguration geht und Bilder werden angezeigt.
Nach dem Speichern erhalte ich im log den Fehler

Code: Alles auswählen

[2015-08-12 23:39:40] Warning: "Database failure: 1054 (Unknown column 'htmlpath' in 'field list') - /xxx/contenido/main.php?contenido=nhsa7k8r26a SELECT
      htmlpath, frontendpath
      FROM
      con_clients 
      WHERE
      idclient = 1 
" at reportHalt() [class.db.driver.handler.php(978)]
	reportHalt() called in file class.db.driver.handler.php(950)
	halt() called in file class.db.driver.handler.php(684)
	query() called in file include.tplcfg_edit_form.php(327) : eval()'d code(147)
	eval() called in file include.tplcfg_edit_form.php(327)
	include_once() called in file main.php(203)
Wenn ich die Seite aufrufe indem ich die Konfiguration vorgenommen habe erhalte ich eine weiße Seite ohne HTML Code.

Was mach ich falsch?
Viele Grüße
Ralf

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von McHubi » Do 13. Aug 2015, 05:45

Hallo rw72,

da wird in der Datenbanktabelle die Spalte "htmlpath" nicht gefunden. Fangen Deine DB-Tabellen alle mit con_ an oder hast Du einen anderen Präfix bei der Installation von Contenido verwendet? Weiße Seite im Front- oder Backend?

VG,

Markus
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

rw72
Beiträge: 253
Registriert: Do 22. Jan 2004, 16:24
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von rw72 » Do 13. Aug 2015, 05:58

Hallo Marcus,

die DB-Tabellen fangen alle mit con_ an.
Frontend Weiß
Backend - Editor und Vorschau Weiß
Konfiguration kann ich durchführen.

VG
Ralf
Viele Grüße
Ralf

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von McHubi » Do 13. Aug 2015, 06:19

Hm... Muss ich mir mal näher anschauen. Bin im Moment allerdings auf Geschäftsreise und zeitlich etwas knapp auf der Uhr... Hast Du schon in Quelltext des Moduls nach Stellen gesucht, in denen auf die nicht zu findende DB-Tabellenspalte zugegriffen werden soll?
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

rw72
Beiträge: 253
Registriert: Do 22. Jan 2004, 16:24
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von rw72 » Do 13. Aug 2015, 06:51

Hab ich jetzt mal gemacht er will das im Input bei

Code: Alles auswählen

#Selected img directory
$cms_dirname = "CMS_VALUE[1]";
if ($cms_dirname == '' || $cms_dirname == '0')  $cms_dirname = 'bilder/';
#Get paths
$sql = "SELECT
      htmlpath, frontendpath
      FROM
      ".$cfg["tab"]["clients"]." 
      WHERE
      idclient = ".$client." ";
$db->query($sql);
if ($db->next_record())
  {
  $htmlpath = $db->f('htmlpath');
  $frontendpath = $db->f('frontendpath');
  }
Aber die Felder gibt es ja bei der 4.9 nicht mehr.
Viele Grüße
Ralf

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von McHubi » Do 13. Aug 2015, 07:07

Hast Du evtl. die 4.8er Version der Galerie installiert? Oder die für die 4.9 in diesem Thread?
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

rw72
Beiträge: 253
Registriert: Do 22. Jan 2004, 16:24
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von rw72 » Do 13. Aug 2015, 07:15

Die von hier
Viele Grüße
Ralf

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen

Beitrag von McHubi » Fr 14. Aug 2015, 10:59

Okkkkkay... Da ist Mumpitz beim Portieren von der 4.8 auf die 4.9 übrig geblieben. :oops: Kurioserweise läuft das bei mir in einer 4.9.6er problemlos. Erst, wenn ich die Inhalte der Variablen $htmlpath und $frontendpath per echo ausgeben will, dann kracht's bei mir auch. Also, lange Rede kurzer Sinn: schmeiss den Part hier einfach komplett raus:

Code: Alles auswählen

#Get paths
$sql = "SELECT
      htmlpath, frontendpath
      FROM
      ".$cfg["tab"]["clients"]."
      WHERE
      idclient = ".$client." ";
$db->query($sql);
if ($db->next_record())
  {
  $htmlpath = $db->f('htmlpath');
  $frontendpath = $db->f('frontendpath');
  }
$htmlpath und $frontendpath werden im späteren Verlauf weder in der Moduleingabe noch -ausgabe verwendet.
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

peanut
Beiträge: 246
Registriert: Do 25. Nov 2004, 19:34
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Beitrag von peanut » So 27. Nov 2022, 13:25

Der Link zum .zip File ist leider defekt.
du liest nie ein Buch und weisst weise der Bildung auszuweichen ....

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Beitrag von McHubi » Di 13. Dez 2022, 12:31

INPUT

Code: Alles auswählen

/***********************************************
* CONTENIDO MODUL - INPUT
*
* Modulname   :     gallery_sd
* Author(s)   :     www.Seamless-Design.de Markus Hübner
* Copyright   :     www.Seamless-Design.de Markus Hübner
* Created     :     04.2012
* Modified : Markus Hübner for contenido 4.9.x 7/2014
************************************************/

/*
use strg+f and following keywords to find sections quickly
------------------------------------------------
| sec_popup              | sec_thumbnails      |
| sec_folder             | sec_thumb_table     |
| sec_navigation         | sec_single_pic      |
| sec_database           | sec_effect          |
------------------------------------------------
| sec_all_pics_in_folder | sec_pics_not_chosen |
------------------------------------------------
| sec_pics_chosen        | sec_templates       |
------------------------------------------------
*/


?>
<style type="text/css">
a.menue, a.menue:link, a.menue:visited, a.menue:active {
position: relative;
text-decoration: none;
}

a.menue:hover {
z-index:1000;
background: transparent;
}

a.menue span {
display: none;
text-decoration: none;
}

a.menue:hover span {
z-index:1;
display: block;
position: absolute;
top: 0px;
left: 0px;
padding: 0px;
margin: 0px;
}
.success {
font-weight: 900;
color: #87CD00;
}
.fail {
font-weight: 900;
color: #ff0000;
}
</style>

<!-- the following css-data has to be place here to realise the examples for <span>-formatting in description. They should be similar withe the ones in css-file for frontend-output -->
<style type="text/css">
span.tpl_f01 {font-family: arial;}
span.tpl_f02 {font-family: times;}
span.tpl_f03 {font-family: garamond;}
span.tpl_c01 {color: #999999;}
span.tpl_c02 {color: #666666;}
span.tpl_c03 {color: #ff0000;}
span.tpl_s01 {font-size: 150%;}
span.tpl_s02 {font-size: 130%;}
span.tpl_s03 {font-size: 110%;}
span.tpl_w01 {font-weight: 900;}
span.tpl_d01 {text-decoration: underline;}
</style>

<script type="text/javascript">
function selecttxt(objId) // function for highlighting and marking filenames
  {
  if (document.selection)
    {
    var range = document.body.createTextRange();
    range.moveToElementText(document.getElementById(objId));
    range.select();
    }
  else if (window.getSelection)
    {
    var range = document.createRange();
    range.selectNode(document.getElementById(objId));
    window.getSelection().addRange(range);
    }
  }

function sort_chosen_files(var_direction)
  {
  var var_confirmation_message='<?php echo mi18n("Are you sure? This action can not be restored."); ?>';
  if(window.confirm(var_confirmation_message))  
    { 
    var var_chosen_files=document.getElementById('g_sd_chosen_files').value;
    var array_chosen_files=var_chosen_files.split("\n");
    array_chosen_files.sort();
    if(var_direction=="z_a") array_chosen_files.reverse();
    var_chosen_files=array_chosen_files.join("\n");
    document.getElementById('g_sd_chosen_files').value=var_chosen_files;
    } 
  }
</script>  




<?php
/******************************************/
/***** begin configuration of gallery *****/
/******************************************/
$popup="CMS_VALUE[10]";
if($popup=="true")echo '<div style="height: 300px;">&nbsp;</div><div style="border: 1px solid #000000; box-shadow: 5px 5px 5px #999999; position:absolute; top: 5px; left: 5px; z-index: 5000; background-color: #ffffff;">';

#Selected img directory
$cms_dirname = "CMS_VALUE[1]";
if ($cms_dirname == '' || $cms_dirname == '0')  $cms_dirname = 'bilder/';
#Get paths
$sql = "SELECT
      htmlpath, frontendpath
      FROM
      ".$cfg["tab"]["clients"]." 
      WHERE
      idclient = ".$client." ";
$db->query($sql);
if ($db->next_record())
  {
  $htmlpath = $db->f('htmlpath');
  $frontendpath = $db->f('frontendpath');
  }

echo '<div style="background-color: #f0f0f0; margin-bottom: 20px; border-bottom: 1px solid #000000;">';

echo '<table cellpadding="0" cellspacing="0" style="width: 100%;">';

/*##### sec_popup begin #####*/
echo '<tr><td style="border-bottom: 1px solid #999999;vertical-align: top;">&nbsp;<strong>'.mi18n("popup").':</strong></td><td style="border-bottom: 1px solid #999999;">';
      if ("CMS_VALUE[10]" != "true") echo '<input type="checkbox" name="CMS_VAR[10]" value="true">'; 
        else echo '<input type="checkbox" name="CMS_VAR[10]" value="true" checked>'; 
echo '</td>';
/*##### sec_popup end #####*/


/*##### sec_thumbnails begin #####*/
echo '<td style="border-left: 1px solid #999999; border-bottom: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("maximum size of thumbnail").':</strong></td><td style="border-bottom: 1px solid #999999;"><input size="2" type="text" name="CMS_VAR[50]" value="CMS_VALUE[50]">px (';
       echo mi18n("rebuild thumbnails").': <input type="checkbox" name="CMS_VAR[55]" value="true">)'; 
echo '</td></tr>';
/*##### sec_thumbnails end #####*/


/*##### sec_folder begin #####*/
$cms_dirname = "CMS_VALUE[2]";
echo '<tr><td style="border-bottom: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("image directory").':</strong> </td>
      <td style="border-bottom: 1px solid #999999;">';
echo '<select name="CMS_VAR[2]"';
$sql = "SELECT DISTINCT
      dirname
      FROM
      ".$cfg["tab"]["upl"]."
      WHERE
      idclient='$client' AND
      filetype IN ('jpeg','jpg','gif','png','JPEG','JPG')
      ORDER BY
      dirname";
$db->query($sql);
$selected = false;
while ($db->next_record())
  {
  $dirname = $db->f('dirname');
  if ($cms_dirname != $dirname)
    {
    echo '<option value="'.$dirname.'">&nbsp;'.$dirname.'</option>';
    }
    else
      {
      $selected = true;
      echo '<option value="'.$dirname.'" selected="selected">&nbsp;'.$dirname.'</option>';
      }
  }
if (!$selected) echo '<option value="0" selected="selected">'.mi18n("please choose").'</option>';
           else echo '<option value="0">'.mi18n("please choose").'</option>';
echo "</select></td>";
/*##### sec_folder end #####*/


/*##### sec_thumb_table begin #####*/
echo '<td style="border-left: 1px solid #999999; border-bottom: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("dimensions").':</strong></td><td style="border-bottom: 1px solid #999999;"><input size="2" type="text" name="CMS_VAR[60]" value="CMS_VALUE[60]">'.mi18n("rows").' / <input size="2" type="text" name="CMS_VAR[65]" value="CMS_VALUE[65]">'.mi18n("columns");
echo '</td></tr>';
/*##### sec_thumb_table end #####*/


/*##### sec_navigation begin #####*/
echo '<tr><td style="border-bottom: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("navigations").':</strong></td><td style="border-bottom: 1px solid #999999;vertical-align: top;">';
echo '<table><tr><td>';
echo mi18n("thumbtable").'</td><td>';
     if ("CMS_VALUE[400]" != "true") echo ' <input type="checkbox" name="CMS_VAR[400]" value="true"> '; 
                                else echo ' <input type="checkbox" name="CMS_VAR[400]" value="true" checked> ';
echo mi18n("top").'</td><td>';
     if ("CMS_VALUE[410]" != "true") echo ' <input type="checkbox" name="CMS_VAR[410]" value="true"> '; 
                                else echo ' <input type="checkbox" name="CMS_VAR[410]" value="true" checked> '; 
echo mi18n("bottom").'</td></tr>';
echo '<tr><td>'.mi18n("picture").'</td><td>';
     if ("CMS_VALUE[420]" != "true") echo ' <input type="checkbox" name="CMS_VAR[420]" value="true"> '; 
                                else echo ' <input type="checkbox" name="CMS_VAR[420]" value="true" checked> ';
echo mi18n("top").'</td><td>';
     if ("CMS_VALUE[430]" != "true") echo ' <input type="checkbox" name="CMS_VAR[430]" value="true"> ';
                                else echo ' <input type="checkbox" name="CMS_VAR[430]" value="true" checked> ';
echo mi18n("bottom").'</td></tr></table>';
/*##### sec_navigation end #####*/


/*##### sec_single_pic begin #####*/
echo '</td><td style="border-left: 1px solid #999999; border-bottom: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("single picture").':</strong><td style="border-bottom: 1px solid #999999;">';
echo '<table><tr><td valign="top">';
echo mi18n("fullscreen").'</td><td>';
     if ("CMS_VALUE[500]" != "true") echo ' <input type="checkbox" name="CMS_VAR[500]" value="true"> '; 
                                else echo ' <input type="checkbox" name="CMS_VAR[500]" value="true" checked> '; 
echo mi18n("yes").'&nbsp;|&nbsp;';
echo mi18n("css-data for div style").' <input size="15" type="text" name="CMS_VAR[510]" value="CMS_VALUE[510]"><br/>';
echo mi18n("single-picture no fullscreen").'<br/>';
     $responsive_stage="CMS_VALUE[515]";
     echo '<input type="radio" name="CMS_VAR[515]" value="true"';
            if($responsive_stage=="true") echo ' checked="checked"';
            echo '/> '.mi18n("responsive stage").'<br/>';
     echo '<input type="radio" name="CMS_VAR[515]" value="false"';
            if($responsive_stage=="false") echo ' checked="checked"';
		    echo '/> ';    
	        echo '<input size="1" type="text" name="CMS_VAR[520]" value="CMS_VALUE[520]">x<input size="1" type="text" name="CMS_VAR[530]" value="CMS_VALUE[530]">px '.mi18n("width/height of stage").'
      </td></tr>';
	  echo '<tr><td>'.mi18n("stretch picture").'</td><td>';
      if ("CMS_VALUE[540]" != "true") echo ' <input type="checkbox" name="CMS_VAR[540]" value="true"> '; 
        else echo ' <input type="checkbox" name="CMS_VAR[540]" value="true" checked> '; 
echo mi18n("yes").'</td></tr>';
echo '<tr><td>'.mi18n("preload picture").'</td><td>';
      if ("CMS_VALUE[550]" != "true") echo ' <input type="checkbox" name="CMS_VAR[550]" value="true"> '; 
                                 else echo ' <input type="checkbox" name="CMS_VAR[550]" value="true" checked> '; 
echo mi18n("yes").'</td></tr></table>';
echo '</td></tr>';
/*##### sec_single_pic end #####*/


/*##### sec_database begin #####*/
echo '<tr><td colspan="2">'.mi18n("search database for descriptions of erased images");
        $search_database="CMS_VALUE[320]";
  echo '<input type="radio" name="CMS_VAR[320]" value="true"';
        if($search_database=="true") echo ' checked="checked"';
        echo '/> '.mi18n("yes").' ';
  echo '<input type="radio" name="CMS_VAR[320]" value="false"';
        if($search_database=="false") echo ' checked="checked"';
		echo '/> '.mi18n("no").' ';
echo '</td>';
/*##### sec_database end #####*/


/*##### sec_effect begin #####*/
echo'<td style="border-left: 1px solid #999999; vertical-align: top;">&nbsp;<strong>'.mi18n("fade-effect").':</strong></td><td>';
echo mi18n("gallery").' ';
     if ("CMS_VALUE[600]" != "true") echo ' <input type="checkbox" name="CMS_VAR[600]" value="true"> '; 
                                else echo ' <input type="checkbox" name="CMS_VAR[600]" value="true" checked> '; 
echo '&nbsp;'.mi18n("single picture").' ';
      if ("CMS_VALUE[620]" != "true") echo ' <input type="checkbox" name="CMS_VAR[620]" value="true"> '; 
                                 else echo ' <input type="checkbox" name="CMS_VAR[620]" value="true" checked> '; 
//echo '&nbsp;&nbsp;|&nbsp;&nbsp;'.mi18n("effect-speed").' <input style="width: 20px;" type="text" name="CMS_VAR[630]" value="CMS_VALUE[630]"> '.mi18n("in percent");
echo '</td></tr>';
/*##### sec_effect end #####*/
echo '</table>';
  
echo '</div>';
/****************************************/
/***** end configuration of gallery *****/
/****************************************/




/*********************************************/
/***** begin assigning images to gallery *****/
/*********************************************/
$dir="../cms/upload/CMS_VALUE[2]";
$dir_preview="../cms/upload/CMS_VALUE[2]vorschau/";
$thumbtable_rows="CMS_VALUE[60]";
$thumbtable_columns="CMS_VALUE[65]";
$amount_of_img_thumbtable=$thumbtable_rows*$thumbtable_columns;
$thumb_maximum_size="CMS_VALUE[50]";
$order_of_appearance="CMS_VALUE[100]";
$order_of_appearance=str_replace("\r\n","",$order_of_appearance);
$order_of_appearance=str_replace(".jpg",".jpg###",$order_of_appearance);
$order_of_appearance=str_replace(".png",".png###",$order_of_appearance);
$order_of_appearance=str_replace(".gif",".gif###",$order_of_appearance);
$array_order_of_appearance = explode("###",$order_of_appearance);
$array_imagelist=array();





/********** begin directory and thumb work **********/
if(is_dir($dir_preview))
    {
    //echo 'is dir<br/>';
    }
    else
      {
      mkdir($dir_preview);
      }

$fotoPfad = $dir;
$thumbPfad = $dir_preview;

function checkThumbnail($bild,$thumb_maximum_size)
  {
  //echo 'checkthumbnail: '.$bild.'<br/>';
  global $fotoPfad;
  global $thumbPfad;
  $rebuild_thumb="CMS_VALUE[55]";
  if($rebuild_thumb=="true")
    {
    echo 'rebuilding thumb: '.$thumbPfad.$bild.'<br/>';
    unlink($thumbPfad.$bild);
    $rebuild_thumb="false";
    }
  $fotoZeit= filemtime($fotoPfad.$bild);
  $thumbZeit = @filemtime($thumbPfad.$bild); //Sollte kein Bild vorhanden sein ist das Ergebnis auch 0 und das reicht uns.
  if ($fotoZeit> $thumbZeit)
    {
    //echo '-> createThumb<br/>';
    createThumb($bild,$thumb_maximum_size);
    }
  }

function eraseThumbnail ($bild)
  {
  global $fotoPfad;
  global $thumbPfad;
  if(file_exists($fotoPfad.$bild))
    {
    }
    else
    {
     //echo 'eraseThumb: '.$bild.'<br/>';
     unlink($thumbPfad.$bild);
    }
  }

function createThumb($bild,$thumb_maximum_size)
  {
   global $fotoPfad;
   global $thumbPfad;
   $size=getimagesize("$fotoPfad"."$bild");
   $breite=$size[0];
   $hoehe=$size[1];
   if ($breite>$hoehe)
      {
      $thumbBreite=$thumb_maximum_size;
      $thumbHoehe=$hoehe/($breite/$thumbBreite);
      }
      else
        {
        $thumbHoehe=$thumb_maximum_size;
        $thumbBreite=$breite/($hoehe/$thumbHoehe);
        }
   $altesBild=ImageCreateFromJPEG("$fotoPfad"."$bild");
   $neuesBild=imageCreateTrueColor($thumbBreite,$thumbHoehe);
   imageCopyResampled($neuesBild,$altesBild,0,0,0,0,$thumbBreite,$thumbHoehe,$breite,$hoehe);
   ImageJPEG($neuesBild,"$thumbPfad"."$bild",85);
   //echo $bild.'<br/>';
   /*echo $fotoPfad.'<br/>';
   echo $thumbPfad.'<br/>';
   echo $breite.' / '.$hoehe.'<br/>';
   echo $altesBild.'<br/>';
   echo $neuesBild.'<br/>';*/
  }

$verz=opendir ($fotoPfad);
while ($file=readdir($verz))
  {
  if (filetype($fotoPfad.$file)!="dir") checkThumbnail($file,$thumb_maximum_size);
  }
closedir($verz);

$verz=opendir ($thumbPfad);
while ($file=readdir($verz))
  {
  if (filetype($thumbPfad.$file)!="dir") eraseThumbnail($file);
  }
closedir($verz);
/********** end directory and thumb work **********/



echo '<table style="border-collapse: collapse;">';
echo '<tr>';

/*##### sec_all_pics_in_folder begin #####*/
$directory="../cms/upload/CMS_VALUE[2]vorschau/";
$array_imagelist = array();
$array_imagelist_work = array();
$verz = openDir($dir_preview);
while ($datei = readDir($verz))
  {
  if ($datei != "." && $datei != ".." && !is_dir($datei))
    {
    if (strstr($datei, ".gif") ||
        strstr($datei, ".png") ||
        strstr($datei, ".jpg"))
       {
       $info = getImageSize($dir_preview. $datei);
       // Bildinfos dem Array ($bilderliste) hinzufügen
       // Änderungsdatum , Pfad, Breite, Höhe
       array_push($array_imagelist, array(fileMtime($dir_preview. $datei) ,
       //$directory. $datei , $info[0] , $info[1]));
       $datei , $info[0] , $info[1]));
       array_push($array_imagelist_work,$datei);
       }
     }
  }
closeDir($verz);
sort($array_imagelist_work);
echo '<td style="width: 500px; height: 270px;vertical-align: top; border: 1px solid #999999;">';
echo '<strong>'.mi18n("all pictures in chosen directory").'</strong><br/>';
echo '<a href="" onclick="selecttxt(\'csv_dump\'); return false;" title="'.mi18n("strg+c").'"><img src="images/arrow.gif"/>'.mi18n("select").'</a>';
echo '<div style="height: 250px; overflow: auto;">';
$array_not_in_imagelist=array();
echo '<div style="float:left; width: 100px; text-align: center;">';
$i=0;
$length=count($array_imagelist_work);
while($i<$length)
  {
  if(in_array($array_imagelist_work[$i],$array_order_of_appearance))
    {
    echo '<img src="'.$dir_preview.$array_imagelist_work[$i].'" style="height:50px; margin-bottom: 1px;" alt="'.$array_imagelist_work[$i].'" title="'.$array_imagelist_work[$i].'"/><br/>';
    }
    else
      {
      echo '<img src="'.$dir_preview.$array_imagelist_work[$i].'" style="height:50px;opacity: 0.3; margin-bottom: 1px;" alt="'.$array_imagelist_work[$i].'" title="'.$array_imagelist_work[$i].'"/><br/>';
      array_push($array_not_in_imagelist,$array_imagelist_work[$i]);
      }
  $i++;
  }
echo '</div>';
echo '<div id="csv_dump" style="float: left; font-family: arial,helvetica,sans-serif;font-size: 11px;line-height: 51px;">';
$i=0;
while($i<$length)
  {
  echo ' '.$array_imagelist_work[$i].'<br/>';
  $i++;
  }
echo '</div>';
echo '</div>';
echo '</td>';
/*##### sec_all_pics_in_folder end #####*/


/*##### sec_pics_not_chosen begin #####*/
echo '<td style="width: 500px; height: 270px;vertical-align: top; border: 1px solid #999999;">';
echo '<strong>'.mi18n("not listed pictures for gallery").'</strong><br/>';
$length=count($array_not_in_imagelist);
if($length>0) echo '<a href="" onclick="selecttxt(\'csv_dump_not_in_imagelist\'); return false;" title="'.mi18n("strg+c").'"><img src="images/arrow.gif"/>'.mi18n("select").'</a>';
echo '<div style="height: 250px; overflow: auto;">';
$i=0;
if($length>0)
  {
  echo '<table style="width: 90%;"><tr>';
  echo '<td style="vertical-align: top; text-align:center; width: 80px;">';
  while($i<$length)
    {
    echo '<a href="#" class="menue">
          <img src="'.$dir_preview.$array_not_in_imagelist[$i].'" style="height:31px; margin-bottom: 1px;"/>
          <span><img src="'.$dir_preview.$array_not_in_imagelist[$i].'" style="height:100px; margin-bottom: 1px;"/></span>
          </a>
          <br/>';
    $i++;
    }
  echo '</td>';
  echo '<td>';
  echo '<div id="csv_dump_not_in_imagelist" style="float: left; font-family: arial,helvetica,sans-serif;font-size: 11px;line-height: 32px;">';
  $i=0;
  while($i<$length)
    {
    echo ' '.$array_not_in_imagelist[$i].'<br/>';
    $i++;
    }
  echo '</div>';
  echo '</td>';
  echo '</tr></table>';
  }
  else echo '<p>'.mi18n("none").'</p>';
echo '</div>';
echo '</td>';
/*##### sec_pics_not_chosen end #####*/
echo '</tr>';
echo '<tr>';


/*##### sec_pics_chosen begin #####*/
echo '<td style="width: 500px; height: 270px;vertical-align: top; border: 1px solid #999999;">';
echo '<strong>'.mi18n("order of appearance").'</strong><br/><br/>';
echo '<span style="margin-left: 100px; padding: 2px; background-color: #555555; color: #ffffff; cursor: pointer;" onclick="javascript:sort_chosen_files(\'a_z\');"> A-Z &nabla;</span> <span style="padding: 2px; background-color: #555555; color: #ffffff; cursor: pointer;" onclick="javascript:sort_chosen_files(\'z_a\');"> Z-A &Delta; </span><br/>';
echo '<div style="height: 430px; overflow: auto;">';
echo '<table style="width: 95%;"><tr>';
echo '<td style="vertical-align: top; text-align:left; width: 100px;">';
$i=1;
$page=1;
foreach($array_order_of_appearance AS $datei)
  {
  if($i==1)
    {
    echo '<span style="color: #ff0000;font-size:9px;">'.$page.'</span>';
    $margin_bottom=1;
    $page++;
    }
    else
      {
      $margin_bottom=2;
      }
  if($datei!="")
    {
    if(file_exists($dir_preview.$datei))
      {
      echo '<a href="#" class="menue">
              <img src="'.$dir_preview.$datei.'" style="height: 31px; margin-bottom: '.$margin_bottom.'px;" alt="'.$datei.'" title="'.$datei.'"/>
            <span><img src="'.$dir_preview.$datei.'" style="height: 100px; margin-bottom: '.$margin_botto.'px;" alt="'.$datei.'" title="'.$datei.'"/></span>
            </a>
            <br/>';
      }
      else echo '<img src="foo" style="height: 31px; margin-bottom: '.$margin_bottom.'px;"/><br/>';
    $info = getImageSize($dir_preview.$datei);
    array_push($array_imagelist,array(fileMtime($dir_preview. $datei),$datei,$info[0],$info[1]));
    }
  $i++;
  if($i>$amount_of_img_thumbtable) $i=1;
  }
echo '</td>';
echo '<td style="vertical-align: top;"><textarea id="g_sd_chosen_files" style="font-family: arial,helvetica,sans-serif;font-size: 11px;line-height: 38px;" cols="63" rows="400" CMS_VALUE="100" name="CMS_VAR[100]" value="CMS_VALUE[100]">CMS_VALUE[100]</textarea></td>';
echo '</tr></table>';
echo '</div>';
echo '</td>';
/*##### sec_pics_chosen end #####*/


/*##### sec_templates begin #####*/
echo '<td style="width: 500px; height: 270px;vertical-align: top; border: 1px solid #999999;">';
echo '<strong>'.mi18n("template and description").'</strong><br/>';
$selected_image="CMS_VALUE[200]";
$amount_of_images_with_description=0;
echo '<table><tr><td valign="top"><strong>'.mi18n("image").'</strong></td><td>';
echo '<select name="CMS_VAR[200]" style="width: 350px;font-size: 11px;">';
echo '<option value="--?--">--?--</option>';
foreach($array_imagelist_work AS $element)
  {
  $directory='upload/'.$cms_dirname;
  $description_found='[&nbsp;]';
  $query = "SELECT template,description FROM gallery_sd WHERE directory='$directory' AND filename='$element'";
  $result = cRegistry::getDb();
  $result->query($query);
  while($result->nextRecord())
    {
    $arr=$result->toArray();
    $description_found='['.$arr[template].']';
    $amount_of_images_with_description++;
    }  
  echo '<option value="'.$element.'"';
  if($selected_image==$element) echo ' selected="selected"';
  echo '>'.$description_found.'&nbsp;'.$element.'</option>';
  }
echo '</select> <input type="submit" name="CMS_VAR[7]" value="->">';
echo '<br/>'.$amount_of_images_with_description.'/&nbsp;'.count($array_imagelist_work).'&nbsp;'.mi18n("images have descriptions");
echo '</td></tr>';
$image_selected="CMS_VALUE[200]";

if($image_selected!="--?--")
  {
  $filename="CMS_VALUE[200]";
 
  $query = "SELECT template,description FROM gallery_sd WHERE directory='$directory' AND filename='$filename'";
  $result = cRegistry::getDb();
  $result->query($query);
  while($result->nextRecord())
    {
    $arr=$result->toArray();
	$template=$arr[template];
    $description=$arr[description];
    }  
  if($description=="")
    {
	$description=mi18n("no description found");
    $template=1;
	}
  echo '<tr><td><strong>'.mi18n("template").'</strong></td><td>';
  echo '<select id="g_sd_template" name="CMS_VAR[210]">';
        if($template=="1") echo '<option value="1" selected="selected">1 ('.mi18n("template 1 description").')</option>';
                      else echo '<option value="1">1 ('.mi18n("template 1 description").')</option>';
        if($template=="2") echo '<option value="2" selected="selected">2 ('.mi18n("template 2 description").')</option>';
                      else echo '<option value="2">2 ('.mi18n("template 2 description").')</option>';
        if($template=="3") echo '<option value="3" selected="selected">3 ('.mi18n("template 3 description").')</option>';
                      else echo '<option value="3">3 ('.mi18n("template 3 description").')</option>';
        if($template=="4") echo '<option value="4" selected="selected">4 ('.mi18n("template 4 description").')</option>';
                      else echo '<option value="4">4 ('.mi18n("template 4 description").')</option>';
  echo '</select></td></tr>';
  echo '</table>';
  echo '<img src="../cms/'.$directory.$image_selected.'" style="height: 50px;"/><br/>';
  echo '<strong>'.mi18n("description").'</strong> <small>('.mi18n("Important: use |||, ###, [, and ] instead of &, &ldquo;, < and >!").')</small><br/>';
  /*
   important: if you use textarea instead of input for description, it all works well - but if you add a linebreak via enter and save description, configuration of module will not be displayed within configuration-folder of article.
  to correct this, you have to reset assigned template to nothing and back to original template. descriptions of images stay in database, but all other configurations like image order has to be done again!
  following attempts to eliminate linebreaks fail :O(
  
  $arr_search=array("\r\n","\r","\n");
  $arr_replace=array("","","");
  $description=str_replace($arr_search,$arr_replace,"CMS_VALUE[300]");
  $description=nl2br("CMS_VALUE[300]");

  echo '<textarea id="g_sd_description" onKeyPress=\'showDialog()\' rows="10" cols="85" name="CMS_VAR[300]" value="'.$description.'" style="font-size: 12px; font-family: arial;">'.$description.'</textarea><br/>';
  */
  echo '<input id="g_sd_description" size="100%" name="CMS_VAR[300]" value="'.$description.'" style="font-size: 12px; font-family: arial;"><br/>';
  echo '<div>
        <ul>
		  <li>
            <code>[span class=###tpl_f02 tpl_s02 tpl_c03###]Lorem ipsum[/span]</code><br/>
		    -> <span class="tpl_f02 tpl_s02 tpl_c03">Lorem ipsum</span>
		  </li>
		  <li>
            [a href=###http://www.google.de### target=###_blank###]www.google.de[/a]<br/>
			-> <a href="http://www.google.de" target="_blank">http://www.google.de</a>
		  </li>
		</ul>
        <table>
        <tr><td>'.mi18n("font-family").'</td><td style="font-size: 120%;"><span class="tpl_f01">tpl_f01</span> <span class="tpl_f02">tpl_f02</span> <span class="tpl_f03">tpl_f03</span></td></tr>
        <tr><td>'.mi18n("font-size").'</td><td><span class="tpl_s01">tpl_s01</span> <span class="tpl_s02">tpl_s02</span> <span class="tpl_s03">tpl_s03</span></td></tr>
        <tr><td>'.mi18n("font-color").'</td><td><span class="tpl_c01">tpl_c01</span> <span class="tpl_c02">tpl_c02</span> <span class="tpl_c03">tpl_c03</span></td></tr>
        <tr><td>'.mi18n("font-weight").'</td><td><span class="tpl_w01">tpl_w01</span></td></tr>
        <tr><td>'.mi18n("text-decoration").'</td><td><span class="tpl_d01">tpl_d01</span></td></tr>
        </table>
        </div>';
  echo '<div style="text-align: right;">'.mi18n("apply").': ';
        $save_template_description="CMS_VALUE[310]";

echo '<input id="checkbox_save_template_description" type="checkbox" name="CMS_VAR[310]" value="true"';
        if($save_template_description=="true") echo ' checked="checked"';
        echo '/> '.mi18n("yes").' ';
  echo '</div>';

  /***** begin database operations 1 *****/
  $description="CMS_VALUE[300]";
  $query = "SELECT filename FROM gallery_sd WHERE directory='$directory' AND filename='$filename'";
  $result = cRegistry::getDb();
  $result->query($query);
  $amount_of_hits = $result->num_rows;
  while($result->nextRecord())
    {
    $arr=$result->toArray();
    $amount_of_hits=count($arr);
    }
  if($amount_of_hits=="") $amount_of_hits=0;
  if($save_template_description=="true" AND $description!=mi18n("no description found"))
    {
    $template="CMS_VALUE[210]";
    $query = "SELECT filename FROM gallery_sd WHERE directory='$directory' AND filename='$filename'";
    $result = cRegistry::getDb();
    $result->query($query);
    $amount_of_hits = $result->num_rows;
    while($result->nextRecord())
      {
      $arr=$result->toArray();
      $amount_of_hits=count($arr);
      }
    if($amount_of_hits=="") $amount_of_hits=0;
    if($amount_of_hits==1)
      {
	  $update="UPDATE gallery_sd SET description='$description', template='$template' WHERE directory='$directory' AND filename='$filename'";
      if($update = $db->query($update)) echo '<p class="success">'.mi18n("update of description/ template for image successful").'</p>';
	    else echo '<p class="fail">'.mi18n("update of description/ template for image failed").'</p>';
	  }
	  else
	    {
	    $insert="INSERT INTO gallery_sd (directory,filename,description,template) VALUES('$directory','$filename','$description','$template')";
	    if($insert = $db->query($insert)) echo '<p class="success">'.mi18n("insertation of description/ template for image successful").'</p>';
	      else echo '<p class="fail">'.mi18n("insertation of description/ template for image failed").'</p>';
	    }
?>       

    <script type="text/javascript">
    /* this js-part is needed to change the select-box an content of the description-area after saving changes */
    //document.getElementById('g_sd_description').innerHTML='<?php echo $description; ?>'; //needed if textarea is used
	document.getElementById('g_sd_description').value='<?php echo $description; ?>';
    var i = document.getElementById('g_sd_template').selectedIndex;
    var var_template=document.getElementById('g_sd_template').options[i].text;
    document.getElementById('g_sd_template').value='<?php echo $template; ?>';
	
	document.getElementById('checkbox_save_template_description').checked="";
    </script>
  
<?php
    }
  /***** end database operations 1 *****/

  }
else echo '</table>';
echo '</td>';
/*##### sec_templates end #####*/

echo '</tr>';

  /***** begin database operations 2 *****/
  if($search_database=="true")
    {
	echo '<tr><td colspan="2">';
    echo '<p>'.mi18n("searching for unused descriptions").'</p>';
    $dir_search='upload/'.$cms_dirname;
    echo '<u>'.mi18n("directory").': '.$dir_search.'</u><br/>';
    echo '<div style="height: 200px; overflow: auto;">';
    echo '<table>';
    $query = "SELECT filename FROM gallery_sd WHERE directory='$dir_search'";
    $result = cRegistry::getDb();
    $result->query($query);
    $amount_of_hits = $result->num_rows;
    while($result->nextRecord())
      {
      $arr=$result->toArray();
	  //$amount_of_hits=count($arr);
	  if(file_exists($dir.$arr[filename])) echo '<tr><td>'.$arr[filename].'</td><td>'.mi18n("image found").'</td></tr>';
	    else
		  {
		  echo '<tr><td>'.$arr[filename].'</td><td>'.mi18n("image not found, description deleted").'</td></tr>';
		  	$delete="DELETE FROM gallery_sd WHERE directory='$dir_search' AND filename='$arr[filename]'";
            if($delete = $db->query($delete)) echo '';
	          else echo '<tr><td class="fail"> ! '.mi18n("deleting description failed").' ! </td></tr>';
		  }
      }		
    echo '</table>';
    echo '</div>';
	echo '</td></tr>';
    $search_database="false";
    }
/***** end database operations 2 *****/

echo '</table>';
echo '<div style="text-align:right;"><input type="submit" name="CMS_VAR[6]" value="'.mi18n("save").'"></div>'; 
echo '</div>';

/*******************************************/
/***** end assigning images to gallery *****/
/*******************************************/

if($popup=="true") echo '</div>';
?>

<?php
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Beitrag von McHubi » Di 13. Dez 2022, 12:31

OUTPUT

Code: Alles auswählen

<?php
/***********************************************
* CONTENIDO MODUL - OUTPUT
*
* Modulname   :     gallery_sd
* Author(s)   :     www.Seamless-Design.de Markus Hübner
* Copyright   :     www.Seamless-Design.de Markus Hübner
* Created     :     04.2012
* Modified : Markus Hübner for contenido 4.9.x 7/2014
************************************************/

/***** begin declaring variables *****/
$current_thumbtable=htmlspecialchars(strip_tags($_GET['ctt']));
if($current_thumbtable=="") $current_thumbtable=1;
$status=htmlspecialchars(strip_tags($_GET['status']));
if($status=="") $status="tt"; // tt: thumbtable, sp: single picture

$dir_preview="upload/CMS_VALUE[2]vorschau/"; // directory of preview images
$dir="upload/CMS_VALUE[2]"; // directory of fullsize images
$thumb_maximum_size="CMS_VALUE[50]";
$amount_of_rows="CMS_VALUE[60]";
if($amount_of_rows=="") $amount_of_rows=3;
$amount_of_columns="CMS_VALUE[65]";
if($amount_of_columns=="") $amount_of_columns=5;
$thumbs_per_thumbtable=$amount_of_rows*$amount_of_columns;
$order_of_appearance="CMS_VALUE[100]";
$navigation_thumbtable_top="CMS_VALUE[400]";
$navigation_thumbtable_bottom="CMS_VALUE[410]";
$navigation_sp_top="CMS_VALUE[420]";
$navigation_sp_bottom="CMS_VALUE[430]";
$navi_icon_previous="upload/module/gallery_sd/g-sd-arrow-left.png";
$navi_icon_previous_alt_title=mi18n("previous");
$navi_icon_overview="upload/module/gallery_sd/g-sd-overview.png";
$navi_icon_overview_alt_title=mi18n("overview");
$navi_icon_next="upload/module/gallery_sd/g-sd-arrow-right.png";
$navi_icon_next_alt_title=mi18n("next");
$path_bullets='upload/module/gallery_sd/';
$sp_fullscreen="CMS_VALUE[500]";
$style_div_g_sd_sp_main_fullscreen="CMS_VALUE[510]";
$responsive_stage="CMS_VALUE[515]";
$sp_stage_max_width="CMS_VALUE[520]";
$sp_stage_max_height="CMS_VALUE[530]";
$sp_stretch="CMS_VALUE[540]";
$sp_preload="CMS_VALUE[550]";
$gallery_effect="CMS_VALUE[600]";
$sp_effect="CMS_VALUE[620]";
$effect_speed="CMS_VALUE[630]";
/***** end declaring variables *****/
?>

<script type="text/javascript">
function fader(step) {
            step = step || 0;
            document.getElementById("fadeBlock").style.opacity = step/100;
            document.getElementById("fadeBlock").style.filter = "alpha(opacity=" + step + ")"; // IE
            step = step + <?php echo $effect_speed; ?>;
            if (step <= 100) {
                window.setTimeout(function () { fader(step); }, 1);
            }
        }
</script>

<?php
/***** begin php-functions *****/
function navigation_thumbtable($idart,$lang,$current_thumbtable,$amount_of_thumbtables)
  {
  global $navi_icon_previous,$navi_icon_previous_alt_title,$navi_icon_next,$navi_icon_next_alt_title;
  $i=1;
  echo '<div class="g_sd_tt_nav_container">';
  $thumbtable_prev=$current_thumbtable-1;
  $thumbtable_next=$current_thumbtable+1;
  if($thumbtable_prev>0) echo '<a class="g_sd_tt_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable_prev.'&amp;status=tt#gsd_start_tt" title="'.$navi_icon_previous_alt_title.'"><img src="'.$navi_icon_previous.'" title="'.$navi_icon_previous_alt_title.'" alt="'.$navi_icon_previous_alt_title.'"/></a> ';
  while($i<=$amount_of_thumbtables)
    {
    if($i==$current_thumbtable) echo '<span class="g_sd_tt_nav_active_table">'.$i.'</span>';
      else echo '<a class="g_sd_tt_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$i.'&amp;status=tt#gsd_start_tt">'.$i.'</a>';
    echo '&nbsp;';
    $i++;
    }
  if($thumbtable_next<=$amount_of_thumbtables) echo '<a class="g_sd_tt_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable_next.'&amp;status=tt#gsd_start_tt" title="'.$navi_icon_next_alt_title.'"><img src="'.$navi_icon_next.'" title="'.$navi_icon_next_alt_title.'" alt="'.$navi_icon_next_alt_title.'"/></a>';;
  echo '</div>';
  }
  

function navigation_single_picture($idart,$lang,$current_picture,$amount_of_pictures,$thumbs_per_thumbtable,$array_order_of_appearance,$navigation_sp_top,$navigation_sp_bottom,$top_or_bottom)
  {
  global $navi_icon_previous,$navi_icon_previous_alt_title,$navi_icon_overview,$navi_icon_overview_alt_title,$navi_icon_next,$navi_icon_next_alt_title,$picture_prev,$picture_next,$thumbtable;
  $thumbtable=($current_picture/$thumbs_per_thumbtable)+1;
  $thumbtable = explode(".",$thumbtable);
  if(substr($number[1],1,1) == "") $number[1] = $number[1] . "0";
  $thumbtable = $thumbtable[0]; 
  $picture_prev=$current_picture-1;
  $picture_next=$current_picture+1;
  if($top_or_bottom=="top")
    {
    if($navigation_sp_top=="true")
      {
      echo '<div class="g_sd_sp_nav">';
      if($picture_prev>=0) echo '<a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp#gsd_start_sp" title="'.$navi_icon_previous_alt_title.'"><img src="'.$navi_icon_previous.'" title="'.$navi_icon_previous_alt_title.'" alt="'.$navi_icon_previous_alt_title.'"/></a>';
      echo ' <a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt#gsd_start_tt" title="'.$navi_icon_overview_alt_title.'"><img src="'.$navi_icon_overview.'" title="'.$navi_icon_overview_alt_title.'" alt="'.$navi_icon_overview_alt_title.'"/></a> ';
      if($picture_next<=$amount_of_pictures) echo '<a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp#gsd_start_sp"  title="'.$navi_icon_next_alt_title.'"><img src="'.$navi_icon_next.'" title="'.$navi_icon_next_alt_title.'" alt="'.$navi_icon_next_alt_title.'"/></a>';
      echo '</div>';
      }
      else echo '<div class="g_sd_sp_nav">&nbsp;</div>';
    }
  if($top_or_bottom=="bottom")
    {
    if($navigation_sp_bottom=="true")
      {
      echo '<div class="g_sd_sp_nav">';
      if($picture_prev>=0) echo '<a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp#gsd_start_sp" title="'.$navi_icon_previous_alt_title.'"><img src="'.$navi_icon_previous.'" title="'.$navi_icon_previous_alt_title.'" alt="'.$navi_icon_previous_alt_title.'"/></a>';
      echo ' <a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt#gsd_start_tt" title="'.$navi_icon_overview_alt_title.'"><img src="'.$navi_icon_overview.'" title="'.$navi_icon_overview_alt_title.'" alt="'.$navi_icon_overview_alt_title.'"/></a> ';
      if($picture_next<=$amount_of_pictures) echo '<a class="g_sd_sp_nav" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp#gsd_start_sp"  title="'.$navi_icon_next_alt_title.'"><img src="'.$navi_icon_next.'" title="'.$navi_icon_next_alt_title.'" alt="'.$navi_icon_next_alt_title.'"/></a>';
      echo '</div>';
      }
      else echo '<div class="g_sd_sp_nav">&nbsp;</div>';
    }
  }
/***** end php-functions *****/



/***** begin building arrays *****/
$order_of_appearance=str_replace("\r\n","",$order_of_appearance);
$order_of_appearance=str_replace(".jpg",".jpg###",$order_of_appearance);
$order_of_appearance=str_replace(".png",".png###",$order_of_appearance);
$order_of_appearance=str_replace(".gif",".gif###",$order_of_appearance);

$array_order_of_appearance = explode("###", $order_of_appearance);

$array_imagelist=array();
foreach($array_order_of_appearance AS $datei)
  {
  if($datei!="")
    {
    $info = getImageSize($dir_preview.$datei);
    array_push($array_imagelist, array(fileMtime($dir_preview. $datei),$datei,$info[0],$info[1]));
    }
  }

$amount_of_thumbtables=count($array_imagelist)/($amount_of_rows*$amount_of_columns);
$amount_of_thumbtables_rounded=round(count($array_imagelist)/($amount_of_rows*$amount_of_columns));
if($amount_of_thumbtables>$amount_of_thumbtables_rounded) $amount_of_thumbtables=$amount_of_thumbtables_rounded+1;
  else $amount_of_thumbtables=$amount_of_thumbtables_rounded;
  
$amount_of_pictures=count($array_imagelist);
$amount_of_pictures=$amount_of_pictures-1; //without this correction the last picture in single-picture-mode would display button to switch to next picture
//print_r($array_imagelist);
//echo '<br/>amount_of_thumbtables: '.$amount_of_thumbtables.'<br/>';

/***** end building arrays *****/










if($status=="tt")
{
/**************************************/
/********** BEGIN THUMBTABLE **********/
/**************************************/

/***** begin building navigation top *****/
echo '<a name="gsd_start_tt"></a>';
if($navigation_thumbtable_top=="true") navigation_thumbtable($idart,$lang,$current_thumbtable,$amount_of_thumbtables);
/***** end building navigation top *****/


/***** begin building thumbtable *****/
$last_thumb=$current_thumbtable*$thumbs_per_thumbtable;
$first_thumb=$last_thumb-$thumbs_per_thumbtable;
$last_thumb=$last_thumb-1;

echo '<div class="g_sd_tt_container">';
//echo '<div id="prel_stat" style="display: none;"><span id="prel_stat_info"></span><span id="prel_stat_curr_im"></span> / <span id="prel_stat_tot_im"></span></div>';
echo '<div id="statusBox" style="position:relative;width:50%; border:solid 0px #000000; display:none;margin-left:auto; margin-right: auto; text-align: center;">';
echo '<div style="height: 20px; width: 100%; border: 1px solid #000000;">';
echo '<div id="statusBar" style="position:absolute;height:20px;overflow:hidden;background-color:#999999;"></div>';
echo '<div id="statusText" style="position:absolute;width:100%;height:20px;text-align:center; font-size: 16px;"></div>';
echo '</div>';
echo '<div><span id="curr_img"></span> von <span id="tot_img"></span> '.mi18n("pictures loaded").'</div>';
echo '</div>';
echo '<div id="preloadBox" style="display:none"></div>';
?>

<script type="text/javascript">

function getObj(objId)
{
return document.getElementById(objId);
}

function initPage()
  {
  document.getElementById('statusBox').style.display="block";
  var var_order_of_appearance="<?php echo $order_of_appearance; ?>";
  var imgNames=var_order_of_appearance.split("###");
  document.getElementById('tot_img').innerHTML=imgNames.length;
  var imgPath = "<?php echo $dir; ?>";
oStatusBox = getObj( "statusBox" );
oStatusBar = getObj( "statusBar" );
oStatusText = getObj( "statusText" );
oPreloadBox = getObj( "preloadBox" );
oTheImageLinks = getObj( "theImageLinks" );
oTheImage = getObj( "theImage" );
statusBoxWidth = parseInt( oStatusBox.clientWidth );
imagesLoaded = 0;
images2Preload = imgNames.length;
for (var i = 0 ; i < imgNames.length ; i++ )
  {
  var newImage = new Image();
    newImage.onload = imageIsLoaded;
    oPreloadBox.appendChild( newImage );
    newImage.src = imgPath + imgNames[i];
    }
}


function imageIsLoaded( evt )
  {
evt = evt || window.event;
newImage = this;
    ++imagesLoaded;
    document.getElementById('curr_img').innerHTML=imagesLoaded;
    var alreadyLoaded = Math.round( 100 * imagesLoaded / images2Preload );
    oStatusText.innerHTML = alreadyLoaded + " %";
    oStatusBar.style.width = ( statusBoxWidth * alreadyLoaded / 100 )+'%';
    document.getElementById('statusBar').style.width=alreadyLoaded+'%';
    if ( imagesLoaded == (images2Preload-1) )
      {
      localStorage.setItem('<?php echo $dir; ?>','false');
      document.getElementById('statusBox').style.display="none";
    }
  }

var var_preload_sp="<?php echo $sp_preload; ?>";
if(var_preload_sp=="true")
  {
  var var_g_sd_preload_folder=localStorage.getItem('<?php echo $dir; ?>');
  //alert('var_g_sd_preload_folder'+var_g_sd_preload_folder);
  if(var_g_sd_preload_folder!="false") initPage();
  }

/*<?php echo ' onLoad=\"BilderVorladen(\"'.$dir.$array_order_of_appearance[$i].'\',\''.$dir.'\');"';?>*/
</script>
<?php
echo '<hr>';
//print_r($array_order_of_appearance);
echo '<table class="g_sd_tt" style="opacity: 1;">';
$i=$first_thumb;
$c=1;
while($i<=$last_thumb)
  {
  if($c==1) echo '<tr>';
  if($array_order_of_appearance[$i]!="")
    {
    echo '<td class="g_sd_tt_td">';
if($array_imagelist[$i][2]>$array_imagelist[$i][3])
  {
  $img_vert="false";
  }
  else
    {
$img_vert="true";
$max_height=$array_imagelist[$i][2];
$asp_ratio=$array_imagelist[$i][2]/$array_imagelist[$i][3];
$div_vert_width=100*$asp_ratio;
$div_vert_margin_left=(100-$div_vert_width)/2; //needed for center alignment
/*
echo $array_imagelist[$i][2].'x'.$array_imagelist[$i][3].'<br/>';
echo '$asp_ratio: '.$asp_ratio.'<br/>';
echo '$div_vert_width: '.$div_vert_width.'<br/>';
echo '$div_vert_margin_left: '.$div_vert_margin_left.'<br/>';
*/
}
if($img_vert=="true") echo '<div style="width: '.$div_vert_width.'%; margin-left: '.$div_vert_margin_left.'%;">';
    echo'<a class="g_sd_tt_thumb" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$i.'&amp;filename='.$array_order_of_appearance[$i].'&amp;status=sp">
          <img';
          if($gallery_effect=="true") echo ' class="g_sd_fade_in_sp"';
  echo ' src="'.$dir_preview.$array_order_of_appearance[$i].'" alt="'.$array_order_of_appearance[$i].'" title="'.$array_order_of_appearance[$i].'" style="width: 100%; height: auto;"/>
          </a>';
        if($img_vert=="true") echo '</div>';
    echo '</td>';
    }
    else
      {
      echo '<td class="g_sd_tt_td_empty">';
  echo '<div class="g_sd_tt_thumb_empty">
            &nbsp;
            </div>
            </td>';
      }
  if($c==$amount_of_columns)
    {
    echo '</tr>';
    $c=0;
    }
  $i++;
  $c++;
  }
  
echo '</table>';
echo '</div>';
/***** end building thumbtable *****/



/***** begin building navigation bottom *****/
if($navigation_thumbtable_bottom=="true")
  {
  echo '<hr>';
  navigation_thumbtable($idart,$lang,$current_thumbtable,$amount_of_thumbtables);
  }
/***** end building navigation bottom *****/
echo '<br/>';

/************************************/
/********** END THUMBTABLE **********/
/************************************/
}






if($status=="sp")
{
/******************************************/
/********** BEGIN SINGLE PICTURE **********/
/******************************************/
$i=htmlspecialchars(strip_tags($_GET['picture']));
$filename=htmlspecialchars(strip_tags($_GET['filename']));

if($sp_fullscreen=="true") echo '<div class="g_sd_sp_main_fullscreen" style="'.$style_div_g_sd_sp_main_fullscreen.'">';
  else echo '<div class="g_sd_sp_main"><a name="gsd_start_sp"></a>';

if($array_order_of_appearance[$i]!=$filename) //if a picture was shared or bookmarked and the order of appearance changed meanwhile, it can not be found at the same place in array. so here is a check if the filename is similar to the position in array
  {
  $i=array_search($filename,$array_order_of_appearance);
  }
navigation_single_picture($idart,$lang,$i,$amount_of_pictures,$thumbs_per_thumbtable,$array_order_of_appearance,$navigation_sp_top,$navigation_sp_bottom,'top');

      $query = "SELECT * FROM gallery_sd WHERE directory='$dir' AND filename='$array_order_of_appearance[$i]'";
      $result = cRegistry::getDb();
      $result->query($query);
      while($result->nextRecord())
       {
       $arr=$result->toArray();
       $template=$arr[template];
       $description=$arr[description];
   //echo 'print_r($arr): '; print_r($arr);
       }  
     if($description=="")
       {
   $description=mi18n("no description found output");
       $template=1;
   }
   else
     {
 //$description=str_replace("###","\"",$description);
 $arr_search=array("###","[","]","|||");
 $arr_replace=array("\"","<",">","&");
 $description=str_replace($arr_search,$arr_replace,$description);
 }
 $size=getimagesize("$dir"."$array_order_of_appearance[$i]");
 $width=$size[0];
 $height=$size[1]; 

/*
  echo '$size: '.$size.'<br/>';
  echo '$width: '.$width.'<br/>';
  echo '$height: '.$height.'<br/>';
  echo '$template: '.$template.'<br/>';
  echo '$description: '.$description.'<br/>';
  echo '$sp_fullscreen: '.$sp_fullscreen.'<br/>';
  echo '$responsive_stage: '.$responsive_stage.'<br/>';
*/
?>

<script type="text/javascript">
var var_sp_fullscreen="<?php echo $sp_fullscreen; ?>";
if(var_sp_fullscreen=="true")
  {
  var window_inner_width = 0, window_inner_height = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    window_inner_width = window.innerWidth;
    window_inner_height = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    window_inner_width = document.documentElement.clientWidth;
    window_inner_height = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    window_inner_width = document.body.clientWidth;
    window_inner_height = document.body.clientHeight;
  }
  //window.alert( 'Width = ' + window_inner_width );
  //window.alert( 'Height = ' + window_inner_height ); 
  var var_corr=0.99; // needed to prevent scrollbars in fullscreen-mode
  var var_sp_stage_max_width=window_inner_width*var_corr;
  var var_sp_stage_max_height=(window_inner_height-35)*var_corr; // -35 -> height of navigation-div
  }
  else
    {
    var var_sp_stage_max_width='<?php echo $sp_stage_max_width; ?>';
    var var_sp_stage_max_height='<?php echo $sp_stage_max_height; ?>';
    }
  var var_sp_orig_width=<?php echo $width; ?>;
  var var_sp_orig_height=<?php echo $height; ?>;
  var var_sp_stretch="<?php echo $sp_stretch; ?>";
  var var_sp_width=var_sp_stage_max_width;
  var var_responsive_stage="<?php echo $responsive_stage; ?>";
</script>



<?php
if($sp_effect=="true")
  {
  ?>
  <script type="text/javascript">
  var var_class_sp="g_sd_fade_in_sp";
  </script>
  <?php
  }
  else 
    {
    ?>
    <script type="text/javascript">
    var var_class_sp="";
    </script>
    <?php
    }


	
/********** templates begin **********/
if($template==1)
  {
  ?>
  <script type="text/javascript">
  /*document.write('<div style="text-align: center;" id="fadeBlock">');*/
  /* if the anchor-tag is empty, in ie there will not be any field for clicking. so it has to be filled with some not-visual blankspaces. font-size is increased to enlarge the field vertically. any tries to define the size in other ways via css width, height and so on were failures. */
  //alert('var_sp_fullscreen: '+var_sp_fullscreen+' / var_responsive_stage: '+var_responsive_stage);
  if(var_sp_fullscreen=="" && var_responsive_stage=="true")
    {
    document.write('<div style="text-align: center;">');
      document.write('<img class="'+var_class_sp+'" id="g_sd_sp" style="background-color: transparent; max-width: 100%; height: auto;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
    document.write('</div>');
	}
    else
	  {
  var var_sp_height_mult=var_sp_width/var_sp_orig_width;
  var var_sp_height=var_sp_orig_height*var_sp_height_mult;
  if(var_sp_height>var_sp_stage_max_height)
    {
    var_sp_height=var_sp_stage_max_height;
    var_sp_width_mult=var_sp_stage_max_height/var_sp_orig_height;
    var_sp_width=var_sp_orig_width*var_sp_width_mult;
    }
  if(var_sp_stretch!="true" && var_sp_width>var_sp_orig_width) var_sp_width=var_sp_orig_width;
  if(var_sp_stretch!="true" && var_sp_height>var_sp_orig_height) var_sp_height=var_sp_orig_height;
  var var_sp_naviarea_width=var_sp_width/3.1;
  
      document.write('<div style="text-align: center;">');
        document.write('<img class="'+var_class_sp+'" id="g_sd_sp" style="background-color: transparent; width:'+var_sp_width+'px; height: '+var_sp_height+'px;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
          document.write('<div style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;margin-left: auto; margin-right: auto;position: relative;margin-top: -'+var_sp_height+'px;">');
            document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php if($picture_prev>=0) {echo '<a class="g_sd_sp_nav_layer_prev" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp" title="'.$navi_icon_previous_alt_title.'"><img style="height: 100%; width: 100%;" src="'.$path_bullets.'g-sd-sp-layer-ie-linkpicture.gif"/></a>'; } else echo '&nbsp;';?>');
            document.write('</div>');
			document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php echo '<a class="g_sd_sp_nav_layer_close" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt#gsd_start_tt" title="'.$navi_icon_overview_alt_title.'"><img style="height: 100%; width: 100%;" src="'.$path_bullets.'g-sd-sp-layer-ie-linkpicture.gif"/></a>'; ?>');
            document.write('</div>');
			document.write('<div style="float: right; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php if($picture_next<=$amount_of_pictures) {echo '<a class="g_sd_sp_nav_layer_next" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp" title="'.$navi_icon_next_alt_title.'"><img style="height: 100%; width: 100%;" src="'.$path_bullets.'g-sd-sp-layer-ie-linkpicture.gif"/></a>';} else echo '&nbsp;'; ?>');
            document.write('</div>');
         document.write('</div>');
       document.write('</div>');
	   }
  </script>
  <?php
  }
  
if($template==2)
  {
  ?>
  <script type="text/javascript">
  if(var_sp_fullscreen=="" && var_responsive_stage=="true")
    {
    document.write('<div style="text-align: center;">');
	  document.write('<div style="width: 70%; float: left;">');
        document.write('<img class="'+var_class_sp+'" id="g_sd_sp" style="background-color: transparent; max-width: 100%; height: auto;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
	  document.write('</div>');
	  document.write('<div style="width: 28%; float: left; padding: 1%;text-align: left;">');
        document.write('<?php echo $description; ?>');
	  document.write('</div>');
    document.write('</div>');
	}
    else
	  {
  var var_left_width=var_sp_stage_max_width*0.67;
  var var_right_width=var_sp_stage_max_width*0.3;
  var var_sp_max_width=var_left_width;
  var var_sp_max_height=var_sp_stage_max_height;
  var var_sp_width=var_sp_max_width;
  var var_calc_factor=var_sp_max_width/var_sp_orig_width;
  var var_sp_height=var_sp_orig_height*var_calc_factor;
  if(var_sp_height>var_sp_stage_max_height)
    {
    var_sp_height=var_sp_stage_max_height;
    var var_reduce_factor=var_sp_height/var_sp_orig_height;
    var_sp_width=var_sp_orig_width*var_reduce_factor;
    }
  if(var_sp_stretch!="true" && var_sp_width>var_sp_orig_width) var_sp_width=var_sp_orig_width;
  if(var_sp_stretch!="true" && var_sp_height>var_sp_orig_height) var_sp_height=var_sp_orig_height;
  var var_sp_naviarea_width=var_sp_width/3.1;

    document.write('<div style="width:'+var_sp_stage_max_width+'px; margin-left: auto; margin-right: auto;">');
      /*document.write('<div id="fadeBlock" style="float: left; width: '+var_left_width+'px; text-align: center;">');*/
      /* if the anchor-tag is empty, in ie there will not be any field for clicking. so it has to be filled with some not-visual blankspaces. font-size is increased to enlarge the field vertically. any tries to define the size in other ways via css width, height and so on were failures. */
      document.write('<div style="float: left; width: '+var_left_width+'px; text-align: center;">');
        document.write('<img class="'+var_class_sp+'" style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
          document.write('<div style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;margin-left: auto; margin-right: auto;position: relative;margin-top: -'+var_sp_height+'px;">');
            document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php if($picture_prev>=0) {echo '<a class="g_sd_sp_nav_layer_prev" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp" title="'.$navi_icon_previous_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; } else echo '&nbsp;';?>');
            document.write('</div>');
		    document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php echo '<a class="g_sd_sp_nav_layer_close" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt" title="'.$navi_icon_overview_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; ?>');
            document.write('</div>');
			document.write('<div style="float: right; width: '+var_sp_naviarea_width+'px;">');
              document.write('<?php if($picture_next<=$amount_of_pictures) {echo '<a class="g_sd_sp_nav_layer_next" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp"  title="'.$navi_icon_next_alt_title.'">&nbsp;&nbsp;&nbsp;</a>';} else echo '&nbsp;'; ?>');
            document.write('</div>');
          document.write('</div>');
        document.write('</div>');
        document.write('<div style="float: left; width: '+var_right_width+'px; padding: 3px;">');
          document.write('<?php echo $description; ?>');
        document.write('</div>');
      document.write('</div>');
      }
  </script>
  <?php
  }
  
  
if($template==3)
  {
  ?>
  <script type="text/javascript">
  if(var_sp_fullscreen=="" && var_responsive_stage=="true")
    {
    document.write('<div style="text-align: center;">');
	  document.write('<div style="width: 28%; float: left; padding: 1%;text-align: left;">');
        document.write('<?php echo $description; ?>');
	  document.write('</div>');
	  document.write('<div style="width: 70%; float: left;">');
        document.write('<img class="'+var_class_sp+'" id="g_sd_sp" style="background-color: transparent; max-width: 100%; height: auto;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
	  document.write('</div>');
    document.write('</div>');
	}
    else
	  {  
  var var_left_width=var_sp_stage_max_width*0.3;
  var var_right_width=var_sp_stage_max_width*0.67;
  var var_sp_max_width=var_right_width;
  var var_sp_max_height=var_sp_stage_max_height;
  var var_sp_width=var_sp_max_width;
  var var_calc_factor=var_sp_max_width/var_sp_orig_width;
  var var_sp_height=var_sp_orig_height*var_calc_factor;
  if(var_sp_height>var_sp_stage_max_height)
    {
    var_sp_height=var_sp_stage_max_height;
    var var_reduce_factor=var_sp_height/var_sp_orig_height;
    var_sp_width=var_sp_orig_width*var_reduce_factor;
    }
  if(var_sp_stretch!="true" && var_sp_width>var_sp_orig_width) var_sp_width=var_sp_orig_width;
  if(var_sp_stretch!="true" && var_sp_height>var_sp_orig_height) var_sp_height=var_sp_orig_height;
  var var_sp_naviarea_width=var_sp_width/3.1;

      document.write('<div style="width:'+var_sp_stage_max_width+'px; margin-left: auto; margin-right: auto;">');
        document.write('<div style="float: left; width: '+var_left_width+'px; padding: 3px;">');
          document.write('<?php echo $description; ?>');
        document.write('</div>');
        /*document.write('<div id="fadeBlock" style="float: left; width: '+var_right_width+'px; text-align: center;">');*/
        /*if the anchor-tag is empty, in ie there will not be any field for clicking. so it has to be filled with some not-visual blankspaces. font-size is increased to enlarge the field vertically. any tries to define the size in other ways via css width, height and so on were failures. */
        document.write('<div style="float: left; width: '+var_right_width+'px; text-align: center;">');
          document.write('<img class="'+var_class_sp+'" style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
            document.write('<div style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;margin-left: auto; margin-right: auto;position: relative;margin-top: -'+var_sp_height+'px;">');
              document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php if($picture_prev>=0) {echo '<a class="g_sd_sp_nav_layer_prev" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp" title="'.$navi_icon_previous_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; } else echo '&nbsp;';?>');
              document.write('</div>');
			  document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php echo '<a class="g_sd_sp_nav_layer_close" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt" title="'.$navi_icon_overview_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; ?>');
              document.write('</div>');
			  document.write('<div style="float: right; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php if($picture_next<=$amount_of_pictures) {echo '<a class="g_sd_sp_nav_layer_next" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp"  title="'.$navi_icon_next_alt_title.'">&nbsp;&nbsp;&nbsp;</a>';} else echo '&nbsp;'; ?>');
              document.write('</div>');
            document.write('</div>');
          document.write('</div>');
        document.write('</div>');
        }
  </script>
  <?php
  }
  
  
if($template==4)
  {
  ?>
  <script type="text/javascript">
  if(var_sp_fullscreen=="" && var_responsive_stage=="true")
    {
    document.write('<div style="text-align: center;">');
	  document.write('<div style="width: 100%;">');
        document.write('<img class="'+var_class_sp+'" id="g_sd_sp" style="background-color: transparent; max-width: 100%; height: auto;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
	  document.write('</div>');
	  document.write('<div style="width: 98%; padding: 1%;text-align: left;text-align: left;">');
        document.write('<?php echo $description; ?>');
	  document.write('</div>');
    document.write('</div>');
	}
    else
	  {    
  var var_top_width=var_sp_stage_max_width;
  var var_bottom_width=var_sp_stage_max_width;
  var var_sp_max_width=var_top_width;
  var var_sp_max_height=var_sp_stage_max_height;
  var var_sp_width=var_sp_max_width;
  var var_calc_factor=var_sp_max_width/var_sp_orig_width;
  var var_sp_height=var_sp_orig_height*var_calc_factor;
  if(var_sp_height>var_sp_stage_max_height)
    {
    var_sp_height=var_sp_stage_max_height;
    var var_reduce_factor=var_sp_height/var_sp_orig_height;
    var_sp_width=var_sp_orig_width*var_reduce_factor;
    }
  if(var_sp_stretch!="true" && var_sp_width>var_sp_orig_width) var_sp_width=var_sp_orig_width;
  if(var_sp_stretch!="true" && var_sp_height>var_sp_orig_height) var_sp_height=var_sp_orig_height;
  var var_sp_naviarea_width=var_sp_width/3.1;

      document.write('<div style="width:'+var_sp_stage_max_width+'px; margin-left: auto; margin-right: auto;">');
      /*document.write('<div id="fadeBlock" style="width: '+var_top_width+'px; text-align: center;">');*/
      /* if the anchor-tag is empty, in ie there will not be any field for clicking. so it has to be filled with some not-visual blankspaces. font-size is increased to enlarge the field vertically. any tries to define the size in other ways via css width, height and so on were failures. */
        document.write('<div style="width: '+var_top_width+'px; text-align: center;">');
          document.write('<img class="'+var_class_sp+'" style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;" src="<?php echo $dir.$array_order_of_appearance[$i]; ?>" alt="<?php echo $array_order_of_appearance[$i]; ?>" title="<?php echo $array_order_of_appearance[$i]; ?>"/>');
            document.write('<div style="width:'+var_sp_width+'px; height: '+var_sp_height+'px;margin-left: auto; margin-right: auto;position: relative;margin-top: -'+var_sp_height+'px;">');
              document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php if($picture_prev>=0) {echo '<a class="g_sd_sp_nav_layer_prev" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_prev.'&amp;filename='.$array_order_of_appearance[$picture_prev].'&amp;status=sp" title="'.$navi_icon_previous_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; } else echo '&nbsp;';?>');
              document.write('</div>');
			  document.write('<div style="float: left; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php echo '<a class="g_sd_sp_nav_layer_close" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;ctt='.$thumbtable.'&amp;status=tt" title="'.$navi_icon_overview_alt_title.'">&nbsp;&nbsp;&nbsp;</a>'; ?>');
              document.write('</div>');
			  document.write('<div style="float: right; width: '+var_sp_naviarea_width+'px;">');
                document.write('<?php if($picture_next<=$amount_of_pictures) {echo '<a class="g_sd_sp_nav_layer_next" style="height:' ?>'+var_sp_height+'<?php echo 'px; line-height:' ?>'+var_sp_height+'<?php echo 'px;" href="front_content.php?idart='.$idart.'&amp;lang='.$lang.'&amp;picture='.$picture_next.'&amp;filename='.$array_order_of_appearance[$picture_next].'&amp;status=sp"  title="'.$navi_icon_next_alt_title.'">&nbsp;&nbsp;&nbsp;</a>';} else echo '&nbsp;'; ?>');
              document.write('</div>');
            document.write('</div>');
          document.write('</div>');
          document.write('<div style="width: '+var_bottom_width+'px; padding: 3px; text-align: center;">');
            document.write('<?php echo $description; ?>');
          document.write('</div>');
        document.write('</div>');
        }
  </script>
  <?php
  }
  
/********** templates end **********/

if($navigation_sp_bottom=="true")
  {
  echo '<div style="clear:both;">';
  navigation_single_picture($idart,$lang,$i,$amount_of_pictures,$thumbs_per_thumbtable,$array_order_of_appearance,$navigation_sp_top,$navigation_sp_bottom,'bottom');
  echo '</div>';
  }

echo '</div>';

/****************************************/
/********** END SINGLE PICTURE **********/
/****************************************/
}
?>
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

McHubi
Beiträge: 1209
Registriert: Do 18. Nov 2004, 23:06
Wohnort: Mettmann
Kontaktdaten:

Re: Galerie gallery_sd mit Templates für Bildbeschreibungen 4.9

Beitrag von McHubi » Di 13. Dez 2022, 12:32

CSS

Code: Alles auswählen

/*http://forum.contenido.org/viewtopic.php?f=92&t=34825*/
a.gsd_download {
color: #01802e;
background-image: url('../upload/module/gallery_sd/icon-download-001.png');
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
padding-left: 2em;
}
a.gsd_download:hover {
color: #ff0000;
}
a.gsd_text {
color: #01802e;
background-image: url('../upload/module/gallery_sd/icon-link-001.png');
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
padding-left: 2em;
}
a.gsd_text:hover {
color: #ff0000;
}

a.g_sd_sp_nav_layer_prev,
a.g_sd_sp_nav_layer_next,
a.g_sd_sp_nav_layer_close {
display: block;
text-decoration:none;
font-size: 5em;
}
a.g_sd_sp_nav_layer_prev:hover {
background-image: url('../upload/module/gallery_sd/g-sd-sp-layer-prev.png');
background-repeat: no-repeat;
background-position: left center;
}
a.g_sd_sp_nav_layer_next:hover {
background-image: url('../upload/module/gallery_sd/g-sd-sp-layer-next.png');
background-repeat: no-repeat;
background-position: right center;
}
a.g_sd_sp_nav_layer_close:hover {
background-image: url('../upload/module/gallery_sd/g-sd-sp-layer-close.png');
background-repeat: no-repeat;
background-position: center center;
}
div.g_sd_tt_nav_container a {
color: #333333;
}
a.g_sd_tt_nav,
a.g_sd_sp_nav {
font-size:1.2em;
color:#666666;
text-decoration:none;
transition:opacity 2s;
-moz-transition:opacity 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:opacity 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:opacity 2s, -o-transform 2s; /* Opera */
opacity: 1;
}
a.g_sd_tt_nav:hover,
a.g_sd_sp_nav:hover {
color:#ffffff;
text-shadow: 2px 0 2px #333333, -2px 0 2px #333333;
opacity: 1;
transition:opacity 2s;
-moz-transition:opacity 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:opacity 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:opacity 2s, -o-transform 2s; /* Opera */
}
a.g_sd_tt_thumb {
text-decoration: none;
}







div.gsd_info {
margin: 1em;
padding: 1em;
border: 1px solid #01802e;
}


div.g_sd_sp_main {
}
div.g_sd_sp_main_fullscreen {
background-color: #ffffff;
z-index: 1000;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}
div.g_sd_sp_nav {
text-align: center;
padding-top: 5px;
height: 30px;
}


div.g_sd_tt_container {
border: 0px solid #999999;
}
div.g_sd_tt_nav_container {
text-align: center;
}
div.g_sd_tt_thumb_empty {
border: 1px solid transparent;
display: table-cell;
vertical-align: middle;
padding: 5px;
height: 100%;
width: 100%;
}
div.g_sd_tt_thumb_empty:hover {
}


span.tpl_f01 {font-family: arial;}
span.tpl_f02 {font-family: times;}
span.tpl_f03 {font-family: garamond;}
span.tpl_c01 {color: #999999;}
span.tpl_c02 {color: #666666;}
span.tpl_c03 {color: #ff0000;}
span.tpl_s01 {font-size: 150%;}
span.tpl_s02 {font-size: 130%;}
span.tpl_s03 {font-size: 110%;}
span.tpl_w01 {font-weight: 900;}
span.tpl_d01 {text-decoration: underline;}

span.g_sd_tt_nav_active_table {
font-weight: 900;
color: #333333;
}
span.g_sd_tt_nav {
cursor: pointer;
}

table.g_sd_tt {
align:center;
margin-left: auto;
margin-right: auto;
opacity: 0;
}
td.g_sd_tt_td {
text-align: center;
padding: 1em;
}
td.g_sd_tt_td:hover {
background-color: #9f9f9f;
}
td.g_sd_tt_td_empty {
text-align: center;
padding: 1em;
}
img.g_sd_fade_in_sp{
opacity:0;
-webkit-animation:fadeIn ease-in 1;
-moz-animation:fadeIn ease-in 1;
-o-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation-fill-mode:forwards;
-moz-animation-fill-mode:forwards;
-o-animation-fill-mode:forwards;
animation-fill-mode:forwards;
-webkit-animation-duration:1s;
-moz-animation-duration:1s;
-o-animation-duration:1s;
animation-duration:1s;
}
img.g_sd_fade_in_sp{ /*hack ie7,8,9*/
opacity /*\**/: 1;
}
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
LANG

Code: Alles auswählen

Are you sure? This action can not be restored.=Sicher? Aktion kann nicht rückgängig gemacht werden.
Important: use |||, ###, [, and ] instead of &, &ldquo;, < and >!=Wichtig: Nutzung von |||, ###, [, und ] anstatt &, &ldquo;, < und >!
all pictures in chosen directory=Alle Bilder in gewähltem Ordner
apply=anwenden
bottom=unten
columns=Spalten
css-data for div style=css für div style
deleting description failed=Löschen der Beschreibung fehlgeschlagen!
description=Beschreibung
dimensions=Abmessungen
directory=Ordner
effect-speed=Effekt-Geschwindigkeit
fade-effect=Fade-Effekt
font-color=Schriftfarbe
font-family=Schriftart
font-size=Schriftgröße
font-weight=Schriftfettung
fullscreen=Vollbild
gallery=Galerie
image=Bild
image directory=Bildordner
image found=Bild gefunden
image not found, description deleted=Bild nicht gefunden -> Beschreibung entfernt
images have descriptions=Bildern mit Beschreibung
in percent=in Prozent
insertation of description/ template for image failed=Anlegen der Beschreibung/ des Templates für dieses Bild fehlgeschlagen. 
insertation of description/ template for image successful=Anlegen der Beschreibung/ des Templates für dieses Bild erfolgreich.
maximum size of thumbnail=Max. Größe Thumbnail
navigations=Navigationsleiste
next=weiter
no=nein
no description found=Keine Beschreibung gefunden.
no description found output=-
none=keine
not listed pictures for gallery=Nicht in Galerie berücksichtigte Bilder
order of appearance=Reihenfolge in Galerie
overview=Überblick
picture=Bild
pictures loaded=Bilder geladen
please choose=bitte wählen
popup=Popup
preload picture=Bilder vorladen
previous=zurück
rebuild thumbnails=Thumbnails erneuern
responsive stage=Responsive Bühne
rows=Zeilen
save=speichern
search database for descriptions of erased images=Datenbank bereinigen (Beschreibungen gelöschter Bilder werden entfernt)
searching for unused descriptions=Suche nach nicht genutzten Beschreibungen...
select=wählen
single picture=Einzelbild
single-picture no fullscreen=Wenn kein Vollbild:
stretch picture=Bild strecken
strg+c=strg+c
template=Template
template 1 description=nur Bild
template 2 description=Bild links 70%, Text rechts 30%
template 3 description=Text links 30%, Bild rechts 70%
template 4 description=Bild oben, Text unten - beides 100%
template and description=Template und Beschreibung
text-decoration=Schriftdekoration
thumbtable=Übersicht
top=oben
update of description/ template for image failed=Update der Beschreibung/ des Templates für dieses Bild fehlgeschlagen. 
update of description/ template for image successful=Update der Beschreibung/ des Templates für dieses Bild erfolgreich.
width/height of stage=Breite/Höhe der Bühne
yes=ja
seamless-design.de
"Geht nicht!" wohnt in der "Will nicht!"-Strasse.

Das Handbuch zur Version 4.10: CONTENIDO für Einsteiger (4.10)

Das Handbuch zur Version 4.9: CONTENIDO für Einsteiger (4.9)

Antworten