DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

snowstorm - pray for snow

Author:Kasper Skårhøj
Created:2002-11-01T00:32:00
Changed by:Alex Kellner
Changed:2009-11-16T11:30:14.430000000
Author:Alex Kellner
Email:Alexander.Kellner@einpraegsam.net
Info 3:
Info 4:

snowstorm - pray for snow

Extension Key: wt_snowstorm

Copyright 2005-2009,

Alex Kellner,

<Alexander.Kellner@einpraegsam.net>

This document is published under the Open Content License

available from http://www.opencontent.org/opl.shtml

The content of this document is related to TYPO3

- a GNU/GPL CMS/Framework available from www.typo3.com

Table of Contents

snowstorm - pray for snow 1

snowstorm introduction 2

What does it do? 2

Screenshots 3

How to use 5

Step by step: 5

Typoscript 6

Example typoscript 6

Example constants 7

Constants explanation 9

FAQ 10

There are no snowflakes on my homepage – why? 10

Todos 11

Changelog 12

Additional links 13

snowstorm introduction

What does it do?

If you want to beautify your homepage at x-mas or winter time, you can use this extension to bring some snowflakes to your homepage.

This extensions includes a javascript for snowflakes

Features of this extension:

Define start- and stopdate via typoscript (periodical mode possible – so extension works every year...)

Define on which pages it should snow and on which pages it should not snow

And a lot of further settings via typoscript (flake size, numbers of allowed flakes, and so on...)

Screenshots

img-1

img-2

img-3

How to use

Step by step:

  • Import wt_snowstorm from TER
  • Enter a TYPO3 Template on any page and include a static snowstorm template
  • Define your settings via constants (e.g. a start pid for your snow)
  • If you use realurl: Add the type 3136 to your prevars in the realurl configuration
  • That's all

Typoscript

Example typoscript

# WT_SNOWSTORM PLUGIN #
includeLibs.user_wtsnowstorm = EXT:wt_snowstorm/class.tx_wtsnowstorm.php

# main settings
plugin.tx_wtsnowstorm = USER_INT
plugin.tx_wtsnowstorm {
        userFunc = tx_wtsnowstorm->start
        userFunc.settings {
                ### constants ###
                template.js = {$plugin.wtsnowstorm.template.js}
                startdate = {$plugin.wtsnowstorm.startdate}
                enddate = {$plugin.wtsnowstorm.enddate}
                periodical_mode = {$plugin.wtsnowstorm.periodical_mode}
                pid = {$plugin.wtsnowstorm.pid}
                excludeOnPid = {$plugin.wtsnowstorm.excludeOnPid}

                ### constants: JS Part ###
                flakesmax = {$plugin.wtsnowstorm.flakesmax}
                flakesmaxactive = {$plugin.wtsnowstorm.flakesmaxactive}
                animationInterval = {$plugin.wtsnowstorm.animationInterval}
                flakeBottom = {$plugin.wtsnowstorm.flakeBottom}
                targetElement = {$plugin.wtsnowstorm.targetElement}
                followMouse = {$plugin.wtsnowstorm.followMouse}
                snowColor = {$plugin.wtsnowstorm.snowColor}
                snowCharacter = {$plugin.wtsnowstorm.snowCharacter}
                snowStick = {$plugin.wtsnowstorm.snowStick}
                useMeltEffect = {$plugin.wtsnowstorm.useMeltEffect}
                useTwinkleEffect = {$plugin.wtsnowstorm.useTwinkleEffect}
                usePositionFixed = {$plugin.wtsnowstorm.usePositionFixed}
                flakeLeftOffset = {$plugin.wtsnowstorm.flakeLeftOffset}
                flakeRightOffset = {$plugin.wtsnowstorm.flakeRightOffset}
                flakeWidth = {$plugin.wtsnowstorm.flakeWidth}
                flakeHeight = {$plugin.wtsnowstorm.flakeHeight}
                vMaxX = {$plugin.wtsnowstorm.vMaxX}
                vMaxY = {$plugin.wtsnowstorm.vMaxY}
                zIndex = {$plugin.wtsnowstorm.zIndex}
        }
}

# TypeNum 3136 offers the dynamic snowstorm javascript
snowstorm = PAGE
snowstorm {
        typeNum = 3136
        10 < plugin.tx_wtsnowstorm

        config {
                disableAllHeaderCode = 1
                disablePrefixComment = 1
                xhtml_cleaning = 0
                admPanel = 0
        }
}

# Add javascript file to html header
page.headerData.3136 = TEXT
page.headerData.3136 {
    wrap = <script src="|" type="text/javascript"></script>
    typolink.parameter.data = page : uid
    typolink.additionalParams = &type=3136
    typolink.addQueryString = 1
    typolink.returnLast = url
}

Example constants

###
# This are the default TS-constants for wt_snowstorm
##

plugin.wtsnowstorm {

        # cat=plugin.wtsnowstorm//0010; type=file[html,htm,tmpl,txt,js]; label= Javascript for snowstorm: JS-template file main snowstorm (see EXT:wt_snowstorm/files/js/snowstorm.js for an example)
        template.js = EXT:wt_snowstorm/files/js/snowstorm.js

        # cat=plugin.wtsnowstorm//0020; type=text; label= Startdate for snowstorm: Define a startdate for snowstorm javascript (like 01-11-2008)
        startdate = 01-11-2009

        # cat=plugin.wtsnowstorm//0030; type=text; label= Enddate for snowstorm: Define an enddate for snowstorm javascript (like 01-02-2009)
        enddate = 01-02-2010

        # cat=plugin.wtsnowstorm//0040; type=boolean; label= Periodical start and stop: Start and Stop every year on the same time (only month and day of start- and enddate will be used) (like 1)
        periodical_mode = 1

        # cat=plugin.wtsnowstorm//0050; type=text; label= Use in PID: Select in which PID snowstorm should work and define the treedepth (4,2 means that snowstorm works in pid 4 and 2 levels below that page - 1,250 means that snowstorm works in page 1 and invinite levels below - 0,250 means that snowstorm works in every page - 1,0 means that snowstorm works only in pid 1)
        pid = 0,99

        # cat=plugin.wtsnowstorm//0060; type=text; label= Exclude pages: Enter some PID on which no snow should fall from the sky - commaseparated list (e.g. 1,2,3,4)
        excludeOnPid =

        ### JS Part ###

        # cat=plugin.wtsnowstorm//0100; type=int+; label= JS Setting Flakesmax: Limit total amount of snow made (falling + sticking)
        flakesmax = 128

        # cat=plugin.wtsnowstorm//0110; type=int+; label= JS Setting Flakesmaxactive: Limit amount of snow falling at once (less = lower CPU use)
        flakesmaxactive = 64

        # cat=plugin.wtsnowstorm//0120; type=int+; label= JS Setting animationInterval: Theoretical "miliseconds per frame" measurement. 20 = fast + smooth, but high CPU use. 50 = more conservative, but slower
        animationInterval = 33

        # cat=plugin.wtsnowstorm//0130; type=int+; label= JS Setting flakeBottom: Integer for Y axis snow limit, 0 for "full-screen" snow effect
        flakeBottom = 0

        # cat=plugin.wtsnowstorm//0140; type=text; label= JS Setting targetElement: Element which snow will be appended to (document body if null/undefined) - can be an element ID string, or a DOM node reference
        targetElement = null

        # cat=plugin.wtsnowstorm//0150; type=options[true,false]; label= JS Setting followMouse: Snow will change movement with the user's mouse
        followMouse = true

        # cat=plugin.wtsnowstorm//0160; type=text; label= JS Setting snowcolor: Do not eat (or use?) yellow snow
        snowColor = #fff

        # cat=plugin.wtsnowstorm//0170; type=text; label= JS Setting snowCharacter: &bull[semicolon] = bullet, &middot[semicolon] is square on some systems etc
        snowCharacter = &bull;

        # cat=plugin.wtsnowstorm//0190; type=options[true,false]; label= JS Setting snowStick: Whether or not snow should "stick" at the bottom. When off, will never collect
        snowStick = true

        # cat=plugin.wtsnowstorm//0200; type=options[true,false]; label= JS Setting useMeltEffect: When recycling fallen snow (or rarely, when falling), have it "melt" and fade out if browser supports it
        useMeltEffect = true

        # cat=plugin.wtsnowstorm//0210; type=options[true,false]; label= JS Setting useTwinkleEffect: Allow snow to randomly "flicker" in and out of view while falling
        useTwinkleEffect = false

        # cat=plugin.wtsnowstorm//0220; type=options[true,false]; label= JS Setting usePositionFixed: true = snow not affected by window scroll. may increase CPU load, disabled by default - if enabled, used only where supported
        usePositionFixed = false

        # cat=plugin.wtsnowstorm//0400; type=int+; label= JS Setting flakeLeftOffset: Amount to subtract from edges of container
        flakeLeftOffset = 0

        # cat=plugin.wtsnowstorm//0410; type=int+; label= JS Setting flakeRightOffset: Amount to subtract from edges of container
        flakeRightOffset = 0

        # cat=plugin.wtsnowstorm//0420; type=int+; label= JS Setting flakeWidth: Max pixel width for snow element
        flakeWidth = 8

        # cat=plugin.wtsnowstorm//0430; type=int+; label= JS Setting flakeHeight: Max pixel height for snow element
        flakeHeight = 8

        # cat=plugin.wtsnowstorm//0440; type=int+; label= JS Setting vMaxX: Maximum X velocity range for snow
        vMaxX = 5

        # cat=plugin.wtsnowstorm//0450; type=int+; label= JS Setting vMaxY: Maximum Y velocity range for snow
        vMaxY = 4

        # cat=plugin.wtsnowstorm//0460; type=int; label= JS Setting zIndex: CSS stacking order applied to each snowflake
        zIndex = 0

}

Constants explanation

Name

a

Name

b

Explanation

c

Default value

template.js

a

template.js

b

Javascript for snowstorm: JS-template file main snowstorm (see EXT:wt_snowstorm/files/js/snowstorm.js for an example)

c

EXT:wt_snowstorm/files/js/snowstorm.js

startdate

a

startdate

b

Startdate for snowstorm: Define a startdate for snowstorm javascript (like 01-11-2008)

c

01-11-2009

enddate

a

enddate

b

Enddate for snowstorm: Define an enddate for snowstorm javascript (like 01-02-2009)

c

01-02-2010

periodical_mode

a

periodical_mode

b

Periodical start and stop: Start and Stop every year on the same time (only month and day of start- and enddate will be used) (like 1)

c

1

pid

a

pid

b

Use in PID: Select in which PID snowstorm should work and define the treedepth (4,2 means that snowstorm works in pid 4 and 2 levels below that page - 1,250 means that snowstorm works in page 1 and invinite levels below - 0,250 means that snowstorm works in every page - 1,0 means that snowstorm works only in pid 1)

c

0.99

excludeOnPid

a

excludeOnPid

b

Exclude pages: Enter some PID on which no snow should fall from the sky - commaseparated list (e.g. 1,2,3,4)

c

flakesmax

a

flakesmax

b

JS Setting Flakesmax: Limit total amount of snow made (falling + sticking)

c

128

flakesmaxactive

a

flakesmaxactive

b

JS Setting Flakesmaxactive: Limit amount of snow falling at once (less = lower CPU use)

c

64

animationInterval

a

animationInterval

b

JS Setting animationInterval: Theoretical "miliseconds per frame" measurement. 20 = fast + smooth, but high CPU use. 50 = more conservative, but slower

c

33

flakeBottom

a

flakeBottom

b

JS Setting flakeBottom: Integer for Y axis snow limit, 0 for "full- screen" snow effect

c

0

targetElement

a

targetElement

b

JS Setting targetElement: Element which snow will be appended to (document body if null/undefined) - can be an element ID string, or a DOM node reference

c

null

followMouse

a

followMouse

b

JS Setting followMouse: Snow will change movement with the user's mouse

c

true

snowColor

a

snowColor

b

JS Setting snowcolor: Do not eat (or use?) yellow snow

c

#fff

snowCharacter

a

snowCharacter

b

JS Setting snowCharacter: &bull[semicolon] = bullet, &middot[semicolon] is square on some systems etc

c

&bull;

snowStick

a

snowStick

b

JS Setting snowStick: Whether or not snow should "stick" at the bottom. When off, will never collect

c

true

useMeltEffect

a

useMeltEffect

b

JS Setting useMeltEffect: When recycling fallen snow (or rarely, when falling), have it "melt" and fade out if browser supports it

c

true

useTwinkleEffect

a

useTwinkleEffect

b

JS Setting useTwinkleEffect: Allow snow to randomly "flicker" in and out of view while falling

c

false

usePositionFixed

a

usePositionFixed

b

JS Setting usePositionFixed: true = snow not affected by window scroll. may increase CPU load, disabled by default - if enabled, used only where supported

c

false

flakeLeftOffset

a

flakeLeftOffset

b

JS Setting zIndex: Amount to subtract from edges of container

c

0

flakeRightOffset

a

flakeRightOffset

b

JS Setting zIndex: Amount to subtract from edges of container

c

0

flakeWidth

a

flakeWidth

b

JS Setting zIndex: Max pixel width for snow element

c

8

flakeHeight

a

flakeHeight

b

JS Setting zIndex: Max pixel height for snow element

c

8

vMaxX

a

vMaxX

b

JS Setting zIndex: X velocity range for snow

c

5

vMaxY

a

vMaxY

b

JS Setting zIndex: Y velocity range for snow

c

4

zIndex

a

zIndex

b

JS Setting zIndex: CSS stacking order applied to each snowflake

c

0

FAQ

There are no snowflakes on my homepage – why?

  • Have you added the static template?
  • Is the dynamic javascript file correctly included into the page header (check for type=3136)
  • If you use realurl: Add the type 3136 to the prevars
  • Check your html source code for the js (type 3136) – open it in your browser and check- is this a correct js file?- do you see the message “This is not the right time or a correct pid for snowstorm”, so you have to set up a pid for snowstorm in constants and/or set up a right time
  • Maybe you should change the default start- and stoptime via constants (default from November up to February)
  • Have you defined a pid where the plugin should work? Check this!

Todos

Need a new feature!?

Do you need a new feature? Maybe we can help you, so just write us!

Changelog

((generated))

wt_snowstorm
Update on 16.11.2009 version 2.0.0
  • New snowstorm.js with version 1.4
  • Snow on IE8
  • No graphics for snow needed any more (speed ups CPU time)
  • Enter a DIV Element where it should snow or use the whole page
  • A lot of more configuration possibilities in constants
Update on 13.11.2009 version 1.0.1

New feature: Set some excluded PIDs

Update on 10.11.2009 version 1.0.0

Small bugfix in image path

Update on 26.11.2008 version 0.2.0

Bugfix

Initial Release to TER on 17.11.2008 version 0.1.0

Bring some snowstorm to your webpage