Skip to content

Commit

Permalink
feat: EDTF Timeline (#52)
Browse files Browse the repository at this point in the history
* wip

* customize relevant buttons to new timeline

* delete temp file

* make coderabbit happy
  • Loading branch information
koilebeit authored Feb 28, 2024
1 parent 8cfb3d5 commit 6292815
Show file tree
Hide file tree
Showing 9 changed files with 141 additions and 11 deletions.
2 changes: 1 addition & 1 deletion _data/sgb-metadata.csv
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
objectid,filename,title,subject,description,creator,publisher,date,era,type,format,extent,source,language,relation,rights,license,,hasVersion,isPartOf,isReferencedBy,display_template,object_location,image_small,image_thumb,image_alt_text
abb13578,abb13578.tif,"Plakat zur Völkerschau in Basel, 1926",Kolonialismus; Imperialismus; Rassismus; Öffentlichkeit; Kultur,"Im Zeitraum zwischen 1879 und 1935 fanden im Basler Zoo 21 sogenannte «Völkerschauen» statt, in denen Menschen aus verschiedenen Kulturen gezeigt wurden. Dahinter stand ein rassistisches, imperialistisches und kolonialistischen Menschenbild. Die in den Werbeplakaten verwendete Bildsprache stellte die Menschen als «wild», «kriegerisch» und «exotisch» dar, was zu einer Aufrechterhaltung von negativen Stereotypen führte. Die Schauen waren in der Ideologie der «Rassentheorie» verwurzelt, die eine Überlegenheit der europäischen Bevölkerung gegenüber anderen Kulturen behauptete. Diese Überzeugung liess es akzeptabel erscheinen, die Menschen als blosse Objekte zur Belustigung des Publikums zu behandeln.",,StaBS Q2324698,1926,Zeitgeschichte,Image,image/tiff,23376 x 30371,StaBs BSL 1001 N 7,DE,https://dls.staatsarchiv.bs.ch/records/135592,print und print digital (2022-),https://creativecommons.org/publicdomain/mark/1.0/,,,,,,objects/abb13578.tif,objects/small/abb13578_sm.jpg,objects/thumbs/abb13578_th.jpg,
abb13578,abb13578.tif,"Plakat zur Völkerschau in Basel, 1926",Kolonialismus; Imperialismus; Rassismus; Öffentlichkeit; Kultur,"Im Zeitraum zwischen 1879 und 1935 fanden im Basler Zoo 21 sogenannte «Völkerschauen» statt, in denen Menschen aus verschiedenen Kulturen gezeigt wurden. Dahinter stand ein rassistisches, imperialistisches und kolonialistischen Menschenbild. Die in den Werbeplakaten verwendete Bildsprache stellte die Menschen als «wild», «kriegerisch» und «exotisch» dar, was zu einer Aufrechterhaltung von negativen Stereotypen führte. Die Schauen waren in der Ideologie der «Rassentheorie» verwurzelt, die eine Überlegenheit der europäischen Bevölkerung gegenüber anderen Kulturen behauptete. Diese Überzeugung liess es akzeptabel erscheinen, die Menschen als blosse Objekte zur Belustigung des Publikums zu behandeln.",,StaBS Q2324698,1925,Zeitgeschichte,Image,image/tiff,23376 x 30371,StaBs BSL 1001 N 7,DE,https://dls.staatsarchiv.bs.ch/records/135592,print und print digital (2022-),https://creativecommons.org/publicdomain/mark/1.0/,,,,,,objects/abb13578.tif,objects/small/abb13578_sm.jpg,objects/thumbs/abb13578_th.jpg,
abb40689,abb40689.tif,Schnitzerei am Chorgestühl des Basler Münsters,Antisemitismus; Judentum; Kunst; Religion; Kirche,"Ein Schnitzwerk im Chorgestühl des Basler Münsters aus der Zeit um 1380 zeigt eine beleidigende Darstellung von jüdischen Personen. Das Bild zeigt zwei Personen, die Milch direkt von einer Sau trinken, was eine Karikatur des jüdischen Nahrungstabus für Schweine ist. Dieses Motiv hat eine lange Geschichte von ausgrenzenden und beleidigenden Darstellungen jüdischer Menschen, die bis ins 13. Jahrhundert zurück reicht.",,Denkmalpflege Basel Stadt Q27479725,1384/1390,Mittelalter,Image,image/tiff,3887 x 3619,Sammlung Münsterfoto,,,Foto Hans Grunert,https://rightsstatements.org/page/InC-RUU/1.0/?language=de,,,,,,objects/abb40689.tif,objects/small/abb40689_sm.jpg,objects/thumbs/abb40689_th.jpg,
abb19619,abb19619.tif,Hie Basel Hie Schweizer Boden - Liste 3,Politik; Rassismus; Diskurs; Nationalismus; Nationalstaat; Sozialismus; Werbung ,"Das undatierte Wahlplakat der Bürger- und Gewerbepartei (BGP), das von Otto Plattner erstellt wurde, spiegelt die ideologischen Auswirkungen des Generalstreiks wider. Die bürgerliche Partei versuchte, dem Aufstieg der Kommunistischen Partei (KP) entschieden entgegenzutreten und nutzte dabei rassistische Darstellungen: Auf dem Plakat wird das Schreckgespenst des Kommunismus als eine gewalttätige und ungesunde Menschenmenge dargestellt, die als Bedrohung für die Schweiz und ihre Bürger:innen angesehen wird.",Otto Plattner Q1748710,"Plakatsammlung, Schule für Gestaltung ",1925~,Zeitgeschichte,Image,image/tiff,2877 x 4096,CH-000957-X:4432,Schweizerdeutsch ,https://commons.wikimedia.org/wiki/File:CH-000957-X-4432_Plattner.tif,Wikimedia Commons,https://creativecommons.org/publicdomain/mark/1.0/,,,,,,objects/abb19619.tif,objects/small/abb19619_sm.jpg,objects/thumbs/abb19619_th.jpg,
abb21535,abb21535.jpeg,"Die ausländische Wohnbevölkerung von Basel-Stadt nach Heimatnation, 1920–1965",Asyl; Migration; Minderheit; Integration; Heimat; Gesellschaft; Gesetz,"Die vorliegende Statistik bietet Informationen über den prozentualen Anteil der Bevölkerung im Kanton Basel-Stadt, der im Zeitraum von 1920 bis 1965 eine deutsche, französische oder italienische Staatsbürgerschaft besass. Der grau schraffierte Bereich repräsentiert die «übrigen Nationalitäten»",Stadt.Geschichte.Basel Q122442230,Stadt.Geschichte.Basel Q122442230,1920/1965,Zeitgeschichte,Image,image/jpeg,1450 x 788,,DE,,Public Domain,https://creativecommons.org/publicdomain/mark/1.0/,,,,,,objects/abb21535.jpeg,objects/small/abb21535.jpeg_sm.jpg,objects/thumbs/abb21535.jpeg_th.jpg,
Expand Down
2 changes: 1 addition & 1 deletion _data/theme.yml
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ map-cluster-radius: 25 # size of clusters, from ~ 10 to 80
#
# set either year-navigation or year-nav-increment to generate a year nav dropdown
year-navigation: #"1900;1905;1910;1915;1920" # manually set years to appear in dropdown nav
year-nav-increment: 5 # set increments to auto gen nav years
year-nav-increment: 1 # set increments to auto gen nav years

##########
# DATA
Expand Down
5 changes: 3 additions & 2 deletions _includes/item/download-buttons.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@
{%- endcomment -%}
<div class="btn-group" role="group" aria-label="Item options">
{% if page.object_transcript %}<button class="btn btn-outline-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTranscript" aria-expanded="false" aria-controls="collapseExample">View Transcript</button>{% endif %}
{% if page.date %}{%- capture year -%}{% if page.date contains "-" %}{{ page.date | split: "-" | first }}{% elsif page.date contains "/" %}{{ page.date | split: "/" | last }}{% else %}{{ page.date }}{% endif %}{%- endcapture -%}
<a href="{{ year | strip | prepend: '/timeline.html#y' | relative_url }}" class="btn btn-outline-primary">View on Timeline</a>{% endif %}
{% if page.date %}{% assign regex = '[\dX]{4}' %}{%- assign matches = page.date | regex_match: regex -%}
{%- capture url -%}{%- for match in matches -%}{% capture queryParam %}y{{ match }}{% endcapture %}{% assign years = years | append: queryParam %}{% assign url = url | append: queryParam %}{%- endfor %}{%- endcapture %}{% assign url = url | append: '#y' | append: matches[0] %}{% assign url = '?' | append: years | append: '#y' | append: matches[0] %}
<a href="{{ url | strip | prepend: '/timeline.html' | relative_url | escape}}" class="btn btn-outline-primary">View on Timeline</a>{% endif %}
{% if page.latitude and page.longitude %}
<a href="{{ '/map.html?location=' | append: page.latitude | append: ',' | append: page.longitude | append: '&marker=' | append: page.objectid | relative_url }}" class="btn btn-outline-primary">View on Map</a>{% endif %}
{% if page.object_location %}<a target="_blank" rel="noopener" href="{{ page.object_location | relative_url }}" class="btn btn-outline-primary">
Expand Down
22 changes: 16 additions & 6 deletions _includes/js/timeline-js.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,20 @@
return new bootstrap.Tooltip(tooltipTriggerEl)
})

// highlight year if hash
if(window.location.hash) {
var hashfilter = decodeURIComponent(location.hash.substr(1));
document.querySelector("tr#" + hashfilter).classList.add("table-info");
}
// Highlight years based on query parameters
var queryParams = new URLSearchParams(window.location.search);

queryParams.forEach(function(value, key) {
var years = key.split('y');
years.forEach(function(year) {
if (year) {
var tableRow = document.querySelector("tr#y" + year);
if (tableRow) {
tableRow.classList.add("table-info");
}
}
});
});
})();
</script>
</script>

78 changes: 78 additions & 0 deletions _layouts/timeline_edtf.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
---
# "Timeline" page
layout: page
custom-foot: js/timeline-js.html
---
{%- assign field = site.data.theme.timeline-field | default: "date" -%}
{% if site.data.theme.timeline-child-objects == true %}
{%- assign items = site.data[site.metadata] | where_exp: 'item','item.objectid' -%}
{% else %}
{%- assign items = site.data[site.metadata] | where_exp: 'item','item.objectid and item.parentid == nil' -%}
{% endif %}
{%- assign items = items | where_exp: 'item','item[field]' -%}
{%- assign raw-dates = items | map: field | compact | uniq -%}
{% assign regex = '[\dX]{4}' %}
{%- capture clean-years -%}{% for date in raw-dates %}{{date | regex_match: regex | join: ';' }}{% unless forloop.last %};{% endunless %}{%- endfor -%}{%- endcapture -%}
{%- assign uniqueYears = clean-years | remove: " " | replace: ";;",";" | split: ";" | uniq | sort -%}
{%- if site.data.theme.year-navigation -%}
{%- assign navYears = site.data.theme.year-navigation | split: ";" -%}
{%- elsif site.data.theme.year-nav-increment -%}
{%- capture navYears -%}
{%- for i in uniqueYears -%}{%- assign t = i | modulo: site.data.theme.year-nav-increment -%}
{%- if t == 0 -%}{{ i }}{% unless forloop.last %};{% endunless %}{% endif %}{% endfor %}{%- endcapture -%}
{%- assign navYears = navYears | split: ";" -%}
{%- endif -%}
{%- if navYears -%}
<div class="dropdown float-end" id="year-nav">
<button class="btn btn-primary dropdown-toggle" type="button" id="yearButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Year
</button>
<div class="dropdown-menu" aria-labelledby="yearButton">
{% for y in navYears %}
<a class="dropdown-item" href="#y{{ y }}">{{ y }}</a>{% endfor %}
</div>
</div>
{%- endif -%}

{{ content }}

<h3><a href="#y{{ uniqueYears | first }}">{{ uniqueYears | first }}</a> to <a href="#y{{ uniqueYears | last }}">{{ uniqueYears | last }}</a></h3>

<table id="timeline" class="table table-striped">
<tbody>
{% for year in uniqueYears %}
<tr id="y{{ year }}">
<th>
<h3>{{ year }}</h3>
</th>
<td>
<div class="row">
{%- assign inYear = items | where_exp: 'item', 'item[field] contains year' -%}
{% for item in inYear %}
<div class="col-lg-4 col-md-6">
<figure class="figure">
<a href="{% if item.parentid == nil %}{{ '/items/' | append: item.objectid | append: '.html' | relative_url }}{% elsif item.parentid %}{{ '/items/' | append: item.parentid | append: '.html' | relative_url }}#{{item.objectid }}{% endif %}" >
{% if item.image_thumb %}
<img class="lazyload img-thumbnail timeline-thumb" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3C/svg%3E" data-src="{{ item.image_thumb | relative_url }}" alt="{{ item.image_alt_text | default: item.description | default: item.title | escape }}" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{ item.title | escape }}">
{% else %}
<div class="card">
<div class="card-body text-center">
<div class="h5 text-dark">{{ item.title }}</div>
<svg class="bi timeline-thumb text-body" fill="currentColor" aria-hidden="true">
{%- assign icon_template = item.display_template | default: item.format -%}
<use xlink:href="{{ '/assets/lib/cb-icons.svg' | relative_url }}#{% if icon_template contains 'image' %}icon-image{% elsif icon_template contains 'pdf' %}icon-pdf{% elsif icon_template contains 'audio' %}icon-audio{% elsif icon_template contains 'video' %}icon-video{% elsif icon_template contains 'panorama' %}icon-panorama{% elsif icon_template contains 'compound' %}icon-compound-object{% elsif icon_template contains 'multiple' %}icon-multiple{% else %}icon-default{% endif %}"/>
</svg>
</div>
</div>
{% endif %}
</a>
<figcaption class="figure-caption">{{item.date}}</figcaption>
</figure>
</div>
{% endfor %}
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
26 changes: 26 additions & 0 deletions _plugins/jekyll_regex_match.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
module Jekyll
module RegexMatch
def regex_match(input_str, regex_str)
begin
regex = Regexp.new(regex_str)
input_str.scan(regex).flatten
rescue RegexpError => e
# Handle invalid regex pattern
return []
end
end

def regex_match_once(input_str, regex_str)
begin
regex = Regexp.new(regex_str)
match = input_str.match(regex)
return match.nil? ? nil : match[0]
rescue RegexpError => e
# Handle invalid regex pattern
return nil
end
end
end
end

Liquid::Template.register_filter(Jekyll::RegexMatch)
10 changes: 10 additions & 0 deletions _plugins/sort_edtf.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
module Jekyll
module SortEDTF
def sort_edtf(array_of_strings)
sorted = array_of_strings.map { |str| str.gsub('X', '0') }
sorted.sort_by { |str| str[/\d+/].to_i }
end
end
end

Liquid::Template.register_filter(Jekyll::SortEDTF)
5 changes: 5 additions & 0 deletions _sass/_custom.scss
Original file line number Diff line number Diff line change
Expand Up @@ -25,4 +25,9 @@
src: url('/assets/fonts/EuclidCircularB-Semibold-WebS.woff2') format('woff2');
font-style: normal;
font-weight: 600;
}

/* figcaption */
.figure-caption {
text-align: center;
}
2 changes: 1 addition & 1 deletion pages/timeline.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Timeline
layout: timeline
layout: timeline_edtf
permalink: /timeline.html
---

Expand Down

0 comments on commit 6292815

Please sign in to comment.