129 lines
8.4 KiB
HTML

{% extends 'layouts/base.html' %}
{% load static %}
{% block title %}{% endblock title %}
{% block stylesheets %}
<link type="text/css" rel="stylesheet" href="{% static '/css/home/index.css' %}">
<link type="text/css" rel="stylesheet" href="{% static '/css/select2.css' %}">
{% endblock stylesheets %}
{% block content %}
<div class="container-lg px-0 h-100">
<div class="d-flex flex-nowrap h-100 border-start border-end">
<div class="d-flex flex-column bg-body-tertiary py-3 border-end" style="width: 4.5rem">
<ul id="serverList" class="nav nav-pills nav-flush flex-column mb-auto text-center">
<li class="nav-item">
<button type="button" id="newServerBtn" class="btn btn-outline-primary rounded-1 mt-1" style="width: 46px; height: 46px;">
<i class="bi bi-plus-lg fs-5"></i>
</button>
</li>
</ul>
</div>
<div class="flex-grow-1 container-fluid bg-body overflow-y-auto" style="min-width: 0;">
<div id="noSelectedServer" class="h-100">
<div class="d-flex justify-content-center align-items-center flex-column h-100">
<img src="{% static '/images/pyrss_logo.webp' %}" alt="PYRSS Logo">
<h1 class="fw-bold mb-4 font-atkinson-hyperlegible">PYRSS</h1>
<div class="d-flex align-items-center flex-nowrap flex-column">
<p class="col-lg-8 text-center">Select or <a onclick="newServerModal();" class="text-link text-decoration-none" role="button">add a server</a> from the left hand menu to get started. For more help check the <a href="https://gitea.corbz.dev/corbz/PYRSS-Website/src/branch/master/README.md" class="text-decoration-none" target="_blank">README</a>.</p>
<div class="col-lg-8 text-center">
<h5>Resources</h5>
<div class="hstack gap-3 justify-content-center">
<a href="https://gitea.corbz.dev/corbz/PYRSS-Website" class="text-body text-decoration-none" target="_blank"><i class="bi bi-git fs-3"></i></a>
<a href="https://en.wikipedia.org/wiki/RSS" class="text-body text-decoration-none" target="_blank"><i class="bi bi-rss-fill fs-3"></i></a>
<a href="https://discord.com/developers/docs/intro" class="text-body text-decoration-none" target="_blank"><i class="bi bi-discord fs-3"></i></a>
<a href="https://gitea.corbz.dev/corbz/PYRSS-Website/src/branch/master/README.md" class="text-body text-decoration-none" target="_blank"><i class="bi bi-question-circle-fill fs-3"></i></a>
</div>
</div>
</div>
</div>
</div>
<div id="selectedServerContainer" class="row" style="display: none;">
<div class="col-12 bg-body-tertiary border-bottom">
<div class="px-3 py-4 d-flex justify-content-start align-items-center">
<img alt="Selected Server Icon" class="rounded-3 selected-server-icon">
<div class="ms-3" style="min-width: 0">
<h3 class="mb-0 resolve-to-server-name text-truncate"></h3>
<h5 class="mb-0 resolve-to-server-id text-truncate text-body-secondary"></h5>
</div>
<div class="ms-auto">
<button type="button" id="serverSettingsBtn" class="btn btn-outline-secondary rounded-1 ms-3" data-bs-toggle="tooltip" data-bs-title="Server settings">
<i class="bi bi-gear"></i>
</button>
<button type="button" id="deleteSelectedServerBtn" class="btn btn-outline-danger rounded-1 ms-3" data-bs-toggle="tooltip" data-bs-title="Close server">
<i class="bi bi-x-lg"></i>
</button>
<button type="button" id="backToSelectServer" class="btn btn-outline-secondary rounded-1 ms-3" data-bs-toggle="tooltip" data-bs-title="Go back">
<i class="bi bi-box-arrow-right"></i>
</button>
</div>
</div>
</div>
<div id="serverJoinAlert" class="col-12 m-0">
<div class="px-3 mt-4 mx-2 alert alert-warning fade show rounded-1 d-flex align-items-center">
<div class="me-4">
<strong>Warning:</strong>
The Bot isn't a member of
<span class="resolve-to-server-name"></span>,
features here will not function properly, please add the bot before proceeding.
</div>
<a class="ms-auto btn btn-warning rounded-1 text-nowrap resolve-to-invite-link" target="_blank">Add PYRSS</a>
</div>
</div>
<div class="col-12">
<ul id="serverTabs" class="nav py-3" role="tablist">
<li class="nav-item" role="presentation">
<button id="subscriptionsTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#subscriptionsTabPane" type="button" aria-controls="subscriptionsTabPane" aria-selected="false">Subscriptions</button>
</li>
<li class="nav-item" role="presentation">
<button id="filtersTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#filtersTabPane" type="button" aria-controls="filtersTabPane" aria-selected="false">Content Filters</button>
</li>
<li class="nav-item" role="presentation">
<button id="contentTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false">Tracked Content</button>
</li>
<!-- <li class="nav-item ms-auto" role="presentation">
<button id="settingsTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#settingsTabPane" type="button" aria-controls="settingsTabPane" aria-selected="false">Settings</button>
</li> -->
</ul>
</div>
<div class="col-12">
<div id="serverTabContent" class="tab-content">
<div id="subscriptionsTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="subscriptionsTab" tabindex="0"></div>
<div id="filtersTabPane" class="tab-pane fade includes-table includes-table-controls includes-table-search" role="tabpanel" aria-labelledby="filtersTab" tabindex="0"> </div>
<div id="contentTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="contentTab" tabindex="0"></div>
<!-- <div id="settingsTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="settingsTab" tabindex="0">{% include "home/includes/settingstab.html" %}</div> -->
</div>
</div>
</div>
</div>
</div>
</div>
{% include "home/includes/servermodal.html" %}
{% include "home/includes/submodal.html" %}
{% include "home/includes/filtermodal.html" %}
{% include "home/includes/deletemodal.html" %}
{% include "home/includes/settingsmodal.html" %}
{% endblock content %}
{% block javascript %}
<script id="serverItemTemplate" type="text/template">
<li class="nav-item server-item" data-id="" data-bs-toggle="tooltip" data-bs-placement="right">
<button type="button" class="btn border-0 server-item-selector mb-2">
<img src="" alt="Guild Icon" class="rounded-circle" width="46" height="46">
</button>
</li>
</script>
<script src="{% static 'js/api.js' %}"></script>
<script src="{% static 'js/table.js' %}"></script>
<script src="{% static 'js/home/index.js' %}"></script>
<script src="{% static 'js/home/servers.js' %}"></script>
<script src="{% static 'js/home/subscriptions.js' %}"></script>
<script src="{% static 'js/home/filters.js' %}"></script>
<script src="{% static 'js/home/content.js' %}"></script>
<script src="{% static 'js/home/settings.js' %}"></script>
{% endblock javascript %}