Top  Branding  Banner 
blank.gif
blank.gif
triangle.gif Du er her: /  Forsiden  /  Kildekoden  /  Component  /  Slideshow   Login nu   Login
blank.gif
««« Se kilde koden
blank.gif
tl.gif Cms tr.gif tls.gif     Component  trs.gif tl.gif Db tr.gif tl.gif Db-basket tr.gif tl.gif Db-login tr.gif tl.gif Db-customer tr.gif tl.gif Db-select tr.gif tl.gif Jquery tr.gif tl.gif Form-elements tr.gif tl.gif Menu-fisheye tr.gif tl.gif Template tr.gif tl.gif Tree-node tr.gif tl.gif Validator tr.gif
blank.gif
blank.gif
arrow-headline.gif Index
MenuLink  00.jpg MenuLeft  
Tilbage

Skjul: Navn

Slideshow.php


Vis: Sample code, tutorial

Slideshow, Sample code, tutorial

Sådan benyttes komponenten Slideshow klassen

Først skal du inkludere den fil der beskriver komponenten, som en klasse fil

  • <?
    require_once(HTML_PACKAGE_PATH.'/Slideshow.php');
    ?>

Dernæst kan du enten benytte komponenten som et taglib (statiske metoder):

  • <?
    Slideshow    ::display($param1, $param2, $param3, ...);
    ?>

eller du kan lave en instance af komponenten og benytte metoderne direkte:

  • <?
    $object     = new Slideshow($param1, $param2, $param3, ...);
    print     $object->getHtml();
    ?>

Skjul: Sådan vises komponenten

Slideshow, Sådan vises komponenten

Sådan vises komponenten Slideshow klassen

00.jpg

Vis: PHP source code

Slideshow, PHP source code

Den fulde PHP kildekode for Slideshow klassen

<?php
/**
 * @package component
 * @filesource 
 * @see HTML_COMPONENT_PAGE_PATH.'/Slideshow.php'
 * @copyright (c) http://Finn-Rasmussen.com
 * @license http://Finn-Rasmussen.com/license/ myPHP License conditions
 * @author http://Finn-Rasmussen.com
 * @version 1.11
 * @since 27-nov-2009
 */

/**
 * The required files
 */
require_once(HTML_BASE_COMMON_PATH.'/Html.php');
require_once(HTML_BASE_UTIL_PATH.'/Script.php');
require_once(HTML_BASE_UTIL_PATH.'/Image.php');
require_once(HTML_BASE_UTIL_PATH.'/Link.php');

/**
 * NOTE: Only one instance of this class must be running
 * Slideshow. Images are shown in an round robin fasion in an interval
 * Note: At the moment of writing, only numbers between 00,01,02,...,99 are supported
 * This piece of code depends on javascript
 * <code>
 * Usage:
 * In the head section use this
 *   $slideshow = new Slideshow($name, $path, $start, $end, $time);
 *   print $slideshow->getJavascript();
 * 
 * In the body section use this
 *   $slideshow = new Slideshow($name, $path, $start, $end, $time);
 *   print $slideshow->getHtml();
 * 
 * Or
 * 
 * In the head section use this
 *   Slideshow::javascript($name, $path, $start, $end, $time);
 * 
 * In the body section use this
 *   Slideshow::display($name, $path, $start, $end, $time);
 * </code>
 * @package component
 */

class Slideshow extends Html {
    /**
     * var String $name The name of the slideshow image
     */
    protected $name = '';
    /**
     * var String $path The path to the slideshow images
     */
    protected $path  = '';
    /**
     * var String $start The start name of picture to rotate
     */
    protected $start = '';
    /**
     * @var String $end The end name of picture to rotate
     */
    protected $end   = '';

    /**
     * @var int $time The slideshow time of picture to rotate
     */
    protected $time   = '';

    /**
     * Constructor
     * @param String $name  The name of the slideshow image to use
     * @param String $path  The path to the images
     * @param String $start The start of the image name to use for now
     * @param String $end   The end of the image name to use for now
     * @param String $time  The time to use for the slideshow
     */
    function __construct($name='', $path='', $start='', $end='', $time='') {
        parent::__construct();
        $this->name  = $name  != '' ? $name  : 'x'.$this->getClassName();
        $this->path  = $path  != '' ? $path  : SLIDESHOW_PATH;
        $this->start = $start != '' ? $start : SLIDESHOW_START;
        $this->end   = $end   != '' ? $end   : SLIDESHOW_END;
        $this->time  = $time  != '' ? $time  : SLIDESHOW_TIME;
        if ($this->end>SLIDESHOW_END) {
            die($this->getClassName()."(), The max slideshow end:".$this->end." is greater than ".SLIDESHOW_END."<br />\r\n");
        }
    }

    /**
     * Get the url of the image for the slideshow
     * If the name is not specified, only the url is returned
     * @param String $name The name of the image
     * @return String The full url to the image
     */
    function getImageUrl($name='') {
        $html  = '';
        $html .= $this->path;
        if ($name != '') {
            $html .= '/'.$name.'.'.IMAGE_SUFFIX_JPG;
        }
        return $html;
    }
    
    /**
     * Get the name of the image for the slideshow
     * The name is prepended with zero if the name is smaller than 10
     * so the images must be named i.e. 00,01,02,..99
     * @param String $name The name of the image
     * @return String The name
     */
    function getName($name) {
        $theName = $name;
        $length = strlen($this->end - $this->start);
        $start  = strlen($name);
        for ($i=$start;$i<$length;$i*=10) {
            $theName = '0'.$theName;
        }
        return $theName;
    }
    
    /**
     * Create the javascript slideshow array
     * @param  String $tab  The tab to add
     * @param  String $crlf The CR/LF to add
     * @return String The javascript code
     */
    function createSlideshowFunction($tab, $crlf) {
        $html  = '';
        $slideName = "s";
        $imageName = "n";
        if (defined('DEBUG_LEVEL_SHOW_INFO') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_INFO) {
             $slideName = "slideshow";
             $imageName = "Images";
        }
        /**
         * The javascript createSlideshow() function
         */
        $html .= "function createSlideshow(){".$crlf;
        $html .= $tab."var ".$slideName.$imageName." = new Array();".$crlf;
        for ($i=$this->start;$i<($this->end+1);$i++) {
            $name = $this->getName($i); 
            $html .= $tab.$slideName.$imageName."[$i]='".$name."';".$crlf;
        }
        $html .= $tab."return ".$slideName.$imageName.";".$crlf;
        $html .= "}\r\n";
        return $html;
    }
    
    /**
     * Create the javascript slideshow array
     * @param  String $tab  The tab to add
     * @param  String $crlf The CR/LF to add
     * @return String The javascript code
     */
    function createInitSlideshowFunction($tab, $crlf) {
        $html  = '';
        /**
         * The javascript initSlideshow() function
         */
        $html .= "function initSlideshow(numberOfImages,arrayOfImages){".$crlf;
        $html .= $tab."slideShow = new Array();".$crlf;
        // start for
        $html .= $tab."for (var i=".$this->start."; i<".($this->end+1)."; i++) {".$crlf;
        $html .= $tab.$tab."slideShow[i] = new Image;".$crlf;
        $html .= $tab.$tab."slideShow[i].src = '".IMAGE_SKIN_URL.$this->path."/' + arrayOfImages[i] + '.'.IMAGE_SUFFIX_JPG;".$crlf;
        $html .= $tab."}".$crlf;
        $html .= $tab."return slideShow;".$crlf;
        // end for
        $html .= "}\r\n";
        return $html;
    }

    /**
     * Create the javascript next slide function
     * @param  String $tab  The tab to add
     * @param  String $crlf The CR/LF to add
     * @return String The javascript code
     */
    function createNextSlideFunction($tab, $crlf) {
        $html  = '';
        $duration = 2;
        /**
         * The javascript initSlideshow() function
         * This javascript does only work with IE > 5.5
         */
        $html .= "function getNextSlide(thisSlide){".$crlf;
        // start if
        $html .= $tab."if (document.all && slideShow[thisSlide].complete) {".$crlf;
        $html .= $tab.$tab."document.images.".$this->name.".style.filter='blendTrans(duration=$duration)';".$crlf;
        $html .= $tab.$tab."document.images.".$this->name.".style.filter='blendTrans(duration=crossFadeDuration)';".$crlf;
        $html .= $tab.$tab."document.images.".$this->name.".filters.blendTrans.Apply();".$crlf;
        //$url = $this->getImageUrl();
        $html .= $tab.$tab."document.images.".$this->name.".src = slideShow[thisSlide].src;".$crlf;
        $html .= $tab.$tab."document.images.".$this->name.".filters.blendTrans.Play();".$crlf;
        $html .= $tab."}".$crlf;
        $html .= $tab."var nextSlide = thisSlide;".$crlf;
        $html .= $tab."nextSlide++;".$crlf;
        $html .= $tab."if (nextSlide >= ".$this->start." + ".($this->end - $this->start + 1).") {".$crlf;
        $html .= $tab.$tab."nextSlide = ".$this->start.";".$crlf;
        $html .= $tab."}".$crlf;
        $html .= $tab."return nextSlide;".$crlf;
        // end if
        $html .= "}\r\n";
        return $html;
    }
    
    /**
     * Create the javascript function changeSlide()
     * @param  String $tab  The tab to add
     * @param  String $crlf The CR/LF to add
     * @return String The javascript code
     */
    function createChangeSlideFunction($tab, $crlf) {
        $html  = '';
        /**
         * The javascript function changeSlide(timeDelay)
         * is responsible for starting the next slide up 
         */
        $html .= "function changeSlide(timeDelay, thisSlide){".$crlf;
        $html .= $tab."var nextSlide = getNextSlide(thisSlide);".$crlf;
        $html .= $tab."setTimeout('changeSlide(timeDelay,' + nextSlide + ')', timeDelay*5000);".$crlf;
        $html .= "}\r\n";
        return $html;
    }

    /**
     * Initialize the slideshow
     * @param  String $tab  The tab to add
     * @param  String $crlf The CR/LF to add
     * @return String The javascript code
     */
    function initSlideshow($tab, $crlf) {
        $html  = '';
        /**
         * The slideshow is initialized in the 
         * function initSlideshow(numberOfImages, arrayOfImages, timeDelay)
         * where the parameters are 
         * @param int numberOfImages The number of images in the array
         * @param array arrayOfImages The array of images
         * @param int timeDelay The time delay for the slideshow
         */
        $html .=  "var numberOfImages = ".($this->end - $this->start + 1).";".$crlf;
        $html .=  "var arrayOfImages  = createSlideshow();".$crlf;
        $html .=  "var slideShow      = initSlideshow(numberOfImages, arrayOfImages);".$crlf;

        $html .=  "var timeDelay      = ".$this->time.";".$crlf;
        $html .=  "var firstSlide     = ".$this->start.";".$crlf;
        $html .=  "changeSlide(timeDelay, firstSlide);\r\n";
        return $html;
    }
    
    /**
     * Get the javascript, which defined the Slideshow
     * Note: This methode must be called in the head section
     * <code>
     * Usage:
     * In the head section use this
     *   $slideshow = new Slideshow($name, $path, $start, $end, $time);
     *   print $slideshow->getJavascript();
     * </code>
     * @return String The javascript code
     */
    function getJavascript() {
        $html  = '';
        // TODO if (ok) read/write as javascriptfile.js
        if (defined('COMPONENT_SHOW') && (COMPONENT_SHOW & COMPONENT_SHOW_SLIDESHOW) && HTTP_USER_AGENT!=HTTP_USER_AGENT_P900) {
            if (defined('CREATE_RUNTIME_KERNEL') && CREATE_RUNTIME_KERNEL) {
                $html .= '<'.'?$slideshow = new Slideshow();print $slideshow->getJavascript();?'.'>';
            } else {
                $tab  = "";
                $crlf = "";
                if (defined('DEBUG_LEVEL_SHOW_INFO') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_INFO) {
                    $tab  = "\t";
                    $crlf = "\r\n";
                }
                /**
                 * Create the javascript function in the head section
                 */
                $script = new Script();
                $html .= $script->getStart();
                $html .= $this->createSlideshowFunction($tab, $crlf);
                $html .= $this->createInitSlideshowFunction($tab, $crlf);
                $html .= $this->createNextSlideFunction($tab, $crlf);
                $html .= $this->createChangeSlideFunction($tab, $crlf);
                $html .= $script->getEnd();
            }
        } else {
            if (defined('DEBUG_LEVEL_SHOW_INFO') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_INFO) {
                $html .= "<!-- ".$this->getClassName()."->getJavascript() Slideshow object is disabled, see COMPONENT_SHOW_SLIDESHOW -->\r\n";
            }
        }
        return $html;
    }

    /**
     * Get the the slide as an img tag
     * @return String The html code
     */
    function getImage() {
        $html  = '';
        $src = $this->getImageUrl($this->getName($this->start));
        $image = new Image($src,null,null,'',CSS_LINK_COLOR);
        $image->set('name', $this->name); // Special
        $link = new Link();
        $link->add($image);
        $html .= $link->getHtml();
                /**
                 * Create the javascript function in the head section
                 */
                $tab  = "";
                $crlf = "";
                if (defined('DEBUG_LEVEL_SHOW_INFO') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_INFO) {
                    $tab  = "\t";
                    $crlf = "\r\n";
                }
                $script = new Script();
                $html .= $script->getStart();
                $html .= $this->initSlideshow($tab, $crlf);
                $html .= $script->getEnd();
         return $html;
    }

    /**
     * Builds the html, and return it for a Slideshow object
     * <code>
     * In the body section use this
     * Usage:
     *    $slideshow = new Slideshow($name, $path, $start, $end, $time);
     *    print $slideshow->getHtml();
     * </code>
     * @return String The html
     */
    function getHtml() {
        $html = $this->html;
        if (defined('COMPONENT_SHOW') && (COMPONENT_SHOW & COMPONENT_SHOW_SLIDESHOW) && HTTP_USER_AGENT!=HTTP_USER_AGENT_P900) {
            if (defined('CREATE_RUNTIME_KERNEL') && CREATE_RUNTIME_KERNEL) {
                $html .= '<'.'?$slideshow = new Slideshow();print $slideshow->getHtml();?'.'>';
            } else {
                $html .= $this->getImage(); // The body section
            }
        } else {
            if (defined('DEBUG_LEVEL_SHOW_INFO') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_INFO) {
                $html .= "<!-- ".$this->getClassName()."->getHtml() Slideshow object is disabled, see COMPONENT_SHOW_SLIDESHOW -->\r\n";
            }
        }
        return $html;
    }

    /**
     * Display html
     * <code>
     * In the head section use this
     * Usage:
     *    Slideshow::javascript($name, $path, $start, $end, $time);
     * </code>
     * @static
     * @param String $name  The name of the slideshow image
     * @param String $path  The path to the images to rotate
     * @param String $start The start of the image name to use for now
     * @param String $end   The end of the image name to use for now
     * @param String $time  The time to use for the slideshow
     */
    public static function javascript($name='', $path='', $start='', $end='', $time='') {
        $html = new Slideshow($name, $path, $start, $end, $time);
        $javascript = $html->getJavascript();
        $html->addHtml($javascript);
    }

    /**
     * Display html
     * <code>
     * In the body section use this
     * Usage:
     *    Slideshow::display($name, $path, $start, $end, $time);
     * </code>
     * @static
     * @param String $name  The name of the slideshow image
     * @param String $path  The path to the images to rotate
     * @param String $start The start of the image name to use for now
     * @param String $end   The end of the image name to use for now
     * @param String $time  The time to use for the slideshow
     */
    public static function display($name='', $path='', $start='', $end='', $time='') {
        $html = new Slideshow($name, $path, $start, $end, $time);
        $html->addHtml();
    }
}
?>

Vis: HTML source code

Slideshow, HTML source code

Den fulde HTML kildekode for Slideshow klassen

<?
<!-- DEBUG: Slideshow -->
<!-- DEBUG: Link -->
<a class="baseLinkColor" href="/source-code/component/Slideshow/index.php"><!-- DEBUG: Image -->
<img name="xSlideshow" src="http://kakerlakker.info/images/w200/00.jpg" alt="00.jpg" class="baseLinkColor" />
</a><script type="text/javascript">
var numberOfImages = 77;
var arrayOfImages  = createSlideshow();
var slideShow      = initSlideshow(numberOfImages, arrayOfImages);
var timeDelay      = 10;
var firstSlide     = 0;
changeSlide(timeDelay, firstSlide);
</script>

?>

Vis: Class methods

Slideshow, Class methods

Her er 'klasse metoderne' for Slideshow klassen:

  • __construct
  • getImageUrl
  • getName
  • createSlideshowFunction
  • createInitSlideshowFunction
  • createNextSlideFunction
  • createChangeSlideFunction
  • initSlideshow
  • getJavascript
  • getImage
  • getHtml
  • javascript
  • display
  • setObject
  • set
  • get
  • getAttribute
  • getTag
  • add
  • getSizeof
  • getElement
  • getElements
  • getToogle
  • getMaximize
  • getMinimize
  • newTriangle
  • getStartHtml
  • getEndHtml
  • showsource
  • getClassName
  • getMsg
  • addHtml
  • __toString
  • getCacheFileName
  • save
  • content

Vis: Object vars

Slideshow, Object vars

Her er 'objekt variable' for Slideshow klassen:

  • html =>
  • sql =>

MenuRight 
triangle.gif

Dansk

Deutch

English (UK)

France

Italy

Norsk

Svensk

English (USA)

 
blank.gif
MenuBottom 
triangle.gif Copyright @ 1999-2010 www.Finn-Rasmussen.com Powered by myPHP Version (5.3.3-7+squeeze3) 1.11
blank.gif