Giter VIP home page Giter VIP logo

electron-bottom-most's Introduction

image (PR welcome for linux and Mac!)

This module allow you to set the window attached to the HWND handle to be placed at the lowest z-index available aka bottom-most

It's the inverse of top-most.

Electron indeed have a top-most property but do not have a bottom-most one.

This native module is a wrapper around SetWindowPosition Win32 API function.

Installation

npm i -S electron-bottom-most   # install the module

./node_modules/.bin/electron-rebuild -f -w electron-bottom-most   # rebuild the module to match your electron version

Usage

Look at the index.html, index.js and package.json file to integrate it into your Electron application

Basically it consists of 2 steps

  • Include the module in your .js file:
import { SetBottomMost } from 'electron-bottom-most';
 - or -
const { SetBottomMost } = require('electron-bottom-most');
  • Create your Electron BrowserWindow
let mainWindow = new BrowserWindow({
    height: 800,
    width: 800,
    useContentSize: true,
    transparent: !isDev,
    frame: isDev,
    focusable: isDev,
    show: false
});

// load it
mainWindow.loadURL(__dirname + "/index.html");

//show it
mainWindow.show();

// get the native HWND handle
let handle = mainWindow.getNativeWindowHandle();

// set bottom most!
SetBottomMost(handle);

Todo

  • Make it safe please

Authors

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE file for details

electron-bottom-most's People

Contributors

armaldio avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

electron-bottom-most's Issues

Facing issue while installing

Here's what I'm getting when I try to install electron-bottom-most using: npm i -S electron-bottom-most

Please help.

> [email protected] install /Users/tashfeenahmed/Desktop/Projects/DesktopWidget/Electron/node_modules/electron-bottom-most
> node-gyp rebuild

  CXX(target) Release/obj.target/bottom-most/lib.o
../lib.cc:22:5: error: unknown type name 'HWND'
    HWND hwnd = NULL;
    ^
../lib.cc:38:13: error: use of undeclared identifier 'HWND'
    hwnd = (HWND)handle;
            ^
../lib.cc:40:34: error: use of undeclared identifier 'HWND_BOTTOM'
    bool ok = SetWindowPos(hwnd, HWND_BOTTOM, 0, 0, 0, 0, SWP_NOSIZE | SWP_NOMOVE | SWP_NOACTIVATE);
                                 ^
../lib.cc:40:59: error: use of undeclared identifier 'SWP_NOSIZE'
    bool ok = SetWindowPos(hwnd, HWND_BOTTOM, 0, 0, 0, 0, SWP_NOSIZE | SWP_NOMOVE | SWP_NOACTIVATE);
                                                          ^
../lib.cc:40:72: error: use of undeclared identifier 'SWP_NOMOVE'
    bool ok = SetWindowPos(hwnd, HWND_BOTTOM, 0, 0, 0, 0, SWP_NOSIZE | SWP_NOMOVE | SWP_NOACTIVATE);
                                                                       ^
../lib.cc:40:85: error: use of undeclared identifier 'SWP_NOACTIVATE'
    bool ok = SetWindowPos(hwnd, HWND_BOTTOM, 0, 0, 0, 0, SWP_NOSIZE | SWP_NOMOVE | SWP_NOACTIVATE);
                                                                                    ^
6 errors generated.
make: *** [Release/obj.target/bottom-most/lib.o] Error 1
gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:276:23)
gyp ERR! stack     at emitTwo (events.js:106:13)
gyp ERR! stack     at ChildProcess.emit (events.js:194:7)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:215:12)
gyp ERR! System Darwin 16.7.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /Users/tashfeenahmed/Desktop/Projects/DesktopWidget/Electron/node_modules/electron-bottom-most
gyp ERR! node -v v7.8.0
gyp ERR! node-gyp -v v3.5.0
gyp ERR! not ok 
npm WARN [email protected] No repository field.
npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "i" "-S" "electron-bottom-most"
npm ERR! node v7.8.0
npm ERR! npm  v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1

npm ERR! [email protected] install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] install script 'node-gyp rebuild'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the electron-bottom-most package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node-gyp rebuild
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs electron-bottom-most
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls electron-bottom-most
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/tashfeenahmed/.npm/_logs/2018-07-25T20_02_33_684Z-debug.log

Cannot find Python

theis@WHISKEY A:\Projects\electrometer                                                                                                                                    
$ npm install electron-bottom-most                                                                                                                                        
                                                                                                                                                                          
> [email protected] install A:\Projects\electrometer\node_modules\electron-bottom-most                                                                           
> node-gyp rebuild                                                                                                                                                        
                                                                                                                                                                          
                                                                                                                                                                          
theis@WHISKEY A:\Projects\electrometer\node_modules\electron-bottom-most                                                                                                  
$ if not defined npm_config_node_gyp (node "A:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js"
 rebuild )  else (node "A:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )                                                         
gyp ERR! configure error                                                                                                                                                  
gyp ERR! stack Error: Can't find Python executable "C:\Users\theis\AppData\Local\Programs\Python\Python37-32\", you can set the PYTHON env variable.                      
gyp ERR! stack     at PythonFinder.failNoPython (A:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:483:19)                                  
gyp ERR! stack     at PythonFinder.<anonymous> (A:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:508:16)                                   
gyp ERR! stack     at A:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js:284:29                                                               
gyp ERR! stack     at FSReqWrap.oncomplete (fs.js:165:21)                                                                                                                 
gyp ERR! System Windows_NT 10.0.17134                                                                                                                                     
gyp ERR! command "A:\\Program Files\\nodejs\\node.exe" "A:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"                 
gyp ERR! cwd A:\Projects\electrometer\node_modules\electron-bottom-most                                                                                                   
gyp ERR! node -v v10.1.0                                                                                                                                                  
gyp ERR! node-gyp -v v3.6.2                                                                                                                                               
gyp ERR! not ok                                                                                                                                                           
npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.                                             
npm WARN [email protected] No repository field.                                                                                                                          
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):                                                                                   
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})         
                                                                                                                                                                          
npm ERR! code ELIFECYCLE                                                                                                                                                  
npm ERR! errno 1                                                                                                                                                          
npm ERR! [email protected] install: `node-gyp rebuild`                                                                                                           
npm ERR! Exit status 1                                                                                                                                                    
npm ERR!                                                                                                                                                                  
npm ERR! Failed at the [email protected] install script.                                                                                                         
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.                                                                        
                                                                                                                                                                          
npm ERR! A complete log of this run can be found in:                                                                                                                      
npm ERR!     C:\Users\theis\AppData\Roaming\npm-cache\_logs\2018-07-21T08_13_54_405Z-debug.log                                                                            
                                                                                                                                                                          

I installed Python with the PATH settings enabled and also manually set the PYTHON env variable, as evidenced below:

$ echo %PATH%                                                                                                                                                             
A:\Program Files\ConEmu\ConEmu\Scripts;A:\Program Files\ConEmu;A:\Program Files\ConEmu\ConEmu;C:\Program Files (x86)\Common Files\Intel\Shared Libraries\redist\intel64\co
mpiler;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files\dotnet\;C:\Program Files\Microsoft SQL Server\
130\Tools\Binn\;A:\Program Files\Git\cmd;A:\Program Files (x86)\Yarn\bin\;A:\Program Files\nodejs\;A:\Program Files\HaxeToolkit\haxe\;A:\Program Files\HaxeToolkit\neko;C:
\WINDOWS\System32\OpenSSH\;A:\Program Files\Microsoft VS Code\bin;C:\Program Files\Common Files\Autodesk Shared\;C:\Users\theis\AppData\Local\Programs\Python\Python37-32\
Scripts\;C:\Users\theis\AppData\Local\Programs\Python\Python37-32\;A:\Ruby\bin;C:\Users\theis\AppData\Local\Microsoft\WindowsApps;C:\Users\theis\AppData\Local\Yarn\bin;C:
\Users\theis\AppData\Roaming\npm;A:\Program Files\Dolphin-x64;A:\Program Files\higan;A:\Program Files\Microsoft VS Code\bin;C:\Program Files (x86)\LuaRocks;C:\Users\theis
\AppData\Roaming\LuaRocks\bin;C:\Program Files (x86)\LuaRocks\systree;C:\Users\theis\AppData\Roaming\luarocks;                                                            
                                                                                                                                                                          
theis@WHISKEY A:\Projects\electrometer                                                                                                                                    
$ echo %PYTHON%                                                                                                                                                           
C:\Users\theis\AppData\Local\Programs\Python\Python37-32\                                                                                                                 
                                                                                                                                                                          
theis@WHISKEY A:\Projects\electrometer                                                                                                                                    
$ python                                                                                                                                                                  
Python 3.7.0 (v3.7.0:1bf9cc5093, Jun 27 2018, 04:06:47) [MSC v.1914 32 bit (Intel)] on win32                                                                              
Type "help", "copyright", "credits" or "license" for more information.                                                                                                    
>>>                                                                                                                                                                       ```

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.