Pour ceux qui utilise le menu F$B33 de @noodom menu json Frame, dans le fichier html a inserer dans html Display dans la partis menu rajouter cela $(‹ body ›).trigger(‹ jeedom_page_load ›); dans cette partis du code ci-dessous :
if (frameDestination == null) {
// no frame : page redirection
planHeader_id = id;
displayPlan();
$('body').trigger('jeedom_page_load');
Le code $(‹ body ›).trigger(‹ jeedom_page_load ›); peut-être mieux le positionner.
Merci beaucoup à @olivvv59 pour son code d’origine !
Merci beaucoup à @kiboost pour son intervention et aide.
Merci à @salvitaf et @noodom pour leur exellent menu.
Merci à tous.
J’espère que j’oublie rien.
Sa serait bien que ce code sois présent dans jeedom ou une option pour le faire dessus cela serait peut être beaucoup mieux.
J’ai lu attentivement vos explications et j’ai appliqué ça sur mes titres… Au top!
J’ai voulu aller un peu plus loin en essayant de bidouiller le javascript mais sans succès, pensez vous que l’on pourrait faire un « else » qui permettrait d’appliquer un nombre pour par exemple ne fusionner que deux cellules?
au chargement de Jeedom, on lance la fonction au bout de 300ms (le temps que jeedom charge ses modules. si ca fonctionne pas bien, on peut augmenter ce délai).
Tu utilises bien dans ton exemple grid-row-start mais ça marche à moitié chez moi.
Je ne suis pas sûr de comprendre pour fusionner en vertical ou horizontal. C’est du relatif ou de l’absolu ?
Dans ton exemple, tu mets 4. Ca marche sur la première cellule pour moi. Mais si j’en ai d’autres, marche pas !
Par exemple :
grid-row-start:2;
Me permet de fusionner la 3e colonne, 3e ligne avec la 3e colonne, 4e ligne vide.
mais si je fais la même chose sur la 3e ligne de la 4e colonne avec le même code pour fusionner avec la 4e ligne, 4e colonne… comme tu le vois, ça ne marche pas.
Jeedom crée des tableaux en HTML.
Du coup, Grid-column-start et grid-row-start sont utilisé d’une manière détournée. (Si je ne dis pas de bêtises, ils sont utilisés lorsqu’on a des Flexgrid, ce qui n’est pas le cas ici).
Du coup, les chiffres utilisés correspondent aux nombres de lignes ou colonnes.
Je m’en sers seulement pour récupérer les colonnes et les lignes à fusionner dans mon script javascript.
Grid-column-start me sert à crée un colspan en HTML
Grid-row-start me sert à créer un rowspan en HTML
Grid-column-start = 1 ( équivalent colspan = 1) me dit que ma cellule ne prends qu’une colonne (par défaut, c’est le cas)
Grid-column-start = 2 … la cellule occupe 2 colonnes
Grid-column-start = 3 …
il faut donc qu’à droite de cette colonne, il y ait au minimum le nombre de colonnes qui correspond
Grid-row-start = 1 (équivalent rowspan = 1 ) …
Grid-row-start = 2 … la cellule occupe 2 lignes
… tu as compris le principe.
quand tu fais un colspan : il faut vérifier que tu as assez de colonnes à fusionner à droite. sinon ça fait un peu n’importe quoi
quand tu fais un rowspan : il faut vérifier que tu as assez de lignes à fusionner en dessous. sinon ça fait un peu n’importe quoi.
Quand tu dis que cela fonctionne pas. c’est le bouton power qui doit être fusionné, c’est ça ?
Je vais essayé de reproduire. on n’est pas à l’abris que j’ai oublié des cas de figure.
à la base, c’est un tableau de 6 colonnes sur 4 lignes, c’est ça ?
je vais regarder ça. je vais me mettre dans les mêmes conditions et regarder ce qui se passe.
Oui, d’après l’erreur, il doit manquer un test dans mon code.
tu as bien compris le fonctionnement.
par contre, dans ta dernière capture. je ne vois pas de grid-row-start en dessous de poweroff.
ou alors, il est pas visible à cause du texte avant?
EDIT : c’est bon. j’ai reproduit le message d’erreur + le problème.
je regarde ça. je te promet de trouver une réponse ce soir. je suis un peu lessivé.
Euh te stresse pas à ce soir (je crois que c’était l’inverse que tu voulais écrire).
Je n’en ai pas besoin, c’est plutôt au cas où… car je refais mon design suite au passage V4
function addColspan(Tabobjets) {
//console.log('fonction');
Tabobjets.each(function(objet) {
if ($(this).css("column-span") != undefined)
{
//console.log('column-span');
if ($(this).css("column-span") === 'all')
{
//console.log('column-span== all');
var nbtd = $(this).siblings().length + 1;
$($(this).siblings()).remove();
$(this).attr('colspan',nbtd);
}
else
{
//debugger
var nb = $(this).css("column-span");
//alert(nb);
}
}
if ($(this).css("grid-column-start") != undefined)
{
var nb = $(this).css("grid-column-start");
if ($(this).css("grid-column-start") != 'auto' && $(this).css("grid-column-start") != '')
{
for(let i=0;i<nb;i++)
{
//debugger
if ($(this).next() != undefined)
{
$($(this).next()).remove();
}
}
$(this).attr('colspan',nb);
}
}
if ($(this).css("grid-row-start") != undefined)
{
var nb = $(this).css("grid-row-start");
var idCol = $(this).attr('data-column')
if ($(this).css("grid-row-start") != 'auto' && $(this).css("grid-row-start") != '')
{
var elt = $(this).parent('tr');
for(let i=0;i<nb;i++)
{
if (elt.next() != undefined)
{
elt = elt.next();
if (elt.children('[data-column=' + idCol +']') != undefined)
{
elt.children('[data-column=' + idCol +']').remove();
}
}
}
$(this).attr('rowspan',nb);
}
}
});
};
Voila, j’ai modifié.je te garantit rien.je suis un peu dans le gaz (mais je n’ai pas pu m’empêcher de regarder).
Dit moi, ce que tu en penses.
Si on arrive à une solution qui marche.
Je vais demander à un des admins de Youdom pour mettre à jour article (ou écrire un nouvel article).
cela a l’air d’intéresser pas mal de monde.
autant en faire profiter le plus grand nombre.
Par contre, perso, j’ai des soucis en cas de refresh de virtuels, les colonnes peuvent sauter à l’affichage et il me faut forcer un refresh de la page pour avoir de nouveau le tableau bien à jour.
Une image valant plus de mille discours.
La page se charge j’ai ça (parfait) :
Au bout de quelques minutes les virtuels dedans bougeant, ça saute… et pas d’autres solutions que de faire un refresh à la main ou de manière régulière (pas top) de toute la page. (désolé c’est un impr écran d’une vidéo que j’ai faite pour Djul sur le fil JPI).
Un grand merci à toi pour ton aide! A voir sur l’utilisation mais cela fonctionne! Et je ne serais pas du tout allé sur cette logique de code donc j’y serais encore à cette heure-ci lol