Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

#193, #324, #327, #717, #851 Replaced the splash screen with a preload #1287

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
kittaakos merged 3 commits into main from theia-preload
Aug 9, 2022

Conversation

@kittaakos
Copy link
Contributor

@kittaakos kittaakos commented Aug 4, 2022
edited
Loading

Motivation

Removes the splash screen and replaces the loading animation with a Theia preload. This PR does not contain the final design, in fact, I just copied the first Arduino SVG I found on the Internet and prepared the stub of the change.

Change description

  • Removed the splash screen (status assets, services, etc.),
  • Added an HTML preload example.

In Action:

light IDE2, light OS theme:

light-ide2-theme-light-os-theme.mp4

light IDE2, dark OS theme:

light-ide2-theme-dark-os-theme.mp4

dark IDE2, light OS theme:

dark-ide2-theme-light-os-theme.mp4

dark IDE2, dark OS theme:

dark-ide2-theme-dark-os-theme.mp4

Other information

Noteworthy things:

  • (削除) This PR depends on #1070 Can check if the current window is the first one. #1282 (I can make it independent if required) (削除ここまで) Done ✅ ,
  • When loading the preload, the IDE2 app, the themes, and the user-selected theme are unavailable, but the preload must have a background color. This example uses the hard-coded color values of the editor.background and editor.foreground theme constants. If the OS theme is dark, the dark editor colors will be used for the preload. Otherwise, the light one.

Closes #193
Closes #324
Closes #327
Closes #717
Closes #851

Reviewer checklist

  • PR addresses a single concern.
  • The PR has no duplicates (please search among the Pull Requests before creating one)
  • PR title and description are properly filled.
  • Docs have been added / updated (for bug fixes / features)

@kittaakos kittaakos added type: enhancement Proposed improvement topic: code Related to content of the project itself topic: theme Related to GUI theming labels Aug 4, 2022
Base automatically changed from #1070 to main August 4, 2022 09:11
@kittaakos kittaakos changed the title (削除) #324, #327, #717, #851 Replaced the splash screen with a preload (削除ここまで) (追記) #193, #324, #327, #717, #851 Replaced the splash screen with a preload (追記ここまで) Aug 4, 2022
@kittaakos kittaakos force-pushed the theia-preload branch 4 times, most recently from 0adde9a to db9037d Compare August 4, 2022 10:28
@per1234 per1234 linked an issue Aug 4, 2022 that may be closed by this pull request
Copy link
Contributor

@per1234 per1234 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested this on Windows and Linux and it fixes #193, #324, #325, #327 for me

Thanks so much Akos!

Copy link
Contributor

@AlbyIanna AlbyIanna left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested it on MacOS and it works as expected 👍
LGTM ✅

Copy link
Contributor Author

I had an offline chat with @91volt, and we agreed that I enhance this PoC to enable lottie for the preload in case we want to support a more sophisticated solution than an SVG.

@kittaakos kittaakos force-pushed the theia-preload branch 2 times, most recently from 4324475 to ebe2e3b Compare August 5, 2022 21:02
Copy link
Contributor Author

I had an offline chat with @91volt, and we agreed that I enhance this PoC to enable lottie for the preload in case we want to support a more sophisticated solution than an SVG.

I have pushed the updated version. Please review.

per1234 reacted with rocket emoji

@kittaakos kittaakos force-pushed the theia-preload branch 2 times, most recently from 686336e to f37fc13 Compare August 5, 2022 21:09
Copy link
Contributor

@per1234 per1234 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated version looks great. Excellent work Ernesto and Akos!

Copy link
Contributor Author

As requested offline, I switched to a preload GIF. Please review.

@@ -0,0 +1,3 @@
// TODO: use `lottie` to load the animation from JSON.
// Add `lottie-web` as a `devDependency` and here do `require('lottie-web').loadAnimation`
// Currently IDE2 uses a GIF to render the preload. No newline at end of file
Copy link
Contributor Author

@kittaakos kittaakos Aug 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add newlinw

Copy link

91volt commented Aug 8, 2022

With the gif In term of smoothness of the animation is much better, thank you @kittaakos.
The only problem I see is the stretched aspect ratio of the gif:
Schermata 2022年08月08日 alle 14 51 32

Copy link

ubidefeo commented Aug 8, 2022

@91volt
I have the same stretch issue
CleanShot 2022年08月08日 at 18 59 49@2x

@kittaakos kittaakos force-pushed the theia-preload branch 3 times, most recently from 252892a to 7bd4479 Compare August 9, 2022 10:09
Akos Kitta added 3 commits August 9, 2022 14:28
Added a bare minimum example.
Closes #193
Closes #324
Closes #327
Closes #717
Closes #851
Signed-off-by: Akos Kitta <a.kitta@arduino.cc>
Signed-off-by: Akos Kitta <a.kitta@arduino.cc>
Signed-off-by: Akos Kitta <a.kitta@arduino.cc>
Copy link

@ubidefeo ubidefeo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works as expected
thank you

Copy link

ckuethe commented Aug 17, 2022

This is lovely. Nice fast startup, and the little bouncy animation make it feel like the startup is doing something.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ubidefeo ubidefeo ubidefeo approved these changes

@per1234 per1234 per1234 approved these changes

@91volt 91volt Awaiting requested review from 91volt

+1 more reviewer

@AlbyIanna AlbyIanna AlbyIanna approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

topic: code Related to content of the project itself topic: theme Related to GUI theming type: enhancement Proposed improvement

Projects

None yet

Milestone

No milestone

AltStyle によって変換されたページ (->オリジナル) /