69 Commits

Author SHA1 Message Date
Alexis Svinartchouk
bf29312ecf npm6, electron 1.8.8
Change-type: patch
2019-01-30 16:24:01 +01:00
Lorenzo Alberto Maria Ambrosi
9b76abe2ed Restored offline success-banner style
Change-type: patch
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2019-01-07 14:06:05 +01:00
Lorenzo Alberto Maria Ambrosi
64ec6d0e58
Convert flash results component to React
Change-type: minor
Changelog-entry: Added React component for the Flash Results button
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2018-12-19 16:02:38 +01:00
Lorenzo Alberto Maria Ambrosi
cf722427ab Restyle success screen and enlarge UI elements
Change-type: patch
Changelog-entry: Added React component for the Flash Another button
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2018-12-19 13:20:02 +01:00
Lorenzo Alberto Maria Ambrosi
afd888e14d
fix(GUI): Fix styling issues with buttons
Change-type: patch
Changelog-entry: Moved back the write cancel button
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2018-11-23 16:28:06 +01:00
Lorenzo Alberto Maria Ambrosi
76af6e975e Add flashing info while showing webview
Change-type: patch
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2018-11-23 13:19:47 +01:00
Lorenzo Alberto Maria Ambrosi
2017df9ec6 feat(GUI): Add featured-project component
Change-type: patch
Changelog-entry: Added featured-project while flashing
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
2018-11-22 22:05:11 +01:00
Lorenzo Alberto Maria Ambrosi
c366fbde22 Put flash cancel button in foreground
Change-type: patch
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>
2018-10-28 21:15:30 +01:00
amdomanska
b3aab5116a refactor(GUI): Convert Progress Button to Rendition
Convert progress-button component to Rendition

Change-type: minor
Signed-off-by: amdomanska <aga@resin.io>
2018-10-24 02:07:49 +02:00
Jonas Hermsmeier
fc22e9e28a
refactor(gui): Refactor file picker fs I/O
This refactors the experimental file picker to avoid fs i/o
in as many places as possible to improve performance.
Further, rendering performance is improved by avoiding unnecessary
element state changes invalidating components.
Also, recent files & favorites have been temporarily disabled
due to lack of need for Etcher Pro.

Change-Type: patch
2018-06-12 18:51:58 +02:00
Benedict Aas
5863319c0b
fix(GUI): file-picker performance and design improvements
- Replace onClick arrow functions in all components that use them for
  efficiency reasons: 300-500% speed-up
- Sort by folders and ignore case for better UX
- Remove use of `rendition.Button` in files, leading to a 10-20%
  performance increase when browsing files
- Proper sidebar width and spacing
- Recents and favorites are now filtered by existence async for a tiny
  performance improvement
- Make Breadcrumbs and Icon pure components to stop frequent re-rendering
- Initial support for array constraints
- Use first constraint as initial path instead of homedir if a
  constraint is set
- Use correct design height on modal, `calc(100vh - 20px)`
- Reset scroll position when browsing a new folder
- Fuse Bluebird `.map()` and `.reduce()` in
  `files.getAllFilesMetadataAsync`.
- Use `localeCompare`'s own case-insensitive option instead of calling
  `.toLowerCase()` twice on `n-2` files compared.
- Use 16px font sizes in sidebar and files to match design.
- Disable `$locationProvider.html5Mode.rewriteLinks`, which seemed to
  take 50ms of the directory changing time.
- Leave file extension as-is in `files.getFileMetadataSync` and the
  async counterpart for a very minor performance improvement.

Change-Type: patch
2018-05-30 12:39:59 +02:00
Jonas Hermsmeier
f312457f35
Merge pull request #2372 from resin-io/file-picker-drag-fix
fix(GUI): restrict webkit drag to header
2018-05-30 12:12:45 +02:00
Benedict Aas
f09faf6645
minifix(GUI): move success banner back down (#2367)
Change-Type: patch
2018-05-29 12:56:54 +01:00
Benedict Aas
117a7762e1 fix(GUI): restrict webkit drag to header
We ensure that the `-webkit-app-region` attribute is only set to `drag`
on the header element and we explicitly disable it on modals, as this
has unintended behaviour on a non-draggable window with touch-screens.

Change-Type: patch
2018-05-29 11:23:54 +01:00
Benedict Aas
c47878202d
feat(GUI): center content independent to window resolution (#2299)
We pave way for different sizes of Etcher windows by dynamically
centering the content with flexbox.

Connects-To: #2263
Closes: #2241
Change-Type: patch
Changelog-Entry: Center content independent to window resolution.
2018-05-23 20:10:02 +01:00
Benedict Aas
7782f94daa
feat(GUI): add electron-native file-picker component (#2333)
We add a file-picker written with Rendition/React. It is activated with
the `ETCHER_EXPERIMENTAL_FILE_PICKER` environment variable. Further
customisation can be done with the `ETCHER_FILE_BROWSER_CONSTRAIN_FOLDER`
variable that takes a path and allows one to constrain the file-picker to
a folder.

Related: https://github.com/resin-io/etcher/issues/2238
Related: https://github.com/resin-io/etcher/issues/2285
Change-Type: patch
Changelog-Entry: Add electron-native file-picker component.
2018-05-16 20:34:04 +01:00
Benedict Aas
35729fc36b
feat(GUI): use design background and drive size ordering (#2341)
We use the new design background color, and order the drive step size in
accordance with the new design as well.

Related: https://github.com/resin-io/etcher/issues/2310
Change-Type: patch
Changelog-Entry: Use new design background color and drive step size
ordering.
2018-05-15 14:23:33 +01:00
Benedict Aas
81a75ca955
feat(GUI): use new design blue and spacing (#2327)
We use the new design blue, spacing, and order of step buttons.

Closes: https://github.com/resin-io/etcher/issues/2310
Change-Type: patch
2018-05-14 15:58:45 +01:00
Benedict Aas
21cb7a4847
feat(GUI): env var toggle autoselecting all valid drives (#2306)
We introduce an environment variable
`ETCHER_DISABLE_EXPLICIT_DRIVE_SELECTION` that both enables
autoselection of drives and disables explicit drive selection by hiding
the buttons allowing this. All valid drives are autoselected, i.e. any
drive-image pair that does not result in an error, however warnings are
accepted.

Closes: https://github.com/resin-io/etcher/issues/2262
Change-Type: patch
Changelog-Entry: Introduce env var to toggle autoselection of all
drives.
2018-05-10 18:53:53 +01:00
Benedict Aas
2cdb6945ba
feat(GUI): show selected drives below drive step (#2309)
We add a list of selected drives below the drive selection step, able to
accommodate four lines of drives before scrolling occurs.

Closes: https://github.com/resin-io/etcher/issues/2263
Change-Type: patch
Changelog-Entry: Show selected drives below drive selection step.
2018-05-08 17:45:27 +01:00
Benedict Aas
674019ea75
feat(GUI): add button to cancel flash process (#2301)
We add a cancel button next to the flash progress bar that gracefully
aborts the flash process.

Closes: https://github.com/resin-io/etcher/issues/1791
Closes: https://github.com/resin-io/etcher/issues/2234
Closes: https://github.com/resin-io/etcher/issues/2245
Change-Type: patch
Changelog-Entry: Add a button to cancel the flash process.
2018-05-03 10:58:15 +01:00
Benedict Aas
c4d7076fe8 refactor: use word successful instead of succeeded
We replace 'succeeded' with 'successful' throughout the codebase.

Change-Type: patch
2018-04-23 18:31:44 +01:00
Benedict Aas
32bc615e78
feat(GUI): display succeeded and failed devices on finish screen (#2206)
We display the quantity of succeeded and failed devices using status
dots on the finish screen.

Change-Type: patch
Changelog-Entry: Display succeeded and failed device quantities on the
finish screen.
2018-04-17 15:52:02 +01:00
Benedict Aas
aeeb1d4294
feat(GUI): remove unnecessary status dots (#2202)
We remove usage of the status dots except when failed devices occur, in
which case we still display the red failed dot and quantity. We also use
singular and plural depending on the quantity of failed devices.

Change-Type: patch
2018-04-16 20:11:19 +01:00
Benedict Aas
7ceec47246
feat(GUI): make the progress button blue on verification (#2203)
We make the progress button blue on verification.

Change-Type: patch
Changelog-Entry: Make the progress button blue on verification.
2018-04-16 20:06:40 +01:00
Jonas Hermsmeier
0344a3f104
Merge pull request #2173 from resin-io/label-size-newline
fix(gui): Ensure image/drive size displayed on new line
2018-04-05 18:53:34 +02:00
Benedict Aas
c17247da58
feat(GUI): move drive selector warning to flash step (#1917)
We move the drive selector warning to the flash step, and concatenate
warning messages when more than one needs to be displayed at once.

Change-Type: patch
Changelog-Entry: Move the drive selector warning dialog to the flash step.
2018-04-05 17:26:16 +01:00
Jonas Hermsmeier
f958f3751d
fix(gui): Ensure image/drive size displayed on new line
This forces the image and device size to always be displayed on the
second line for visual consistency.

Change-Type: patch
2018-04-05 16:52:26 +02:00
Benedict Aas
99f819dfbf
minifix: add spacing to drive warning icon (#2169)
Change-Type: patch
Changelog-Entry: Add spacing to the drive warning icon.
2018-04-04 14:53:20 +01:00
Benedict Aas
3498d59258 fix(GUI): line wrap selector size subtitles wholly
We line wrap the main-page image and drive size labels as a whole
instead of partially, if the drive or image title is long enough for a
line wrap.

Change-Type: patch
Changelog-Entry: Line wrap selector size subtitles wholly
2018-03-29 15:45:38 +01:00
Benedict Aas
cf340f48c3 fix(GUI): fix status dots to their position
We ensure the status dots don't move about and stick to their position
by using absolute positioning relative to its parent element.

Change-Type: patch
Changelog-Entry: Fix status dots to their position.
2018-03-23 17:33:32 +00:00
Benedict Aas
4140d49db3
refactor: multi-writes preparatory changes (#2124)
We add some preparatory changes including new utility functions, as well
as changes throughout the codebase that reflect the change from single
drives to a list of drives, given multi-writes is coming.

Change-Type: patch
Changelog-Entry: Various preparatory changes to account for
multi-writes.
2018-03-23 14:36:39 +00:00
Benedict Aas
835f2cf769
feat(GUI): add colorised multi-writes progress status dots (#2115)
We add colorised progress status dots with quantities of `flashing`,
`validating`, `succeeded`, and `failed` devices.

Change-Type: patch
Changelog-Entry: Add colorised multi-writes progress status dots.
2018-03-14 17:05:01 +00:00
Benedict Aas
faf9b113a9
feat(CSS): use roboto font instead of helvetica (#2114)
We replace Helvetica with Roboto as the main font.

Change-Type: patch
Changelog-Entry: Replace Helvetica as the main font with Roboto.
2018-03-12 16:38:01 +00:00
Benedict Aas
a56755e2c6
feat(GUI): add spacing to drive-selector labels (#2059)
We add a right margin to the drive-selector labels so they look nicer
when there are multiple.

Change-Type: patch
Changelog-Entry: Add spacing to the drive-selector warning/error labels.
2018-02-20 21:07:13 +00:00
Benedict Aas
b1b82301d9
fix(GUI): make all class label text bold (#2060)
We make all tags with `.label` have bold text and remove the need for
`<b>` tags.

Change-Type: patch
Changelog-Entry: Make all `.label` tags' text bold and remove need for `<b>` tags.
2018-02-19 18:38:03 +00:00
Benedict Aas
fdf15f53d7
feat(GUI): warning makes drive-selector button orange (#2044)
We make the drive-selector button orange when there is a warning attached
to the image-drive pair.

Change-Type: patch
Changelog-Entry: Make the drive-selector button orange on warnings.
2018-02-19 11:27:30 +00:00
Jonas Hermsmeier
19275a5ba4
fix(gui): Disable outlines (#1854)
For the time being, the focus outlines are removed, until
we can improve the UX on this.

Change-Type: patch
2017-11-17 13:33:19 +01:00
Benedict Aas
f2f5955264 feat(GUI): use tabindex and focus to navigate (#1745)
* feat(GUI): use tabindex and focus to navigate

We make navigating with the tab key easier by highlighting focused
elements more visibly, adding `tabindex` attributes to elements, and
making `open-external` links respond to keyboard events.

Change-Type: minor
Changelog-Entry: Improve tab-key navigation through tabindex and visual improvements.
Connects-To: https://github.com/resin-io/etcher/issues/1734

* outline with 10s timeout

* use orange "warning colour" as outline

* smaller outline on settings buttons, fix order on settings page

* allow selection in drive-selector

* fix typo, better tabindexes
2017-10-27 20:41:47 +02:00
Benedict Aas
2556807166 feat(GUI): add optional progress bars to drive-selector drives (#1800)
We show a progress bar for any drive objects with a `progress` field
that isn't falsy, e.g. `undefined` or `0`.

Changelog-Type: minor
Changelog-Entry: Add optional progress bars to drive-selector drives.
2017-10-24 14:43:43 -04:00
Niklas Higi
6acfcfd23c fix(GUI): make sure progress button is always rounded (#1768)
At the moment the progress button which has slightly rounded corners
allows the "__bar" to overflow. This causes the corners to become
angular again which looks weird. I set the button's "overflow" to
"hidden" to fix this issue.

Changelog-Entry: Make sure the progress button is always rounded.
Change-Type: patch
2017-10-14 14:41:00 +02:00
Juan Cruz Viotti
78fdc5b07e feat(GUI): add some branding to usbboot-discovered devices (#1764)
- Add a nice icon in the drive selector dialog when a device has been
  discovered through usbboot

- Change the name of usbboot-initialized devices to "Compute Module"

Change-Type: minor
Changelog-Entry: Add eye candy to usbboot initialized devices.
Signed-off-by: Juan Cruz Viotti <jv@jviotti.com>
2017-10-11 03:53:34 +01:00
Benedict Aas
de63d534c5 fix(GUI): make disabled svgs work in img tags (#1661)
SVGs are displayed through IMG tags, but these do not support CSS
`fill`, and as such we work around it with `opacity`.
2017-08-03 12:30:00 -04:00
Benedict Aas
7714e8b50a fix(GUI): make archive-embedded svgs work again (#1642)
We make the svg-icon component accept XML in its path argument to handle
archive-embedded SVG icons.

Changelog-Entry: Make archive-embedded SVG icons work again.
Fixes: https://github.com/resin-io/etcher/issues/1636
2017-08-01 12:34:06 -04:00
Benedict Aas
a7d713c323 feat(GUI): rewrite svg-icon directive in react (#1464)
We change from using an Angular directive to using React through
react2angular in the SVGIcon module.
2017-06-12 08:42:52 -04:00
Jonas Hermsmeier
ce50364b9f upgrade(package): Update node-sass to 4.5.3 (#1489)
This updates node-sass from v3.x to v4.x in anticipation
of addition of Electron ABI versions in an upcoming version.

Change-Type: patch
2017-06-05 18:38:19 +02:00
Benedict Aas
b56a39e576 style(GUI): normal weight message on success page (#1469)
We make the fonts a regular weight instead of bold on the success page's
fallback banner.

Changelog-Entry: Minor style improvements to the fallback success page banner.
2017-05-30 09:36:33 -04:00
Benedict Aas
7898358617 fix(GUI): stop settings overflow into footer (#1468)
By removing the 'advanced' sub-header we stop the settings from
overflowing into the footer.

Fixes: https://github.com/resin-io/etcher/issues/1383
Changelog-Entry: Remove "Advanced" settings subtitle.
2017-05-30 09:34:45 -04:00
Benedict Aas
dcb152aa00 fix(GUI): don't break up size number in drive selector (#1467)
We make the size number in the drive selector stay whole through
the `word-break: keep-all` CSS property, ensuring that it doesn't
partially overflow to the next line.

See: https://github.com/resin-io/etcher/issues/1437
Changelog-Entry: Don't break up size numbers in the drive selector.
2017-05-26 07:36:32 -04:00
Juan Cruz Viotti
1e169315fd refactor(GUI): turn the update notifier modal into a native dialog (#1359)
Electron v1.6.1 introduced checkbox support to the native message
dialog, giving us everything that was needed to implement the update
notifier modal using a native dialog.

This change allows us to get rid of a lot code.

See: https://github.com/electron/electron/pull/8590
Change-Type: patch
Changelog-Entry: Turn the update notifier modal into a native dialog.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
2017-05-23 19:06:35 -04:00