92 lines
3.2 KiB

{% extends "base.html" %}
{% set active_page = "quest_detail" %}
{% block title %}ACKS Quest Detail{% endblock %}
{% block content %}
<div class="uk-flex uk-flex-center uk-margin-bottom uk-margin-top">
<h1 class="uk-text-center"><strong>Adventurer Conqueror King</strong>Quest Detail</h1>
</div>
{% if quest %}
<div class="uk-container uk-container-small">
<div class="uk-text-center uk-margin-large">
<h1 class="uk-heading-xlarge">{{ quest['name'] }}</h1>
</div>
<div class="uk-flex uk-flex-center uk-margin-large-bottom">
<a href="{{ quest['info']['url'] }}" class="uk-button uk-button-default" target="_blank">Info Window</a>
{% if quest['tsv'] %}
<a href="{{ quest['tsv']['url'] }}" class="uk-button uk-button-default">TSV File</a>
{% endif %}
<a href="{{ url_for('quest_manager.quest_download', level=quest['download'][0], quest_name=quest['download'][1]) }}" class="uk-button uk-button-default" target="_blank">Download</a>
</div>
{% if quest['coords'] %}
<div class="uk-text-center uk-margin-small">
<div><strong>Coordinates:</strong></div>
<div>{{ quest['coords'] }}</div>
</div>
{% endif %}
<ul uk-accordion="multiple: true">
<li class="uk-open">
<a class="uk-accordion-title" href="#">Assets</a>
<div class="uk-accordion-content">
<h3 class="uk-text-center">Quest Assets</h3>
<div uk-slideshow="animation: push">
<ul class="uk-slideshow-nav uk-dotnav uk-flex-center uk-margin"></ul>
<div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1">
<ul class="uk-slideshow-items" uk-lightbox>
{% for a in quest['assets'] %}
<li>
<a href="{{ a['url'] }}"><img src="{{ a['url'] }}" alt="" width="800" uk-cover></a>
<div class="uk-overlay uk-overlay-primary uk-position-bottom uk-text-center uk-transition-slide-bottom">
<h3 class="uk-margin-remove">{{ a['display'] }}</h3>
</div>
</li>
{% endfor %}
</ul>
</div>
<ul class="uk-slideshow-nav uk-dotnav uk-flex-center uk-margin"></ul>
</div>
</div>
</li>
<li class="uk-open">
<a class="uk-accordion-title" href="#">Information</a>
<div class="uk-accordion-content">
<h3 class="uk-text-center">Quest Info</h3>
<div id="frame-container">
<iframe id="quest-frame" src="{{ quest['info']['url'] }}"></iframe>
</div>
</div>
</li>
</ul>
</div>
{% endif %}
{% endblock %}
{% block head %}
<style>
#asset-view img {
max-width: 300px;
max-height: 500px;
}
#frame-container {
display: flex;
width: 100%;
height: 85vh;
flex-direction: column:
}
#quest-frame {
flex-grow: 1;
border: none;
margin: 0;
padding: 0;
}
h1 strong {
display: block;
font-size: 50%;
opacity: 0.65;
}
</style>
<script>
</script>
{% endblock %}