Skip to content

Commit 27c69ff

Browse files
KOSHINOawaKOSHINOawa
committed
v1.2.5
1 parent 2ddcd3f commit 27c69ff

14 files changed

Lines changed: 97 additions & 192 deletions

File tree

‎src/addons/addons/editor-compact/userscript.js‎

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -7,27 +7,8 @@ export default async function ({ addon, global, console }) {
77
// whenever the addon modifies or stops modifying UI elements
88
resizeWorkspace();
99

10-
// 更新桌面端金刚键高度（macOS 使用原生 traffic lights，不需要设置）
11-
const updateWindowControlsHeight = async () => {
12-
try {
13-
if (window.EditorPreload?.platform === 'darwin') return;
14-
if (window.EditorPreload?.setWindowControlsStyle) {
15-
const compact = !addon.self.disabled && addon.settings.get("compactMenubar");
16-
const baseHeight = compact ? 32 : 48;
17-
const height = Math.round(baseHeight * window.devicePixelRatio);
18-
window.__windowControlsManagedByAddon = compact;
19-
await window.EditorPreload.setWindowControlsStyle({ height })
20-
}
21-
} catch { }
22-
};
23-
updateWindowControlsHeight();
24-
addon.self.addEventListener("disabled", updateWindowControlsHeight);
25-
addon.self.addEventListener("reenabled", updateWindowControlsHeight);
26-
window.addEventListener('resize', updateWindowControlsHeight);
27-
2810
addon.settings.addEventListener("change", () => {
2911
resizeWorkspace();
30-
updateWindowControlsHeight();
3112
});
3213

3314
let resizeObserver = new ResizeObserver(resizeWorkspace);

‎src/addons/addons/editor-compact/userstyle.css‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,11 @@
2828
height: 2rem;
2929
}
3030

31+
/* 桌面端金刚键跟随紧凑菜单栏高度 */
32+
#window-controls {
33+
height: 2rem;
34+
}
35+
3136
[class*="menu-bar_file-group_"] [class*="menu-bar_menu-bar-item_"],
3237
[class*="menu-bar_account-info-group_"] [class*="menu-bar_menu-bar-item_"] {
3338
margin: 0;

‎src/addons/addons/find-bar/userscript.js‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -36,11 +36,12 @@ export default async function ({ addon, msg, console }) {
3636
return Blockly.getMainWorkspace();
3737
}
3838

39-
createDom(root) {
39+
createDom() {
4040
this.findBarOuter = document.createElement("div");
4141
this.findBarOuter.className = "sa-find-bar";
4242
addon.tab.displayNoneWhileDisabled(this.findBarOuter, { display: "flex" });
43-
root.insertAdjacentElement('afterend', this.findBarOuter);
43+
// 通过共享空间机制注入，order=5（位于变量TAB(4)之后、插件按钮API(6)之前）
44+
addon.tab.appendToSharedSpace({ space: "afterTabs", element: this.findBarOuter, order: 5 });
4445

4546
this.findWrapper = this.findBarOuter.appendChild(document.createElement("span"));
4647
this.findWrapper.className = "sa-find-wrapper";
@@ -1058,8 +1059,6 @@ export default async function ({ addon, msg, console }) {
10581059
reduxEvents: ["scratch-gui/mode/SET_PLAYER", "fontsLoaded/SET_FONTS_LOADED", "scratch-gui/locales/SELECT_LOCALE"],
10591060
reduxCondition: (state) => !state.scratchGui.mode.isPlayerOnly,
10601061
});
1061-
let tab = document.querySelectorAll('li[class*=react-tabs_react-tabs__tab][id*=react-tabs]');
1062-
tab = tab[tab.length - 1];
1063-
findBar.createDom(tab);
1062+
findBar.createDom();
10641063
}
10651064
}

‎src/addons/addons/hide-stage/style.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,8 @@
4848
right: 0.5rem;
4949
height: 2.75rem;
5050
align-items: center;
51+
/* 高于 .tab-list (z-index: 25)，避免按钮被 tablist 遮挡 */
52+
z-index: 43;
5153
}
5254

5355
[dir="rtl"] .sa-stage-hidden [class*="stage-header_stage-size-row"] {

‎src/addons/api.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -342,7 +342,9 @@ class Tab extends EventTargetShim {
342342
afterTabs: {
343343
element: () => q("[class^='react-tabs_react-tabs__tab-list']"),
344344
from: () => [q("[class^='react-tabs_react-tabs__tab-list']").children[0]],
345-
until: () => [q('.sa-find-bar')]
345+
// until 锚点为 README 按钮（始终在 addon 元素之后）；
346+
// 若 README 未渲染，则 until 为 [null]，addon 元素会按 order 排序后追加到末尾
347+
until: () => [q('[data-sa-readme-tab]')]
346348
},
347349
assetContextMenuAfterExport: {
348350
element: () => scope,

‎src/addons/tools/AddToBar/index.js‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -184,14 +184,19 @@ export default async function AddToBar(addon, config) {
184184
reduxEvents: ['scratch-gui/mode/SET_PLAYER', 'fontsLoaded/SET_FONTS_LOADED', 'scratch-gui/locales/SELECT_LOCALE'],
185185
reduxCondition: (state) => !state.scratchGui.mode.isPlayerOnly,
186186
});
187-
let tab = document.querySelector(`.${tabAddonListSelector}`);
188-
if (!tab) {
189-
tab = document.createElement('div');
190-
tab.className = tabAddonListSelector;
191-
tab.appendChild(button);
192-
if (tabs) tabs.appendChild(tab);
187+
let container = document.querySelector(`.${tabAddonListSelector}`);
188+
if (!container) {
189+
// VSCode 布局：容器用 <li>（与 react-tabs Tab 一致）
190+
// 非 VSCode：容器用 <div>
191+
container = vscode
192+
? document.createElement('li')
193+
: document.createElement('div');
194+
container.className = tabAddonListSelector;
195+
container.appendChild(button);
196+
// 通过共享空间机制注入，order=6（位于搜索框(5)之后、README 之前）
197+
if (tabs) addon.tab.appendToSharedSpace({ space: 'afterTabs', element: container, order: 6 });
193198
} else {
194-
tab.appendChild(button);
199+
container.appendChild(button);
195200
}
196201
}
197202
}

‎src/components/gui/gui.css‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -352,7 +352,8 @@
352352
goes to full vertical height of the window
353353
*/
354354
display: flex;
355-
/* flex-direction: column; Move to JSX*/
355+
flex-direction: column;
356+
min-height: 0;
356357
/* pad entire wrapper to the left and right; allow children to fill width */
357358
padding-left: 0 !important;
358359
padding-right: 0 !important;
@@ -489,7 +490,3 @@ $fade-out-distance: 15px;
489490
background-color: white;
490491
}
491492

492-
.stageAndTargetWrapper{
493-
flex-direction: column;
494-
display: flex;
495-
}

‎src/components/gui/gui.jsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -563,6 +563,7 @@ const GUIComponent = props => {
563563
{canShowReadme &&
564564
<button
565565
className={styles.readmeButton}
566+
data-sa-readme-tab
566567
onClick={onOpenReadme}
567568
>
568569
{vscodeLayoutRef ? (

‎src/components/menu-bar/menu-bar.css‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -325,8 +325,3 @@
325325
.controlButton:hover {
326326
background-color: #ffffff20;
327327
}
328-
329-
/* macOS: traffic lights on left, push main-menu right */
330-
.macos .main-menu {
331-
padding-left: 78px;
332-
}

‎src/components/menu-bar/menu-bar.jsx‎

Lines changed: 60 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -259,7 +259,6 @@ class MenuBar extends React.Component {
259259
"handleDocumentMouseUp",
260260
"handleMenubarClickSuppress",
261261
]);
262-
this.overlay = navigator?.windowControlsOverlay || {};
263262
this.menubar = React.createRef();
264263
this._menubarPressing = false;
265264
this._menubarDragMode = false;
@@ -277,10 +276,6 @@ class MenuBar extends React.Component {
277276
this.updateMaximizedState();
278277
// 监听窗口大小变化
279278
window.addEventListener("resize", this.handleResize);
280-
// 监听 title bar overlay 区域变化（Window Controls Overlay API）
281-
if (navigator?.windowControlsOverlay) {
282-
navigator.windowControlsOverlay.addEventListener("geometrychange", this.handleResize);
283-
}
284279
}
285280
componentDidUpdate(prevProps) {
286281
// 当 isMaximize 首次可用时更新状态
@@ -304,22 +299,18 @@ class MenuBar extends React.Component {
304299
componentWillUnmount() {
305300
document.removeEventListener("keydown", this.handleKeyPress);
306301
window.removeEventListener("resize", this.handleResize);
307-
if (navigator?.windowControlsOverlay) {
308-
navigator.windowControlsOverlay.removeEventListener("geometrychange", this.handleResize);
309-
}
310-
clearTimeout(this._menubarDragTimer);
311-
this.exitDragMode();
312302
if (this.props.setWindowMaximizeStateHandler) {
313303
this.props.setWindowMaximizeStateHandler(null);
314304
}
305+
clearTimeout(this._menubarDragTimer);
306+
this.exitDragMode();
315307
}
316308
handleWindowMaximizeStateChange(isMaximized) {
317309
this.setState({ isMaximized: Boolean(isMaximized) });
318310
}
319311
handleResize() {
320312
// 窗口大小变化时更新最大化状态
321313
this.updateMaximizedState();
322-
this.overlay = navigator?.windowControlsOverlay || {};
323314
}
324315
async updateMaximizedState() {
325316
if (this.props.isMaximize) {
@@ -332,6 +323,63 @@ class MenuBar extends React.Component {
332323
// 延迟更新状态，等待 Electron 完成窗口状态变化
333324
setTimeout(() => this.updateMaximizedState(), 100);
334325
}
326+
clickMainMenu(e) {
327+
if (this._menubarDragMode) return;
328+
clearTimeout(this._menubarDragTimer);
329+
this._menubarPressing = true;
330+
this._menubarDragTimer = setTimeout(() => {
331+
if (this._menubarPressing && !this._menubarDragMode) {
332+
this.enterDragMode();
333+
}
334+
}, 600);
335+
}
336+
overClickMainMenu() {
337+
clearTimeout(this._menubarDragTimer);
338+
this._menubarPressing = false;
339+
}
340+
enterDragMode() {
341+
this._menubarDragMode = true;
342+
this._menubarDragActivated = true;
343+
const bar = this.menubar.current;
344+
if (bar) {
345+
bar.classList.add(styles.dragMode);
346+
bar.addEventListener("click", this.handleMenubarClickSuppress, true);
347+
}
348+
document.addEventListener("mousedown", this.handleDocumentMouseDown, true);
349+
document.addEventListener("mouseup", this.handleDocumentMouseUp, true);
350+
}
351+
exitDragMode() {
352+
if (!this._menubarDragMode) return;
353+
this._menubarDragMode = false;
354+
this._menubarDragActivated = false;
355+
clearTimeout(this._menubarDragTimer);
356+
const bar = this.menubar.current;
357+
if (bar) {
358+
bar.classList.remove(styles.dragMode);
359+
bar.removeEventListener("click", this.handleMenubarClickSuppress, true);
360+
}
361+
document.removeEventListener("mousedown", this.handleDocumentMouseDown, true);
362+
document.removeEventListener("mouseup", this.handleDocumentMouseUp, true);
363+
}
364+
handleDocumentMouseDown(e) {
365+
if (!this._menubarDragMode) return;
366+
const bar = this.menubar.current;
367+
if (!bar || !bar.contains(e.target)) {
368+
this.exitDragMode();
369+
}
370+
}
371+
handleDocumentMouseUp() {
372+
if (!this._menubarDragMode) return;
373+
if (this._menubarDragActivated) {
374+
this._menubarDragActivated = false;
375+
return;
376+
}
377+
this.exitDragMode();
378+
}
379+
handleMenubarClickSuppress(e) {
380+
e.stopPropagation();
381+
e.preventDefault();
382+
}
335383
handleClickNew() {
336384
// if the project is dirty, and user owns the project, we will autosave.
337385
// but if they are not logged in and can't save, user should consider
@@ -605,74 +653,6 @@ class MenuBar extends React.Component {
605653
this.props.onRequestCloseAbout();
606654
};
607655
}
608-
clickMainMenu(e) {
609-
// 非桌面端不启用拖拽
610-
if (!window.EditorPreload) return;
611-
// 已处于拖拽模式时不再重新计时，交给 Electron 处理拖拽
612-
if (this._menubarDragMode) return;
613-
// 仅检测 menubar 顶部条：忽略输入框与多级下拉菜单内的长按
614-
if (e.target.closest(`input, textarea, [contenteditable], .${styles.menuBarMenu}`)) return;
615-
this._menubarPressing = true;
616-
clearTimeout(this._menubarDragTimer);
617-
this._menubarDragTimer = setTimeout(() => {
618-
if (this._menubarPressing && !this._menubarDragMode) {
619-
this.enterDragMode();
620-
}
621-
}, 600);
622-
}
623-
overClickMainMenu() {
624-
this._menubarPressing = false;
625-
clearTimeout(this._menubarDragTimer);
626-
}
627-
enterDragMode() {
628-
this._menubarDragMode = true;
629-
// 标记此次为长按激活，等待用户松开后再按下才会真正拖拽
630-
this._menubarDragActivated = true;
631-
const bar = this.menubar.current;
632-
if (bar) {
633-
bar.classList.add(styles.dragMode);
634-
// 拖拽模式下吞掉 menubar 内的点击，避免触发按钮行为
635-
bar.addEventListener("click", this.handleMenubarClickSuppress, true);
636-
}
637-
document.addEventListener("mousedown", this.handleDocumentMouseDown, true);
638-
document.addEventListener("mouseup", this.handleDocumentMouseUp, true);
639-
}
640-
exitDragMode() {
641-
if (!this._menubarDragMode) return;
642-
this._menubarDragMode = false;
643-
this._menubarDragActivated = false;
644-
this._menubarPressing = false;
645-
clearTimeout(this._menubarDragTimer);
646-
const bar = this.menubar.current;
647-
if (bar) {
648-
bar.classList.remove(styles.dragMode);
649-
bar.removeEventListener("click", this.handleMenubarClickSuppress, true);
650-
}
651-
document.removeEventListener("mousedown", this.handleDocumentMouseDown, true);
652-
document.removeEventListener("mouseup", this.handleDocumentMouseUp, true);
653-
}
654-
handleDocumentMouseDown(e) {
655-
if (!this._menubarDragMode) return;
656-
const bar = this.menubar.current;
657-
// 按下时未碰到 menubar：退出拖拽模式；碰到了则交给 Electron 拖拽
658-
if (bar && !bar.contains(e.target)) {
659-
this.exitDragMode();
660-
}
661-
}
662-
handleDocumentMouseUp() {
663-
if (!this._menubarDragMode) return;
664-
if (this._menubarDragActivated) {
665-
// 长按激活后的首次松开：保持拖拽模式，等待用户再次按下拖拽
666-
this._menubarDragActivated = false;
667-
return;
668-
}
669-
// 拖拽结束（松开鼠标）：恢复 menubar
670-
this.exitDragMode();
671-
}
672-
handleMenubarClickSuppress(e) {
673-
e.stopPropagation();
674-
e.preventDefault();
675-
}
676656
render() {
677657
const saveNowMessage = (
678658
<FormattedMessage
@@ -714,15 +694,8 @@ class MenuBar extends React.Component {
714694
);
715695
// Show the About button only if we have a handler for it (like in the desktop app)
716696
const aboutButton = this.buildAboutMenu(this.props.onClickAbout);
717-
const isMac = window.EditorPreload?.platform === 'darwin';
718697
const menuBar = (
719-
<Box className={classNames(this.props.className, styles.menuBar, { [styles.macos]: isMac })} style={
720-
this.overlay.visible ? {
721-
width: `${Math.max(this.overlay.getTitlebarAreaRect().width, window.innerWidth)}px`,
722-
// 如果是阿拉伯那种从右往左的，改一下位置
723-
marginRight: `${this.props.isRtl ? window.innerWidth - this.overlay.getTitlebarAreaRect().width : '0'}px`
724-
}
725-
: {}}>
698+
<Box className={classNames(this.props.className, styles.menuBar)}>
726699
<div className={styles.mainMenu}>
727700
<div
728701
className={styles.menuGroup}
@@ -1678,7 +1651,6 @@ MenuBar.propTypes = {
16781651
onShare: PropTypes.func,
16791652
onStartSelectingFileUpload: PropTypes.func,
16801653
onToggleLoginOpen: PropTypes.func,
1681-
setWindowControlsStyle: PropTypes.func,
16821654
projectId: PropTypes.string,
16831655
projectTitle: PropTypes.string,
16841656
renderLogin: PropTypes.func,

0 commit comments

Comments
 (0)