Skip to content

Commit

Permalink
Merge pull request #1090 from 18F/nl-ga4-review
Browse files Browse the repository at this point in the history 
GA4 copy changes to front end
  • Loading branch information
@scottqueen-bixal
scottqueen-bixal authored Dec 29, 2023
2 parents ffdbe20 + 9fddeae commit 2d65761
Show file tree
Hide file tree
Showing 58 changed files with 369,166 additions and 481 deletions.
2 changes: 1 addition & 1 deletion _config.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ twitter: usgsa

# Site wide error message
site_wide_error:
display: true
display: false
title: "Analytics.usa.gov is migrating to a new web analytics platform."
body: "Real time data is currently unavailable."
sass:
Expand Down
3 changes: 1 addition & 2 deletions _development.yml
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@

url: http://localhost:4000

# Use production data by default.
# To pull from dev data for home page, uncomment:
# data_url: http://localhost:4000/fake-data
# data_url: http://localhost:4000/ga4-data
269 changes: 8 additions & 261 deletions _includes/charts.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
{% assign data_prefix = page.slug %}
{% assign entity = "agency" %}
{% endif %}

<!--
JavaScript block hooks look for any element with both data-block and
data-source attributes:
Expand All @@ -20,270 +21,16 @@
</table>
</section>
-->

<div class="grid-row">
<div id="main_data" class="grid-col-8">
<section
id="realtime"
data-block="realtime"
data-source="{{ site.data_url }}/{{ data_prefix }}/realtime.json"
data-refresh="15"
>
<h2 id="current_visitors">...</h2>
<div class="chart_subtitle">
people on government websites <br />
and apps in last 30 minutes
</div>
</section>

<section class="section_headline visits_today">
<h3>Sessions Today</h3>
<h4>Eastern Time</h4>
</section>
<section
id="time_series"
data-block="today"
data-source="{{ site.data_url }}/{{ data_prefix }}/today.json"
data-refresh="15"
>
<svg class="data time-series"></svg>
</section>

<section class="section_headline">
<h3>Sessions in the Past 90 Days</h3>
</section>

<section class="section_subheadline">
There were <span id="total_visitors" class="data">...</span> sessions over
the past 90 days.
</section>

<section
id="devices"
class="three_column"
data-block="devices"
data-source="{{ site.data_url }}/{{ data_prefix }}/devices.json"
>
<h4>Devices</h4>
<figure id="chart_device_types">
<div class="data bar-chart"></div>
</figure>

<p>
Based on rough network segmentation data, we estimate that
<strong>less than 5%</strong> of all traffic across all agencies comes
from US federal government networks.
</p>

<p>
Much more detailed data is available in
<strong><a href="data/">downloadable CSV and JSON</a></strong
>. This includes data on combined browser and OS usage.
</p>
</section>

<section id="browsers" class="three_column">
<h4>Browsers</h4>

<figure
id="chart_browsers"
data-block="browsers"
data-source="{{ site.data_url }}/{{ data_prefix }}/browsers.json"
>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_ie"
class="hide"
data-block="ie"
data-source="{{ site.data_url }}/{{ data_prefix }}/ie.json"
data-scale-to-parent="true"
>
<h4>Internet Explorer</h4>
<div class="data bar-chart"></div>
</figure>
</section>

<section id="operating_systems" class="three_column">
<h4>Operating Systems</h4>

<figure
id="chart_os"
data-block="os"
data-source="{{ site.data_url }}/{{ data_prefix }}/os.json"
>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_windows"
class="hide"
data-block="windows"
data-source="{{ site.data_url }}/{{ data_prefix }}/windows.json"
data-scale-to-parent="true"
>
<h4>Windows</h4>
<div class="data bar-chart"></div>
</figure>
</section>

<!-- forces section to wrap, couldn't find a better way -->
<div style="clear: both"></div>

<section class="section_headline">
<h3>User Locations In The Last 30 Minutes</h3>
</section>

<section
id="cities"
class="three_column"
data-block="cities"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-cities-realtime.json"
>
<h4>Cities</h4>
<figure id="chart_top-cities-90-days">
<div class="data bar-chart"></div>
</figure>
</section>

<section id="countries" class="three_column">
<h4>Countries</h4>

<figure
id="chart_us"
data-block="countries"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_us_and_territories"
class="hide"
data-block="us_and_territories"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<h4>United States &amp; Territories</h4>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_countries"
class="hide"
data-block="international_visits"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<h4>International</h4>
<div class="data bar-chart"></div>
</figure>
</section>
{% include charts/sessions-today.html data_prefix=data_prefix %}
{% include charts/sessions-90-days.html data_prefix=data_prefix %}
{% include charts/locations.html data_prefix=data_prefix %}
</div>

<div id="secondary_data" class="grid-col-4">
<section id="top_100_table">
<!-- see: http://heydonworks.com/practical_aria_examples/ -->
<h3>Top <span id="top_table_type">Web Pages and App Screens</span></h3>
<ul class="pills" role="tablist">
<li>
<a
role="tab"
data-type="Web Pages and App Screens"
aria-selected="true"
href="#top-pages-realtime"
class="site-nav"
>Now</a
>
</li>
<li>
<a
role="tab"
data-type="Hostnames"
href="#top-pages-7-days"
class="site-nav"
>7 Days</a
>
</li>
<li>
<a
role="tab"
data-type="Hostnames"
href="#top-pages-30-days"
class="site-nav"
>30 Days</a
>
</li>
</ul>

<figure
class="top-pages"
id="top-pages-realtime"
role="tabpanel"
data-block="top-pages-realtime"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-pages-realtime.json"
data-refresh="15"
>
<h5>
<em>
People on a <strong>single, specific page or app screen</strong> in
the last 30 minutes. We only count pages with at least 10 people on
the page.
<a href="{{ site.data_url }}/{{ data_prefix }}/all-pages-realtime.csv"
>Download the full dataset.</a
>
</em>
</h5>
<div class="data bar-chart"></div>
</figure>

<figure
class="top-pages"
id="top-pages-7-days"
role="tabpanel"
data-block="top-pages"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-domains-7-days.json"
>
<h5>
<em
>Sessions over the last week to <strong>hostnames</strong>, including
traffic to all web pages and app screens within that hostname.</em
>
</h5>
<div class="data bar-chart"></div>
</figure>

<figure
class="top-pages"
id="top-pages-30-days"
role="tabpanel"
data-block="top-pages"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-domains-30-days.json"
>
<h5>
<em>
Sessions over the last month to <strong>hostnames</strong>, including
traffic to all web pages and app screens within that hostname. {% if
entity == "government" %}We only count pages and app screens with at
least 1,000 sessions in the last month.{% endif %}
<a
href="{{ site.data_url }}/{{ data_prefix }}/all-domains-30-days.csv"
>Download the full dataset.</a
>
</em>
</h5>
<div class="data bar-chart"></div>
</figure>
</section>

<section id="top_downloads_table">
<h3>Top Downloads</h3>
<h5><em>Total file downloads yesterday on {{ entity }} hostnames.</em></h5>
<figure
id="top-downloads"
data-block="top-downloads"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-downloads-yesterday.json"
>
<div class="data bar-chart"></div>
</figure>
</section>
{% include charts/top-pages.html data_prefix=data_prefix %}
{% include charts/top-downloads.html data_prefix=data_prefix %}
</div>
</div>
51 changes: 51 additions & 0 deletions _includes/charts/locations.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
<section class="locations" id="locations">
<section class="section_headline">
<h3>User Locations In The Last 30 Minutes</h3>
</section>

<div class="columns columns--thirds">
<section
id="cities"
class="padding-3"
data-block="cities"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-cities-realtime.json"
>
<h4>Cities</h4>
<figure id="chart_top-cities-90-days">
<div class="data bar-chart"></div>
</figure>
</section>

<section id="countries" class="padding-3">
<h4>Countries</h4>

<figure
id="chart_us"
data-block="countries"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_us_and_territories"
class="hide"
data-block="us_and_territories"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<h4>United States &amp; Territories</h4>
<div class="data bar-chart"></div>
</figure>

<figure
id="chart_countries"
class="hide"
data-block="international_visits"
data-source="{{ site.data_url }}/{{ data_prefix }}/top-countries-realtime.json"
>
<h4>International</h4>
<div class="data bar-chart"></div>
</figure>
</section>
</div>
</section>
Loading

0 comments on commit 2d65761

Please sign in to comment.