mam/mamweb
13
1
Fork 0
Code Issues Pull requests 12 Projects Wiki Activity Actions

Galerie: stylování podle schůzky

Browse source
This commit is contained in:
Matěj Kocián 2015-11-11 21:21:30 +01:00
parent 1a768bef08
commit 84d7382ffb
4 changed files with 104 additions and 84 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
galerie/templates/galerie/Galerie.html
View file

@ -5,10 +5,13 @@
{{galerie.nazev}}: {{ obrazek.popis | default:"Fotka" }} {{galerie.nazev}}: {{ obrazek.popis | default:"Fotka" }}
{% endblock %} {% endblock %}
{# přecházení mezi fotkami pomocí šipek #}
{% block script %} {% block script %}
{% with obrazky_predchozi|last as predchozi_obrazek %} {% with obrazky_predchozi|last as predchozi_obrazek %}
{% with obrazky_dalsi|first as dalsi_obrazek %} {% with obrazky_dalsi|first as dalsi_obrazek %}
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() {
$(document).keydown(function(e) { $(document).keydown(function(e) {
{% if predchozi_obrazek %} {% if predchozi_obrazek %}
// doleva // doleva
@ -23,8 +26,14 @@
} }
{% endif %} {% endif %}
if (e.which == 27) { if (e.which == 27) {
window.location.assign("../#obsah") window.location.assign("../#obsah");
} }
});
$("#prostredni").click(function() {
$("#prostredni").parent().append("<p style='text-align: center;'>Prohrál jsi</p>");
$("#prostredni").off("click");
});
}) })
</script> </script>
{% endwith %} {% endwith %}
@ -36,16 +45,11 @@
<h2> <h2>
{% for g in cesta %} {% for g in cesta %}
<a href="../../{{ g.pk }}">{{ g.nazev }}</a> > <a href="../../{{ g.pk }}">{{ g.nazev }}</a>{% if not forloop.last %} >{% endif %}
{% endfor %} {% endfor %}
{{ obrazek.nazev }}
</h2> </h2>
<!--<div id="nahoru">-->
<!--<a title="Zpět do galerie" href="../#obsah">Zpět na: {{galerie.nazev}}</a>-->
<!--</div>-->
{# TODO šipky na přecházeni dodelat ve stylech #}
<div class="galerie"> <div class="galerie">
{% if obrazky_predchozi %} {% if obrazky_predchozi %}
{% with obrazky_predchozi|last as predchozi_obrazek %} {% with obrazky_predchozi|last as predchozi_obrazek %}
@ -92,8 +96,9 @@
<div class="galerie_nahledy"> <div class="galerie_nahledy">
{# odkaz na predchozi galerii #} {# odkaz na predchozi galerii #}
<div class="navigace">
{% if predchozi_galerie %} {% if predchozi_galerie %}
Predchozi: <a href="../../{{predchozi_galerie.pk}}/{{predchozi_galerie.obrazek_set.last.pk}}/#nahoru"> Předchozí: <a href="../../{{predchozi_galerie.pk}}/{{predchozi_galerie.obrazek_set.last.pk}}/#nahoru">
{{predchozi_galerie}} {{predchozi_galerie}}
</a> </a>
{% endif %} {% endif %}
@ -101,21 +106,26 @@
{% for obrazek in obrazky_predchozi %} {% for obrazek in obrazky_predchozi %}
<a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a> <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
{% endfor %} {% endfor %}
{# nahled aktualniho obrazku -- TODO po kliknuti vypsat: Prohrál jsi #} </div>
<img src={{obrazek.obrazek_maly.url}} <img src={{obrazek.obrazek_maly.url}}
height="{{obrazek.obrazek_maly.height}}" height="{{obrazek.obrazek_maly.height}}"
width="{{obrazek.obrazek_maly.width}}" width="{{obrazek.obrazek_maly.width}}"
alt="{{obrazek.popis}}" alt="{{obrazek.popis}}"
class="obrazek"> class="obrazek"
id="prostredni">
<div class="navigace">
{# nahledy nasledujicich obrazku #} {# nahledy nasledujicich obrazku #}
{% for obrazek in obrazky_dalsi %} {% for obrazek in obrazky_dalsi %}
<a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a> <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
{% endfor %} {% endfor %}
{# odkaz na nasledujici galerii #} {# odkaz na nasledujici galerii #}
{% if nasledujici_galerie %} {% if nasledujici_galerie %}
Nasledujici: <a href="../../{{nasledujici_galerie.pk}}/{{nasledujici_galerie.obrazek_set.first.pk}}/#nahoru"> Následující: <a href="../../{{nasledujici_galerie.pk}}/{{nasledujici_galerie.obrazek_set.first.pk}}/#nahoru">
{{nasledujici_galerie}} {{nasledujici_galerie}}
</a> </a>
{% endif %} {% endif %}
</div> </div>
</div>
{% endblock %} {% endblock %}

35
galerie/templates/galerie/GalerieNahled.html
View file

@ -21,11 +21,6 @@ Galerie {{galerie.nazev}}
{% if galerie.titulni_obrazek %} {% if galerie.titulni_obrazek %}
<img src="{{ galerie.titulni_obrazek.obrazek_stredni.url }}" style="border: 1px solid black;"> <img src="{{ galerie.titulni_obrazek.obrazek_stredni.url }}" style="border: 1px solid black;">
{% endif %} {% endif %}
{% if galerie.popis %}
<div class="popis">
{{ galerie.popis }}
</div>
{% endif %}
</div> </div>
{% endif %} {% endif %}
@ -46,25 +41,29 @@ Galerie {{galerie.nazev}}
{% if podgalerie %} {% if podgalerie %}
<div class="galerie_nahledy"> <div class="galerie_nahledy">
{% for galerie in podgalerie %} {% for galerie in podgalerie %}
<div class="podgalerie_nahled"> <a href="../{{galerie.pk}}" class="podgalerie_nahled">
<!--<div class="podgalerie_nahled">-->
{% if galerie.zobrazit < 1 or user.is_staff %} {% if galerie.zobrazit < 1 or user.is_staff %}
{% if galerie.titulni_obrazek %} {% if galerie.titulni_obrazek %}
{% with galerie.titulni_obrazek.obrazek_maly as obrazek %} {% with galerie.titulni_obrazek.obrazek_maly as obrazek %}
<a href="../{{galerie.pk}}"><img src="{{ obrazek.url }}" <img src="{{ obrazek.url }}"
width={% widthratio obrazek.width 200 167 %} width={% widthratio obrazek.width 200 167 %}
height={% widthratio obrazek.height 200 167 %} /></a> height={% widthratio obrazek.height 200 167 %} />
{% endwith %} {% endwith %}
{% endif %} {% endif %}
<div> <div>
<a href="../{{ galerie.pk }}">{{ galerie }}</a> {{ galerie }}
</div> </div>
{# {% if user.is_staff and galerie.zobrazit > 0 %} #} <!--</div>-->
{# ({{galerie.poradi}}) #} </a>
{# <span class="plus"><a href="plus/{{galerie.pk}}/">+</a></span> #} {% comment %}
{# <span class="minus"><a href="minus/{{galerie.pk}}/">-</a></span> #} {% if user.is_staff and galerie.zobrazit > 0 %}
{# {% endif %} #} ({{galerie.poradi}})
<span class="plus"><a href="plus/{{galerie.pk}}/">+</a></span>
<span class="minus"><a href="minus/{{galerie.pk}}/">-</a></span>
{% endif %}
{% endcomment %}
{% endif %} {% endif %}
</div>
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}
@ -79,15 +78,11 @@ Galerie {{galerie.nazev}}
{% if obrazky %} {% if obrazky %}
<div class="galerie_nahledy"> <div class="galerie_nahledy">
{% for obrazek in obrazky %} {% for obrazek in obrazky %}
<div class="galerie_nahled"> <a title="Zobrazit tuto fotografii" href="./{{obrazek.pk}}#nahoru" class="galerie_nahled"><span class="vystredeno"></span><img
<span class="vystredeno"></span>
<a title="Zobrazit tuto fotografii" href="./{{obrazek.pk}}#nahoru">
<img
src="{{obrazek.obrazek_maly.url}}" src="{{obrazek.obrazek_maly.url}}"
width={% widthratio obrazek.obrazek_maly.width 200 167 %} width={% widthratio obrazek.obrazek_maly.width 200 167 %}
height={% widthratio obrazek.obrazek_maly.height 200 167 %} /> height={% widthratio obrazek.obrazek_maly.height 200 167 %} />
</a> </a>
</div>
{% endfor %} {% endfor %}
<br> <br>
</div> </div>

41
mamweb/static/css/mamweb.css
View file

@ -489,7 +489,6 @@ div.zadani_azad_termin {
.popis { .popis {
margin: 10px 10px 30px 0px; margin: 10px 10px 30px 0px;
clear: all;
text-align: center; text-align: center;
} }
@ -504,17 +503,22 @@ div.zadani_azad_termin {
overflow: auto; overflow: auto;
} }
.galerie_nahledy img{ .galerie_nahledy div.navigace {
margin: 0 10px 0 10px;
}
.galerie_nahledy a{
height: 100%;
width: 100%;
}
.galerie_nahled{ /* frame */
display: inline-block; display: inline-block;
width: 150px;
}
/*.galerie_nahledy img{*/
/*margin: 0 10px 0 10px;*/
/*}*/
/*.galerie_nahledy a{*/
/*height: 100%;*/
/*width: 100%;*/
/*}*/
.galerie_nahled { /* frame */
display: block;
position: relative; position: relative;
float: left; float: left;
width: 200px; width: 200px;
@ -531,6 +535,11 @@ div.zadani_azad_termin {
margin: 10px 20px 10px 0px; margin: 10px 20px 10px 0px;
} }
.galerie_nahled:hover {
background-color: #ffd546;
border-color: #ffa500;
}
.vystredeno{ /* helper */ .vystredeno{ /* helper */
display: inline-block; display: inline-block;
height: 100%; height: 100%;
@ -545,8 +554,8 @@ div.zadani_azad_termin {
} }
.galerie_nahled img:hover { .galerie_nahled img, .podgalerie_nahled img {
/*border: 1px solid #ffa500;*/ border-radius: 2px;
} }
.galerie_nahled div { .galerie_nahled div {
@ -558,6 +567,7 @@ div.zadani_azad_termin {
.podgalerie_nahled { .podgalerie_nahled {
display: block;
position: relative; position: relative;
float: left; float: left;
width: 200px; width: 200px;
@ -572,6 +582,11 @@ div.zadani_azad_termin {
/*background-color: white;*/ /*background-color: white;*/
white-space: nowrap; white-space: nowrap;
margin: 10px 20px 10px 0px; margin: 10px 20px 10px 0px;
font-weight: bold;
}
.podgalerie_nahled:hover {
background-color: #ffa500;
} }
.podgalerie_nahled img { .podgalerie_nahled img {

10
seminar/templates/seminar/soustredeni/seznam_soustredeni.html
View file

@ -43,19 +43,19 @@
{% for galerie in soustredeni.galerie_set.all %} {% for galerie in soustredeni.galerie_set.all %}
{% if galerie.zobrazit == 0 or user.is_staff %} {% if galerie.zobrazit == 0 or user.is_staff %}
<li> <li>
<a href="../{{soustredeni.pk}}/fotogalerie/{{galerie.pk}}">FOTOGALERIE: {{galerie}}</a> <a href="../{{soustredeni.pk}}/fotogalerie/{{galerie.pk}}">Fotogalerie</a>
{# TODO kdyz je titulni obrazek, tak asi i titulni obrazek #} {# TODO kdyz je titulni obrazek, tak asi i titulni obrazek #}
</li> </li>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% endif %} {% endif %}
</ul>
{% if user.is_staff %} {% if user.is_staff %}
<li> <div class="mam-org-only">
<a href="../{{soustredeni.pk}}/fotogalerie/0/new/"> VYTVOŘIT NOVOU FOTOGALERII </a> <a href="../{{soustredeni.pk}}/fotogalerie/0/new/">Vytvořit novou fotogalerii</a>
</li> </div>
{% endif %} {% endif %}
</ul>
{# popis soustredeni #} {# popis soustredeni #}
{% if soustredeni.text %} {% if soustredeni.text %}