Execute JS function with CEF

[echoHU]

Hello!

I've got a this tag under my html, containing this function:

<script>
	function showNotification(type, text) {
		var image = document.getElementById("logo");
		
		switch(type) {
			case 1:
				image.src = "images/warning.png";
				document.getElementById("header").innerHTML = "Warning";
				break;
			case 2:
				image.src = "images/error.png";
				document.getElementById("header").innerHTML = "Error";
				break;
			default:
				image.src = "images/info.png";
				document.getElementById("header").innerHTML = "Information";
				break;
		}
		
		var content = document.getElementById("content")
		content.innerHTML = text;
	}
</script>

And my Questin is: how to execute this function under CEF Browser?

I have tried something like this, but it's not working:

var boxBrowser = mp.browsers.new('package://PleasantRoleplay/notification-system/notification.html');
boxBrowser.execute('hideWindow();');

mp.events.add('boxShow', (type, ntext) => {
	browser.execute('showNotification(' + type + ',' + ntext + ');');
	
	boxBrowser.execute('showWindow();');
	
	setTimeout(function(){
		boxBrowser.destroy();
	}, 5000); 
});

 

[Jake]

Why do you use browser.execute... and not boxBrowser.execute...?

[micaww]

@echoHU for simplicity and scalability, ditch execute and use this:

For the browser your code would be:

rpc.register('showNotification', ([type, text]) => {
  var image = document.getElementById("logo");

  switch(type) {
    case 1:
      image.src = "images/warning.png";
      document.getElementById("header").innerHTML = "Warning";
      break;
    case 2:
      image.src = "images/error.png";
      document.getElementById("header").innerHTML = "Error";
      break;
    default:
      image.src = "images/info.png";
      document.getElementById("header").innerHTML = "Information";
      break;
  }

  var content = document.getElementById("content")
  content.innerHTML = text;
});

And for the client:

const rpc = require('rage-rpc');

rpc.callBrowser(boxBrowser, 'showNotification', ["this is the type", "this is the text"]);

// OR if you dont have access to the browser object:

rpc.callBrowsers('showNotification', ["this is the type", "this is the text"]);

This eliminates the need for messy execute and gives you the ability to call your CEF functions from anywhere, even the server or other CEF instances.