Initial commit

adam-lynch · Jun 24, 2016 · 5a28e9e · 5a28e9e
commit 5a28e9e
Show file tree

Hide file tree

Showing 115 changed files with 2,055 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,13 @@
+# http://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+charset = "utf-8"
+end_of_line = lf
+
+[*.html, *.css, *.js, *.json]
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directory
+# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
+node_modules
+*/node_modules
diff --git a/01-introduction/index.html b/01-introduction/index.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>My first Electron app</title>
+</head>
+<body>
+  <h1>Hello World!</h1>
+</body>
+</html>
diff --git a/01-introduction/main.js b/01-introduction/main.js
@@ -0,0 +1,11 @@
+const electron = require('electron');
+const app = electron.app;
+const BrowserWindow = electron.BrowserWindow;
+
+var mainWindow = null;
+
+app.on('ready', () => {
+  mainWindow = new BrowserWindow({ width: 800, height: 600 })
+
+  mainWindow.loadURL('file://' + __dirname + '/index.html');
+})
diff --git a/01-introduction/package.json b/01-introduction/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "electron-first-steps",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "start": "electron .",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "electron-prebuilt": "^0.36.2"
+  }
+}
diff --git a/02-TheDifferentProcesses/index.html b/02-TheDifferentProcesses/index.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Different Processes</title>
+</head>
+<body>
+  <script type="text/javascript" src="index.js"></script>
+</body>
+</html>
diff --git a/02-TheDifferentProcesses/index.js b/02-TheDifferentProcesses/index.js
@@ -0,0 +1,4 @@
+window.ipcRenderer.on('pong', (event, arg) => {
+  document.write('<h1>' + arg + '</h1>');
+});
+window.ipcRenderer.send('ping', 'hello');
diff --git a/02-TheDifferentProcesses/main.js b/02-TheDifferentProcesses/main.js
@@ -0,0 +1,22 @@
+const electron = require('electron');
+const app = electron.app;
+const BrowserWindow = electron.BrowserWindow;
+const ipcMain = electron.ipcMain;
+
+var mainWindow = null;
+
+// listen for the "ping" event
+ipcMain.on('ping', function (event, arg) {
+  if (arg === 'hello') {
+    event.sender.send('pong', 'Hello, World!'); // send back a greeting
+  }
+});
+
+app.on('ready', () => {
+  mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: {
+    nodeIntegration: false,
+    preload: __dirname + '/preload.js' // this is our preload script
+  }});
+
+  mainWindow.loadURL('file://' + __dirname + '/index.html');
+});
diff --git a/02-TheDifferentProcesses/package.json b/02-TheDifferentProcesses/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "the-different-processes",
+  "version": "1.0.0",
+  "description": "The different Electron processes",
+  "main": "main.js",
+  "dependencies": {
+    "electron-prebuilt": "^0.36.7"
+  },
+  "devDependencies": {},
+  "scripts": {
+    "start": "electron ."
+  },
+  "author": "Max Gfeller <[email protected]>",
+  "license": "ISC"
+}
diff --git a/02-TheDifferentProcesses/preload.js b/02-TheDifferentProcesses/preload.js
@@ -0,0 +1 @@
+window.ipcRenderer = require('electron').ipcRenderer;
diff --git a/03-UsingNodeModules/01-displayFileContents/displayFileContents.js b/03-UsingNodeModules/01-displayFileContents/displayFileContents.js
@@ -0,0 +1,6 @@
+const fs = require('fs');
+fs.readFile(__dirname + '/file.txt', function (error,
+                                               contents) {
+    if (error) return console.error(error);
+    console.log(contents);
+});
diff --git a/04-ApplicationLifecycle/01-Quitting/quitting.js b/04-ApplicationLifecycle/01-Quitting/quitting.js
@@ -0,0 +1,21 @@
+app.on('window-all-closed', () => {
+    if (process.platform !== ‘darwin’) {
+        app.quit();
+    }
+});
+
+app.on('activate', () => {
+    if (mainWindow === null) {
+        createMainWindow();
+    }
+});
+
+app.on('before-quit', (evt) => {
+    if (hasUnsavedChanges()) {
+        evt.preventDefault();
+    }
+});
+
+app.on('quit', (evt, exitCode) => {
+    console.log(‘application quit with exit code:’, exitCode)
+});
diff --git a/04-ApplicationLifecycle/02-Crashing/crashing.js b/04-ApplicationLifecycle/02-Crashing/crashing.js
@@ -0,0 +1,13 @@
+const electron = require('electron');
+const app = electron.app;
+
+process.on('uncaughtException', (err) => {
+  console.log('application almost crashed!', err);
+});
+
+app.on('ready', () => {
+  setTimeout(() => {
+    nonExistentFunc();
+    console.log('more important stuff'); // won't ever get called
+  }, 2000);
+});
diff --git a/05-BuildingARealDesktopApp/index.html b/05-BuildingARealDesktopApp/index.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Our cool editor</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <main>
+    <div class="header">
+      <div class="title">Awesome Editor</div>
+      <a href="#" class="open-file">Open file</a>
+      &middot;
+      <a href="#" class="show-file-in-folder">Show file in folder</a>
+    </div>
+    <div class="container hidden">
+      <div class="editor">
+        <textarea autofocus="true" placeholder="# Write something here..."></textarea>
+      </div>
+      <div class="preview"></div>
+    </div>
+  </main>
+  <script type="text/javascript" src="index.js"></script>
+</body>
+</html>
diff --git a/05-BuildingARealDesktopApp/index.js b/05-BuildingARealDesktopApp/index.js
@@ -0,0 +1,71 @@
+const marked = require('marked');
+const remote = require('remote');
+const dialog = remote.require('dialog');
+const fs = require('fs');
+const shell = require('electron').shell;
+const ipcRenderer = require('electron').ipcRenderer;
+
+const container = document.querySelector('.container');
+const editor = document.querySelector('.editor textarea');
+const preview = document.querySelector('.preview');
+const openFileLink = document.querySelector('a.open-file');
+const showFileInFolderLink = document.querySelector('a.show-file-in-folder');
+
+var currentFile = remote.getGlobal('fileToOpen') || null;
+
+if(currentFile) {
+  openFile(currentFile);
+}
+
+ipcRenderer.on('open-file', (event, arg) => {
+  openFile(arg);
+});
+
+marked.setOptions({
+  gfm: true,
+  tables: true,
+  breaks: false,
+  pedantic: false,
+  sanitize: true,
+  smartLists: true,
+  smartypants: false
+});
+
+editor.onkeyup = generatePreview;
+
+openFileLink.onclick = (evt) => {
+  dialog.showOpenDialog({
+    title: 'Select a file to edit',
+    filters: [
+      { name: 'Markdown Documents', extensions: ['md', 'markdown'] }
+    ]
+  }, (filenames) => {
+    if (!filenames) return;
+    if (filenames.length > 0) {
+      openFile(filenames[0]);
+    }
+  })
+};
+
+showFileInFolderLink.onclick = (evt) => {
+  shell.showItemInFolder(currentFile);
+};
+
+function generatePreview () {
+  var content = editor.value;
+  var html = marked(content);
+  preview.innerHTML = html;
+}
+
+function openFile (filename) {
+  var contents = fs.readFileSync(filename);
+
+  currentFile = filename;
+
+  editor.value = contents;
+  container.classList.remove('hidden');
+
+  generatePreview();
+
+  remote.app.addRecentDocument(filename);
+}
diff --git a/05-BuildingARealDesktopApp/main.js b/05-BuildingARealDesktopApp/main.js
@@ -0,0 +1,24 @@
+const electron = require('electron');
+const app = electron.app;
+const BrowserWindow = electron.BrowserWindow;
+
+var mainWindow = null;
+
+global.fileToOpen = null;
+
+app.on('open-file', (event, path) => {
+  event.preventDefault();
+  fileToOpen = path;
+
+  if(mainWindow){
+    mainWindow.send('open-file', path);
+  }
+});
+
+app.on('ready', () => {
+  mainWindow = new BrowserWindow({ width: 800, height: 600 });
+  mainWindow.loadURL('file://' + __dirname + '/index.html');
+
+  // Uncomment next line to show DevTools when the app launches
+  //mainWindow.openDevTools();
+});
diff --git a/05-BuildingARealDesktopApp/package.json b/05-BuildingARealDesktopApp/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "a-real-desktop-app",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "start": "electron ."
+  },
+  "author": "Max Gfeller <[email protected]>",
+  "license": "ISC",
+  "dependencies": {
+    "electron-prebuilt": "^0.36.8",
+    "marked": "^0.3.5"
+  }
+}
diff --git a/05-BuildingARealDesktopApp/style.css b/05-BuildingARealDesktopApp/style.css
@@ -0,0 +1,58 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: sans-serif;
+}
+
+.hidden {
+  display: none;
+}
+
+.header {
+  width: 100%;
+  height: 50px;
+  background-color: #444;
+  color: #ddd;
+  vertical-align: middle;
+  padding: 15px 5px 0px 5px;
+}
+
+.header .title {
+  font-size: 18px;
+}
+
+.header a {
+  color: #ddd;
+}
+
+.container {
+  width: 100%;
+  height: 100vh;
+}
+
+.editor,
+.preview {
+  box-sizing: border-box;
+  padding: 10px;
+}
+
+.editor {
+  width: 50%;
+  height: 100%;
+  float: left;
+}
+
+.editor textarea {
+  resize: none;
+  border: none;
+  outline: none;
+  width: 100%;
+  height: 100%;
+}
+
+.preview {
+  width: 50%;
+  height: 100%;
+  float: left;
+  background-color: #ddd;
+}
diff --git a/06-PlatformDetectionAndCustomFrames/01-customButtons/buttons.css b/06-PlatformDetectionAndCustomFrames/01-customButtons/buttons.css
@@ -0,0 +1,12 @@
+.button {
+    /* Your custom styles */
+    border-radius: 3px;
+}
+
+.platform-mac .button {
+    border-radius: 5px;
+}
+
+.platform-windows-8 .button {
+    border-radius: 0;
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		window.ipcRenderer = require('electron').ipcRenderer;