IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Youtube API : fonctions non définies


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Juin 2009
    Messages
    47
    Détails du profil
    Informations personnelles :
    Âge : 35
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Juin 2009
    Messages : 47
    Points : 43
    Points
    43
    Par défaut Youtube API : fonctions non définies
    Bonjour à tous,

    Je m’intéresse au fonctionnement de l'API youtube, je demande à google des infos et je tombe la dessus (chic une doc google) : http://code.google.com/apis/ajax/pla...omeless_player

    Je m'empresse donc de copié le code dans un fichier que j'appelle youtube.html, quand je lance la page premier problème assez rapidement réglé : - ligne 97 et 113 remplacer ytPlayer par ytplayer.

    Mais maintenant je suis confronté à un autre soucis :

    Lorsque je clique sur les boutons play, pause, mute et unmute voici les erreurs qui me sont retournées :

    Uncaught TypeError: Object #<HTMLObjectElement> has no method 'playVideo'
    Uncaught TypeError: Object #<HTMLObjectElement> has no method 'pauseVideo'
    Uncaught TypeError: Object #<HTMLObjectElement> has no method 'mute'
    Uncaught TypeError: Object #<HTMLObjectElement> has no method 'unMute'
    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
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    <!--
    You are free to copy and use this sample in accordance with the terms of the
    Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
    -->
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
        <title>YouTube Player API Sample</title>
        <style type="text/css">
          #videoDiv { 
            margin-right: 3px;
          }
          #videoInfo {
            margin-left: 3px;
          }
        </style>
        <script src="http://www.google.com/jsapi" type="text/javascript"></script>
        <script type="text/javascript">
          google.load("swfobject", "2.1");
        </script>    
        <script type="text/javascript">
     
          /*
           * Chromeless player has no controls.
           */
     
          // Update a particular HTML element with a new value
          function updateHTML(elmId, value) {
            document.getElementById(elmId).innerHTML = value;
          }
     
          // This function is called when an error is thrown by the player
          function onPlayerError(errorCode) {
            alert("An error occured of type:" + errorCode);
          }
     
          // This function is called when the player changes state
          function onPlayerStateChange(newState) {
            updateHTML("playerState", newState);
          }
     
          // Display information about the current state of the player
          function updatePlayerInfo() {
            // Also check that at least one function exists since when IE unloads the
            // page, it will destroy the SWF before clearing the interval.
            if(ytplayer && ytplayer.getDuration) {
              updateHTML("videoDuration", ytplayer.getDuration());
              updateHTML("videoCurrentTime", ytplayer.getCurrentTime());
              updateHTML("bytesTotal", ytplayer.getVideoBytesTotal());
              updateHTML("startBytes", ytplayer.getVideoStartBytes());
              updateHTML("bytesLoaded", ytplayer.getVideoBytesLoaded());
              updateHTML("volume", ytplayer.getVolume());
            }
          }
     
          // Allow the user to set the volume from 0-100
          function setVideoVolume() {
            var volume = parseInt(document.getElementById("volumeSetting").value);
            if(isNaN(volume) || volume < 0 || volume > 100) {
              alert("Please enter a valid volume between 0 and 100.");
            }
            else if(ytplayer){
              ytplayer.setVolume(volume);
            }
          }
     
          function playVideo() {
            if (ytplayer) {
              ytplayer.playVideo();
            }
          }
     
          function pauseVideo() {
            if (ytplayer) {
              ytplayer.pauseVideo();
            }
          }
     
          function muteVideo() {
            if(ytplayer) {
              ytplayer.mute();
            }
          }
     
          function unMuteVideo() {
            if(ytplayer) {
              ytplayer.unMute();
            }
          }
     
     
          // This function is automatically called by the player once it loads
          function onYouTubePlayerReady(playerId) {
     
            ytplayer = document.getElementById("ytplayer");
            // This causes the updatePlayerInfo function to be called every 250ms to
            // get fresh data from the player
            setInterval(updatePlayerInfo, 250);
            updatePlayerInfo();
            ytplayer.addEventListener("onStateChange", "onPlayerStateChange");
            ytplayer.addEventListener("onError", "onPlayerError");
            //Load an initial video into the player
            ytplayer.cueVideoById("ylLzyHk54Z0");
          }
     
          // The "main method" of this sample. Called when someone clicks "Run".
          function loadPlayer() {
            // Lets Flash from another domain call JavaScript
            var params = { allowScriptAccess: "always" };
            // The element id of the Flash embed
            var atts = { id: "ytplayer" };
            // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
            swfobject.embedSWF("http://www.youtube.com/apiplayer?" +
                               "&enablejsapi=1&playerapiid=player1", 
                               "videoDiv", "480", "295", "8", null, null, params, atts);
          }
          function _run() {
            loadPlayer();
     
          }
          google.setOnLoadCallback(_run);
        </script>
      </head>
      <body style="font-family: Arial;border: 0 none;">
        <table>
        <tr>
        <td><div id="videoDiv">Loading...</div></td>
        <td valign="top">
          <div id="videoInfo">
            <p>Player state: <span id="playerState">--</span></p>
            <p>Current Time: <span id="videoCurrentTime">--:--</span> | Duration: <span id="videoDuration">--:--</span></p>
            <p>Bytes Total: <span id="bytesTotal">--</span> | Start Bytes: <span id="startBytes">--</span> | Bytes Loaded: <span id="bytesLoaded">--</span></p>
            <p>Controls: <a href="javascript:void(0);" onclick="playVideo();">Play</a> | <a href="javascript:void(0);" onclick="pauseVideo();">Pause</a> | <a href="javascript:void(0);" onclick="muteVideo();">Mute</a> | <a href="javascript:void(0);" onclick="unMuteVideo();">Unmute</a></p>
            <p><input id="volumeSetting" type="text" size="3" />&nbsp;<a href="javascript:void(0)" onclick="setVideoVolume();">&lt;- Set Volume</a> | Volume: <span id="volume">--</span></p>
          </div>
        </td></tr>
        </table>
      </body>
    </html>
    ?
    Je ne vois pas trop d'ou pourrait provenir cette erreur. Merci d'avance pour votre aide.

  2. #2
    Membre habitué Avatar de the-destroyer
    Homme Profil pro
    Étudiant
    Inscrit en
    Mars 2009
    Messages
    204
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 29
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Mars 2009
    Messages : 204
    Points : 125
    Points
    125
    Par défaut
    Bonsoir euh juste c'est quoi le point d'interrogation a la ligne 142 ? :o

  3. #3
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Juin 2009
    Messages
    47
    Détails du profil
    Informations personnelles :
    Âge : 35
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Juin 2009
    Messages : 47
    Points : 43
    Points
    43
    Par défaut
    Bonsoir,

    Euh la seule explication logique est que je l'ai ajouté en faisant mon copié collé ><, il n’apparaît pas dans mon fichier.

  4. #4
    Membre confirmé Avatar de nadox
    Homme Profil pro
    Développeur
    Inscrit en
    Février 2010
    Messages
    360
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : Développeur
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Février 2010
    Messages : 360
    Points : 551
    Points
    551
    Par défaut
    Bonsoir,

    Citation Envoyé par crazymonkey Voir le message
    Je m'empresse donc de copié le code dans un fichier que j'appelle youtube.html, quand je lance la page premier problème assez rapidement réglé : - ligne 97 et 113 remplacer ytPlayer par ytplayer.
    Aucun intérêt, il s'agit de l'id qui sera utilisé par l'API pour identifier l'élément HTML Object qu'elle va créé sur la page... Donc ce n'est pas une erreur.

    Par contre, si tu ne n'étais pas trop "empressé" de copier/coller le code sans chercher un peu comment on peux utiliser les API google, tu aurais peut-être trouvé cette page :
    http://code.google.com/intl/fr-FR/apis/loader/
    qui dit assez clairement qu'il te faut une clef pour pouvoir utiliser l'exemple sur ton propre site.
    Inutile d'espérer le faire fonctionner en local non plus, puisque la clef fait que l'API est liée au domaine du site utilisateur...(donc sur le web only ! )
    C'est pas par hasard si on te propose de tester/éditer le code des exemples sur une interface web

    Bon courage pour la suite, et n'oublie pas : quand on te dit que google est ton ami, ce n'est pas toujours si simple

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 2
    Dernier message: 13/11/2006, 06h42
  2. [Wamp] Appel de fonction non défini
    Par morphine63 dans le forum EDI, CMS, Outils, Scripts et API
    Réponses: 2
    Dernier message: 29/10/2006, 10h02
  3. Fonction non définie (alors qu'elle l'est) - Cocher toutes les cases
    Par navis84 dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 22/09/2006, 12h02
  4. Réponses: 2
    Dernier message: 01/06/2006, 14h54
  5. fonction non définie
    Par ston dans le forum Access
    Réponses: 11
    Dernier message: 12/12/2005, 16h02

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo