Afficher le contenu du calendrier (calendrier + événements) dans l'Annonce du forum

[Tomneo]

Rappel du premier message :

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://clansnr.forumactif.org

Description du problème

(Après que mon sujet soit supprimé dans la corbeille (6jours après mon dernier message de up c'est un peu rapide mais bon soit je ne voulais pas non plus que l'on croit que je spam d'où mon attente), je remets encore mon sujet au même endroit en espérant que quelqu'un puisse enfin m'aider ...)

Bonjour tout le monde, j’espère que vous pourrez m’aider, je vais essayer d’être le plus clair possible dans ma demande.

Je suis donc admin du forum ci-dessous :
http://clansnr.forumactif.org/

C’est un forum sur un jeu de téléphone mobile, qui a toujours des événements en cours quasiment tous les jours. Et je souhaiterais pouvoir afficher dans l’Annonce du forum donc en haut de page, le contenu de l’agenda géré par le forum sur le lien suivant :

http://clansnr.forumactif.org/calendar_scheduler.forum

Si c’était possible, il faudrait récupérer les infos qui sont affichées dans les tables à savoir : le calendrier, les événements, et les anniversaires pourquoi pas (facultatif), de façon à afficher que ça en haut de page et qu’on puisse voir directement ce qui est en cours dans le jeu.

En utilisant pourquoi pas un script comme iframe ou tout autre chose tant que ça marche, je suis confiant !

N’ayant pas assez de connaissances dans ce domaine, je n’ai pas réussi à trouver le code d’origine de l’affichage de la page calendar_scheduler.forum du coup je n'arrive pas à afficher que le calendrier et les événements. Il suffirait juste que je sache ce code pour résoudre mon problème mais je sais pas si vous pouvez me le donner malheureusement …

J’ai essayé en mettant iframe src="calendar_scheduler.forum" etc… cela affiche la page entière avec le titre du forum, les colonnes à gauche et à droite etc donc ça ne marche pas comme je voudrais …

Quelqu'un qui est bon en code html, ou en script qui connait bien les codes sources pourrait ’il m'aider ?

Il doit surement y avoir une possibilité de récupérer le corps du contenu du calendar_scheduler.forum ou de créer un code qui permettrait de l'utiliser ?

Afin que je puisse l'utiliser pour afficher sur ma page du forum ...

Merci énormément d’avance, je reste à votre disposition si jamais vous avez des questions, merci !

[Self]

Pour mettre en avant la date d'aujourd'hui remplacez le Javascript par :

Code:

jQuery(function($){
   $('#page-body').prepend('<div class="calendar" style="display:none;"></div>');
   var d = new Date(), j = d.getDate();
   $('.calendar').load('/calendar table.forumline:nth-child(4)', function(){
      $('span.genmed').each(function(){ var today = $(this).text().match(/\d{2}/); if(today == j) $(this).addClass('thisweek'); });
      var h = $('.thisweek').closest('table[height]').parents('tr').html(), day = $('.thisweek').closest('table[height]').parents('td').html();
      $('.calendar').html('<table><tr></tr><td colspan="7">'+day+'</td><tr>'+h+'</tr></table>').fadeIn();
      $('a[onmouseover]').on('mouseover', function(){ $('body>div').css('z-index', '10000') });
   });
});

Pour changer la couleur de fond des tableaux utilisez le code CSS suivant :

Code:

.calendar table[height] *{ background-color : #fff; }

[Tomneo]

Ah, j'ai un problème avec les membres du forum qui utilisent la version mobile du forum, du coup le tableau devient énorme, et cache une partie des messages sur la version mobile qui est déjà assez petite...

Est-il possible de désactiver le tableau lorsque la version mobile du forum est utilisée ?

Merci d'avance !

EDIT 16h56 : Toutes mes excuses je n'avais pas vu la page 2 du sujet du coup je n'avais pas vu votre message, et donc parfait pour les codes, je vais proposer à mes membres les deux versions 7jours/7jours+jourJ au dessus, je mettrais la version qu'ils préfèrent, merci beaucoup !

[Self]

Effectivement c'est pas top sur la version mobile.
Changez le Javascript par :

Code:

jQuery(function($){
   if(typeof _userdata.page_desktop === "undefined"){
      $('#page-body').prepend('<div class="calendar" style="display:none;"></div>');
      var d = new Date(), j = d.getDate();
      $('.calendar').load('/calendar table.forumline:nth-child(4)', function(){
         $('span.genmed').each(function(){ var today = $(this).text().match(/\d{2}/); if(today == j) $(this).addClass('thisweek'); });
         var h = $('.thisweek').closest('table[height]').parents('tr').html(), day = $('.thisweek').closest('table[height]').parents('td').html();
         $('.calendar').html('<table><tr></tr><td colspan="7">'+day+'</td><tr>'+h+'</tr></table>').fadeIn();
         $('a[onmouseover]').on('mouseover', function(){ $('body>div').css('z-index', '10000') });
      });
   }
});

[Tomneo]

Merci pour le code, je l'ai mis sur le forum afin que les membres qui ont le problème me disent si c'est bon ou pas

[Tomneo]

Vraiment parfait, il n'y a plus aucun soucis ! Splendide !

Par contre j'ai des membres un peu pointilleux voir un peu perfectionnistes lol et ils me demandent si ce serait plutôt possible au lieu de faire sur 2 lignes telles que :

Jour J
--------------------------------------------------
Lundi, Mardi, ..., et Dimanche de la semaine en cours

Il y ait plutôt sur une ligne :

Jour J, J+1, J+2, ..., J+6

Soit une base de 7 jours comme une semaine mais d'avoir toujours les 6 jours suivants pour avoir un visu des futurs événements de façon plus large ?

Cela sera mon ultime demande ! promis juré lol
Merci d'avance encore une fois

[Tomneo]

J’ai essayé de comprendre le code que vous m’aviez donné afin d’essayer de le modifier et de faire une configuration de 7 jours dont le jour actuel est dans la première case du tableau et les 6 jours suivants dans les 6 autres cases du tableau sur une seule ligne comme le « schéma » ci-dessous :

---------------------------------
|Jour J|J+1|J+2|J+3|J+4|J+5|J+6|
---------------------------------

Mais à vrai dire, je n’ai rien compris à l’écriture du script donc j’espère que vous pourrez m’aider une dernière fois
Si jamais on s’écrit pas avant ce soir, alors je vous souhaite un bon weekend en avance !

Merci beaucoup

[Tomneo]

Je viens de voir un problème dans le code donné, il s'avère que le jour J est en fait celui de demain ?! bizarre que je ne l'ai pas remarqué plus tôt, cela m'avait semblé être bon avant ... Le problème serait peut-être réglé en ayant l'affichage Jour J, J+1 à J+6.

[Tomneo]

Bizarre, je n'ai plus le soucis du jour décalé ... je regarderais régulièrement si cela se reproduit

J'espère que vous pourrez m'aider une dernière fois SeLfde4Th7 pour la semaine partant du Jour J, je pense qu'avec votre dernier code je pourrais essayer de l'adapter par la suite si les membres changent d'avis sur l'affichage.

Merci d'avance, et enfin après ça je vous laisserais tranquille, ou tout du moins quelqu'un d'autre pourra vous embêter lol

[Self]

Bonsoir Tommeo ,

Je ne pense pas pouvoir faire ceci, premièrement parce que le script serait à mon avis beaucoup plus lourd et deuxièmement dans les derniers jours du mois il faudrait charger deux pages de calendrier pour pouvoir afficher ce que vous voulez.

[Tomneo]

Ok, ça marche, je vous fais confiance donc ok on va pas essayer de faire ça, l’affichage de la semaine en cours sera suffisant. Je vais pouvoir clore le sujet car vous m’avez amplement aidé comme il faut, c’est vraiment génial ce que vous m’avez donné. Cela donne déjà quelque chose de très sympathique

Juste un petit détail, car en fonction des semaines, on a différents événements plus ou moins long en nombre de caractères, serait ’il possible qu’en fonction de la longueur de la désignation de l’événement, si le titre dépasse un certain nombre de caractères, il est automatiquement abrégé avec des « … » à la fin afin que le tableau ne se retrouve pas à avoir 7 colonnes de 100px de large qui ferait doubler la largeur du forum ?

Par exemple :

Si le nom est :
[EVENT] aaaaaaaaaaaaaaaaaaaaaaaa c’est ok,

Mais si on a :
[EVENT] bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb.

Il serait réduit en :
[EVENT] bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb …

Automatiquement si le titre de l’événement dépasse 40 caractères (par exemple).

Est-ce que cela serait faisable de faire ça ? Merci !

[Self]

Bonjour,

Essayez comme ceci :

Code:

jQuery(function($){
   if(typeof _userdata.page_desktop === "undefined"){
      $('#page-body').prepend('<div class="calendar" style="display:none;"></div>');
      var d = new Date(), j = d.getDate();
      $('.calendar').load('/calendar table.forumline:nth-child(4)', function(){
         $('span.genmed').each(function(){ var today = $(this).text().match(/\d{2}/); if(today == j) $(this).addClass('thisweek'); });
         var h = $('.thisweek').closest('table[height]').parents('tr').html(), day = $('.thisweek').closest('table[height]').parents('td').html();
         $('.calendar').html('<table><tr></tr><td colspan="7">'+day+'</td><tr>'+h+'</tr></table>').fadeIn();
         $('a[onmouseover]').on('mouseover', function(){ $('body>div').css('z-index', '10000') });
         $('table[height]').each(function(){
            var $this = $(this), link = $this.find('a.genmed').text(), short_link = link.substr(0, 12)+'...';
            $this.text(short_link);
         });
      });
   }
});

[Tomneo]

Merci, j'ai appliqué le changement, le résultat change totalement le tableau, les jours ont disparu, il n'y a plus les anniversaires, plus de lignes ni colonnes, il doit y avoir un problème quelque part, je laisse actif le script pour que vous puissiez voir vous même :

http://clansnr.forumactif.org/

[Self]

Ce code devrait régler le problème :

Code:

jQuery(function($){
   if(typeof _userdata.page_desktop === "undefined"){
      $('#page-body').prepend('<div class="calendar" style="display:none;"></div>');
      var d = new Date(), j = d.getDate();
      $('.calendar').load('/calendar table.forumline:nth-child(4)', function(){
         $('span.genmed').each(function(){ var today = $(this).text().match(/\d{2}/); if(today == j) $(this).addClass('thisweek'); });
         var h = $('.thisweek').closest('table[height]').parents('tr').html(), day = $('.thisweek').closest('table[height]').parents('td').html();
         $('.calendar').html('<table><tr></tr><td colspan="7">'+day+'</td><tr>'+h+'</tr></table>').fadeIn();
         $('a[onmouseover]').on('mouseover', function(){ $('body>div').css('z-index', '10000') });
         $('table[height]').each(function(){
            var $this = $(this), link = $this.find('a.genmed').text(), short_link = link.substr(0, 25)+'...';
            $this.find('a.genmed').text(short_link);
         });
      });
   }
});

[Tomneo]

Oui j'aime bien quan vous écrivez cela devrait régler le problème héhé !

Effectivement le tableau remarche quasiment parfaitement, à part un petit détail au niveau des anniversaires, il met bien l'image du petit bonhomme mais au lieu de marquer le nom du membre il marque la désignation de l'événement qui se trouve le même jour. Cela peut-il être comme avant pour l'anniversaire ?

Au niveau de la réduction du titre des événements, est-ce possible que pour la première ligne du Jour J, que les noms ne soient pas réduit juste ici ? (comme il a la ligne entière pour être affiché) Si ce n'est pas possible alors pas de soucis on laissera comme ça

Merci

[Self]

Peut-être comme ceci ? :

Code:

jQuery(function($){
   if(typeof _userdata.page_desktop === "undefined"){
      $('#page-body').prepend('<div class="calendar" style="display:none;"></div>');
      var d = new Date(), j = d.getDate();
      $('.calendar').load('/calendar table.forumline:nth-child(4)', function(){
         $('span.genmed').each(function(){ var today = $(this).text().match(/\d{2}/); if(today == j) $(this).addClass('thisweek'); });
         var h = $('.thisweek').closest('table[height]').parents('tr').html(), day = $('.thisweek').closest('table[height]').parents('td').html();
         $('.calendar').html('<table><tr><td colspan="7" class="day">'+day+'</td></tr><tr class="week">'+h+'</tr></table>').fadeIn();
         $('a[onmouseover]').on('mouseover', function(){ $('body>div').css('z-index', '10000') });
         $('.week table[height] a.genmed').each(function(){
            var $this = $(this), link = $this.text(), not_anniv = $this.prev('img').hasClass('sprite-tiny_topic'), short_link = link.substr(0, 25)+'...';
            if(not_anniv) $this.text(short_link);
         });
      });
   }
});

[Tomneo]

Mais vous faîtes comment pour être aussi bon ? lol vous êtes trop fort ! Tout est bon, désignation réduite sur les jours de la semaine, désignation longue sur le Jour J de la première ligne, les anniv sont de-nouveaux bons, BREF Top !
Merci infiniment pour le travail fourni, Je ne vois pas d'autres choses à retoucher, c'est parfait, merci encore