There are a lot of new rules since the last time I revised the ESLint
rules documentation.
I've updated the main `.eslintrc.yml` to include some newer additions,
plus I added another ESLint configuration file inside `tests`, so we can
add some stricted rules to the production code while relaxing them for
the test suite (due to the fact that Mocha is not very ES6 friendly and
Angular tests require a bit of dark magic to setup).
This is a summary of the most important changes:
- Disallow "magic numbers"
These should now be extracted to constants, which forces us to think of
a good name for them, and thus make the code more self-documenting (I
had to Google up the meaning of some existing magic numbers, so I guess
this will be great for readability purposes).
- Require consistent `return` statements
Some functions relied on JavaScript relaxed casting mechanism to work,
which now have explicit return values. This flag also helped me detect
some promises that were not being returned, and therefore risked not
being caught by the exception handlers in case of errors.
- Disallow redefining function arguments
Immutability makes functions easier to reason about.
- Enforce JavaScript string templates instead of string concatenation
We were heavily mixing boths across the codebase.
There are some extra rules that I tweaked, however most of codebase
changes in this commit are related to the rules mentioned above.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
- The type in `@type` should be surrounded by curly braces
- We should use `@type` in some cases where we used `@property`
- `@module` descriptions should go above such tag
- Namespaces should not declare their access type
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
Etcher checks what is the latest version by making an HTTP request to S3
in order to see if it should present the update notifier modal at
startup.
If the user is not connected to the internet, or is on an unstable
connection, the request might fail completely or timeout, leading to a
weird error message being presented to the user:
```json
{
"data": null,
"status": -1,
"config": {
"method": "GET",
"transformRequest": [null],
"transformResponse": [null],
"url": "https://resin-production-downloads.s3.amazonaws.com",
"headers": {
"Accept": "application/json, text/plain, */*"
}
},
"statusText": ""
}
```
To solve the error, we tweak `UpdateNotifierService.getLatestVersion()`
to resolve the current version if there was a problem making the request
(e.g: the response didn't come through at all), which after some
experimentation, we can check by comparing the `status` property with
`-1`.
This error happens in all operating systems, and currently is trending
on TrackJS.
Change-Type: patch
Changelog-Entry: Fix `transformRequest` error at startup when not connected to the internet, or when on an unstable connection.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
This is a small step towards unifying all the modal skeletons that we
use through the application.
By moving the checkbox to the modal body we can declare the footer and
the header once in a single place.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
Some button texts are all uppercase, while the remaining of them are
capitalised. This commit capitalises all button texts for consistency
purposes.
Fixes: https://github.com/resin-io/etcher/issues/881
Change-Type: patch
Changelog-Entry: Normalize button text casing.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
We show the Etcher version string in the update notifier modal, by giving
the version string to the template through options similar to the warning
modal.
- We memoize the version Promise and assume the update version won't change
during runtime.
Changelog-Entry: Show available Etcher version in the update notifier.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
We add a blue clickable link to the Github changelog in the update dialog
modal.
Closes: https://github.com/resin-io/etcher/issues/905
Change-Type: patch
Changelog-Entry: Add a changelog link to the update notifier modal.
Every modal in the application should contain the same "close" X at the
top right corner, for consistency purposes. The only modal lacking this
button was the update notifier modal.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
Despite all modals sharing the same design and layout, each of theme is
being styled separately, when most of the CSS rules can be moved and
generified to `_modal.scss` and re-used by all of them.
This PR also moves `lib/gui/scss/components/_modal.scss` to the "Modal"
Angular's module.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
This is a big PR that extracts out a sensible set of SCSS color
variables that can be used to customise Etcher's look.
To achieve such goal, the following changes were introduced:
- Create a separate `lib/gui/scss/modules/_theme.scss` to conveniently
hold all SCSS color variables.
- Decouple button styles from Bootstrap's `.btn`.
- Stop configuring Bootstrap colors as a whole using the SCSS variables
it exposes and instead declare them directly in the modules that make
use of them.
- Normalize all modal layouts into one. We had like 3 different modal
layouts, each with their own title/body colors, etc. To simplify the
color palette, we make use of a single modal layout everywhere.
- Remove `.progress-button--primary`. `.progress-button` is now
"primary" by default.
- Be precise about `tick` foreground colors.
- Rename `.label-default` to `.label-inset`.
Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>
When the user clicks on the backdrop of a modal, the modal promise gets
rejected, therefore triggering our application error handler.
UI Bootstrap provides a way to disable the backdrop completely, but
doesn't provide a way to allow a backdrop click to simply close the
modal rather than rejecting it, as if an issue happened.
To mitigate this issue, and still preserve the backdrop functionality,
we created `ModalService`, which abstracts the messy details of calling
`$uibModal`, and has custom logic to ignore "backdrop click" errors.
Change-Type: patch
Changelog-Entry: Fix "backdrop click" uncaught errors on modals.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
The code that performs an HTTP request to the S3 bucket where released
are stored and determines which is the latest available version was
extracted to a separate module called `etcher-latest-version`, mainly
for the website to be able to re-use this functionality.
See: https://github.com/resin-io-modules/etcher-latest-version
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
JSCS has merged with ESLint. This is the perfect excuse to move to
ESLint and unify both JSHint and JSCS hints under ESLint.
This PR also deprecates `gulp lint` in favour of `npm run lint`.
See: https://medium.com/@markelog/jscs-end-of-the-line-bc9bf0b3fdb2#.zbuwvxa5y
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
Since the addition of Redux and ImmutableJS data structures, we store
the application settings in the Redux store.
This means that checkboxes on templates can no longer bind to the
setting properties directly.
This was fixed in the setting page, but we missed one of them in the
update notifier model.
```html
ng-model="modal.settings.get('sleepUpdateCheck')"
```
Won't lead any meaningful return, and in fact, throws an uncaught
exception.
Changelog-Entry: Fix uncaught exception when showing the update notifier modal.
Change-Type: patch
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
* refactor: getter/setter interface for SettingsModel
This PR introduces a getter/setter interface for `SettingsModel`, which
replaces the old way of managing setting values by simply assigning
properties to an object.
This is the first step towards moving the settings functionality to the
Redux store.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
* refactor: store settings in redux store
The state data structure now contains a property called `settings`,
which is a map containing all setting values.
The list of supported settings can be calculated by retrieving the keys
from the `settings` object, which means that if we support a setting, we
must include a default.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
* feat: store settings in localStorage
This functionality was deleted by acb0de2 when moving the settings
object to the redux store, promising that the feature will be added back
in a future commit.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
ES6 fat arrows provide reasonable `this` behaviour, which protects us
from some subtle accidental bugs, and erradicates `const self = this`
from the codebase.
Far arrows were not applied in Mocha code and AngularJS
controllers/services constructors since these frameworks rely on
`.bind()` on those functions.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
Currently, the modal style style used in this component was declared in
`components/_modal.scss`, however since this srule is very specific to
the update notifier component, its better declared in
`update-notifier/styles`.
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
Auto-update functionality is not ready for usage. As a workaround to
prevent users staying with older versions, we now check for updates at
startup, and if the user is not running the latest version, we present a
modal informing the user of the availiblity of a new version, and
provide a call to action to open the Etcher website in his web browser.
Extra features:
- The user can skip the update, and tell the program to delay the
notification for 7 days.
Misc changes:
- Center modal with flexbox, to allow more flexibility on the modal height.
interacting with the S3 server.
- Implement `ManifestBindService`, which now serves as a backend for the
`manifest-bind` directive to allow the directive's functionality to be
re-used by other services.
- Namespace checkbox styles that are specific to the settings page.
Fixes: https://github.com/resin-io/etcher/issues/396
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
