max-mapper / elementary-electron Goto Github PK

View Code? Open in Web Editor NEW

227.0 13.0 44.0 521 KB

NodeSchool workshop for learning Electron

JavaScript 100.00%

elementary-electron's Introduction

Elementary Electron

A nodeschool workshop that teaches electron.

Please open issues to propose new exercises if you have some cool ideas.

Run npm install elementary-electron -g, and then elementary-electron to start.

elementary-electron's People

Contributors

Stargazers

Watchers

elementary-electron's Issues

i got an error when runing the tutorials

I get this error when i run electron app.js but when i run electron index.html everything works fine
i got this in my app.js file

var electron = require('electron')

electron.app.on('ready', function () {
  var mainWindow = new electron.BrowserWindow({width: 600, height: 800})
  mainWindow.loadURL('file://' + __dirname + '/index.html')
})

App threw an error when running

[TypeError: Cannot read property 'on' of undefined]
A JavaScript error occurred in the main process
Uncaught Exception:
TypeError: Cannot read property 'on' of undefined
    at Object.<anonymous> (/home/jose/electron/app.js:3:13)
    at Module._compile (module.js:425:26)
    at Object.Module._extensions..js (module.js:432:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:313:12)
    at loadApplicationPackage (/usr/local/lib/node_modules/electron-prebuilt/dist/resources/default_app/main.js:257:23)
    at Object.<anonymous> (/usr/local/lib/node_modules/electron-prebuilt/dist/resources/default_app/main.js:289:5)
    at Module._compile (module.js:425:26)
    at Object.Module._extensions..js (module.js:432:10)
    at Module.load (module.js:356:32)

Replace elementary-electron requirement sprintf -> sprintf-js

npm complained on the install:

$ npm install elementary-electron -g
npm WARN deprecated [email protected]: The sprintf package is deprecated in favor of sprintf-js.
/usr/local/bin/elementary-electron -> /usr/local/lib/node_modules/elementary-electron/bin/elementary-electron
+ [email protected]
added 221 packages from 201 contributors in 6.521s

We'll know shortly if this is a technical complaint and everything still works - or not.

hello_world lesson fails on verify

It looks like this line is causing the failure:

fsCheck(path.join('.', 'index.js')),

The instructions tell you to create an index.html file. I may do a pull later today to fix.

fail message on success

I see this issue has a pull request pending since a long time now already at #10

How about accepting it?

Works with this code, but still get fn undefined error

I had issues every step of the way. Needed to add node support to app.js and made changes to index.js too. I don't know why replacing the callback way of doing it with a promise way worked, but with the following code getting the cat pic, annotating and printing on 'p' press all work.

However, still getting error messages in the console, similar to #32

Tracked them to here:
ladjs/superagent#676
ladjs/superagent#714

but I couldn't figure out where it's being included from to test if upgrading the version fixes it or such.

app.js

var electron = require('electron');

electron.app.on('ready', function () {
    var mainWindow = new electron.BrowserWindow({
        width: 600,
        height: 800,
        webPreferences: {
            nodeIntegration: true
        }});
    mainWindow.loadURL('file://' + __dirname + '/index.html');
})

index.js


// Get cat pic src
var catpicture = require('cat-picture');
var src = catpicture.src;
catpicture.remove();

// Get annotation
var image = require('lightning-image-poly');
var viz = new image('#visualization', null, [src], {hullAlgorithm: 'convex'});

// Save pdf
var fs = require('fs');
var remote = require('electron').remote;

function save () {

    remote.getCurrentWebContents().printToPDF({portrait: true})
        .then( data => {
            fs.writeFile('annotation.pdf', data, function (err) {
                if (err) {
                    alert('error generating pdf! ' + err.message);
                } else {
                    alert('pdf saved!');
                }
            })
        })
        .catch (err => {
            console.log('test');
        })
}

window.addEventListener('keydown', function (e) {
    if (e.keyCode == 80) save()
})

Install hangs

I'm trying to install on Windows10 using this command:
npm install -g elementary-electron -verbose

It gets stuck forever at the list line of the below output (cheerio unlock) ...

<clipped!>
npm info install [email protected]
npm info postinstall [email protected]
npm verb unlock done using C:\Users\Paul\AppData\Roaming\npm-cache_locks\request-cedffcc9de9447d4.lock for C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\request
npm verb write writing to C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle\package.json
npm info preinstall [email protected]
npm verb readDependencies loading dependencies from C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle\package.json
npm verb readDependencies loading dependencies from C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle\package.json
npm verb about to build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle
npm info build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle
npm info linkStuff [email protected]
npm verb linkBins [email protected]
npm verb linkMans [email protected]
npm verb rebuildBundles [email protected]
npm info install [email protected]
npm info postinstall [email protected]
npm verb unlock done using C:\Users\Paul\AppData\Roaming\npm-cache_locks\cssstyle-757e2d50749b3631.lock for C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom\node_modules\cssstyle
npm verb about to build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom
npm info build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom
npm info linkStuff [email protected]
npm verb linkBins [email protected]
npm verb linkMans [email protected]
npm verb rebuildBundles [email protected]
npm verb rebuildBundles [ '.bin',
npm verb rebuildBundles 'abab',
npm verb rebuildBundles 'acorn',
npm verb rebuildBundles 'acorn-globals',
npm verb rebuildBundles 'cssom',
npm verb rebuildBundles 'cssstyle',
npm verb rebuildBundles 'escodegen',
npm verb rebuildBundles 'nwmatcher',
npm verb rebuildBundles 'parse5',
npm verb rebuildBundles 'request',
npm verb rebuildBundles 'sax',
npm verb rebuildBundles 'symbol-tree',
npm verb rebuildBundles 'tough-cookie',
npm verb rebuildBundles 'webidl-conversions',
npm verb rebuildBundles 'whatwg-url-compat',
npm verb rebuildBundles 'xml-name-validator' ]
npm info install [email protected]
npm info postinstall [email protected]
npm verb unlock done using C:\Users\Paul\AppData\Roaming\npm-cache_locks\jsdom-e70a35ec465f8837.lock for C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\jsdom
npm verb write writing to C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash\package.json
npm info preinstall [email protected]
npm verb readDependencies loading dependencies from C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash\package.json
npm verb readDependencies loading dependencies from C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash\package.json
npm verb about to build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash
npm info build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash
npm info linkStuff [email protected]
npm verb linkBins [email protected]
npm verb linkMans [email protected]
npm verb rebuildBundles [email protected]
npm info install [email protected]
npm info postinstall [email protected]
npm verb unlock done using C:\Users\Paul\AppData\Roaming\npm-cache_locks\lodash-a6f1af9274513c4a.lock for C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio\node_modules\lodash
npm verb about to build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio
npm info build C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio
npm info linkStuff [email protected]
npm verb linkBins [email protected]
npm verb linkMans [email protected]
npm verb rebuildBundles [email protected]
npm verb rebuildBundles [ 'css-select',
npm verb rebuildBundles 'dom-serializer',
npm verb rebuildBundles 'entities',
npm verb rebuildBundles 'htmlparser2',
npm verb rebuildBundles 'jsdom',
npm verb rebuildBundles 'lodash' ]
npm info install [email protected]
npm info postinstall [email protected]
npm verb unlock done using C:\Users\Paul\AppData\Roaming\npm-cache_locks\cheerio-7c3f69aebf561707.lock for C:\Users\Paul\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\cheerio

Enabling remote in BrowserWindow fixes the pdf export for me

Hi, i was having an issue where electron returns a require('electron').remote as an undefined,
i searched online, the solution to this is to add to the app.js file inside the webPreferences

enableRemoteModule: true

with this fix, i finally got index.js working, and i succesfully exported the pdf file

Complete code:

electron.app.on('ready', function () {
  var mainWindow = new electron.BrowserWindow({
    width: 600, height: 800, webPreferences: {
      nodeIntegration: true,
      enableRemoteModule: true
    }
  })

i included the nodeIntegration: true to fix other issues

Error on tutorial startup.

I've got an error, when trying to start tutorial.

$ elementary-electron
C:\Users\рорао\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\adventure\lib\menu.js:51
process.stdin.setRawMode(true);
^

TypeError: process.stdin.setRawMode is not a function
at module.exports (C:\Users\рорао\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\adventure\lib\menu.js:51:19)
at Shop.showMenu (C:\Users\рорао\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\adventure\index.js:267:16)
at Shop.execute (C:\Users\рорао\AppData\Roaming\npm\node_modules\elementary-electron\node_modules\adventure\index.js:131:14)
at Object. (C:\Users\рорао\AppData\Roaming\npm\node_modules\elementary-electron\cli.js:21:6)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:134:18)

Cat Picture not working?

I followed the exercise strictly, more than one time, but I can't get to get it working.
I have the 4 correct files, and indeed elementary-electron verify completes with a SUCCES.
But when i execute electron app.js a blank window appear, if I reload the page (Ctrl+R) i can briefly see the 'Hello World' text, then it disapper again.

I tried it on different directory, different machines, different OS's, I can't seem to find a solution, nor an error report (the console hangs as soon as I reload the page).
Am I doing something wrong or is something else going on?

app.js

var electron = require('electron')

electron.app.on('ready', function() {
    var mainWindow = new electron.BrowserWindow({width: 600, height:800})
    mainWindow.loadURL('file://' + __dirname + '/index.html')
})

index.html

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <h1>Hello World</h1>
    <script type="text/javascript" src="index.js"></script>
</body>
</html>

index.js
require('cat-picture')

Error Installing electron-prebuilt

I'm getting an 'unknown platform' error when attempting to install the electron-prebuilt module for this tutorial.

Any chance of an android version of this requirement?

Does this work

Does not find electron.

elementary-electron verify
FAIL! Failed to find the command electron in your PATH.

Also has 10 vulnerabilities

Cat Annotation - issue with lightning-image-poly package

Hi kind contributors

Thank you for the easy to follow guide to setting up electron app. Everything worked fine for me in this course except for the bug with the polygon drawing package

I could kinda draw squiggly lines after following the tutorial, but my doodling disappeared the moment I release my mouse. Also, my browser buffer size increase as if there were more elements added to it, which I think is what the code below was trying to do:

var viz = new image('#visualization',null,[src],{hullAlgorithm:'convex'});

Because there was a code that was supposed to delete the original image and re-render it, the new image was taking super long to render while the old image was not deleted either. And the drawing didn't seem to be at the right location.

Please kindly help explain what was going on.

My entire code was:

var picture=require('cat-picture');
var image=require("lightning-image-poly");

var src=picture.src;
picture.remove();
var viz = new image('#visualization',null,[src],{hullAlgorithm:'convex'});

Thank you

index.js reference in index.html

Hi,

I'm sort of new to node and getting through this excersise I've seen file index.js being referenced in index.html. index.js is using node's require function. how does this reference work through html. you don't use require.js either...

Hello World Solution

in the instructions it states to create a index.html

Using a text editor (such as TextEdit, Notepad, etc.), create a file
called index.html in the folder you just created with the following
contents:
<!DOCTYPE html>  
 <html>  
 <head>  
 </head>  
 <body>  
   <h1>Hello World</h1>  
 </body>  
 </html>  

running verification fails looking for a index.js

$ elementary-electron verify
Checking Requirements:

» index.js [?]
» app.js ✔

FAIL!

Your app has some issues.

Electron Command Does Nothing

Let me preface this that I am a total newb with all of this.
Simply said, whenever I type 'electron' into my command prompt, nothing happens. There were no issues with installing electron, and it is on my path. It's just that nothing happens.

Part 5: Error when clicking P button on keyboard.

i am in the "NodeSchool workshop for learning Electron" part 5. i am getting the following error when i click the p button on the keyboard. any ideas on what i could be doing wrong?

C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:748 Uncaught TypeError: fn is not a function
at Request.callback (C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:748)
at Request. (C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:135)
at emitOne (events.js:96)
at Request.emit (events.js:191)
at IncomingMessage. (C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:938)
at emitNone (events.js:91)
at IncomingMessage.emit (events.js:188)
at endReadableNT (_stream_readable.js:975)
at _combinedTickCallback (internal/process/next_tick.js:80)
at process._tickCallback (internal/process/next_tick.js:104)
Request.callback @ C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:748
(anonymous) @ C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:135
emitOne @ events.js:96
emit @ events.js:191
(anonymous) @ C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\superagent\lib\no…:938
emitNone @ events.js:91
emit @ events.js:188
endReadableNT @ _stream_readable.js:975
_combinedTickCallback @ internal/process/next_tick.js:80
_tickCallback @ internal/process/next_tick.js:104
C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\leaflet.freedraw-…:399 setting mode
C:\Users\ajitg\AppData\Roaming\npm\node_modules\lightning-image-poly\node_modules\leaflet.freedraw-…:400 10

HelloWorld. No browser window opens.

Ubuntu 16.04
Node version v6.2.2
npm version 3.10.2.
Electron version 1.2.3 (most recent version tried also)
Browser doesn't open and when I run verify it's missing the index.js.

I´ve ran it on my windows laptop and it works fine so must be OS related.

Move to electron-userland org

I have been casually maintaining this project for a while, but I think it would have a better life if we moved it to @electron-userland. @maxogden any objection?

Electron run error

/usr/local/lib/node_modules/electron-prebuilt/dist/electron: error while loading shared libraries: libgtk-x11-2.0.so.0: cannot open shared object file: No such file or directory

Unable to annotate image

Setting the nodeIntegration option to true does indeed workloads up the cat image, but if I run the annotation challenge the screen goes blank again. All I see is "hello world".

What am I missing?

Verification

It (the glitch) seems to me that the automation for verification is lacking. In particular, the lesson entitled 'Hello World' directs the user to generate a simple HTML file (index.html) and a javascript file (app.js); however, the verification just requires the presence of a html.JS and an app.js for a successful pass. Evenmoreso, the resulting run does not appear to work but passes the verification.

-M

max-mapper / elementary-electron Goto Github PK

elementary-electron's Introduction

Elementary Electron

elementary-electron's People

Contributors

Stargazers

Watchers

Forkers

elementary-electron's Issues

Recommend Projects

Recommend Topics

Recommend Org