[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - Version imprimable

+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Modules, Tags (https://forum.cmsmadesimple.fr/forum-14.html)
+--- Sujet : [Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois (/thread-3321.html)

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - 7im3r - 15/10/2014

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.10
#~ Url du site : ours-blanc-vars.fr
#~ Hébergeur / Soft : ovh
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.11.11
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.5
#~ MenuManager: 1.8.6
#~ MicroTiny: 1.2.7
#~ ModuleManager: 1.5.8
#~ News: 2.14.4
#~ Search: 1.7.11
#~ ThemeManager: 1.1.8
#~ AdvancedContent: 0.9.4.3
#~ CGSimpleSmarty: 1.7.4
#~ CGExtensions: 1.42.2
#~ CGCalendar: 1.14.3
#~ Config Information:
#~ php_memory_limit:
#~ process_whole_template:
#~ max_upload_size: 64000000
#~ url_rewriting: mod_rewrite
#~ page_extension:
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale: fr_FR.utf-8
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.4.30
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 2048
#~ E_DEPRECATED: 8192
#~ memory_limit: 512M
#~ max_execution_time: 300
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 64M
#~ upload_max_filesize: 64M
#~ session_save_path: /tmp (0700)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: fpm-fcgi
#~ Server Db Type: MySQL (mysqli)
#~ Server Db Version: 5.1.73
#~ Server Db Grants: Impossible de trouver un privilège "GRANT ALL". Cela peut signifier que vous pourriez avoir des problèmes pour installer ou retirer des modules, ou encore l 'ajout et la suppression d'éléments, y compris les pages.
#~ Server Time Diff: Aucune différence de date du système de fichiers trouvées
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour,


J'ai un site en Pré-prod sur lequel j'ai un souci avec le module CGCalendar 1.14.3

Lorsque je navigue entre les mois, un nombre exponentiel de requêtes est généré à chaque click successif, entrainant un fort ralentissement voir même une quasi impossibilité de naviguer entre les mois au bout de 10 clicks.

Dans la partie "console" de FireBug, on se rend bien compte du problème.

J'ai essayé pas mal de forums sans trouver de conversation sur ce point, et mon client me presse de livrer. Je me décide donc à faire ma première demande d'aide concernant CMSMS


Merci !

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 15/10/2014

ha ça oui, il y a clairement un soucis :lol:

chaque clic double les requêtes faites précédemment. Donc 1 requêtes ajax, suivit de 2, 4, 8, 16 ....

Pourquoi il le fait est une très bonne question o_O j'aurais été tenté de dire que le DOM est mal épuré dans le navigateur (même si firebug ne le montre pas) et que chaque clic sur les object de class calendar-nav se fait non plus sur 1 élément mais sur 2 et ainsi de suite..

Quick solution à tester : corriger ton code HTML avant tout puis revoir le code JS pour le faire pas à pas et voir si avant même le load Ajax le soucis se présente. Si le soucis ne se présente pas (met un alert('plop') ) avant le load Ajax tu peux tenter toujours en javascript de supprimer avant le load le contenu afin de t'assurer d'avoir un DOM carré

en gros passer de $('#cal-calendar').load(url) à $('#cal-calendar').parent().remove();$('#cal-calendar').load(url) ou un truc du genre

toujours pour tester évidement

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 15/10/2014

Autre point : tu déclare de l'HTML4

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >

et tu utilise de l'HTML5

met ton doctype à jour impérativement ! (google pour cette aide)

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 15/10/2014

un pote vient de se pencher sur ton soucis et viens de me montrer l'erreur (merci simon)

remplacer $('#cal-calendar').load(url) par

$.get( url, function( data ) {
$( '#cal-calendar' ).html( data );
});

idem pour toutes les occurence de load

Le soucis est que load ne remplace pas le code, il l'ajoute le retour ajax au contenu existant et met ce dernier en hidden ce qui provoque donc une multiplication des tables ayant l'id cal-calendar ce qui multiplie d'autant les requêtes par la suite.


Ca n'empêche que tu dois corriger ton code et mettre le bon doctype !

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - 7im3r - 15/10/2014

Merci de se pencher si rapidement sur mon cas.

Bon j'ai corrigé mon doctype et certaines erreurs.

Par contre j'ai toujours le même soucis j'ai donc du mal comprendre la solution.

J'avais comme fonctions de gabarit :

Citation :{if !isset($smarty.get.nojs)}
<script type="text/javascript">{jsmin}
// the jsmin plugin is included with CGExtensions.
if( typeof jQuery != 'undefined' ) {
$(document).ready(function(){
$(document).on('click','a.calendar-nav',function(ev){
// allow paginating through months via ajax.
var url = $(this).attr('href').replace(/amp;/g,'')+'nojs=1&showtemplate=false';
$('#cal-calendar').load(url);
ev.preventDefault();
});

if( jQuery().dialog ) {
$(document).on('click','a.calendar-daylist',function(ev){
// demonstrate viewing a day list in a popup dialog
// and mixing smarty and javascript code.
// uses jquery ui dialog... but could just as easily use fancybox etc.
// you could add parameters here for changing the template from the default, etc, or even filter by category.
ev.preventDefault();
var day = new Date( $(this).data('day') * 1000 );
var m = day.getMonth()+1;
var d = day.getDate();
var y = day.getFullYear();
var url = '{module_action_link module=CGCalendar display=list day=DDDD month=MMMM year=YYYY jsfriendly=1}&showtemplate=false';
url = url.replace('MMMM',m).replace('DDDD',d).replace('YYYY',y);
$('#cal-dayview').load(url,function(data){
$('#cal-dayview').dialog({
title: '{$mod->Lang('dayview')}'
})
});
});
}
})
} // jquery test
{/jsmin}</script>
{/if}

{strip}
<div style="display: none;">{* a simple wrapper *}
<div id="cal-dayview"></div>
</div>
<table class="calendar" id="cal-calendar">
<caption class="calendar-month">
<span class="calendar-prev"><a class="calendar-nav" href="{$navigation.prev}">&laquo;</a></span>
{$date|date_format:'%b %Y'}
<span class="calendar-next"><a class="calendar-nav" href="{$navigation.next}">&raquo;</a></span>
</caption>
<tbody><tr>
{foreach from=$day_names item=day key=key}
<th class="cal-dayhdr" abbr="{$day}">{$day_short_names[$key]}</th>
{/foreach}</tr>

<tr>
{* initial empty days *}
{if $first_of_month_weekday_number > 0}
<td colspan="{$first_of_month_weekday_number}">&nbsp;</td>
{/if}

{* iterate over the days of this month *}
{assign var=weekday value=$first_of_month_weekday_number}
{foreach from=$days item=day key=key}
{if $weekday == 7}
{assign var=weekday value=0}
</tr>
<tr>
{/if}
<td {if isset($day.class)}class="{$day.class} cal-day"{/if}>
{if isset($day.events.0)}<a class="calendar-daylist" data-day="{$day.date}" href="{$day.ni_url}">{$key}</a>{* by default use the non inline (replace content tag) version of the URL *}
<ul>
{foreach from=$day.events item=event}
<li>
{* some simple smarty logic to use the foreground and background colors assigned to an event *}
{$style=''}{if $event.bgcolor}{$style="style=\"color: {$event.fgcolor}; background-color: {$event.bgcolor}\""}{/if}
<a class="calendar-event" href="{$event.url}" {$style}>{$event.event_title|summarize:20}</a></li>
{/foreach}
</ul>
{else}{$key}{/if}
</td>
{math assign=weekday equation="x + 1" x=$weekday}
{/foreach}

{* remaining empty days *}
{if $weekday != 7}
<td colspan="{math equation="7-x" x=$weekday}">&nbsp;</td>
{/if}


</tr>
</tbody></table>

{/strip}

que j'ai donc changé en

Citation :{if !isset($smarty.get.nojs)}
<script type="text/javascript">{jsmin}
// the jsmin plugin is included with CGExtensions.
if( typeof jQuery != 'undefined' ) {
$(document).ready(function(){
$(document).on('click','a.calendar-nav',function(ev){
// allow paginating through months via ajax.
var url = $(this).attr('href').replace(/amp;/g,'')+'nojs=1&showtemplate=false';
///
$.get( url, function( data ) {
$( '#cal-calendar' ).html( data );
});
///
ev.preventDefault();
});

if( jQuery().dialog ) {
$(document).on('click','a.calendar-daylist',function(ev){
// demonstrate viewing a day list in a popup dialog
// and mixing smarty and javascript code.
// uses jquery ui dialog... but could just as easily use fancybox etc.
// you could add parameters here for changing the template from the default, etc, or even filter by category.
ev.preventDefault();
var day = new Date( $(this).data('day') * 1000 );
var m = day.getMonth()+1;
var d = day.getDate();
var y = day.getFullYear();
var url = '{module_action_link module=CGCalendar display=list day=DDDD month=MMMM year=YYYY jsfriendly=1}&showtemplate=false';
url = url.replace('MMMM',m).replace('DDDD',d).replace('YYYY',y);
$('#cal-dayview').get(url,function(data){
$('#cal-dayview').dialog({
title: '{$mod->Lang('dayview')}'
})
});
});
}
})
} // jquery test
{/jsmin}</script>
{/if}

{strip}
<div style="display: none;">{* a simple wrapper *}
<div id="cal-dayview"></div>
</div>
<table class="calendar" id="cal-calendar">
<caption class="calendar-month">
<span class="calendar-prev"><a class="calendar-nav" href="{$navigation.prev}">&laquo;</a></span>
{$date|date_format:'%b %Y'}
<span class="calendar-next"><a class="calendar-nav" href="{$navigation.next}">&raquo;</a></span>
</caption>
<tbody><tr>
{foreach from=$day_names item=day key=key}
<th class="cal-dayhdr" abbr="{$day}">{$day_short_names[$key]}</th>
{/foreach}</tr>

<tr>
{* initial empty days *}
{if $first_of_month_weekday_number > 0}
<td colspan="{$first_of_month_weekday_number}">&nbsp;</td>
{/if}

{* iterate over the days of this month *}
{assign var=weekday value=$first_of_month_weekday_number}
{foreach from=$days item=day key=key}
{if $weekday == 7}
{assign var=weekday value=0}
</tr>
<tr>
{/if}
<td {if isset($day.class)}class="{$day.class} cal-day"{/if}>
{if isset($day.events.0)}<a class="calendar-daylist" data-day="{$day.date}" href="{$day.ni_url}">{$key}</a>{* by default use the non inline (replace content tag) version of the URL *}
<ul>
{foreach from=$day.events item=event}
<li>
{* some simple smarty logic to use the foreground and background colors assigned to an event *}
{$style=''}{if $event.bgcolor}{$style="style=\"color: {$event.fgcolor}; background-color: {$event.bgcolor}\""}{/if}
<a class="calendar-event" href="{$event.url}" {$style}>{$event.event_title|summarize:20}</a></li>
{/foreach}
</ul>
{else}{$key}{/if}
</td>
{math assign=weekday equation="x + 1" x=$weekday}
{/foreach}

{* remaining empty days *}
{if $weekday != 7}
<td colspan="{math equation="7-x" x=$weekday}">&nbsp;</td>
{/if}


</tr>
</tbody></table>

{/strip}

Mais j'ai tout de même le même problème.

J'ai du mal comprendre quelque chose. D'ailleurs j'ai du mal à comprendre pourquoi je suis le seul à avoir ce souci mais bon.

Je suis nul en Ajax, et je n'ai que des notion de JS / JQuery ce qui peut expliquer mon incompréhension.

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 16/10/2014

Effectivement ça ne corrige pas le soucis de duplicate de requêtes

Sans être certain que cela soit lié, tu as toujours des erreurs HTML à corriger, notamment des balises fermées qui n'ont pas leur équivalence ouverte. Il te faut absolument TOUT corriger pour écarter définitivement cette piste aussi mince soit elle.

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 16/10/2014

Autre point à corriger qui pourrait expliquer ton soucis : remplacer


par


remplacer


par


remplacer


par



Ce qu'il se passe certainement c'est que l'appel Ajax remonte déjà une balise <table> ce qui fait que tu te retrouve dans ton code avec une imbrication de <table1><table2><table3></table3></table2></table1>.

Mes modifications devraient corriger ce point

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - 7im3r - 16/10/2014

Bonjour,

Merci pour ton implication à propos de mon problème.

Bon j'ai compris mon problème. Je n'ai tout simplement pas lu la doc et j'avais inséré directement la balise du module dans mon gabarit au lieu de l'insérer dans mon {content} ...

Toutefois, il est possible de faire fonctionner le module de cette façon, mais en désactivant JQuery et en jonglant avec le CSS car deux éléments <table> sont alors générés. Je ne pense pas que ce soit très utile mais bon.

En tout cas je suis vraiment désolé de t'avoir fait perdre du temps, le module fonctionne à merveille à présent.

Je passe mon sujet en "résolu", n'hésite pas à tout bonnement le supprimer si tu pense qu'il est inutile.

---

[Résolu] CG Calendar 1.14.3 : Bug lié à la navigation entre les mois - bess - 16/10/2014

normalement ma correction devrait également résoudre, donc ce n'est pas du temps de perdu

bonne continuation

---