From 84d7382ffb8cb90baa147b2d0fb5667da63bb5ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mat=C4=9Bj=20Koci=C3=A1n?= <matej.kocian@gmail.com>
Date: Wed, 11 Nov 2015 21:21:30 +0100
Subject: [PATCH] =?UTF-8?q?Galerie:=20stylov=C3=A1n=C3=AD=20podle=20sch?=
 =?UTF-8?q?=C5=AFzky?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 galerie/templates/galerie/Galerie.html        | 104 ++++++++++--------
 galerie/templates/galerie/GalerieNahled.html  |  37 +++----
 mamweb/static/css/mamweb.css                  |  37 +++++--
 .../soustredeni/seznam_soustredeni.html       |  10 +-
 4 files changed, 104 insertions(+), 84 deletions(-)

diff --git a/galerie/templates/galerie/Galerie.html b/galerie/templates/galerie/Galerie.html
index 7ece4ae4..35779fc3 100644
--- a/galerie/templates/galerie/Galerie.html
+++ b/galerie/templates/galerie/Galerie.html
@@ -5,27 +5,36 @@
 {{galerie.nazev}}: {{ obrazek.popis | default:"Fotka" }}
 {% endblock %}
 
+
+{# přecházení mezi fotkami pomocí šipek #}
 {% block script %}
   {% with obrazky_predchozi|last as predchozi_obrazek %}
   {% with obrazky_dalsi|first as dalsi_obrazek %}
       <script type="text/javascript">
-          $(document).keydown(function(e) {
-              {% if predchozi_obrazek %}
-                  // doleva
-                  if (e.which == 37) {
-                      window.location.assign("../{{ predchozi_obrazek.pk }}#nahoru");
-                  }
-              {% endif %}
-              {% if dalsi_obrazek %}
-                  // doprava
-                  if (e.which == 39) {
-                      window.location.assign("../{{ dalsi_obrazek.pk }}#nahoru");
-                  }
-              {% endif %}
-              if (e.which == 27) {
-                  window.location.assign("../#obsah")
-              }
-          })
+          $(document).ready(function() {
+            $(document).keydown(function(e) {
+                {% if predchozi_obrazek %}
+                    // doleva
+                    if (e.which == 37) {
+                        window.location.assign("../{{ predchozi_obrazek.pk }}#nahoru");
+                    }
+                {% endif %}
+                {% if dalsi_obrazek %}
+                    // doprava
+                    if (e.which == 39) {
+                        window.location.assign("../{{ dalsi_obrazek.pk }}#nahoru");
+                    }
+                {% endif %}
+                if (e.which == 27) {
+                    window.location.assign("../#obsah");
+                }
+            });
+
+            $("#prostredni").click(function() {
+                $("#prostredni").parent().append("<p style='text-align: center;'>Prohrál jsi</p>");
+                $("#prostredni").off("click");
+            });
+        })
       </script>
   {% endwith %}
   {% endwith %}
@@ -36,16 +45,11 @@
 
   <h2>
     {% for g in cesta %}
-        <a href="../../{{ g.pk }}">{{ g.nazev }}</a> >
+        <a href="../../{{ g.pk }}">{{ g.nazev }}</a>{% if not forloop.last %} >{% endif %}
     {% endfor %}
-    {{ obrazek.nazev }}
   </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">
     {% if obrazky_predchozi %}
       {% with obrazky_predchozi|last as predchozi_obrazek %}
@@ -92,30 +96,36 @@
 
   <div class="galerie_nahledy">
     {# odkaz na predchozi galerii #}
-    {% if predchozi_galerie %}
-      Predchozi: <a href="../../{{predchozi_galerie.pk}}/{{predchozi_galerie.obrazek_set.last.pk}}/#nahoru">
-        {{predchozi_galerie}}
-      </a>
-    {% endif %}
-    {# nahledy predchozich obrazku #}
-    {% for obrazek in obrazky_predchozi %}
-    <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
-    {% endfor %}
-    {# nahled aktualniho obrazku -- TODO po kliknuti vypsat: Prohrál jsi #}
+    <div class="navigace">
+      {% if predchozi_galerie %}
+        Předchozí: <a href="../../{{predchozi_galerie.pk}}/{{predchozi_galerie.obrazek_set.last.pk}}/#nahoru">
+          {{predchozi_galerie}}
+        </a>
+      {% endif %}
+      {# nahledy predchozich obrazku #}
+      {% for obrazek in obrazky_predchozi %}
+      <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
+      {% endfor %}
+    </div>
+
     <img src={{obrazek.obrazek_maly.url}}
-         height="{{obrazek.obrazek_maly.height}}"
-         width="{{obrazek.obrazek_maly.width}}"
-         alt="{{obrazek.popis}}"
-         class="obrazek">
-    {# nahledy nasledujicich obrazku #}
-    {% for obrazek in obrazky_dalsi %}
-    <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
-    {% endfor %}
-    {# odkaz na nasledujici galerii #}
-    {% if nasledujici_galerie %}
-      Nasledujici: <a href="../../{{nasledujici_galerie.pk}}/{{nasledujici_galerie.obrazek_set.first.pk}}/#nahoru">
-        {{nasledujici_galerie}}
-      </a>
-    {% endif %}
+       height="{{obrazek.obrazek_maly.height}}"
+       width="{{obrazek.obrazek_maly.width}}"
+       alt="{{obrazek.popis}}"
+       class="obrazek"
+       id="prostredni">
+
+    <div class="navigace">
+      {# nahledy nasledujicich obrazku #}
+      {% for obrazek in obrazky_dalsi %}
+      <a href="../{{obrazek.pk}}#nahoru"><img src="{{obrazek.obrazek_maly.url}}" height="100"></a>
+      {% endfor %}
+      {# odkaz na nasledujici galerii #}
+      {% if nasledujici_galerie %}
+        Následující: <a href="../../{{nasledujici_galerie.pk}}/{{nasledujici_galerie.obrazek_set.first.pk}}/#nahoru">
+          {{nasledujici_galerie}}
+        </a>
+      {% endif %}
+    </div>
   </div>
 {% endblock %}
diff --git a/galerie/templates/galerie/GalerieNahled.html b/galerie/templates/galerie/GalerieNahled.html
index ffdcf9d3..f7026a11 100644
--- a/galerie/templates/galerie/GalerieNahled.html
+++ b/galerie/templates/galerie/GalerieNahled.html
@@ -21,11 +21,6 @@ Galerie {{galerie.nazev}}
     {% if galerie.titulni_obrazek %}
       <img src="{{ galerie.titulni_obrazek.obrazek_stredni.url }}" style="border: 1px solid black;">
     {% endif %}
-    {% if galerie.popis %}
-      <div class="popis">
-        {{ galerie.popis }}
-      </div>
-    {% endif %}
    </div>
   {% endif %}
 
@@ -46,25 +41,29 @@ Galerie {{galerie.nazev}}
     {% if podgalerie %}
       <div class="galerie_nahledy">
       {% 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.titulni_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 %}
-                 height={% widthratio obrazek.height 200 167 %} /></a>
+                 height={% widthratio obrazek.height 200 167 %} />
               {% endwith %}
             {% endif %}
            <div>
-              <a href="../{{ galerie.pk }}">{{ galerie }}</a>
+           {{ galerie }}
            </div>
-         {#  {% if user.is_staff and galerie.zobrazit > 0 %} #}
-         {#    ({{galerie.poradi}}) #}
-         {#    <span class="plus"><a href="plus/{{galerie.pk}}/">+</a></span> #}
-         {#    <span class="minus"><a href="minus/{{galerie.pk}}/">-</a></span> #}
-         {#  {% endif %} #}
+          <!--</div>-->
+        </a>
+          {% comment %}
+            {% if user.is_staff and galerie.zobrazit > 0 %}
+              ({{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 %}
-        </div>
       {% endfor %}
       </div>
     {% endif %}
@@ -79,15 +78,11 @@ Galerie {{galerie.nazev}}
   {% if obrazky %}
   <div class="galerie_nahledy">
     {% for obrazek in obrazky %}
-        <div class="galerie_nahled">
-          <span class="vystredeno"></span>
-          <a title="Zobrazit tuto fotografii" href="./{{obrazek.pk}}#nahoru">
-          <img
+        <a title="Zobrazit tuto fotografii" href="./{{obrazek.pk}}#nahoru" class="galerie_nahled"><span class="vystredeno"></span><img
             src="{{obrazek.obrazek_maly.url}}"
             width={% widthratio obrazek.obrazek_maly.width 200 167 %}
             height={% widthratio obrazek.obrazek_maly.height 200 167 %} />
-          </a>
-        </div>
+        </a>
     {% endfor %}
     <br>
   </div>
diff --git a/mamweb/static/css/mamweb.css b/mamweb/static/css/mamweb.css
index 8d20cdeb..76adb545 100644
--- a/mamweb/static/css/mamweb.css
+++ b/mamweb/static/css/mamweb.css
@@ -489,7 +489,6 @@ div.zadani_azad_termin {
 
 .popis {
   margin: 10px 10px 30px 0px;
-  clear: all;
   text-align: center;
 }
 
@@ -504,17 +503,22 @@ div.zadani_azad_termin {
   overflow: auto;
 }
 
-.galerie_nahledy img{
-  margin: 0 10px 0 10px;
+.galerie_nahledy div.navigace {
+    display: inline-block;
+    width: 150px;
 }
 
-.galerie_nahledy a{
-  height: 100%;
-  width: 100%;
-}
+/*.galerie_nahledy img{*/
+/*margin: 0 10px 0 10px;*/
+/*}*/
 
-.galerie_nahled{ /* frame */
-  display: inline-block;
+/*.galerie_nahledy a{*/
+/*height: 100%;*/
+/*width: 100%;*/
+/*}*/
+
+.galerie_nahled { /* frame */
+  display: block;
   position: relative;
   float: left;
   width: 200px;
@@ -531,6 +535,11 @@ div.zadani_azad_termin {
   margin: 10px 20px 10px 0px;
 }
 
+.galerie_nahled:hover {
+    background-color: #ffd546;
+    border-color: #ffa500;
+}
+
 .vystredeno{ /* helper */
   display: inline-block;
   height: 100%;
@@ -545,8 +554,8 @@ div.zadani_azad_termin {
 
 }
 
-.galerie_nahled img:hover {
-    /*border: 1px solid #ffa500;*/
+.galerie_nahled img, .podgalerie_nahled img {
+    border-radius: 2px;
 }
 
 .galerie_nahled div {
@@ -558,6 +567,7 @@ div.zadani_azad_termin {
 
 
 .podgalerie_nahled {
+  display: block;
   position: relative;
   float: left;
   width: 200px;
@@ -572,6 +582,11 @@ div.zadani_azad_termin {
   /*background-color: white;*/
   white-space: nowrap;
   margin: 10px 20px 10px 0px;
+  font-weight: bold;
+}
+
+.podgalerie_nahled:hover {
+    background-color: #ffa500;
 }
 
 .podgalerie_nahled img {
diff --git a/seminar/templates/seminar/soustredeni/seznam_soustredeni.html b/seminar/templates/seminar/soustredeni/seznam_soustredeni.html
index 74bbee3b..be7a3644 100644
--- a/seminar/templates/seminar/soustredeni/seznam_soustredeni.html
+++ b/seminar/templates/seminar/soustredeni/seznam_soustredeni.html
@@ -43,19 +43,19 @@
     {% for galerie in soustredeni.galerie_set.all %}
       {% if galerie.zobrazit == 0 or user.is_staff %}
         <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 #}
         </li>
       {% endif %}
     {% endfor %}
   {% endif %}
+	</ul>
   {% if user.is_staff %}
-    <li>
-      <a href="../{{soustredeni.pk}}/fotogalerie/0/new/"> VYTVOŘIT NOVOU FOTOGALERII </a>
-    </li>
+    <div class="mam-org-only">
+      <a href="../{{soustredeni.pk}}/fotogalerie/0/new/">Vytvořit novou fotogalerii</a>
+    </div>
   {% endif %}
 
-	</ul>
 
         {# popis soustredeni #}
         {% if soustredeni.text %}