This is a silly question, but I could not find a clear answer on the web.
Do I need to listen to a special "dom-ready-event" if my app is running within a BrowserWindow in Electron? For instance in a Cordova/PhoneGap app I read you can start doing things after the deviceready event.
I would like to know how this is done in Electron? Is one of the following enough?
document.addEventListener("DOMContentLoaded", startApp);
window.addEventListener("load", startApp);
Thank you.
Cordova has deviceready because it has both native code and JavaScript code, and potentially JavaScript might run before the native code has finished loading.
You don't have the same problem in Electron. You have a main process (main.js) which creates your BrowserWindow, so by the time any client-side JavaScript is running, your main process has definitely already started because it was the thing that created your browser window in the first place!
Inside the browser window the same events fire as they would on a normal webpage. So if you wanted to, you could use DOMContentLoaded or load (for the difference see this article on MDN), just in the same way as you would for a regular web application. But you certainly don't need to before calling any of the Electron APIs.
Related
I'm trying to track Page Load Event. I'm getting utag.js from Omniture.
I'm also wrapping it with jQuery: $.getScript to make sure that script is loaded.
But even then if I try to set my s.pageName or s.t(); I'm getting error that s is undefined. If I put a 500 ms timeout everything works fine. But I'm surprised that I need to wait even after script is loaded. Is it a common practice with Omniture?
I'm new to the Omniture, it might be very obvious thing for the more experienced users of Omniture.
utag.js is a Tealium loader, which I assume has Adobe Analytics code within it. The only thing that would prevent s from being defined after utag.js being loaded would be that the appmeasurement code is being loaded asynchronously.
You can find more about asynchronous loading here: https://tealium.com/blog/standard/asynchronous-tagging/
I would expect that once you switched to synchronous loading, the variables after utag.js will be able to reference the appmeasurement library.
App Measurement is not designed to be loaded asynchronously. I would suggest adding a "flag" that will indicate when utag.js has loaded and then reference the s.object.
Is it possible to do this in Electron:
I want to duplicate a video to a 2nd screen.
This is easyly done, by invoking the following 50 times/second:
canvas_context_2nd_screen.drawImage(video_1st_screen,0,0,width_canvas_2nd,height_canvas_2nd);
but in electron i have to communicate via IPC...
any ideas? is it possible in nw.js?
It is supported in NW.js. As DOM windows are in the same renderer process by default, and the Node.js context is shared between them:
http://docs.nwjs.io/en/latest/For%20Users/Advanced/JavaScript%20Contexts%20in%20NW.js/
This can be changed to be separate though.
I'm trying to see if I understand how Electron's implementation of Node.js is done and how it interacts with the app. From my understanding, the startup web page has a javascript file that runs as a "renderer" process. Code in this script can also access any of the Node.js APIs. To create new browser windows, code in renderer script uses new BrowserWindow to create new windows and each window in turn has its own renderer script.
Code in the renderer scripts run under Node.js and as such any code written in these scripts cannot communicate with script code in the browser's web page.
Is all of this true or am I wrong on something?
The Electron main process can create new windows (with Browser Window) and each of those windows has a renderer process. You can use ipc to send messages between the renderer process and the main process. To send a message from one renderer process to another, there are plugins for that, or you just have to relay the message through the main process.
The format/appearance of each window is controlled via html and css. Part of creating a window is specifying the html file to load.
More info can be found in this other SO question. The other question referenced this repo which has more info.
Lastly, the consensus seems to be to put as much in the renderer as possible.
For more clarification, by
Code in the renderer scripts run under Node.js and as such any code
written in these scripts cannot communicate with script code in the
browser's web page.
are you asking if an Electron app can interact with a separate web browser?
In order to get jQuery to load and function correctly in a HTML page I was opening in Electron (formerly Atom Shell), I had to disable Node integration when creating the BrowserWindow in my main.js file.
Can someone please tell me what setting node-integration: false will keep me from being able to do that I would normally be able to do had I not disabled it?
Setting node-integration to false will disable node.js in the renderer process - i.e. your app can only do what a web browser will do. Instead of doing this, use Zepto.js which is compatible with Electron and has the same API.
I am trying to use atom-shell, but I don't understand how the DOM events differ from a normal browser. I can't find doc about it either.
If I add:
document.onkeydown = function() { alert('...'); }
to index.html, it seems that atom-shell doesn't capture the event, and instead forwards the call to the terminal in which I ran atom-shell myapp.
Is there any documentation somewhere about how the DOM events work in atom-shell?
Edit: This only happens when I run atom-shell from the terminal window (in OSX). If I run the app by first starting the Atom application and dragging my app inside the drag area, then it works fine...
It's a bug: here is the GitHub issue