Connexion

Récupérer mon mot de passe

Derniers sujets
» [Invision] Membres - 'cartes de visite'
par Croa-Croa Aujourd'hui à 18:51

» *RESOLU*[PhpBB2] Largeur cadre messagerie privé
par Milouze14 Aujourd'hui à 5:54

» *RESOLU*[PhpBB2] Supprimer zone commentaires des infos profil
par Milouze14 Hier à 17:06

» *RESOLU*[PhpBB3] Aide sur syntaxe JS
par Milouze14 Mar 10 Déc 2019 - 17:35

» *RESOLU*[ModernBB] Décoration !
par Milouze14 Mar 10 Déc 2019 - 16:55

» *RESOLU*[Invision] Vote négatif réservé aux modérateurs et administrateurs
par Milouze14 Mar 10 Déc 2019 - 16:12

» *RESOLU*[ModernBB] Cherche script participation et autres
par Milouze14 Lun 9 Déc 2019 - 17:59

» [Toutes versions]Ajouter un contenu visible que par les membres ayant répondu.
par oneandone Lun 9 Déc 2019 - 17:37

» *RESOLU*[PhpBB2] Supprimer champ de contact dans les infos de profil,
par Milouze14 Dim 8 Déc 2019 - 20:29

» *RESOLU*[Invision] Déplacement du bouton résolu (suite et fin?)
par Milouze14 Dim 8 Déc 2019 - 9:01

» Règlement de l'entraide Forumactif
par oneandone Sam 7 Déc 2019 - 13:58

» *RESOLU*[PhpBB3] Outil modération
par Milouze14 Jeu 5 Déc 2019 - 19:30

» *CORBEILLE*[Edge] Pub intrusive
par Milouze14 Mer 4 Déc 2019 - 3:55

» *RESOLU*[PhpBB3] Compte à rebours hebdomadaire permanent
par Milouze14 Mar 3 Déc 2019 - 19:02

» *RESOLU*[PhpBB2] Selecteur de style | placement
par Milouze14 Mar 3 Déc 2019 - 16:32

» *RESOLU*[PhpBB3] Retirer lien Signaler un abus
par Milouze14 Lun 2 Déc 2019 - 15:10

» *RESOLU*[PhpBB2] Largeur du forum
par Milouze14 Lun 2 Déc 2019 - 3:55

» [PhpBB2] Du relief sur mon annonce
par Milouze14 Dim 1 Déc 2019 - 15:24

» [Edge] Ajouter un bouton j'aime
par Milouze14 Sam 30 Nov 2019 - 16:04

» Histoire de Blondes Sans Fin
par Quad Daniel Ven 29 Nov 2019 - 8:46

*RESOLU*[PhpBB3] Compte à rebours hebdomadaire permanent

Page 1 sur 2 1, 2  Suivant

Voir le sujet précédent Voir le sujet suivant Aller en bas

photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 9:51

  • Version du forum :
    PhpBB3
  • Templates modifiés :
    oui
  • Navigateur :
    Firefox
Bonjour,

Je cherche à installer en haut de page un compte à rebours permanent.
Il y a ce script sur FA peut-être adaptable: https://forum.forumactif.com/t379157-horloge-compte-a-rebours-sans-personnalisation#3196324
Mais il faudrait toutes les semaines changer la date.

Le but serait d'avoir en permanence une horloge défilante sur une ligne en haut à gauche de la page d'accueil et sur le portail indiquant: "Temps restant pour voter: 2 jours 12:20:50"

Elle démarrerait à 7 jours 00:00:00 le mardi à 0 heure et arriverait à 0 jour 00:00:00 le lundi à minuit.
Et cela de façon permanente.

Merci pour votre aide.


Dernière édition par photoclic le Mar 3 Déc 2019 - 19:04, édité 1 fois
Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 15:27

Coucou Serge,
hum, c'est un script d'Arnaud et franchement , je ne pourrais pas te renseigner sur ce point car tout cela est du Jargon pour moi MDR .

En espérant que notre ami @no_way (Arnaud) passe dans le coin
pour te donner une réponse,il est assez prit concernant sa vie privée
donc soit patient Serge.




photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 15:46

Hello Philippe,

Ah bon, le monde est petit; je n'avais pas vu qu'il était d'Arnaud.

Sujet qui n'a aucune urgence.
Si Arnaud est indisponible, peut-être clôturer le sujet Phil.
A vous de voir.

photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 16:32

Re-Phil,

Pourrais-tu par contre pour l'instant, m'indiquer comment placer cette horloge en l'état en haut de page d'accueil et du portage.
Son code:
Code:
<span id="id_horloge"></span>

Merci pour ton aide.

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 16:36

Dans les templates concernés Serge MDR .
Index_body et portal_body clin oeil


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 16:59

Je teste un script trouvé sur le net mais il faut agir dessus chaque semaine :

http://www.supportduweb.com/post-282-compte-a-rebour.html

Voir ce que cela donne sur mon fofo de test:
https://testphpbb3.1fr1.net/

Si cela te convient Serge, est ce que les caractères sont trop petits?

Je reviens plus tard impeccable .




photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 17:09

Pétard, je ne pense jamais aux templates....

Ah, bin en attendant, je vais effectivement mettre un compte à rebours avec intervention chaque semaine.

Oui, Phil, ce que tu me proposes me convient.

Non les caractères ne sont pas trop petits, je cherche quelque chose de sobre et discret.
Voire même sans les carrés, ou bien avec les chiffres centrés dans les carrés si c'est possible.

Je reviens plus tard aussi clin oeil



Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 17:32

Voilà , c'est plus sobre comme ceci:
https://testphpbb3.1fr1.net/



Alors dans chaque template concerné:

Supprimes le code htl que tu as déposé et ajoutes ceci:
Code:
<div id="Compte">
</div><script type="text/javascript">
var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("Dec 09 00:00:00 2019");
var sec = (date2 - date1) / 1000;
var n = 24 * 3600;
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "<div class=titre>Temps restant pour voter: </div><div class=nume><span>"+ j +"</span></div> <div class=alpha>jour(s)</div><div class=nume><span>"+ h +"</span></div> <div class=alpha>heure(s)</div><div class=nume><span> "+ mn +" </span></div><div class=alpha>minute(s)</div><div class=nume><span> "+ sec + " </span></div><div class=alpha>seconde(s)</div>";
window.status = "Temps restant : " + j +" j "+ h +" h "+ mn +" min "+ sec + " s ";
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
</script>

Puis la css que tu pourras modifier selon le placement dans chacun des 2 templates:

Code:

/*LE CONTENEUR*/

#Compte
{
background:#2e2e2e;
height: 60px;
padding: 10px;
width: 40%;
position: fixed;
left: 0;
top: 50px;
}
#Compte div{float:left;margin:0px 5px;line-height: 60px;color:#3bd9eb;  }
#Compte div span
{
font-size:12px;
text-align:center;
color:#e2660a;
}



Explication sur le décompte:

Ici:
Code:
var date2 = new Date ("Dec 09 00:00:00 2019");

Dec correspond à Décembre
09 le jour ou le décompte se terminera
00:00:00 , ne touche à rien car tu mentionnes que le vote démarre à minuit et se termine à minuit.
Puis l'année, donc pas besoin de t'expliquer je suppose(bon à la fin de ce mois, il faudra modifier vers 2020.

Tu peux changer le texte "Temps restant pour voter" ici:
Code:
<div class=titre>Temps restant pour voter: </div>




photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 18:43

Re Phil,

Merci beaucoup. ça correspond visuellement à ce que j'avais en tête et c'est en place

Par contre, ce serait bien d'avoir une astuce pour ne pas avoir à faire la modification de date dans les templates car ce serait à un modérateur de faire cela et il n'aura donc pas accès aux templates.  


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 18:50

Hum, tiens donc, je me suis bien douté, mais mon message était envoyé mdr .

Bref,
laisses le code html dans les 2 templates :
Code:
<div id="Compte">
</div>
et supprimes le script:
Code:
<script type="text/javascript">
var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("Dec 09 00:00:00 2019");
var sec = (date2 - date1) / 1000;
var n = 24 * 3600;
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "<div class=titre>Temps restant pour voter: </div><div class=nume><span>"+ j +"</span></div> <div class=alpha>jour(s)</div><div class=nume><span>"+ h +"</span></div> <div class=alpha>heure(s)</div><div class=nume><span> "+ mn +" </span></div><div class=alpha>minute(s)</div><div class=nume><span> "+ sec + " </span></div><div class=alpha>seconde(s)</div>";
window.status = "Temps restant : " + j +" j "+ h +" h "+ mn +" min "+ sec + " s ";
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
</script>

Ensuite créer un script en cochant sur l'index et le portail et déposes ceci:

Code:
$(function(){

var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("Dec 09 00:00:00 2019");
var sec = (date2 - date1) / 1000;
var n = 24 * 3600;
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "<div class=titre>Temps restant pour voter: </div><div class=nume><span>"+ j +"</span></div> <div class=alpha>jour(s)</div><div class=nume><span>"+ h +"</span></div> <div class=alpha>heure(s)</div><div class=nume><span> "+ mn +" </span></div><div class=alpha>minute(s)</div><div class=nume><span> "+ sec + " </span></div><div class=alpha>seconde(s)</div>";
window.status = "Temps restant : " + j +" j "+ h +" h "+ mn +" min "+ sec + " s ";
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
  
});

Et voilou .

Par contre, ce serait bien d'avoir une astuce pour ne pas avoir à faire la modification de date dans les templates car ce serait à un modérateur de faire cela et il n'aura donc pas accès aux templates.

Hum les modérateurs non pas accès à la gestion des scripts!!!!!!
photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:03

Merci Philippe pour ton suivi.

En effet Philippe, les Modérateurs n'ont pas accès aux scripts à cause de mauvaises surprises il y a un moment.

Seuls les administrateurs y ont accès et je suis le seul à "savoir" intervenir dans un script."

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 19:08

De rien Serge,
hum, ils n'ont jamais eut accès à la gestion seul les admins peuvent y accéder.


car ce serait à un modérateur de faire cela et il n'aura donc pas accès aux templates.

Dans ce cas présent, c'est toi qui devra le faire alors ?

photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:14

Bin oui, et j'en fait déjà pas mal :-)

C'est pour cela que j'étais parti sur une horloge perpétuelle démarrant à 7 jours 00:00:00 le mardi à minuit et arriverait à 0 jour 00:00:00 le lundi à minuit de façon permanente.


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 19:19

J'en doute pas Serge,
ensuite trouver une astuce qui va donner un accès aux modos pour donner une information dans les templates, c'est purement impossible Serge ..


photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:23

Dans ce cas Phil, je laisse ainsi en attendant peut-être le passage d' Arnaud.

Et pour donner une information au JS, via un bouton par exemple pour renseigner la date, c'est impossible aussi Philippe?

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 19:27

Dans ce cas Phil, je laisse ainsi en attendant peut-être le passage d' Arnaud.

C'est préférable ainsi Serge.

Et pour donner une information au JS, via un bouton par exemple pour renseigner la date, c'est impossible aussi Philippe?

Le J.S étant dans une partie visible que par les admins,
rien ne pourra être fonctionnel Serge...


photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:31

OK, Philippe je laisse ainsi.

Tu me diras si je passe en résolu ou si on attend un peu.

Dans tous les cas merci pour tout Phil.

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Lun 2 Déc 2019 - 19:34

On va laisser ton sujet ouvert le temps que notre ami Arnaud trouve un peu
de son temps libre pour te concocter le script adéquate impeccable  



Dernière édition par Milouze14 le Lun 2 Déc 2019 - 19:35, édité 1 fois
photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:35

OK. Merci.
Bonne soirée Phil.

photoclic
photoclic
Milouzien

Messagephotoclic le Lun 2 Déc 2019 - 19:50

Je viens d'essayer en mettant le script dans un JS et non pas dans le template, le décompte ne se fait plus de façon continue, mais à chaque rafraichissement de la page marreordi

photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 15:15

Bonjour Philippe,

Désolé pour le triple post.

Je crois avoir trouvé mon bonheur sur le net avec ce script que j'ai adapté à mon besoin pour rendre le décompte permanent:
Code:

<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
  <meta http-equiv="cache-control" content="public, max-age=60">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Daniel Hagnoul">
  <title>Test</title>
  <style>
 
  </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
  <script>
    'use strict';
    
    const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
      const
        ctx = new AudioContext(),
        note = ( frequency = 277.18, duration = 1.0, type = "sine"  ) => {
          let
            osc = ctx.createOscillator(),
            gainNode = ctx.createGain();
      
          osc.type = type;
          osc.connect( gainNode );
          osc.frequency.value = frequency;
          gainNode.connect( ctx.destination );
          osc.start( 0 );
          gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
          return Promise.resolve( "note" );
        };
        
      let
        timer = document.querySelector( id ),
        duration = moment.duration({
          "seconds" : seconds,
          "minutes" : minutes,
          "hours" : hours,
          "days" :days,
          "months" : months,
          "years" : years
        }),
        ObjInterval = setInterval( () => {
          duration.subtract( interval, "seconds" );
          
          if ( duration.asMilliseconds() > -1 ){
            
            timer.value = "temps restant pour voter: " +
    //duration.get( "years" ) + " an(s), "  +
    //duration.get( "months" ) + " mois, " +
              duration.get( "days" ) + " j, " +
              duration.get( "hours" ) + " h, " +
              duration.get( "minutes" ) + " mn, " +
              duration.get( "seconds" ) + " sec";
              
          } else {
            
            clearInterval( ObjInterval );
    
    // à zéro, on réinitialise le compteur universel  
   countdown( "#countdown", 1, 0, 0 ,0 , 7 );          
            
            note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
            
          }
        }, interval * 1000 );
    };
    
    document.addEventListener( 'DOMContentLoaded', ev => {
                  
    }, false );
    
    window.addEventListener( 'load', ev => {
      
      // id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
      // ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
      countdown( "#countdown", 1, 0, 0 ,0 , 7 );
      
    }, false );
    
  </script>
</head>
<body>
  <main>
 
    <output id="countdown"></output>
 
  </main>
</body>
</html>


Pourrais-tu m'aider pour avoir le même rendu que ton script (qui est en place sur ma page d'accueil via le template), et m'indiquer comment l'implanter sur mon forum.

merci pour ton aide.



Dernière édition par photoclic le Mar 3 Déc 2019 - 15:23, édité 1 fois
Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 15:20

Hello Serge,
le script n'est pas fonctionnel sur une page html heuu  

Pour l'autre script, ce seul script s'affichera sur le portail et l'index:
Code:
$(function(){
  var index=$('a[href="/search?search_id=activetopics"]').length;
  var portail=$('table[class="portal"]').length;
  if((index)||(portail))
  {
$('body').append('<div id="Compte"><script>var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("Dec 09 00:00:00 2019");
var sec = (date2 - date1) / 1000;
var n = 24 * 3600;
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "<div class=titre>Temps restant pour voter: </div><div class=nume><span>"+ j +"</span></div> <div class=alpha>jour(s)</div><div class=nume><span>"+ h +"</span></div> <div class=alpha>heure(s)</div><div class=nume><span> "+ mn +" </span></div><div class=alpha>minute(s)</div><div class=nume><span> "+ sec + " </span></div><div class=alpha>seconde(s)</div>";
window.status = "Temps restant : " + j +" j "+ h +" h "+ mn +" min "+ sec + " s ";
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();</script></div>');
  }
  });

La c.s.s associée:

Code:
/*LE CONTENEUR*/
#Compte
{
background:#2e2e2e;
height: 60px;
padding: 10px;
width: 40%;
position: fixed;
left: 0;
top: 50px;
}
#Compte div {float:left;margin:0px 5px;line-height: 60px;color:#3bd9eb;  }
/*LES CHIFFRES*/
#Compte div span
{
font-size:12px;
text-align:center;
color:#e2660a;
}
photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 15:27

Hello Phil.

Je te remets en copier coller le code de ma page html et qui fonctionne.

Code:

   <meta content="public, max-age=60" http-equiv="cache-control" />  <meta charset="utf-8" />  <meta content="width=device-width, initial-scale=1" name="viewport" />  <meta content="Daniel Hagnoul" name="author" />  <title>Test</title>  <style>
 
  </style>  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>  <script>
    'use strict';
    
    const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
      const
        ctx = new AudioContext(),
        note = ( frequency = 277.18, duration = 1.0, type = "sine"  ) => {
          let
            osc = ctx.createOscillator(),
            gainNode = ctx.createGain();
      
          osc.type = type;
          osc.connect( gainNode );
          osc.frequency.value = frequency;
          gainNode.connect( ctx.destination );
          osc.start( 0 );
          gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
          return Promise.resolve( "note" );
        };
        
      let
        timer = document.querySelector( id ),
        duration = moment.duration({
          "seconds" : seconds,
          "minutes" : minutes,
          "hours" : hours,
          "days" :days,
          "months" : months,
          "years" : years
        }),
        ObjInterval = setInterval( () => {
          duration.subtract( interval, "seconds" );
          
          if ( duration.asMilliseconds() > -1 ){
            
            timer.value = "temps restant pour voter: " +
    //duration.get( "years" ) + " an(s), "  +
    //duration.get( "months" ) + " mois, " +
              duration.get( "days" ) + " j, " +
              duration.get( "hours" ) + " h, " +
              duration.get( "minutes" ) + " mn, " +
              duration.get( "seconds" ) + " sec";
              
          } else {
            
            clearInterval( ObjInterval );
    
    // à zéro, on réinitialise le compteur universel  
   countdown( "#countdown", 1, 0, 0 ,0 , 7 );          
            
            note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
            
          }
        }, interval * 1000 );
    };
    
    document.addEventListener( 'DOMContentLoaded', ev => {
                  
    }, false );
    
    window.addEventListener( 'load', ev => {
      
      // id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
      // ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
      countdown( "#countdown", 1, 0, 0 ,0 , 7 );
      
    }, false );
    
  </script>   <main>      <output id="countdown"></output>    </main>


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 15:34

Ok merci,
j'ai édité mon message :
https://www.milouze14.com/t32386-phpbb3-compte-a-rebours-hebdomadaire-permanent#616450

Je regarde pour l'autre script, mais à priori il ne rien de plus Serge

photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 15:41

Je vais essayé ton denier code.

Le code html proposé fonctionne sans que je sois obligé de remettre la date chaque semaine phil.

Je remets le compteur à 7 jours ici:
Code:

          } else {
           
            clearInterval( ObjInterval );
   
    // à zéro, on réinitialise le compteur universel 
  countdown( "#countdown", 1, 0, 0 ,0 , 7 );         


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 15:48

Oki Serge,

alors ce script doit être fonctionnel mon ami:


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.

Cocher sur toutes les pages.


Déposer ceci:

Code:

$(function(){
  $(function(){'use strict';
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
          const
            ctx = new AudioContext(),
            note = ( frequency = 277.18, duration = 1.0, type = "sine"  ) => {
              let
                osc = ctx.createOscillator(),
                gainNode = ctx.createGain();
         
              osc.type = type;
              osc.connect( gainNode );
              osc.frequency.value = frequency;
              gainNode.connect( ctx.destination );
              osc.start( 0 );
              gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
              return Promise.resolve( "note" );
            };
           
          let
            timer = document.querySelector( id ),
            duration = moment.duration({
              "seconds" : seconds,
              "minutes" : minutes,
              "hours" : hours,
              "days" :days,
              "months" : months,
              "years" : years
            }),
            ObjInterval = setInterval( () => {
              duration.subtract( interval, "seconds" );
             
              if ( duration.asMilliseconds() > -1 ){
               
                timer.value = "Temps restant pour voter: " +
        http://duration.get( "years" ) + " an(s), "  +
        http://duration.get( "months" ) + " mois, " +
                  duration.get( "days" ) + " j, " +
                  duration.get( "hours" ) + " h, " +
                  duration.get( "minutes" ) + " mn, " +
                  duration.get( "seconds" ) + " sec";
                 
              } else {
               
                clearInterval( ObjInterval );
       
        // à zéro, on réinitialise le compteur universel 
      countdown( "#countdown", 1, 0, 0 ,0 , 7 );         
               
                note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
               
              }
            }, interval * 1000 );
        };
       
        document.addEventListener( 'DOMContentLoaded', ev => {
                     
        }, false );
       
        window.addEventListener( 'load', ev => {
         
          // id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
          // ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
          countdown( "#countdown", 1, 0, 0 ,0 , 7 );
         
        }, false );
        });
  var index=$('a[href="/search?search_id=activetopics"]').length;
  var portail=$('table[class="portal"]').length;
  if((index)||(portail))
  {
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');
$('body').append('<output id="countdown"></output>');
   
  }
  });

Penser a cliquer sur le bouton Valid


Puis la css :

Code:
/*LE CONTENEUR*/
#countdown
{
background:#2e2e2e;
text-align:center;
height:50px;
padding: 10px;
width: 40%;
position: fixed;
left: 0;
top: 50px;
line-height:50px;
color:#3bd9eb;
font-size:14px;
}


Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 15:57

Hum,
je ne suis pas adepte des règles de Forumactif concernant les doubles post Serge.
Je préfère en voir et avoir les informations de mon côté clin oeil .

Pour le script, tu peux le modifier ainsi afin qu'il soit bien actif sur le portail et l'index , le précédent injecté le script sur toutes les pages:


Code:
$(function(){
var index=$('a[href="/search?search_id=activetopics"]').length;
  var portail=$('table[class="portal"]').length;
  if((index)||(portail))
  {
    'use strict';
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
          const
            ctx = new AudioContext(),
            note = ( frequency = 277.18, duration = 1.0, type = "sine"  ) => {
              let
                osc = ctx.createOscillator(),
                gainNode = ctx.createGain();
         
              osc.type = type;
              osc.connect( gainNode );
              osc.frequency.value = frequency;
              gainNode.connect( ctx.destination );
              osc.start( 0 );
              gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
              return Promise.resolve( "note" );
            };
           
          let
            timer = document.querySelector( id ),
            duration = moment.duration({
              "seconds" : seconds,
              "minutes" : minutes,
              "hours" : hours,
              "days" :days,
              "months" : months,
              "years" : years
            }),
            ObjInterval = setInterval( () => {
              duration.subtract( interval, "seconds" );
             
              if ( duration.asMilliseconds() > -1 ){
               
                timer.value = "Temps restant pour voter: " +
        http://duration.get( "years" ) + " an(s), "  +
        http://duration.get( "months" ) + " mois, " +
                  duration.get( "days" ) + " j, " +
                  duration.get( "hours" ) + " h, " +
                  duration.get( "minutes" ) + " mn, " +
                  duration.get( "seconds" ) + " sec";
                 
              } else {
               
                clearInterval( ObjInterval );
       
        // à zéro, on réinitialise le compteur universel 
      countdown( "#countdown", 1, 0, 0 ,0 , 7 );         
               
                note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
               
              }
            }, interval * 1000 );
        };
       
        document.addEventListener( 'DOMContentLoaded', ev => {
                     
        }, false );
       
        window.addEventListener( 'load', ev => {
         
          // id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
          // ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
          countdown( "#countdown", 1, 0, 0 ,0 , 7 );
         
        }, false );
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');
$('body').append('<output id="countdown"></output>');
   
  }
  });


photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 16:04

Quelque soit le script, je n'ai qu'un grand carré noir Phil et pas l'horloge.



Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 16:18

Je ne vois rien sur ton fofo!!!!!!!

photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 16:21

Normal Phil, comme ça plantait je le teste sur mon forum test.

Tu veux que je mette le JS sur mon forum?

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 16:24

Ah ben voilà MDR ,
tu as le lien de ton fofo de test stp

photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 16:24

En fait ça plante quand je le mets sur toutes les pages et il ne se passe rien quand je coche accueil et portail.

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 16:26

C'est étonnant car sur mon fofo de test, il fonctionne bien:

https://testphpbb3.1fr1.net/

Tu as déposé quel script Serge ?

photoclic
photoclic
Milouzien

Messagephotoclic le Mar 3 Déc 2019 - 16:29

Le lien du fofo test:
http://whoroot.forumactif.com/

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Mar 3 Déc 2019 - 16:31

Essayes ce script modifié Serge,
il se peut qu'il rentrait en conflit avec un autre:
Code:
$(function(){
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');

     
  var index=$('a[href="/search?search_id=activetopics"]').length;
  var portail=$('table[class="portal"]').length;
  if((index)||(portail))
  {
    $('body').append('<output id="countdown"></output>');
    $(function(){
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
          const
            ctx = new AudioContext(),
            note = ( frequency = 277.18, duration = 1.0, type = "sine"  ) => {
              let
                osc = ctx.createOscillator(),
                gainNode = ctx.createGain();
         
              osc.type = type;
              osc.connect( gainNode );
              osc.frequency.value = frequency;
              gainNode.connect( ctx.destination );
              osc.start( 0 );
              gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
              return Promise.resolve( "note" );
            };
           
          let
            timer = document.querySelector( id ),
            duration = moment.duration({
              "seconds" : seconds,
              "minutes" : minutes,
              "hours" : hours,
              "days" :days,
              "months" : months,
              "years" : years
            }),
            ObjInterval = setInterval( () => {
              duration.subtract( interval, "seconds" );
             
              if ( duration.asMilliseconds() > -1 ){
               
                timer.value = "Temps restant pour voter: " +
        http://duration.get( "years" ) + " an(s), "  +
        http://duration.get( "months" ) + " mois, " +
                  duration.get( "days" ) + " j, " +
                  duration.get( "hours" ) + " h, " +
                  duration.get( "minutes" ) + " mn, " +
                  duration.get( "seconds" ) + " sec";
                 
              } else {
               
                clearInterval( ObjInterval );
       
        // à zéro, on réinitialise le compteur universel 
      countdown( "#countdown", 1, 0, 0 ,0 , 7 );         
               
                note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
               
              }
            }, interval * 1000 );
        };
       
        document.addEventListener( 'DOMContentLoaded', ev => {
                     
        }, false );
       
        window.addEventListener( 'load', ev => {
         
          // id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
          // ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
          countdown( "#countdown", 1, 0, 0 ,0 , 7 );
         
        }, false );
        });

   
  }
  });


Page 1 sur 2 1, 2  Suivant

Voir le sujet précédent Voir le sujet suivant Revenir en haut

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum