Add more packaging goodness

README.md

@@ -1,6 +1,6 @@
 # electron-node-red
 
-This is an Electron template to embed Node-RED with a UI generated by node-red-contrib-ui.
+This is an Electron template to embed Node-RED with a Dashboard generated by node-red-dashboard.
 
 You can base off this model and update the package.json file to include your own required dependencies.
 
@@ -36,4 +36,11 @@ electron-packager electron-node-red Node-RED --icon=nodered.icns --platform=linu
 
 Learn more about Electron and its API in the [documentation](http://electron.atom.io/docs/latest).
 
+
+### To package as a dmg
+
+look at `https://github.com/LinusU/node-appdmg`
+
+    appdmg appdmg.json ~/Desktop/NodeRED.dmg
+
 #### License [CC0 (Public Domain)](LICENSE.md)

appdmg.json

@@ -0,0 +1,10 @@
+{
+  "title": "Node-RED installer",
+  "icon": "nodered.icns",
+  "background": "appbkg.png",
+  "icon-size": 80,
+  "contents": [
+    { "x": 448, "y": 344, "type": "link", "path": "/Applications" },
+    { "x": 192, "y": 344, "type": "file", "path": "Node-RED-darwin-x64/Node-RED.app" }
+  ]
+}

flows.json

@@ -1 +1 @@
-[{"type":"tab","id":"41f61d2.fbe09e4","label":"Flow 1"},{"id":"52a903f3.ad56fc","type":"ui_tab","z":"41f61d2.fbe09e4","name":"Home","icon":"dashboard","order":"1"},{"id":"d3a0fd6d.2c5f","type":"ui_slider","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","name":"Slider","topic":"","group":"","order":"3","min":0,"max":10,"x":147.5,"y":87,"wires":[["42ddca5b.bd2234"]]},{"id":"42ddca5b.bd2234","type":"ui_gauge","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","name":"Gauge","group":"","order":"2","format":"{{value}}","min":0,"max":10,"x":300.5,"y":87,"wires":[]},{"id":"852d9c04.7ad26","type":"ui_link","z":"41f61d2.fbe09e4","name":"Admin","link":"http://localhost:8000/admin","icon":"open_in_browser","order":1,"x":72.5,"y":273,"wires":[]},{"id":"fce4a072.031b6","type":"ui_button","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","name":"Button","payload":"Hello !","topic":"","group":"","order":"4","x":124.5,"y":145,"wires":[["a09bb056.68216"]]},{"id":"a09bb056.68216","type":"ui_toast","z":"41f61d2.fbe09e4","name":"","x":328,"y":144,"wires":[]},{"id":"189cf871.681118","type":"ui_template","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","name":"Welcome","group":"Introduction","order":1,"format":"<h3>Welcome to Node-RED</h3>\nOn the right you will see some simple widgets to play with.\nTo get started making something a bit more useful click the menu icon at the top-left, and select <b>Admin</b>.","storeOutMessages":false,"fwdInMessages":false,"x":81,"y":45,"wires":[[]]}]
+[{"type":"tab","id":"41f61d2.fbe09e4","label":"Flow 1"},{"id":"52a903f3.ad56fc","type":"ui_tab","z":"41f61d2.fbe09e4","name":"Home","icon":"dashboard","order":"1"},{"id":"30e652f.d9de3ae","type":"ui_group","z":"41f61d2.fbe09e4","order":"2","name":"Widgets","width":"6"},{"id":"a8ecb9.c60f4348","type":"ui_group","z":"41f61d2.fbe09e4","order":"1","name":"Introduction","width":"6"},{"id":"d3a0fd6d.2c5f","type":"ui_slider","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","group":"30e652f.d9de3ae","order":"3","width":"6","height":"1","name":"Slider","label":"Slider","topic":"","min":0,"max":10,"x":130,"y":100,"wires":[["42ddca5b.bd2234"]]},{"id":"42ddca5b.bd2234","type":"ui_gauge","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","group":"30e652f.d9de3ae","order":"2","width":"6","height":"4","name":"Gauge","title":"","label":"","format":"{{value}}","min":0,"max":10,"x":290,"y":100,"wires":[]},{"id":"852d9c04.7ad26","type":"ui_link","z":"41f61d2.fbe09e4","name":"Admin","link":"http://localhost:8000/admin","icon":"open_in_browser","target":"newtab","order":1,"x":69.5,"y":217,"wires":[]},{"id":"fce4a072.031b6","type":"ui_button","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","group":"30e652f.d9de3ae","order":"4","width":"6","height":"1","name":"Button","label":"Click Me","color":"green","icon":"","payload":"Hello !","topic":"","x":130,"y":160,"wires":[["a09bb056.68216"]]},{"id":"a09bb056.68216","type":"ui_toast","z":"41f61d2.fbe09e4","name":"","x":310,"y":160,"wires":[]},{"id":"189cf871.681118","type":"ui_template","z":"41f61d2.fbe09e4","tab":"52a903f3.ad56fc","group":"a8ecb9.c60f4348","name":"Welcome","order":1,"format":"<h3>Welcome to Node-RED</h3>\nOn the right you will see some simple widgets to play with.\nTo get started making something a bit more useful click the menu icon at the top-left, and select <b>Admin</b>.","storeOutMessages":false,"fwdInMessages":false,"x":80,"y":40,"wires":[[]]}]

main.js

@@ -1,3 +1,4 @@
+
 'use strict';
 
 const electron = require('electron');
@@ -43,40 +44,74 @@ server.listen(8000);
 // Start the runtime
 RED.start();
 
+// Create the Application's main menu
+var template = [{
+    label: "Application",
+    submenu: [
+        { label: "About Application", selector: "orderFrontStandardAboutPanel:" },
+        { type: "separator" },
+        { label: "Quit", accelerator: "Command+Q", click: function() { app.quit(); }}
+    ]}, {
+    label: "Edit",
+    submenu: [
+        { label: "Undo", accelerator: "CmdOrCtrl+Z", selector: "undo:" },
+        { label: "Redo", accelerator: "Shift+CmdOrCtrl+Z", selector: "redo:" },
+        { type: "separator" },
+        { label: "Cut", accelerator: "CmdOrCtrl+X", selector: "cut:" },
+        { label: "Copy", accelerator: "CmdOrCtrl+C", selector: "copy:" },
+        { label: "Paste", accelerator: "CmdOrCtrl+V", selector: "paste:" },
+        { label: "Select All", accelerator: "CmdOrCtrl+A", selector: "selectAll:" }
+    ]}
+];
+
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
 let mainWindow;
 
 function createWindow () {
-  // Create the browser window.
+    // Create the browser window.
-  mainWindow = new BrowserWindow({
+    mainWindow = new BrowserWindow({
-    autoHideMenuBar: true,
+        autoHideMenuBar: true,
-    webPreferences: {
+        webPreferences: {
-      nodeIntegration: false
+            nodeIntegration: false
-    },
+        },
-  	width: 1024,
+        title: "Node-RED",
-  	height: 768,
+        width: 1024,
-    icon: __dirname + "/nodered.png"
+        height: 768,
-  });
+        icon: __dirname + "/nodered.png"
+    });
+    mainWindow.loadURL("http://localhost:8000/ui");
 
-  mainWindow.loadURL("http://localhost:8000/ui");
+    var webContents = mainWindow.webContents;
-  var webContents = mainWindow.webContents;
+    webContents.on('did-get-response-details', function(event, status, newURL, originalURL, httpResponseCode) {
-  webContents.on('did-get-response-details', function(event, status, newURL, originalURL, httpResponseCode) {
+        if ((httpResponseCode == 404) && (newURL == "http://localhost:8000/ui")) {
-    if (httpResponseCode == 404) {
+            setTimeout(webContents.reload, 200);
-      setTimeout(webContents.reload, 200);
+        }
-  }
+        Menu.setApplicationMenu(Menu.buildFromTemplate(template));
-  });
+    });
 
-  // Open the DevTools.
+    // Open the DevTools.
-  //mainWindow.webContents.openDevTools();
+    //mainWindow.webContents.openDevTools();
 
-  // Emitted when the window is closed.
+    mainWindow.webContents.on("new-window", function(e, url, frameName, disposition, options) {
-  mainWindow.on('closed', function() {
+        // if a child window opens... modify any other options such as width/height, etc
-    // Dereference the window object, usually you would store windows
+        // in this case make the child overlap the parent exactly...
-    // in an array if your app supports multi windows, this is the time
+        var w = mainWindow.getBounds();
-    // when you should delete the corresponding element.
+        options.x = w.x;
-    mainWindow = null;
+        options.y = w.y;
-  });
+        options.width = w.width;
+        options.height = w.height;
+        //re-use the same child name so all "2nd" windows use the same one.
+        //frameName = "child";
+    })
+
+    // Emitted when the window is closed.
+    mainWindow.on('closed', function() {
+        // Dereference the window object, usually you would store windows
+        // in an array if your app supports multi windows, this is the time
+        // when you should delete the corresponding element.
+        mainWindow = null;
+    });
 }
 
 // This method will be called when Electron has finished
@@ -85,40 +120,17 @@ app.on('ready', createWindow);
 
 // Quit when all windows are closed.
 app.on('window-all-closed', function () {
-  // On OS X it is common for applications and their menu bar
+    // On OS X it is common for applications and their menu bar
-  // to stay active until the user quits explicitly with Cmd + Q
+    // to stay active until the user quits explicitly with Cmd + Q
-  if (process.platform !== 'darwin') {
+    if (process.platform !== 'darwin') {
-    app.quit();
+        app.quit();
-  }
+    }
 });
 
 app.on('activate', function () {
-  // On OS X it's common to re-create a window in the app when the
+    // On OS X it's common to re-create a window in the app when the
-  // dock icon is clicked and there are no other windows open.
+    // dock icon is clicked and there are no other windows open.
-  if (mainWindow === null) {
+    if (mainWindow === null) {
-    createWindow();
+        createWindow();
-  }
+    }
-
-  // Create the Application's main menu
-  var template = [{
-      label: "Application",
-      submenu: [
-          { label: "About Application", selector: "orderFrontStandardAboutPanel:" },
-          { type: "separator" },
-          { label: "Quit", accelerator: "Command+Q", click: function() { app.quit(); }}
-      ]}, {
-      label: "Edit",
-      submenu: [
-          { label: "Undo", accelerator: "CmdOrCtrl+Z", selector: "undo:" },
-          { label: "Redo", accelerator: "Shift+CmdOrCtrl+Z", selector: "redo:" },
-          { type: "separator" },
-          { label: "Cut", accelerator: "CmdOrCtrl+X", selector: "cut:" },
-          { label: "Copy", accelerator: "CmdOrCtrl+C", selector: "copy:" },
-          { label: "Paste", accelerator: "CmdOrCtrl+V", selector: "paste:" },
-          { label: "Select All", accelerator: "CmdOrCtrl+A", selector: "selectAll:" }
-      ]}
-  ];
-
-  Menu.setApplicationMenu(Menu.buildFromTemplate(template));
-
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "electron-node-red",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Electron Node-RED template",
   "main": "main.js",
   "scripts": {
@@ -12,14 +12,13 @@
   },
   "dependencies": {
     "node-red": "~0.13.4",
-    "node-red-contrib-ui": "^1.2.19",
+    "node-red-dashboard": "git+https://github.com/node-red/node-red-dashboard.git",
     "express": "^4.13.0"
   },
   "keywords": [
-    "Electron",
+    "electron",
     "quick",
     "start",
-    "tutorial",
     "node-red"
   ],
   "author": "Nathanaël Lécaudé",
@@ -29,6 +28,6 @@
   },
   "homepage": "https://github.com/natcl/electron-node-red#readme",
   "devDependencies": {
-    "electron-prebuilt": "^0.37.0"
+    "electron-prebuilt": "^0.37.8"
   }
 }