From b01ff5f0db88809687a7c9c33733e29f64b6819c Mon Sep 17 00:00:00 2001 From: Juan Cruz Viotti Date: Mon, 5 Sep 2016 18:15:51 -0700 Subject: [PATCH] feat(GUI): "Need help?" dynamically opens the image support url (#683) We've recently added support for a `supportUrl` property in an archive image `_info/manifest.json`, which the publisher can use to define the URL where it would like to redirect users facing problems. This PR makes the "Need help?" link at the top right corner open the configured `supportUrl` url, and fallback to the original Etcher's help page if no `supportUrl` is found. In order to accomplish this, we made the following changes: - Implement `SelectionStateModel.getImageSupportUrl()` - Implement `HeaderController` controller Change-Type: minor Changelog-Entry: Make the "Need help?" link dynamically open the image support url. Fixes: https://github.com/resin-io/etcher/issues/662 Signed-off-by: Juan Cruz Viotti --- lib/gui/app.js | 22 ++++++++++++++++++++++ lib/gui/index.html | 4 ++-- lib/gui/models/selection-state.js | 14 ++++++++++++++ tests/gui/models/selection-state.spec.js | 14 ++++++++++++++ 4 files changed, 52 insertions(+), 2 deletions(-) diff --git a/lib/gui/app.js b/lib/gui/app.js index c1415aa1..fc9cd5a4 100644 --- a/lib/gui/app.js +++ b/lib/gui/app.js @@ -143,3 +143,25 @@ app.config(($provide) => { }; }); }); + +app.controller('HeaderController', function(SelectionStateModel, OSOpenExternalService) { + + /** + * @summary Open help page + * @function + * @public + * + * @description + * This application will open either the image's support url, declared + * in the archive `manifest.json`, or the default Etcher help page. + * + * @example + * HeaderController.openHelpPage(); + */ + this.openHelpPage = () => { + const DEFAULT_SUPPORT_URL = 'https://github.com/resin-io/etcher/blob/master/SUPPORT.md'; + const supportUrl = SelectionStateModel.getImageSupportUrl() || DEFAULT_SUPPORT_URL; + OSOpenExternalService.open(supportUrl); + }; + +}); diff --git a/lib/gui/index.html b/lib/gui/index.html index 5044b074..c49fc7d7 100644 --- a/lib/gui/index.html +++ b/lib/gui/index.html @@ -18,8 +18,8 @@ -
- diff --git a/lib/gui/models/selection-state.js b/lib/gui/models/selection-state.js index fadc6726..c6d72ad7 100644 --- a/lib/gui/models/selection-state.js +++ b/lib/gui/models/selection-state.js @@ -260,6 +260,20 @@ SelectionStateModel.service('SelectionStateModel', function(DrivesModel) { return _.get(Store.getState().toJS(), 'selection.image.logo'); }; + /** + * @summary Get image support url + * @function + * @public + * + * @returns {String} image support url + * + * @example + * const imageSupportUrl = SelectionStateModel.getImageSupportUrl(); + */ + this.getImageSupportUrl = () => { + return _.get(Store.getState().toJS(), 'selection.image.supportUrl'); + }; + /** * @summary Check if there is a selected drive * @function diff --git a/tests/gui/models/selection-state.spec.js b/tests/gui/models/selection-state.spec.js index 5047f414..45eaa2d0 100644 --- a/tests/gui/models/selection-state.spec.js +++ b/tests/gui/models/selection-state.spec.js @@ -55,6 +55,10 @@ describe('Browser: SelectionState', function() { m.chai.expect(SelectionStateModel.getImageLogo()).to.be.undefined; }); + it('getImageSupportUrl() should return undefined', function() { + m.chai.expect(SelectionStateModel.getImageSupportUrl()).to.be.undefined; + }); + it('hasDrive() should return false', function() { const hasDrive = SelectionStateModel.hasDrive(); m.chai.expect(hasDrive).to.be.false; @@ -271,6 +275,7 @@ describe('Browser: SelectionState', function() { path: 'foo.img', size: 999999999, url: 'https://www.raspbian.org', + supportUrl: 'https://www.raspbian.org/forums/', name: 'Raspbian', logo: 'Raspbian' }); @@ -425,6 +430,15 @@ describe('Browser: SelectionState', function() { }); + describe('.getImageSupportUrl()', function() { + + it('should return the image support url', function() { + const imageSupportUrl = SelectionStateModel.getImageSupportUrl(); + m.chai.expect(imageSupportUrl).to.equal('https://www.raspbian.org/forums/'); + }); + + }); + describe('.hasImage()', function() { it('should return true', function() {