Viren070/MediaFusion
1
0
Fork 0
mirror of https://github.com/Viren070/MediaFusion.git synced 2025-12-01 23:21:11 +01:00
Code Issues Packages Projects Releases Wiki Activity
Files
d29d385bab89d065d49e38ee90fca190873869a3
MediaFusion/resources/html/configure.html
T

383 lines
28 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Configuration - Stremio Addon</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
<link href="/static/css/styles.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet"/>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-10 col-md-11 col-lg-11 config-container">
<img class="logo" src="/static/images/mediafusion_logo.png" alt="MediaFusion Logo">
<h3 class="text-center mb-4">MediaFusion Addon Configuration</h3>
<!-- Configuration Form -->
<form id="configForm" class="mx-5 mx-lg-1 mx-md-3 mx-sm-4">
<!-- Streaming Provider -->
<div class="section-container">
<h4 class="section-header">Streaming Provider Configuration</h4>
<hr class="section-divider">
<label for="provider_service">Streaming Provider: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Choose a streaming provider to integrate with the addon. Each has unique features and capabilities."></span></label>
<select class="form-control" name="provider_service" id="provider_service" onchange="updateProviderFields(true)">
<option value="" {% if not user_data.streaming_provider.service %}selected{% endif %}>Direct Torrent (Free)</option>
<option value="pikpak" {% if user_data.streaming_provider.service=='pikpak' %}selected{% endif %}>PikPak (Free Quota)</option>
<option value="seedr" {% if user_data.streaming_provider.service=='seedr' %}selected{% endif %}>Seedr.cc (Free Quota)</option>
<option value="offcloud" {% if user_data.streaming_provider.service=='offcloud' %}selected{% endif %}>OffCloud (Free Quota)</option>
<option value="torbox" {% if user_data.streaming_provider.service=='torbox' %}selected{% endif %}>Torbox (Free Quota)</option>
<option value="realdebrid" {% if user_data.streaming_provider.service=='realdebrid' %}selected{% endif %}>Real-Debrid (Premium)</option>
<option value="debridlink" {% if user_data.streaming_provider.service=='debridlink' %}selected{% endif %}>Debrid-Link (Premium)</option>
<option value="premiumize" {% if user_data.streaming_provider.service=='premiumize' %}selected{% endif %}>Premiumize (Premium)</option>
<option value="alldebrid" {% if user_data.streaming_provider.service=='alldebrid' %}selected{% endif %}>AllDebrid - Local Only - (Premium)</option>
<option value="qbittorrent" {% if user_data.streaming_provider.service=='qbittorrent' %}selected{% endif %}>qBittorrent - WebDav (Free/Premium)</option>
</select>
<!-- Affiliate Signup Links -->
<div id="signup_section" style="display:none" class="mb-4">
<h6>Don't have an account?</h6>
<a id="signup_link" href="#" class="btn btn-primary" target="_blank">Create Account</a>
</div>
<!-- Credentials Input -->
<div id="credentials" style="display:none">
<h6>Enter Credentials</h6>
<div class="mb-3">
<label for="username">Username:</label>
<input class="form-control" type="text" id="username" name="username" placeholder="Enter Username" aria-label="Username"
value="{{ user_data.streaming_provider.username if user_data.streaming_provider.username else '' }}">
<div class="invalid-feedback">
Username is required.
</div>
</div>
<div class="mb-3">
<label for="password">Password:</label>
<div class="input-group">
<input class="form-control" type="password" id="password" name="password" placeholder="Enter Password">
<button class="btn btn-outline-secondary" type="button" id="togglePassword">
<span id="togglePasswordIcon" class="bi bi-eye"></span>
</button>
<div class="invalid-feedback">
Password is required.
</div>
</div>
</div>
</div>
<!-- OAuth Section -->
<div id="oauth_section" class="mb-3" style="display:none">
<h6>Authorize Addon (Recommended) <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Authorize the addon to access your streaming provider account. This is recommended instead using your private token."></span>
</h6>
<button type="button" id="oauth_btn" class="btn">Authorize</button>
<div id="device_code_section" class="mt-2" style="display:none;">
To complete the authorization, follow these steps:
<ol>
<li>Visit the authorization link: <a id="verification_link" href="#" target="_blank">#</a></li>
<li>Enter the device code provided below into the authorization page.</li>
</ol>
Your device code: <strong><span id="device_code_display"></span></strong>
</div>
</div>
<!-- Token for Providers -->
<div id="token_input" class="mb-3" style="display:none">
<label for="provider_token" class="mb-3">Token: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter Encoded Token previously generated or Click 'Authorize' to generate a new token or Provide your Private Token."></span></label>
<input class="form-control" type="text" name="provider_token" id="provider_token" placeholder="Enter Token"
value="{{ user_data.streaming_provider.token if user_data.streaming_provider.token else '' }}">
<div class="invalid-feedback">
Token is required.
</div>
</div>
<!-- qBittorrent Configuration -->
<div id="qbittorrent_config" class="mt-3" style="display:none">
<h5 class="mt-3">qBittorrent Configuration</h5>
<div class="mb-3">
<label for="qbittorrent_url">qBittorrent URL:</label>
<input class="form-control" type="text" id="qbittorrent_url" name="qbittorrent_url" placeholder="Enter qBittorrent URL"
value="{{ user_data.streaming_provider.qbittorrent_config.qbittorrent_url if user_data.streaming_provider and user_data.streaming_provider.qbittorrent_config else '' }}">
</div>
<div class="mb-3">
<label for="qbittorrent_username">qBittorrent Username: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the qBittorrent username for the qBittorrent server. if Authentication not required, leave it blank."></span></label>
<input class="form-control" type="text" id="qbittorrent_username" name="qbittorrent_username" placeholder="Enter Username"
value="{{ user_data.streaming_provider.qbittorrent_config.qbittorrent_username if user_data.streaming_provider.qbittorrent_config else '' }}">
</div>
<div class="mb-3">
<label for="qbittorrent_password">qBittorrent Password: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the qBittorrent password for the qBittorrent server. if Authentication not required, leave it blank."></span></label>
<div class="input-group">
<input class="form-control" type="password" id="qbittorrent_password" name="qbittorrent_password" placeholder="Enter qBittorrent Password">
<button class="btn btn-outline-secondary" type="button" id="toggleQbittorrentPassword">
<span id="toggleQbittorrentPasswordIcon" class="bi bi-eye"></span>
</button>
</div>
</div>
<div class="mb-3">
<label for="seeding_time_limit">Seeding Time Limit (minutes): <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Set the seeding time limit for torrents in minutes."></span></label>
<input class="form-control" type="number" id="seeding_time_limit" name="seeding_time_limit" placeholder="Enter Seeding Time Limit"
value="{{ user_data.streaming_provider.qbittorrent_config.seeding_time_limit if user_data.streaming_provider.qbittorrent_config else 1440 }}">
</div>
<div class="mb-3">
<label for="seeding_ratio_limit">Seeding Ratio Limit: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Set the seeding ratio limit for torrents."></span></label>
<input class="form-control" type="text" id="seeding_ratio_limit" name="seeding_ratio_limit" placeholder="Enter Seeding Ratio Limit"
value="{{ user_data.streaming_provider.qbittorrent_config.seeding_ratio_limit if user_data.streaming_provider.qbittorrent_config else 1.0 }}">
</div>
<div class="mb-3">
<label for="play_video_after_download">Play Video After Download: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the percentage of the video to be downloaded before playing."></span></label>
<input class="form-control" type="number" id="play_video_after_download" name="play_video_after_download" placeholder="Enter Play Video After Download"
value="{{ user_data.streaming_provider.qbittorrent_config.play_video_after if user_data.streaming_provider.qbittorrent_config else 100 }}">
</div>
<!-- WebDAV Configuration -->
<h5 class="mt-3">WebDAV Configuration</h5>
<div class="mb-3">
<label for="webdav_url">WebDAV URL: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the WebDAV URL for the qBittorrent WebDAV server with the format: http{s}://host/path."></span></label>
<input class="form-control" type="text" id="webdav_url" name="webdav_url" placeholder="Enter WebDAV URL"
value="{{ user_data.streaming_provider.qbittorrent_config.webdav_url if user_data.streaming_provider.qbittorrent_config else '' }}">
</div>
<div class="mb-3">
<label for="webdav_username">WebDAV Username: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the WebDAV username for the WebDAV server. if Authentication not required, leave it blank."></span></label>
<input class="form-control" type="text" id="webdav_username" name="webdav_username" placeholder="Enter WebDAV Username"
value="{{ user_data.streaming_provider.qbittorrent_config.webdav_username if user_data.streaming_provider.qbittorrent_config else '' }}">
</div>
<div class="mb-3">
<label for="webdav_password">WebDAV Password: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the WebDAV password for the WebDAV server. if Authentication not required, leave it blank."></span></label>
<div class="input-group">
<input class="form-control" type="password" id="webdav_password" name="webdav_password" placeholder="Enter WebDAV Password">
<button class="btn btn-outline-secondary" type="button" id="toggleWebdavPassword">
<span id="toggleWebdavPasswordIcon" class="bi bi-eye"></span>
</button>
</div>
</div>
<div class="mb-3">
<label for="webdav_downloads_path">WebDAV Downloads Path: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the path from the root of the WebDAV server to the folder where qBittorrent saves downloads. This path is used to locate and stream downloads. If your qBittorrent downloads are saved directly in the root directory of the WebDAV server, leave this as '/'."></span></label>
<input class="form-control" type="text" id="webdav_downloads_path" name="webdav_downloads_path" placeholder="Enter WebDAV Downloads Path"
value="{{ user_data.streaming_provider.qbittorrent_config.webdav_downloads_path if user_data.streaming_provider.qbittorrent_config else '/' }}">
</div>
</div>
</div>
<!-- Catalog Configuration -->
<div class="section-container">
<h4 class="section-header">Catalog Configuration</h4>
<hr class="section-divider">
<div class="mb-3">
<h6>Select & Arrange Catalogs: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Select and arrange the catalogs that you want to display in Stremio."></span></h6>
<div id="catalogs" class="row">
{% for catalog in catalogs %}
<div class="col-12 col-md-6 col-lg-4 draggable-catalog" data-id="{{ catalog[0] }}">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="selected_catalogs" value="{{ catalog[0] }}" id="{{ catalog[0] }}" {% if catalog[0] in
user_data.selected_catalogs
%}checked{% endif %}>
<label class="form-check-label" for="{{ catalog[0] }}">
<span class="label-text">{{ catalog[1] }}</span>
</label>
</div>
</div>
{% endfor %}
</div>
</div>
<!-- Enable Provider Watchlist -->
<div id="watchlist_section" style="display:none" class="mb-3">
<h6>Provider Watchlist Catalog:</h6>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="enable_watchlist"
id="enable_watchlist" {% if user_data.streaming_provider and user_data.streaming_provider.enable_watchlist_catalogs %}checked{% endif %}>
<label class="form-check-label" for="enable_watchlist" id="watchlist_label">
Enable Watchlist
</label>
</div>
</div>
<!-- Enable Catalogs Checkbox -->
<div class="mb-3">
<h6>Enable Catalogs:</h6>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="enable_catalogs"
id="enable_catalogs" {% if user_data.enable_catalogs %}checked{% endif %}>
<label class="form-check-label" for="enable_catalogs">
Show Catalogs in Stremio <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Toggle to add or hide catalogs in Stremio. This is perfect for when you want to install multiple addons without creating duplicate catalog content and only want to display streams."></span>
</label>
</div>
</div>
</div>
<!-- Streaming Filter Configuration -->
<div class="section-container">
<h4 class="section-header">Streaming Preferences <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Customize how streams are sorted, limit results, and choose torrent display options to tailor your streaming experience in Stremio."></span>
</h4>
<hr class="section-divider">
<!-- Select Streaming Resolutions -->
<div class="mb-3">
<h6>Select Streaming Resolutions: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Select the streaming resolutions that you prefer. The addon will filter these when fetching streams."></span></h6>
<div class="row">
{% for resolution in resolutions %}
<div class="col-12 col-md-6 col-lg-4">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="selected_resolutions"
value="{{ resolution if resolution else '' }}"
id="resolution_{{ resolution if resolution else 'unknown' }}"
{% if resolution in user_data.selected_resolutions %}checked{% endif %}>
<label class="form-check-label" for="resolution_{{ resolution if resolution else 'unknown' }}">
{{ resolution if resolution else 'Unknown' }}
</label>
</div>
</div>
{% endfor %}
</div>
</div>
<!-- File Size Range Filter -->
<div class="mb-3">
<h6>Set File Size Filter: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Select the file size range for the streams. Slide to the end for no limit."></span></h6>
<!-- Slider for the file size -->
<input type="range" class="form-range" id="max_size_slider" name="size_slider" min="0" max="21000000000"
value="{{ user_data.max_size if user_data.max_size < 21000000000 else 21000000000 }}" step="1000000">
<label for="max_size_slider">Max File Size:</label>
<span id="max_size_output">Unlimited</span>
</div>
<!-- Stream Sorting Priority -->
<div class="mb-3">
<h6>Select & Arrange Sorting Priority: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Select and arrange the sorting options that you want to display in Stremio."></span></h6>
<div id="streamSortOrder" class="row">
{% for sorting_option in sorting_options %}
<div class="col-12 col-md-6 col-lg-4 sortable-list" data-id="{{ sorting_option }}">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="selected_sorting_options"
value="{{ sorting_option }}"
id="sorting_{{ sorting_option }}"
{% if sorting_option in user_data.torrent_sorting_priority %}checked{% endif %}>
<label class="form-check-label" for="sorting_{{ sorting_option }}">
{{ sorting_option.replace('_', ' ').title() }}
</label>
</div>
</div>
{% endfor %}
</div>
</div>
<!-- Maximum Streams Result per Resolution Configuration -->
<div class="mb-3">
<label for="maxStreamsPerResolution">Max Streams Per Resolution: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the maximum number of streams per resolution to display in Stremio."></span></label>
<input type="number" class="form-control" id="maxStreamsPerResolution" name="maxStreamsPerResolution" min="1" placeholder="Enter maximum streams per resolution"
value="{{ user_data.max_streams_per_resolution }}">
<div class="invalid-feedback">
Please enter a valid number.
</div>
</div>
<!-- Torrent Information Display Configuration -->
<div class="mb-3">
<h6>Torrent Stream Display option: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Choose how you want to display the torrent information in Stremio."></span></h6>
<div class="form-check">
<input class="form-check-input" type="radio" name="torrentDisplayOption" id="showParsedTorrentData" value="parsedData" {% if not user_data.show_full_torrent_name
%}checked{% endif %}>
<label class="form-check-label" for="showParsedTorrentData">
Show Parsed Data (Quality, Resolution, Codec, Audio.)
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="torrentDisplayOption" id="showTorrentName" value="fullName" {% if user_data.show_full_torrent_name %}checked{% endif %}>
<label class="form-check-label" for="showTorrentName">
Show Torrent Full Name
</label>
</div>
</div>
</div>
{% if authentication_required %}
<!-- API Password Configuration -->
<div class="section-container">
<h4 class="section-header">API Security Configuration</h4>
<hr class="section-divider">
<!-- API Password Input -->
<div class="mb-3">
<label for="api_password">API Password: <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="Enter the API password you configured in the environment variables."></span></label>
<div class="input-group">
<input class="form-control" type="password" id="api_password" name="api_password" placeholder="Enter API Password">
<button class="btn btn-outline-secondary" type="button" id="toggleApiPassword">
<span id="toggleApiPasswordIcon" class="bi bi-eye"></span>
</button>
<div class="invalid-feedback">
API Password is required.
</div>
</div>
</div>
</div>
{% endif %}
<!-- Fallback URL Display - Initially hidden -->
<div id="fallbackUrlContainer" class="fallback-url-container" style="display: none;">
<label for="fallbackUrl">Installation URL <span class="bi bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top"
title="This is the URL that you can use to install the addon in Stremio."></span></label>
<textarea id="fallbackUrl" class="form-control" readonly></textarea>
<p>Please manually copy the URL above and paste it in the Stremio search bar. Do not share this URL with unknown persons.</p>
</div>
<!-- Submit and Share Buttons -->
<div class="button-container">
<button type="submit" class="btn btn-primary btn-block custom-btn">Install Addon</button>
<!-- Conditional display of buttons based on Web Share API support -->
<button type="button" id="shareBtn" style="display: none;" class="btn btn-primary btn-block custom-btn">Share Installation URL</button>
<button type="button" id="copyBtn" style="display: none;" class="btn btn-primary btn-block custom-btn">Copy Installation URL</button>
</div>
</form>
</div>
</div>
</div>
<!-- JS for Bootstrap and form validation -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
<script src="/static/js/config_script.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink