language-map/index.html at master · Language-Mapping/language-map · 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
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Google Tag Manager -->
    <script>
      ;(function (w, d, s, l, i) {
        w[l] = w[l] || []
        w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' })
        var f = d.getElementsByTagName(s)[0],
          j = d.createElement(s),
          dl = l != 'dataLayer' ? '&l=' + l : ''
        j.async = true
        j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl
        f.parentNode.insertBefore(j, f)
      })(window, document, 'script', 'dataLayer', 'GTM-WXN8VVC')
    </script>
    <!-- End Google Tag Manager -->
    <meta charset="utf-8" />
    <!-- CRED: favicon stuff: https://realfavicongenerator.net/ -->
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=2.1">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=2.1">
    <link rel="icon" href="/favicon.ico?v=2.1" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#ffffff" />
    <meta name="apple-mobile-web-app-title" content="Languages of NYC">
    <meta name="application-name" content="Languages of NYC">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta
      name="description"
      content="An interactive language diversity map of New York City"
    />
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=2.2">
    <meta property="og:title" content="Languages of New York City Map" />
    <meta property="og:site_name" content="Languages of New York City Map" />
    <meta property="og:url" content="https://languagemap.nyc/" />
    <meta
      property="og:description"
      content="An interactive map of language diversity in New York City, one of the world’s most linguistically diverse metropolitan areas."
    />
    <meta property="og:type" content="website" />
    <meta
      property="og:image"
      content="https://raw.githubusercontent.com/Language-Mapping/config/master/img/fb.png"
    />
    <meta name="twitter:title" content="Languages of New York City Map" />
    <meta
      name="twitter:description"
      content="An interactive map of language diversity in New York City, one of the world’s most linguistically diverse metropolitan areas."
    />
    <meta
      name="twitter:image"
      content="https://raw.githubusercontent.com/Language-Mapping/config/master/img/twitter.png"
    />
    <meta name="twitter:card" content="summary_large_image" />
    <!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
    <link rel="manifest" href="/manifest.json?v=2.1" />
    <link rel="mask-icon" href="/safari-pinned-tab.svg?v=2.1" color="#379587">
    <title>Languages of New York City</title>
  </head>
  <body>
    <!-- Google Tag Manager (noscript) -->
    <noscript
      ><iframe
        src="https://www.googletagmanager.com/ns.html?id=GTM-WXN8VVC"
        height="0"
        width="0"
        style="display: none; visibility: hidden"
      ></iframe
    ></noscript>
    <!-- End Google Tag Manager (noscript) -->
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script type="module" src="/src/index.tsx"></script>
  </body>
  <script>
    const earlyAccessPath = 'https://fonts.googleapis.com/earlyaccess/'

    // CAREFUL: the lists below are maintained in two files:
    // 1) index.html
    // 2) fonts.ts
    // ...because we can't do an `import` in index.html.
    WebFontConfig = {
      // CRED: https://stackoverflow.com/a/50073148/1048518
      custom: {
        // NOTE: order is intentional! Top-to-bottom is most to least likely to
        // be viewed. They will all load eventually but this just reduces the
        // chance of FOUT in case the user starts from an individual Details
        // route with one of the languages using these fonts.
        families: [
          'Noto Sans Myanmar',
          'Noto Sans Sinhala',
          'Noto Sans Syloti Nagri',
          'Noto Sans Coptic',
          'Noto Sans Tifinagh',
          'Noto Sans Vai',
          'Noto Sans Limbu',
          'Noto Sans Syriac Estrangela',
          'Noto Sans Meetei Mayek',
          'Noto Sans Thaana',
          'Noto Sans Buginese',
          'Noto Sans Ol Chiki',
        ],
        urls: [
          `${earlyAccessPath}notosansmyanmar.css`,
          `${earlyAccessPath}notosanssinhala.css`,
          `${earlyAccessPath}notosanssylotinagri.css`,
          `${earlyAccessPath}notosanscoptic.css`,
          `${earlyAccessPath}notosanstifinagh.css`,
          `${earlyAccessPath}notosansvai.css`,
          `${earlyAccessPath}notosanslimbu.css`,
          `${earlyAccessPath}notosanssyriacestrangela.css`,
          `${earlyAccessPath}notosansmeeteimayek.css`,
          `${earlyAccessPath}notosansthaana.css`,
          `${earlyAccessPath}notosansbuginese.css`,
          `${earlyAccessPath}notosansolchiki.css`,
        ],
      },
    }

    // Load it async. Yes the webloader is redundant with the `webfontloader`
    // module, but this is an async attempt to load these extra fonts after the
    // two base ones (Noto Sans and Gentium have already loaded).
    ;(function (d) {
      const wf = d.createElement('script')
      const $scriptElem = d.scripts[0]

      wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js'
      wf.async = true
      $scriptElem.parentNode.insertBefore(wf, $scriptElem)
    })(document)
  </script>
</html>