Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#26 27.3.2011 12:34

AL-d82
Server-Pate
Ort: Heilbronn / Göppingen
Registriert: 18.12.2010
Beiträge: 149
Webseite

Re: Autolightbox

Nach so einer Lösung habe ich schon ewig gesucht *gg*
Coole Sache das ganze hier.

(Da hier so viel steht..) Zusammenfassung wie ich es eingebunden habe.

1. http://leandrovieira.com/projects/jquery/lightbox/ herunterladen und entpacken
2. Upload des Entpackten ins CMS Verzeichnis (ich habe es ins Root Verzeichnis Unterordner lightbox hoch geladen)
3. Erstelle einen Userdefined Tag (UDT) (mein Name ContentEditPRe) und füge folgendes ein:

//   Kurzanleitung:
// 1. Erstelle einen Userdefined Tag (UDT)
// 2. Erstelle einen Event: ContentEditPre der diesen Tag benutzt
// 3. Umgestellt auf JQuery-Lightbox Plugin a class="lightbox"

// Von mir geänderte oder hinzu gefügte Zeilen zeigen am Anfang: Klenkes-xx
// Klenkes-10: Test auf Inhalt title="xxx", erst dann Zuweisung und Einbau
// Klenkes-20: Verzweigung, die einen leeren title tag berücksichtigt


function replaceContentImageWithThumbs($txt, $thumb_prefix){

global $gCms;

$config =& $gCms->GetConfig();
$rootPath = $gCms->config["root_path"] ;
 $imgs = findAllImg($txt) ;
 for ($i=0 ; $i < count($imgs); $i++){
   $filename = basename($imgs[$i]["src"]);

   //already a thumb?
   if (substr($filename, 0 ,strlen($filename)) != $thumb_prefix ){
     $imgInfo = getimagesize($rootPath."/".$imgs[$i]["src"]) ;

     //condition to generate thumb
     if ($imgInfo[0] > $imgs[$i]["width"] || $imgInfo[1] > $imgs[$i]["height"]){
       $thumbSrc = generateImgThumb($imgs[$i]["src"], $imgs[$i]["width"], $imgs[$i]["height"], $thumb_prefix);

       //let's replace the content
       $pattern = "<[iI][mM][gG][^>]*src=\"".$imgs[$i]["src"]."\"[^>]*>" ;
       $a_pattern = "<[Aa][^>]*><[iI][mM][gG][^>]*src=\"".$imgs[$i]["src"]."\"[^>]*>\s*</a>" ;
       $pattern = "/".str_replace("/", "\/", $pattern)."/" ;
       $a_pattern = "/".str_replace("/", "\/", $a_pattern)."/" ;

          if (preg_match($a_pattern, $txt)){
            $txt = preg_replace($pattern, $imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"], $txt) ; // Klenkes. Nix passiert...
          }else{

             if (!empty($imgs[$i]["title"])) { //Klenkes-20. Test darauf ob überhaupt ein Titeltext eingegeben wurde... Falls ja Einbau und Ausgabe...
              $txt = preg_replace($pattern, "<a target=\"_blank\""." title=\"".$imgs[$i]["title"]."\" "."class=\"lightbox\" href=\"".$imgs[$i]["src"]."\">".$imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"]."</a>", $txt) ;
             }else{ // Fall: Kein Titel wurde eingegeben. Also obige Zeile nur ohne title="xxx"
              $txt = preg_replace($pattern, "<a target=\"_blank\" "."class=\"lightbox\" href=\"".$imgs[$i]["src"]."\">".$imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"]."</a>", $txt) ;
             }

          }

     }

   }
 }

 return $txt ;
}


// #############################################################################################
function findAllImg($txt){

preg_match_all("/<[iI][mM][gG][^>]*>/", $txt, $out, PREG_PATTERN_ORDER);
$k=0 ;
for ($i = 0 ; $i < count($out[0]) ; $i++)
{
 $imgTxt = $out[0][$i] ;
 preg_match("/width=\"([^\"]*)\"/", $imgTxt, $imgWidth);
 preg_match("/height=\"([^\"]*)\"/", $imgTxt, $imgHeight);
 preg_match("/(.*)src=\"([^\"]*)\"(.*)/", $imgTxt, $imgSrc);
 preg_match("/title=\"([^\"]*)\"(.*)/", $imgTxt, $imgtitle); // Klenkes-10: Suche nach dem title und weise Inhalt $imgtitle zu

 if (!empty($imgWidth[1]) && !empty($imgHeight[1]) && !empty($imgSrc[2]) ){
   $img[$k]["width"] = $imgWidth[1] ;
   $img[$k]["height"] = $imgHeight[1] ;
   $img[$k]["src"] = $imgSrc[2] ;
   $img[$k]["beforSrc"] = $imgSrc[1] ;
   $img[$k]["afterSrc"] = $imgSrc[3] ;

     // Klenkes-10: Wenn Variable belegt dann ab in's array(glaub ich) Weiter geht's mit der Ausgabe oben.
     if (!empty($imgtitle[1]) ) {
     $img[$k]["title"] = $imgtitle[1];
     }

   $k++;
 }
}
return $img ;
}


// Klenkes: Ab hier nichts mehr geändert.
// #############################################################################################
//returns new path to thumb
function generateImgThumb($src, $width, $height, $thumb_prefix){

global $gCms;

$config =& $gCms->GetConfig();
$rootPath = $gCms->config["root_path"] ;
$imageManagerRelPath = "lib/filemanager/ImageManager/" ;
require_once($rootPath."/".$imageManagerRelPath."Classes/ImageManager.php");
require_once($rootPath."/".$imageManagerRelPath."config.inc.php");

$thumbName = getThumbPath($rootPath."/".$src, $thumb_prefix, $width, $height) ;

//generujemy miniaturke
if(!is_file($thumbName)){

$imgInfo = getimagesize($rootPath."/".$src);

if(!is_array($imgInfo))
 return $src;

require_once($rootPath."/".$imageManagerRelPath.'Classes/Thumbnail.php');

// if image smaller than config size for thumbs
 if ($imgInfo[0] <= $width && $imgInfo[1] <= $height)
 {
   $thumbnailer = new Thumbnail($imgInfo[0],$imgInfo[1]);
   $thumbnailer->createThumbnail($rootPath."/".$src, $thumbName);
 }

// if image bigger than config size for thumbs
 else {
   $thumbnailer = new Thumbnail($width, $height);
   $thumbnailer->createThumbnail($rootPath."/".$src, $thumbName);
 }

        if(is_file($thumbName))
        {
                return getThumbPath($src,$thumb_prefix,$width,$height) ;
        }

}
return getThumbPath($src,$thumb_prefix,$width,$height) ;
}

// #############################################################################################
function getThumbPath($fullpathfile, $thumb_prefix, $width, $height)
{
 $path_parts = pathinfo($fullpathfile);
 return $path_parts['dirname']."/".$thumb_prefix.$width."_".$height."_".$path_parts['basename'];
}


$propertyHolder = $params['content']->mProperties;
$values = $params['content']->mProperties->mPropertyValues ;
$thumb_prefix = "thumb_" ;

foreach($values as $key=>$value)
{
 if (substr($key, 0 ,7) == "content" ){
  $propertyHolder->SetValue($key, replaceContentImageWithThumbs($value, $thumb_prefix) ) ;
 }
}

4. "erstelle einen Event" => Reiter Erweiterungen » Ereignisverwaltung -->  Such "ContentEditPRe" diesen bearbeiten und in der Auswahlbox links unten den UDT in meinem Fall "ContentEditPRe"  auswählen und Hinzufügen

5. Im Template eurer Seite folgendes einfügen

{literal}

<script type="text/javascript" src="lightbox/js/jquery.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.js"></script>


<script type="text/javascript">
$(function() {
$('a.lightbox').lightBox();
});
</script>



 <link rel="stylesheet" type="text/css" href="lightbox/css/jquery.lightbox-0.5.css" media="screen" />

{/literal}

6.

http://www.klugesmaedchen.de/index.php/und-wie-nun schrieb:

1. das Bild ist schon hochgeladen oder es wird hochgeladen

2. Man integriert das Bild mit TinyMCE in seinen Text und vergibt ihm einen Titel

3. Dann verkleinert man durch Markieren+Ziehen die Größe des Bildes

4. Beim Abspeichern merkt TinyMCE, daß die Bildgröße nicht mit der Originalgröße übereinstimmt und aktiviert die Lightbox-Integration, was bedeutet, dem kleinen Bild wird automatisch das größe Bild bei Draufklick per Lightbox eingebunden

5. Das isses, ein kleines Bild mit großem Bild in der Lightbox


Falls ihr schon auf eurer Seite nen Modul verwendet das auch jquery.js verwendet dann einfach im Template die Stelle auskommentieren wink


<!--<script type="text/javascript" src="lightbox/js/jquery.js"></script>-->

Und schon klappt es :-) echt Supi das hat cmsMS noch gefehlt


greez AL

Beitrag geändert von AL-d82 (27.3.2011 13:10)

Offline

#27 28.3.2011 07:05

cyberman
Moderator
Ort: Dohna / Sachsen
Registriert: 13.9.2010
Beiträge: 6.296
Webseite

Re: Autolightbox

Geraldo schrieb:

Danke an alle Beteiligten für ein Lösung, die ich schon lange gesucht habe. Funktioniert  Super!

wie Klenkes zurecht anmerkte.

Aber wir bräuchten Autolightbox noch viel mehr für die News-Redakteure.

Hast du mal versucht, dies als Modifikator zu umzubauen und auf den News-Content anzuwenden?

http://www.smarty.net/docsv2/de/language.modifiers.tpl


1. Wie bekomme ich hier schnelle Hilfe?
2. HowTo: Fehlersuche bei CMSMS
---
„First they ignore you, then they laugh at you, then they fight you, then you win.“ Mahatma Ghandi

Offline

#28 28.3.2011 09:36

uniqu3
Server-Pate
Ort: Feldkirchen in Kärnten
Registriert: 20.11.2010
Beiträge: 305
Webseite

Re: Autolightbox

Mit Fancybox habe ich es bei manchen Kunden so gelöst.
jQuery und Fancybox im Template einbinden danach folgende Funktion:

[== javascript ==]
<script type="text/javascript"> 
$(document).ready(function() { 
  $('a[href] img').each(function() { 
    var linkTarget = $(this).parent().attr("href"); 
    var imgSrc = $(this).attr("src"); 
    if(linkTarget.match(/\uploads\/images\/*.*/) && imgSrc.match(/\uploads\/images\/*.*/)) 
     {
       $(this).parent().fancybox({ 
         "overlayShow": true, 
         "zoomSpeedIn": 300, 
         "zoomSpeedOut": 300 }); 
       } 
    }); 
}); 
</script>

So werden alle Bilder im Ordner /uploads/images die auf einen link auf /uploads/images/einbild.jpg zeigen automatisch mit Fancybox effekt erweitert.
Theoretisch mit etwas Erklärung können es auch so manche Editoren problemlos und einfach verwenden. In denn TinyMCE Einstellungen "Die Dateien der Vorschaubilder in der Liste anzeigen:" aktivieren, Editor lädt bild hoch wählt thumb_etwas.jpg als bild und verlinkt es mit etwas.jpg und fertig.

Ein echtes TinyMCE plugin wäre natürlich die idealste Lösung smile

Offline

#29 31.3.2011 17:04

AL-d82
Server-Pate
Ort: Heilbronn / Göppingen
Registriert: 18.12.2010
Beiträge: 149
Webseite

Re: Autolightbox

Kann man irgendwo ne Einstellung vornehmen, die die Qualität der automatisch erzeugten Thumbbilder verbessert?

greez AL

Offline

#30 31.3.2011 18:55

Wurst2008
Gast

Re: Autolightbox

Ich habe ein Template mit zwei Spalten. In der zweiten Spalte (Hauptcontent) funktioniert das super. Ich erinner mich dunkel an ein "Sekretärinnen-Script", daraus ist dann wohl "autolightbox" geworden. smile
Allerdings funzt es nicht in der ersten Spalte. Ich tapp völlig im Dunkeln, wo muss / kann ich ansetzen?

#31 31.3.2011 19:40

Klenkes
Server-Pate
Ort: 89428 Syrgenstein
Registriert: 17.12.2010
Beiträge: 1.359

Re: Autolightbox

Ich fürchte fast es funktioniert nur im Standard Content Block, und nicht in weiteren angelegten Blocks.
Wenn sich nur einer finden würde, der das Script entsprechend erweitern kann... mhhh...summ summ... wink

Beitrag geändert von Klenkes (31.3.2011 19:41)

Offline

#32 31.3.2011 22:00

nicmare
Server-Pate
Registriert: 15.12.2010
Beiträge: 1.316
Webseite

Re: Autolightbox

übrigens gibts nen üblen fehler wenn das bild nachträglich vom ftp gelöscht wird und der pfad dann nicht mehr stimmt  monkey

Offline

#33 1.4.2011 08:23

Klenkes
Server-Pate
Ort: 89428 Syrgenstein
Registriert: 17.12.2010
Beiträge: 1.359

Re: Autolightbox

nicmare schrieb:

übrigens gibts nen üblen fehler wenn das bild nachträglich vom ftp gelöscht wird und der pfad dann nicht mehr stimmt  monkey

Stimmt!

Frontend:
Lösche ich das große Bild bleibt zwar das Thumbnail erhalten aber im Lighbox Overlay wird das große Bild nicht mehr gefunden. Loading... loading... Allerdings keine Fehlermeldung.

Backend:
Lösche das Thumbnail sehe ich kurz die Fehlermeldung: Warning: getimagesize(/home...) [function.getimagesize]: failed to open stream:...usw... LOGISCH!

Da müsste man hier eingreifen und absichern:

//already a thumb?
  if (substr($filename, 0 ,strlen($filename)) != $thumb_prefix ){
  $imgInfo = getimagesize($rootPath."/".$imgs[$i]["src"]) ;

Da ich zu wenig PHP kann, bin ich damit leider überfordert.
(irgendwie finde ich nie die Zeit mich richtig damit zu beschäftigen)

Beitrag geändert von Klenkes (1.4.2011 08:25)

Offline

#34 8.4.2011 18:25

Hmelk
probiert CMSMS aus
Registriert: 7.4.2011
Beiträge: 77

Re: Autolightbox

Hallo.

Habe das wie von "kluges Mädchen" beschrieben gemacht, funzt auch. Danke. big_smile
Aber wie bekomme ich die Bildunterschrift wieder rein?


Gruß

Hmelk

Habe jetzt ein Bild neu hoch geladen, da wurde der Titel auch angezeigt, aber nur im Lightbox-Großbild, nicht im Bild auf der Homepage. Kann man das denn auch noch einstellen?

Gruß

Hmelk


Noch etwas anderes, kann man auch den Close Button und den Titel oben in die Lightbox setzen? Und wie?

Beitrag geändert von Hmelk (10.4.2011 13:42)

Offline

#35 11.4.2011 08:07

cyberman
Moderator
Ort: Dohna / Sachsen
Registriert: 13.9.2010
Beiträge: 6.296
Webseite

Re: Autolightbox

Hmelk schrieb:

Habe jetzt ein Bild neu hoch geladen, da wurde der Titel auch angezeigt, aber nur im Lightbox-Großbild, nicht im Bild auf der Homepage. Kann man das denn auch noch einstellen?

Hattest du nicht eine separate Caption-Lösung dafür verwendet? Oder hab ich mir da etwas falsch gemerkt?

Hmelk schrieb:

Noch etwas anderes, kann man auch den Close Button und den Titel oben in die Lightbox setzen? Und wie?

Ist der Close-Button nicht eine Grafik?

http://www.phpblogger.net/2007/07/10/li … 2-deutsch/


1. Wie bekomme ich hier schnelle Hilfe?
2. HowTo: Fehlersuche bei CMSMS
---
„First they ignore you, then they laugh at you, then they fight you, then you win.“ Mahatma Ghandi

Offline

#36 11.4.2011 10:09

Hmelk
probiert CMSMS aus
Registriert: 7.4.2011
Beiträge: 77

Re: Autolightbox

Hallo.


Habe eine separate Caption-Lösung eingesetzt. Funktioniert mit der Lightbox zusammen aber nicht;
"Falls ihr schon auf eurer Seite nen Modul verwendet das auch jquery.js verwendet dann einfach im Template die Stelle auskommentieren wink

<!--<script type="text/javascript" src="lightbox/js/jquery.js"></script>-->"


Der Link hier:
http://www.phpblogger.net/2007/07/10/li … 2-deutsch/

Das verstehe ich nicht so ganz.

Für die Lightbox hier braucht man ja die jquery.lightbox-0.5.js.

Und da finde ich nicht die Möglichkeit die Grafik oder den Text oben zu positionieren.

Hatte auch wie im Blog beschrieben nach:
Element.setTop('lightbox', lightboxTop); in Element.setTop('lightbox', 0);
gesucht, damit die Lightbox ganz oben erscheint, in der  query.lightbox-0.5.js finde ich das nicht.

Ich bin da ein wenig zu doof dazu habe ich den Verdacht. sad

Gruß

Hmelk

Offline

#37 11.4.2011 20:03

Connie
Server-Pate
Ort: Gribow
Registriert: 12.12.2010
Beiträge: 217
Webseite

Re: Autolightbox

Hmelk schrieb:

Noch etwas anderes, kann man auch den Close Button und den Titel oben in die Lightbox setzen? Und wie?

Die Position des Closebuttons;

es gibt da eine CSS-Datei: jquery.lightbox-0.5.css

darin gibt es eine Positionierung:

[== CSS ==]
#lightbox-secNav-btnClose {
    width: 66px; 
    float: right;
    padding-bottom: 0.7em;    
}

das kannst du also ändern! Und da du auch den Titel ändern willst: schau in der Datei mal nach "caption", damit kannst du experimentieren

zur jquery.lightbox-05.js:

Sie benötigen eigentlich nur 2 dieser Dateien, wenn Sie nicht schon JQuery eingebunden haben:
- jquery.js
- jquery.lightbox-05.js (oder eine neuere Version

du könntest dir also auch eine neuere Version besorgen, wenn es eine gibt, und die einsetzen

Gruss, Connie

Beitrag geändert von Connie (11.4.2011 20:04)

Offline

#38 27.4.2011 10:20

Hmelk
probiert CMSMS aus
Registriert: 7.4.2011
Beiträge: 77

Re: Autolightbox

Hallo.

Manchmal wird der Titel nicht im großen Bild angezeigt.
Weiß wer warum?
Die Bilder wurden hoch geladen, verkleinert, Titel eingetragen.

Gruß

Hmelk

P.S.

Habe nun den Titel im Link eingetragen, dann erscheint er.
Doch wieso nicht direkt beim Eintragen in den Titel des  Bildes?

Beitrag geändert von Hmelk (27.4.2011 10:22)

Offline

#39 27.4.2011 13:06

mike-r
CMSMS-Profi
Registriert: 21.12.2010
Beiträge: 888
Webseite

Re: Autolightbox

Afaik ziehen alle Lightboxen die Titel aus den Links.

Das ist auch ziemlich logisch, schliesslich kann das verlinkte Bild schwerlich einen Titel/Alt haben, wenn Du mal JS deaktivierst oder STRG+Klick anwendest siehst Du, warum.


Unablässige Tools für's Webdevelopement/ Fehlerfindung: CSS Validierungsservice, Bildschirmlineal, Firebug, Tidy, Deutsche CSS-Referenz

Offline

#40 27.4.2011 13:57

Hmelk
probiert CMSMS aus
Registriert: 7.4.2011
Beiträge: 77

Re: Autolightbox

Ist ja nicht bei allen Bildern so.
Und in der Anleitung von kluges Mädchen steht ja auch, dass man dem Bild einen Titel geben soll, der dann als Bildbeschreibung in dem Großbild ist.
Es funktioniert dann mal genau so, dann wieder mal nicht. Und das verstehe ich nicht.

Gruß

Hmelk

Offline

#41 27.4.2011 14:06

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 9.11.2010
Beiträge: 2.716
Webseite

Re: Autolightbox

Hmelk schrieb:

Ist ja nicht bei allen Bildern so.
Und in der Anleitung von kluges Mädchen steht ja auch, dass man dem Bild einen Titel geben soll, der dann als Bildbeschreibung in dem Großbild ist.
Es funktioniert dann mal genau so, dann wieder mal nicht. Und das verstehe ich nicht.

Hast du eine Demo?


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox, Revisions

Offline

#42 14.7.2011 22:29

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 9.11.2010
Beiträge: 2.716
Webseite

Re: Autolightbox

So, nach dem ich mir nun die Zeit genommen habe, ist das Autolightbox UDT von mir überarbeitet, bzw. ergänzt worden.

Dazu mein Blog-Eintrag (Mit Anleitung und bebildert)

/**
 *
 *  AutoLightBox - UDT for automatically generating thumbnails in content
 *
 * Installing
 * -----------
 * 1. Create user defined tag
 * 2. Create event ContentEditPre which use this tag
 * 3. Create if use event NewsArticleAdded/NewsArticleEdited
 * 4. Create if use event CGBlogArticleAdded/CGBlogArtikleEdited
 *
 * Changelog
 * -----------
 *
 * by klenkes:
 * Klenkes-10: Test auf Inhalt title="xxx", erst dann Zuweisung und Einbau
 * Klenkes-20: Verzweigung, die einen leeren title tag berücksichtigt
 *
 * by blattertech informatik:
 * add support for all content blocks
 * add support for cgblog
 * add support for news
 * add function comments
 * add attribute def
 */


// Global Options
$thumb_prefix = "thumb_" ;

$attribute = array();
$attribute['css'] = "";  // Name of CSS class (can be emtpy)
$attribute['rel'] = "";  // Value of rel="" attribute (can be emtpy)


/**
 *
 * replace images width thums
 *
 * @param string $txt - text with included image-tag
 * @param string $thumb_prefix - prefix of the thumbs
 * @return string
 *
 */

function replaceContentImageWithThumbs($txt, $thumb_prefix, $attr = array('css' => '', 'rel' => ''))
{
   global $gCms;
   $config =& $gCms->GetConfig();
   $rootPath = $gCms->config["root_path"] ;
   $imgs = findAllImg($txt) ;

   $rel = ($attr['rel'] != "") ? ' rel="'.$attr['rel'].'" ' : '';
   $css = ($attr['css'] != "") ? ' class="'.$attr['css'].'" ' : '';

   for ($i=0 ; $i < count($imgs); $i++){
      $filename = basename($imgs[$i]["src"]);
      //already a thumb?
      if (substr($filename, 0 ,strlen($filename)) != $thumb_prefix ){
         $imgInfo = getimagesize($rootPath."/".$imgs[$i]["src"]) ;

         //condition to generate thumb
         if ($imgInfo[0] > $imgs[$i]["width"] || $imgInfo[1] > $imgs[$i]["height"]){
            $thumbSrc = generateImgThumb($imgs[$i]["src"], $imgs[$i]["width"], $imgs[$i]["height"], $thumb_prefix);
            //let's replace the content
            $pattern = "<[iI][mM][gG][^>]*src=\"".$imgs[$i]["src"]."\"[^>]*>" ;
            $a_pattern = "<[Aa][^>]*><[iI][mM][gG][^>]*src=\"".$imgs[$i]["src"]."\"[^>]*>\s*</a>" ;
            $pattern = "/".str_replace("/", "\/", $pattern)."/" ;
            $a_pattern = "/".str_replace("/", "\/", $a_pattern)."/" ;

            if (preg_match($a_pattern, $txt)){
               $txt = preg_replace($pattern, $imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"], $txt) ; // Klenkes. Nix passiert...
            }
            else{
               if (!empty($imgs[$i]["title"])) { //Klenkes-20. Test darauf ob überhaupt ein Titeltext eingegeben wurde... Falls ja Einbau und Ausgabe...
                  $txt = preg_replace($pattern, "<a target=\"_blank\""." title=\"".$imgs[$i]["title"]."\"".$css.$rel." href=\"".$imgs[$i]["src"]."\">".$imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"]."</a>", $txt) ;
               }
               else{ // Fall: Kein Titel wurde eingegeben. Also obige Zeile nur ohne title="xxx"
                  $txt = preg_replace($pattern, "<a target=\"_blank\"".$css.$rel." href=\"".$imgs[$i]["src"]."\">".$imgs[$i]["beforSrc"]."src=\"".$thumbSrc."\"".$imgs[$i]["afterSrc"]."</a>", $txt) ;
               }
            }
         }
      }
   }
   return $txt ;
}

/**
 *
 * return all found images in a string
 *
 * @param string $txt - text with included image-tag
 * @return array width images
 *
 */

function findAllImg($txt)
{
   preg_match_all("/<[iI][mM][gG][^>]*>/", $txt, $out, PREG_PATTERN_ORDER);
   $k=0 ;
   $img = array();
   for ($i = 0 ; $i < count($out[0]) ; $i++) {
      $imgTxt = $out[0][$i] ;
      preg_match("/width=\"([^\"]*)\"/", $imgTxt, $imgWidth);
      preg_match("/height=\"([^\"]*)\"/", $imgTxt, $imgHeight);
      preg_match("/(.*)src=\"([^\"]*)\"(.*)/", $imgTxt, $imgSrc);
      preg_match("/title=\"([^\"]*)\"(.*)/", $imgTxt, $imgtitle); // Klenkes-10: Suche nach dem title und weise Inhalt $imgtitle zu

      if (!empty($imgWidth[1]) && !empty($imgHeight[1]) && !empty($imgSrc[2]) ){
         $img[$k]["width"] = $imgWidth[1] ;
         $img[$k]["height"] = $imgHeight[1] ;
         $img[$k]["src"] = $imgSrc[2] ;
         $img[$k]["beforSrc"] = $imgSrc[1] ;
         $img[$k]["afterSrc"] = $imgSrc[3] ;

         // Klenkes-10: Wenn Variable belegt dann ab in's array(glaub ich) Weiter geht's mit der Ausgabe oben.
         if (!empty($imgtitle[1]) ) {
            $img[$k]["title"] = $imgtitle[1];
         }
         $k++;
      }
   }
   return $img ;
}


/**
 *
 * generate thumbnail
 *
 * @param string $src - sourcefile
 * @param float  $width - image width
 * @param float  $height - image height
 * @param string $thumb_prefix - prefix for thumbnail
 * @return string
 *
 */

function generateImgThumb($src, $width, $height, $thumb_prefix)
{
   global $gCms;

   $config =& $gCms->GetConfig();
   $rootPath = $gCms->config["root_path"] ;
   $imageManagerRelPath = "lib/filemanager/ImageManager/" ;
   require_once($rootPath."/".$imageManagerRelPath."Classes/ImageManager.php");
   require_once($rootPath."/".$imageManagerRelPath."config.inc.php");

   $thumbName = getThumbPath($rootPath."/".$src, $thumb_prefix, $width, $height) ;

   //generujemy miniaturke
   if(!is_file($thumbName)){
      $imgInfo = getimagesize($rootPath."/".$src);
      if(!is_array($imgInfo))  return $src;

      require_once($rootPath."/".$imageManagerRelPath.'Classes/Thumbnail.php');

      // if image smaller than config size for thumbs
      if ($imgInfo[0] <= $width && $imgInfo[1] <= $height) {
         $thumbnailer = new Thumbnail($imgInfo[0],$imgInfo[1]);
         $thumbnailer->createThumbnail($rootPath."/".$src, $thumbName);
      }
      // if image bigger than config size for thumbs
      else {
         $thumbnailer = new Thumbnail($width, $height);
         $thumbnailer->createThumbnail($rootPath."/".$src, $thumbName);
      }
      if(is_file($thumbName)) {
         return getThumbPath($src,$thumb_prefix,$width,$height) ;
      }
   }
   return getThumbPath($src,$thumb_prefix,$width,$height) ;
}

/**
 *
 * Returns new path to thumbnail
 *
 * @param string $fullpathfile - absolute path to image file
 * @param string $thumb_prefix - prefix for thumbnail
 * @param float  $width - image width
 * @param float  $height - image height
 * @return string
 *
 */

function getThumbPath($fullpathfile, $thumb_prefix, $width, $height)
{
   $path_parts = pathinfo($fullpathfile);
   return $path_parts['dirname']."/".$thumb_prefix.$width."_".$height."_".$path_parts['basename'];
}

/**
 *
 * Edit CGBlog / News / Content
 *
 */

// CGBlog
if (isset($params['content']) and isset($params['cgblog_id'])) {
   $content = replaceContentImageWithThumbs($params['content'], $thumb_prefix, $attribute);
   $db = cmsms()->GetDB();
   $query = "UPDATE ".cms_db_prefix()."module_cgblog SET cgblog_data = ? WHERE cgblog_id = ?";
   $db->Execute($query, array($content, $params['cgblog_id']));
}
// News
else if (isset($params['content']) and isset($params['news_id'])) {
   $content = replaceContentImageWithThumbs($params['content'], $thumb_prefix, $attribute);
   $db = cmsms()->GetDB();
   $query = "UPDATE ".cms_db_prefix()."module_news SET news_data = ? WHERE news_id = ?";
   $db->Execute($query, array($content, $params['news_id']));
}
// Seiten-Inhalte
else if (method_exists($params['content'], 'get_content_blocks'))
{
    foreach($params['content']->get_content_blocks() as $block_name => $block_info)
    {
        $params['content']->SetPropertyValue(
            $block_name,
            replaceContentImageWithThumbs(
                $params['content']->GetPropertyValue($block_name),
                $thumb_prefix,
                $attribute
            )
        );
    }
}

Folgendes ist neu:

  • Jeder Contentblock der Seite wird berücksichtigt

  • CGBlog Support

  • News Support

  • UDT Funktionen kommentiert

  • Eine CSS Klasse oder ein rel-Attribute können gesetzt werden

Update 15.10.2011: 2 Fehler gemäss den Ergänzungen von NaN korrigiert.

Beitrag geändert von nockenfell (15.10.2011 07:01)


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox, Revisions

Offline

#43 15.7.2011 21:50

AL-d82
Server-Pate
Ort: Heilbronn / Göppingen
Registriert: 18.12.2010
Beiträge: 149
Webseite

Re: Autolightbox

@nockenfell

nice nice :-) vielen lieben Dank :-)

Offline

#44 1.8.2011 09:32

Geraldo
Server-Pate
Registriert: 13.12.2010
Beiträge: 5

Re: Autolightbox

@nockenfell

Ebenfalls Dank von meiner Seite von den Kapverdischen Inseln in die Schweiz.

Dein Landsmann Beat, der Fußballtrainer freut sich. Und noch mehr meine Frau. Sie ist Verantwortliche für die Laufmädels von 'Tudu Cool' und hält fast alles im Bild fest.

Und Dank von mir, da damit das Projekt ADEC für mich abgeschlossen ist.

Gleichzeitig ist damit auch Phase von CMSMs für mich abgeschlossen. Mein nächstes Projekt ist keine Spielerei und Vorstudie mehr, sondern es geht um unsere Hauptseite und unseren Lebensuntehalt - da nehme ich lieber Contao.

Auch dort gibt es wie bei CMSMS das Organisationsprinzip des wohlwollenden Diktators, und der Core wird von Leo (dem Chef) selbst und alleine betreut. Aber es werden keine hunderte von Leichen als Plugins/Module verkauft wie von CMSms bis mindestens 1.9.4, dort funktionieren die Dinge eher und das Ticketsystem wird wirklich ernst genommen und Stil und Qualität von Anwenderforum und Betreuung durch die Modulentwickler, Forumsverantwortliche und auch Benutzer können mit der hervorragenden Arbeit von Cyberman & Co. im deutschen CMSms-Forum mindestens mithalten.

Cybermann und den anderen deutschen Aktiven weiterhin viel Erfolg bei Ihrer Arbeit.

Geraldo, Calheta de Sao Miguel

Offline

#45 1.8.2011 11:14

cyberman
Moderator
Ort: Dohna / Sachsen
Registriert: 13.9.2010
Beiträge: 6.296
Webseite

Re: Autolightbox

Geraldo schrieb:

Cybermann und den anderen deutschen Aktiven weiterhin viel Erfolg bei Ihrer Arbeit.

Vielen Dank - wir bleiben auf jeden Fall am Ball.

Nur schade, dass du dich gegen CMSMS entschieden hast, was ich aber angesichts der von dir aufgeführten Argumente gut verstehen kann.


1. Wie bekomme ich hier schnelle Hilfe?
2. HowTo: Fehlersuche bei CMSMS
---
„First they ignore you, then they laugh at you, then they fight you, then you win.“ Mahatma Ghandi

Offline

#46 1.8.2011 13:21

faglork
CMSMS-Profi
Ort: Fränkische Schweiz
Registriert: 15.12.2010
Beiträge: 1.152
Webseite

Re: Autolightbox

Moin!
Ich habe da ein Verständnisproblem: "Ist das Bild verkleinert eingebunden, wird ein Thumbnail generiert und die Bild-URL auf das Thumbnail angepasst."

Was genau heisst "Ist das Bild verkleinert eingebunden"? Soll das heissen man muss das "image" (das "Großbild") einbinden und im Einfügedialog die Maße verkleinern? Und wird dann dieses Bild automatisch durch "thumb_image" ersetzt? Wird dieses "thumb_image" neu erzeugt auch wenn schon eines besteht?

Was passiert wenn man "thumb_image" statt "image" einfügt?

Leicht verwirrt,
Alex

Offline

#47 1.8.2011 14:08

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 9.11.2010
Beiträge: 2.716
Webseite

Re: Autolightbox

faglork schrieb:

Moin!
Ich habe da ein Verständnisproblem: "Ist das Bild verkleinert eingebunden, wird ein Thumbnail generiert und die Bild-URL auf das Thumbnail angepasst."

Genau. Das Originalbild wird durch das Thumbnail ersetzt.

Was genau heisst "Ist das Bild verkleinert eingebunden"? Soll das heissen man muss das "image" (das "Großbild") einbinden und im Einfügedialog die Maße verkleinern? Und wird dann dieses Bild automatisch durch "thumb_image" ersetzt? Wird dieses "thumb_image" neu erzeugt auch wenn schon eines besteht?

Was passiert wenn man "thumb_image" statt "image" einfügt?

Probieren geht über studieren wink

Man bindet das grosse Bild via TinyMCE ein und zieht (verkleinert) es auf die gewünschte Grösse. Idealerweise hat das Bild nicht mehr als 800Pixel maximale Kantenlänge (da es sonst nicht mehr auf jedem Bildschirm ganz dargestellt werden kann). Autolightbox durchsucht nun den Inhalt nach Bildern. Bei jedem Bild wird width und height des Bilder mit den im Quelltext stehenden Werten verglichen. Stimmen dies nicht überein, erstellt Autolightbox ein Thumbnail, ersetzt das Original und macht einen Link auf das Original. Wenn das Thumb eingebunden wird, verkleinert Autolightbox dieses Thumb ebenfalls.

Wichtig zu wissen: Ist ein Bild bereits verklinkt, verkleinert Autolightbox dieses nicht nochmals.


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox, Revisions

Offline

#48 15.10.2011 07:02

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 9.11.2010
Beiträge: 2.716
Webseite

Re: Autolightbox

2 Fehler gemäss den Ergänzungen von NaN korrigiert.

(direkt im Beitrag mit dem UDT)


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox, Revisions

Offline

#49 12.1.2012 09:29

dönertier
probiert CMSMS aus
Registriert: 12.1.2012
Beiträge: 32

Re: Autolightbox

Hallo,

ich bin gerade dabei eine Webseite (www.lajedao.de) von cmsimple auf cmsms (www.lajedao.de/cmsms) umzustellen (Umzug/Austausch, wenn alles funktioniert). Bei cmsimple hat das mit der Lightbox wunderbar funktioniert (Dank hier auch an Connie), nur mit der hier beschriebenen Lösung komme ich nicht zu rande (bin halt auch ein Laie). Eingesetzt habe ich:

CMSMS 1.10.3
CGCalendar 1.8.5
CGExtensions 1.27.2
TinyMCE 2.9.5
NMS 2.3.8

1. UDT laut Nockenfell erstellt
2. Ereignis für Content und News zugewiesen
3. Lightbox ins Root hochgeladen
4. Anpassung der Scripte im Template (und da liegt der Hase wahrscheinlich im Pfeffer)

Könnte da mal jemand drüberschauen, wo es hakt, bzw. der Webfehler bei mir liegt?

Danke

Christian

Beitrag geändert von dönertier (12.1.2012 09:30)

Offline

#50 12.1.2012 09:43

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 9.11.2010
Beiträge: 2.716
Webseite

Re: Autolightbox

folgendes fehlt noch, damit die Lightbox den Bildern zugewiesen wird:

{literal}
<script type="text/javascript">
jQuery(function($) { $("a[href$='.jpg'], a[href$='.jpeg'], a[href$='.gif'], a[href$='.png'], a[href$='.JPG'], a[href$='.JPEG'], a[href$='.GIF'], a[href$='.PNG']").attr({rel:"page"}).lightBox();});
</script>
{literal}

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox, Revisions

Offline