// ###################################################################
// flip data
-function showPrefs()
+function show_back()
{
var front = document.getElementById("front");
var back = document.getElementById("back");
if (window.widget)
- widget.prepareForTransition("ToBack"); // freezes the widget so that you can change it without the user noticing
+ {
+ widget.prepareForTransition("ToBack");
+ }
- front.style.display="none"; // hide the front
- back.style.display="block"; // show the back
+ front.style.display = "none";
+ back.style.display = "block";
if (window.widget)
- setTimeout ('widget.performTransition();', 0); // and flip the widget over
-
- document.getElementById('fliprollie').style.display = 'none'; // clean up the front side - hide the circle behind the info button
-
+ {
+ setTimeout("widget.performTransition();", 0);
+ }
+
+ document.getElementById("fliprollie").style.display = "none";
}
-// hidePrefs() is called by the done button on the back side of the widget. It performs the opposite transition
-// as showPrefs() does.
-
-function hidePrefs()
+function hide_back()
{
var front = document.getElementById("front");
var back = document.getElementById("back");
if (window.widget)
- widget.prepareForTransition("ToFront"); // freezes the widget and prepares it for the flip back to the front
+ {
+ widget.prepareForTransition("ToFront");
+ }
- back.style.display="none"; // hide the back
- front.style.display="block"; // show the front
+ back.style.display = "none";
+ front.style.display = "block";
if (window.widget)
- setTimeout ('widget.performTransition();', 0); // and flip the widget back to the front
+ {
+ setTimeout("widget.performTransition();", 0);
+ }
}
+var flipShown = false;
+var animation = {
+ duration : 0,
+ starttime : 0,
+ to : 1.0,
+ now : 0.0,
+ from : 0.0,
+ firstElement : null,
+ timer : null
+};
-
-
-// PREFERENCE BUTTON ANIMATION (- the pref flipper fade in/out)
-
-var flipShown = false; // a flag used to signify if the flipper is currently shown or not.
-
-
-// A structure that holds information that is needed for the animation to run.
-var animation = {duration:0, starttime:0, to:1.0, now:0.0, from:0.0, firstElement:null, timer:null};
-
-
-// mousemove() is the event handle assigned to the onmousemove property on the front div of the widget.
-// It is triggered whenever a mouse is moved within the bounds of your widget. It prepares the
-// preference flipper fade and then calls animate() to performs the animation.
-
-function mousemove (event)
+function mousemove(event)
{
- if (!flipShown) // if the preferences flipper is not already showing...
+ if (!flipShown)
{
- if (animation.timer != null) // reset the animation timer value, in case a value was left behind
+ if (animation.timer != null)
{
- clearInterval (animation.timer);
+ clearInterval(animation.timer);
animation.timer = null;
}
- var starttime = (new Date).getTime() - 13; // set it back one frame
+ var starttime = (new Date).getTime() - 13;
- animation.duration = 500; // animation time, in ms
- animation.starttime = starttime; // specify the start time
- animation.firstElement = document.getElementById ('flip'); // specify the element to fade
- animation.timer = setInterval ("animate();", 13); // set the animation function
- animation.from = animation.now; // beginning opacity (not ness. 0)
- animation.to = 1.0; // final opacity
- animate(); // begin animation
- flipShown = true; // mark the flipper as animated
+ animation.duration = 500;
+ animation.starttime = starttime;
+ animation.firstElement = document.getElementById("flip");
+ animation.timer = setInterval("animate();", 13);
+ animation.from = animation.now;
+ animation.to = 1.0;
+ animate();
+ flipShown = true;
}
}
-// mouseexit() is the opposite of mousemove() in that it preps the preferences flipper
-// to disappear. It adds the appropriate values to the animation data structure and sets the animation in motion.
-
-function mouseexit (event)
+function mouseexit(event)
{
if (flipShown)
{
animation.duration = 500;
animation.starttime = starttime;
- animation.firstElement = document.getElementById ('flip');
- animation.timer = setInterval ("animate();", 13);
+ animation.firstElement = document.getElementById("flip");
+ animation.timer = setInterval("animate();", 13);
animation.from = animation.now;
animation.to = 0.0;
animate();
}
-// animate() performs the fade animation for the preferences flipper. It uses the opacity CSS property to simulate a fade.
-
function animate()
{
var T;
var ease;
var time = (new Date).getTime();
-
- T = limit_3(time-animation.starttime, 0, animation.duration);
+ T = limit_3(time - animation.starttime, 0, animation.duration);
if (T >= animation.duration)
{
else
{
ease = 0.5 - (0.5 * Math.cos(Math.PI * T / animation.duration));
- animation.now = computeNextFloat (animation.from, animation.to, ease);
+ animation.now = compute_next_float(animation.from, animation.to, ease);
}
animation.firstElement.style.opacity = animation.now;
}
-// these functions are utilities used by animate()
-
function limit_3 (a, b, c)
{
return a < b ? b : (a > c ? c : a);
}
-function computeNextFloat (from, to, ease)
+function compute_next_float(from, to, ease)
{
return from + (to - from) * ease;
}
-// these functions are called when the info button itself receives onmouseover and onmouseout events
-
function enterflip(event)
{
- document.getElementById('fliprollie').style.display = 'block';
+ document.getElementById("fliprollie").style.display = "block";
}
function exitflip(event)
{
- document.getElementById('fliprollie').style.display = 'none';
+ document.getElementById("fliprollie").style.display = "none";
}
/*=====================================================================*\