mirrors/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2025-12-23 10:11:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Fix sending platform-specific shortcut keys to frontend before editor is initialized with the platform set

Browse source
This commit is contained in:
Keavon Chambers 2025-12-04 15:35:30 -08:00
parent 783ea0b437
commit 2ee8e56cef
12 changed files with 77 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

7
editor/src/messages/frontend/frontend_message.rs
View file

@ -1,5 +1,6 @@
use super::utility_types::{DocumentDetails, MouseCursorIcon, OpenDocument};
use crate::messages::app_window::app_window_message_handler::AppWindowPlatform;
use crate::messages::input_mapper::utility_types::misc::ActionShortcut;
use crate::messages::layout::utility_types::widget_prelude::*;
use crate::messages::portfolio::document::node_graph::utility_types::{
BoxSelection, ContextMenuInformation, FrontendClickTargets, FrontendGraphInput, FrontendGraphOutput, FrontendNode, FrontendNodeType, NodeGraphErrorDiagnostic, Transform,
@ -58,6 +59,12 @@ pub enum FrontendMessage {
#[serde(rename = "nodeTypes")]
node_types: Vec<FrontendNodeType>,
},
SendShortcutF11 {
shortcut: Option<ActionShortcut>,
},
SendShortcutAltClick {
shortcut: Option<ActionShortcut>,
},
// Trigger prefix: cause a browser API to do something
TriggerAboutGraphiteLocalizedCommitDate {

15
editor/src/messages/input_mapper/utility_types/misc.rs
View file

@ -136,16 +136,11 @@ pub enum ActionShortcut {
impl ActionShortcut {
pub fn realize_shortcut(&mut self, action_input_mapping: &impl Fn(&MessageDiscriminant) -> Option<KeysGroup>) {
match self {
Self::Action(action) => {
if let Some(keys) = action_input_mapping(action) {
*self = Self::Shortcut(keys.into());
} else {
*self = Self::Shortcut(KeysGroup::default().into());
}
}
Self::Shortcut(shortcut) => {
warn!("Calling `.to_keys()` on a `ActionShortcut::Shortcut` is a mistake/bug. Shortcut is: {shortcut:?}.");
if let Self::Action(action) = self {
if let Some(keys) = action_input_mapping(action) {
*self = Self::Shortcut(keys.into());
} else {
*self = Self::Shortcut(KeysGroup::default().into());
}
}
}

5
editor/src/messages/layout/layout_message_handler.rs
View file

@ -13,7 +13,7 @@ pub struct LayoutMessageContext<'a> {
#[derive(Debug, Clone, Default, ExtractField)]
pub struct LayoutMessageHandler {
layouts: [Layout; LayoutTarget::LayoutTargetLength as usize],
layouts: [Layout; LayoutTarget::_LayoutTargetLength as usize],
}
#[message_handler_data]
@ -518,7 +518,8 @@ impl LayoutMessageHandler {
LayoutTarget::WelcomeScreenButtons => FrontendMessage::UpdateWelcomeScreenButtonsLayout { diff },
LayoutTarget::WorkingColors => FrontendMessage::UpdateWorkingColorsLayout { diff },
LayoutTarget::LayoutTargetLength => panic!("`LayoutTargetLength` is not a valid Layout Target and is used for array indexing"),
// KEEP THIS ENUM LAST
LayoutTarget::_LayoutTargetLength => panic!("`_LayoutTargetLength` is not a valid `LayoutTarget` and is used for array indexing"),
};
responses.add(message);

2
editor/src/messages/layout/utility_types/layout_widget.rs
View file

@ -56,7 +56,7 @@ pub enum LayoutTarget {
// KEEP THIS ENUM LAST
// This is a marker that is used to define an array that is used to hold widgets
LayoutTargetLength,
_LayoutTargetLength,
}
/// For use by structs that define a UI widget layout by implementing the layout() function belonging to this trait.

12
editor/src/messages/portfolio/menu_bar/menu_bar_message_handler.rs
View file

@ -689,7 +689,7 @@ impl LayoutHolder for MenuBarMessageHandler {
.on_commit(|_| DebugMessage::ToggleTraceLogs.into()),
MenuListEntry::new("Print Messages: Off")
.label("Print Messages: Off")
.icon(message_logging_verbosity_off.then_some({
.icon(if message_logging_verbosity_off {
#[cfg(not(target_os = "macos"))]
{
"SmallDot".to_string()
@ -698,12 +698,12 @@ impl LayoutHolder for MenuBarMessageHandler {
{
"CheckboxChecked".to_string()
}
}).unwrap_or_default())
} else { Default::default() })
.tooltip_shortcut(action_shortcut!(DebugMessageDiscriminant::MessageOff))
.on_commit(|_| DebugMessage::MessageOff.into()),
MenuListEntry::new("Print Messages: Only Names")
.label("Print Messages: Only Names")
.icon(message_logging_verbosity_names.then_some({
.icon(if message_logging_verbosity_names {
#[cfg(not(target_os = "macos"))]
{
"SmallDot".to_string()
@ -712,12 +712,12 @@ impl LayoutHolder for MenuBarMessageHandler {
{
"CheckboxChecked".to_string()
}
}).unwrap_or_default())
} else { Default::default() })
.tooltip_shortcut(action_shortcut!(DebugMessageDiscriminant::MessageNames))
.on_commit(|_| DebugMessage::MessageNames.into()),
MenuListEntry::new("Print Messages: Full Contents")
.label("Print Messages: Full Contents")
.icon(message_logging_verbosity_contents.then_some({
.icon(if message_logging_verbosity_contents {
#[cfg(not(target_os = "macos"))]
{
"SmallDot".to_string()
@ -726,7 +726,7 @@ impl LayoutHolder for MenuBarMessageHandler {
{
"CheckboxChecked".to_string()
}
}).unwrap_or_default())
} else { Default::default() })
.tooltip_shortcut(action_shortcut!(DebugMessageDiscriminant::MessageContents))
.on_commit(|_| DebugMessage::MessageContents.into()),
],

21
editor/src/messages/portfolio/portfolio_message_handler.rs
View file

@ -7,7 +7,8 @@ use crate::messages::animation::TimingInformation;
use crate::messages::debug::utility_types::MessageLoggingVerbosity;
use crate::messages::dialog::simple_dialogs;
use crate::messages::frontend::utility_types::{DocumentDetails, OpenDocument};
use crate::messages::input_mapper::utility_types::macros::action_shortcut;
use crate::messages::input_mapper::utility_types::input_keyboard::Key;
use crate::messages::input_mapper::utility_types::macros::{action_shortcut, action_shortcut_manual};
use crate::messages::layout::utility_types::widget_prelude::*;
use crate::messages::portfolio::document::DocumentMessageContext;
use crate::messages::portfolio::document::graph_operation::utility_types::TransformIn;
@ -154,6 +155,17 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageContext<'_>> for Portfolio
node_types: document_node_definitions::collect_node_types(),
});
// Send shortcuts for widgets created in the frontend which need shortcut tooltips
responses.add(FrontendMessage::SendShortcutF11 {
shortcut: action_shortcut_manual!(Key::F11),
});
responses.add(FrontendMessage::SendShortcutAltClick {
shortcut: action_shortcut_manual!(Key::Alt, Key::MouseLeft),
});
// Before loading any documents, initially prepare the welcome screen buttons layout
responses.add(PortfolioMessage::RequestWelcomeScreenButtonsLayout);
// Tell frontend to finish loading persistent documents
responses.add(FrontendMessage::TriggerLoadRestAutoSaveDocuments);
@ -1117,7 +1129,14 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageContext<'_>> for Portfolio
})
})
.collect::<Vec<_>>();
let no_open_documents = open_documents.is_empty();
responses.add(FrontendMessage::UpdateOpenDocumentsList { open_documents });
if no_open_documents {
responses.add(PortfolioMessage::RequestWelcomeScreenButtonsLayout);
}
}
PortfolioMessage::UpdateVelloPreference => {
let active = if cfg!(target_family = "wasm") { false } else { preferences.use_vello };

4
editor/src/messages/tool/utility_types.rs
View file

@ -533,8 +533,8 @@ impl HintData {
for shortcut in &hint.key_groups {
widgets.push(ShortcutLabel::new(Some(ActionShortcut::Shortcut(shortcut.clone()))).widget_instance());
}
if let Some(mouse_movement) = &hint.mouse {
let mouse_movement = LabeledShortcut(vec![LabeledKeyOrMouseMotion::MouseMotion(mouse_movement.clone())]);
if let Some(mouse_movement) = hint.mouse {
let mouse_movement = LabeledShortcut(vec![LabeledKeyOrMouseMotion::MouseMotion(mouse_movement)]);
let shortcut = ActionShortcut::Shortcut(mouse_movement);
widgets.push(ShortcutLabel::new(Some(shortcut)).widget_instance());
}

12
frontend/src/components/panels/Layers.svelte
View file

@ -1,7 +1,6 @@
<script lang="ts">
import { getContext, onMount, onDestroy, tick } from "svelte";
import { shortcutAltClick } from "@graphite/../wasm/pkg/graphite_wasm";
import type { Editor } from "@graphite/editor";
import {
patchLayout,
@ -10,6 +9,7 @@
UpdateLayersPanelControlBarLeftLayout,
UpdateLayersPanelControlBarRightLayout,
UpdateLayersPanelBottomBarLayout,
SendShortcutAltClick,
} from "@graphite/messages";
import type { ActionShortcut, DataBuffer, LayerPanelEntry, Layout } from "@graphite/messages";
import type { NodeGraphState } from "@graphite/state-providers/node-graph";
@ -73,9 +73,13 @@
let layersPanelControlBarRightLayout: Layout = [];
let layersPanelBottomBarLayout: Layout = [];
const altClickKeys: ActionShortcut = shortcutAltClick();
let altClickShortcut: ActionShortcut | undefined;
onMount(() => {
editor.subscriptions.subscribeJsMessage(SendShortcutAltClick, async (data) => {
altClickShortcut = data.shortcut;
});
editor.subscriptions.subscribeJsMessage(UpdateLayersPanelControlBarLeftLayout, (updateLayersPanelControlBarLeftLayout) => {
patchLayout(layersPanelControlBarLeftLayout, updateLayersPanelControlBarLeftLayout);
layersPanelControlBarLeftLayout = layersPanelControlBarLeftLayout;
@ -624,7 +628,7 @@
? "Hide the layers nested within. (To affect all open descendants, perform the shortcut shown.)"
: "Show the layers nested within. (To affect all closed descendants, perform the shortcut shown.)") +
(listing.entry.ancestorOfSelected && !listing.entry.expanded ? "\n\nNote: a selected layer is currently contained within.\n" : "")}
data-tooltip-shortcut={altClickKeys?.shortcut ? JSON.stringify(altClickKeys.shortcut) : undefined}
data-tooltip-shortcut={altClickShortcut?.shortcut ? JSON.stringify(altClickShortcut.shortcut) : undefined}
on:click={(e) => handleExpandArrowClickWithModifiers(e, listing.entry.id)}
tabindex="0"
></button>
@ -636,7 +640,7 @@
icon="Clipped"
class="clipped-arrow"
tooltipDescription="Clipping mask is active. To release it, perform the shortcut on the layer border."
tooltipShortcut={altClickKeys}
tooltipShortcut={altClickShortcut}
/>
{/if}
<div class="thumbnail">

2
frontend/src/components/panels/Welcome.svelte
View file

@ -21,8 +21,6 @@
patchLayout(welcomePanelButtonsLayout, updateWelcomeScreenButtonsLayout);
welcomePanelButtonsLayout = welcomePanelButtonsLayout;
});
editor.handle.requestWelcomeScreenButtonsLayout();
});
onDestroy(() => {

16
frontend/src/components/window/title-bar/WindowButtonsWeb.svelte
View file

@ -1,16 +1,24 @@
<script lang="ts">
import { getContext } from "svelte";
import { getContext, onMount } from "svelte";
import { shortcutF11 } from "@graphite/../wasm/pkg/graphite_wasm";
import type { Editor } from "@graphite/editor";
import type { ActionShortcut } from "@graphite/messages";
import { SendShortcutF11 } from "@graphite/messages";
import type { FullscreenState } from "@graphite/state-providers/fullscreen";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
const fullscreen = getContext<FullscreenState>("fullscreen");
const editor = getContext<Editor>("editor");
const f11Keys: ActionShortcut = shortcutF11();
let f11Shortcut: ActionShortcut | undefined = undefined;
onMount(() => {
editor.subscriptions.subscribeJsMessage(SendShortcutF11, async (data) => {
f11Shortcut = data.shortcut;
});
});
async function handleClick() {
if ($fullscreen.windowFullscreen) fullscreen.exitFullscreen();
@ -23,7 +31,7 @@
on:click={handleClick}
tooltipLabel={$fullscreen.windowFullscreen ? "Exit Fullscreen" : "Enter Fullscreen"}
tooltipDescription={$fullscreen.keyboardLockApiSupported ? "While fullscreen, keyboard shortcuts normally reserved by the browser become available." : ""}
tooltipShortcut={f11Keys}
tooltipShortcut={f11Shortcut}
>
<IconLabel icon={$fullscreen.windowFullscreen ? "FullscreenExit" : "FullscreenEnter"} />
</LayoutRow>

12
frontend/src/messages.ts
View file

@ -109,6 +109,16 @@ export class SendUIMetadata extends JsMessage {
readonly nodeTypes!: FrontendNodeType[];
}
export class SendShortcutF11 extends JsMessage {
@Transform(({ value }: { value: ActionShortcut }) => value || undefined)
readonly shortcut!: ActionShortcut | undefined;
}
export class SendShortcutAltClick extends JsMessage {
@Transform(({ value }: { value: ActionShortcut }) => value || undefined)
readonly shortcut!: ActionShortcut | undefined;
}
export class UpdateNodeThumbnail extends JsMessage {
readonly id!: bigint;
@ -1675,6 +1685,8 @@ export const messageMakers: Record<string, MessageMaker> = {
DisplayEditableTextboxTransform,
DisplayRemoveEditableTextbox,
SendUIMetadata,
SendShortcutF11,
SendShortcutAltClick,
TriggerAboutGraphiteLocalizedCommitDate,
TriggerDisplayThirdPartyLicensesDialog,
TriggerExportImage,

21
frontend/wasm/src/editor_api.rs
View file

@ -7,9 +7,8 @@
use crate::helpers::translate_key;
use crate::{EDITOR_HANDLE, EDITOR_HAS_CRASHED, Error, MESSAGE_BUFFER};
use editor::consts::FILE_EXTENSION;
use editor::messages::input_mapper::utility_types::input_keyboard::{Key, KeysGroup, ModifierKeys};
use editor::messages::input_mapper::utility_types::input_keyboard::ModifierKeys;
use editor::messages::input_mapper::utility_types::input_mouse::{EditorMouseState, ScrollDelta};
use editor::messages::input_mapper::utility_types::misc::ActionShortcut;
use editor::messages::portfolio::document::utility_types::document_metadata::LayerNodeIdentifier;
use editor::messages::portfolio::document::utility_types::network_interface::ImportOrExport;
use editor::messages::portfolio::utility_types::Platform;
@ -68,18 +67,6 @@ pub fn is_platform_native() -> bool {
}
}
#[wasm_bindgen(js_name = shortcutAltClick)]
pub fn shortcut_alt_click() -> JsValue {
let shortcut = Some(ActionShortcut::Shortcut(KeysGroup(vec![Key::Alt, Key::MouseLeft]).into()));
serde_wasm_bindgen::to_value(&shortcut).unwrap()
}
#[wasm_bindgen(js_name = shortcutF11)]
pub fn shortcut_f11() -> JsValue {
let shortcut = Some(ActionShortcut::Shortcut(KeysGroup(vec![Key::F11]).into()));
serde_wasm_bindgen::to_value(&shortcut).unwrap()
}
// ============================================================================
/// This struct is, via wasm-bindgen, used by JS to interact with the editor backend. It does this by calling functions, which are `impl`ed
@ -405,12 +392,6 @@ impl EditorHandle {
self.dispatch(message);
}
#[wasm_bindgen(js_name = requestWelcomeScreenButtonsLayout)]
pub fn request_welcome_screen_buttons_layout(&self) {
let message = PortfolioMessage::RequestWelcomeScreenButtonsLayout;
self.dispatch(message);
}
#[wasm_bindgen(js_name = openDocumentFile)]
pub fn open_document_file(&self, document_name: String, document_serialized_content: String) {
let message = PortfolioMessage::OpenDocumentFile {