How to create app with electron like steam-overlay


#1

I want to create electron application that will be game helper and it will show some cheats top on the any game while user plays. You can imagine like “Steam” application overlay in the game. I tried to open my application to the top and also try to show native dialogs & alerts to get app to top but os always hide game app (minimized) before show my app. My question is; is it possible to run or should i stop to try?

I added example code that i tried below.

import { app, BrowserWindow, globalShortcut, shell, dialog } from 'electron';
import Positioner from 'electron-positioner';

app.on('ready', function () {
  mainWindow = new BrowserWindow({
      x: mainWindowState.x,
      y: mainWindowState.y,
      width: mainWindowState.width,
      height: mainWindowState.height,
      alwaysOnTop: true
   });
  
  //...some codes

  var ret = globalShortcut.register('shift+ctrl+x', function() {
    console.log('shift+ctrl+x is pressed');
    shell.beep();
    positioner.move('bottomRight');
    mainWindow.show();
  });
});

#2

Game overlays like steam hook into the DirectX/OpenGL renderer to display ontop of the game, they don’t create their own windows to display content.
Had a quick search and found this case study which explains how fraps does it (did it?).


#3

I also have a similar issue and need a way to use electron as overlay