Merge pull request #199 from cmu-delphi/sgratzl/modes_in_nav

sgratzl · web-flow · commit 10ff8364113f · 2020-12-29T16:34:46.000+01:00
modes in navigation
diff --git a/config.toml b/config.toml
@@ -38,29 +38,49 @@ relativeURLs = false
     weight = 2
 [[menu.main]]
     parent = "covidcast"
-    name = "Map"
+    name = "Map Overview"
     url = "/covidcast"
     weight = 1
+[[menu.main]]
+    parent = "covidcast"
+    name = "Timelapse"
+    url = "/covidcast/timelapse"
+    weight = 2
+[[menu.main]]
+    parent = "covidcast"
+    name = "Top 10"
+    url = "/covidcast/top10"
+    weight = 3
+[[menu.main]]
+    parent = "covidcast"
+    name = "Single Region"
+    url = "/covidcast/single"
+    weight = 4
 [[menu.main]]
     parent = "covidcast"
     name = "Surveys"
     url = "/covidcast/surveys"
-    weight = 2
+    weight = 5
 [[menu.main]]
     parent = "covidcast"
     name = "Survey Results"
     url = "/covidcast/survey-results"
-    weight = 3
+    weight = 6
+[[menu.main]]
+    parent = "covidcast"
+    name = "Export Data"
+    url = "/covidcast/export"
+    weight = 7
 [[menu.main]]
     parent = "covidcast"
     name = "Release Log"
     url = "/covidcast/release-log"
-    weight = 4
+    weight = 8
 [[menu.main]]
     parent = "covidcast"
     name = "Terms Of Use"
     url = "/covidcast/terms-of-use"
-    weight = 5
+    weight = 9
 [[menu.main]]
     identifier = "flu"
     name = "Flu and Other Diseases"
diff --git a/content/covidcast/_index.md b/content/covidcast/_index.md
@@ -1,6 +1,10 @@
 ---
 title: COVIDcast
-layout: covidcast_app
 description: COVIDcast tracks and forecasts the spread of COVID-19. By Carnegie Mellon's Delphi Research Group.
+layout: covidcast_app
+app_mode: overview
+order: 1
+modeTitle: Map Overview
+icon: solid/map
 heroImage: /images/landing-page/hero-images/covidcast_withfill.jpg
 ---
diff --git a/content/covidcast/export.md b/content/covidcast/export.md
@@ -3,5 +3,8 @@ title: COVIDCast Export Data
 linkTitle: Export Data
 description: Use COVIDcast data in your own analysis
 layout: covidcast_app
+app_mode: export
+order: 6
+icon: solid/download
 heroImage: /images/landing-page/hero-images/covidcast_withfill.jpg
 ---
diff --git a/content/covidcast/single.md b/content/covidcast/single.md
@@ -3,5 +3,8 @@ title: COVIDCast Region Details
 linkTitle: Region Details
 description: COVIDcast tracks and forecasts the spread of COVID-19. By Carnegie Mellon's Delphi Research Group.
 layout: covidcast_app
+app_mode: single
+order: 4
+icon: location-solid
 heroImage: /images/landing-page/hero-images/covidcast_withfill.jpg
 ---
diff --git a/content/covidcast/survey-results.md b/content/covidcast/survey-results.md
@@ -4,5 +4,8 @@ linkTitle: Survey Results
 description: |
   In collaboration with Facebook Data for Good, along with a consortium of universities and public health officials, the Delphi Group at Carnegie Mellon University conducts research surveys to monitor the spread and impact of the COVID-19 pandemic in the United States. This survey is advertised through Facebook. It has run continuously since early April 2020.
 layout: covidcast_app
+app_mode: survey-results
+order: 5
+icon: solid/poll
 heroImage: /images/landing-page/hero-images/covidcast_survey.jpg
 ---
diff --git a/content/covidcast/timelapse.md b/content/covidcast/timelapse.md
@@ -3,5 +3,8 @@ title: COVIDCast Timelapse
 linkTitle: Timelapse
 description: COVIDcast tracks and forecasts the spread of COVID-19. By Carnegie Mellon's Delphi Research Group.
 layout: covidcast_app
+app_mode: timelapse
+order: 2
+icon: solid/clock
 heroImage: /images/landing-page/hero-images/covidcast_withfill.jpg
 ---
diff --git a/content/covidcast/top10.md b/content/covidcast/top10.md
@@ -3,5 +3,8 @@ title: COVIDCast Top 10
 linkTitle: Top 10
 description: COVIDcast tracks and forecasts the spread of COVID-19. By Carnegie Mellon's Delphi Research Group.
 layout: covidcast_app
+app_mode: top10
+order: 3
+icon: solid/list
 heroImage: /images/landing-page/hero-images/covidcast_withfill.jpg
 ---
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -7,7 +7,7 @@
     "highlight.js": "^10.4.1",
     "katex": "^0.12.0",
     "uikit": "^3.5.9",
-    "www-covidcast": "https://github.com/cmu-delphi/www-covidcast/releases/download/v1.12.0/www-covidcast-1.12.0.tgz"
+    "www-covidcast": "github:cmu-delphi/www-covidcast#e7f0a2c6041859683649124152bf7a17654419cb"
   },
   "devDependencies": {
     "cpx": "^1.5.0",
diff --git a/themes/delphi/assets/location-solid.svg b/themes/delphi/assets/location-solid.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="24" height="24" fill="white"/>
+<path d="M19.5 11H17.9062C17.4688 8.5 15.5 6.53125 13 6.09375V4.5C13 4.25 12.75 4 12.5 4H11.5C11.2188 4 11 4.25 11 4.5V6.09375C8.46875 6.53125 6.5 8.5 6.0625 11H4.5C4.21875 11 4 11.25 4 11.5V12.5C4 12.7812 4.21875 13 4.5 13H6.0625C6.5 15.5312 8.46875 17.5 11 17.9375V19.5C11 19.7812 11.2188 20 11.5 20H12.5C12.75 20 13 19.7812 13 19.5V17.9375C15.5 17.5 17.4688 15.5312 17.9062 13H19.5C19.75 13 20 12.7812 20 12.5V11.5C20 11.25 19.75 11 19.5 11ZM12 16C9.78125 16 8 14.2188 8 12C8 9.8125 9.78125 8 12 8C14.1875 8 16 9.8125 16 12C16 14.2188 14.1875 16 12 16ZM12 9.25C10.4688 9.25 9.25 10.5 9.25 12C9.25 13.5312 10.4688 14.75 12 14.75C13.5 14.75 14.75 13.5312 14.75 12C14.75 10.5 13.5 9.25 12 9.25Z" fill="black"/>
+</svg>
diff --git a/themes/delphi/layouts/_default/baseof.html b/themes/delphi/layouts/_default/baseof.html
@@ -8,7 +8,7 @@
   </head>
   <body class="{{ block "body_class" . }}{{ end }}">
     {{ partial "nav.html" . }}
-    {{ block "breadcrumb" . }}{{ partial "menu/breadcrumb.html" . }}{{ end }}
+    {{ partial "menu/breadcrumb.html" . }}
     {{ block "main" . }} {{ end }}
     {{ partial "footer.html" . }}
     {{ partial "scripts.html" . }}
diff --git a/themes/delphi/layouts/_default/covidcast_app.html b/themes/delphi/layouts/_default/covidcast_app.html
@@ -7,9 +7,9 @@
   <script src="{{ "./covidcast/styles.js" | relURL }}"></script>
   <script src="{{ "./covidcast/bundle.js" | relURL }}"></script>
 {{ end }}
-{{ define "breadcrumb" }}<!--no breadcrumb -->{{ end }}
 {{ define "body_class" }}covidcast_wrapper{{ end }}
 {{ define "main" }}
+  {{ partial "covidcast/modes.html" . }}
   <div id="vizbox">
     <div class="ie-banner" style="display: none">
       <div>
diff --git a/themes/delphi/layouts/partials/covidcast/get-modes.html b/themes/delphi/layouts/partials/covidcast/get-modes.html
@@ -0,0 +1,5 @@
+{{- $mainPage := $.GetPage "/covidcast" -}}
+{{- $pages := where $mainPage.Pages ".Params.layout" "eq" "covidcast_app" -}}
+{{- $pages = append (slice $mainPage) $pages -}}
+{{- $pages = sort $pages ".Params.order" -}}
+{{- return $pages -}}
diff --git a/themes/delphi/layouts/partials/covidcast/modes.html b/themes/delphi/layouts/partials/covidcast/modes.html
@@ -0,0 +1,18 @@
+<div class="uk-visible@s covidcast-modes">
+  <div class="uk-container uk-margin-remove-vertical">
+    {{ $currentPage := . }}
+    <ul class="uk-tab">
+      {{ range (partial "covidcast/get-modes.html" .) }}
+        <li
+          data-mode="{{ .Params.app_mode }}"
+          class="covidcast-mode {{ if eq $currentPage.Permalink .Permalink }}uk-active{{ end }}"
+        >
+          <a href="{{ .RelPermalink }}">
+            {{ partial "font-awesome.html" .Params.icon }}
+            {{ .Params.modeTitle | default .LinkTitle }}
+          </a>
+        </li>
+      {{ end }}
+    </ul>
+  </div>
+</div>
diff --git a/themes/delphi/layouts/partials/font-awesome.html b/themes/delphi/layouts/partials/font-awesome.html
@@ -1,3 +1,10 @@
 <span class="inline-svg-icon">
-  {{ readFile (print "./node_modules/@fortawesome/fontawesome-free/svgs/" . ".svg" ) | safeHTML }}
+  {{- $fileName := (print . ".svg" ) -}}
+  {{- $faPath := path.Join "./node_modules/@fortawesome/fontawesome-free/svgs/" $fileName -}}
+  {{- $localPath := path.Join "./themes/delphi/assets/" $fileName -}}
+  {{- if fileExists $localPath -}}
+    {{ readFile $localPath | safeHTML }}
+    {{- else -}}
+    {{ readFile $faPath | safeHTML }}
+  {{- end -}}
 </span>
