# HG changeset patch
# User Patrick PIERRE <patrick.pierre@prismallia.fr>
# Date 1339959133 -7200
# Node ID aa8a171c543068430c4b1d545a43b03b97aee88d
# Parent  3b696abda836b922eb385bea73f66076e22d3604
Ajout d'un JS avec effet glow

diff -r 3b696abda836 -r aa8a171c5430 Pdf/BaladeNature/Js/balade_nature.js
--- /dev/null	jeu. janv. 01 00:00:00 1970 +0000
+++ b/Pdf/BaladeNature/Js/balade_nature.js	dim. juin 17 20:52:13 2012 +0200
@@ -0,0 +1,108 @@
+// $Id$
+// balade_nature
+
+var text = null;
+var spot = null;
+var box = null;
+var boxProperty = '';
+
+
+window.addEvent('domready', function(){
+    // Tooltips
+    (function initialize() {
+        $$(".pdocImagePulse").each(function(pulse) {
+            var mainImg  = pulse.getParent().getElement("img");
+            var pulseImg = pulse.getElement("img");
+            var tooltip  = $(pulse.get('id')+"t");
+            mainImg.setStyle("max-width", "none");
+            var pulseWidth  = 100 * pulseImg.getSize().x / mainImg.getSize().x;
+            var pulseHeight = 100 * pulseImg.getSize().y / mainImg.getSize().y;
+            var mainImgRealWidth = mainImg.getSize().x;
+
+            pulse.setStyles({
+                "width": pulseWidth + "%", "height": pulseHeight + "%",
+                "left": (pulse.getStyle("left").toFloat() - pulseWidth/2) + "%",
+                "top":  (pulse.getStyle("top").toFloat() - pulseHeight/2) + "%"
+            });
+            pulseImg.setStyle("width", "100%");
+            mainImg.setStyle("max-width", "100%");
+            mainImg.getParent().setStyle("max-width", "100%");
+
+            var fontSize = tooltip.getStyle("font-size").toFloat();
+            tooltip.setStyles({
+                "opacity": 0, "display": "block",
+                "font-size": (fontSize * mainImg.getSize().x / mainImgRealWidth)
+                    + tooltip.getStyle("font-size").replace(fontSize, "")
+            });
+            
+            var tooltipImg = tooltip.getElement("img");
+            if (tooltipImg) {
+                tooltip.setStyle(
+                    "width", (100 * tooltipImg.getSize().x / mainImgRealWidth) + "%");
+                tooltipImg.setStyle("width", "100%");
+            }
+        });
+
+        $$(".pdocImagePulse").addEvent("click", function() {
+            var pulse   = this;
+            var tooltip = $(this.get('id')+"t");
+            pulse.setStyle("display", "none");
+            tooltip.tween("opacity", 1);
+            (function() {
+                tooltip.tween("opacity", 0);
+                pulse.setStyle("display", "block");
+            }).delay(12000);
+        });
+        
+        $$(".pdocImageTooltip").addEvent("click", function() {
+            this.tween("opacity", 0);
+            $(this.get('id').substr(0, this.get('id').length-1))
+                .setStyle("display", "block");
+        });
+    }).delay(50);
+     
+    // Effect: glow
+    var effectGlow = $("effectGlow");
+    if (effectGlow) {
+        text = $("effectGlowText");
+        spot = $("effectGlowSpot");
+        box = $("effectGlowBox")
+        if (typeof box.style.webkitBoxShadow == 'string') {
+            boxProperty = 'webkitBoxShadow';
+        } else if (typeof box.style.MozBoxShadow == 'string') {
+            boxProperty = 'MozBoxShadow';
+        } else if (typeof box.style.boxShadow == 'string') {
+            boxProperty = 'boxShadow';
+        }
+
+        if (text && spot && box) {
+            effectGlow.onmousemove = onMouseMove;
+            effectGlow.ontouchmove = function (e) {
+                e.preventDefault();
+                e.stopPropagation();
+                onMouseMove({clientX: e.touches[0].clientX, clientY: e.touches[0].clientY});
+            }
+        }
+    }
+});
+
+
+function onMouseMove(e) {
+    if (typeof e === 'undefined' || typeof e.clientX === 'undefined') {
+        return;
+    }
+    
+    var xm = (e.clientX - Math.floor(window.innerWidth / 2)) * 0.4;
+    var ym = (e.clientY - Math.floor(window.innerHeight / 3)) * 0.4;
+    var d = Math.round(Math.sqrt(xm*xm + ym*ym) / 5);
+    text.style.textShadow = -xm + 'px ' + -ym + 'px ' + (d + 10) + 'px black';
+    
+    if (boxProperty) {
+        box.style[boxProperty] = '0 ' + -ym + 'px ' + (d + 30) + 'px black';
+    }
+    
+    xm = e.clientX - Math.floor(window.innerWidth / 2);
+    ym = e.clientY - Math.floor(window.innerHeight / 2);
+    spot.style.backgroundPosition = xm + 'px ' + ym + 'px';
+}
+