215 lines
8.1 KiB
HTML
215 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Debrid Manager</title>
|
|
<!-- Bootstrap CSS -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<!-- Bootstrap Icons -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css" rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet"/>
|
|
<!-- Select2 Bootstrap 5 Theme CSS -->
|
|
<link rel="stylesheet"
|
|
href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css"/>
|
|
<style>
|
|
.select2-container--bootstrap-5 .select2-results__option {
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
.select2-result img {
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.select2-container--bootstrap-5 .select2-results__option--highlighted {
|
|
background-color: #f8f9fa !important;
|
|
color: #000 !important;
|
|
}
|
|
|
|
.select2-container--bootstrap-5 .select2-results__option--selected {
|
|
background-color: #e9ecef !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
|
<div class="container-fluid">
|
|
<span class="navbar-brand">Debrid Manager</span>
|
|
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container mt-4">
|
|
<div class="row mb-5">
|
|
<div class="col-md-8">
|
|
<div class="mb-3">
|
|
<label for="magnetURI" class="form-label">Magnet Link</label>
|
|
<textarea class="form-control" id="magnetURI" rows="3"></textarea>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="selectArr" class="form-label">Enter Category</label>
|
|
<input type="email" class="form-control" id="selectArr"
|
|
placeholder="Enter Category(e.g sonarr, radarr, radarr4k)">
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="isSymlink">
|
|
<label class="form-check-label" for="isSymlink">
|
|
Not Symlink(Download real files instead of symlinks from Debrid)
|
|
</label>
|
|
</div>
|
|
<div class="mt-3">
|
|
<button class="btn btn-primary" id="addToArr">
|
|
Add to Arr
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr class="mb-4">
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<h4>Repair</h4>
|
|
<div class="mb-3">
|
|
<label for="selectRepairArr" class="form-label">Select ARR</label>
|
|
<select class="form-select" id="selectRepairArr">
|
|
<option value="">Select ARR</option>
|
|
</select>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="tvids" class="form-label">TV IDs</label>
|
|
<input type="text" class="form-control" id="tvids" placeholder="Enter TV IDs (comma-separated)">
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="isAsync" checked>
|
|
<label class="form-check-label" for="isAsync">
|
|
Repair Asynchronously(run in background)
|
|
</label>
|
|
</div>
|
|
<div class="mt-3">
|
|
<button class="btn btn-primary" id="repairBtn">
|
|
Repair
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bootstrap JS and Popper.js -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
|
<!-- jQuery -->
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
|
<script>
|
|
$(document).ready(function () {
|
|
let $selectArr = $('#selectArr');
|
|
let $selectRepairArr = $('#selectRepairArr');
|
|
let $addBtn = $('#addToArr');
|
|
let $repairBtn = $('#repairBtn');
|
|
|
|
// Initialize Select2
|
|
$('.select2-multi').select2({
|
|
theme: 'bootstrap-5',
|
|
width: '100%',
|
|
placeholder: 'Select options',
|
|
allowClear: true
|
|
});
|
|
|
|
function fetchArrs() {
|
|
fetch('/internal/arrs')
|
|
.then(response => response.json())
|
|
.then(arrs => {
|
|
// Populate both selects
|
|
$selectArr.empty().append('<option value="">Select Arr</option>');
|
|
$selectRepairArr.empty().append('<option value="">Select Arr</option>');
|
|
|
|
arrs.forEach(arr => {
|
|
$selectArr.append(`<option value="${arr.name}">${arr.name}</option>`);
|
|
$selectRepairArr.append(`<option value="${arr.name}">${arr.name}</option>`);
|
|
});
|
|
})
|
|
.catch(error => console.error('Error fetching arrs:', error));
|
|
}
|
|
|
|
$addBtn.click(function () {
|
|
let oldText = $(this).text();
|
|
$(this).prop('disabled', true).prepend('<span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>');
|
|
let magnet = $('#magnetURI').val();
|
|
if (!magnet) {
|
|
$(this).prop('disabled', false).text(oldText);
|
|
alert('Please provide a magnet link or upload a torrent file!');
|
|
|
|
return;
|
|
}
|
|
let data = {
|
|
arr: $selectArr.val(),
|
|
url: magnet,
|
|
notSymlink: $('#isSymlink').is(':checked'),
|
|
};
|
|
console.log('Adding to Arr:', data);
|
|
fetch('/internal/add', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(data)
|
|
})
|
|
.then(async response => {
|
|
if (!response.ok) {
|
|
const errorText = await response.text();
|
|
throw new Error(errorText);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(result => {
|
|
console.log('Added to Arr:', result);
|
|
$(this).prop('disabled', false).text(oldText);
|
|
alert('Added to Arr successfully!');
|
|
})
|
|
.catch(error => {
|
|
$(this).prop('disabled', false).text(oldText);
|
|
alert(`Error adding to Arr: ${error.message || error}`);
|
|
});
|
|
});
|
|
|
|
fetchArrs();
|
|
$repairBtn.click(function () {
|
|
let oldText = $(this).text();
|
|
$(this).prop('disabled', true)
|
|
.prepend('<span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>');
|
|
|
|
let selectedArr = $selectRepairArr.val();
|
|
let tvids = $('#tvids').val();
|
|
|
|
let data = {
|
|
arr: selectedArr,
|
|
tvids: tvids,
|
|
async: $('#isAsync').is(':checked'),
|
|
};
|
|
|
|
fetch('/internal/repair', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(data)
|
|
})
|
|
.then(async response => {
|
|
if (!response.ok) {
|
|
const errorText = await response.text();
|
|
throw new Error(errorText);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(result => {
|
|
$(this).prop('disabled', false).text(oldText);
|
|
alert(result);
|
|
})
|
|
.catch(error => {
|
|
$(this).prop('disabled', false).text(oldText);
|
|
alert(`Error repairing: ${error.message || error}`);
|
|
});
|
|
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |