See release notes before updating with electron-updater - electron

I'm trying to get to update my Electron app via auto-update. I managed to get it working fine whereas it checks for updates, downloads the update, installs the update and restarts the application.
But what I really want is that I can check if there's an update; if there is show the release notes that are in my latest.yml file and the user can agree or cancel the update. (See screenshot below)
I've tried checking for the releaseNote when I enter my update-available event, but the 2nd parameter is "undefined".
Along with that I can't really figure out how I can show a scrollable text dialog with a yes/no button structure either.
For now I've made a very crude messageBox to see if I can get the releaseNote from my yml file, with no luck. So, the newbie as I am when it comes to Electron and building/updating apps with it; I'm officially out of ideas.
This is how my update-available event looks now:
autoUpdater.on('update-available', (ev, info) => {
sendStatusToWindow('Update available.' + info)
dialog.showMessageBox({
type: 'info',
title: 'Found Updates',
message: info.releaseNotes,
buttons: ['Yes', 'No']
}, (buttonIndex) => {
if (buttonIndex === 0) {
autoUpdater.downloadUpdate()
}
})
})
And my update-downloaded event:
autoUpdater.on('update-downloaded', (ev, info) => {
sendStatusToWindow('Update downloaded: ' + info)
autoUpdater.quitAndInstall()
})

The electron-builder documentation is rather vague in regards to the object that is emitted in any of the autoUpdater instance events.
After quite some fiddling around, searching through the web, and reading documentation, I discovered that there should be only one parameter in the autoUpdater events:
autoUpdater.on('update-available', (updateInfo) => {
//Callback function
});
updateInfo is an arbitrary parameter name but the paramter is an object that contains the releaseNotes, releaseDate, and other information from the update. I am on electron-updater v4.0.6.
updateInfo then is an object with these values as its properties:
Source: electron.build/auto-update#module_electron-updater

Related

How do I use showOpenDialog withe Electron’s IPC?

I am learning to live without remote in my electron app. I have got to the point where I need to open a file from the renderer, which I understand required the main process to show the file dialog and send back the results.
In my main.js, I have the following:
ipcMain.on('open-file',(event,data)=>{
dialog.showOpenDialog(null, data, (filePaths) => {
event.sender.send('open-file-paths', filePaths);
});
});
In my render process, which I call pager.js, I have the following:
ipcRenderer.send('open-file',{
title: 'Title',
defaultPath: localStorage.getItem('defaultPath')
});
ipcRenderer.on('open-file-paths',(event,data)=>{
console.log(event);
console.log(data);
});
The file open dialog works well enough, but I don’t know how to get the results. the ipcRenderer.on('open-file-paths',…) doesn’t get called, so that’s obviously not the right way to do it. I would like to get either the selected path(s) or a cancelled message.
How do I get the results for showOpenDialog in the render process?
OK, I think I’ve got it.
Thanks to an answer in ShowOpenDialog not working on recent versions of electron-js, I see that showOpenDialog now returns a promise, which means reworking the code in main.js. Here is a working solution:
// main.js
ipcMain.on('open-file',(event,data)=>{
dialog.showOpenDialog(null, data).then(filePaths => {
event.sender.send('open-file-paths', filePaths);
});
});
// pager.js (render)
ipcRenderer.send('open-file',{
title: 'Title',
defaultPath: localStorage.getItem('defaultPath')
});
ipcRenderer.on('open-file-paths',(event,data)=>{
console.log(`Canceled? ${data.canceled}`);
console.log(`File Paths: ${data.filePaths.join(';')`);
});

How to set mouse click as global shortcut in electron app

I want to trigger an action on double right-click of mouse when electron app is running in the background.
I read the documentation and seems like there are no globalshortcuts for mouse events.
Any other way to achieve this? perhaps some node module compatible with electron app?
Unfortunately, we can't achieve that yet.
As MarshallOfSound commented on this official issue
"globalShortcut intercepts the key combination globally and prevents any application from receiving those key events. If you blocked apps from receiving mouse button presses things would break everywhere very quickly 👍"
https://github.com/electron/electron/issues/13964
For macOS, I'm currently using Keyboard Maestro App.
I'm getting my mouse keys with this app and triggering a globalShortcut key combination register in my Electron App.
Maybe for Windows, AHK (auto hot keys)
I found this nice solution for HTML code
<script type = "text/javascript">
const {remote} = require('electron')
const {Menu, MenuItem} = remote
const menu = new Menu()
// Build menu one item at a time, unlike
menu.append(new MenuItem ({
label: 'MenuItem1',
click() {
console.log('item 1 clicked')
}
}))
menu.append(new MenuItem({type: 'separator'}))
menu.append(new MenuItem({label: 'MenuItem2', type: 'checkbox', checked: true}))
menu.append(new MenuItem ({
label: 'MenuItem3',
click() {
console.log('item 3 clicked')
}
}))
// Prevent default action of right click in chromium. Replace with our menu.
window.addEventListener('contextmenu', (e) => {
e.preventDefault()
menu.popup(remote.getCurrentWindow())
}, false)
</script>
Put this as first item in your HTML Body and it should work. At least it worked on my project
EDIT, cause I forgot it: Credits to google for answer on 6th entry

Event typeahead:rendered not working on twitter typeahead

I'm using the twitter typeahead library. Version: 0.10.4
I have been able to bind events to the "opened", "selected" events but nothing happens when I bind the event "rendered", although it is in the documentation.
Has any of you guys come across this issue?
Here is the code I'm using:
typeAhead.on('typeahead:selected', function(e, suggestion) {
alert(0);return; // Shows the alert
})
typeAhead.on('typeahead:rendered', function() {
// Nothing happens
});
had the same issue, debugging I've found out this line
typeAhead.data().ttTypeahead.dropdown.datasets[0].onSync('rendered', function(){
console.log('rendered');
});
it's working for me and I aint found any better than this, without modifying typeahead libraries.
if you have more datasets, just change to a for loop.
I'm having troubles with this event too. I'm using version 0.11.1 and as far as I can see I think there's a kind of bug when passing arguments to the callback function:
if you use this handler:
function(obj, matches) {
console.log(matches);
}
you seem to get only one (the first one, of the several matched suggestions.
if you use this handler:
function(obj, match1, match2) {
console.log(match1);
console.log(match2);
}
you get two, and so on.
Actually all suggestions are passed as this handler prove:
function() {
console.log(arguments);
}
skipping the first slot, the remaining are the current suggestions, so I think this is a bug of the plugin.

Highchart export, execute function after completion

I need to do some post-processing work on a png file of a Highchart graph. How do I determine when the export is finished? I've tried to attach a function, but it never gets called:
console.log("Saving chart...");
chart.exportChart({
type : "application/png",
filename: "tmp_chart_filename"
},
function(data) {
console.log("Export done, Data: " + data); // Not called.
})
console.log("Out");
To my understanding, it is not possible out of the box.
What happens internally in the exportChart() method is, a form is created on the fly and the chart svg is sent to the server by programmatically triggering a submit on this form. The server in turn, processes received svg into a png (or whatever you may select) and returns it to the browser.
The popup you see that asks you to "save as" is the action of the browser (and not any highchart code) when a file is thrown at it. Basically the returned png is never returned to the code, it goes directly to the browser.
You can however write your custom svg->png server module and do your magic there :)
I had a rather similar issue and solved it by defining the onclick event on the contextButton. This seems possible only if you are OK with losing the items in the context menu (export by file type), which wasn't an issue in my case. Below the code to be included in the chart initial building:
[... your Highcharts chart setup ...],
exporting: {
buttons: {
contextButton: {
menuItem: null, // You'll lose your menu items here
onclick: function(event) {
yourFunctionBeforeExport();
this.exportChart();
yourFunctionAfterExport();
}
}
}
}
[... rest of the Highcharts chart setup ...]

FB.XFBML.parse does not reparse FB widgets

I have a function call back on auth.login and would like to reparse my fb:like elements. Other actions are performed during the auth.login callback, and they execute just fine, but the .parse does not! I try executing FB.XFBML.parse(); in the console and it shows undefined and then after three seconds a console message saying 2 XFBML tags failed to render in 30000ms.
Any ideas?
For anyone who happens to run across this question running into the same problem I did...
Basically what I wanted to do was after a user logged into my website, I wanted to refresh the 'Like' button iFrame to reflect such. FB.XFBML.parse(); was only resulting in errors...so I thought "Maybe I'll just refresh the iFrame?" and since I am using jQuery as my framework - I figured I'd stick with it.
So, here's what I ended up doing:
FB.Event.subscribe('auth.login', function(response) {
if(response.status == 'connected') {
$("#login_fb").hide(); // was already doing this part
$('#like_fb > span > iframe').attr('src', function(i,val) { return val; }); // this is what I wanted to refresh
//FB.XFBML.parse(); -- THIS WAS GENERATING AN ERROR
}
});
Hopefully this will help someone else!

Resources