ord-premise.github.io/deliverables.html at main · ord-premise/ord-premise.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
---
layout: page
title: Our Deliverables
subtitle: What does PREMISE do?
---

<div class="deliverables">
  <p id="deliverables-intro">The deliverables of the PREMISE project are distributes across five work packages (WPs). You can learn more about the specific goal and expected deliverables of each work package by clicking on its title below. We will add information and links to deliverables over time as we address them.</p>
  <div id="deliverables-legend">
    <ol>
      <li class="planned">planned</li>
      <li class="in-progress">in-progress</li>
      <li class="completed">completed</li>
    </ol>
  </div>
  <div id="wp-accordion">
    {% for wp in site.data.workpackages %}
      <div class="card wp-card">
        <div
          id="heading-{{ forloop.index }}"
          class="wp-header"
          role="button"
        >
          <h5 class="mb-0">
            <button
              class="btn btn-link wp-btn-link collapsed"
              data-toggle="collapse"
              data-target="#collapse-{{ forloop.index }}"
              aria-expanded="false"
              aria-controls="collapse-{{ forloop.index }}"
            >
              <div class="row mx-0">
                <div class="wp-tag">WP {{ forloop.index }}</div>
                <div class="title">{{ wp.header }}</div>
              </div>
            </button>
          </h5>
        </div>
        <div
          id="collapse-{{ forloop.index }}"
          class="collapse wp-collapse"
          data-parent="#wp-accordion"
          aria-labelledby="heading-{{ forloop.index }}"
        >
          <div class="card-body wp-body">
            <div id="accordion-{{ forloop.index }}">
              <p class="wp-description">{{ wp.description }}</p>
              {% for deliverable in wp.deliverables %}
                <div class="card deliverable-card">
                  <div
                    id="heading-{{ forloop.parentloop.index }}-{{ forloop.index }}"
                    class="deliverable-header"
                    role="button"
                  >
                    <h5 class="mb-0">
                      <button
                        class="btn btn-link deliverable-btn-link collapsed"
                        data-toggle="collapse"
                        data-target="#collapse-{{ forloop.parentloop.index }}-{{ forloop.index }}"
                        aria-expanded="false"
                        aria-controls="collapse-{{ forloop.parentloop.index }}-{{ forloop.index }}"
                      >
                        <div class="row mx-0">
                          <div class="deliverable-tag {{ deliverable.status }}">
                            {{ deliverable.tag }}
                          </div>
                          <div class="title-container">
                            <div class="title">{{ deliverable.title }}</div>
                            <div class="deadline">Due: {{ deliverable.deadline }}</div>
                          </div>
                        </div>
                      </button>
                    </h5>
                  </div>
                  <div
                    id="collapse-{{ forloop.parentloop.index }}-{{ forloop.index }}"
                    class="collapse"
                    data-parent="#accordion-{{ forloop.parentloop.index }}"
                    aria-labelledby="heading-{{ forloop.parentloop.index }}-{{ forloop.index }}"
                  >
                    <div class="card-body deliverable-body">
                      {% if deliverable.authors %}
                        <div class="deliverable-authors">
                          {% for author in deliverable.authors %}
                            {{ author }}{% unless forloop.last %},{% endunless %}
                          {% endfor %}
                        </div>
                      {% endif %}
                      <p class="deliverable-description">{{ deliverable.description }}</p>
                      {% if deliverable.current %}
                        <p class="deliverable-version">
                          Most recent version: {{ deliverable.current }}
                        </p>
                      {% endif %}
                      {% if deliverable.link %}
                        <div class="deliverable-link">
                          <a href="{{ deliverable.link }}">{{ deliverable.link }}</a>
                        </div>
                      {% endif %}
                    </div>
                  </div>
                </div>
              {% endfor %}
            </div>
          </div>
        </div>
      </div>
    {% endfor %}
  </div>
</div>

<script>
  var legend = document.querySelector('#deliverables-legend');
  var buttons = document.querySelectorAll('.wp-btn-link');
  buttons.forEach((button) => {
    button.addEventListener('click', (event) => {
      var collapseTarget = document.querySelector(button.getAttribute('data-target'));
      if (collapseTarget.classList.contains('show')) {
        legend.classList.remove('visible');
      } else {
        legend.classList.add('visible');
      }
    })
  })
</script>