Display call for contributions on top of collection page, fix item metadata display.
authorAlexandre Segura <mex.zktk@gmail.com>
Wed, 01 Mar 2017 18:50:40 +0100
changeset 414 49a753808505
parent 413 9c5f2d97863a
child 415 c4b700679964
Display call for contributions on top of collection page, fix item metadata display.
src/iconolab/templates/iconolab/collection_home.html
src/iconolab/templates/iconolab/detail_image.html
src_js/iconolab-bundle/src/components/editor/Canvas.vue
src_js/iconolab-bundle/src/iconolab.scss
--- a/src/iconolab/templates/iconolab/collection_home.html	Wed Mar 01 18:49:21 2017 +0100
+++ b/src/iconolab/templates/iconolab/collection_home.html	Wed Mar 01 18:50:40 2017 +0100
@@ -7,7 +7,7 @@
 {% load iconolab_tags %}
 
 {% block content %}
-  <div id="collection-summary" class="row">
+  <div class="collection-summary" class="row">
     <div class="col-md-3">
       {% thumbnail collection.image "300x300" crop=False as im %}
         <img src="{{ im.url }}" class="img-responsive">
@@ -17,16 +17,51 @@
         {{ collection.description | safe }}
       </p>
     </div>
-    <div class="col-md-9 description-container">
+    <div class="col-md-9">
       <h1>{{ collection.verbose_name }} <small>Fonds Iconolab</small></h1>
 
+      {% if contributions_pagination_data.list %}
+        <h3>Appels à contribution</h3>
+        {% for annotation in contributions_pagination_data.list %}
+        <div class="row">
+          <div class="col-md-4">
+            <div class="fragment-container" style="position: relative">
+              {% thumbnail annotation.image.media "250x250" crop=False as im %}
+                <a href="{% url 'image_detail' collection_name annotation.image.image_guid %}#{{ annotation.annotation_guid }}">
+                  <img v-el:small-image src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />
+                  <svg width="{{ im.width }}" height="{{ im.height }}" version="1.1" style="position:absolute; top:0px; left: 0px">
+                    <g transform="matrix({% transform_matrix im_width=im.width im_height=im.height max_x=100 max_y=100 %})">
+                      <path d="{{ annotation.current_revision.fragment|clean_path }}" opacity="0.7" fill="orange"></path>
+                    </g>
+                  </svg>
+                </a>
+              {% endthumbnail %}
+            </div>
+          </div>
+          <div class="col-md-8">
+            <h4>{{ annotation.current_revision.title }}</h4>
+            <p>
+            {% for contributor in annotation.stats.contributors %}
+              {{ contributor }}
+            {% endfor %}
+            <p>
+            <p>{{ annotation.current_revision.description }}</p>
+            {% for tagging_info in annotation.current_revision.tagginginfo_set.all %}
+              <p>
+                <span class="label label-default"><i class="fa fa-tag"></i> {{ tagging_info.tag.label }}</span>
+                <span><i class="fa fa-exclamation-triangle"></i> {{ tagging_info.accuracy }}</span>
+                <span><i class="fa fa-crosshairs"></i> {{ tagging_info.relevancy }}</span>
+              </p>
+            {% endfor %}
+          </div>
+        </div>
+        {% endfor %}
+      {% endif %}
+
       <ul class="nav nav-tabs" role="tablist">
         <li id="tab-items" role="presentation" class="{% if active_list == 'items' %}active{% endif %}">
           <a href="#list-items" role="tab" data-toggle="tab">Objets du fonds</a>
         </li>
-        <li id="tab-contribution" role="presentation" class="pull-right {% if active_list == 'contributions' %}active{% endif %}">
-          <a href="#list-contribution" role="tab" data-toggle="tab">Appels à contribution</a>
-        </li>
         <li id="tab-revised" role="presentation" class="pull-right {% if active_list == 'revised' %}active{% endif %}">
           <a href="#list-revised" role="tab" data-toggle="tab">Annotations les plus révisées</a>
         </li>
@@ -49,12 +84,6 @@
             {% include "partials/collection_home_pagination_links.html" with pagination_data=revised_pagination_data list_identifier="revised" %}
           {% endif %}
         </div>
-        <div id="list-contribution" role="tabpanel" class="tab-pane {% if active_list == 'contributions' %}active{% endif %}">
-          {% include "partials/image_annotations_list.html" with annotation_list=contributions_pagination_data.list %}
-          {% if contributions_list %}
-            {% include "partials/collection_home_pagination_links.html" with pagination_data=contributions_pagination_data list_identifier="contributions" %}
-          {% endif %}
-        </div>
         <div id="list-items" role="tabpanel" class="tab-pane {% if active_list == 'items' %}active{% endif %}">
           <div class="item-grid">
             {% for item in items_pagination_data.list %}
--- a/src/iconolab/templates/iconolab/detail_image.html	Wed Mar 01 18:49:21 2017 +0100
+++ b/src/iconolab/templates/iconolab/detail_image.html	Wed Mar 01 18:50:40 2017 +0100
@@ -37,34 +37,11 @@
     </div>
   </div>
   <div class="annotation-navigator-canvas">
-
     <image-annotator v-bind:annotation="annotation"
       ref="annotator"
       image="{% with image.media as img %}{{ img.url }}{% endwith %}"
       thumbnail="{% thumbnail image.media '100x100' crop=False as thumb %}{{ thumb.url }}{% endthumbnail %}"
       v-bind:is-authenticated="isAuthenticated"></image-annotator>
-
-    <div>
-      <dl class="dl-horizontal">
-        {% if item.metadatas.designation %}<dt>Désignation</dt><dd>{{item.metadatas.designation}}</dd>{% endif %}
-        {% if item.metadatas.authors %}<dt>Auteur(s)</dt><dd>{{item.metadatas.designation}}</dd>{% endif %}
-        {% if item.metadatas.field %}<dt>Domaine</dt><dd>{{item.metadatas.field}}</dd>{% endif %}
-        {% if item.metadatas.conservation_location %}<dt>Conservé à</dt><dd>{{item.metadatas.conservation_location}}</dd>{% endif %}
-        {% if item.metadatas.datation %}<dt>Datation</dt><dd>{{item.metadatas.datation}}</dd>{% endif %}
-        {% if item.metadatas.technics %}<dt>Techniques</dt><dd>{{item.metadatas.technics}}</dd>{% endif %}
-        {% if item.metadatas.measurements %}<dt>Mesures : {{item.metadatas.measurements}}</h5>{% endif %}
-        {% if item.metadatas.create_or_usage_location %}<dt>Lieu de création/utilisation</dt><dd>{{item.metadatas.create_or_usage_location}}</dd>{% endif %}
-        {% if item.metadatas.discovery_context %}<dt>Contexte de découverte</dt><dd>{{item.metadatas.discovery_context}}</dd>{% endif %}
-        {% if item.metadatas.photo_credits %}<dt>Crédits photographiques</dt><dd>{{item.metadatas.photo_credits}}</dd>{% endif %}
-        {% if item.metadatas.inventory_number %}<dt>Numéro d'inventaire</dt><dd>{{item.metadatas.inventory_number}}</dd>{% endif %}
-      </dl>
-      {% if item.metadatas.joconde_ref %}
-      <a href="{{item.metadatas.get_joconde_url}}" target="_blank">
-      Cet objet dans Joconde, catalogue collectif des collections des musées de France
-      </a>
-      {% endif %}
-    </div>
-
     <form id="form-annotation" action="{% url 'annotation_create' collection_name image.image_guid %}" method="POST">
       {% csrf_token %}
       <input type="hidden" name="{{ form.title.name }}">
@@ -93,6 +70,28 @@
     </div>
   </div>
 </div>
+<div class="annotation-navigator-metadata">
+  <dl class="dl-horizontal">
+    {% if item.metadatas.designation %}<dt>Désignation</dt><dd>{{item.metadatas.designation}}</dd>{% endif %}
+    {% if item.metadatas.authors %}<dt>Auteur(s)</dt><dd>{{item.metadatas.designation}}</dd>{% endif %}
+    {% if item.metadatas.field %}<dt>Domaine</dt><dd>{{item.metadatas.field}}</dd>{% endif %}
+    {% if item.metadatas.conservation_location %}<dt>Conservé à</dt><dd>{{item.metadatas.conservation_location}}</dd>{% endif %}
+    {% if item.metadatas.datation %}<dt>Datation</dt><dd>{{item.metadatas.datation}}</dd>{% endif %}
+    {% if item.metadatas.technics %}<dt>Techniques</dt><dd>{{item.metadatas.technics}}</dd>{% endif %}
+    {% if item.metadatas.measurements %}<dt>Mesures : {{item.metadatas.measurements}}</h5>{% endif %}
+    {% if item.metadatas.create_or_usage_location %}<dt>Lieu de création/utilisation</dt><dd>{{item.metadatas.create_or_usage_location}}</dd>{% endif %}
+    {% if item.metadatas.discovery_context %}<dt>Contexte de découverte</dt><dd>{{item.metadatas.discovery_context}}</dd>{% endif %}
+    {% if item.metadatas.photo_credits %}<dt>Crédits photographiques</dt><dd>{{item.metadatas.photo_credits}}</dd>{% endif %}
+    {% if item.metadatas.inventory_number %}<dt>Numéro d'inventaire</dt><dd>{{item.metadatas.inventory_number}}</dd>{% endif %}
+  </dl>
+  {% if item.metadatas.joconde_ref %}
+  <p class="text-center">
+    <a href="{{item.metadatas.get_joconde_url}}" target="_blank">
+    Cet objet dans Joconde, catalogue collectif des collections des musées de France
+    </a>
+  </p>
+  {% endif %}
+</div>
 
 {% endblock %}
 
--- a/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Wed Mar 01 18:49:21 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Wed Mar 01 18:50:40 2017 +0100
@@ -523,7 +523,6 @@
 <style scoped>
 .wrapper {
     position: relative;
-    margin-bottom: 30px;
 }
 .cut-canvas {
     width: 100%;
--- a/src_js/iconolab-bundle/src/iconolab.scss	Wed Mar 01 18:49:21 2017 +0100
+++ b/src_js/iconolab-bundle/src/iconolab.scss	Wed Mar 01 18:50:40 2017 +0100
@@ -320,7 +320,12 @@
 
 .collection-summary{
 	padding-bottom: 15px;
-	width: 100%
+    .tab-pane {
+        padding: 30px 0;
+    }
+    .fragment-container {
+        margin-bottom: 20px;
+    }
 }
 
 .collection-container{
@@ -409,12 +414,6 @@
 	padding: 10px;
 }
 
-#collection-summary {
-    .tab-pane {
-        padding: 30px 0;
-    }
-}
-
 .annotation-navigator {
     display: flex;
     margin-bottom: 30px;
@@ -467,30 +466,22 @@
         }
         .panel-body {
             flex-direction: column;
-            // justify-content: space-between;
-
-            > * {
-                // flex: 1 1 auto;
-            }
-
-            .wrapper {
-              // border: 1px solid red;
+            .comment-form {
+                padding: 10px 0;
             }
-
-            > *:last-child {
-                // display: flex;
-                // flex-direction: column;
-                // justify-content: flex-end;
-            }
-
-            .annotation-comment-box {
-                // padding-top: 15px;
-                // padding-bottom: 15px;
-            }
-
-          .comment-form {
-              padding: 10px 0;
-          }
         }
     }
 }
+
+.annotation-navigator-metadata {
+    margin-bottom: 30px;
+    padding: 0 15px;
+    dl {
+        max-width: 60%;
+        margin: 0 auto;
+        margin-bottom: 20px;
+    }
+    > a {
+        text-align: center;
+    }
+}