Merge pull request #91 from DOI-USGS/switch_to_GTM

Switch to gtm
DOI-USGS · Jun 8, 2023 · 9922774 · 9922774
2 parents 63b6ddf + d237b43
commit 9922774
Show file tree

Hide file tree

Showing 4 changed files with 74 additions and 52 deletions.
diff --git a/public/index.html b/public/index.html
@@ -1,40 +1,38 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <!-- Global site tag (gtag.js) - Google Analytics -->
-    <script async src="https://www.googletagmanager.com/gtag/js?id=G-MK065DF5XP"></script>
-    <script>
-      window.dataLayer = window.dataLayer || [];
-      function gtag(){dataLayer.push(arguments);}
-      gtag('js', new Date());
-
-      gtag('config', 'G-MK065DF5XP');
-    </script>
+    <!-- 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-TK9VPXK');</script>
+    <!-- End Google Tag Manager -->
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <%= process.env.VUE_APP_TIER !== '' ? '<meta name="robots" content="noindex,nofollow">' : '' %><!-- an empty string in this case means the 'prod' version of the application   -->
-      <!-- Primary Meta Tags -->
-      <title>
-        <%= VUE_APP_TIER %>
-          <%= VUE_APP_TITLE %>
-      </title>
-      <meta name="title" content="U.S. Groundwater Conditions">
-      <meta name="description" content="The low down on flow down low">
-      <!-- Open Graph / Facebook -->
-      <meta property="og:type" content="website">
-      <meta property="og:url" content="https://labs.waterdata.usgs.gov/visualizations/gw-conditions/index.html#/">
-      <meta property="og:title" content="U.S. Groundwater Conditions">
-      <meta property="og:description" content="The low down on flow down low">
-      <meta property="og:image" content="https://labs.waterdata.usgs.gov/visualizations/thumbnails/gw-conditions-og-peaks.png">
-      <!-- Twitter -->
-      <meta property="twitter:card" content="summary_large_image">
-      <meta property="twitter:url" content="https://labs.waterdata.usgs.gov/visualizations/gw-conditions/index.html#/">
-      <meta property="twitter:title" content="U.S. Groundwater Conditions">
-      <meta property="twitter:description" content="The low down on flow down low">
-      <meta property="twitter:image" content="https://labs.waterdata.usgs.gov/visualizations/thumbnails/gw-conditions-og-peaks.png">
+    <!-- Primary Meta Tags -->
+    <title>
+      <%= VUE_APP_TIER %>
+        <%= VUE_APP_TITLE %>
+    </title>
+    <meta name="title" content="U.S. Groundwater Conditions">
+    <meta name="description" content="The low down on flow down low">
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://labs.waterdata.usgs.gov/visualizations/gw-conditions/index.html#/">
+    <meta property="og:title" content="U.S. Groundwater Conditions">
+    <meta property="og:description" content="The low down on flow down low">
+    <meta property="og:image" content="https://labs.waterdata.usgs.gov/visualizations/thumbnails/gw-conditions-og-peaks.png">
+    <!-- Twitter -->
+    <meta property="twitter:card" content="summary_large_image">
+    <meta property="twitter:url" content="https://labs.waterdata.usgs.gov/visualizations/gw-conditions/index.html#/">
+    <meta property="twitter:title" content="U.S. Groundwater Conditions">
+    <meta property="twitter:description" content="The low down on flow down low">
+    <meta property="twitter:image" content="https://labs.waterdata.usgs.gov/visualizations/thumbnails/gw-conditions-og-peaks.png">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-<script type='application/ld+json'>
+    <script type='application/ld+json'>
       { "@context": "http://www.schema.org",
         "@type": "WebSite", "name": "U.S. Groundwater Conditions",
         "url": "https://labs.waterdata.usgs.gov/visualizations/gw-conditions/index.html#/",
@@ -64,6 +62,10 @@
     </script>
   </head>
   <body>
+    <!-- Google Tag Manager (noscript) -->
+    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TK9VPXK"
+    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+    <!-- End Google Tag Manager (noscript) -->
     <noscript>
       <strong>We're sorry but this application doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>

diff --git a/src/components/Authorship.vue b/src/components/Authorship.vue
@@ -1,53 +1,73 @@
 <template>
-  <div id="author-container" v-if="showAuthors">
+  <div
+    v-if="showAuthors"
+    id="author-container"
+  >
     <p>
       <span id="primary-author-statment">
         The development of {{ appTitle }} was led by 
         <span
           v-for="(author, index) in primaryAuthors" 
-          :key="`${author.initials}-attribution`"
           :id="`initial-${author.initials}`"
+          :key="`${author.initials}-attribution`"
           :class="'author first'"
         >
-          <a v-bind:href="author.profile_link" target="_blank" v-text="author.fullName"></a>
+          <a
+            :href="author.profile_link"
+            target="_blank"
+            v-text="author.fullName"
+          />
           <span v-if="index != Object.keys(primaryAuthors).length - 1 && Object.keys(primaryAuthors).length > 2">, </span>
           <span v-if="index == Object.keys(primaryAuthors).length - 2"> and </span>
         </span>.
       </span>
-      <span id="additional-author-statement" v-if="showAdditionalAuthors">
+      <span
+        v-if="showAdditionalAuthors"
+        id="additional-author-statement"
+      >
         <span
           v-for="(author, index) in additionalAuthors" 
-          :key="`${author.initials}-attribution`"
           :id="`author-${author.initials}`"
+          :key="`${author.initials}-attribution`"
           :class="'author'"
         >
-          <a v-bind:href="author.profile_link" target="_blank" v-text="author.fullName"></a>
+          <a
+            :href="author.profile_link"
+            target="_blank"
+            v-text="author.fullName"
+          />
           <span v-if="index != Object.keys(additionalAuthors).length - 1 && Object.keys(additionalAuthors).length > 2">, </span>
           <span v-if="index == Object.keys(additionalAuthors).length - 2"> and </span>
         </span>
         <span>
-        also contributed to the site.
+          also contributed to the site.
         </span>
       </span>
-      <span id="contribution-statements" v-if="showContributionStatements">
+      <span
+        v-if="showContributionStatements"
+        id="contribution-statements"
+      >
         <span id="primary-author-contribution">
           <span
             v-for="author in primaryAuthors" 
-            :key="`${author.initials}-contribution`"
             :id="`author-${author.initials}`"
+            :key="`${author.initials}-contribution`"
             :class="'author'"
           >
-            <span v-text="author.firstName"> </span> <span v-text="author.contribution"></span>. 
+            <span v-text="author.firstName" /> <span v-text="author.contribution" />. 
           </span>
         </span>
-        <span id="additional-author-contribution"  v-if="showAditionalContributionStatement">
+        <span
+          v-if="showAditionalContributionStatement"
+          id="additional-author-contribution"
+        >
           <span
             v-for="author in additionalAuthors" 
-            :key="`${author.initials}-contribution`"
             :id="`author-${author.initials}`"
+            :key="`${author.initials}-contribution`"
             :class="'author'"
           >
-            <span v-text="author.firstName"> </span> <span v-text="author.contribution"></span>. 
+            <span v-text="author.firstName" /> <span v-text="author.contribution" />. 
           </span>
         </span>
       </span>
@@ -59,7 +79,7 @@
 import { isMobile } from 'mobile-device-detect';
 import authors from "@/assets/text/authors";
 export default {
-  name: "authorship",
+  name: "Authorship",
     components: {
     },
     props: {

diff --git a/src/components/GWL.vue b/src/components/GWL.vue
@@ -14,13 +14,13 @@
       <!--   <caption id="caption-gwl">Daily groundwater levels</caption> -->
       </div>
       <div id="map-container">
-          <GWLmap
-            id="map_gwl"
-            class="map"
-          />
-          <mapLabels 
-            class="map labels"
-          />
+        <GWLmap
+          id="map_gwl"
+          class="map"
+        />
+        <mapLabels 
+          class="map labels"
+        />
       </div>
       <div id="legend-container">
         <Legend />
@@ -107,7 +107,7 @@
         <h4>
           Page development
         </h4>
-        <authorship class="text-content"/>
+        <authorship class="text-content" />
         <br>
         <hr>
         <img

diff --git a/src/main.js b/src/main.js
@@ -20,7 +20,7 @@ const vueImgConfig = {
   altAsTitle: true
 }
 
-Vue.component("font-awesome-icon", FontAwesomeIcon);
+Vue.component("FontAwesomeIcon", FontAwesomeIcon);
 
 // social icons
 library.add(faTwitterSquare);