httparchive.org/src/js/techreport/section.js at 9d68f1beb8f7fba09b772c2d71e0b314c7541d6d · HTTPArchive/httparchive.org · 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
/* global Timeseries, GeoBreakdown, CwvDistribution */

import SummaryCard from "./summaryCards";
import TableLinked from "./tableLinked";

class Section {
  constructor(id, pageConfig, globalConfig, filters, data) {
    this.id = id;
    this.data = data;
    this.pageConfig = pageConfig;
    this.config = globalConfig;
    this.pageFilters = filters;
    this.components = {};

    this.initializeComponents();
  }

  initializeComponents() {
    const section = document.getElementById(this.id);

    // Initialize components
    section.querySelectorAll('[data-component]').forEach(component => {
      switch(component.dataset.component) {
        case "timeseries":
          this.initializeTimeseries(component);
          break;

        case "summaryCard":
          this.initializeSummaryCards(component);
          break;

        case "table":
          this.initializeTable(component);
          break;

        case "geoBreakdown":
          this.initializeGeoBreakdown(component);
          break;

        case "cwvDistribution":
          this.initializeCwvDistribution(component);
          break;

        default:
          break;
      }
    });
  }

  initializeTable(component) {
    this.components[component.dataset.id] = new TableLinked(
      component.dataset.id,
      this.pageConfig,
      this.config,
      this.pageFilters,
      this.data
    );
  }

  initializeSummaryCards(component) {
    this.components[component.dataset.id] = new SummaryCard(
      component.dataset.id,
      this.pageConfig,
      this.config,
      this.pageFilters,
      this.data
    );
  }

  initializeTimeseries(component) {
    this.components[component.dataset.id] = new Timeseries(
      component.dataset.id,
      this.pageConfig,
      this.config,
      this.pageFilters,
      this.data
    );
  }

  initializeGeoBreakdown(component) {
    this.components[component.dataset.id] = new GeoBreakdown(
      component.dataset.id,
      this.pageConfig,
      this.config,
      this.pageFilters,
      this.data
    );
  }

  initializeCwvDistribution(component) {
    this.components[component.dataset.id] = new CwvDistribution(
      component.dataset.id,
      this.pageConfig,
      this.config,
      this.pageFilters,
      this.data
    );
  }

  updateSection(content) {
    Object.values(this.components).forEach(component => {
      if(component.data !== this.data) {
        component.data = this.data;
      }
      if(component.pageFilters !== this.pageFilters) {
        component.pageFilters = this.pageFilters;
      }
      component.updateContent(content);
    });
  }
}

window.Section = Section;