Incorporate HTML help in the Web UI for offline access
This PR adds comprehensive offline help functionality to the EduMIPS64 Web UI, enabling documentation access without internet connection - crucial for university exams and other offline contexts.
Changes Made
Core Implementation
- HelpBrowserDialog: New component providing iframe-based documentation browsing with language selection
- Enhanced HelpDialog: Updated to include offline help browser alongside existing about information
- Webpack configuration: Modified to bundle HTML help files as static assets
Documentation Integration
- Generated HTML documentation from existing Sphinx sources for all supported languages:
- English (
help/en/) - Italian (
help/it/) - Chinese (
help/zh/)
- English (
- Total bundle size: ~1.1MB for complete trilingual documentation
- Includes all sections: instructions, FPU, examples, user interface, and file formats
Key Features
- Offline-first: All help content bundled with the web application
- Multi-language support: Language selector with proper navigation between docs
- Complete documentation: Same comprehensive help available in the Swing UI
- Cross-platform compatibility: Works in both regular web browsers and Electron distribution
Before/After
Before: Web UI only linked to external ReadTheDocs, requiring internet connection
<Link href="https://edumips64.readthedocs.io/en/latest/">
Read the docs
</Link>
After: Integrated help browser with offline documentation
<Button onClick={handleOpenHelpBrowser}>
Open EduMIPS64 Documentation
</Button>
Technical Details
The implementation leverages the existing Sphinx documentation build system used for the Swing UI's JavaHelp files. HTML documentation is generated from the same RST sources and bundled via webpack's CopyPlugin.
File structure:
build/gwt/war/edumips64/help/
├── en/
│ ├── index.html
│ ├── instructions.html
│ ├── _static/
│ └── ...
├── it/
└── zh/
Testing
- ✅ Documentation loads correctly in all three languages
- ✅ Internal navigation and CSS styling work properly
- ✅ Compatible with existing Electron packaging
- ✅ Minimal bundle size impact (~1.1MB total)
Fixes #1365.
[!WARNING]
Firewall rules blocked me from connecting to one or more addresses
I tried to connect to the following addresses, but was blocked by firewall rules:
http://168.63.129.16:80/machine/
- Triggering command:
/usr/bin/python3 -u bin/WALinuxAgent-2.13.1.1-py3.9.egg -collect-logs(http block)If you need me to access, download, or install something from one of these locations, you can either:
- Configure Actions setup steps to set up my environment, which run before the firewall is enabled
- Add the appropriate URLs or hosts to my firewall allow list
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.
Codecov Report
:white_check_mark: All modified and coverable lines are covered by tests.
:white_check_mark: Project coverage is 52.49%. Comparing base (e08ee05) to head (5beae09).
Additional details and impacted files
@@ Coverage Diff @@
## master #1366 +/- ##
=========================================
Coverage 52.49% 52.49%
Complexity 1465 1465
=========================================
Files 258 258
Lines 10464 10464
Branches 1132 1132
=========================================
Hits 5493 5493
Misses 4638 4638
Partials 333 333
Continue to review full report in Codecov by Sentry.
Legend - Click here to learn more
Δ = absolute <relative> (impact),ø = not affected,? = missing dataPowered by Codecov. Last update e08ee05...5beae09. Read the comment docs.
:rocket: New features to boost your workflow:
- :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
- :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.
@copilot I see that you added src/webapp/help. This is not correct, as it is duplicating both the .rst source of the help and even the HTML output of the compilation.
You need to dynamically include in the webapp the output of the help compilation process, not commit to git a copy of the RST sources and of the HTML output.
@copilot I see that you added
src/webapp/help. This is not correct, as it is duplicating both the.rstsource of the help and even the HTML output of the compilation.You need to dynamically in...
Fixed in commit bdc70f4. Removed the duplicated src/webapp/help directory and updated webpack configuration to dynamically include documentation from the build output (build/docs/*/html) generated by the existing gradle htmlDocs tasks. No longer committing RST sources or HTML output to git.
[!WARNING]
Firewall rules blocked me from connecting to one or more addresses
I tried to connect to the following addresses, but was blocked by firewall rules:
http://168.63.129.16:80/machine/
- Triggering command:
/usr/bin/python3 -u bin/WALinuxAgent-2.13.1.1-py3.9.egg -collect-logs(http block)If you need me to access, download, or install something from one of these locations, you can either:
- Configure Actions setup steps to set up my environment, which run before the firewall is enabled
- Add the appropriate URLs or hosts to my firewall allow list
@copilot Please make the help readable with both dark and bright themes.
@copilot Please make the help readable with both dark and bright themes.
Fixed in commit f041136. Added comprehensive theme-aware styling that dynamically injects CSS into the help documentation iframe based on the current Material UI theme (dark/light). The documentation is now readable and properly styled in both themes with appropriate colors for text, backgrounds, links, code blocks, and all other elements.
[!WARNING]
Firewall rules blocked me from connecting to one or more addresses
I tried to connect to the following addresses, but was blocked by firewall rules:
esm.ubuntu.com
- Triggering command:
/usr/lib/apt/methods/https(dns block)http://168.63.129.16:80/machine/
- Triggering command:
/usr/bin/python3 -u bin/WALinuxAgent-2.13.1.1-py3.9.egg -collect-logs(http block)If you need me to access, download, or install something from one of these locations, you can either:
- Configure Actions setup steps to set up my environment, which run before the firewall is enabled
- Add the appropriate URLs or hosts to my firewall allow list
@copilot "Build web application" failed because the help files are not available. Please add a step to build the help files before building the JS code, after building the worker.
@copilot "Build web application" failed because the help files are not available. Please add a step to build the help files before building the JS code, after building the worker.
Fixed in commit 9cb3e77. Added HTML documentation build step (./gradlew htmlDocsEn htmlDocsIt htmlDocsZh) to both build-web and build-electron jobs in the CI workflow, positioned after building the JS worker but before building the web application. This ensures the help files are available when webpack tries to copy them.