arc/docs/custom.html
AuxXxilium 92f91d91c0 custom: update
Signed-off-by: AuxXxilium <info@auxxxilium.tech>
2024-06-07 22:21:40 +02:00

268 lines
12 KiB
HTML

<!DOCTYPE html>
<html lang="en-US" data-color-mode="auto" data-light-theme="light" data-dark-theme="dark"
data-a11y-animated-images="system">
<head>
<meta charset="utf-8" />
<link rel="dns-prefetch" href="https://github.githubassets.com" />
<link rel="dns-prefetch" href="https://avatars.githubusercontent.com" />
<link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com" />
<link rel="dns-prefetch" href="https://user-images.githubusercontent.com/" />
<link rel="preconnect" href="https://github.githubassets.com" crossorigin />
<link rel="preconnect" href="https://avatars.githubusercontent.com" />
<link crossorigin="anonymous" media="all" rel="stylesheet"
href="https://github.githubassets.com/assets/light-0eace2597ca3.css" />
<link crossorigin="anonymous" media="all" rel="stylesheet"
href="https://github.githubassets.com/assets/dark-a167e256da9c.css" />
<link crossorigin="anonymous" media="all" rel="stylesheet"
href="https://github.githubassets.com/assets/primer-711f412bb361.css" />
<link crossorigin="anonymous" media="all" rel="stylesheet"
href="https://github.githubassets.com/assets/global-78704364aaba.css" />
<style>
select,
input {
width: 400px;
}
a {
color: #f72f2f;
text-decoration: none;
}
.State--merged {
background-color: #ff0000;
}
.btn {
color: #ffffff;
background-color: #ff0000;
border-color: #ffffff;
transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
transition-property: color,background-color,border-color;
}
a:focus-visible, button:focus-visible, [role=button]:focus-visible, input[type=radio]:focus-visible, input[type=checkbox]:focus-visible {
outline: 2px solid #ff0000;
outline-offset: -2px;
box-shadow: none;
}
a:focus, button:focus, [role=button]:focus, input[type=radio]:focus, input[type=checkbox]:focus {
outline: 2px solid #ff0000;
outline-offset: -2px;
box-shadow: none;
}
</style>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js"></script>
<!-- <script src="https://fastly.jsdelivr.net/npm/marked/marked.min.js"></script> -->
<script type="application/javascript">
var repo = "AuxXxilium/arc"
function httpGetAsync(theUrl, callback) {
let xmlHttpReq = new XMLHttpRequest();
xmlHttpReq.onreadystatechange = function () {
if (xmlHttpReq.readyState == 4 && xmlHttpReq.status == 200)
callback(xmlHttpReq.responseText);
};
xmlHttpReq.open("GET", theUrl, true); // true for asynchronous
xmlHttpReq.send(null);
}
window.onload = function () {
init();
}
function init() {
httpGetAsync("https://raw.githubusercontent.com/AuxXxilium/arc/page/docs/models.json", function (result) {
_modules = JSON.parse(result);
$("#model").on("change", changeModel);
setModels();
});
}
function setModels() {
var models = Object.keys(_modules).sort();
$("#model")[0].options.length = 0;
for (var i = 0; i < models.length; i++) {
var model = models[i];
$("#model").append(`<option value="${model}">${model}</option>`);
}
changeModel();
}
function changeModel() {
model = $("#model").val();
var versions = _modules[model];
$("#version")[0].options.length = 0;
for (var i = 0; i < versions.length; i++) {
var version = versions[i];
$("#version").append(`<option value="${version}">${version}</option>`);
}
changeproductsimage();
changeAddons();
}
function changeproductsimage() {
var model = $("#model").val().replace("#", "").replace("+", "%2B");
$('#products').html(`<img src="https://www.synology.com/api/products/getPhoto?product=${model}&type=img_s&sort=0" width="20%">`);
}
function changeAddons() {
var model = $("#model").val();
httpGetAsync("https://raw.githubusercontent.com/AuxXxilium/arc/page/docs/addons.json", function (result) {
var addons = JSON.parse(result);
var selectedAddons = addons[model];
$("#addons")[0].options.length = 0;
for (var i = 0; i < selectedAddons.length; i++) {
var addon = selectedAddons[i];
$("#addons").append(`<option value="${addon}">${addon}</option>`);
}
});
}
function createIssues() {
var form = document.getElementById("inputs");
let formData = new FormData(form);
var title = "custom";
var body = {};
var _parameters = ["title", "model", "version", "addons", "macsys", "customkernel", "format"];
for (var key in _parameters) {
var name = _parameters[key];
if (name == "title") {
if ($("#" + name).val()) {
title += " " + $("#" + name).val();
} else {
title += " " + new Date().toISOString().substr(0, 10);
}
continue;
}
if ($("#" + name).val()) {
body[name] = $("#" + name).val();
}
}
body = JSON.stringify(body).replace(/\+/g, "%2b");
window.location.href = `https://github.com/${repo}/issues/new?assignees=&labels=custom&projects=&template=custom_build.md&title=${title}&body=${body}`;
}
</script>
<title>Arc Loader - Custom</title>
</head>
<body class="logged-in env-production page-responsive" style="word-wrap: break-word">
<div class="application-main left-0 text-left p-3 mx-auto container-xl px-3 px-md-4 px-lg-5 mt-4">
<pre id="logo">
<img src="https://raw.githubusercontent.com/AuxXxilium/arc/page/docs/arc_loader.png" width="22%">
</pre>
<div class="image" id="products" style="height: 50px; margin-left: 100px;">
<img src="https://www.synology.com/img/products/detail/SA6400/heading.png" width="20%">
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<p>&nbsp;</p>
</div>
<div class="form-group-body">
<p>&nbsp;</p>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Notice:</label>
</div>
<div class="form-group-body">
<p class="form-control input-contrast input-sm">This builds are not stable everytime and have limited features.
To get full features and options, use <a href="https://github.com/AuxXxilium/arc">Arc Loader</a>.
Please check the <a href="https://github.com/AuxXxilium/AuxXxilium/wiki" target="_blank">Wiki</a> before you start a build.</p>
<p class="form-control input-contrast input-sm">Build is based on <img src="https://img.shields.io/github/v/release/AuxXxilium/arc?sort=date&display_name=release&style=flat-square&logo=github&label=release&link=https%3A%2F%2Fgithub.com%2FAuxXxilium%2Farc>.</p>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Title:</label>
</div>
<div class="form-group-body">
<input class="form-control input-contrast input-sm" type="text" id="title" name="inputs[title]" value="" />
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Model (Choose DSM Model):</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="model" name="inputs[model]" value="">
<option selected="selected" value="SA6400">SA6400</option>
</select>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Version (Choose DSM Version):</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="version" name="inputs[version]" value="">
<option selected="selected" value="7.2">7.2</option>
</select>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Activate Addons (Select only needed Addons!!!):<br />Multi-Selection: Ctrl + Left Click</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="addons" name="inputs[addons]" value="" multiple>
<option selected="selected" value="acpid">acpid</option>
</select>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Macsys (Choose an Option):</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="macsys" name="inputs[macsys]" value="">
<option selected="selected" value="hardware">use hardware mac</option>
<option value="custom">use fake mac</option>
</select>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Switch Kernel (Only for SA6400):</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="customkernel" name="inputs[customkernel]" value="">
<option selected="selected" value="official">official</option>
<option value="custom">custom</option>
</select>
</div>
</div>
<div class="form-group mt-1 mb-2 ">
<div class="form-group-header">
<label class="color-fg-default text-mono f6">Format (Choose Format for Output File):</label>
</div>
<div class="form-group-body">
<select class="form-select form-control select-sm input-contrast" id="format" name="inputs[format]" value="">
<option selected="selected" value="img">img</option>
<option value="dyn">vmdk-dyn</option>
<option value="flat">vmdk-flat</option>
</select>
</div>
</div>
<div data-replace-remote-form-target="" class="workflow-dispatch">
<form id="inputs">
<button type="button" class="btn State--merged" onclick="return createIssues()" autofocus="">
Start Build
</button>
</form>
</div>
</div>
<footer class="footer width-full container-xl mt-3 text-center color-fg-muted">
<a aria-label="AuxXxilium" title="GitHub" class="footer-octicon mr-2" href="https://github.com/AuxXxilium">
<img class="avatar rounded-2 avatar-user" src="https://avatars.githubusercontent.com/u/67025065?v=4"
width="40" height="40" alt="AuxXxilium" />
</a>
<span>Copyright © 2024 by <a href="https://github.com/AuxXxilium">AuxXxilium</a><br>&nbsp;</span>
</footer>
</body>
</html>