Modul: Galleriffic (Bildergalerie mit jQuery)

thoste87
Beiträge: 189
Registriert: Fr 27. Jun 2008, 12:57
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von thoste87 » Di 6. Jul 2010, 09:50

bei mir erscheint jetzt die 6. kann mir jemand sagen, woher die zahl kommt???

Nakoda
Beiträge: 219
Registriert: Fr 2. Jul 2004, 23:50
Wohnort: Hamburg
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Nakoda » Mi 4. Aug 2010, 18:24

Moin allerseits,

hab auch diese Ausgabe mit der Zahl vorneweg.
http://www.basecore-hh.de/front_content.php?idart=347

Bei der Einstellung zentriert sind Hochkant Bilder trozdem links ausgerichtet. Kann man das auch irgendwie hin bekommen das die dann in der Mitte erscheinen?

EDIT: Auch scheint es bei mir Probleme mit den Thumbs zu geben.
ich habe eingestellt das acht Thumbs in vier Spalten dargestellt werden sollen.
Das ist aber leider mitnichten der Fall.
http://www.basecore-hh.de/front_content.php?idart=344
Erledigt IE hatte 'nen Haken: Außerdem werden die Seitenzahlen nicht korrekt angezeigt. Im obigen Fall überspringt er von Seite eins auf zwei, zwei Kästchen.

Hab ich was falsch eingestellt?
Gruß aus HH

Armin
http://sig.sysprofile.de/quicksys/sysp-102592.png
Contenido 4.8.18

Dinkel
Beiträge: 565
Registriert: Di 22. Mär 2005, 14:52
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Dinkel » Fr 13. Aug 2010, 09:46

Ich glaube ich hab gefunden, warum die Zahl angezeigt wird.
Bitte im Modulcode-Output die Zeile 171 löschen, bzw. nach folgendem String suchen:

Code: Alles auswählen

echo $numOfThumbs;
Werde ich in einer kommenden Version berücksichtigen.
selbstentwickelte Module:
Downloads und Infos zu den Modulen: gibt es hier.
Modul: Forum | Version 0.9 | getestet: 4.6.24 MR, 4.8.11, 4.8.11 AMR
Modul: Galleriffic | Version: 0.3.4 BETA | getestet: 4.8.11, 4.8.11 AMR, 4.8.12, 4.8.12 AMR
Modul: Metadata | Version: 2.0 | getestet: 4.9.7, 4.9.7 AMR
Modul: Slider Gallery | Version: 1.0 | getestet: 4.9.12 AMR
Modul: Up- & Download | Version: 4.1 | getestet: 4.9.12 AMR

Nakoda
Beiträge: 219
Registriert: Fr 2. Jul 2004, 23:50
Wohnort: Hamburg
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Nakoda » Fr 13. Aug 2010, 12:11

Moin,

jubb. Das war es. Dankeschön. :D :D
Gruß aus HH

Armin
http://sig.sysprofile.de/quicksys/sysp-102592.png
Contenido 4.8.18

Nakoda
Beiträge: 219
Registriert: Fr 2. Jul 2004, 23:50
Wohnort: Hamburg
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Nakoda » Sa 14. Aug 2010, 18:20

Muss leider noch einmal nerven. :oops:
Hast du für diese beiden Sachen auch noch einen Tipp?
Nakoda hat geschrieben: Bei der Einstellung zentriert sind Hochkant Bilder trozdem links ausgerichtet. Kann man das auch irgendwie hin bekommen das die dann in der Mitte erscheinen?

EDIT: Auch scheint es bei mir Probleme mit den Thumbs zu geben.
ich habe eingestellt das acht Thumbs in vier Spalten dargestellt werden sollen.
Das ist aber leider mitnichten der Fall.
http://www.basecore-hh.de/front_content.php?idart=344
Gruß aus HH

Armin
http://sig.sysprofile.de/quicksys/sysp-102592.png
Contenido 4.8.18

Dalamar
Beiträge: 298
Registriert: Di 16. Nov 2004, 15:43
Wohnort: Arnstadt / Thüringen
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Dalamar » Di 14. Sep 2010, 10:06

Kleiner Hinweis...

das Tag {MAKENEWLINE} erzeugt innerhalb der Liste ein <br>... dieses <br> führt dazu, dass wenn man sich auf Seite 2 befindet und das letzte Element anklickt, das vorletzte Elemente selektiert wird. Bin mir auch nicht sicher, ob ein <br> überhaupt in einer Liste (<ul>) stehen darf.

Christian
Beruflich: eComradeGroup und Media Atoll
Privat: Fantasybuch.net ;)

ngcat
Beiträge: 31
Registriert: Mi 1. Mär 2006, 11:48
Wohnort: Emmen / Schweiz
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von ngcat » Mo 30. Mai 2011, 23:19

Fatal error: Call to undefined function bcsub() in /srv/www/vhosts/xxxxxxx/httpdocs/contenido/includes/include.tplcfg_edit_form.php(404) : eval()'d code on line 271
Die PHP Funktion bcmath fehlt und muss auf dem Server installiert werden.
( compile php --with-bcmath)

lunsen_de
Beiträge: 213
Registriert: Mo 17. Okt 2005, 20:26
Wohnort: Weimar
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von lunsen_de » Mo 28. Nov 2011, 11:19

Hallo, ich habe das Problem, dass sich ein Kunde über die Qualität der großen Bilder beschwert bzw. warum nicght die Originale angezeigt werden.

Warum werden die Bilder nochmals in den Cache Ordner erstellt, wenn sie NICHT GRÖSSER oder GENAUSO GROSS sind wie die eingestellten Werte.

Er hat eingestellt in der Konfig 400px x 300px und hat auch die Bilder genau in dieser Größer hochgeladen. Trotzdem führt kommt im Frontend das Große Bild aus dem Cache-Ordner (cms/cache/848251e0699629dec2135edf8531549b.jpg).

Was muss man im Modulcode (oder der js) anpassen, dass nur Bilder neu berechnet werden, die größer als die eingestellten Werte sind.

Hier der Modul-Output:

Code: Alles auswählen

<?php
/***********************************************
* CONTENIDO MODUL - OUTPUT
*
* Modulname  :      Galleriffic
* Author     :      Andreas Dinkelacker
* Copyright  :      Andreas Dinkelacker
* Created    :      23.07.2009
* Version    :      0.3.4 BETA
* License    :      GNU/GPLv2 only (http://www.gnu.org/licenses/gpl-2.0.html#TOC1)
************************************************/

$value0="CMS_VALUE[0]"; //Bilder pro Seite
$value1="CMS_VALUE[1]"; // Breite der Galerie
$value2="CMS_VALUE[2]"; // Bildgroesse
$value3="CMS_VALUE[3]"; // Thumbgroesse
$value4="CMS_VALUE[4]"; // Ordner
$value5="CMS_VALUE[5]"; // eigene Image Groesse
$value6="CMS_VALUE[6]"; // eigene Image Breite
$value7="CMS_VALUE[7]"; // eigene Image Hoehe
$value8="CMS_VALUE[8]"; // eigene Thumb Groesse
$value9="CMS_VALUE[9]"; // eigene Thumb Breite
$value10="CMS_VALUE[10]"; // eigene Thumb Hoehe
$value11="CMS_VALUE[11]"; // Sichtbarkeit inaktiver Bilder
$value12="CMS_VALUE[12]"; // Caching
$value15="CMS_VALUE[15]"; // delete original file after resizing
$value16="CMS_VALUE[16]"; // Anzahl Spalten
$value17="CMS_VALUE[17]"; // Anordnung Navigation und Bild
$value18="CMS_VALUE[18]"; // Ausrichtung der Anzeige
$value19="CMS_VALUE[19]"; // Position Steuerelemente
$value20="CMS_VALUE[20]"; // Position Anzeige
$value21="CMS_VALUE[21]"; // Position Bild-Infobox
$value22="CMS_VALUE[22]"; // Quadratische Thumbs (Seitenverhaeltnis anpassen)
if ($value22!="true") $value22="false";

// Check if mod_rewrite may be active
if (substr_count($_SERVER[REQUEST_URI],"front_content.php")==0) {
    $modRewrite=1;
    $modRewriteFiller="?";
    $phpSelf=str_replace("?".$_SERVER[QUERY_STRING],"",$_SERVER[REQUEST_URI]);
} else {
    $modRewrite=0;
    $modRewriteFiller="&";
    $idcat=strip_tags($_GET[idcat]);
    $idart=strip_tags($_GET[idart]);
    $idcatart=strip_tags($_GET[idcatart]);
    if ($idcat!="" && $idcat!=0) {
        $artCat='idcat='.$idcat;
    } elseif ($idart!="" && $idart!=0) {
        $artCat='idart='.$idart;
    } elseif ($idcatart!="" && $idcatart!=0) {
        $artCat='idcatart='.$idcatart;
    }
    $phpSelf=$_SERVER[PHP_SELF].'?'.$artCat;
}

if ($_GET[filename]!="") {
    $fileName=strip_tags($_GET[filename]);
    $absPath=$cfgClient[$client]['upload'].$value4.$filename;
    $fileSize=@filesize($absPath);
    
    header("Content-type: ".getMime($absPath));
    header("Content-Length: ".$fileSize);
    header("Content-Disposition: attachment; filename=\"".$fileName."\"");
    ob_clean();
    flush();
    readfile($absPath);
    exit();
}

cInclude('classes', 'class.template.php');
$tpl = new Template;
$tpl->reset();

if ($value5!=1) {
    $iSize=explode("x",$value2);
    // Image height */
    $iHeight=$iSize[1];
    // Image width
    $iWidth=$iSize[0];
} else {
    // Image height
    $iHeight=$value7;
    // Image width
    $iWidth=$value6;
}

if ($value8!=1) {
    $tSize=explode("x",$value3);
    // Thumb height
    $tHeight=$tSize[1];
    // Thumb width
    $tWidth=$tSize[0];
} else {
    // Thumb height
    $tHeight=$value10;
    // Thumb width
    $tWidth=$value9;
}
// Set standard width which is set in the site properties.
// Necessary if there is an image which is bigger than this values
// (makes problems on resizing)
$iWidthSettings=$iWidth;
$tWidthSettings=$tWidth;

if ($value16=="A") {
    // first calculate image size and thumb sizes to get the correct value
    $restWidth=round($value1-$iWidthSettings-10,0);
    $numOfThumbs=round($restWidth/($tWidthSettings+6),0);
} elseif ($value16>0) $numOfThumbs=$value16;
elseif ($value16==0) $numOfThumbs=$value0;

$naviWidth=round(($tWidthSettings*$numOfThumbs)+($numOfThumbs*17),0);

/*
    The following variables will build the content of the gallery.
    The divs must be separated to ensure more layout configuration.
*/
$contentDivStart='<div id="gallery-adv" class="gal_content"><div id="loading-adv" class="loader"></div>';
$contentControlsAdv='<div id="controls-adv" class="controls"></div>';
$contentSlideshowAdv='<div id="slideshow-adv" class="slideshow"></div>';
$contentCaptionAdv='<div id="caption-adv" class="embox"></div>';
$contentDivEnd='</div>';


$checkArr=array();
$allnones=0;
if (!in_array($value19,$checkArr)) if ($value19=="none") $allnones+=1; else array_push($checkArr,$value19);
if (!in_array($value20,$checkArr)) if ($value20=="none") $allnones+=1; else array_push($checkArr,$value20);
if (!in_array($value21,$checkArr)) if ($value21=="none") $allnones+=1; else array_push($checkArr,$value21);

if (sizeof($checkArr)<bcsub(3,$allnones)) $contentDivs=$contentDivStart.$contentControlsAdv.$contentLoadingAdv.$contentSlideshowAdv.$contentCaptionAdv.$contentDivEnd;
else {
    $contentDivs=$contentDivStart;
    
    if ($value19=="top") $contentDivs.=$contentControlsAdv;
    elseif ($value20=="top") $contentDivs.=$contentSlideshowAdv;
    elseif ($value21=="top") $contentDivs.=$contentCaptionAdv;
    
    if ($value19=="middle") $contentDivs.=$contentControlsAdv;
    elseif ($value20=="middle") $contentDivs.=$contentSlideshowAdv;
    elseif ($value21=="middle") $contentDivs.=$contentCaptionAdv;
    
    if ($value19=="bottom") $contentDivs.=$contentControlsAdv;
    elseif ($value20=="bottom") $contentDivs.=$contentSlideshowAdv;
    elseif ($value21=="bottom") $contentDivs.=$contentCaptionAdv;
}

/*
    Define the alignment of the elements
*/
if ($value17=="lr") {
    $naviPos='float:left;position:absolute;';
    $contentPos='float:right;';
    $galleryAlign='width:'.$value1.'px;position:relative;';
    $tpl->set('s','CONTENTTOP',$contentDivs);
    $tpl->set('s','CONTENTBOTTOM','');
} elseif ($value17=="rl") {
    $naviPos='float:right;position:absolute;margin-left:'.bcadd($iWidth,20,0).'px;';
    $contentPos='float:left;';
    $galleryAlign='width:'.round($iWidth+10,0).'px;position:relative;';
    $tpl->set('s','CONTENTTOP',$contentDivs);
    $tpl->set('s','CONTENTBOTTOM','');
} elseif ($value17=="ou") {
    $naviPos="width:".$value1."px";
    $contentPos="";
    $tpl->set('s','CONTENTBOTTOM','<br clear="all"/>'.$contentDivs);
    $tpl->set('s','CONTENTTOP','');
    $galleryAlign='width:'.round($iWidth+10,0).'px;position:relative;';
    $numOfThumbs=substr(round($value1/($tWidth+6),2),0,-3);
    echo $numOfThumbs;
} elseif ($value17=="uo") {
    $naviPos="width:".$value1."px";
    $contentPos="";
    $tpl->set('s','CONTENTTOP',$contentDivs);
    $tpl->set('s','CONTENTBOTTOM','');
    $galleryAlign='width:'.round($iWidth+10,0).'px;position:relative;';
    $numOfThumbs=substr(round($value1/($tWidth+6),2),0,-3);
}

if ($value18=="l") {
    $galleryAlign.="left:0px;";
} elseif ($value18=="r") {
    $galleryAlign.="right:0px;";
} elseif ($value18=="c") {
    if ($value17=="uo" || $value17=="ou") {
        if ($iWidth>$naviWidth) $thisWidth=round($iWidth+30,0);
        else $thisWidth=$naviWidth;
    } else $thisWidth=round($iWidth+$naviWidth+30,0);
    $galleryAlign='width:'.$thisWidth.'px;position:relative;';
    $galleryAlign.="left:50%;margin-left:-".round($thisWidth/2,0)."px;";
}

// Read the images
$fContent=scandir($cfgClient[$client]['upload'].$value4);
$countFiles=0;
foreach ($fContent as $key => $file) {
    if (is_file($cfgClient[$client]['upload'].$value4.$file)) {
        $fileId=mysql_fetch_assoc(mysql_query("SELECT * FROM ".$cfg[tab][upl]." WHERE filename='".$file."'"));
        $fileId=$fileId[idupl];
        $fileMeta=mysql_fetch_assoc(mysql_query("SELECT * FROM ".$cfg[tab][upl_meta]." WHERE idupl='".$fileId."'"));
        if ($fileMeta[medianame]!="") $medianame=urldecode($fileMeta[medianame]);
        else $medianame=$file;
        if ($fileMeta[description]!="") $description=urldecode($fileMeta[description]);
        else $description="";
        $tpl->set('d', 'HREFORIGINAL', $phpSelf.$modRewriteFiller.'filename='.$file);
        
        // Scale image to thumb size and to smaller size
        // the next lines are necessary, that if the original file was
        // replaced, the file now is resized again
        $iWidth=$iWidthSettings;
        $scaledThumb=cApiImgScale($cfgClient[$client]['upload'].$value4.$file, $tWidth, $tHeight, false, false, $value12);
        
        // right here the decision is made, whether the thumbs should be quadratic
        // or resized within keeping the aspect ratio
        if ($value22=="true") {
            $scaledThumb=str_replace($cfgClient[$client]['path']['htmlpath'],"",$scaledThumb);
            $scaledThumbSize=@getimagesize($scaledThumb);
            if ($scaledThumbSize[0]>$scaledThumbSize[1]) {$tmpHeight=$scaledThumbSize[1];$tmpWidth=$scaledThumbSize[1];}
            else {$tmpWidth=$scaledThumbSize[0];$tmpHeight=$scaledThumbSize[0];}
            $scaledThumb=cApiImgScale($scaledThumb, $tmpWidth, $tmpHeight, true, false, $value12);
        }
        $scaledImage=cApiImgScale($cfgClient[$client]['upload'].$value4.$file, $iWidth, $iHeight, false, false, $value12);
        if ($value15==1) {
            $scaledImage=strrchr($scaledImage,"/");
            if (unlink($cfgClient[$client]['upload'].$value4.$file) && copy($cfgClient[$client]["path"]["frontend"]."cache".$scaledImage, $cfgClient[$client]["upl"]["path"].$value4.$file)) {
                @unlink($cfgClient[$client]["path"]["frontend"]."cache".$scaledImage);
                chmod($cfgClient[$client]["upl"]["path"].$value4.$file,0757);
                $scaledImage=$cfgClient[$client]["htmlpath"]["frontend"].$cfgClient[$client]['upload'].$value4.$file;
            }
        }
        $imgSize=getimagesize(str_replace($cfgClient[$client]["path"]["htmlpath"], $cfgClient[$client]["path"]["frontend"], $scaledImage));
        if ($imgSize[0]<$iWidth) $iWidth=$imgSize[0];
        $file=str_replace("/","",strrchr($scaledImage,"/"));
        
        $tpl->set('d', 'HREFTHUMB', $scaledThumb);
        $tpl->set('d', 'HREFRESIZE', $scaledImage);
        $tpl->set('d', 'TITLE', $medianame);
        $tpl->set('d', 'DOWNLOADORIGINAL', mi18n("Download"));
        $tpl->set('d', 'DESCRIPTION', $description);        
        $tpl->set('s', 'NAVIWIDTH', $naviWidth);
        $tpl->set('s', 'CONTENTPOS', $contentPos);
        $tpl->set('s', 'CLOSEDIV', $contentDivEnd);
        $tpl->set('s', 'NAVIPOS', $naviPos);
        $tpl->set('s', 'GALLERYSETTINGS', $galleryAlign);
        //$tpl->set('s', 'CONTENTWIDTH', round($iWidth+$naviWidth+50,0).'px');
        $tpl->set('s', 'CONTENTWIDTH', $value1.'px');
        $tpl->set('s', 'CONTROLWIDTH', $value1.'px');
        if (round($countFiles+1,0)%$numOfThumbs==0 && $countFiles>0 && $countFiles<sizeof($fContent)) $tpl->set('d','MAKENEWLINE','<br clear="all"/>');
        else $tpl->set('d','MAKENEWLINE','');
        $tpl->next();
        $countFiles++;
    }
}

$tpl->generate('templates/galleriffic.html');

// finally set the images per site to all images if CMS_VALUE[0] is set to 0
if ($value0==0) $value0=$countFiles;
function getMime($filename) {
    $mime_types = array(
        // images
        'png' => 'image/png',
        'jpe' => 'image/jpeg',
        'jpeg' => 'image/jpeg',
        'jpg' => 'image/jpeg',
        'gif' => 'image/gif',
        'bmp' => 'image/bmp',
        'ico' => 'image/vnd.microsoft.icon',
        'tiff' => 'image/tiff',
        'tif' => 'image/tiff',
        'svg' => 'image/svg+xml',
        'svgz' => 'image/svg+xml'
    );

    $ext = strtolower(array_pop(explode('.',$filename)));
    return $mime_types[$ext];
}
?>
<script type="text/javascript">
            // Initially set opacity on thumbs and add
            // additional styling for hover effect on thumbs
            var onMouseOutOpacity = <?php echo $value11; ?>;
            $('#thumbs-adv ul.thumbs li').css('opacity', onMouseOutOpacity)
                .hover(
                    function () {
                        $(this).not('.selected').fadeTo('fast', 5.0);
                    }, 
                    function () {
                        $(this).not('.selected').fadeTo('fast', onMouseOutOpacity);
                    }
                );

            $(document).ready(function() {
                // Initialize Advanced Galleriffic Gallery
                var galleryAdv = $('#gallery-adv').galleriffic('#thumbs-adv', {
                    delay:                  2000,
                    numThumbs:              <?php echo $value0; ?>,
                    preloadAhead:           <?php echo $value0; ?>,
                    enableTopPager:         true,
                    enableBottomPager:      true,
                    imageContainerSel:      '#slideshow-adv',
                    controlsContainerSel:   '#controls-adv',
                    captionContainerSel:    '#caption-adv',
                    loadingContainerSel:    '#loading-adv',
                    renderSSControls:       true,
                    renderNavControls:      true,
                    playLinkText:           '<?php echo mi18n("Slideshow starten");?>',
                    pauseLinkText:          '<?php echo mi18n("Slideshow anhalten");?>',
                    prevLinkText:           '&lsaquo; <?php echo mi18n("Vorheriges Bild");?>',
                    nextLinkText:           '<?php echo mi18n("N&auml;chstes Bild");?> &rsaquo;',
                    nextPageLinkText:       '&rsaquo;',
                    prevPageLinkText:       '&lsaquo;',
                    lastPageLinkText:       '&raquo;',
                    firstPageLinkText:      '&laquo;',
                    enableHistory:          true,
                    autoStart:              false,
                    onChange:               function(prevIndex, nextIndex) {
                        $('#thumbs-adv ul.thumbs').children()
                            .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                            .eq(nextIndex).fadeTo('fast', 1.0);
                    },
                    onTransitionOut:        function(callback) {
                        $('#slideshow-adv, #caption-adv').fadeOut('fast', callback);
                    },
                    onTransitionIn:         function() {
                        $('#slideshow-adv, #caption-adv').fadeIn('fast');
                    },
                    onPageTransitionOut:    function(callback) {
                        $('#thumbs-adv ul.thumbs').fadeOut('fast', callback);
                    },
                    onPageTransitionIn:     function() {
                        $('#thumbs-adv ul.thumbs').fadeIn('fast');
                    }
                });
            });
        </script>
Hier die jquery.galleriffic.js:

Code: Alles auswählen

/*
 * jQuery Galleriffic plugin
 *
 * Copyright (c) 2008 Trent Foley (http://trentacular.com)
 * Licensed under the MIT License:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 * Thanks to Taku Sano (Mikage Sawatari), whose history plugin I adapted to work with Galleriffic
 * Modified by Ghismo (ghismo.com) to disable the location rewrite 
 */
;(function($) {

    // Write noscript style
    document.write("<style type='text/css'>.noscript{display:none}</style>");

    var ver = 'galleriffic-1.0';
    var galleryOffset = 0;
    var galleries = [];
    var allImages = []; 
    var historyCurrentHash;
    var historyBackStack;
    var historyForwardStack;
    var isFirst = false;
    var dontCheck = false;
    var isInitialized = false;

    function getHashFromString(hash) {
        if (!hash) return -1;
        hash = hash.replace(/^.*#/, '');
        if (isNaN(hash)) return -1;
        return (+hash);
    }

    function getHash() {
        var hash = location.hash;
        return getHashFromString(hash);
    }
       
    function getHref() {
        var href = location.href;
        href = href.replace(/#.*$/, '');
        return href;
    }
        
    function registerGallery(gallery) {
        galleries.push(gallery);

        // update the global offset value
        galleryOffset += gallery.data.length;
    }

    function getGallery(hash) {
        for (i = 0; i < galleries.length; i++) {
            var gallery = galleries[i];
            if (hash < (gallery.data.length+gallery.offset))
                return gallery;
        }
        return 0;
    }
    
    function getIndex(gallery, hash) {
        return hash-gallery.offset;
    }
    
    function clickHandler(e, gallery, link) {
        gallery.pause();

        if (!gallery.settings.enableHistory) {
            var hash = getHashFromString(link.href);
            if (hash >= 0) {
                var index = getIndex(gallery, hash);
                if (index >= 0)
                    gallery.goto(index);
            }
            e.preventDefault();
        }
    }

    function historyCallback() {
        // Using present location.hash always (seems to work, unlike the hash argument passed to this callback)
        var hash = getHash();
        if (hash < 0) return;

        var gallery = getGallery(hash);
        if (!gallery) return;
        
        var index = hash-gallery.offset;
        gallery.goto(index);
    }
    
    function historyInit() {
        if (isInitialized) return;
        isInitialized = true; 

        var current_hash = location.hash; //(enableHistory) ? location.hash : currentIndexHash; // Ghismo

        historyCurrentHash = current_hash;
        if ($.browser.msie) {
            // To stop the callback firing twice during initilization if no hash present
            if (historyCurrentHash == '') {
                historyCurrentHash = '#';
            }
        } else if ($.browser.safari) {
            // etablish back/forward stacks
            historyBackStack = [];
            historyBackStack.length = history.length;
            historyForwardStack = [];
            isFirst = true;
        }

        setInterval(function() { historyCheck(); }, 100);
    }
    
    function historyAddHistory(hash) {
        // This makes the looping function do something
        historyBackStack.push(hash);
        historyForwardStack.length = 0; // clear forwardStack (true click occured)
        isFirst = true;
    }
    
    function historyCheck() {
        if ($.browser.safari) {
            if (!dontCheck) {
                var historyDelta = history.length - historyBackStack.length;
                
                if (historyDelta) { // back or forward button has been pushed
                    isFirst = false;
                    if (historyDelta < 0) { // back button has been pushed
                        // move items to forward stack
                        for (var i = 0; i < Math.abs(historyDelta); i++) historyForwardStack.unshift(historyBackStack.pop());
                    } else { // forward button has been pushed
                        // move items to back stack
                        for (var i = 0; i < historyDelta; i++) historyBackStack.push(historyForwardStack.shift());
                    }
                    var cachedHash = historyBackStack[historyBackStack.length - 1];
                    if (cachedHash != undefined) {
                        historyCurrentHash = location.hash; // (enableHistory) ? location.hash : currentIndexHash; // Ghismo
                        historyCallback();
                    }
                } else if (historyBackStack[historyBackStack.length - 1] == undefined && !isFirst) {
                    historyCallback();
                    isFirst = true;
                }
            }
        } else {
            // otherwise, check for location.hash
            var current_hash = location.hash; // (enableHistory) ? location.hash : currentIndexHash; // Ghismo
            if(current_hash != historyCurrentHash) {
                historyCurrentHash = current_hash;
                historyCallback();
            }
        }
    }

    var defaults = {
        delay:                  3000,
        numThumbs:              20,
        preloadAhead:           40, // Set to -1 to preload all images
        enableTopPager:         false,
        enableBottomPager:      true,
        imageContainerSel:      '',
        captionContainerSel:    '',
        controlsContainerSel:   '',
        loadingContainerSel:    '',
        renderSSControls:       true,
        renderNavControls:      true,
        playLinkText:           'Play',
        pauseLinkText:          'Pause',
        prevLinkText:           'Previous',
        nextLinkText:           'Next',
        nextPageLinkText:       'Next &rsaquo;',
        prevPageLinkText:       '&lsaquo; Prev',
        enableHistory:          false,
        autoStart:              false,
        onChange:               undefined, // accepts a delegate like such: function(prevIndex, nextIndex) { ... }
        onTransitionOut:        undefined, // accepts a delegate like such: function(callback) { ... }
        onTransitionIn:         undefined, // accepts a delegate like such: function() { ... }
        onPageTransitionOut:    undefined, // accepts a delegate like such: function(callback) { ... }
        onPageTransitionIn:     undefined  // accepts a delegate like such: function() { ... }
    };

    $.fn.galleriffic = function(thumbsContainerSel, settings) {
        //  Extend Gallery Object
        $.extend(this, {
            ver: function() {
                return ver;
            },

            initializeThumbs: function() {
                this.data = [];
                var gallery = this;
                
                this.$thumbsContainer.find('ul.thumbs > li').each(function(i) {
                    var $li = $(this);
                    var $aThumb = $li.find('a.thumb');
                    var hash = gallery.offset+i;

                    gallery.data.push({
                        title:$aThumb.attr('title'),
                        slideUrl:$aThumb.attr('href'),
                        caption:$li.find('.caption').remove(),
                        hash:hash
                    });

                    // Setup history
                    $aThumb.attr('rel', 'history');
                    $aThumb.attr('href', getHref()+'#'+hash);
                    $aThumb.click(function(e) {
                        clickHandler(e, gallery, this);
                    });
                });
                return this;
            },

            isPreloadComplete: false,

            preloadInit: function() {
                if (this.settings.preloadAhead == 0) return this;
                
                this.preloadStartIndex = this.currentIndex;
                var nextIndex = this.getNextIndex(this.preloadStartIndex);
                return this.preloadRecursive(this.preloadStartIndex, nextIndex);
            },
            
            preloadRelocate: function(index) {
                // By changing this startIndex, the current preload script will restart
                this.preloadStartIndex = index;
                return this;
            },

            preloadRecursive: function(startIndex, currentIndex) {
                // Check if startIndex has been relocated
                if (startIndex != this.preloadStartIndex) {
                    var nextIndex = this.getNextIndex(this.preloadStartIndex);
                    return this.preloadRecursive(this.preloadStartIndex, nextIndex);
                }

                var gallery = this;

                // Now check for preloadAhead count
                var preloadCount = currentIndex - startIndex;
                if (preloadCount < 0)
                    preloadCount = this.data.length-1-startIndex+currentIndex;
                if (this.settings.preloadAhead >= 0 && preloadCount > this.settings.preloadAhead) {
                    // Do this in order to keep checking for relocated start index
                    setTimeout(function() { gallery.preloadRecursive(startIndex, currentIndex); }, 500);
                    return this;
                }

                var imageData = this.data[currentIndex];
                if (!imageData)
                    return this;

                // If already loaded, continue
                if (imageData.image)
                    return this.preloadNext(startIndex, currentIndex); 
                
                // Preload the image
                var image = new Image();
                
                image.onload = function() {
                    imageData.image = this;
                    gallery.preloadNext(startIndex, currentIndex);
                };

                image.alt = imageData.title;
                image.src = imageData.slideUrl;

                return this;
            },
            
            preloadNext: function(startIndex, currentIndex) {
                var nextIndex = this.getNextIndex(currentIndex);
                if (nextIndex == startIndex) {
                    this.isPreloadComplete = true;
                } else {
                    // Use set timeout to free up thread
                    var gallery = this;
                    setTimeout(function() { gallery.preloadRecursive(startIndex, nextIndex); }, 100);
                }
                return this;
            },

            getNextIndex: function(index) {
                var nextIndex = index+1;
                if (nextIndex >= this.data.length)
                    nextIndex = 0;
                return nextIndex;
            },
            
            getPrevIndex: function(index) {
                var prevIndex = index-1;
                if (prevIndex < 0)
                    prevIndex = this.data.length-1;
                return prevIndex;
            },

            pause: function() {
                if (this.interval)
                    this.toggleSlideshow();
                
                return this;
            },

            play: function() {
                if (!this.interval)
                    this.toggleSlideshow();
                
                return this;
            },

            toggleSlideshow: function() {
                if (this.interval) {
                    clearInterval(this.interval);
                    this.interval = 0;
                    
                    if (this.$controlsContainer) {
                        this.$controlsContainer
                            .find('div.ss-controls a').removeClass().addClass('play')
                            .attr('title', this.settings.playLinkText)
                            .attr('href', getHref()+'#play')
                            .html(this.settings.playLinkText);
                    }
                } else {
                    this.ssAdvance();

                    var gallery = this;
                    this.interval = setInterval(function() {
                        gallery.ssAdvance();
                    }, this.settings.delay);
                    
                    if (this.$controlsContainer) {
                        this.$controlsContainer
                            .find('div.ss-controls a').removeClass().addClass('pause')
                            .attr('title', this.settings.pauseLinkText)
                            .attr('href', getHref()+'#pause')
                            .html(this.settings.pauseLinkText);
                    }
                }

                return this;
            },

            ssAdvance: function() {
                var nextIndex = this.getNextIndex(this.currentIndex);
                var nextHash = this.data[nextIndex].hash;

                // Seems to be working on both FF and Safari
                if (this.settings.enableHistory)
                    location.href = getHref()+'#'+nextHash;
                else
                    this.goto(nextIndex);

                // IE we need to explicity call goto
                //if ($.browser.msie) {
                //  this.goto(nextIndex);
                //}

                return this;
            },

            goto: function(index) {
                if (index < 0) index = 0;
                else if (index >= this.data.length) index = this.data.length-1;
                
                if (this.settings.onChange)
                    this.settings.onChange(this.currentIndex, index);
                
                this.currentIndex = index;
                this.preloadRelocate(index);
                return this.refresh();
            },
            
            refresh: function() {
                var imageData = this.data[this.currentIndex];
                if (!imageData)
                    return this;
                
                // Flag we are transitioning
                var isTransitioning = true;

                var gallery = this;

                var transitionOutCallback = function() {
                    // Flag that the transition has completed
                    isTransitioning = false;

                    // Update Controls
                    if (gallery.$controlsContainer) {
                        gallery.$controlsContainer
                            .find('div.nav-controls a.prev').attr('href', getHref()+'#'+gallery.data[gallery.getPrevIndex(gallery.currentIndex)].hash).end()
                            .find('div.nav-controls a.next').attr('href', getHref()+'#'+gallery.data[gallery.getNextIndex(gallery.currentIndex)].hash);
                    }

                    var imageData = gallery.data[gallery.currentIndex];

                    // Replace Caption
                    if (gallery.$captionContainer) {
                        gallery.$captionContainer.empty().append(imageData.caption);
                    }

                    if (imageData.image) {
                        gallery.buildImage(imageData.image);
                    } else {
                        // Show loading container
                        if (gallery.$loadingContainer) {
                            gallery.$loadingContainer.show();
                        }
                    }
                }

                if (this.settings.onTransitionOut) {
                    this.settings.onTransitionOut(transitionOutCallback);
                } else {
                    this.$transitionContainers.hide();
                    transitionOutCallback();
                }

                if (!imageData.image) {
                    var image = new Image();
                    
                    // Wire up mainImage onload event
                    image.onload = function() {
                        imageData.image = this;

                        if (!isTransitioning) {
                            gallery.buildImage(imageData.image);
                        }
                    };

                    // set alt and src
                    image.alt = imageData.title;
                    image.src = imageData.slideUrl;
                }

                // This causes the preloader (if still running) to relocate out from the currentIndex
                this.relocatePreload = true;

                return this.syncThumbs();
            },
            
            buildImage: function(image) {
                if (this.$imageContainer) {
                    this.$imageContainer.empty();

                    var gallery = this;
                    var nextIndex = this.getNextIndex(this.currentIndex);

                    // Hide the loading conatiner
                    if (this.$loadingContainer) {
                        this.$loadingContainer.hide();
                    }

                    // Setup image
                    this.$imageContainer
                        .append('<span class="image-wrapper"><a class="advance-link" rel="history" href="'+getHref()+'#'+this.data[this.getNextIndex(this.currentIndex)].hash+'" title="'+image.alt+'"></a></span>')
                        .find('a')
                        .append(image)
                        .click(function(e) {
                            clickHandler(e, gallery, this);
                        });
                }

                if (this.settings.onTransitionIn)
                    this.settings.onTransitionIn();
                else
                    this.$transitionContainers.show();

                return this;
            },

            syncThumbs: function() {
                if (this.$thumbsContainer) {
                    var page = Math.floor(this.currentIndex / this.settings.numThumbs);
                    if (page != this.currentPage) {
                        this.currentPage = page;
                        this.updateThumbs();
                    }

                    // Remove existing selected class and add selected class to new thumb
                    var $thumbs = this.$thumbsContainer.find('ul.thumbs').children();
                    $thumbs.filter('.selected').removeClass('selected');
                    $thumbs.eq(this.currentIndex).addClass('selected');
                }

                return this;
            },

            updateThumbs: function() {
                var gallery = this;
                var transitionOutCallback = function() {
                    gallery.rebuildThumbs();

                    // Transition In the thumbsContainer
                    if (gallery.settings.onPageTransitionIn)
                        gallery.settings.onPageTransitionIn();
                    else
                        gallery.$thumbsContainer.show();
                };

                // Transition Out the thumbsContainer
                if (this.settings.onPageTransitionOut) {
                    this.settings.onPageTransitionOut(transitionOutCallback);
                } else {
                    this.$thumbsContainer.hide();
                    transitionOutCallback();
                }

                return this;
            },

            rebuildThumbs: function() {
                // Initialize currentPage to first page
                if (this.currentPage < 0)
                    this.currentPage = 0;
                
                var needsPagination = this.data.length > this.settings.numThumbs;

                // Rebuild top pager
                var $topPager = this.$thumbsContainer.find('div.top');
                if ($topPager.length == 0)
                    $topPager = this.$thumbsContainer.prepend('<div class="top pagination"></div>').find('div.top');

                if (needsPagination && this.settings.enableTopPager) {
                    $topPager.empty();
                    this.buildPager($topPager);
                }

                // Rebuild bottom pager
                if (needsPagination && this.settings.enableBottomPager) {
                    var $bottomPager = this.$thumbsContainer.find('div.bottom');
                    if ($bottomPager.length == 0)
                        $bottomPager = this.$thumbsContainer.append('<div class="bottom pagination"></div>').find('div.bottom');
                    else
                        $bottomPager.empty();

                    this.buildPager($bottomPager);
                }

                var startIndex = this.currentPage*this.settings.numThumbs;
                var stopIndex = startIndex+this.settings.numThumbs-1;
                if (stopIndex >= this.data.length)
                    stopIndex = this.data.length-1;

                // Show/Hide thumbs
                var $thumbsUl = this.$thumbsContainer.find('ul.thumbs');
                $thumbsUl.find('li').each(function(i) {
                    var $li = $(this);
                    if (i >= startIndex && i <= stopIndex) {
                        $li.show();
                    } else {
                        $li.hide();
                    }
                });

                // Remove the noscript class from the thumbs container ul
                $thumbsUl.removeClass('noscript');
                
                return this;
            },

            buildPager: function(pager) {
                var gallery = this;
                var startIndex = this.currentPage*this.settings.numThumbs;
                
                // Prev Page Link
                if (this.currentPage > 0) {
                    pager.append('<a rel="history" href="'+getHref()+'#0" title="'+this.settings.firstPageLinkText+'">'+this.settings.firstPageLinkText+'</a>');
                    var prevPage = startIndex - this.settings.numThumbs;
                    pager.append('<a rel="history" href="'+getHref()+'#'+this.data[prevPage].hash+'" title="'+this.settings.prevPageLinkText+'">'+this.settings.prevPageLinkText+'</a>');
                }

                // Page Index Links
                for (i=this.currentPage-4; i<=this.currentPage+4; i++) {
                    var pageNum = i+1;
                    
                    if (i == this.currentPage)
                        pager.append('<span class="current">'+pageNum+'</span>');
                    else if (i>=0 && i<this.numPages) {
                        var imageIndex = i*this.settings.numThumbs;
                        pager.append('<a rel="history" href="'+getHref()+'#'+this.data[imageIndex].hash+'" title="'+pageNum+'">'+pageNum+'</a>');
                    }
                }

                // Next Page Link
                var nextPage = startIndex+this.settings.numThumbs;
                if (nextPage < this.data.length) {
                    pager.append('<a rel="history" href="'+getHref()+'#'+this.data[nextPage].hash+'" title="'+this.settings.nextPageLinkText+'">'+this.settings.nextPageLinkText+'</a>');
			var allPages = (this.data.length-1)/this.settings.numThumbs;
			var lastPage = allPages*this.settings.numThumbs;
                	pager.append('<a rel="history" href="'+getHref()+'#'+lastPage+'" title="'+this.settings.lastPageLinkText+'">'+this.settings.lastPageLinkText+'</a>');
                }

                pager.find('a').click(function(e) {
                    clickHandler(e, gallery, this);
                });

                return this;
            }
        });

        // Now initialize the gallery
        this.settings = $.extend({}, defaults, settings);
        //enableHistory = this.settings.enableHistory; // Ghismo

        if (this.interval)
            clearInterval(this.interval);

        this.interval = 0;
        
        if (this.settings.imageContainerSel) this.$imageContainer = $(this.settings.imageContainerSel);
        if (this.settings.captionContainerSel) this.$captionContainer = $(this.settings.captionContainerSel);
        if (this.settings.loadingContainerSel) this.$loadingContainer = $(this.settings.loadingContainerSel);

        // Setup the jQuery object holding each container that will be transitioned
        this.$transitionContainers = $([]);
        if (this.$imageContainer)
            this.$transitionContainers = this.$transitionContainers.add(this.$imageContainer);
        if (this.$captionContainer)
            this.$transitionContainers = this.$transitionContainers.add(this.$captionContainer);
        
        // Set the hash index offset for this gallery
        this.offset = galleryOffset;

        this.$thumbsContainer = $(thumbsContainerSel);
        this.initializeThumbs();

        // Add this gallery to the global galleries array
        registerGallery(this);

        this.numPages = Math.ceil(this.data.length/this.settings.numThumbs);
        this.currentPage = -1;
        this.currentIndex = 0;
        var gallery = this;

        // Hide the loadingContainer
        if (this.$loadingContainer)
            this.$loadingContainer.hide();

        // Setup controls
        if (this.settings.controlsContainerSel) {
            this.$controlsContainer = $(this.settings.controlsContainerSel).empty();
            
            if (this.settings.renderSSControls) {
                if (this.settings.autoStart) {
                    this.$controlsContainer
                        .append('<div class="ss-controls"><a href="'+getHref()+'#pause" class="pause" title="'+this.settings.pauseLinkText+'">'+this.settings.pauseLinkText+'</a></div>');
                } else {
                    this.$controlsContainer
                        .append('<div class="ss-controls"><a href="'+getHref()+'#play" class="play" title="'+this.settings.playLinkText+'">'+this.settings.playLinkText+'</a></div>');
                }

                this.$controlsContainer.find('div.ss-controls a')
                    .click(function(e) {
                        gallery.toggleSlideshow();
                        e.preventDefault();
                        return false;
                    });
            }
        
            if (this.settings.renderNavControls) {
                var $navControls = this.$controlsContainer
                    .append('<div class="nav-controls"><a class="prev" rel="history" title="'+this.settings.prevLinkText+'">'+this.settings.prevLinkText+'</a><a class="next" rel="history" title="'+this.settings.nextLinkText+'">'+this.settings.nextLinkText+'</a></div>')
                    .find('div.nav-controls a')
                    .click(function(e) {
                        clickHandler(e, gallery, this);
                    });
            }
        }

        // Initialize history only once when the first gallery on the page is initialized
        historyInit();
        
        // Build image
        var hash = getHash();
        var hashGallery = (hash >= 0) ? getGallery(hash) : 0;
        var gotoIndex = (hashGallery && this == hashGallery) ? (hash-this.offset) : 0;
        this.goto(gotoIndex);

        if (this.settings.autoStart) {
            
            setTimeout(function() { gallery.play(); }, this.settings.delay);
        }

        // Kickoff Image Preloader after 1 second
        setTimeout(function() { gallery.preloadInit(); }, 1000);

        return this;
    };
})(jQuery);
Ich hoffe auf Hilfe, da meine PHP-Kenntnisse dafür noch nicht ausreichen.

Gruß lunsen_de

Oldperl
Beiträge: 4129
Registriert: Do 30. Jun 2005, 22:56
Wohnort: Eltmann, Unterfranken, Bayern
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Oldperl » Mo 28. Nov 2011, 12:21

lunsen_de hat geschrieben:Hallo, ich habe das Problem, dass sich ein Kunde über die Qualität der großen Bilder beschwert bzw. warum nicght die Originale angezeigt werden.
Ähmm, das hört sich nach einer Jobanfrage an. Möchtest du das ich den Part hier abtrenne und ins Job-Forum verschiebe?

Gruß aus Franken

Ortwin
ConLite 2.1, alternatives und stabiles Update von Contenido 4.8.x unter PHP 7.x - Download und Repo auf Gitport.de
phpBO Search Advanced - das Suchwort-Plugin für CONTENIDO 4.9
Mein Entwickler-Blog

lunsen_de
Beiträge: 213
Registriert: Mo 17. Okt 2005, 20:26
Wohnort: Weimar
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von lunsen_de » Mo 28. Nov 2011, 12:39

Hallo, eigentlich hielt ich das nicht für einen Job, da es beim Modul sicher allgemein gut wäre, wenn nur Bilder neu berechnet werden, bei denen das Original größer als die eingestellten Werte sind. Den Qualilitätsverlust eines Bildes, dass von den Abmessungen genauso groß ist wie das Original, könnte man sich doch eigentlich sparen.

(Wenn sich dazu allerdings in den nächsten Tagen keine Lösung/Ansatz findet, wäre das mit dem Job eine Notlösung.)

Gruß lunsen_de

Oldperl
Beiträge: 4129
Registriert: Do 30. Jun 2005, 22:56
Wohnort: Eltmann, Unterfranken, Bayern
Kontaktdaten:

Re: Modul: Galleriffic (Bildergalerie mit jQuery)

Beitrag von Oldperl » Mo 28. Nov 2011, 15:39

Hmm, ok, dazu verkneif ich mir mal lieber eine weitere Kommentierung und stell den Zaunpfahl wieder weg. :motz:
Solltest du auf die "Notlösung" zurückgreifen wollen dann gib mir ne kurze Info und ich verschieb das hier. :wink:

Gruß aus Franken

Ortwin
ConLite 2.1, alternatives und stabiles Update von Contenido 4.8.x unter PHP 7.x - Download und Repo auf Gitport.de
phpBO Search Advanced - das Suchwort-Plugin für CONTENIDO 4.9
Mein Entwickler-Blog

Gesperrt