11548 sujets

JavaScript, DOM et API Web HTML5

Pages :
Bonjour a tous

Voilà je but sur un problème, après pas mal de recherche je n'arrive pas a trouver de solution concrète à mon problème qui est le suivant:

J'ai un code html que je souhaite exécuter une fois par jour et par visiteur, ce code est présent dans tous le site, donc peut importe la page sur laquelle le visiteur arrive, le code doit s'afficher mais une seul fois un peut comme un popup.

voici le code:
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>
<div id="fermer" style="display">
<div class="test">
<div class="test1">
<div class="test2">
<a  title="test"  href="javascript:visibilite('test');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
</div>
OBJET FLASH
</div>
</div>
</div>



La méthode la plus simple serait pour moi d'utiliser un cookie, mais il y a une condition c'est que je ne peut pas mettre du code partout dans la page car c'est un code qui va être redistribué et collé sur différent sites qui utiliserons probablement des langages différents.

Donc j'aimerai savoir savoir si il existe un moyen "d'encapsuler" mon code de manière à avoir tout le code en un seul bloc.

Merci par avance.

PS: pour des raison de confidentialité je ne peut pas donner l'url d'un site exemple et le code exact, mais si vous avez besoins de plus d'information je ferai tous mon possible pour vous donner des informations.
Bonjour,

stanux a écrit :
La méthode la plus simple serait pour moi d'utiliser un cookie, mais il y a une condition c'est que je ne peut pas mettre du code partout dans la page car c'est un code qui va être redistribué et collé sur différent sites qui utiliserons probablement des langages différents.

Je ne vois pas trop en quoi cette condition a un rapport avec le fait d'utiliser un cookie ou non. Donc: a) tu as réalisé un test avec un cookie? et b) ce test fonctionne ou révèle un problème particulier?

stanux a écrit :
Donc j'aimerai savoir savoir si il existe un moyen "d'encapsuler" mon code de manière à avoir tout le code en un seul bloc.

Tu peux tout faire avec un script JS (écrit comme un module) qui va générer le DOM nécessaire, gérer les évènements sur les noeuds DOM créés, et soit appeler une feuille de styles externe soit appliquer directement certains styles sur tes éléments.

Donc oui, y a moyen.
Bonjour,

Merci pour votre réponse et l’intérêt que vous porter sur ce sujet. Pour répondre à vos deux question,

a) j'ai tenté avec un cookie mais j'y arrive difficilement par manque de technique et de connaissance, je ne suis pas expert en la matière et j'ai encore de grosse lacune.

b) ce que j'ai pu réalisé fonctionne très mal et a priori ne réalisé pas ce que je voulais.

Pour ce qui est de javascript l'idée me plait, est ce qu'il serait possible d'avoir un exemple de code adapté a ce que je veux faire? D'habitude je n'aime pas demander un travail tous fait car si l'on veut apprendre c'est loin d'etre la meilleur solution Smiley biggrin , mais si vous avez la possibilité de me "mâcher un peut le travail" ça me rendrez vraiment service.

Merci par avance
stanux a écrit :
D'habitude je n'aime pas demander un travail tous fait car si l'on veut apprendre c'est loin d'etre la meilleur solution Smiley biggrin , mais si vous avez la possibilité de me &quot;mâcher un peut le travail&quot; ça me rendrez vraiment service.

Pas spécialement le temps, pas spécialement envie, et puis c'est limite contraire aux règles du forum.
Donc au minimum je passe mon tour. Smiley cligne
a écrit :


a) j'ai tenté avec un cookie mais j'y arrive difficilement par manque de technique et de connaissance, je ne suis pas expert en la matière et j'ai encore de grosse lacune.


Fais voir le code, qu'on puisse t'aider.
Ok je comprend pour les règles... bon ben on va essayer d'y arriver quand même Smiley murf

@Paolo; malheureusement vue qu ça ne marché pas je ne l'ai pas garder mais bon j'ai un code sous la mains qui fait presque ce que je veux faut juste l'adapté a mon avis:

Ce script serait à insérer " à mon avis" au début de mon code pour créer le cookie (si ce script est bon)
function setc(name, value, expires, path, domain, secure) {
            var today = new Date();
            today.setTime(today.getTime());
          
            if (expires) {
              expires = expires * 1000 * 60 * 60 * 24;
            }
            var expires_date = new Date(today.getTime() + (expires));
          
            document.cookie = name + "=" +escape(value) +
              ( ( expires ) ? ";expires=" + expires_date.toGMTString() : "" ) +
              ( ( path ) ? ";path=" + path : "" ) +
              ( ( domain ) ? ";domain=" + domain : "" ) +
              ( ( secure ) ? ";secure" : "" );
          }

          function getCookie(c_name)
          {
          if (document.cookie.length>0)
            {
            var c_start=document.cookie.indexOf(c_name + "=");
            if (c_start!=-1)
              {
              c_start=c_start + c_name.length+1;
              var c_end=document.cookie.indexOf(";",c_start);
              if (c_end==-1) c_end=document.cookie.length;
              return unescape(document.cookie.substring(c_start,c_end));
              }
            }
          return "";
          }


Ensuite c'est là ou je but il faudrait que je puisse insérer un script qui dit si le cookie est là "display" sinon "display:none", je rajoute une <div id=affiche> autour de mon code et ça devrait le faire?
stanux a écrit :
Ensuite c'est là ou je but il faudrait que je puisse insérer un script qui dit si le cookie est là "display" sinon "display:none"

Là c'est vraiment des bases de base en JavaScript.
Tu as commencé à apprendre JS avec un bouquin ou un cours en ligne? Tu as un début de code que tu peux nous montrer qui fasse (ou tente de faire, on a le droit de se planter ou de ne pas y arriver Smiley cligne ) ce que tu décris?
En faite je n'ai aucune connaissance en javascript ce que je sais c'est que c'est très puissants et que google a du mal a le lire comme moi Smiley cligne . En faite je pourrais comparer javascript à une langue dont on connait seulement quelques mots et des que l'on entend ces quelques mots dans une conversation on en devine le sujet mais difficile d'y participer...

voila ce que j'ai pu trouver qui a mes yeux pourrais correspondre

<SCRIPT language="javascript">

window.onload=function()
{
var cook = getCook('affiche');
 if  (cook) { affiche.style.display="none"; 
  }
  else {                   
  affiche.style.display="inline"; 
  setCook("affiche");
}
  }  
</SCRIPT>


le code complet comme je le vois:

<SCRIPT language="javascript">
function setc(name, value, expires, path, domain, secure) {

            var today = new Date();

            today.setTime(today.getTime());

          

            if (expires) {

              expires = expires * 1000 * 60 * 60 * 24;

            }

            var expires_date = new Date(today.getTime() + (expires));

          

            document.cookie = name + "=" +escape(value) +

              ( ( expires ) ? ";expires=" + expires_date.toGMTString() : "" ) +

              ( ( path ) ? ";path=" + path : "" ) +

              ( ( domain ) ? ";domain=" + domain : "" ) +

              ( ( secure ) ? ";secure" : "" );

          }



          function getCookie(c_name)

          {

          if (document.cookie.length>0)

            {

            var c_start=document.cookie.indexOf(c_name + "=");

            if (c_start!=-1)

              {

              c_start=c_start + c_name.length+1;

              var c_end=document.cookie.indexOf(";",c_start);

              if (c_end==-1) c_end=document.cookie.length;

              return unescape(document.cookie.substring(c_start,c_end));

              }

            }

          return "";

          }
</SCRIPT>

<SCRIPT language="javascript">

window.onload=function()
{
var cook = getCook('affiche');
 if  (cook) { affiche.style.display="none"; 
  }
  else {                   
  affiche.style.display="inline"; 
  setCook("affiche");
}
  }  
</SCRIPT>

<div ID="affiche">
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>

<div id="fermer" style="display">

<div class="test">

<div class="test1">

<div class="test2">

<a  title="test"  href="javascript:visibilite('test');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>

</div>

OBJET FLASH

</div>

</div>

</div>
</div>


Sans doute des erreurS...
Modifié par stanux (24 Nov 2011 - 23:09)
stanux a écrit :
En faite je n'ai aucune connaissance en javascript

Au choix:
1. Apprendre.
2. Se faire aider par un pro (prévoir un budget).
3. Ne pas faire.

Bonne suite.
Bon ben justement j'ai pas attendue pour comprendre... alors on va peut etre pouvoir m'aider maintenant Smiley lol ?

j'ai réussi a faire ce que je veux faire parfaitement mais ça n'a pas l'air universel visiblement... ça marche sous IE sous chrome sous opéra mais firefox lui... n'en veux pas

je met mon code pré fini ce qui pourra deja sans doute rendre service a des non connaisseur...

<script type="text/javascript" language="JavaScript">
  function setCookie(nom, valeur, expire, chemin, domaine, securite){
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
               ((securite == true) ? '; secure' : '');
   }

   var dtExpire = new Date();
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);

   setCookie('coucou', 'hey hey', dtExpire, '/' );
  
   function  getCookie(name){
     if(document.cookie.length == 0)
       return null;

     var regSepCookie = new RegExp('(; )', 'g');
     var cookies = document.cookie.split(regSepCookie);

     for(var i = 0; i < cookies.length; i++){
       var regInfo = new RegExp('=', 'g');
       var infos = cookies[i].split(regInfo);
       if(infos[0] == name){
         return unescape(infos[1]);
       }
     }
     return null;
   }
   </script>
   
   <SCRIPT language="javascript">



window.onload=function()

{

var cook = getCookie('coucou');

 if  (cook) { coucou.style.display="none"; 

  }

  else {                   

  coucou.style.display="inline"; 

  setCook("coucou");

}

  }  

</SCRIPT>

<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>

<div ID="coucou">

<div id="fermer" style="display">
<div class="test">
<div class="test1">
<div class="test2">
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
</div>
<object classid </object>
</div>
</div>
</div>
</div>


merci
[/i]

[EDIT] Zut aprés test elle ne s'affiche jamais là je comprend plus Smiley decu un peut d'aid serait la bienvenue je pense que je suis pas loin...
Modifié par stanux (25 Nov 2011 - 17:56)
stanux a écrit :
ça marche sous IE sous chrome sous opéra mais firefox lui... n'en veux pas

Tu as des erreurs dans la console JS de Firefox?
Là comme ça je soupçonne cette partie du code:
coucou.style.display="inline"; 

À quoi correspond cette variable, "coucou"? Elle n'est définie nulle part.
Je crois que certains navigateurs vont aller chercher dans le document un élément qui aurait pour id ou name "coucou", mais ce n'est pas standard et Firefox ne le fait pas. Tu as donc intérêt à utiliser une méthode DOM standard pour récupérer une référence à ton élément. Par exemple:
var coucou = document.getElementById('coucou');


stanux a écrit :
Zut aprés test elle ne s'affiche jamais là je comprend plus

Tu testes une fois, ça écrit un cookie. Quand le cookie est présent, tu masques ton élément. Tu testes à nouveau dans le même navigateur, le cookie est toujours là, et ton élément est encore masqué. Et ainsi de suite. Ça me semble normal.

Tu peux supprimer tous les cookies dans les préférences du navigateur, ou bien supprimer un cookie spécifique en utilisant Web Inspector (Safari, Chrome), ou Firebug + Firecookie dans Firefox.
OK j'ai fait une modification, alors on approche lol, ça marche sur ff mais quoi qu'il arrive elle disparaît tout le temps j'ai vidé mes cookies via ff et ccleaner j'a bien vérifié avant d'afficher la page contenant le code pas de trace de mon cookie, je lance ma page et pouf ça disparait direct, peut importe le navigateur cookie vidé voici le code actuel:

<script type="text/javascript" language="JavaScript">
  function setCookie(nom, valeur, expire, chemin, domaine, securite){
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
               ((securite == true) ? '; secure' : '');
   }

   var dtExpire = new Date();
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);

   setCookie('coucou', 'hey hey', dtExpire, '/' );

  
   function  getCookie(name){
     if(document.cookie.length == 0)
       return null;

     var regSepCookie = new RegExp('(; )', 'g');
     var cookies = document.cookie.split(regSepCookie);

     for(var i = 0; i < cookies.length; i++){
       var regInfo = new RegExp('=', 'g');
       var infos = cookies[i].split(regInfo);
       if(infos[0] == name){
         return unescape(infos[1]);
       }
     }
     return null;
   }
   </script>
   
   
   
   
   <script type="text/javascript">
window.onload=function()
{
    var coucou = document.getElementById('coucou');
    
 if  (document.cookie) { coucou.style.display="none";    }
  else {    coucou.style.display="inline";
            
}
  } 
</script>  

<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>

<div ID="coucou">

<div id="fermer" style="display">
<div class="test">
<div class="test1">
<div class="test2">
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
</div>
<object > </object>
</div>
</div>
</div>
</div>
[/i]

Aucune erreur dans la console JS de ff
Modifié par stanux (25 Nov 2011 - 18:41)
Bah là c'est simple. Si on prend l'ordre dans lequel le navigateur exécute tes scripts:

1. Le navigateur exécute le premier script. Il ajoute un cookie qui dit "veni vidi".
2. Il exécute le deuxième script, qui associe une fonction à l'évènement window.onload.
3. Le reste de la page est analysée, les différents éléments (styles, images...) se chargent.
4. L'évènement window.onload est déclenché. La fonction associée est exécutée. Cette fonction vérifie la présence du cookie... qui est forcément là, cf. le premier point! Donc ton élément est masqué.

Il faudrait garder ta vérification en (4), et ajouter le cookie en (5).
si j'ai bien compris c'est dans ce sens là?

<script type="text/javascript" language="JavaScript">
  
   
   
   function  getCookie(name){
     if(document.cookie.length == 0)
       return null;

     var regSepCookie = new RegExp('(; )', 'g');
     var cookies = document.cookie.split(regSepCookie);

     for(var i = 0; i < cookies.length; i++){
       var regInfo = new RegExp('=', 'g');
       var infos = cookies[i].split(regInfo);
       if(infos[0] == name){
         return unescape(infos[1]);
       }
     }
     return null;
   }

window.onload=function()
{
    var coucou = document.getElementById('coucou');
    
 if  (document.cookie) { coucou.style.display="none";    }
  else {    coucou.style.display="inline";
            
}
  }
 function setCookie(nom, valeur, expire, chemin, domaine, securite){
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
               ((securite == true) ? '; secure' : '');
   }

   var dtExpire = new Date();
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);


   setCookie('coucou', 'hey hey', dtExpire, '/' ); 
</script>


ci c'est ça c'est ce que je m’étais dit et ça ne marche pas visiblement Smiley decu [/i]
Modifié par stanux (25 Nov 2011 - 23:59)
Non, ton code modifié ne change pas grand chose à l'ordre d'exécution, qui devient:

1. Déclarer la fonction getCookie.
2. Associer une fonction (qui ne sera PAS exécutée immédiatement) à l'évènement window.onload.
3. Déclarer la fonction setCookie.
4. Ajouter un cookie nommé "coucou".

Voilà pour ce qu'il se passe lors de la lecture de ton script (lorsque le navigateur parse la page HTML). L'étape suivante c'est:

5. L'évènement window.onload est déclenché, la fonction associée est exécutée et vérifie si un cookie nommé "coucou" existe. Bien entendu il existe TOUJOURS (vu qu'il est mis en place à l'étape 4).

L'ajout de ton cookie doit être réalisé dans ta fonction déclenchée au window.onload, APRÈS la vérification de la présence du cookie.
Bon je comprend bien ce que tu veux m'expliquer Smiley langue mais j'ai du mal est ce ça t’embête de me décomposer ces étapes en me séparant le code car là je m'embrouille Smiley confused ça me montrerai bien le début et là fin de chaque fonction.

merci par avance

j'ai l'impression de passer a coté d'un truc que visiblement je n'ai pas saisie j'ai fait pas mal de test sans résultat et je ne veux pas polluer le post de code et de mauvais test Smiley cligne
Modifié par stanux (26 Nov 2011 - 15:05)
stanux a écrit :
est ce ça t’embête de me décomposer ces étapes en me séparant le code

Oui, ça m'embêterait.
Les explications que j'ai données sont claires. Si tu n'arrives pas à les utiliser, c'est qu'il te manque des connaissances de bases en JavaScript (rien que la syntaxe, pour savoir où commence et finit une fonction...) qui peuvent s'apprendre en quelques heures de lecture d'un cours d'introduction tel que Eloquent JavaScript (en anglais) ou le cours JavaScript du Site du Zéro (en français).

On a tout à fait le droit de ne rien connaitre à JavaScript et de ne pas avoir envie d'apprendre ce langage. Mais dans ce cas: a) on fait appel à des pros ou à un bon copain qui s'y connait et b) on n'a malheureusement pas grand chose à faire sur ce forum qui est avant tout destiné à l'apprentissage (pas au dépannage). Smiley cligne
stanux a écrit :
j'ai l'impression de passer a coté d'un truc

Des connaissances de base en JavaScript? Smiley sweatdrop
Ce que je comprend surtout c'est que ce forum n'est pas fait pour les newbie comme moi, je pense avoir jouer le jeux j'ai cherché j'ai trouver beaucoup d'info j'ai du tester 20 combinaison possible et je n'y arrive toujours pas... alors oui c'est sur je n'ai pas grande connaissance en javascripts mais pour le coup me montrer concrètement ou je merde me permettrai d'avancer.

Ce n'est pas grave merci quand même et désolé de vous avoir fait perdre votre temps.
Pages :