error loop

[A Former User]

@jchenaud
If your module doesn’t need to possess area in MagicMirror (even your module would draw something on MM), you wouldn’t use .getDom(). That function should be called by MM.core when the refreshing screen is needed. but your .getDom() will not work properly because there is no position to be drawn on.
So you should assign a position to use .getDom().
(Of course, there is some trick without .getDom() and position to draw something on MM)

[jchenaud]

@sean
thk for explain. i will try something different to get.getDom().

have you an idea for appendChild error ?

[A Former User]

@jchenaud I think that is also caused by unproper using of .getDom()
Better practice is;

1. use .getDom() with proper position
2. or, not using .getDom().

• You can start to manipulate your DOM when DOM_OBJECTS_CREATED notification from MM Core.
  like these;

notificationReceived: function(noti, payload, sender) {
  switch(noti) {
    case 'DOM_OBJECTS_CREATED':
      this.initMyDOM()
      break
  }
},
initMyDOM: function() {
  var wrapper = document.createElement("div")
  wrapper.id = "myDOM"
  var container = document.body
  container.appendChild(wrapper)
  
 var timer = setInterval(()=>{
  var d = document.getElementById("myDOM")
  d.innerHTML = "This is rendered without getDom and position"
  }, 1000)
}

This is not tested on real device, but you can catch the idea.

[jchenaud]

thk i will try :)

[jchenaud]

@Sean you are awesome !!!
my module almost work

just one problem i need to give a position in config. i think i have miss something

Module.register("MMM-keylogger",{
	defaults: {
		 updateInterval:  1500,
	},

	notificationReceived: function(noti, payload, sender) {
		Log.log(`notif : ${noti}`);
		switch(noti) {
		  case 'MODULE_DOM_CREATED':
			this.initMyDOM()
			break
		}
	  },
	  initMyDOM: function() {
		var wrapper = document.createElement("div")
		wrapper.id = "myDOM"
		var container = document.body
		container.appendChild(wrapper)
		Log.log(`init DOM `);
		var timer = setInterval(()=>{
			var d = document.getElementById("myDOM")
			d.innerHTML =  this.dataFile
		Log.log(`key : ${d.innerHTML} , ${this.dataFile} `);
			if(d.innerHTML){
				switch(d.innerHTML) {
					case "Right":
					this.sendNotification("PAGE_INCREMENT");
						break;
					case "Left" :
					this.sendNotification("PAGE_DECREMENT");
						break;
					default:
					Log.log(`key : ${d.innerHTML} pressed but not assigned`);
				}
				this.sendSocketNotification("Clear_key")
			}
			
			}, 1500)
	},

	start: function(){
        console.log(this.name + " has started...!!!!!!");
		this.sendSocketNotification("START", this.config);
	},

	socketNotificationReceived: function(notification, payload) {
		if(notification === "KEY_P"){
			this.dataFile = payload;
			// this.updateDom();
        }
	},

if i don’t give position on config its don’t work ! if i have understand what you have say. this is suppose to work

other question : one of my other module have subitly stop to work and make same error but in this module in need position and update with Miror display. so my question is : this is possible this modification have impact on other module ?

[A Former User]

@jchenaud
MODULE_DOM_CREATED is not so good time. Because, It would be emitted when Your DOM was created, but All of other DOMs are not rendered yet. DOM_OBJECTS_CREATED is better.
If you want to using position, use .getDom(). A usual way to use position is, in .getDom() to initialize your rendering and to prepare the framework to draw.
And you can choose one of drawing tricks.

1. getDom() shall take care of all the drawing. in .getDom() put all of your rendering framework and contents. and you can refresh your render by calling .updateDom()

2. getDom() shall draw only framework, Contents should be drawn by your another function with HTML DOM manipulation.

3. or getDom() just return empty wrapper, Then, all of your rendering and refreshing will be performed by yourself.

Which is better? case-by-case.

For the last question; I cannot figure out. :)