260 lines
12 KiB
HTML
260 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>RustDesk Custom Client Builder</title>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
|
||
<style>
|
||
body {
|
||
font-family: 'Roboto', sans-serif;
|
||
background-color: #000;
|
||
color: #e0e0e0;
|
||
margin: 0;
|
||
padding: 20px;
|
||
}
|
||
.platform {
|
||
display: grid;
|
||
grid-template-columns: 1fr;
|
||
grid-gap: 20px;
|
||
margin: 0 auto;
|
||
padding: 20px;
|
||
max-width: 1200px;
|
||
}
|
||
.container {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr; /* Adjust as needed */
|
||
grid-gap: 20px;
|
||
margin: 0 auto; /* Center the container horizontally */
|
||
padding: 20px;
|
||
max-width: 1200px;
|
||
}
|
||
.column {
|
||
flex: 50%;
|
||
}
|
||
h1 {
|
||
color: #fff;
|
||
text-align: center;
|
||
grid-column: 1 / -1;
|
||
}
|
||
h2 {
|
||
color: #fff;
|
||
margin-top: 0;
|
||
}
|
||
.section {
|
||
background-color: #111;
|
||
border-radius: 8px;
|
||
padding: 20px;
|
||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||
flex: 50%;
|
||
}
|
||
label {
|
||
display: block;
|
||
margin-bottom: 5px;
|
||
color: #bbb;
|
||
}
|
||
input[type="text"], input[type="password"], select, textarea {
|
||
width: 100%;
|
||
padding: 8px;
|
||
margin-bottom: 10px;
|
||
background-color: #222;
|
||
border: 1px solid #444;
|
||
border-radius: 4px;
|
||
color: #fff;
|
||
}
|
||
input[type="radio"], input[type="checkbox"] {
|
||
margin-right: 5px;
|
||
}
|
||
button {
|
||
background-color: #0077ff;
|
||
color: #fff;
|
||
border: none;
|
||
padding: 10px 20px;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
transition: background-color 0.3s ease;
|
||
}
|
||
button:hover {
|
||
background-color: #0066cc;
|
||
}
|
||
.platform-icons {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
margin-bottom: 20px;
|
||
}
|
||
.platform-icon {
|
||
font-size: 32px;
|
||
color: #bbb;
|
||
cursor: pointer;
|
||
transition: color 0.3s ease;
|
||
}
|
||
.platform-icon:hover, .platform-icon.active {
|
||
color: #fff;
|
||
}
|
||
.checkbox-group {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||
gap: 10px;
|
||
}
|
||
.checkbox-group label {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.preview-image {
|
||
max-width: 100%;
|
||
max-height: 100px;
|
||
margin-top: 10px;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1><i class="fas fa-cogs"></i> RustDesk Custom Client Builder</h1>
|
||
<form action="/generator" method="post" enctype="multipart/form-data">
|
||
<div class="platform">
|
||
<h2><i class="fas fa-desktop"></i> Select Platform</h2>
|
||
<div class="platform-icons">
|
||
<i class="fab fa-windows platform-icon active" data-platform="windows"></i>
|
||
<i class="fab fa-linux platform-icon" data-platform="linux"></i>
|
||
<i class="fab fa-android platform-icon" data-platform="android"></i>
|
||
</div>
|
||
<select name="platform" id="id_platform">
|
||
<option value="windows" selected>Windows</option>
|
||
<option value="linux">Linux</option>
|
||
<option value="android">Android</option>
|
||
</select>
|
||
<label for="{{ form.version.id_for_label }}">Rustdesk Version:</label>
|
||
{{ form.version }}
|
||
<label for="{{ form.delayFix.id_for_label }}">{{ form.delayFix }} Fix connection delay when using third-party API</label>
|
||
</div>
|
||
</div>
|
||
<div class="container">
|
||
<div class="section">
|
||
<h2><i class="fas fa-sliders-h"></i> General</h2>
|
||
<label for="{{ form.exename.id_for_label }}">Name of the configuration:</label>
|
||
{{ form.exename }}<br><br>
|
||
<label for="{{ form.appname.id_for_label }}">Custom Application Name (leave blank to use default):</label>
|
||
{{ form.appname }}<br><br>
|
||
<label for="{{ form.direction.id_for_label }}">Connection Type:</label>
|
||
{{ form.direction }}<br><br>
|
||
<label for="{{ form.installation.id_for_label }}">Disable Installation:</label>
|
||
{{ form.installation }}<br><br>
|
||
<label for="{{ form.settings.id_for_label }}">Disable Settings:</label>
|
||
{{ form.settings }}<br><br>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2><i class="fas fa-server"></i> Custom Server</h2>
|
||
<label for="{{ form.serverIP.id_for_label }}">Host:</label>
|
||
{{ form.serverIP }}<br><br>
|
||
<label for="{{ form.key.id_for_label }}">Key:</label>
|
||
{{ form.key }}<br><br>
|
||
<label for="{{ form.apiServer.id_for_label }}">API:</label>
|
||
{{ form.apiServer }}<br><br>
|
||
<label for="{{ form.urlLink.id_for_label }}">Custom URL for links (replaces https://rustdesk.com):</label>
|
||
{{ form.urlLink }}<br><br>
|
||
</div>
|
||
</div>
|
||
<div class="container">
|
||
<div class="section">
|
||
<h2><i class="fas fa-shield-alt"></i> Security</h2>
|
||
<label for="{{ form.runasadmin.id_for_label }}">Always run as Administrator?</label>
|
||
{{ form.runasadmin }}<br><br>
|
||
<label for="{{ form.passApproveMode.id_for_label }}">Password Approve mode:</label>
|
||
{{ form.passApproveMode }}<br><br>
|
||
<label for="{{ form.permanentPassword.id_for_label }}">Set Permanent Password:</label>
|
||
{{ form.permanentPassword }} *The password is used as default, but can be changed by the client<br><br>
|
||
|
||
|
||
<label for="{{ form.denyLan.id_for_label }}">{{ form.denyLan }} Deny LAN discovery</label><br>
|
||
|
||
<label for="{{ form.enableDirectIP.id_for_label }}">{{ form.enableDirectIP }} Enable direct IP access</label><br>
|
||
|
||
<label for="{{ form.autoClose.id_for_label }}">{{ form.autoClose }} Automatically close incoming sessions on user inactivity</label><br>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2><i class="fas fa-paint-brush"></i> Visual</h2>
|
||
<label for="{{ form.iconfile.id_for_label }}">Custom App Icon (in .png format)</label>
|
||
{{ form.iconfile }}<br><br>
|
||
<!-- <input type="file" name="iconfile" id="iconfile" accept="image/png"> -->
|
||
<div id="icon-preview"></div><br><br>
|
||
<label for="{{ form.logofile.id_for_label }}">Custom App Logo (in .png format)</label>
|
||
{{ form.logofile }}<br><br>
|
||
<!-- <input type="file" name="logofile" id="logofile" accept="image/png"> -->
|
||
<div id="logo-preview"></div><br><br>
|
||
<label for="{{ form.theme.id_for_label }}">Theme:</label>
|
||
{{ form.theme }} {{ form.themeDorO }} *Default sets the theme but allows the client to change it, Override sets the theme permanently.<br><br>
|
||
</div>
|
||
</div>
|
||
<div class="container">
|
||
<div class="section">
|
||
<h2><i class="fas fa-lock"></i> Permissions</h2>
|
||
The following Permissions can be set as default (the user can change the settins) or override (the settings cannot be changed).<br>
|
||
{{ form.permissionsDorO }}
|
||
<label for="{{ form.permissionsType.id_for_label }}">Permission type:</label>
|
||
{{ form.permissionsType }}<br><br>
|
||
<div class="checkbox-group">
|
||
<label for="{{ form.enableKeyboard.id_for_label }}">{{ form.enableKeyboard }} Enable keyboard/mouse</label>
|
||
<label for="{{ form.enableClipboard.id_for_label }}">{{ form.enableClipboard }} Enable clipboard</label>
|
||
<label for="{{ form.enableFileTransfer.id_for_label }}">{{ form.enableFileTransfer }} Enable file transfer</label>
|
||
<label for="{{ form.enableAudio.id_for_label }}">{{ form.enableAudio }} Enable audio</label>
|
||
<label for="{{ form.enableTCP.id_for_label }}">{{ form.enableTCP }} Enable TCP tunneling</label>
|
||
<label for="{{ form.enableRemoteRestart.id_for_label }}">{{ form.enableRemoteRestart }} Enable remote restart</label>
|
||
<label for="{{ form.enableRecording.id_for_label }}">{{ form.enableRecording }} Enable recording session</label>
|
||
<label for="{{ form.enableBlockingInput.id_for_label }}">{{ form.enableBlockingInput }} Enable blocking user input</label>
|
||
<label for="{{ form.enableRemoteModi.id_for_label }}">{{ form.enableRemoteModi }} Enable remote configuration modification</label>
|
||
</div><br>
|
||
<h2><i class="fas fa-code"></i> Code Changes</h2>
|
||
<label for="{{ form.cycleMonitor.id_for_label }}">{{ form.cycleMonitor }} Add a button to cycle through available monitors to the minimized toolbar.</label><br>
|
||
<label for="{{ form.xOffline.id_for_label }}">{{ form.xOffline }} Display an X for offline devices in the addressbook.</label><br>
|
||
<label for="{{ form.hidecm.id_for_label }}">{{ form.hidecm }} Allow hiding the connection window from remote screen.</label><br>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2><i class="fas fa-cog"></i> Other</h2>
|
||
<label for="{{ form.removeWallpaper.id_for_label }}">{{ form.removeWallpaper }} Remove wallpaper during incoming sessions</label><br>
|
||
<label for="{{ form.defaultManual.id_for_label }}">Default settings</label><br>
|
||
{{ form.defaultManual }}<br><br>
|
||
<label for="{{ form.overrideManual.id_for_label }}">Override settings</label><br>
|
||
{{ form.overrideManual }}<br><br>
|
||
</div>
|
||
</div>
|
||
<div class="platform">
|
||
<div class="section">
|
||
<button type="submit"><i class="fas fa-rocket"></i> Generate Custom Client</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<a href="https://github.com/bryangerlach/rdgen">Source Code on github</a>
|
||
<script>
|
||
document.querySelectorAll('.platform-icon').forEach(icon => {
|
||
icon.addEventListener('click', function() {
|
||
document.querySelectorAll('.platform-icon').forEach(i => i.classList.remove('active'));
|
||
this.classList.add('active');
|
||
document.getElementById('id_platform').value = this.dataset.platform;
|
||
});
|
||
});
|
||
document.getElementById("{{ form.iconfile.id_for_label }}").addEventListener('change', function(event) {
|
||
previewImage(event.target, 'icon-preview');
|
||
});
|
||
document.getElementById("{{ form.logofile.id_for_label }}").addEventListener('change', function(event) {
|
||
previewImage(event.target, 'logo-preview');
|
||
});
|
||
function previewImage(input, previewContainerId) {
|
||
if (input.files && input.files[0]) {
|
||
var reader = new FileReader();
|
||
reader.onload = function(e) {
|
||
var img = document.createElement('img');
|
||
img.src = e.target.result;
|
||
img.style.maxWidth = '300px';
|
||
img.style.maxHeight = '60px';
|
||
document.getElementById(previewContainerId).innerHTML = '';
|
||
document.getElementById(previewContainerId).appendChild(img);
|
||
};
|
||
reader.readAsDataURL(input.files[0]);
|
||
}
|
||
}
|
||
</script>
|
||
</body>
|
||
</html> |