Connexion

Récupérer mon mot de passe

Derniers sujets*
» [PHPBB2]Séparer les annonces globales/annonces/notes
par Morane Aujourd'hui à 14:03

» [AWESOMEBB] Afficher la barre de navigation horizontalement
par Bigalex Aujourd'hui à 8:29

» [MODERNBB] Séparer les annonces globales/annonces/notes
par Milouze14 Hier à 8:02

» [AWESOMEBB]Séparer les annonces globales/annonces/notes
par Milouze14 Hier à 7:45

» [PHPBB3]Séparer les annonces globales/annonces/notes
par Milouze14 Hier à 7:25

» [PHPBB3] Afficher l'avatar dans une citation nommée
par Roza Lun 19 Oct 2020 - 17:18

» [TOUTES VERSIONS] Modifier les textes de la barre de navigation
par Morane Lun 19 Oct 2020 - 13:11

» [PHPBB3] Remplacer le mot Invité
par Milouze14 Ven 16 Oct 2020 - 17:36

» [PHPBB3]Supprimer le tag "Re" sur les messages
par Roza Ven 16 Oct 2020 - 14:54

» [TOUTES VERSIONS] Auto suggestion des membres sur les tags
par McLeod Jeu 15 Oct 2020 - 16:46

» [PHPBB3] Remplacer les backgrounds image natifs par des images
par Roza Dim 11 Oct 2020 - 10:54

» [PHPBB3] Rendre la cellule des sujets cliquable
par Roza Sam 10 Oct 2020 - 17:43

» [TOUTES VERSIONS] Faire clignoter le chiffre ou le nombre de notification(s) dans la toolbar
par Roza Mar 6 Oct 2020 - 0:50

» [TOUTES VERSIONS]Afficher la date de la dernière visite au survol du Pseudo seulement pour les admins
par Roza Mar 6 Oct 2020 - 0:41

» [TOUTES VERSIONS]Afficher de belles infobulles Tooltipster
par Roza Mar 6 Oct 2020 - 0:21

» [TOUTES VERSIONS] Une page html connexion/deconnexion...
par Roza Dim 4 Oct 2020 - 17:36

» [TOUTES VERSIONS] Afficher le nombre de script(s) disponible dans le welcome(Toolbar)
par Roza Dim 4 Oct 2020 - 11:12

» [PHPBB2] Supprimer directement un message sans retour
par Chéryl Dim 4 Oct 2020 - 9:59

» [TOUTES VERSIONS] Changer l'apparence du Panneau d'administration
par Milouze14 Sam 3 Oct 2020 - 16:37

» Afficher le nombre de script(s) disponible(s) dans le volet du profil
par Milouze14 Sam 26 Sep 2020 - 6:44

Les statistiques du forum
Nous avons 444 membres enregistrés

L'utilisateur enregistré le plus récent est DianaArtemis

Nos membres ont posté un total de 21206 messages dans 1092 sujets

[BESTOF] [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

avatar
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.






Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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.

avatar
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




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
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 .






Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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>




avatar
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!!!!!!
avatar
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 ?



Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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 ..




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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...




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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


Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
photoclic
Milouzien

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

OK. Merci.
Bonne soirée Phil.

avatar
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

avatar
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;
}
avatar
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



Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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;
}




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
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>');
   
  }
  });




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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!!!!!!!



Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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



Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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 ?



Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
avatar
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 );
        });

   
  }
  });




Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).

Page 1 sur 2 1, 2  Suivant

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

Sujets similaires internes ( 0 )
Aucun sujet

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