update container view stats

- show release type counts
- new-style preservation status (single bar)
- show release_type preservation break down on coverage page

3 files changed, 148 insertions, 80 deletions

diff --git a/python/fatcat_web/templates/container_view.html b/python/fatcat_web/templates/container_view.html
index cf444956..785ad1ee 100644
--- a/python/fatcat_web/templates/container_view.html
+++ b/python/fatcat_web/templates/container_view.html
@@ -64,35 +64,33 @@
       <div class="label" style="text-transform: none;">Known Releases</div>
     </div>
   </div>
+</div>
+<div class="ui segment attached">
+  <b>Preservation Status</b><br>
   {% if container._stats.total >= 1 %}
-
-    {% set frac_kbart = container._stats.in_kbart/container._stats.total %}
-    {% set frac_preserved = container._stats.is_preserved/container._stats.total %}
-    {% set frac_web = container._stats.in_web/container._stats.total %}
-
-    <div class="ui {{ entity_macros.progress_color(frac_web) }} progress" style="margin-bottom: 0.1em;">
-      <div class="bar" style="width: {{ (frac_web*100)|int }}%;">
-        <div class="progress">{{ (frac_web*100)|int }}%</div>
-      </div>
-    </div>
-    {{ "{:,}".format(container._stats.in_web) }} preserved and available (bright)
-
-    <div class="ui {{ entity_macros.progress_color(frac_preserved) }} progress" style="margin-bottom: 0.1em;">
-      <div class="bar" style="width: {{ (frac_preserved*100)|int }}%;">
-        <div class="progress">{{ (frac_preserved*100)|int }}%</div>
-      </div>
-    </div>
-    {{ "{:,}".format(container._stats.is_preserved) }} preserved at all (bright or dark)
-
-    <div class="ui {{ entity_macros.progress_color(frac_kbart) }} progress" style="margin-bottom: 0.1em; margin-top: 1em;">
-      <div class="bar" style="width: {{ (frac_kbart*100)|int }}%;">
-        <div class="progress">{{ (frac_kbart*100)|int }}%</div>
-      </div>
-    </div>
-    {{ "{:,}".format(container._stats.in_kbart ) }} preserved by Keeper (dark)
-
+    {{ entity_macros.preservation_bar(container._stats.preservation) }}
+    {{ entity_macros.preservation_small_table(container._stats.preservation) }}
   {% endif %}
 </div>
+{% if container._stats.total >= 1 %}
+{% endif %}
+  <div class="ui segment attached">
+    <b>Work Types</b><br>
+    <table class="ui very basic very compact collapsing table">
+      <tbody>
+        {% for type_row in container._stats.release_type %}
+        <tr>
+          <td class="three wide">
+            {% if type_row == "_unknown" %}
+              <i>Unknown</i>
+            {% else %}
+              <code>{{ type_row }}</code>
+            {% endif %}
+          <td class="three wide right aligned">{{ container._stats.release_type[type_row] }}
+        {% endfor %}
+      </tbody>
+    </table>
+  </div>
 {% endif %}
 
 {% if container.issnl != None or container.wikidata_qid != None %}
diff --git a/python/fatcat_web/templates/container_view_coverage.html b/python/fatcat_web/templates/container_view_coverage.html
index fc643f81..fd173cd4 100644
--- a/python/fatcat_web/templates/container_view_coverage.html
+++ b/python/fatcat_web/templates/container_view_coverage.html
@@ -14,73 +14,54 @@
         <div class="label" style="text-transform: none;">Known Releases</div>
       </div>
       {% if container._stats.total >= 1 %}
-
-        {% set frac_kbart = container._stats.in_kbart/container._stats.total %}
-        {% set frac_preserved = container._stats.is_preserved/container._stats.total %}
-        {% set frac_web = container._stats.in_web/container._stats.total %}
-
-        {% set pstats = container._stats.preservation %}
-        {% set frac_bright = container._stats.preservation.bright/container._stats.total %}
-        {% set frac_dark = container._stats.preservation.dark/container._stats.total %}
-        {% set frac_shadows_only = container._stats.preservation.shadows_only/container._stats.total %}
-        {% set frac_none = container._stats.preservation.none/container._stats.total %}
-
-        <div class="ui large multiple progress" data-percent="0,0,0,0" style="margin-bottom: 0.1em;">
-          <div class="green bar" style="border-radius: 0; min-width: 0; width: {{ (frac_bright*100)|round(method='ceil') }}%;" title="bright">
-            <div class="progress">{# {{ (frac_bright*100)|int }}% #}</div>
-          </div>
-          <div class="green bar" style="border-radius: 0; min-width: 0; width: {{ (frac_dark*100)|round(method='ceil') }}%; background-color: darkgreen;">
-            <div class="progress">{# {{ (frac_dark*100)|int }}% #}</div>
-          </div>
-          <div class="red bar" style="border-radius: 0; min-width: 0; width: {{ (frac_shadows_only*100)|round(method='ceil') }}%; background-color: darkred;">
-            <div class="progress">{# {{ (frac_shadows_only*100)|int }}% #}</div>
-          </div>
-          <div class="red bar" style="border-radius: 0; min-width: 0; width: {{ (frac_none*100)|round(method='ceil') }}%;">
-            <div class="progress">{# {{ (frac_none*100)|int }}% #}</div>
-          </div>
-        </div>
-        <table class="ui very basic very compact collapsing table" style="font-weight: bold; margin-left: 1em;">
-          <tbody>
-            <tr>
-              <td style="background-color: green;">
-              <td class="right aligned" >{{ "{:,}".format(pstats.bright) }}
-              <td class="right aligned" >{{ (frac_bright*100)|round(2,method='ceil') }}%
-              <td>preserved and publicly available (bright)
-            <tr>
-              <td style="background-color: darkgreen;">
-              <td class="right aligned" >{{ "{:,}".format(pstats.dark) }}
-              <td class="right aligned" >{{ (frac_dark*100)|round(2,method='ceil') }}%
-              <td>preserved but not publicly accessible (dark)
-            <tr>
-              <td style="background-color: darkred;">
-              <td class="right aligned" >{{ "{:,}".format(pstats.shadows_only) }}
-              <td class="right aligned" >{{ (frac_shadows_only*100)|round(2,method='ceil') }}%
-              <td>only independently preserved in "shadow" libraries
-            <tr>
-              <td style="background-color: red;">
-              <td class="right aligned" >{{ "{:,}".format(pstats.none) }}
-              <td class="right aligned" >{{ (frac_none*100)|round(2,method='ceil') }}%
-              <td>no known independent preservation
-          </tbody>
-        </table>
-
+        {{ entity_macros.preservation_bar(container._stats.preservation, extra_class="large") }}
+        {{ entity_macros.preservation_table(container._stats.preservation) }}
       {% endif %}
     </div>
   </div>
 </div>
 
 {% if container._stats.total >= 1 %}
-  <br>
-  <br>
+  <br><br>
   <h2>Perpetual Access Coverage by Year</h2>
 
   <figure style="margin: 0 0 0 0;">
-    <embed type="image/svg+xml" src="/container/{{ container.ident }}/ia_coverage_years.svg" />
+    <embed type="image/svg+xml" src="/container/{{ container.ident }}/preservation_by_year.svg" />
+  </figure>
+
+  <div style="float: right;">
+    <a href="/container/{{ container.ident }}/preservation_by_year.json">Download as JSON</a>
+  </div>
+
+  <br><br>
+  <h2>Perpetual Access Coverage by Volume</h2>
+
+  <figure style="margin: 0 0 0 0;">
+    <embed type="image/svg+xml" src="/container/{{ container.ident }}/preservation_by_volume.svg" />
   </figure>
 
   <div style="float: right;">
-    <a href="/container/{{ container.ident }}/ia_coverage_years.json">Download as JSON</a>
+    <a href="/container/{{ container.ident }}/preservation_by_volume.json">Download as JSON</a>
   </div>
+
+  <br><br>
+  <h2>Perpetual Access Coverage by Release Type</h2>
+  <table class="ui table">
+    <thead>
+      <tr>
+        <th>Release Type
+        <th class="right aligned">Total Count
+        <th>Coverage
+    </thead>
+    <tbody>
+      {% for type_row in container._type_preservation %}
+      <tr>
+        <td class="two wide">{{ type_row.release_type }}
+        <td class="two wide right aligned">{{ type_row.total }}
+        <td class="twelve wide">{{ entity_macros.preservation_bar(type_row) }}
+      {% endfor %}
+    </tbody>
+  </table>
 {% endif %}
 
 {% endblock %}
diff --git a/python/fatcat_web/templates/entity_macros.html b/python/fatcat_web/templates/entity_macros.html
index 8e4c4f6a..c3ae099a 100644
--- a/python/fatcat_web/templates/entity_macros.html
+++ b/python/fatcat_web/templates/entity_macros.html
@@ -260,3 +260,92 @@ yellow
 {% endif %}
 {%- endmacro %}
 
+
+{% macro preservation_bar(stats, extra_class="") -%}
+
+  {% set frac_bright = stats.bright/stats.total %}
+  {% set frac_dark = stats.dark/stats.total %}
+  {% set frac_shadows_only = stats.shadows_only/stats.total %}
+  {% set frac_none = stats.none/stats.total %}
+
+  <div class="ui {{ extra_class }} multiple progress" data-percent="0,0,0,0" style="margin-bottom: 0.1em;">
+    <div class="green bar" style="border-radius: 0; min-width: 0; width: {{ (frac_bright*100)|round(method='ceil') }}%;" title="bright">
+      <div class="progress">{# {{ (frac_bright*100)|int }}% #}</div>
+    </div>
+    <div class="green bar" style="border-radius: 0; min-width: 0; width: {{ (frac_dark*100)|round(method='ceil') }}%; background-color: darkgreen;" title="dark">
+      <div class="progress">{# {{ (frac_dark*100)|int }}% #}</div>
+    </div>
+    <div class="red bar" style="border-radius: 0; min-width: 0; width: {{ (frac_shadows_only*100)|round(method='ceil') }}%; background-color: darkred;" title="shadows only">
+      <div class="progress">{# {{ (frac_shadows_only*100)|int }}% #}</div>
+    </div>
+    <div class="red bar" style="border-radius: 0; min-width: 0; width: {{ (frac_none*100)|round(method='ceil') }}%;" title="no preservation">
+      <div class="progress">{# {{ (frac_none*100)|int }}% #}</div>
+    </div>
+  </div>
+
+
+{%- endmacro %}
+
+{% macro preservation_table(stats) -%}
+
+  {% set frac_bright = stats.bright/stats.total %}
+  {% set frac_dark = stats.dark/stats.total %}
+  {% set frac_shadows_only = stats.shadows_only/stats.total %}
+  {% set frac_none = stats.none/stats.total %}
+
+  <table class="ui very basic very compact collapsing table" style="font-weight: bold; margin-left: 1em;">
+    <tbody>
+      <tr>
+        <td style="background-color: #21ba45;">
+        <td class="right aligned" >{{ "{:,}".format(stats.bright) }}
+        <td class="right aligned" >{{ (frac_bright*100)|round(2,method='ceil') }}%
+        <td>preserved and publicly available (bright)
+      <tr>
+        <td style="background-color: darkgreen;">
+        <td class="right aligned" >{{ "{:,}".format(stats.dark) }}
+        <td class="right aligned" >{{ (frac_dark*100)|round(2,method='ceil') }}%
+        <td>preserved but not publicly accessible (dark)
+      <tr>
+        <td style="background-color: darkred;">
+        <td class="right aligned" >{{ "{:,}".format(stats.shadows_only) }}
+        <td class="right aligned" >{{ (frac_shadows_only*100)|round(2,method='ceil') }}%
+        <td>only independently preserved in "shadow" libraries
+      <tr>
+        <td style="background-color: #db2828;">
+        <td class="right aligned" >{{ "{:,}".format(stats.none) }}
+        <td class="right aligned" >{{ (frac_none*100)|round(2,method='ceil') }}%
+        <td>no known independent preservation
+    </tbody>
+  </table>
+
+{%- endmacro %}
+
+{% macro preservation_small_table(stats) -%}
+
+  {% set frac_bright = stats.bright/stats.total %}
+  {% set frac_dark = stats.dark/stats.total %}
+  {% set frac_shadows_only = stats.shadows_only/stats.total %}
+  {% set frac_none = stats.none/stats.total %}
+
+  <table class="ui very basic very compact collapsing table">
+    <tbody>
+      <tr>
+        <td style="background-color: #21ba45;">
+        <td class="right aligned" >{{ "{:,}".format(stats.bright) }}
+        <td>preserved and accessble (bright)
+      <tr>
+        <td style="background-color: darkgreen;">
+        <td class="right aligned" >{{ "{:,}".format(stats.dark) }}
+        <td>preserved, inaccessible (dark)
+      <tr>
+        <td style="background-color: darkred;">
+        <td class="right aligned" >{{ "{:,}".format(stats.shadows_only) }}
+        <td>shadow library only
+      <tr>
+        <td style="background-color: #db2828;">
+        <td class="right aligned" >{{ "{:,}".format(stats.none) }}
+        <td>no known preservation
+    </tbody>
+  </table>
+
+{%- endmacro %}