Forum Display Enhancements - Advanced Snowstorm Integration for Christmas

Please take some time and read this feature list before you go "Oh no, another of those pesky snowflake Mods!".

Features:
- The snow is optionally piling up on the bottom of the screen (customize the script to your liking)
- The script is lightweight and fast
- The script works on all current browsers and uses PNG images incl. GIF fallback
- Can be turned off by your users via quicklink or in the UserCP
- User can change the direction of the blowing wind

HackDetails:
Difficulty: easy
Templates to edit: 2
Approx. Time: 5-8 Minutes
Compatibility: All vB versions

As we all know, those nice scripts come at a price, and that is performance at the client side! I didn't want to pester my users with a CPU intensive script for the next 30 days and not offering a solution to switch it off in the UserCP (or temporarily). So with this hack everyone can decide for him/herself is he/she wants those nifty flakes flying around while reading the forum

Allright let's move to the hack itself:

First of all, I have to give full kudos to Scott Schiller who came up with the original Javascript for this nifty snowing effect. Secondly it is VERY easy to incorporate in your forum if you follow these 10 steps to success:

1) Get the latest version of the script from Scott Schiller's Homepage
2) Upload the script as well as all images included
3) AdminCP -> User Profile Fields -> Add New User Profile Field
4) Choose "Single Selection Radio Buttons"
5) Fill in all required fields and insert two values in the Options Box: (seperated with a return)
YES
NO
6) Set "Default" to YES
7) Hit "Save" and memorize the name of your field, in my case it's "field8".
8) Open up the Template "headinclude" and add at the bottom:

<if condition="$bbuserinfo['field8']=='YES'">
<script type="text/javascript" src="[path to your script]/script/snowstorm.js"></script>
</if>

Notice that I included the name of my field (field8) in the first line!

9) Hit "Save" and open up the template "navbar" and look for this code:

<if condition="$show['member']">
	
		<td class="alt2" valign="top" nowrap="nowrap">
		<div class="smallfont">

below add:

<if condition="$bbuserinfo['field8']=='YES'">
<a href="javascript:snowStorm.randomizeWind()">Change Wind</a>&nbsp;&nbsp;<a href="javascript:snowStorm.stop()">Stop snowing</a><br /><br />
</if>

Please note again that I included the name of my field (field8) in the first line!

10) Hit "Save" and you're ready to go!


Further thoughts:

This little hack adds the two control links directly above the login-details of your users. But it can of course be implemented where you like, you can also add graphical buttons to it. Furthermore you can use phrases to make all this multilingual, a step I took because my forums are multilingual.

Troubleshooting:

Q: It doesn't work?!
A: Be aware that this hack USES a script, which you have to download here!

Q: Argh, I don't see any snow flakes, but my CPU get's mangled
A: That's because the script doesn't find the images for the snowflakes. Open up the script (snowstorm.js) and set the "imagePath" to the folder where your snowflakes are in. You can even hardcode an absolute link there is everything fails.

Q: My switch in the UserCP doesn't work!
A: Make sure that you filled in the exact name of your field in the two locations which are specified in the steps above.

Q: The snow falls too slow or the flakes are too small
A: Open up the script and modify it to your liking, it's a great piece of code and well documented

Q: Is the snow only visible for registered users?
A: Yes, that's on perpose. Guests can't store any infos on the forum, therefore they can't switch it off if they don't like it.

Q: Oh my god it still doesn't snow... and it's mid December already!
A: Welcome to the age of global warming! Switch to a Hybrid Car, and walk more often. If everybody does that, we should get real snow again in a couple of decades

[WildSharky]

Ok i got it when you make the fleid make sure the yes and no are all caps like this..

YES
NO

Like in doberlec post on the top...

As to doberlec man if i wanted to learn i wouldnt need your hack so come on now you said you would support this hack do so or dont say you will.. were not all masters of php.. And thanks for the hack..

[doberlec]

Originally Posted by WildSharky

As to doberlec man if i wanted to learn i wouldnt need your hack so come on now you said you would support this hack do so or dont say you will.. were not all masters of php.. And thanks for the hack..

Don't get me wrong: I do support this hack, as you can see I post my comments here and I also updated my hack description to incorporate the suggestions here. And I also did give the people here exact instructions on how to get this thing going. I even added a short Q&A for debugging. As for the "master of php", I don't consider myself as a master but I do have basic knowledge of programming. Operators are not only used in php but in every script/programming language in existance. Copy & pasting hacks into your forum is one thing but you should also know what the piece of code is doing, or otherwise you could damage your forum very fast.

[WildSharky]

but that is why we backup stuff most dont know alot about it just like i didnt know that if you use Yes and No it wouldnt work but i know some php but i dont want to learn all that just to added this to my site..

And yes i see you added all that but even i got that part wrong so make it clearer please to make the yes and no all caps or change your codes yes and no to what they want to use..

and again nice hack thanks..

[yoyoyoyo]

Originally Posted by doberlec

Dude, $bbuserinfo[field8] !='YES' doesn't make any sense. Why should the Javascript be included when the Users have set the Snow-Mode to NO?!

whoops- sorry- that's what I get for posting late at night... the correct code is this:

put this at the bottom of the header template:

<if condition="$bbuserinfo[field8]=='YES'">
<script type="text/javascript" src=" /forum/script/snowstorm.js"></script>
</if>

In your navbar template find:

<if condition="$show['member']">
    
        <td class="alt2" valign="top" nowrap="nowrap">
        <div class="smallfont">

add below:

<if condition="$bbuserinfo[field8]=='YES'">
<a href="javascript:snowStorm.randomizeWind()">Change Wind</a>&nbsp;&nbsp;<a href="javascript:snowStorm.stop()">Stop snowing</a><br /><br />
</if>

naturally substitute your proper profile field ID numbers as needed.

[Julie]

Thanks for this cute script!

[Jeordie015]

Is anyone else having problems with the snow collecting at the bottom of the screen? I don't want it to build up. I have it set to 0 in the script, but it still does it.

[SMC21]

Works famously for me. Remember to make sure the image path in the Script file is correct, that's what caused mine not to work at first. I had to change it from relative to absolute

[redlabour]

Best Snow Hack ever and ever !!!

But can somebody edit the Code or give me a hint so that Guest can see it too as Default (Sure i understand why they can?t deactivate in it Profile but this is no reason that Guest cant see it as Default turned on! ) ?

[Surviver]

Originally Posted by redlabour

Best Snow Hack ever and ever !!!

But can somebody edit the Code or give me a hint so that Guest can see it too as Default (Sure i understand why they can?t deactivate in it Profile but this is no reason that Guest cant see it as Default turned on! ) ?

<if condition="$bbuserinfo['field8']=='YES' OR !$show['member']">
<script type="text/javascript" src="[path to your script]/script/snowstorm.js"></script>
</if>

#
#
Try this

[dobbs]

After 30 minutes of following the directions here is what i had to do to make it work



change this code:

PHP Code:

<if condition="$bbuserinfo['field8']=='YES'">
<script type="text/javascript" src="[path to your script]/script/snowstorm.js"></script>
</if> 


to this code:

PHP Code:

<if condition="$bbuserinfo['field8']=='YES'">
<script type="text/javascript" src="/forum/script/snowstorm.js"></script>
</if> 


and in the script change my path from:

PHP Code:

  var imagePath = 'image/snow/'; // relative path to snow images 


to this:

PHP Code:

  var imagePath = '/image/snow/'; // relative path to snow images