Module Position

[maxbachmann]

@strawberry-3-141 So I always have to know wether there is already a element in that region? Is there a way to check all modules and return the ID’s of the elements that are in this position?

[maxbachmann]

@strawberry-3-141 and where to add that? is that already the “end code”? I tried in the domupdate function and it did not work, so I guess that was wrong

[strawberry 3.141]

it is safe to always run the code so you don’t need to check if there is a module necessarily.

it is not related to the get dom function, you can put it where ever you want except node_helper (because its not executed in the browser)

can you post the code of your module or upload it to github, then i can have a look

[maxbachmann]

In general I want to add it to all kind of modules so I can change the position when sending them a socketmessage to do so

[strawberry 3.141]

@maxbachmann i wouldn’t place that code in other modules, you can perform that from your module for every module, this isn’t magicmirror related. its pure dom manipulation.

[maxbachmann]

Ah did not know that ;) well yes then it’s definetly in my program. All my program does so far is subscribe to a mqtt broker, load some data and according to this show/hide modules. Now I want to add the possibility to move modules to different positions.
Can send the current code later

[maxbachmann]

@strawberry-3-141 so in general use all 3 commands and then it works in both senarios? where can I find the right ID for each module?

[strawberry 3.141]

@maxbachmann you can get all modules https://github.com/MichMich/MagicMirror/tree/master/modules#module-selection then iterate over them and when you find the module execute the cmds

const moduleToMove = 'clock';
const targetRegion = 'top.left';

MM.getModules().enumerate((module) => {
    if (module.name === moduleToMove) {
        const instance = document.getElementById(module.identifier);
        const region = document.querySelector(`div.region.${targetRegion} div.container`);
        region.appendChild(instance);
        region.style.display = 'block';
    }
});

something similar to this

[maxbachmann]

@strawberry-3-141 ty that works.

Added the possibility

region.insertBefore(instance, region.childNodes[0])

so I can prepend and append the module

[justjim1220]

@maxbachmann

If you look in your css folder you will find the main.css file. Open it and you will find all the regions. Compare them to where you have you modules set and it should help you figure it out.