Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(web): fix firefox selection issue #708

Merged
merged 5 commits into from
Mar 25, 2025
Merged

fix(web): fix firefox selection issue #708

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
c84bb57
fix(web): fix firefox selection issue
irvingoujAtDevolution Mar 19, 2025
95213d2
typo
irvingoujAtDevolution Mar 19, 2025
3beebca
remove css ironrdp prefix
irvingoujAtDevolution Mar 24, 2025
edcb090
clean up
irvingoujAtDevolution Mar 25, 2025
d1f8eab
.
CBenoit Mar 25, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions web-client/iron-remote-gui/src/iron-remote-gui.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -716,6 +716,9 @@
}}
oncontextmenu={(event) => event.preventDefault()}
onwheel={mouseWheel}
onselectstart={(event) => {
event.preventDefault();
}}
id="renderer"
tabindex="0"
></canvas>
Expand All @@ -738,6 +741,10 @@
height: 100%;
}

::selection {
background-color: transparent;
}

.screen-wrapper.hidden {
pointer-events: none !important;
position: absolute !important;
Expand Down
2 changes: 1 addition & 1 deletion web-client/iron-svelte-client/src/lib/login/login.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@
});
return of(null);
}),
filter((result) => !!result),
filter((result) => result !== null && result !== undefined), // Explicitly checking for null/undefined
)
.subscribe((start_info: NewSessionInfo | null) => {
if (start_info != null && start_info.initial_desktop_size !== null) {
Expand Down
60 changes: 39 additions & 21 deletions web-client/iron-svelte-client/src/lib/remote-screen/remote-screen.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@

let uiService: UserInteraction;
let cursorOverrideActive = false;
let showDebugPanel = false;

userInteractionService.subscribe((uis) => {
if (uis != null) {
Expand Down Expand Up @@ -60,27 +61,44 @@
</script>

<div style="display: flex; height: 100%; flex-direction: column; background-color: #2e2e2e;" class:hideall={$showLogin}>
<div style="text-align: center; padding: 10px; background: black;">
<button on:click={() => uiService.setScale(1)}>Fit</button>
<button on:click={() => uiService.setScale(2)}>Full</button>
<button on:click={() => uiService.setScale(3)}>Real</button>
<button on:click={() => uiService.ctrlAltDel()}>Ctrl+Alt+Del</button>
<button on:click={() => uiService.metaKey()}
>Meta
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 512 512"
><title> ionicons-v5_logos</title>
<path d="M480,265H232V444l248,36V265Z" />
<path d="M216,265H32V415l184,26.7V265Z" />
<path d="M480,32,232,67.4V249H480V32Z" />
<path d="M216,69.7,32,96V249H216V69.7Z" />
</svg>
</button>
<button on:click={() => toggleCursorKind()}>Toggle cursor kind</button>
<button on:click={() => uiService.shutdown()}>Terminate Session</button>
<label style="color: white;">
<input on:click={(e) => onUnicodeModeChange(e)} type="checkbox" />
Unicode keyboard mode
</label>
<div>
<div style="text-align: center; padding: 10px; background: black;">
<button on:click={() => (showDebugPanel = !showDebugPanel)}>Toggle debug panel</button>
<button on:click={() => uiService.setScale(1)}>Fit</button>
<button on:click={() => uiService.setScale(2)}>Full</button>
<button on:click={() => uiService.setScale(3)}>Real</button>
<button on:click={() => uiService.ctrlAltDel()}>Ctrl+Alt+Del</button>
<button on:click={() => uiService.metaKey()}
>Meta
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 512 512"
><title> ionicons-v5_logos</title>
<path d="M480,265H232V444l248,36V265Z" />
<path d="M216,265H32V415l184,26.7V265Z" />
<path d="M480,32,232,67.4V249H480V32Z" />
<path d="M216,69.7,32,96V249H216V69.7Z" />
</svg>
</button>
<button on:click={() => toggleCursorKind()}>Toggle cursor kind</button>
<button on:click={() => uiService.shutdown()}>Terminate Session</button>
<label style="color: white;">
<input on:click={(e) => onUnicodeModeChange(e)} type="checkbox" />
Unicode keyboard mode
</label>
</div>

{#if showDebugPanel}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

debug panel is for testing

  1. if input focus is correct
  2. if ::selection selector is applied for element outside of iron-remote-gui

<div id="debug-panel" style="background: black; color: white; padding: 10px;">
debug-panel
<input
type="text"
id="debug-panel-input"
style="width: 100%; height: 100%; background: black; color: white;"
placeholder="see if focus moves correctly"
/>

<p>see if text selection works correctly</p>
</div>
{/if}
</div>
<iron-remote-gui debugwasm="INFO" verbose="true" scale="fit" flexcenter="true" />
</div>
Expand Down
Loading