[TYPO3-german] Bilder zufällig zurückgeben für Extension

Sebastian Jurk info at top-info.org
Wed Aug 31 20:55:18 CEST 2011 

Wenn ich jQuery so gut könnte hätte ich es probiert... obwohl ich mich 
frage ob das nicht die Performance runterzieht. Es scrollen 10 Bilder 
und es ruckelt im Firefox schon ganz schön... ein CPU-Kern wird im 
Standardbetrieb schon voll genutzt dafür...

Ich habe jetzt eine kleine Verbesserung dadurch erreicht dass ich die 
Aufrufe der Slidefunktion von 10ms auf 35ms erhöht habe. Ist etwas 
langsamer geworden aber es ruckelt auch etwas weniger... Die Aufrufe auf 
95ms zu erhöhen und dafür immer 2px weiterzusliden ist auch keine Lösung 
da es dann nicht mehr flüssig aussieht...

Naja... erstmal geht es denke ich...

Am 30.08.2011 18:11, schrieb Rainer Schleevoigt:
> On 8/30/11 5:55 PM, Sebastian Jurk wrote:
>> Hallo,
>>
>> ich finde grad einfach nicht die Lösung und sitz da jetzt schon einige
>> ZEit dran...
>>
>> Ich habe die Extension imagescroller installiert. Diese bekommt die
>> Bilder aus einem Contentelement vom Typ Imagescroller der aber
>> eigentlich so aufgebaut ist wie ein Contentelement Bild.
> Eine Lösung: mache es mit Javascript und las die EXT unangetastet.
>
> Du nimmst einen jQuery-Ausdruck,der Dir die Bilder rausfumelt, shuffle
> sie und flansche sie wieder ein. Et voilà!
> Rainer
>>
>> Ich brauche diese Bilder aber in zufälliger Reihenfolge. Ich habe
>> schon alle möglichen Extensions ausprobiert aber es war keine dabei
>> die dazu passt. Deshalb wollte ich das ganze jetzt in der Extension
>> selbst erledigen... aber ich komme einfach nicht drauf wo ich was
>> ändern muss. Es scheint fast wie wenn es egal ist was ich ändere.
>>
>> Ich schätze da muss einfach ein shuffle benutzt werden um ein Array zu
>> erzeugen mit welchem man dann die Bildurls und die Links zu den
>> Bildern ändert. Nur alles was ich probiere bleibt egal.
>>
>> Das hier ist die originale tx_imagescroller_pi1.php... kann mir jemand
>> sagen wo ich ansetzen sollte?
>>
>> Danke!
>> Sebastian
>>
>> <?php
>> /***************************************************************
>> * Copyright notice
>> *
>> * (c) 2007 Bernd Wilke <t3-YYYY at bernd-wilke.net>
>> * All rights reserved
>> *
>> * This script is part of the TYPO3 project. The TYPO3 project is
>> * free software; you can redistribute it and/or modify
>> * it under the terms of the GNU General Public License as published by
>> * the Free Software Foundation; either version 2 of the License, or
>> * (at your option) any later version.
>> *
>> * The GNU General Public License can be found at
>> * http://www.gnu.org/copyleft/gpl.html.
>> *
>> * This script is distributed in the hope that it will be useful,
>> * but WITHOUT ANY WARRANTY; without even the implied warranty of
>> * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
>> * GNU General Public License for more details.
>> *
>> * This copyright notice MUST APPEAR in all copies of the script!
>> ***************************************************************/
>>
>> require_once(PATH_tslib.'class.tslib_pibase.php');
>> define('NL',"\n");
>>
>> /**
>> * Plugin 'Scrolling images' for the 'imagescroller' extension.
>> *
>> * @author Bernd Wilke <t3-YYYY at bernd-wilke.net>
>> * @package TYPO3
>> * @subpackage tx_imagescroller
>> */
>> class tx_imagescroller_pi1 extends tslib_pibase {
>> var $prefixId = 'tx_imagescroller_pi1'; // Same as class name
>> var $scriptRelPath = 'pi1/class.tx_imagescroller_pi1.php'; // Path to
>> this script relative to the extension dir.
>> var $extKey = 'imagescroller'; // The extension key.
>> var $pi_checkCHash = true;
>>
>> /**
>> * The main method of the PlugIn
>> *
>> * @param string $content: The PlugIn content
>> * @param array $conf: The PlugIn configuration
>> * @return The content that is displayed on the website
>> */
>> function main($content,$conf) {
>> $modid='_'.$this->cObj->data['uid'];
>>
>> $javascriptinclude = '<script
>> src="typo3conf/ext/'.$this->extKey.'/res/motiongallery.js"
>> type="text/javascript"></script>';
>> $GLOBALS['TSFE']->additionalHeaderData[$this->extKey] =
>> $javascriptinclude;
>> $preselector = '.'.$this->prefixId.' ';
>>
>> $cssinclude = NL.'<style type="text/css">'.NL
>> .'/*<![CDATA[*/'.NL
>> ;
>>
>> $cssinclude_global = NL.'<style type="text/css">'.NL
>> .'/*<![CDATA[*/'.NL
>> ;
>>
>> $cssinclude_global .= ''//.'#statusdiv { position:absolute;
>> left:-300px; visibility: hidden; }'.NL
>> //.'.motioncontainer a:hover { }'.NL
>> .$preselector.' { position:relative; overflow:hidden; }'.NL
>> ;
>>
>> $nocaption =$conf['noCaption'] ? $conf['noCaption'] : false;
>>
>> $imW=$this->cObj->data['imagewidth'];
>> if ($imW==0) $imW=400;
>> $imCol=$this->cObj->data['imagecols'];
>> if ($imCol==0) $imCol=1;
>> $width=$imW*$imCol;
>>
>> if (!$this->cObj->data['imageheight'])
>> $this->cObj->data['imageheight']=200;
>> $cssinclude.=NL
>> .'#motioncontainer'.$modid.' { width:'.(0+$width).'px;
>> height:'.($this->cObj->data['imageheight']+($nocaption?0:30)).'px;
>> max-width:1000px; }'.NL
>> .'#motioncontainer'.$modid.' a:hover { }'.NL
>> ;
>>
>> $galleryend =$conf['galleryEndMsg'];
>> $restarea =trim($conf['restArea']);
>> if (substr($restarea,-1)=='%') {
>> $restarea = intval($restarea);
>> if ($restarea < 0) $restarea = 0;
>> if (90 < $restarea) $restarea = 90;
>> $restarea = intval( $width * $restarea / 100);
>> } else {
>> $restarea=intval($restarea);
>> if ($restarea<1) $restarea =100;
>> }
>> $maxspeed =intval($conf['maxSpeed']); if ($maxspeed<1 ) $maxspeed =20;
>> if ($width/10<$maxspeed) $maxspeed=intval($width/10);
>> $arrrfile =$conf['rightArr']; if (!$arrrfile)
>> $arrrfile='typo3conf/ext/'.$this->extKey.'/res/arr-r.png';
>> $arrlfile =$conf['leftArr' ]; if (!$arrlfile)
>> $arrlfile='typo3conf/ext/'.$this->extKey.'/res/arr-l.png';
>> $noArrows =$conf['noArrows'] ? $conf['noArrows'] : false;
>> $precaption =$conf['preCaption'];
>> $postcaption =$conf['postCaption'];
>> $pretitle =$conf['preTitle'];
>> $posttitle =$conf['postTitle'];
>> $prealt =$conf['preAlt'];
>> $postalt =$conf['postAlt'];
>> $prepics =$conf['prePics'];
>> $postpics =$conf['postPics'];
>> $wraparound
>> =isset($this->cObj->data['tx_imagescroller_wraparound'])?$this->cObj->data['tx_imagescroller_wraparound']:$conf['wrapAround'];
>>
>> $runforever
>> =isset($this->cObj->data['tx_imagescroller_runforever'])?$this->cObj->data['tx_imagescroller_runforever']:$conf['runForever'];
>>
>> $initialmove
>> =isset($this->cObj->data['tx_imagescroller_initialmove'])?$this->cObj->data['tx_imagescroller_initialmove']:intval($conf['initialMove']);
>>
>> $startdelay =intval($conf['delay']);
>>
>> $piclist = t3lib_div::trimExplode(',',$this->cObj->data['image']);
>> $captionlist = t3lib_div::trimExplode(NL
>> ,$this->cObj->data['imagecaption']);
>> $titlelist = t3lib_div::trimExplode(NL ,$this->cObj->data['titleText']);
>> $altlist = t3lib_div::trimExplode(NL ,$this->cObj->data['altText']);
>> $linklist = t3lib_div::trimExplode(',',$this->cObj->data['image_link']);
>> $longdesclist=
>> t3lib_div::trimExplode(',',$this->cObj->data['longdescURL']);
>>
>> $ma=array('TOTAL'=>count($piclist)
>> );
>>
>> $prepics =$this->cObj->substituteMarkerArray($prepics
>> ,$ma,'###|###',$uppercase=1);
>> $postpics=$this->cObj->substituteMarkerArray($postpics,$ma,'###|###',$uppercase=1);
>>
>>
>> $GLOBALS['TSFE']->setJS($this->extKey
>> ,'//Set message to show at end of gallery. Enter "" to disable
>> message.'.NL
>> .'var endofgallerymsg='.($galleryend?'\'<span
>> class="galleryend">'.$galleryend.'</span>\'':'\'\'').NL
>> .'// Set width of the "neutral" area in the center of the gallery.'.NL
>> .'var restarea='.(0+$restarea).';'.NL
>> .'// Set top scroll speed in pixels. Script auto creates a range from
>> 0 to top speed.'.NL
>> .'var maxspeed='.(0+$maxspeed).';'.NL
>> );
>>
>> $content.= //'<link rel="stylesheet" type="text/css"
>> href="gallerystyle.css" />'.NL.
>> '<!-- Do not edit IE conditional style below -->'.NL
>> .'<!--[if gte IE 5.5]>'.NL
>> .'<style type="text/css">'.NL
>> .'/*<![CDATA[*/'.NL
>> //.'#motioncontainer_'.$this->cObj->data['uid'].'
>> {width:expression(Math.min(this.offsetWidth,
>> maxwidth["'.$modid.'"])+"px");}'.NL
>> .'#motioncontainer_'.$this->cObj->data['uid'].' {zoom:1;
>> width:expression(((0 < this.offsetWidth)?Math.min(this.offsetWidth,
>> maxwidth["'.$modid.'"]):maxwidth["'.$modid.'"])+"px");}'.NL
>> .'/*]]>*/'.NL
>> .'</style>'.NL
>> .'<![endif]-->'.NL
>> .'<!-- End Conditional Style -->'.NL
>> ;
>>
>> $height=$this->cObj->data['imageheight'];
>> if (!$height) $height=200;
>>
>> if ($prepics) $content.='<div class="prepics">'.$prepics.'</div>'.NL;
>> $content.='<div id="motioncontainer'.$modid.'"
>> class="'.$this->prefixId.'">'.NL;
>> if (!$noArrows) {
>> $arrr_size=getimagesize($arrrfile);
>> $arrl_size=getimagesize($arrlfile);
>> $imgdim = array('r'=>array('x'=>$arrr_size[0],'y'=>$arrr_size[1])
>> ,'l'=>array('x'=>$arrl_size[0],'y'=>$arrl_size[1])
>> );
>> if ($nocaption) $height-=30;
>> $content.='<div id="arr_l'.$modid.'"><img src="clear.gif" alt="&lt;"
>> title="&lt;" /></div>'.NL
>> .'<div id="arr_r'.$modid.'"><img src="clear.gif" alt="&gt;"
>> title="&gt;" /></div>'.NL;
>> $cssinclude .= NL
>> .'#arr_l'.$modid.' { background-image:url('.$arrlfile.');
>> position:absolute; top:'.(($height-$imgdim['l']['y'])/2).'px;
>> left:0px; height:'.$imgdim['l']['y'].'px;
>> width:'.$imgdim['l']['x'].'px; z-index:9; }'.NL
>> .'#arr_r'.$modid.' { background-image:url('.$arrrfile.');
>> position:absolute;
>> top:'.(($height-$imgdim['r']['y'])/2).'px;right:0px;
>> height:'.$imgdim['r']['y'].'px; width:'.$imgdim['r']['x'].'px;
>> z-index:9; }'.NL
>> ;
>> }
>>
>> $cssinclude_global .= $preselector.'.caption {
>> position:absolute;bottom:-1em; }'.NL;
>>
>> $tmpcontent='';
>> for ($i=0; $i<count($piclist); $i++) {
>> $ma['NO']=$i+1;
>>
>> $actcaption=$precaption.trim($captionlist[$i]).$postcaption;
>> $actcaption=$this->cObj->substituteMarkerArray($actcaption,$ma,'###|###',$uppercase=1);
>>
>> $acttitle=$pretitle.trim($titlelist[$i]).$posttitle;
>> $acttitle=$this->cObj->substituteMarkerArray($acttitle,$ma,'###|###',$uppercase=1);
>>
>> $actalt=$prealt.trim($altlist[$i]).$postalt;
>> $actalt=$this->cObj->substituteMarkerArray($actalt,$ma,'###|###',$uppercase=1);
>>
>>
>> // just render one single image:
>> $data = $this->cObj->data;
>>
>> $data['image'] = $piclist[$i];
>> $data['imagecaption'] = $actcaption;
>> $data['titleText'] = $acttitle;
>> $data['altText'] = $actalt;
>> $data['image_link'] = $linklist[$i];
>> $data['longdescURL'] = $longdesclist[$i];
>>
>> $data['CType'] = 'image';
>> $cObj = t3lib_div::makeInstance('tslib_cObj');
>> $cObj->start($data,'tt_content');
>> $img = $cObj->cObjGetSingle('<tt_content', array());
>>
>> // get central image or link out of all wraps:
>> $pos_a = strpos($img,'<a href');
>> $pos_img = strpos($img,'<img ');
>> if ($pos_a && $pos_a < $pos_img) {
>> $img = substr($img,$pos_a);
>> $pos_a_end = strpos($img,'</a>');
>> $img = substr($img,0,$pos_a_end+4);
>> } else if ($pos_img) {
>> $img = substr($img,$pos_img);
>> $pos_img_end = strpos($img,'/>');
>> $img = substr($img,0,$pos_img_end+2);
>>
>> } else {
>> $img = 'no image found:'.$img;
>> }
>>
>> if (!$nocacption) {
>> // insert caption before image. it will be under image because of css
>> //$img=str_replace('<img', '<span
>> style="position:absolute;bottom:-1em;"> '.$actcaption.'</span><img',
>> $img);
>> $apos = strpos($img,'</a>');
>> if ($apos) {
>> $img=str_replace('</a>', '<span class="caption">
>> '.$actcaption.'</span></a>', $img);
>> } else {
>> $img .= '<span class="caption"> '.$actcaption.'</span>';
>> }
>> }
>>
>> $tmpcontent.='<span style="position:relative;">'
>> .$img
>> .'</span>'.NL;
>> }
>> $content.='<div id="motiongallery'.$modid.'"
>> class="motiongallery">'.NL.NL
>> .'<div id="trueContainer'.$modid.'" class="trueContainer">'.NL
>> .$tmpcontent
>> .($wraparound?$tmpcontent:'')
>> .'</div>'.NL
>> .'</div><!-- motiongallery'.$modid.' -->'.NL
>> .'</div><!-- miotioncontainer'.$modid.' -->'.NL
>> ;
>> $cssinclude_global .= $preselector.'.motiongallery {
>> position:absolute; left:0; top:0; white-space:nowrap; }'.NL
>> .$preselector.'.trueContainer { white-space:nowrap; }'.NL
>> ;
>> if ($postpics) $content.='<div class="postpics">'.$postpics.'</div>'.NL;
>>
>> switch ($this->cObj->data['imageorient']) {
>> case 0:
>> case 3:
>> //center
>> $alignment=2; break;
>>
>> case 1:
>> case 4:
>> case 6:
>> // right
>> $alignment=1; break;
>>
>> case 2:
>> case 5:
>> case 7:
>> default:
>> // left
>> $alignment=0; break;
>>
>> }
>>
>> $_EXTKEY=$this->extKey;
>> require(t3lib_extMgm::extPath($this->extKey).'ext_emconf.php');
>>
>> $content.=NL.'<script type="text/javascript">'.NL
>> .'//<![CDATA['.NL
>> .'imagescrollerversion="'.$EM_CONF[$this->extKey]['version'].'";'.NL
>> .'// Set to maximum width for gallery - must be less than the actual
>> length of the image train.'.NL
>> .'maxwidth["'.$modid.'"]=1000;'.NL
>> .'// Set to 1 for left start, 0 for right, 2 for center.'.NL
>> .'startpos["'.$modid.'"]='.(0+$alignment).';'.NL
>> ;
>> if ($wraparound) $content.='wraparound["'.$modid.'"]=1;'.NL;
>> if ($runforever) $content.='runforever["'.$modid.'"]=1;'.NL;
>> if ($startdelay>0) $content.='delay('.$startdelay.');'.NL;
>> $content.='fillup("'.$modid.'");'.NL;
>>
>> if ($initialmove) {
>> $content.='scrollspeed='.abs($initialmove).';'.NL;
>> if ($initialmove < 0)
>> $content.='moveright("'.$modid.'");'.NL;
>> else
>> $content.='moveleft("'.$modid.'");'.NL;
>> }
>> $content.=''
>> .'//]]>'.NL
>> .'</script>'.NL
>> ;
>>
>> $cssinclude .= '/*]]>*/'.NL
>> .'</style>'.NL
>> ;
>> $cssinclude_global .= '/*]]>*/'.NL
>> .'</style>'.NL
>> ;
>> $GLOBALS['TSFE']->additionalHeaderData[$this->extKey.'_css'] =
>> $cssinclude_global;
>> $GLOBALS['TSFE']->additionalHeaderData[$this->extKey.$modid.'_css'] =
>> $cssinclude;
>>
>> return $content;
>> }
>> }
>>
>>
>>
>> if (defined('TYPO3_MODE') &&
>> $TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/imagescroller/pi1/class.tx_imagescroller_pi1.php'])
>> {
>> include_once($TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/imagescroller/pi1/class.tx_imagescroller_pi1.php']);
>>
>> }
>>
>> ?>
>> _______________________________________________
>> TYPO3-german mailing list
>> TYPO3-german at lists.typo3.org
>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>
>

More information about the TYPO3-german mailing list