How to detect desktop idle time from an Electron app? - javascript

I need my Electron app to respond to the user becoming idle (no mouse or keyboard inputs to any program on the OS) for a certain amount of time.
How can I trigger a function based on such idle time data?

You can always detect idle times on Linux by using XScreenServer, GetLastInputInfo on Windows and CGEventSourceSecondsSinceLastEventType on Mac
I've published desktop-idle using these API's, you can check the source code https://github.com/bithavoc/node-desktop-idle
UPDATE:
Electron 3 users can use the power monitor API to achieve the same goal: https://electronjs.org/docs/api/power-monitor

Some people have written node libraries that hook into the native platform code for OSX, Windows, and Linux to accomplish this.
I ended up using this library to accomplish the same thing in my electron app:
https://github.com/paulcbetts/node-system-idle-time
It's published on npm as #paulcbetts/system-idle-time
I tested it on OSX and it seemed to work fine there.
I did originally get a "module version mismatch expected 50 got 46" error, but running this command cleared it up:
npm rebuild --runtime=electron --target=1.4.3 --disturl=https://atom.io/download/atom-shell --abi=49
Replace target with whatever version of electron you're using.

Since electron uses node, you should checkout RobotJS. These things are platform specific so it does need some other dependancies but you can monitor mouse/keyboard and see if it's changed, or control it (hence the name).

Look at Electron Power monitor API's and use
powerMonitor.getSystemIdleTime()

Related

How can I make a software downloadable? [duplicate]

I've HTML application build with AngularJS/jQuery/Bootstrap with AJAX REST API.
Is it possible to create executable/installer for Windows operating system?
Without any 3rd-party software, it should look like native application, but HTML.
For example, Slack messenger has web/mac/windows versions and they look same.
Any ideas?
// UPD
I probably need a wrapper (webview), but I need all features for EcmaScript5/CSS3.
Electron is the easiest way:
1. Install electron
2. Create and edit main.js:
const electron = require('electron');
const { app, BrowserWindow } = electron;
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 1000,
height: 700
});
mainWindow.setTitle('title of the desktop app');
mainWindow.loadURL('http://www.yourwebpage.com');
mainWindow.on('closed', () => {
mainWindow = null;
});
});
3. Execute desktop app:
electron main.js
And to build the app, use a builder such as electron-builder.
Hope that helps you!
(Full disclosure, I'm the founder of ToDesktop, I'll try to be objective and unbiased here.)
As usual in Computer Science, the answer is "it depends"!
The first question that you should ask yourself is: Who is the desktop app being used by? Just you? Or, are you distributing the app to customers? Because these two segments have very different needs.
Just you
There are a lot of options here (in no particular order):
Nativefier — The obvious option. Lots of configuration options, lots of contributors, open source and regularly updated. This should probably be the default option if you want to whip up an app just for yourself.
WebDGap — This is a lovely project but it is a little old and "as of April 13th, 2018 WebDGap is no longer an active project.". It should also be noted that this is built on an old version of node-webkit and not Electron.
Web2Desk — Great option if you don't want to mess around with the command-line. It uses Nativefier under-the-hood. It is free with a splash screen or $19 with the splash screen removed.
Do-it-yourself with Electron — The basics were covered quite well in this earlier answer. I like this option because it gives you complete flexibility to take the project wherever you like and you'll learn a bit of Electron too.
Fluid App — This is Mac only but otherwise it's a lovely solution and super easy. It's free for the standard version, there is also a $5 version which includes features like fullscreen.
Flotato — Mac only again but this is a really interesting approach. Simply clone the app and give it a name like docs.google.com, it will then turn into Google Docs. At the time of writing this, it's in pre-release (not released yet) but I'll be watching this closely, it's very cool.
ToDesktop — ToDesktop will work but it's probably a bit overkill if you're creating a personal app. Also, it's probably a bit too expensive for this use-case. ToDesktop is targeted at creating a desktop app for distribution to customers (more about that below).
Distributing to customers
There are a few extra considerations which become more important when creating a desktop app for distribution to your customers:
Installer — Mac users expect a "drag to applications" DMG file. Windows users expect an installer and they also expect to be able to uninstall it from the control panel.
Code Signing — If your app isn't code signed then by default Windows Authenticode and Apple Gatekeeper will prevent your desktop app from being opened.
Auto-update — There is still a web browser running "underneath" your desktop app, it's important to keep this updated for two reasons. 1. Security issues + vulnerabilities should be patched over time. 2. You don't want to be stuck supporting an old web browser in 5 years time because your desktop app's browser hasn't been updated
The tools mentioned above don't offer these features, so they're not really suitable for the use-case of distributing your app to customers. These are the features that we wanted to add when building ToDesktop, so I think it fits this use-case quite nicely. We're adding features all the time, last week we added support for App Protocols and Deeplinks.
I myself was looking for an all around solution for awhile. I tried everything from TideSDK, AppJS, Appcelerator Titanium, native code in VB.NET, XCode, Python, C++, Electron, node-webkit, etc: Basically you name it I've tried it.
Note Electron is nice, but it only runs on 64bit processors. So node-webkit is good if you want to run your app on 32bit processors.
So I decided to build my own open source solution called WebDGap.
Currently WebDGap runs on Windows, Linux, Mac OS X, Google Chrome and as a web application!
Watch the How To Video to learn, well how to use the app obviously.
Here's a screenshot.
Being that you're a Mac user already you can merge your exported app into 1 .app mac file. This can be done with Automator (and a little shell scripting).
There's also a coding playground I made for mobile users that has this feature built in called kodeWeave.
Here's a Tic-Tac-Toe game I'm going to export as a Mac App:
Now the web app is running as a native Mac application!
The most easiest and quickest way i know is to use nodejs/npm’s nativefier library which underlying electronjs . It will just take 5 min to create executable for windows. Even a person who do not have programming experience can create desktop application from web application. Below mentioned post has described the steps to convert web application to desktop application. Must read !
Convert any web application to desktop application in 2 min using npm’s nativefier
There are a ton of frameworks out there that can wrap your web app into a native application that can access things like the file storage API for an operating system. This is the specific guide for Windows.
BEWARE THOUGH - you will need to spend time doing solid testing and QA work for your native app so it doesn't feel like a website inside a native wrapper, as well as integrates well with all versions of the OS you want to be compatible with. Tweetdeck for Mac is an example of what not to do - basically a web browser in a native wrapper).
Use Web2Desk: If you are looking for Free and Simple solution.
wherein all you need to do is enter the URL of the web app (or website) and Desktop app for Mac, Windows, and Linux is generated in no time.
With a bit of wrapper code you could package it as a Chrome App. They do not need to run in a browser window but have all the capabilities of a web app, standalone.
https://developer.chrome.com/apps/about_apps
Best Way to Convert Web to Exe is using nativefier:
nativefier --name "Inventory Management System" "http://localhost/php_stock_zip/php_stock_zip/php_stock/" -i ./icon.png -p windows
Steps:
Press Win+x
Press C
Type
nativefier
Installation Requirements
* macOS 10.9+ / Windows / Linux
* Node.js >=6 (4.x may work but is no longer tested, please upgrade)
See optional dependencies for more
Step 5: npm install nativefier -g
Finally type nativefier "Web Link"

Looking for tools and methods to use to narrow down causes for a React Native app to stop a device from going into sleep mode

I am maintaining an App that has been created in React Native targeted at Android tablet devices. The issue that I am currently experiencing is that when the app is active but has not had any activity, the device will not go into sleep mode after the assigned period of inactivity whilst the is app active.
I have been attempting to find any processes that could be preventing the app from allowing the device to go into sleep mode and have not been able to find anything through Chromes debugging tools or Reactotron.
I did find this question App not letting device to go into sleep mode so my next step is to look at our third party packages as well as our own Java files, though our customisation of them have been very minimal and to the best of my knowledge there has not been any code added intentionally to stop a device from going into sleep mode.
What I am looking for is any additional tools as well as any methods that I could use to narrow down my search for this issue.
Was this application created using Expo?
If so you can prevent the screen from sleeping by using KeepAwake as documented here in the Expo documentation https://docs.expo.io/versions/latest/sdk/keep-awake/
There is also information inThe github repo which details how to use this in applications that aren't using Expo too : https://github.com/expo/expo/tree/master/packages/expo-keep-awake

How to run a JS application on desktop and call C code?

I have an web app (WebGL/HTML5/JS) that is very computationally demanding. I want to turn this into a desktop app. I have heard of app.js, http://appjs.com but the problem here will be WebGL ?
The reason I want to turn it into a desktop app is because I want to call unix system commands.
Thanks
Electron would probably be a better choice since it is still actively maintained and AppJS is not. Electron is Chromium based so it supports WebGL. Here is an example of using WebGL with Electron.
NW.js is a similar project. There are some technical reasons that you might want to prefer Electron over NW.js.
Both give you access to Node, so you should be able to call system commands using the child process module.

Network Service Discovery (mDNS) on react-native/Expo

I have an IOT device ruining a mDNS responder, is there a way to find the device through a react-native/Expo app?
I have found a react-native library (react-native-zeroconf). However, it requires react-native-link which expo does not support.
I have also found a pure Java Script library (multicast-dns). However, I'm not sure whether it is possible to port that to react-native/Expo.
Should I detach and use native modules? I'm keeping that as a last resort for now.
The first one you can do with expo but you will need to detach.
The second will not work at all because it assumes the node API which does not exist in ReactNative.

Cordova web server with configurable responses

Is there any way to set up a local web server in a Cordova application such that I can control the responses via Javascript? I'm currently developing a custom plugin that communicates with a remote system via HTTP. I'd like to be able to run integration tests on this that are written in the Javascript code of a Cordova application, so I can easily test them in all supported platforms (Android, iOS, and ideally in the browser too... although the latter seems a little unlikely to be possible), but this means I need to be able to set up mock API responses from javascript code ... which will require the presence of a mock server that the plugin can communicate with.
I'm familiar with this plugin, but it can only respond using files in the local system -- I want to be able to generate responses and capture sent POST data in a Javascript callback. Is there any existing way of doing this?
Having searched extensively, I came to the conclusion that no such plugin exists.
I have therefore started an implementation of such a plugin myself: the initial version is now available on NPM and GitHub, with a sample project available in the github repository.
Android support is currently functioning, and I intended to start on iOS support in the next few days.
(Updated to add: unfortunately the project I was working on was cancelled, so have not had time supported by my employer to finish the iOS version, and as I don't have a mac personally so can't work on this on my own time, this seems unlikely to happen in the near future, but if anyone else needs it, it should be relatively simple to add the iOS version)

Categories

Resources