Skip to content

Commit

Permalink
format
Browse files Browse the repository at this point in the history
  • Loading branch information
irvingoujAtDevolution committed Sep 17, 2024
1 parent b06a393 commit 749e0b8
Show file tree
Hide file tree
Showing 4 changed files with 102 additions and 89 deletions.
7 changes: 3 additions & 4 deletions web-client/iron-svelte-client/src/app.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!doctype html>
<html lang="en" style="height: 100%; margin: 0; padding: 0; overflow: hidden;">
<html lang="en" style="height: 100%; margin: 0; padding: 0; overflow: hidden">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
Expand All @@ -13,7 +13,7 @@
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body class="light no-scroll-bar" style="height: 100%; margin: 0; padding: 0;">
<body class="light no-scroll-bar" style="height: 100%; margin: 0; padding: 0">
<div style="display: contents" class="mdc-typography--font-family">%sveltekit.body%</div>
</body>
</html>
Expand All @@ -26,5 +26,4 @@
.no-scroll-bar::-webkit-scrollbar {
display: none;
}

</style>
</style>
9 changes: 7 additions & 2 deletions web-client/iron-svelte-client/src/lib/login/login.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@
desktopSize,
pcb,
kdc_proxy_url,
true
true,
),
)
.pipe(
Expand Down Expand Up @@ -175,7 +175,12 @@
</div>
<div class="field label border">
<div style="display: flex; height: 100%; align-items: center; font-size: 1.5em;">
<input id="use_pop_up" type="checkbox" bind:value={pop_up} style="width: 1.5em; height: 1.5em; margin-right: 0.5em;">
<input
id="use_pop_up"
type="checkbox"
bind:value={pop_up}
style="width: 1.5em; height: 1.5em; margin-right: 0.5em;"
/>
<label for="use_pop_up">Use Pop Up</label>
</div>
</div>
Expand Down
174 changes: 92 additions & 82 deletions web-client/iron-svelte-client/src/lib/popup-screen/popup-screen.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -32,22 +32,25 @@
}
const parsedData = JSON.parse(atob(data));
const { hostname, gatewayAddress, domain, username, password, authtoken, kdc_proxy_url, pcb, desktopSize } = parsedData;
uiService.connect(
username,
password,
hostname,
gatewayAddress,
domain,
authtoken,
desktopSize,
pcb,
kdc_proxy_url,
true
).then(() => {
uiService.setVisibility(true);
window.onresize = onWindowResize;
});
const { hostname, gatewayAddress, domain, username, password, authtoken, kdc_proxy_url, pcb, desktopSize } =
parsedData;
uiService
.connect(
username,
password,
hostname,
gatewayAddress,
domain,
authtoken,
desktopSize,
pcb,
kdc_proxy_url,
true,
)
.then(() => {
uiService.setVisibility(true);
window.onresize = onWindowResize;
});
}
});
Expand Down Expand Up @@ -98,76 +101,83 @@
});
});
</script>

<div
id = "popup-screen"
style="display: flex; height: 100%; flex-direction: column; background-color: #2e2e2e; position: relative"
on:mousemove="{(event)=>{ if (event.clientY < 100) { showUtilityBar = true; } else { showUtilityBar = false; } }}"
id="popup-screen"
style="display: flex; height: 100%; flex-direction: column; background-color: #2e2e2e; position: relative"
on:mousemove={(event) => {
if (event.clientY < 100) {
showUtilityBar = true;
} else {
showUtilityBar = false;
}
}}
>
<div class="tool-bar" class:hidden="{!showUtilityBar}">
<div class="toolbar-container">
<button on:click="{() => toggleFullScreen()}">Full Screen</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 class="tool-bar" class:hidden={!showUtilityBar}>
<div class="toolbar-container">
<button on:click={() => toggleFullScreen()}>Full Screen</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>
</div>
<iron-remote-gui debugwasm="INFO" verbose="true" scale="fit" flexcenter="true" />
<iron-remote-gui debugwasm="INFO" verbose="true" scale="fit" flexcenter="true" />
</div>

<style>
.tool-bar {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 50%;
background: rgba(0, 0, 0, 0.7); /* 70% opacity */
color: white;
z-index: 100;
display: flex;
justify-content: center;
padding: 10px;
border-radius: 8px;
}
.toolbar-container {
display: flex;
gap: 10px; /* Spacing between buttons */
}
button {
background-color: #444;
color: white;
padding: 8px 12px;
border: none;
border-radius: 4px;
font-size: 0.9em; /* Smaller button size */
cursor: pointer;
}
button svg {
vertical-align: middle;
}
button:hover {
background-color: #666;
}
.hidden {
display: none;
}
.tool-bar {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 50%;
background: rgba(0, 0, 0, 0.7); /* 70% opacity */
color: white;
z-index: 100;
display: flex;
justify-content: center;
padding: 10px;
border-radius: 8px;
}
.toolbar-container {
display: flex;
gap: 10px; /* Spacing between buttons */
}
button {
background-color: #444;
color: white;
padding: 8px 12px;
border: none;
border-radius: 4px;
font-size: 0.9em; /* Smaller button size */
cursor: pointer;
}
button svg {
vertical-align: middle;
}
button:hover {
background-color: #666;
}
.hidden {
display: none;
}
</style>
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

<script lang="ts">
import Message from '$lib/messages/message.svelte';
import PopupScreen from '$lib/popup-screen/popup-screen.svelte';
Expand Down

0 comments on commit 749e0b8

Please sign in to comment.