mirror of
https://github.com/immense/Remotely.git
synced 2025-10-26 11:27:15 +00:00
264 lines
9.6 KiB
Plaintext
264 lines
9.6 KiB
Plaintext
@page
|
|
@using Remotely.Shared.Models
|
|
@inject Remotely.Server.Services.IApplicationConfig AppConfig
|
|
@model Remotely.Server.Pages.RemoteControlModel
|
|
@{
|
|
Layout = null;
|
|
}
|
|
|
|
<!DOCTYPE html>
|
|
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=0.9, user-scalable=no" />
|
|
<link rel="icon" href="~/favicon.ico" />
|
|
<title>Remotely Remote Control</title>
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<link href="~/manifest-rc.json" rel="manifest" />
|
|
<meta name="description" content="Remote support tools designed to get things done quickly." />
|
|
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
|
|
<link href="~/css/remote-control.css" rel="stylesheet" asp-append-version="true" />
|
|
@if (AppConfig.Theme == Remotely.Shared.Enums.Theme.Light)
|
|
{
|
|
<link href="~/css/remote-control-light.css" rel="stylesheet" asp-append-version="true" />
|
|
}
|
|
else
|
|
{
|
|
<link href="~/css/remote-control-dark.css" rel="stylesheet" asp-append-version="true" />
|
|
}
|
|
|
|
@if (Model.RemotelyUser is not null)
|
|
{
|
|
switch (Model.RemotelyUser.UserOptions.Theme)
|
|
{
|
|
case Remotely.Shared.Enums.Theme.Light:
|
|
<link href="~/css/remote-control-light.css" rel="stylesheet" asp-append-version="true" />
|
|
break;
|
|
case Remotely.Shared.Enums.Theme.Dark:
|
|
<link href="~/css/remote-control-dark.css" rel="stylesheet" asp-append-version="true" />
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
else
|
|
{
|
|
if (AppConfig.Theme == Remotely.Shared.Enums.Theme.Light)
|
|
{
|
|
<link href="~/css/remote-control-light.css" rel="stylesheet" asp-append-version="true" />
|
|
}
|
|
else
|
|
{
|
|
<link href="~/css/remote-control-dark.css" rel="stylesheet" asp-append-version="true" />
|
|
}
|
|
}
|
|
|
|
|
|
<link href="~/lib/fontawesome/css/all.min.css" rel="stylesheet" />
|
|
|
|
<environment include="Development">
|
|
<script src="~/lib/microsoft-signalr/signalr.js"></script>
|
|
<script src="~/lib/msgpack5/msgpack5.js"></script>
|
|
<script src="~/lib/microsoft/signalr-protocol-msgpack/dist/browser/signalr-protocol-msgpack.js"></script>
|
|
</environment>
|
|
<environment exclude="Development">
|
|
<script src="~/lib/microsoft-signalr/signalr.min.js"></script>
|
|
<script src="~/lib/msgpack5/msgpack5.min.js"></script>
|
|
<script src="~/lib/microsoft/signalr-protocol-msgpack/dist/browser/signalr-protocol-msgpack.min.js"></script>
|
|
</environment>
|
|
</head>
|
|
<body>
|
|
<div class="remotely-header" title="Remotely">
|
|
<div class="logo-title">
|
|
Remotely
|
|
</div>
|
|
<div class="logo-subtitle">Support Portal</div>
|
|
</div>
|
|
|
|
<button id="keyboardButton" hidden="hidden" title="Invoke the mobile touch keyboard.">
|
|
<i class="fas fa-keyboard align-middle"></i>
|
|
</button>
|
|
|
|
|
|
<button id="menuButton">
|
|
<i class="fas fa-chevron-circle-right"></i>
|
|
</button>
|
|
|
|
<div id="menuFrame">
|
|
|
|
<div class="menu-options-header">
|
|
Actions
|
|
</div>
|
|
|
|
<div>
|
|
<button id="viewOnlyButton" class="option-button" title="If toggled, prevents sending commnads and input to the remote computer.">
|
|
View Only <i class="fas fa-eye"></i>
|
|
</button>
|
|
|
|
<button id="clipboardTransferButton" class="option-button" title="Type the current clipboard text on the remote computer.">
|
|
Clipboard <i class="fas fa-clipboard"></i>
|
|
</button>
|
|
|
|
<button id="blockInputButton" class="option-button" title="Prevent remote user from using keyboard and mouse.">
|
|
Block Remote Input <i class="fas fa-mouse"></i>
|
|
</button>
|
|
|
|
<button id="inviteButton" class="option-button" title="Copy a link that lets another person view the remote screen.">
|
|
Invite Others <i class="fas fa-user-plus"></i>
|
|
</button>
|
|
|
|
<button id="audioButton" class="option-button" title="Windows only. Stream the remote audio to the browser.">
|
|
Audio <i class="fas fa-volume-up"></i>
|
|
</button>
|
|
|
|
<button id="fileTransferButton" class="option-button" title="Transfer files to the remote computer.">
|
|
File Transfer <i class="fas fa-file-upload"></i>
|
|
</button>
|
|
|
|
<button id="ctrlAltDelButton" class="option-button" title="Simulate the Ctrl+Alt+Del command on the remote computer.">
|
|
Ctrl+Alt+Del <i class="fas fa-sign-in-alt"></i>
|
|
</button>
|
|
|
|
<button id="disconnectButton" class="option-button" title="Disconnect from the current session.">
|
|
Disconnect <i class="fas fa-window-close"></i>
|
|
</button>
|
|
</div>
|
|
|
|
|
|
<div class="menu-options-header">
|
|
View
|
|
</div>
|
|
|
|
<div>
|
|
<button id="streamVideoButton" class="option-button" hidden title="Reduce bandwidth and increase FPS, but increase input delay.">
|
|
Stream Mode <i class="fas fa-video"></i>
|
|
</button>
|
|
|
|
<button id="changeScreenButton" class="option-button" title="Switch monitors on remote multi-monitor setups.">
|
|
Monitors <i class="fas fa-desktop"></i>
|
|
</button>
|
|
|
|
<button id="fullScreenButton" class="option-button" title="Enter fullscreen mode.">
|
|
Fullscreen <i class="fas fa-window-maximize"></i>
|
|
</button>
|
|
|
|
|
|
<button id="fitToScreenButton" class="toggled option-button" title="If toggled, will resize image to fit in the window.">
|
|
Fit <i class="fas fa-expand"></i>
|
|
</button>
|
|
</div>
|
|
|
|
|
|
<div class="menu-options-header">
|
|
Recording
|
|
</div>
|
|
|
|
<div>
|
|
<button id="recordSessionButton" class="option-button" title="Record session as a WEBM video in the browser.">
|
|
Start <i class="fas fa-record-vinyl"></i>
|
|
</button>
|
|
|
|
<button id="downloadRecordingButton" class="option-button" title="Download the recorded session as a WEBM file.">
|
|
Download <i class="fas fa-download"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="menu-options-header">
|
|
Windows Session
|
|
</div>
|
|
<div>
|
|
<select id="windowsSessionSelect"
|
|
title="Switch to a different Windows session."
|
|
class="option-button"
|
|
style="height: 30px; width: 90%; margin: 5px 0;"></select>
|
|
</div>
|
|
|
|
<div style="margin-top:15px;">
|
|
<span>Connection: </span>
|
|
<i id="connectionRelayedIcon" class="fas fa-wifi connection-icon" title="Connection is relayed"></i>
|
|
<i id="connectionP2PIcon" class="fas fa-wifi connection-icon" title="Connection is peer-to-peer" style="display:none"></i>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="screenSelectBar" class="horizontal-button-bar">
|
|
|
|
</div>
|
|
|
|
<div id="clipboardTransferBar" class="horizontal-button-bar">
|
|
<div style="color:white; font-size:12px">
|
|
Shared Clipboard
|
|
</div>
|
|
<div style="color:white; font-size:12px;">
|
|
<button id="typeClipboardButton" class="horizontal-bar-button">Type Clipboard</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="fileTransferBar" class="horizontal-button-bar">
|
|
<div style="color:white; font-size:12px">
|
|
File Transfer
|
|
</div>
|
|
<div style="color:white; font-size:12px;">
|
|
<button id="fileUploadButton" class="horizontal-bar-button">Upload File</button>
|
|
<button id="fileDownloadButton" class="horizontal-bar-button">Download File</button>
|
|
</div>
|
|
</div>
|
|
<div id="connectBox" class="center-connection-box" style="display: none">
|
|
<h3>Connect to a client:</h3>
|
|
<div class="form-block">
|
|
<label>Your Name (shown to client): </label>
|
|
<br />
|
|
<input id="nameInput" type="text" value="@Model.RemotelyUser?.UserOptions?.DisplayName" />
|
|
</div>
|
|
<div class="form-block">
|
|
<label>Session ID: </label>
|
|
<br />
|
|
<input id="sessionIDInput" type="text" pattern="[0-9 ]+" />
|
|
</div>
|
|
<div class="right-aligned">
|
|
<button id="connectButton">Connect</button>
|
|
</div>
|
|
<div id="statusMessage" class="status-message">
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div id="disconnectedBox" class="center-connection-box" style="text-align: center; display: none;">
|
|
<h3>Disconnected from client.</h3>
|
|
</div>
|
|
|
|
|
|
<div id="screenViewerWrapper" class="center-aligned">
|
|
<canvas id="screenViewer" hidden="hidden"></canvas>
|
|
<video id="videoScreenViewer" hidden="hidden"></video>
|
|
<input id="fileTransferInput" hidden="hidden" type="file" multiple />
|
|
<textarea id="touchKeyboardTextArea" value=" #"> #</textarea>
|
|
</div>
|
|
|
|
<div id="toastsWrapper">
|
|
|
|
</div>
|
|
|
|
|
|
<div id="fileTransferDiv" hidden="hidden">
|
|
<span id="fileTransferNameSpan" class="mr-1 font-weight-bold" style="vertical-align: middle;"></span>
|
|
<progress id="fileTransferProgress" style="vertical-align: middle; width: 100%"></progress>
|
|
</div>
|
|
|
|
<footer>
|
|
<div class="footer-wrapper">
|
|
© 2021 - <a href="https://lucency.co">Translucency Software</a>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="~/src/RemoteControl/App.js" type="module"></script>
|
|
<script>
|
|
window.addEventListener("load", () => {
|
|
ViewerApp.Init();
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|