Skip to content

Commit fa65db4

Browse files
committed
hide cursor option in editor
1 parent 7fe0fec commit fa65db4

File tree

5 files changed

+86
-70
lines changed

5 files changed

+86
-70
lines changed

apps/desktop/src/routes/editor/ConfigSidebar.tsx

+66-60
Original file line numberDiff line numberDiff line change
@@ -416,69 +416,75 @@ export function ConfigSidebar() {
416416
)}
417417
</KTabs.Content>
418418
<KTabs.Content value="cursor" class="flex flex-col gap-6">
419-
<Field name="Cursor" icon={<IconCapCursor />}>
420-
{/* <Subfield name="Hide cursor when not moving">
419+
<Field
420+
name="Cursor"
421+
icon={<IconCapCursor />}
422+
value={
421423
<Toggle
422-
checked={project.cursor.hideWhenIdle}
423-
onChange={(v) => setProject("cursor", "hideWhenIdle", v)}
424+
checked={!project.cursor.hide}
425+
onChange={(v) => {
426+
setProject("cursor", "hide", !v);
427+
}}
424428
/>
425-
</Subfield> */}
426-
</Field>
427-
<Field name="Size" icon={<IconCapEnlarge />}>
428-
<Slider
429-
value={[project.cursor.size]}
430-
onChange={(v) => setProject("cursor", "size", v[0])}
431-
minValue={20}
432-
maxValue={300}
433-
step={1}
434-
/>
435-
</Field>
436-
<KCollapsible open={!project.cursor.raw}>
437-
<Field
438-
name="Smooth Movement"
439-
icon={<IconHugeiconsEaseCurveControlPoints />}
440-
value={
441-
<Toggle
442-
checked={!project.cursor.raw}
443-
onChange={(value) => {
444-
setProject("cursor", "raw", !value);
445-
}}
446-
/>
447-
}
448-
/>
449-
<KCollapsible.Content class="overflow-hidden border-b border-gray-200 opacity-0 transition-opacity animate-collapsible-up ui-expanded:animate-collapsible-down ui-expanded:opacity-100">
450-
{/* if Content has padding or margin the animation doesn't look as good */}
451-
<div class="flex flex-col gap-4 pt-4 pb-6">
452-
<Field name="Tension">
453-
<Slider
454-
value={[project.cursor.tension]}
455-
onChange={(v) => setProject("cursor", "tension", v[0])}
456-
minValue={1}
457-
maxValue={500}
458-
step={1}
459-
/>
460-
</Field>
461-
<Field name="Friction">
462-
<Slider
463-
value={[project.cursor.friction]}
464-
onChange={(v) => setProject("cursor", "friction", v[0])}
465-
minValue={0}
466-
maxValue={50}
467-
step={0.1}
468-
/>
469-
</Field>
470-
<Field name="Mass">
471-
<Slider
472-
value={[project.cursor.mass]}
473-
onChange={(v) => setProject("cursor", "mass", v[0])}
474-
minValue={0.1}
475-
maxValue={10}
476-
step={0.01}
429+
}
430+
/>
431+
<Show when={!project.cursor.hide}>
432+
<Field name="Size" icon={<IconCapEnlarge />}>
433+
<Slider
434+
value={[project.cursor.size]}
435+
onChange={(v) => setProject("cursor", "size", v[0])}
436+
minValue={20}
437+
maxValue={300}
438+
step={1}
439+
/>
440+
</Field>
441+
<KCollapsible open={!project.cursor.raw}>
442+
<Field
443+
name="Smooth Movement"
444+
icon={<IconHugeiconsEaseCurveControlPoints />}
445+
value={
446+
<Toggle
447+
checked={!project.cursor.raw}
448+
onChange={(value) => {
449+
setProject("cursor", "raw", !value);
450+
}}
477451
/>
478-
</Field>
479-
</div>
480-
</KCollapsible.Content>
481-
</KCollapsible>
452+
}
453+
/>
454+
<KCollapsible.Content class="overflow-hidden border-b border-gray-200 opacity-0 transition-opacity animate-collapsible-up ui-expanded:animate-collapsible-down ui-expanded:opacity-100">
455+
{/* if Content has padding or margin the animation doesn't look as good */}
456+
<div class="flex flex-col gap-4 pt-4 pb-6">
457+
<Field name="Tension">
458+
<Slider
459+
value={[project.cursor.tension]}
460+
onChange={(v) => setProject("cursor", "tension", v[0])}
461+
minValue={1}
462+
maxValue={500}
463+
step={1}
464+
/>
465+
</Field>
466+
<Field name="Friction">
467+
<Slider
468+
value={[project.cursor.friction]}
469+
onChange={(v) => setProject("cursor", "friction", v[0])}
470+
minValue={0}
471+
maxValue={50}
472+
step={0.1}
473+
/>
474+
</Field>
475+
<Field name="Mass">
476+
<Slider
477+
value={[project.cursor.mass]}
478+
onChange={(v) => setProject("cursor", "mass", v[0])}
479+
minValue={0.1}
480+
maxValue={10}
481+
step={0.01}
482+
/>
483+
</Field>
484+
</div>
485+
</KCollapsible.Content>
486+
</KCollapsible>
487+
</Show>
482488

483489
{/* <Field name="Motion Blur">
484490
<Slider

apps/desktop/src/routes/editor/ui.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,15 @@ import { useEditorContext } from "./context";
2424
import { TextInput } from "./TextInput";
2525

2626
export function Field(
27-
props: ParentProps<{ name: string; icon?: JSX.Element; value?: JSX.Element }>
27+
props: ParentProps<{
28+
name: string;
29+
icon?: JSX.Element;
30+
value?: JSX.Element;
31+
class?: string;
32+
}>
2833
) {
2934
return (
30-
<div class="flex flex-col gap-4">
35+
<div class={cx("flex flex-col gap-4", props.class)}>
3136
<span class="flex flex-row items-center gap-[0.375rem] text-gray-500 font-medium text-sm">
3237
{props.icon}
3338
{props.name}

apps/desktop/src/utils/tauri.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -246,7 +246,7 @@ export type CurrentRecording = { target: CurrentRecordingTarget; type: Recording
246246
export type CurrentRecordingChanged = null
247247
export type CurrentRecordingTarget = { window: { id: number; bounds: Bounds } } | { screen: { id: number } } | { area: { screen: number; bounds: Bounds } }
248248
export type CursorAnimationStyle = "regular" | "slow" | "fast"
249-
export type CursorConfiguration = { hideWhenIdle: boolean; size: number; type: CursorType; animationStyle: CursorAnimationStyle; tension: number; mass: number; friction: number; raw?: boolean; motionBlur?: number }
249+
export type CursorConfiguration = { hide?: boolean; hideWhenIdle: boolean; size: number; type: CursorType; animationStyle: CursorAnimationStyle; tension: number; mass: number; friction: number; raw?: boolean; motionBlur?: number }
250250
export type CursorMeta = { imagePath: string; hotspot: XY<number> }
251251
export type CursorType = "pointer" | "circle"
252252
export type Cursors = { [key in string]: string } | { [key in string]: CursorMeta }

crates/project/src/configuration.rs

+3
Original file line numberDiff line numberDiff line change
@@ -330,6 +330,8 @@ pub enum CursorAnimationStyle {
330330
#[derive(Type, Serialize, Deserialize, Clone, Debug)]
331331
#[serde(rename_all = "camelCase")]
332332
pub struct CursorConfiguration {
333+
#[serde(default)]
334+
pub hide: bool,
333335
hide_when_idle: bool,
334336
pub size: u32,
335337
r#type: CursorType,
@@ -346,6 +348,7 @@ pub struct CursorConfiguration {
346348
impl Default for CursorConfiguration {
347349
fn default() -> Self {
348350
Self {
351+
hide: false,
349352
hide_when_idle: false,
350353
size: 100,
351354
r#type: CursorType::default(),

crates/rendering/src/lib.rs

+9-7
Original file line numberDiff line numberDiff line change
@@ -992,13 +992,15 @@ async fn produce_frame(
992992

993993
DisplayLayer::render(&mut pipeline, &segment_frames);
994994

995-
constants.cursor_layer.render(
996-
&mut pipeline,
997-
&segment_frames,
998-
uniforms.resolution_base,
999-
&cursor,
1000-
&uniforms.zoom,
1001-
);
995+
if !uniforms.project.cursor.hide {
996+
constants.cursor_layer.render(
997+
&mut pipeline,
998+
&segment_frames,
999+
uniforms.resolution_base,
1000+
&cursor,
1001+
&uniforms.zoom,
1002+
);
1003+
}
10021004

10031005
if let (
10041006
Some(camera_size),

0 commit comments

Comments
 (0)