From 9d4ebf38a7d464af4d5acc825be048917d6f9b82 Mon Sep 17 00:00:00 2001 From: R Fultz Date: Sat, 15 Oct 2022 03:48:05 -0400 Subject: [PATCH 01/22] Changed file names --- ... tabpanel-contributions-across-time.jinja} | 43 +++++-------------- ...s => house-senate-overview-across-time.js} | 0 2 files changed, 11 insertions(+), 32 deletions(-) rename fec/data/templates/partials/house-senate-overview/{election-data.jinja => tabpanel-contributions-across-time.jinja} (83%) rename fec/fec/static/js/pages/{elections-overview.js => house-senate-overview-across-time.js} (100%) diff --git a/fec/data/templates/partials/house-senate-overview/election-data.jinja b/fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja similarity index 83% rename from fec/data/templates/partials/house-senate-overview/election-data.jinja rename to fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja index f7399fff50..b6a229058f 100644 --- a/fec/data/templates/partials/house-senate-overview/election-data.jinja +++ b/fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja @@ -1,36 +1,15 @@ +{# used inside fec/data/templates/house-senate-overview.jinja #} {% import 'macros/null.jinja' as null %} {% import 'macros/disclaimer.jinja' as disclaimer %} {% import 'macros/cycle-select.jinja' as select %} + - \ No newline at end of file diff --git a/fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja b/fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja deleted file mode 100644 index b6a229058f..0000000000 --- a/fec/data/templates/partials/house-senate-overview/tabpanel-contributions-across-time.jinja +++ /dev/null @@ -1,173 +0,0 @@ -{# used inside fec/data/templates/house-senate-overview.jinja #} -{% import 'macros/null.jinja' as null %} -{% import 'macros/disclaimer.jinja' as disclaimer %} -{% import 'macros/cycle-select.jinja' as select %} - - - - \ No newline at end of file diff --git a/fec/data/templates/partials/house-senate-overview/tabpanel-summary.jinja b/fec/data/templates/partials/house-senate-overview/tabpanel-summary.jinja deleted file mode 100644 index 66b11a1ffb..0000000000 --- a/fec/data/templates/partials/house-senate-overview/tabpanel-summary.jinja +++ /dev/null @@ -1,68 +0,0 @@ -{# used inside fec/data/templates/house-senate-overview.jinja #} -{% import 'macros/null.jinja' as null %} -{% import 'macros/disclaimer.jinja' as disclaimer %} -{% import 'macros/cycle-select.jinja' as select %} - - diff --git a/fec/fec/static/js/pages/house-senate-overview-summary.js b/fec/fec/static/js/pages/house-senate-overview-summary.js index 169389fd75..7173b87f2b 100644 --- a/fec/fec/static/js/pages/house-senate-overview-summary.js +++ b/fec/fec/static/js/pages/house-senate-overview-summary.js @@ -7,7 +7,7 @@ import { PartyMoneyBars } from '../modules/party-money-bars'; * @class * @property {HTMLInputElement} cycleSelector - the */ -function HSOverviewSummaryTab() { +function HSOverviewSummary() { this.tabPanel = document.querySelector('#election-summary'); this.cycleSelector = document.querySelector('#election-summary .js-period-select'); @@ -18,10 +18,10 @@ function HSOverviewSummaryTab() { /** * Gets this instance built and working */ -HSOverviewSummaryTab.prototype.init = function() { +HSOverviewSummary.prototype.init = function() { this.cycleSelector.addEventListener('change', this.handleCycleChange.bind(this)); - const theFigures = document.querySelectorAll('#section-election-summary figure'); + const theFigures = document.querySelectorAll('#election-summary figure'); theFigures.forEach(el => { // const elId = el.id; new PartyMoneyBars( @@ -40,7 +40,7 @@ HSOverviewSummaryTab.prototype.init = function() { * Takes an election year, deactivates cycleSelect, and starts the data load * @param {number|string} electionYear - Which election year / cycle to load */ - HSOverviewSummaryTab.prototype.startLoadingData = function(electionYear) { + HSOverviewSummary.prototype.startLoadingData = function(electionYear) { // Only do anything if electionYear is an year between 1970 and 2050 if (parseInt(electionYear) && electionYear >= 1970 && electionYear <= 2050 && electionYear % 2 === 0) { this.deactivateInput(); @@ -84,7 +84,7 @@ HSOverviewSummaryTab.prototype.init = function() { /** * Removes functionality from the input/select assigned to this.cycleSelector */ -HSOverviewSummaryTab.prototype.deactivateInput = function () { +HSOverviewSummary.prototype.deactivateInput = function () { this.cycleSelector.setAttribute('aria-disabled', 'true'); this.cycleSelector.setAttribute('disabled', 'true'); }; @@ -92,7 +92,7 @@ HSOverviewSummaryTab.prototype.deactivateInput = function () { /** * Restores functionality from the input/select assigned to this.cycleSelector */ -HSOverviewSummaryTab.prototype.reactivateInput = function () { +HSOverviewSummary.prototype.reactivateInput = function () { this.cycleSelector.removeAttribute('aria-disabled'); this.cycleSelector.removeAttribute('disabled'); }; @@ -102,7 +102,7 @@ HSOverviewSummaryTab.prototype.reactivateInput = function () { * @param {Event} e - Change event * @param {number} e.target.value - A valid 4-digit integer for an even/election year */ -HSOverviewSummaryTab.prototype.handleCycleChange = function (e) { +HSOverviewSummary.prototype.handleCycleChange = function (e) { this.startLoadingData(e.target.value); }; @@ -111,7 +111,7 @@ HSOverviewSummaryTab.prototype.handleCycleChange = function (e) { * (Takes [{dem numbers}, {rep numbers}, {other numbers}] and converts to [{receipts: {total, dem numbers, rep numbers, other numbers}}]) * @param {object} results - response.results from the api */ -HSOverviewSummaryTab.prototype.handleDataLoaded = function(results) { +HSOverviewSummary.prototype.handleDataLoaded = function(results) { const usefulResults = { total_cash_on_hand_end_period: { total: 0, DEM: 0, REP: 0, Other: 0 }, total_debts_owed_by_committee: { total: 0, DEM: 0, REP: 0, Other: 0 }, @@ -153,7 +153,7 @@ HSOverviewSummaryTab.prototype.handleDataLoaded = function(results) { * Now let's wait for the page to load and start making elements work */ window.addEventListener('load', () => { - new HSOverviewSummaryTab(); + new HSOverviewSummary(); }); -module.exports = { HSOverviewSummaryTab }; +module.exports = { HSOverviewSummary }; From 93ada914060304d0e236f11cf90b1bd68ab245f2 Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:02:14 -0500 Subject: [PATCH 14/22] Apply cq classes to election-summary --- .../js/pages/house-senate-overview-summary.js | 3 +++ .../scss/widgets/house-senate-overview.scss | 19 +++++++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/fec/fec/static/js/pages/house-senate-overview-summary.js b/fec/fec/static/js/pages/house-senate-overview-summary.js index 7173b87f2b..4b7bdddb05 100644 --- a/fec/fec/static/js/pages/house-senate-overview-summary.js +++ b/fec/fec/static/js/pages/house-senate-overview-summary.js @@ -1,6 +1,7 @@ // import { PartyMoneyBars } from '../modules/party-money-bars'; +import { FECContainerQuery } from '../modules/container-queries'; /** * Runs the Summary tab at /data/elections/house/ and /data/elections/senate/ @@ -34,6 +35,8 @@ HSOverviewSummary.prototype.init = function() { } ); }); + + new FECContainerQuery('#election-summary', '#summary'); }; /** diff --git a/fec/fec/static/scss/widgets/house-senate-overview.scss b/fec/fec/static/scss/widgets/house-senate-overview.scss index 7c16592613..f1fa13f7ef 100644 --- a/fec/fec/static/scss/widgets/house-senate-overview.scss +++ b/fec/fec/static/scss/widgets/house-senate-overview.scss @@ -130,3 +130,22 @@ meter:-moz-meter-optimum::-moz-meter-bar { width: auto !important; } } + +#election-summary { + &.cq-xs { + .cycle-select { + width: auto; + } + .grid--flex .grid__item { + width: 100%; + } + } + &.cq-s { + .cycle-select { + width: auto; + } + .grid--flex .grid__item { + width: 100%; + } + } +} From 8a77d38641d712536d2678867d20a3865836f287 Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:02:21 -0500 Subject: [PATCH 15/22] css tweak --- fec/fec/static/scss/widgets/party-money-bars.scss | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/fec/fec/static/scss/widgets/party-money-bars.scss b/fec/fec/static/scss/widgets/party-money-bars.scss index 91aefe43f2..bfa6c39d76 100644 --- a/fec/fec/static/scss/widgets/party-money-bars.scss +++ b/fec/fec/static/scss/widgets/party-money-bars.scss @@ -131,6 +131,13 @@ $fontWeightBold: 700; background: $colorBarDef; transition: all 1s; } + &:before { + content: ""; + display: block; + height: 20px; + position: absolute; + border-right: thin solid $colorBarDef; + } &[data-party='DEM'] { &::-webkit-meter-optimum-value { // note#1 @@ -142,6 +149,9 @@ $fontWeightBold: 700; background: $colorBarDem; transition: all 1s; } + &:before { + border-right-color: $colorBarDem; + } } &[data-party='REP'] { &::-webkit-meter-optimum-value { @@ -154,6 +164,9 @@ $fontWeightBold: 700; background: $colorBarRep; transition: all 1s; } + &:before { + border-right-color: $colorBarRep; + } } } // Trying to get the widths to animate when the values change From e95ea76d5593cfc80baf0aa4a34768ce65e8d5ff Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:02:48 -0500 Subject: [PATCH 16/22] Add new breadcrumbs for house & senate election overview pages --- fec/data/templates/macros/page-header.jinja | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/fec/data/templates/macros/page-header.jinja b/fec/data/templates/macros/page-header.jinja index ba8e7a48a6..91f8483a8f 100644 --- a/fec/data/templates/macros/page-header.jinja +++ b/fec/data/templates/macros/page-header.jinja @@ -28,6 +28,19 @@ › {{ links }} + {% elif 'U.S. House elections' in title or 'U.S. Senate elections' in title %} +
  • + › + Campaign finance data +
    • +
  • + › + Find candidates and elections +
    • +
  • + › + {{ title }} +
    • {% else %} {% if title != 'Campaign finance data' %}
  • From 8ec294aaf4c1b3dc5c1e93178ce5c1aa6c9ba03a Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:04:08 -0500 Subject: [PATCH 17/22] Adjust election overview section dom --- .../templates/house-senate-overview.jinja | 68 +++++++++---------- 1 file changed, 33 insertions(+), 35 deletions(-) diff --git a/fec/data/templates/house-senate-overview.jinja b/fec/data/templates/house-senate-overview.jinja index 2a69a0d398..08397cdb0e 100644 --- a/fec/data/templates/house-senate-overview.jinja +++ b/fec/data/templates/house-senate-overview.jinja @@ -1,7 +1,6 @@ {% extends 'layouts/main.jinja' %} {% import 'macros/page-header.jinja' as header %} - {{ cycle }} Election - US {{ office|title }} {% if state %} - {{ state|fmt_state_full }} {% if district %} - District {{ district }} {% endif %} {% endif %} {% block title %}U.S. {{ office|title }} elections {% endblock %} @@ -14,44 +13,43 @@ {% block body %} {{ header.header(title, crumb) }} -
    -
    +
    +

    U.S. {{ office|title }} elections

    -
    - -
    - {% include 'partials/house-senate-overview/tabpanel-summary.jinja' %} - {% include 'partials/house-senate-overview/tabpanel-contributions-across-time.jinja' %} - {% include 'partials/house-senate-overview/tabpanel-totals-for-all-elections.jinja' %} + +
    +
    +
    + + Explore U.S. {{ other_office|title }} charts +
    +
    +
    + {% include 'partials/house-senate-overview/section-summary.jinja' %} + {% include 'partials/house-senate-overview/section-contributions-across-time.jinja' %} + {% if FEATURES.house_senate_overview_totals %}{% include 'partials/house-senate-overview/section-totals-for-all-elections.jinja' %}{% endif %}
    From f3acd0e89759ab23bd7d80eceb7b668c5c885cb9 Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:12:41 -0500 Subject: [PATCH 18/22] typos --- fec/fec/static/js/modules/container-queries.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/fec/fec/static/js/modules/container-queries.js b/fec/fec/static/js/modules/container-queries.js index 107cb75859..448418eac8 100644 --- a/fec/fec/static/js/modules/container-queries.js +++ b/fec/fec/static/js/modules/container-queries.js @@ -9,7 +9,7 @@ // Ex: at 430 pixels, the small class is applied. const breakpoints = [ { widths: { minPx: 0, maxPx: 429 }, classname: 'cq-xs' }, - { widths: { mminPxn: 430, maxPx: 674 }, classname: 'cq-s' }, + { widths: { minPx: 430, maxPx: 674 }, classname: 'cq-s' }, { widths: { minPx: 675, maxPx: 899 }, classname: 'cq-m' }, { widths: { minPx: 900, maxPx: 1199 }, classname: 'cq-l' }, { widths: { minPx: 1200, maxPx: 9999 }, classname: 'cq-xl' } @@ -61,7 +61,7 @@ FECContainerQuery.prototype.handleResize = function() { for (let i = 0; i < breakpoints.length; i++) { if (parentWidth >= breakpoints[i].widths.minPx && parentWidth <= breakpoints[i].widths.maxPx ) { child.classList.add(breakpoints[i].classname); - break; + return; } } }); From b9a689684e2d12ad64cef0a783dab56308b4b99d Mon Sep 17 00:00:00 2001 From: R Fultz Date: Thu, 17 Nov 2022 10:12:57 -0500 Subject: [PATCH 19/22] Add a minimum width for party-money-bars --- fec/fec/static/scss/widgets/party-money-bars.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/fec/fec/static/scss/widgets/party-money-bars.scss b/fec/fec/static/scss/widgets/party-money-bars.scss index bfa6c39d76..a3ba04ec5e 100644 --- a/fec/fec/static/scss/widgets/party-money-bars.scss +++ b/fec/fec/static/scss/widgets/party-money-bars.scss @@ -16,6 +16,7 @@ $fontWeightBold: 700; // The party money bars root selector .js-party-money-bars { + min-width: 20rem; &, & * { // THESE ARE PASSED DOWN TO CHILDREN From 226f52f3c5f556bbc7ebeca52d0009be645b4ac7 Mon Sep 17 00:00:00 2001 From: R Fultz Date: Wed, 23 Nov 2022 13:45:47 -0500 Subject: [PATCH 20/22] Addressing feedback --- fec/data/templates/house-senate-overview.jinja | 8 ++++---- .../section-contributions-across-time.jinja | 2 +- .../section-summary.jinja | 10 +++++----- .../section-totals-for-all-elections.jinja | 18 +++++++++--------- fec/fec/static/js/modules/party-money-bars.js | 4 ++-- .../scss/widgets/house-senate-overview.scss | 4 ++++ 6 files changed, 25 insertions(+), 21 deletions(-) diff --git a/fec/data/templates/house-senate-overview.jinja b/fec/data/templates/house-senate-overview.jinja index 08397cdb0e..d7d9e2f42c 100644 --- a/fec/data/templates/house-senate-overview.jinja +++ b/fec/data/templates/house-senate-overview.jinja @@ -25,14 +25,14 @@
    - Explore U.S. {{ other_office|title }} charts + Explore U.S. {{ other_office|title }} election data
    diff --git a/fec/data/templates/partials/house-senate-overview/section-contributions-across-time.jinja b/fec/data/templates/partials/house-senate-overview/section-contributions-across-time.jinja index a5a369049d..490b96784b 100644 --- a/fec/data/templates/partials/house-senate-overview/section-contributions-across-time.jinja +++ b/fec/data/templates/partials/house-senate-overview/section-contributions-across-time.jinja @@ -56,7 +56,7 @@ -
    +
    • Methodology
      • diff --git a/fec/data/templates/partials/house-senate-overview/section-summary.jinja b/fec/data/templates/partials/house-senate-overview/section-summary.jinja index f4114e5ebd..434493bb65 100644 --- a/fec/data/templates/partials/house-senate-overview/section-summary.jinja +++ b/fec/data/templates/partials/house-senate-overview/section-summary.jinja @@ -7,14 +7,14 @@

      Election summary

      {#

      {{ office | title }} election summary

      #} -

      Comparing total money raised, spent and remaining cash on hand, by party.

      +

      Comparing total money raised, spent and cash on hand, by party.

      {{ select.two_year_select(cycles, cycle, id="cycle-summary") }}

      $1,234,567,890

      -

      raised by {{ office | title }} candidates

      +

      raised by candidates

      @@ -24,7 +24,7 @@

      $1,234,567,890

      -

      spent by {{ office | title }} candidates

      +

      spent by candidates

      @@ -34,7 +34,7 @@

      $1,234,567,890

      -

      cash on hand for {{ office | title }} candidates

      +

      cash on hand for candidates

      @@ -44,7 +44,7 @@ -
      +
      Newly filed summary data may not appear for up to 48 hours.
      diff --git a/fec/data/templates/partials/house-senate-overview/section-totals-for-all-elections.jinja b/fec/data/templates/partials/house-senate-overview/section-totals-for-all-elections.jinja index 193c44bd8f..38ce56db36 100644 --- a/fec/data/templates/partials/house-senate-overview/section-totals-for-all-elections.jinja +++ b/fec/data/templates/partials/house-senate-overview/section-totals-for-all-elections.jinja @@ -21,15 +21,15 @@ Debts -
      -
      - -

      Each two-year period includes financial activity from January 1 of the nonelection year through December 31 of the election year. Newly filed summary data may not appear for up to 48 hours.

      -
      -