feat: add CLion plugin recommendation and enhance IDE usage guides#8
feat: add CLion plugin recommendation and enhance IDE usage guides#8
Conversation
- Add CLion plugin recommendation modal with installation instructions - Add comprehensive usage guides for Red Panda C++ - Update Code::Blocks and Dev-C++ usage guide content - Rename 'Red Panda (MinGW)' to 'Red Panda C++' throughout - Add 'Usage Guide' buttons for CodeBlocks, Dev-C++, and Red Panda - Change 'Install' button to 'Reinstall' when EGE is already installed - Add new documentation images for CLion and Red Panda workflows - Improve pngquant caching in optimize-images script This update enhances user experience by providing better guidance for different IDEs and improving the clarity of installation status.
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. Walkthrough将若干使用指南文案由“安装成功”改为“关于本指南”，新增并统一 CodeBlocks/Dev-C++/Red Panda/CLion 的使用说明模态与前端交互，调整 Red Panda 显示名为 “Red Panda C++”，重构 pngquant 检测/缓存/下载与回退逻辑，并添加 VSCode 调试任务。 Changes
Sequence Diagram(s)sequenceDiagram
participant User as 用户
participant UI as 安装器 UI (src/ui.js)
participant Installer as 安装流程 (doInstall / proceedWithInstall)
participant PluginPage as CLion 插件页
User->>UI: 点击“安装”（CLion）
UI->>Installer: doInstall(index, isFound)
Installer->>UI: 请求显示 CLion 插件模态 (pendingClionInstall = true)
UI->>User: 显示 CLion 插件模态（打开插件页 / 继续安装）
User->>UI: 选择“打开插件页”
UI->>PluginPage: openClionPluginPage()（在浏览器打开）
User->>UI: 在模态中选择“继续安装”
UI->>Installer: proceedWithInstall(index, isFound)
Installer->>UI: 返回安装结果
UI->>User: 显示结果并可能弹出使用指南模态
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Suggested labels
诗
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
🤖 Augment PR SummarySummary: This PR enhances the installer’s IDE guidance, adding CLion plugin recommendations and improving “how to use EGE” documentation. Changes:
Technical Notes: CLion installs now pause on a modal prompt before continuing; Red Panda installs can surface a usage-guide entry point after success. 🤖 Was this summary useful? React with 👍 or 👎 |
![augmentcode[bot]](https://avatars.githubusercontent.com/in/1027498?s=60&v=4){kind=small}
|
|
||
| // 使用说明按钮（CodeBlocks、Dev-C++、Red Panda 始终显示，无论是否安装） | ||
| if (hasUsageGuide) { | ||
| html += '<button class="btn btn-guide" onclick="showUsageGuide(' + index + ', ' + isFound + ')">使用说明</button>'; |
There was a problem hiding this comment.
With the new “使用说明” button, showInstallGuide()/installGuideModal no longer seem reachable from the UI, so MinGW/CLion users may lose the in-app linker-flags guidance after a successful install.
Severity: medium
Other Locations
src/ui.js:1360src/setup.hta:1342
🤖 Was this useful? React with 👍 or 👎, or 🚀 if it prevented an incident/outage.
| # 解压 | ||
| Expand-Archive -Path $zipPath -DestinationPath $tempDir -Force | ||
| # 创建项目 temp 目录 | ||
| New-Item -ItemType Directory -Path $projectTempDir -Force | Out-Null |
There was a problem hiding this comment.
Because $ErrorActionPreference = "Stop", failures creating/writing $projectTempDir (e.g., repo is read-only) will terminate the script before it can fall back to the .NET optimization path.
Severity: medium
🤖 Was this useful? React with 👍 or 👎, or 🚀 if it prevented an incident/outage.
There was a problem hiding this comment.
Pull request overview
This PR enhances the installer UI/UX and documentation to better guide users across multiple IDE workflows, including a new CLion plugin recommendation flow and dedicated usage guides for several IDEs.
Changes:
- Add a CLion plugin recommendation modal and updated install flow gating CLion installs behind the recommendation prompt.
- Add dedicated “使用说明” entry points (and new modals) for Code::Blocks / Dev-C++ / Red Panda C++, plus install/reinstall button state handling.
- Improve image optimization script by caching
pngquant.exein the projecttemp/directory and update documentation content + screenshots.
Reviewed changes
Copilot reviewed 6 out of 12 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| src/ui.js | Adds usage-guide entry point, CLion plugin modal flow, install/reinstall state logic, and Red Panda guide modal hooks. |
| src/setup.hta | Adds CLion plugin modal + Red Panda guide modal, updates Code::Blocks/Dev-C++ guide modals, and includes new screenshots. |
| src/detector.js | Standardizes detected IDE name to “Red Panda C++”. |
| scripts/optimize-images.ps1 | Caches downloaded pngquant under project temp/ instead of OS temp. |
| assets/docs/images/redpanda_new_proj.png | Adds Red Panda workflow screenshot. |
| assets/docs/images/devcpp_new_proj.png | Adds/updates Dev-C++ workflow screenshot. |
| assets/docs/images/codeblocks_user_template.png | Adds/updates Code::Blocks workflow screenshot. |
| assets/docs/devcpp-usage.md | Updates Dev-C++ usage guide intro wording/structure. |
| assets/docs/codeblocks-usage.md | Updates Code::Blocks usage guide intro wording/structure. |
src/ui.js
Outdated
| var installBtnText = (ide.egeInstalled && ide.found) ? '重新安装' : '安装'; | ||
| var installBtnTitle = (ide.egeInstalled && ide.found) ? '点击可重新安装 EGE 库' : '安装 EGE 库到此开发环境'; | ||
|
|
||
| html += '<button class="btn btn-install" onclick="doInstall(' + index + ', ' + isFound + ')" ' + installDisabled + ' title="' + installBtnTitle + '">' + installBtnText + '</button>'; | ||
|
|
There was a problem hiding this comment.
renderIDEItem 里将 ide.name / displayPath / installBtnTitle 直接拼接进 HTML（包含属性值），但这些值来自注册表/文件系统路径时可能包含引号或尖括号，导致 HTA 内的 DOM 注入/XSS（尤其是从 HKCU 读到的可被低权限用户写入的注册表值）。建议在拼接前做统一的 HTML/属性转义，或改用 createElement + textContent/setAttribute 来构建节点。
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In @.vscode/tasks.json:
- Around line 68-97: The PowerShell args for the "Enable Debug Mode" and
"Disable Debug Mode" tasks use single-quoted strings ('...$env:TEMP...') so
$env:TEMP is not expanded; update the args entries for the tasks labeled "Enable
Debug Mode" and "Disable Debug Mode" to use double-quoted PowerShell strings
(escape them in the JSON as \"...\") or remove the quotes so $env:TEMP expands
correctly (e.g., change '$env:TEMP\\.ege-debug' and
'$env:TEMP\\ege_installer_log.txt' to use \"...\"), ensuring the created/removed
.ege-debug file is placed in the actual TEMP folder that src/setup.hta checks.
In `@src/setup.hta`:
- Around line 1474-1481: Update the anchor that opens the Red Panda site to use
HTTPS instead of HTTP: locate the <a> element whose onclick calls
openUrl('http://royqh.net/redpandacpp/') (the guide-link anchor near the Red
Panda text) and change the URL string to 'https://royqh.net/redpandacpp/' so the
onclick passes the secure URL to openUrl.
🧹 Nitpick comments (3)
src/ui.js (3)
640-663: CLion 安装流程中重新安装会经历两次确认。当 CLion 已安装 EGE 时，用户点击"重新安装"会先触发第 647-652 行的重新安装确认弹窗，然后再显示第 658 行的插件推荐模态窗口。连续两次确认可能影响用户体验。
可考虑将重新安装确认合并到 CLion 插件推荐模态窗口的提示文案中，减少一次交互步骤。
687-718: Red Panda 安装成功后的使用说明触发方式与 CodeBlocks/Dev-C++ 不一致。CodeBlocks 和 Dev-C++ 通过
Installer.install回调参数（showCodeBlocksGuide、showDevCppGuide）判断是否显示使用说明按钮，而 Red Panda 直接检查ide.type === 'redpanda'（第 712 行）。功能上没有问题，但如果后续需要在Installer中控制是否显示 Red Panda 指南（例如安装部分失败时不显示），当前方式无法支持。建议后续统一为回调参数模式，保持一致性。
1355-1408:showUsageGuide和showInstallGuide的路由逻辑存在重复。
showUsageGuide（第 1358-1381 行）和showInstallGuide（第 1386-1408 行）对codeblocks、devcpp、redpanda三种类型执行了完全相同的分发逻辑。当前showInstallGuide对这三种类型的处理与showUsageGuide完全一致。可考虑在
showInstallGuide中对已有 usage guide 的类型直接委托给showUsageGuide，减少重复：♻️ 减少重复的建议
function showInstallGuide(index, isFound) { var ide = isFound ? detectedIDEs[index] : notFoundIDEs[index]; if (!ide) return; var type = ide.type; - // CodeBlocks 直接显示详细的使用指南窗口 - if (type === 'codeblocks') { - showCodeBlocksGuideModal(); - return; - } - - // Dev-C++ 显示详细的使用指南窗口 - if (type === 'devcpp') { - showDevCppGuideModal(); - return; - } - - // Red Panda 显示详细的使用指南窗口 - if (type === 'redpanda') { - showRedPandaGuideModal(); + // 有使用指南的 IDE 统一走 showUsageGuide + if (type === 'codeblocks' || type === 'devcpp' || type === 'redpanda') { + showUsageGuide(index, isFound); return; } var bodyHtml;
| <p> | ||
| <a href="javascript:void(0)" class="guide-link" | ||
| onclick="openUrl('http://royqh.net/redpandacpp/'); return false;">Red Panda 官网</a> · | ||
| <a href="javascript:void(0)" class="guide-link" onclick="openUrl('https://xege.org/'); return false;">EGE | ||
| 官网</a> · | ||
| <a href="javascript:void(0)" class="guide-link" | ||
| onclick="openUrl('https://github.com/wysaid/xege'); return false;">GitHub 源码</a> | ||
| </p> |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
cat -n src/setup.hta | sed -n '1474,1481p'Repository: x-ege/ege-installer
Length of output: 602
🌐 Web query:
royqh.net/redpandacpp HTTPS support
💡 Result:
royqh.net/redpandacpp does have HTTPS support—the site is reachable on HTTPS at least for key sections like:
- Downloads:
https://royqh.net/redpandacpp/download/[1] - Docs:
https://royqh.net/redpandacpp/docsy/docs/...[2]
Some project pages/documentation still reference the HTTP URL (for example, the RedPanda-CPP GitHub README lists http://royqh.net/redpandacpp) [3], but you can generally switch those links to https:// when accessing the site.
Sources: [1] [2] [3]
将 Red Panda 官网链接改为 HTTPS。
第 1476 行使用 http://royqh.net/redpandacpp/，该站点已支持 HTTPS。为保持一致性且避免潜在的中间人攻击风险，建议改为 https://royqh.net/redpandacpp/（同文件中其他外部链接已使用 HTTPS）。
🤖 Prompt for AI Agents
In `@src/setup.hta` around lines 1474 - 1481, Update the anchor that opens the Red
Panda site to use HTTPS instead of HTTP: locate the <a> element whose onclick
calls openUrl('http://royqh.net/redpandacpp/') (the guide-link anchor near the
Red Panda text) and change the URL string to 'https://royqh.net/redpandacpp/' so
the onclick passes the secure URL to openUrl.
- Show 'Usage Guide' button always for CodeBlocks/Dev-C++/Red Panda (even when not installed) - Change 'Installation Guide' to 'Usage Guide' in button labels for clarity - Hide status labels when EGE is already installed - Show 'Reinstall' button instead of 'Install' when already installed with confirmation dialog - Only show uninstall button when EGE is already installed - Remove 'Installation successful' text from guide documents for better reusability - Add ESC key support for closing all guide/information modal windows - Improve modal window styling and user experience
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/ui.js (1)
1454-1471:⚠️ Potential issue | 🔴 Critical复制到剪贴板的链接器选项与页面上显示的不一致。
Line 1422 显示的链接器选项为：
-lgraphics -lgdiplus -lgdi32 -limm32 -lmsimg32 -lole32 -loleaut32 -lwinmm -luuid -mwindows -static但
copyLinkerFlags()函数（Line 1458）实际复制的是：
-lgraphics -lgdiplus -luuid -lmsimg32 -lgdi32 -limm32 -lole32 -loleaut32 -lwinmm差异：复制内容缺少
-mwindows -static，且库的顺序不同。用户看到的和实际复制的内容不匹配，会导致编译链接失败。🐛 修复：统一两处的标志字符串
function copyLinkerFlags() { - var flags = '-lgraphics -lgdiplus -luuid -lmsimg32 -lgdi32 -limm32 -lole32 -loleaut32 -lwinmm'; + var flags = '-lgraphics -lgdiplus -lgdi32 -limm32 -lmsimg32 -lole32 -loleaut32 -lwinmm -luuid -mwindows -static'; try {
🤖 Fix all issues with AI agents
In `@src/setup.hta`:
- Around line 1290-1293: The log prints libsPath before it's updated, so
writeLog("找到打包路径: " + libsPath) will show the old/undefined value; swap the
order so that when fso.FolderExists(devLibsPath) is true you first set libsPath
= devLibsPath and then call writeLog with the updated libsPath (refer to the
fso.FolderExists check, libsPath and devLibsPath variables and the writeLog call
to locate the change).
🧹 Nitpick comments (3)
src/ui.js (2)
651-674: CLion 重新安装时，用户可能需要确认两次弹窗。当 CLion 已安装 EGE 时，
doInstall先弹出重新安装确认对话框（Line 658-664），用户确认后又弹出 CLion 插件推荐弹窗（Line 667-670）。如果用户在插件推荐弹窗点击「取消」，则前面的重新安装确认就白做了。建议将 CLion 的判断提前到重新安装确认之前，这样用户可以先看到插件推荐，再决定是否继续安装。♻️ 建议调整判断顺序
function doInstall(index, isFound) { var ide = isFound ? detectedIDEs[index] : notFoundIDEs[index]; if (!ide || !ide.found) return; + // CLion: 先显示插件推荐弹窗（在重新安装确认之前） + if (ide.type === 'clion') { + pendingClionInstall = { index: index, isFound: isFound }; + showClionPluginModal(); + return; + } + // 如果已安装，弹出重新安装确认 if (ide.egeInstalled) { var confirmMsg = '检测到 ' + ide.name + ' 已安装 EGE 库。\n\n'; confirmMsg += '重新安装将覆盖现有文件，是否继续？'; if (!confirm(confirmMsg)) { return; } } - // CLion: 先显示插件推荐弹窗 - if (ide.type === 'clion') { - pendingClionInstall = { index: index, isFound: isFound }; - showClionPluginModal(); - return; - } - proceedWithInstall(index, isFound); }同时在
proceedWithInstall开头（或confirmClionInstall中）加入重新安装确认逻辑。
509-513: 已安装状态标签的隐藏逻辑可以更清晰。Line 511 的条件
!ide.egeInstalled || !ide.found意味着：EGE 未安装时显示状态标签，IDE 未找到时也显示。但当ide.found === true && ide.egeInstalled === true时隐藏。这个逻辑能工作，但条件的语义不够直观。建议添加一行注释说明"已安装 EGE 的 IDE 不需要状态标签，因为有'重新安装'按钮已隐含表达了已安装状态"。
src/setup.hta (1)
1227-1242:writeLog每次调用都创建新的ActiveXObject，效率较低。每次调用
writeLog都会new ActiveXObject("Scripting.FileSystemObject")（Line 1235），在高频日志场景下会有不必要的开销。可以将fso对象缓存为模块级变量复用。不过考虑到此函数主要用于调试且调用频率不高，影响有限。
♻️ 建议缓存 FileSystemObject
var logFilePath = ""; + var logFso = null; function writeLog(message) { try { if (!logFilePath) { var tempFso = new ActiveXObject("Scripting.FileSystemObject"); var tempShell = new ActiveXObject("WScript.Shell"); var tempDir = tempShell.ExpandEnvironmentStrings("%TEMP%"); logFilePath = tempDir + "\\ege_installer_log.txt"; + logFso = tempFso; } - var tempFso2 = new ActiveXObject("Scripting.FileSystemObject"); - var file = tempFso2.OpenTextFile(logFilePath, 8, true); + if (!logFso) logFso = new ActiveXObject("Scripting.FileSystemObject"); + var file = logFso.OpenTextFile(logFilePath, 8, true); file.WriteLine("[" + new Date().toLocaleTimeString() + "] " + message); file.Close(); } catch (e) { // 静默失败 } }
Fixes and improvements based on code review: **Bug Fixes:** - Fix writeLog printing undefined libsPath variable (was logging before assignment) - Fix duplicate 'var projectRoot' declaration at line 1323 **Features:** - Add debug mode support: logs only write when %TEMP%\.ege-debug exists - Non-debug mode: only ERROR messages are logged - Debug mode: all messages are logged (enable via tasks.json) - Cache FSO instance to avoid repeated ActiveXObject creation - Direct log initialization to avoid function call issues **Code Quality:** - Extract common CSS to .guide-modal-common class (~80 lines reduction) - Apply to .clion-plugin-modal and .redpanda-guide-modal - Only header gradient colors remain specific to each modal **Performance:** - Reduced CSS from ~100 lines to ~40 lines for modal styles - FSO instance cached globally for better performance
What
Add comprehensive CLion plugin recommendations and enhance IDE usage guides with improved UI interactions and documentation images.
Why
How
UI/UX Improvements:
Documentation Updates:
Code Changes:
Testing
Files Changed
Summary by CodeRabbit
发布说明
新功能
文档
改进