Bonjour à tous ! Merci d'avance pour l'interêt porté à ma publication.

Je viens vers vous car mon problème persiste depuis quelques temps et je ne trouve pas de solution..

Le context: un site dynamique avec un backoffice rudimentaire. Le client peut accéder à une partie privée du site, ajouter ou bien supprimer des vidéos.


Le comportement du site:*les vidéos passent en auto-play lorsqu'on les survolent.*


Le problème: tourne très bien en local avec mamp mais une fois en ligne, deux erreurs apparaissent et l'effet hover sur les vidéos ne fonctionne plu.




Premier message d'erreur:
*"Uncaught TypeError: Cannot read property top of undefined" *(cf:head-index-front)
Deuxième message d'erreur:
*"Parse error: syntax error, unexpected ')', expecting '(' in /mnt/101/sda/6/b/www.warmup/includes/mainpage.php on line 51"*
Premièrement: pouvez vous me dire ou se trouve mon erreur pour "mainpage" ? Impossible de la trouver.
Deuxièmement :est-ce l'erreur en Php qui cause cette malfonction ou celle en Javascript?


La structure générale:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
<head>
<?php include('includes/head-index-front.php'); ?>
</head>
<body class="cbp-spmenu-push">
<!-- Debut container -->
<div class="container-fluid">
    <div class="loader"></div>
    <!--Menu Push-->
    <?php include('includes/menu-push.php'); ?>
 
    <!--HEADER-->
    <?php include('includes/header.php'); ?>
    <!--BODY-->    
    <?php include('includes/mainpage.php'); ?>
    <!--FOOTER-->
    <?php include('includes/footer.php'); ?>
 
</div> 
<!--Fin container-->
 
</body>
    <!--script menu push-->
    <?php include('includes/script-push.php'); ?>
</html>
Parse error: syntax error, unexpected ')', expecting '(' in /mnt/101/sda/6/b/www.warmup/includes/mainpage.php on line 51



head-index-front :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Roman Veiga</title>
<link rel="stylesheet" href="css/bootstrap.css"  type="text/css" >
<link rel="stylesheet" href="css/style.css"  type="text/css"  />
<link rel="stylesheet" href="css/style_menupush.css"  type="text/css">
<!-- Partie responsive -->

<link rel="stylesheet" media="screen and (min-width: 480px) and (max-width: 768px)" href="css/test.css" type="text/css" />
<link rel="stylesheet" media="screen and (min-width: 768px) and (max-width: 1024px)" href="css/test.css" type="text/css" />
<link rel="stylesheet" media="screen and (min-width: 1024px) and (max-width: 1280px)" href="css/test.css" type="text/css" />
<link rel="stylesheet" media="screen and (min-width: 1280px) and (max-width: 1440px)" href="css/test.css" type="text/css" />
<link rel="stylesheet" media="screen and (min-width: 1440px)" href="css/test.css" type="text/css" />
<script src="js/menu.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/jQuery.scrollSpeed.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/scrolling-nav.js"></script>

<!-- HOVER VIDEO PLAY -->
<script>

$(function() {  
        
  //jQuery.scrollSpeed(60, 400);
    
    var figure = $(".video").hover( hoverVideo, hideVideo );

    function hoverVideo(e) {  
        $(this).get(0).play(); 
    }

    function hideVideo(e) {
        $(this).get(0).pause(); 
    }

   
    $("#titre").hide();
    
    var p = $( "#t2" );
    var offset = p.offset().top; <--- undefined

            var scroll_pos = 0;
            $(document).scroll(function() { 
                scroll_pos = $('body').scrollTop();
                if(scroll_pos > offset) {
                    $("header").addClass('dark');
                    $(".arrow_next a").addClass('white');
                    $("#titre").css('display', 'block');
                    
                } else {
                    $("header").removeClass('dark');
                    $(".arrow_next a").removeClass('white');
                    $("#titre").hide();
                }
            });
        });

        $(window).scroll(function(){
        $("#t1").css("opacity", 1 - $(window).scrollTop() / 130);
        $("#t2").css("opacity", 1 - $(window).scrollTop() / 130);
        });

        $('.mobilenav li a').click(function(){
         var data = $(this).attr('data-url');
        $(".mobilenav li a").animate({ opacity : "0"}, 800);

        
        $(this).animate({ opacity : "1"}, 500, function(){
            window.location = data;
        });


        })</script>



Menu-push:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
 
<?php
 
    $address = $_SERVER['PHP_SELF'];
    $file = explode('/', $address);
 
    $filename = $file[count($file)-1];
 
 
 
?>
 
<!-- Menu push -->
<nav id="c-menu--push-right" class="c-menu c-menu--push-right"> 
     <p class="c-menu__close arrow_prev"><a href="javascript:void(0);">Close</a></p>
<ul class="c-menu__items" >
    <li class="c-menu__item"><a href="#seework" data-category="all" class="c-menu__link">Tous</a></li>
    <li class="c-menu__item"><a href="#seework" data-category="c1" class="c-menu__link">Courts-métrages</a></li>
    <li class="c-menu__item"><a href="#seework" data-category="c2" class="c-menu__link">Publicités</a></li>
    <li class="c-menu__item"><a href="#seework" data-category="c3" class="c-menu__link">Clips</a></li>
    <li class="c-menu__item"><a href="papa.php" class="c-menu__link">Papa production</a></li>
  </ul>
</nav>
 
<!-- Shadow overlay / menu push -->
<div id="c-mask" class="c-mask"></div>
 
<!-- Debut du wrap -->
<div id="o-wrapper" class="o-wrapper">
 
<!-- ///////////////////////// Script Filtre Vidéo  ////////////////////////////////// -->
 
<script>
        $(function(){
 
            //on cree un click sur les liens de la section.main
            $('.c-menu__link').click(function(){
 
 
                //on recupere le data-category du lien clique
                var data = $(this).attr('data-category');
 
                <?php
 
                    if($filename == 'index.php'){
 
                ?>
 
                //on enleve la classe .selected pour tous les liens du filtre
                $('.selected').removeClass('selected');
                //on ajoute .selected au lien clique
                $(this).addClass('selected');
                //si le data-category vaut 'all'
                if( data == 'all'){
                    //on affiche toutes les figures
                    $('.work a').css('display', 'block');
                    //on cache le blank
                    $('.blank_intro').css('display', 'none');
                    //on cache le blank
                    $('header').addClass('dark');
                    //on force la flèche 
                    $(".arrow_next a").addClass('white');
                    $('#titre').css('display', 'block');
 
                //sinon
                }else{
 
                    //on cache toutes les figures
                    $('.work a').css('display', 'none');
                    //on cache le blank
                    $('.blank_intro').css('display', 'none');
                    //on cache le blank
                    $('header').addClass('dark');
                    //on force la flèche 
                    $(".arrow_next a").addClass('white');
                    $('#titre').css('display', 'block');
                    //on affiche les figures dont la classe vaut la categorie
                    $('.'+data).css('display', 'inline-block');
 
 
 
                //fin du test
                }
 
                $('.c-menu__close').trigger('click');
 
                <?php }
                else{ ?>
 
                    window.location='index.php?category='+data;
 
 
 
                    <?php
 
                } 
 
                    ?>
 
            //fin du click
            })
 
        });
 
        </script>

Header:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<!-- /////////////////////////////// HEADER //////////////////////////////////////// --> 
 
<header class="header-maison">
      <div class="row">
            <div class="col-xm-6 col-sm-6 col-md-6 col-lg-6 col-centered">
                  <h1 id="titre"><a href="index.php">Roman Veiga</a></h1>
            </div>
      <div class="col-xm-6 col-sm-6 col-md-6 col-lg-6 col-centered">
 
 
<!-- /////////////////////////////// NAV /////////////////////////////////////////// -->
 
              <!-- BOUTON -->
<p id="c-button--push-right" class="c-button plus arrow_next"><a href="javascript:void(0);">Push</a></p>
 
<!-- /////////////////////////////// DIV /////////////////////////////////////////// -->
 
 
       </div>
       </div>
    </header>


Main-page:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!-- ///////////////////////// BASELINE / HTML  //////////////////////////////////// -->
 
 
        <div class="row blank_intro">
            <div class="col-xm-6 col-sm-6 col-md-6 col-lg-6 col-centered">
                <div id="baseline">
                    <h1 id="t1"><span><?php echo $titre['content']; ?></span></h1>
                           <h2 id="t2"><?php echo $soustitre['content']; ?></h2>
                </div>
            </div>
        </div>
        <div  id="seework" class="col-xm-6 col-sm-6 col-md-6 col-lg-6 col-centered ">
        <p><a href="#seework" class="page-scroll ">See my work</a></p>
            </div>
        <section class="row no-padding work">
 
 
 
<!-- ///////////////////////// DEBUT BOUCLE WHILE VIDEO //////////////////////////// -->
 
 
<?php 
//on lit tous les resultats de la base
while($video = $videos->fetch(PDO::FETCH_ASSOC)){
 
?>
 
<!-- ///////////////////////// CONTENU VIDEO / HTML //////////////////////////////// -->
 
 
 
        <a href="projets.php?id=<?php echo $video['id']; ?>" class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-centered c<?php echo $video['id_genres']; ?>" >
                <video class="video" loop muted>
                    <source src="data/videos/<?php echo $video['video']; ?>" type="video/mp4">
                </video>
                <span class="legende"><?php echo $video['titre']; ?></span>
        </a>
 
 
<!-- ///////////////////////// FIN BOUCLE WHILE VIDEO ////////////////////////////// -->
 
 
<?php }; ?>
 
        </section>



Les fonctions:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<?php //fichier library/config/functions.php
 
 
function redirect($url){
	header('Location: '.$url);
	exit();
}
 
 
function dateEU($in, $hour = false){
	//si $in est vide
	if(empty($in)){
		//on renvoie un message particulier
		return 'NC';
	//sinon
	}else{
		//on cree un objet temporel pour la date donnee en parametre
		$date = new DateTime($in);
 
		//si on a demande l'heure
		if($hour) //equivaut a if( $hour == true )
 
			return $date->format('d/m/Y, à H:i:s');
		else
 
			//on retourne le format qui nous interesse (juste la date)
			return $date->format('d/m/Y');
	}
}
 
 
function cover($filename, $back = false){
 
	$root = '';
 
	//si back
	if($back)
		$root = '../';
 
	//si le filename est vide
	if(empty($filename)){
		//on retourne l'image par defaut
		return $root.'img/defaultcover.png';
	//sinon
	}else{
		//on retourne le chemin vers cette image
		return $root.'data/'.$filename;
	}
}
 
/* fonction qui securise une chaine de caracteres (ex password) */
function cryptPassword($s){
	//on crypte une fois la chaine
	$version1 = hash('sha512', $s);
	//on salte (ajoute un sel)
	$versionSalt = $version1.'pklds852d%$';
	//on recrypte
	$versionFinale = hash('sha512', $versionSalt);
 
	return $versionFinale;
 
	//on peut resumer toutes les lignes en une seule
	//return hash('sha512', hash('sha512', $s).'pklds852d%$');
}
//test du password 123
//var_dump(cryptPassword('123'));
 
 
//function qui ajoute un message dans la session
function flash_in($type, $message){
 
	//si le type de message n'existe pas encore
	if( empty( $_SESSION['message'][$type] )){
 
		//on le cree
		$_SESSION['message'][$type] = [];
 
	//fin du test
	}
 
	//on ajoute le message dans cette case
	array_push($_SESSION['message'][$type], $message);
 
}
 
//fonction qui affiche tous les messages en attente, et les efface de la session
function flash_out(){
 
	//pour chaque type de message
	foreach ($_SESSION['message'] as $key => $value) {
 
		//on parcourt toutes les cases de ce type de message
		foreach ($value as $message) {
 
			//on affiche le message
			echo '<p class="alert alert-'.$key.'">'.$message.'</p>';
		}
	}
 
	//on re-initialise les messages a vide
	$_SESSION['message'] = [];
 
}
Merci et à bientôt !