Pdf/BaladeNature/Js/balade_nature.js
author Patrick PIERRE
ven., 30 mai 2014 20:05:02 +0200
changeset 125 dc7473e2d1af
parent 124 f0f5895259d9
permissions -rw-r--r--
Mootools -> jQuery
patrick@17
     1
// $Id$
patrick@17
     2
// balade_nature
patrick@17
     3
Patrick@125
     4
/*global jQuery: true */
Patrick@124
     5
patrick@17
     6
Patrick@125
     7
jQuery(document).ready(function($) {
Patrick@125
     8
    // Hotspots
Patrick@125
     9
    var delay = 5000;
Patrick@125
    10
    $('.pdocHotspot').each(function() {
Patrick@125
    11
        var $hotspot = $(this);
Patrick@125
    12
        var $spot = $('#' + $hotspot.attr('id') + 's');
Patrick@125
    13
        var scenario = $hotspot.children('span').length;
Patrick@125
    14
        if ($spot.length && scenario) {
Patrick@125
    15
            $hotspot.css('opacity', 1);
Patrick@125
    16
            $hotspot.click(function() {
Patrick@125
    17
                if ($hotspot.css('opacity') == 1) {
Patrick@125
    18
                    $hotspot.animate({opacity: 0})
Patrick@125
    19
                        .delay(delay)
Patrick@125
    20
                        .animate({opacity: 1});
Patrick@125
    21
                    $spot.css({opacity: 0, display: 'block'})
Patrick@125
    22
                        .animate({opacity: 1})
Patrick@125
    23
                        .delay(delay)
Patrick@125
    24
                        .animate({opacity: 0}, function() {
Patrick@125
    25
                            $spot.css({opacity: '', display: ''});  
Patrick@125
    26
                        });
Patrick@125
    27
                } else {
Patrick@125
    28
                    $spot.click(); 
Patrick@125
    29
                }
Patrick@125
    30
            });
patrick@17
    31
Patrick@125
    32
            $spot.click(function() {
Patrick@125
    33
                $spot.stop().animate({opacity: 0}, function() {
Patrick@125
    34
                    $spot.css({opacity: '', display: ''});  
Patrick@74
    35
                });
Patrick@125
    36
                $hotspot.stop().animate({opacity: 1});
Patrick@125
    37
            });
Patrick@125
    38
        }
Patrick@125
    39
    });
patrick@17
    40
patrick@17
    41
    // Effect: glow
Patrick@125
    42
    var boxProperty = '';
Patrick@125
    43
    var $text = null;
Patrick@125
    44
    var $spot = null;
Patrick@125
    45
    var $box = null;
Patrick@125
    46
    var $effectGlow = $('#effectGlow');
Patrick@125
    47
    if ($effectGlow.length) {
Patrick@125
    48
        $text = $('#effectGlowText');
Patrick@125
    49
        $spot = $('#effectGlowSpot');
Patrick@125
    50
        $box = $('#effectGlowBox');
Patrick@125
    51
        if (typeof $box.css('webkitBoxShadow') == 'string') {
patrick@17
    52
            boxProperty = 'webkitBoxShadow';
Patrick@125
    53
        } else if (typeof $box.css('MozBoxShadow') == 'string') {
patrick@17
    54
            boxProperty = 'MozBoxShadow';
Patrick@125
    55
        } else if (typeof $box.css('boxShadow') == 'string') {
patrick@17
    56
            boxProperty = 'boxShadow';
patrick@17
    57
        }
Patrick@125
    58
        $effectGlow.on('mousemove touchmove', onMouseMove);
Patrick@125
    59
    }
patrick@17
    60
Patrick@125
    61
    function onMouseMove(e) {
Patrick@125
    62
        if (typeof e === 'undefined' || typeof e.clientX === 'undefined') {
Patrick@125
    63
            return;
patrick@17
    64
        }
Patrick@125
    65
        
Patrick@125
    66
        var xm = (e.clientX - Math.floor(window.innerWidth / 2)) * 0.4;
Patrick@125
    67
        var ym = (e.clientY - Math.floor(window.innerHeight / 3)) * 0.4;
Patrick@125
    68
        var d = Math.round(Math.sqrt(xm*xm + ym*ym) / 5);
Patrick@125
    69
        $text.css('textShadow',  -xm + 'px ' + -ym + 'px ' + (d + 10) + 'px black');
Patrick@125
    70
        
Patrick@125
    71
        if (boxProperty) {
Patrick@125
    72
            $box.css(boxProperty, '0 ' + -ym + 'px ' + (d + 30) + 'px black');
Patrick@125
    73
        }
Patrick@125
    74
        
Patrick@125
    75
        xm = e.clientX - Math.floor(window.innerWidth / 2);
Patrick@125
    76
        ym = e.clientY - Math.floor(window.innerHeight / 2);
Patrick@125
    77
        $spot.css('backgroundPosition', xm + 'px ' + ym + 'px');
patrick@17
    78
    }
patrick@17
    79
});