Uncaught TypeError: Cannot read properties of null (reading ‹ src ›)
Bonjour,
C’est un peu léger non 
ne pensez vous pas que cela manque quelque peu d’information et surtout le bon tag ?
Comment nous aider à vous aider - ou Comment poser une bonne question?
1 « J'aime »
Helloo,
En effet, je suis pas contre plus d’infos… 
nom du menu (lien github ou thread community), capture de l’erreur, ligne de l 'erreur, etc…
En effet 
Effectivement, c’est lege.
en faite quand je veux accedé à un deseign à travers le menu noodom; jai cette erreur
Uncaught TypeError: Cannot read properties of null (reading ‹ src ›) dans le fichier menuCreation.js a la ligne 61.
voila
voici le code:
$(document).ready(function () {
// display loading message
var menuGoo = $('.menu-goo');
var menuPlanId = menuGoo.closest('.text-widget').data('plan_id');
jeedom.plan.byId ({
id: menuPlanId,
error: function(error) {
$('#div_alert').showAlert({message: error.message, level: 'danger'})
},
success: function(data) {
let menu_bg = hexToRgb(data.plan.configuration.options.menu_bg);
$(':root').css('--menu_bg', menu_bg.r+','+menu_bg.g+','+menu_bg.b);
autoReduceMenu = (data.plan.configuration.options.auto_reduce == 1) ? true : false;
let navSubmenu = $('#nav-container-animation');
let cssMenuItem = 'menu-item-h';
if (parseFloat(data.plan.display.height) > parseFloat(data.plan.display.width)) {
cssMenuItem = 'menu-item-v';
}
// get buttons parameters
let buttons = data.plan.configuration.parameters.map(function (button) {
return '<a href="#" class="menu-item ' + cssMenuItem + '" id="' + button.link + '"'
+ ' onClick="gotoPlan(this.id)">'
+ '<div class="imagette">'
+ button.icon
+ '</div>';
+ '</a>';
});
if (buttons.length) {
let listButtons = buttons.join(' ');
menuGoo.append(listButtons);
}
// set focus on first button
document.getElementsByClassName('menu-item')[0].click();
}
});
});
// create url destination
function getUrlDestination(urlParam) {
if (isNaN(urlParam)) {
return urlParam;
} else {
return 'index.php?v=d&p=plan&plan_id=' + urlParam + '&fullscreen=1';
}
}
// menu redirection
function gotoPlan(id) {
let urlDestination = getUrlDestination(id);
// get frame in htmlDisplay equipment
let frameDestination = document.getElementById('menuFrame');
// selection
$('.menu-item').removeClass('selected');
$('#' + id).addClass('selected');
if (frameDestination.src.split('?')[1] != urlDestination.split('?')[1]) {
frameDestination.src = urlDestination;
}
// auto reduce menu
if (autoReduceMenu) {
document.getElementById('menu-open').checked = false;
}
}Salut,
J’ai créé pas mal de menus, tu peux préciser sur lequel tu as le problème ? (Lien github par exemple ou nom) ?
Merci.
1 « J'aime »
Après une recherche sur mon github, ça semble être le menu VerticalTom (jeedom_menus/menuVerticalTom at master · noodom/jeedom_menus · GitHub). C’est bien ça ?
Tu peux envoyer ton fichier perso.json ?
Tu l’as personnalisé avec tes boutons (liens vers tes écrans de contenu) ?
Tous les Ids définis dans chaque paramètre link sont des ids d’écrans de design que tu as créé ?
Tombutton//perso.css
:root {
--menu_bg: 45, 45, 45;
}
.menu-goo {
-webkit-filter: url("#shadowed-goo");
filter: url("#shadowed-goo");
}
.menu-goo .menu-item,
.menu-goo .menu-open-button {
background: rgb(var(--menu_bg));
border-radius: 50%;
width: 70px;
height: 70px;
position: absolute;
margin: 13px 0 0 13px;
color: white !important;
font-size:40px;
text-align: center;
line-height: 70px;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
transition: -webkit-transform ease-out 200ms;
transition: transform ease-out 200ms;
transition: transform ease-out 200ms, -webkit-transform ease-out 200ms;
}
.menu-goo .menu-open {
display: none;
}
.menu-goo .hamburger {
width: 25px;
height: 3px;
background: white;
display: block;
position: absolute;
transition: -webkit-transform 200ms;
transition: transform 200ms;
transition: transform 200ms, -webkit-transform 200ms;
}
.menu-goo .hamburger-1 {
-webkit-transform: translate3d(0, -8px, 0);
transform: translate3d(0, -8px, 0);
}
.menu-goo .hamburger-2 {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.menu-goo .hamburger-3 {
-webkit-transform: translate3d(0, 8px, 0);
transform: translate3d(0, 8px, 0);
}
.menu-goo .menu-open:checked + .menu-open-button .hamburger-1 {
-webkit-transform: translate3d(0, 0, 0) rotate(45deg);
transform: translate3d(0, 0, 0) rotate(45deg);
}
.menu-goo .menu-open:checked + .menu-open-button .hamburger-2 {
-webkit-transform: translate3d(0, 0, 0) scale(0.1, 1);
transform: translate3d(0, 0, 0) scale(0.1, 1);
}
.menu-goo .menu-open:checked + .menu-open-button .hamburger-3 {
-webkit-transform: translate3d(0, 0, 0) rotate(-45deg);
transform: translate3d(0, 0, 0) rotate(-45deg);
}
/*
.menu-goo .menu {
position: absolute;
left: 50%;
margin-left: -80px;
padding-top: 20px;
padding-left: 80px;
width: 650px;
height: 150px;
box-sizing: border-box;
font-size: 20px;
text-align: left;
}
*/
.menu-goo .menu-item:hover {
background: #92cd00 !important;
/*color: #262626 !important;*/
}
.selected {
background: #92cd00 !important;
/*color: #262626 !important;*/
}
.menu-goo .menu-item:nth-child(3) {
transition-duration: 180ms;
}
.menu-goo .menu-item:nth-child(4) {
transition-duration: 180ms;
}
.menu-goo .menu-item:nth-child(5) {
transition-duration: 180ms;
}
.menu-goo .menu-item:nth-child(6) {
transition-duration: 180ms;
}
.menu-goo .menu-open-button {
z-index: 2;
transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
transition-duration: 400ms;
-webkit-transform: scale(1.1, 1.1) translate3d(0, 0, 0);
transform: scale(1.1, 1.1) translate3d(0, 0, 0);
cursor: pointer;
}
.menu-goo .menu-open-button:hover {
-webkit-transform: scale(1.2, 1.2) translate3d(0, 0, 0);
transform: scale(1.2, 1.2) translate3d(0, 0, 0);
}
.menu-goo .menu-open:checked + .menu-open-button {
transition-timing-function: linear;
transition-duration: 200ms;
-webkit-transform: scale(0.8, 0.8) translate3d(0, 0, 0);
transform: scale(0.8, 0.8) translate3d(0, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item {
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(3) {
transition-duration: 170ms;
-webkit-transform: translate3d(70px, 0, 0);
transform: translate3d(70px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(4) {
transition-duration: 250ms;
-webkit-transform: translate3d(140px, 0, 0);
transform: translate3d(140px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(5) {
transition-duration: 330ms;
-webkit-transform: translate3d(210px, 0, 0);
transform: translate3d(210px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(6) {
transition-duration: 410ms;
-webkit-transform: translate3d(280px, 0, 0);
transform: translate3d(280px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(7) {
transition-duration: 410ms;
-webkit-transform: translate3d(350px, 0, 0);
transform: translate3d(350px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(8) {
transition-duration: 410ms;
-webkit-transform: translate3d(420px, 0, 0);
transform: translate3d(420px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(9) {
transition-duration: 410ms;
-webkit-transform: translate3d(490px, 0, 0);
transform: translate3d(490px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(10) {
transition-duration: 410ms;
-webkit-transform: translate3d(560px, 0, 0);
transform: translate3d(560px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(11) {
transition-duration: 410ms;
-webkit-transform: translate3d(630px, 0, 0);
transform: translate3d(630px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-h:nth-child(12) {
transition-duration: 410ms;
-webkit-transform: translate3d(700px, 0, 0);
transform: translate3d(700px, 0, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(3) {
transition-duration: 170ms;
-webkit-transform: translate3d(0, 70px, 0);
transform: translate3d(0, 70px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(4) {
transition-duration: 250ms;
-webkit-transform: translate3d(0, 140px, 0);
transform: translate3d(0, 140px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(5) {
transition-duration: 330ms;
-webkit-transform: translate3d(0, 210px, 0);
transform: translate3d(0, 210px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(6) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 280px, 0);
transform: translate3d(0, 280px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(7) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 350px, 0);
transform: translate3d(0, 350px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(8) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 420px, 0);
transform: translate3d(0, 420px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(9) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 490px, 0);
transform: translate3d(0, 490px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(10) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 560px, 0);
transform: translate3d(0, 560px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(11) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 630px, 0);
transform: translate3d(0, 630px, 0);
}
.menu-goo .menu-open:checked ~ .menu-item-v:nth-child(12) {
transition-duration: 410ms;
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
}
div.imagette {
display:flex;
align-items:center;
justify-content:center;
width: 70px;
height: 70px;
}
div.imagette > * {
width: 50px;
height: 50px;
}
Non, pas le fichier perso.css mais perso.json
Ah désolé
je n’arrive pas a trouver le chemin de ce fichier dans le plugin pim.
peux tu m’eclairé
https://github.com/noodom/jeedom_menus/blob/master/menuVerticalTom/json/perso.json
Ça voudrait dire que tu n’y as pas touché ?
Tu n’as donc pas défini tes propres boutons ni tes propres liens (et donc ça pourrait expliquer ton erreur avec des liens vers des écrans de designs inexistants)
erreur que j’ai c’est autre
menuCreation.js 61 Uncaught TypeError: Cannot read properties of null (reading ‹ src ›)
1 « J'aime »
au faite j’ai pris le menu TomButton dans pimp my jeedom
desolé je suis nul en dev
Ah il fallait commencer par là pour simplifier la compréhension du problème 
plus j’ai d’infos sur le contexte, plus c’est possible de chercher dans la bonne direction…
vraiment désolé
Dans le plugin Pimp, tu as donc défini une liste de boutons pour ton menu (avec icône et lien) ?
→ bouton « Ajouter » dans la partie " Designs liés et paramètres "
EDIT : tu n’as pas de correcteur automatique ou autres extensions similaires du navigateur ? (tu peux tester le menu en navigation privée ?)
Oui j’ai gait exactement ce qu’il faut faire deseign icon
en naviguant en privée ca me donne cette erreur
http://192.168.1.21/index.php?v=d&p=plan&plan_id=255# line 2 > injectedScript 61 TypeError: frameDestination is null
1 « J'aime »