I'm developing my first FirefoxOS app and I need it to backup some data when the user closes or pauses the app. How can I detect this?
I've tried "window.onunload" but it doesn't seem to work.
Thank you.
You should be able to use page visibility API for background switch.
document.addEventListener("visibilitychange", function () {
if (document.hidden) {
console.log("App is hidden");
} else {
console.log("App has focus");
} });
Event launch visible only if app lost focus.
document.addEventListener('visibilitychange', function() {
if (document['visibilityState'] == "hidden") {
//code if is user out app, no close app
} else if(document['visibilityState'] == 'visible') {
//code if user return on app
}
}, false);
Related
I need to launch the electron app or focus it ( if already launched ) from a browser link. I have searched and tried many solutions but not getting it to work, so if someone has any experience with it, can you please help?
Here is the code:
// Single instance app ==========
const gotTheLock = app.requestSingleInstanceLock();
if (!gotTheLock) {
app.quit();
} else {
app.on('second-instance', (event, commandLine, workingDirectory) => {
// Someone tried to run a second instance, we should focus our window.
if (mainWindow) {
if (mainWindow.isMinimized()) mainWindow.restore();
mainWindow.focus();
}
});
}
// Register private URI scheme for the current user when running for the first time
app.setAsDefaultProtocolClient('x-protocol');
When I try to launch using this code, I get the goTheLock value as false, but the second-instance event is not getting fired, not sure why.
Version Details:
platform: Windows 10
electron: 8.5.3
electron-builder: 21.2.0
Update:
I added a delay of 5 seconds before quitting the app inside !gotTheLock, and in that case, I'm getting the event.
const gotTheLock = app.requestSingleInstanceLock();
if (!gotTheLock) {
delay(5000); // 5 seconds delay
app.quit();
} else {
app.on('second-instance', (event, commandLine, workingDirectory) => {
// Someone tried to run a second instance, we should focus our window.
if (mainWindow) {
if (mainWindow.isMinimized()) mainWindow.restore();
mainWindow.focus();
}
});
}
I don't understand. If you want to launch the app from a browser link then why you're implementing a second-instance? second-instance will fire if you open an application for a second time.
like this,
const gotTheLock = app.requestSingleInstanceLock();
if (!gotTheLock) {
if (win) {
app.quit();
}
} else {
app.on('second-instance', (event, commandLine, workingDirectory) => {
if (win) {
win.show();
win.focus();
}
})
}
I'm trying to make a websocket server that will run from a nice tray icon with a few options for stopping/starting etc in the context menu. I'm using the npm module ws for the server.
If I start my ws server from Electron's main process it works absolutely fine but if I start it from the click callback of Electron's tray menuitem the server's start callback never fires, as far as I can tell.
tray = new Tray(path.join(__dirname, '/icon.png'));
tray.setToolTip("Title");
tray.setContextMenu(Menu.buildFromTemplate([
{ label: "Start Server", click: () => { startServer(); } }
]));
function startServer(){
new ws.Server({ port: 4837 }, () => {
console.log("Server started.");
});
}
Okay. I kind of figured this out by setting a flag from the tray click handler and catch that flag in an interval at the end of js file to start the server.
My best guess, this is some weird thing to do with the process/thread that the tray is handled in.
With some more investigating it seems I can start the server by calling a bound function. Not sure why.
tray = new Tray(path.join(__dirname, '/icon.png'));
tray.setToolTip("Title");
tray.setContextMenu(Menu.buildFromTemplate([
{ label: "Start Server", click: startServer.bind(this); }
]));
function startServer(){
new ws.Server({ port: 4837 }, () => {
console.log("Server started.");
});
}
I'm making an electron desktop app. I want to disable windows key and function keys while the app is on
I tried using the following code ... it registers the event but the windows menu opens anyways
$(document).keydown(function(e){
if (e.keyCode == 37) {
alert( "windows key pressed" );
return false;
}
});
Any help?
You can try this, but unforunately it will become a global shortcut, meaning when the window doesn't have focus it will still be registered. Try putting a console.log() to see when it fires. win is your electron window variable
const {app, globalShortcut} = require('electron');
win = new BrowserWindow();
globalShortcut.register('Super', () => {
if (win.isFocused()) {
// do something
}
});
You can check the docs here: docs
Or try to use this module here: electron-localshortcut
electronLocalshortcut.register(win, 'Super', () => {
console.log('Windows Button pressed');
return false;
});
I have an extension that has content_script, background_page and page_action with popup.
So, popup has several controls, when user presses on control the popup should send a command to start work. Content script starts work, and should send an updates to popup.
The problem is that I'm not sure I implemented updates part properly.
Content script:
function notifyProgress(thing) {
console.log('Notify progress');
chrome.runtime.sendMessage({req: 'Progress', thing: thing});
}
Background page:
var channel;
chrome.runtime.onConnect.addListener(function (port) {
if (port.name == 'service-channel') {
channel = port;
port.onMessage.addListener(function (msg) {
console.log('Background received event', msg);
...
});
}
});
...
chrome.runtime.onMessage.addListener(function (msg, sender, callback) {
console.log('On message in background', msg);
if (msg.req == '...') {
...
} else if (msg.req == 'Progress') {
console.log('Got Progress for ' + sender.tab.id);
channel.postMessage(msg);
}
});
Popup:
var channel = chrome.extension.connect({name: 'service-channel'});
channel.onMessage.addListener(function (message) {
if (message.req == '...') {
...
} else if (message.req == 'Progress') {
updateListener(message.req, {thing: message.thing}); // updates UI
} else
console.log('Ignoring', message);
});
Also I have worries about multiple working content scripts sending Progress events.
Is there a simpler or better way of doing this?
Edit.
What is best practices of implementing Popup updates from Content Script?
I have a Chrome extension (specifically, a "content script") where I'd like to detect whether the page I am monitoring/changing is in fullscreen state. I have tried several APIs, as well as the "screenfull" library, but no luck so far. Any ideas?
Thanks for your help!
If you want to detect whether the page has used the Fullscreen API to enter fullscreen mode, just check document.webkitIsFullscreen.
If you want a general method to reliably detect full screen mode, the chrome.windows API is your only option. Since this API is unavailable to content scripts, you need to use the message passing API to interact with a background or event page.
Example: content script
function isFullScreen(callback) {
chrome.runtime.sendMessage('getScreenState', function(result) {
callback(result === 'fullscreen');
});
}
// Example: Whenever you want to know the state:
isFullScreen(function(isFullScreen) {
alert('Window is ' + (isFullScreen ? '' : 'not ') + 'in full screen mode.');
});
Example: background / event page
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
if (message === 'getScreenState') {
chrome.windows.get(sender.tab.windowId, function(chromeWindow) {
// "normal", "minimized", "maximized" or "fullscreen"
sendResponse(chromeWindow.state);
});
return true; // Signifies that we want to use sendResponse asynchronously
}
});
You can try something like this:
var isFullScreen = (screen.width == window.outerWidth) && (screen.height == window.outerHeight);
if(isFullScreen) {
// ...
}
The simplest way is to listen for webkitfullscreenchange event, e.g
$(document).on('webkitfullscreenchange',function(){
if (document.webkitIsFullScreen === true) {
console.log('Full screen mode is on");
} else {
console.log('Full screen mode is off");
}
});