From cb8cfe76cf7f51f43716859107b6c47a1db1c486 Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 13:55:40 -0400 Subject: [PATCH 01/10] Prototype filings panel with AJAX data. --- static/js/modules/helpers.js | 14 +++- static/js/modules/tables.js | 94 +++++++++++++++------------ static/js/pages/candidates.js | 4 +- static/js/pages/committees.js | 2 +- static/js/pages/disbursements.js | 2 +- static/js/pages/filings.js | 41 ++++++++++-- static/js/pages/receipts.js | 2 +- static/templates/candidates.hbs | 8 +-- static/templates/filings.hbs | 22 +++++++ templates/candidates.html | 1 + templates/filings.html | 2 + templates/partials/filings-table.html | 3 +- 12 files changed, 136 insertions(+), 59 deletions(-) create mode 100644 static/templates/filings.hbs diff --git a/static/js/modules/helpers.js b/static/js/modules/helpers.js index 5fbe85795..c443ebbdf 100644 --- a/static/js/modules/helpers.js +++ b/static/js/modules/helpers.js @@ -1,7 +1,8 @@ 'use strict'; -/* global require, module, Intl */ +/* global require, module, Intl, API_LOCATION, API_VERSION, API_KEY */ +var URI = require('URIjs'); var _ = require('underscore'); var moment = require('moment'); var Handlebars = require('hbsfy/runtime'); @@ -42,9 +43,18 @@ function filterNull(params) { .value(); } +function buildUrl(path, query) { + return URI(API_LOCATION) + .path([API_VERSION].concat(path).join('/')) + .addQuery({api_key: API_KEY}) + .addQuery(query) + .toString(); +} + module.exports = { currency: currency, datetime: datetime, cycleDates: cycleDates, - filterNull: filterNull + filterNull: filterNull, + buildUrl: buildUrl }; diff --git a/static/js/modules/tables.js b/static/js/modules/tables.js index ef22c0bbe..0a94296d3 100644 --- a/static/js/modules/tables.js +++ b/static/js/modules/tables.js @@ -230,52 +230,62 @@ function mapQuerySeek(api, data) { ); } -function modalAfterRender(template, api, data, response) { - var $table = $(api.table().node()), - $modal = $('#datatable-modal'); - - // Move the modal to the results div. - $modal.appendTo($('#results')); - $table.find('tr').attr('tabindex', 0); - - $table.on('click keypress', '.js-panel-toggle tr', function(ev) { - if (ev.which === 13 || ev.type === 'click') { - if ($(ev.target).is('a')) { - return true; - } - if ( !$(ev.target).closest('td').hasClass('dataTables_empty') ) { - var $row = $(ev.target).closest('tr'); - var index = api.row($row).index(); - $modal.find('.js-panel-content').html(template(response.results[index])); - $modal.attr('aria-hidden', 'false'); - $row.siblings().toggleClass('row-active', false); - $row.toggleClass('row-active', true); - $('body').toggleClass('panel-active', true); - var hideColumns = api.columns('.hide-panel'); - hideColumns.visible(false); - // Populate the pdf button if there is one - if ( response.results[index].pdf_url ) { - $modal.find('.js-pdf_url').attr('href', response.results[index].pdf_url); - } else { - $modal.find('.js-pdf_url').remove(); - } +function identity(value) { + return value; +} - // Set focus on the close button - $('.js-hide').focus(); +function modalRenderFactory(template, fetch) { + fetch = fetch || identity; + return function(api, data, response) { + var $table = $(api.table().node()); + var $modal = $('#datatable-modal'); - // When under $large-screen - // TODO figure way to share these values with CSS. - if ($(document).width() < 980) { - api.columns('.hide-panel-tablet').visible(false); + // Move the modal to the results div. + $modal.appendTo($('#results')); + $table.find('tr').attr('tabindex', 0); + + $table.on('click keypress', '.js-panel-toggle tr', function(ev) { + if (ev.which === 13 || ev.type === 'click') { + if ($(ev.target).is('a')) { + return true; + } + if ( !$(ev.target).closest('td').hasClass('dataTables_empty') ) { + var $row = $(ev.target).closest('tr'); + var index = api.row($row).index(); + $.when(fetch(response.results[index])).done(function(fetched) { + $modal.find('.js-panel-content').html(template(fetched)); + $modal.attr('aria-hidden', 'false'); + $row.siblings().toggleClass('row-active', false); + $row.toggleClass('row-active', true); + $('body').toggleClass('panel-active', true); + var hideColumns = api.columns('.hide-panel'); + hideColumns.visible(false); + + // Populate the pdf button if there is one + if (fetched.pdf_url) { + $modal.find('.js-pdf_url').attr('href', fetched.pdf_url); + } else { + $modal.find('.js-pdf_url').remove(); + } + + // Set focus on the close button + $('.js-hide').focus(); + + // When under $large-screen + // TODO figure way to share these values with CSS. + if ($(document).width() < 980) { + api.columns('.hide-panel-tablet').visible(false); + } + }); } } - } - }); + }); - $modal.on('click', '.js-panel-close', function(ev) { - ev.preventDefault(); - hidePanel(api, $modal); - }); + $modal.on('click', '.js-panel-close', function(ev) { + ev.preventDefault(); + hidePanel(api, $modal); + }); + }; } function hidePanel(api, $modal) { @@ -456,8 +466,8 @@ module.exports = { urlColumn: urlColumn, barCurrencyColumn: barCurrencyColumn, dateColumn: dateColumn, - modalAfterRender: modalAfterRender, barsAfterRender: barsAfterRender, + modalRenderFactory: modalRenderFactory, offsetCallbacks: offsetCallbacks, seekCallbacks: seekCallbacks, initTable: initTable, diff --git a/static/js/pages/candidates.js b/static/js/pages/candidates.js index 8381a3e33..e579f2147 100644 --- a/static/js/pages/candidates.js +++ b/static/js/pages/candidates.js @@ -47,8 +47,8 @@ $(document).ready(function() { 'candidates', {}, columns, - _.extend(tables.offsetCallbacks, { - afterRender: tables.modalAfterRender.bind(undefined, candidatesTemplate) + _.extend({}, tables.offsetCallbacks, { + afterRender: tables.modalRenderFactory(candidatesTemplate) }), {useFilters: true} ); diff --git a/static/js/pages/committees.js b/static/js/pages/committees.js index c77ebed25..eab0c3f31 100644 --- a/static/js/pages/committees.js +++ b/static/js/pages/committees.js @@ -44,7 +44,7 @@ $(document).ready(function() { {}, columns, _.extend(tables.offsetCallbacks, { - afterRender: tables.modalAfterRender.bind(undefined, committeesTemplate) + afterRender: tables.modalRenderFactory(committeesTemplate) }), {useFilters: true} );}); diff --git a/static/js/pages/disbursements.js b/static/js/pages/disbursements.js index f5a880e80..dc35673a3 100644 --- a/static/js/pages/disbursements.js +++ b/static/js/pages/disbursements.js @@ -60,7 +60,7 @@ $(document).ready(function() { {}, columns, _.extend(tables.seekCallbacks, { - afterRender: tables.modalAfterRender.bind(undefined, disbursementTemplate) + afterRender: tables.modalRenderFactory(disbursementTemplate) }), { order: [[3, 'desc']], diff --git a/static/js/pages/filings.js b/static/js/pages/filings.js index d49ba1eb1..9b8095539 100644 --- a/static/js/pages/filings.js +++ b/static/js/pages/filings.js @@ -6,8 +6,11 @@ var $ = require('jquery'); var _ = require('underscore'); var tables = require('../modules/tables'); +var helpers = require('../modules/helpers'); var decoders = require('../modules/decoders'); +var filingsTemplate = require('../../templates/filings.hbs'); + var columns = [ tables.urlColumn('pdf_url', {data: 'document_description', className: 'all', orderable: false}), { @@ -38,15 +41,43 @@ var columns = [ tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet', orderable: false}), tables.currencyColumn({data: 'total_receipts', className: 'min-tablet'}), tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet'}), - tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet'}) + tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet'}), + { + className: 'all', + width: '20px', + orderable: false, + render: function(data, type, row, meta) { + return row.form_type && row.form_type.match(/^F3/) ? + '' : + ''; + } + } ]; $(document).ready(function() { var $table = $('#results'); var $form = $('#category-filters'); - tables.initTable($table, $form, 'filings', {}, columns, tables.offsetCallbacks, { - // Order by receipt date descending - order: [[4, 'desc']], - useFilters: true + tables.initTable($table, $form, 'filings', {}, columns, + _.extend({}, tables.offsetCallbacks, { + afterRender: tables.modalRenderFactory( + filingsTemplate, + function(row) { + var url = helpers.buildUrl( + ['committee', row.committee_id, 'reports'], + {beginning_image_number: row.beginning_image_number} + ); + return $.getJSON(url).then(function(response) { + var result = response.results.length ? + response.results[0] : + {}; + return _.extend({}, row, result); + }); + } + ) + }), + { + // Order by receipt date descending + order: [[4, 'desc']], + useFilters: true }); }); diff --git a/static/js/pages/receipts.js b/static/js/pages/receipts.js index 4aa6a8049..327155926 100644 --- a/static/js/pages/receipts.js +++ b/static/js/pages/receipts.js @@ -60,7 +60,7 @@ $(document).ready(function() { {}, columns, _.extend(tables.seekCallbacks, { - afterRender: tables.modalAfterRender.bind(undefined, donationTemplate) + afterRender: tables.modalRenderFactory(donationTemplate) }), { order: [[5, 'desc']], diff --git a/static/templates/candidates.hbs b/static/templates/candidates.hbs index 75f6c8c6e..b8e5f4242 100644 --- a/static/templates/candidates.hbs +++ b/static/templates/candidates.hbs @@ -12,11 +12,11 @@ Political Party {{party_full}} - + Status {{incumbent_challenge_full}} - + {{#if state}} State @@ -27,7 +27,7 @@ District {{district}} - + {{/if}} - \ No newline at end of file + diff --git a/static/templates/filings.hbs b/static/templates/filings.hbs new file mode 100644 index 000000000..cdc333d7f --- /dev/null +++ b/static/templates/filings.hbs @@ -0,0 +1,22 @@ +
+

{{report_year}} {{report_type_full}}

+
Report coverage: {{coverage_start_date}} - {{coverage_end_date}}
+ + + + + + + + + + + + + + + + + +
Total Receipts{{total_receipts_period}}
Total Disbursements{{total_disbursements_period}}
Beginning Cash on Hand{{cash_on_hand_beginning_period}}
Ending Cash on Hand{{cash_on_hand_end_period}}
+
diff --git a/templates/candidates.html b/templates/candidates.html index b8d220e12..c5c94d921 100644 --- a/templates/candidates.html +++ b/templates/candidates.html @@ -16,6 +16,7 @@

Candidates

{% include 'partials/candidates-table.html' %} + {% include 'partials/datatable-modal.html' %} {% endblock %} diff --git a/templates/filings.html b/templates/filings.html index dc0da31fa..82d255678 100644 --- a/templates/filings.html +++ b/templates/filings.html @@ -17,6 +17,8 @@

Filings

+{% include 'partials/datatable-modal.html' %} + {% endblock %} {% block scripts %} diff --git a/templates/partials/filings-table.html b/templates/partials/filings-table.html index b713d30c7..01133e8db 100644 --- a/templates/partials/filings-table.html +++ b/templates/partials/filings-table.html @@ -10,6 +10,7 @@ Total Receipts Total Disbursement Total Independent Expenditures + - \ No newline at end of file + From cd3a4a1b0a0c6fff6209eb265001d75b97cf161b Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 14:36:32 -0400 Subject: [PATCH 02/10] Only trigger on modal for matching rows. --- static/js/modules/tables.js | 7 ++++++- static/js/pages/candidates.js | 2 +- static/js/pages/committees.js | 2 +- static/js/pages/disbursements.js | 2 +- static/js/pages/filings.js | 2 +- static/js/pages/receipts.js | 2 +- 6 files changed, 11 insertions(+), 6 deletions(-) diff --git a/static/js/modules/tables.js b/static/js/modules/tables.js index 0a94296d3..18c0398be 100644 --- a/static/js/modules/tables.js +++ b/static/js/modules/tables.js @@ -234,6 +234,9 @@ function identity(value) { return value; } +var MODAL_TRIGGER_CLASS = 'js-modal-trigger'; +var MODAL_TRIGGER_HTML = ''; + function modalRenderFactory(template, fetch) { fetch = fetch || identity; return function(api, data, response) { @@ -244,7 +247,7 @@ function modalRenderFactory(template, fetch) { $modal.appendTo($('#results')); $table.find('tr').attr('tabindex', 0); - $table.on('click keypress', '.js-panel-toggle tr', function(ev) { + $table.on('click keypress', '.js-panel-toggle tr:has(.' + MODAL_TRIGGER_CLASS + ')', function(ev) { if (ev.which === 13 || ev.type === 'click') { if ($(ev.target).is('a')) { return true; @@ -468,6 +471,8 @@ module.exports = { dateColumn: dateColumn, barsAfterRender: barsAfterRender, modalRenderFactory: modalRenderFactory, + MODAL_TRIGGER_CLASS: MODAL_TRIGGER_CLASS, + MODAL_TRIGGER_HTML: MODAL_TRIGGER_HTML, offsetCallbacks: offsetCallbacks, seekCallbacks: seekCallbacks, initTable: initTable, diff --git a/static/js/pages/candidates.js b/static/js/pages/candidates.js index e579f2147..10a51ffeb 100644 --- a/static/js/pages/candidates.js +++ b/static/js/pages/candidates.js @@ -33,7 +33,7 @@ var columns = [ width: '20px', orderable: false, render: function(data, type, row, meta) { - return ''; + return tables.MODAL_TRIGGER_HTML; } } ]; diff --git a/static/js/pages/committees.js b/static/js/pages/committees.js index eab0c3f31..5c2af1013 100644 --- a/static/js/pages/committees.js +++ b/static/js/pages/committees.js @@ -29,7 +29,7 @@ var columns = [ width: '20px', orderable: false, render: function(data, type, row, meta) { - return ''; + return tables.MODAL_TRIGGER_HTML; } } ]; diff --git a/static/js/pages/disbursements.js b/static/js/pages/disbursements.js index dc35673a3..2a29e3a10 100644 --- a/static/js/pages/disbursements.js +++ b/static/js/pages/disbursements.js @@ -45,7 +45,7 @@ var columns = [ width: '20px', orderable: false, render: function(data, type, row, meta) { - return ''; + return tables.MODAL_TRIGGER_HTML; } } ]; diff --git a/static/js/pages/filings.js b/static/js/pages/filings.js index 9b8095539..dc3634a83 100644 --- a/static/js/pages/filings.js +++ b/static/js/pages/filings.js @@ -48,7 +48,7 @@ var columns = [ orderable: false, render: function(data, type, row, meta) { return row.form_type && row.form_type.match(/^F3/) ? - '' : + tables.MODAL_TRIGGER_HTML : ''; } } diff --git a/static/js/pages/receipts.js b/static/js/pages/receipts.js index 327155926..9ad101cad 100644 --- a/static/js/pages/receipts.js +++ b/static/js/pages/receipts.js @@ -45,7 +45,7 @@ var columns = [ width: '20px', orderable: false, render: function(data, type, row, meta) { - return ''; + return tables.MODAL_TRIGGER_HTML; } } ]; From d1a53ae9dbb9b8cea1245b0b0a50c135ad59ee18 Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 14:41:08 -0400 Subject: [PATCH 03/10] Hide columns on expand detail. --- static/js/pages/filings.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/static/js/pages/filings.js b/static/js/pages/filings.js index dc3634a83..5ec5d9ad6 100644 --- a/static/js/pages/filings.js +++ b/static/js/pages/filings.js @@ -38,10 +38,10 @@ var columns = [ }, tables.dateColumn({data: 'receipt_date', className: 'min-tablet'}), // this would be better as a range of dates, with the title "Coverage Period" - tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet', orderable: false}), - tables.currencyColumn({data: 'total_receipts', className: 'min-tablet'}), - tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet'}), - tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet'}), + tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet hide-panel', orderable: false}), + tables.currencyColumn({data: 'total_receipts', className: 'min-tablet hide-panel'}), + tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet hide-panel'}), + tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet hide-panel'}), { className: 'all', width: '20px', From 47709fb3b8df50de000dcc25271be1984676caaf Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 15:38:58 -0400 Subject: [PATCH 04/10] Add detail pane to committee filings. --- static/js/modules/columns.js | 61 +++++++++++++++ static/js/modules/tables.js | 17 +++-- static/js/pages/committee-single.js | 44 ++++++----- static/js/pages/filings.js | 74 +++---------------- static/js/pages/landing.js | 27 ++----- templates/partials/candidates-table.html | 24 +++--- templates/partials/filings-tab-committee.html | 3 + 7 files changed, 124 insertions(+), 126 deletions(-) create mode 100644 static/js/modules/columns.js diff --git a/static/js/modules/columns.js b/static/js/modules/columns.js new file mode 100644 index 000000000..66af6d6d5 --- /dev/null +++ b/static/js/modules/columns.js @@ -0,0 +1,61 @@ +'use strict'; + +/* global require, module */ + +var _ = require('underscore'); + +var tables = require('./tables'); +var decoders = require('./decoders'); + +var filings = { + pdf_url: tables.urlColumn('pdf_url', {data: 'document_description', className: 'all', orderable: false}), + committee_name: { + data: 'committee_name', + className: 'min-desktop', + orderable: false, + render: function(data, type, row, meta) { + return tables.buildEntityLink(data, '/committee/' + row.committee_id + tables.buildCycle(row), 'committee'); + }, + }, + candidate_name: { + data: 'candidate_name', + className: 'min-desktop', + orderable: false, + render: function(data, type, row, meta) { + return tables.buildEntityLink(data, '/candidate/' + row.candidate_id + tables.buildCycle(row), 'candidate'); + }, + }, + amendment_indicator: { + data: 'amendment_indicator', + className: 'min-desktop', + render: function(data, type, row, meta) { + return decoders.amendments[data] || ''; + }, + }, + receipt_date: tables.dateColumn({data: 'receipt_date', className: 'min-tablet'}), + coverage_end_date: tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet hide-panel', orderable: false}), + total_receipts: tables.currencyColumn({data: 'total_receipts', className: 'min-tablet hide-panel'}), + total_disbursements: tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet hide-panel'}), + total_independent_expenditures: tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet hide-panel'}), + modal_trigger: { + className: 'all', + width: '20px', + orderable: false, + render: function(data, type, row, meta) { + return row.form_type && row.form_type.match(/^F3/) ? + tables.MODAL_TRIGGER_HTML : + ''; + } + } +}; + +function getColumns (columns, keys) { + return _.map(keys, function(key) { + return columns[key]; + }); +} + +module.exports = { + filings: filings, + getColumns: getColumns +}; diff --git a/static/js/modules/tables.js b/static/js/modules/tables.js index 18c0398be..679bafbfc 100644 --- a/static/js/modules/tables.js +++ b/static/js/modules/tables.js @@ -244,16 +244,17 @@ function modalRenderFactory(template, fetch) { var $modal = $('#datatable-modal'); // Move the modal to the results div. - $modal.appendTo($('#results')); + $modal.appendTo($table); $table.find('tr').attr('tabindex', 0); - $table.on('click keypress', '.js-panel-toggle tr:has(.' + MODAL_TRIGGER_CLASS + ')', function(ev) { - if (ev.which === 13 || ev.type === 'click') { - if ($(ev.target).is('a')) { + $table.on('click keypress', '.js-panel-toggle tr:has(.' + MODAL_TRIGGER_CLASS + ')', function(e) { + if (e.which === 13 || e.type === 'click') { + var $target = $(e.target); + if ($target.is('a')) { return true; } - if ( !$(ev.target).closest('td').hasClass('dataTables_empty') ) { - var $row = $(ev.target).closest('tr'); + if ( !$target.closest('td').hasClass('dataTables_empty') ) { + var $row = $target.closest('tr'); var index = api.row($row).index(); $.when(fetch(response.results[index])).done(function(fetched) { $modal.find('.js-panel-content').html(template(fetched)); @@ -284,8 +285,8 @@ function modalRenderFactory(template, fetch) { } }); - $modal.on('click', '.js-panel-close', function(ev) { - ev.preventDefault(); + $modal.on('click', '.js-panel-close', function(e) { + e.preventDefault(); hidePanel(api, $modal); }); }; diff --git a/static/js/pages/committee-single.js b/static/js/pages/committee-single.js index d34dae936..9eef197d4 100644 --- a/static/js/pages/committee-single.js +++ b/static/js/pages/committee-single.js @@ -10,8 +10,8 @@ var events = require('fec-style/js/events'); var maps = require('../modules/maps'); var tables = require('../modules/tables'); -var helpers = require('../modules/helpers'); -var decoders = require('../modules/decoders'); +var filings = require('../modules/filings'); +var columns = require('../modules/columns'); var tableOpts = { dom: tables.simpleDOM, @@ -131,21 +131,14 @@ var occupationColumns = [ } ]; -var filingsColumns = [ - tables.urlColumn('pdf_url', {data: 'document_description', className: 'all', orderable: false}), - { - data: 'amendment_indicator', - className: 'min-desktop', - render: function(data) { - return decoders.amendments[data] || ''; - }, - }, - tables.dateColumn({data: 'receipt_date', className: 'min-tablet'}), - tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet', orderable: false}), - tables.currencyColumn({data: 'total_receipts', className: 'min-tablet'}), - tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet'}), - tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet'}), -]; +var filingsColumns = columns.getColumns( + columns.filings, + [ + 'pdf_url', 'amendment_indicator', 'receipt_date', 'coverage_end_date', + 'total_receipts', 'total_disbursements', 'total_independent_expenditures', + 'modal_trigger' + ] +); var disbursementPurposeColumns = [ {data: 'purpose', className: 'all', orderable: false}, @@ -283,12 +276,17 @@ $(document).ready(function() { break; case 'filing': var $form = $('#category-filters'); - tables.initTableDeferred($table, $form, 'committee/' + committeeId + '/filings', {}, filingsColumns, tables.offsetCallbacks, { - dom: 't<"results-info results-info--bottom meta-box"lfrip>', - // Order by receipt date descending - order: [[4, 'desc']], - useFilters: true - }); + tables.initTableDeferred($table, $form, 'committee/' + committeeId + '/filings', {}, filingsColumns, + _.extend({}, tables.offsetCallbacks, { + afterRender: filings.renderFilingsModal + }), + { + dom: 't<"results-info results-info--bottom meta-box"lfrip>', + // Order by receipt date descending + order: [[4, 'desc']], + useFilters: true + } + ); break; case 'disbursements-by-purpose': path = ['committee', committeeId, 'schedules', 'schedule_b', 'by_purpose'].join('/'); diff --git a/static/js/pages/filings.js b/static/js/pages/filings.js index 5ec5d9ad6..c26b810c7 100644 --- a/static/js/pages/filings.js +++ b/static/js/pages/filings.js @@ -6,74 +6,24 @@ var $ = require('jquery'); var _ = require('underscore'); var tables = require('../modules/tables'); -var helpers = require('../modules/helpers'); -var decoders = require('../modules/decoders'); +var filings = require('../modules/filings'); +var columns = require('../modules/columns'); -var filingsTemplate = require('../../templates/filings.hbs'); - -var columns = [ - tables.urlColumn('pdf_url', {data: 'document_description', className: 'all', orderable: false}), - { - data: 'committee_name', - className: 'min-desktop', - orderable: false, - render: function(data, type, row, meta) { - return tables.buildEntityLink(data, '/committee/' + row.committee_id + tables.buildCycle(row), 'committee'); - }, - }, - { - data: 'candidate_name', - className: 'min-desktop', - orderable: false, - render: function(data, type, row, meta) { - return tables.buildEntityLink(data, '/candidate/' + row.candidate_id + tables.buildCycle(row), 'candidate'); - }, - }, - { - data: 'amendment_indicator', - className: 'min-desktop', - render: function(data, type, row, meta) { - return decoders.amendments[data] || ''; - }, - }, - tables.dateColumn({data: 'receipt_date', className: 'min-tablet'}), - // this would be better as a range of dates, with the title "Coverage Period" - tables.dateColumn({data: 'coverage_end_date', className: 'min-tablet hide-panel', orderable: false}), - tables.currencyColumn({data: 'total_receipts', className: 'min-tablet hide-panel'}), - tables.currencyColumn({data: 'total_disbursements', className: 'min-tablet hide-panel'}), - tables.currencyColumn({data: 'total_independent_expenditures', className: 'min-tablet hide-panel'}), - { - className: 'all', - width: '20px', - orderable: false, - render: function(data, type, row, meta) { - return row.form_type && row.form_type.match(/^F3/) ? - tables.MODAL_TRIGGER_HTML : - ''; - } - } -]; +var filingsColumns = columns.getColumns( + columns.filings, + [ + 'pdf_url', 'committee_name', 'candidate_name', 'amendment_indicator', 'receipt_date', 'coverage_end_date', + 'total_receipts', 'total_disbursements', 'total_independent_expenditures', + 'modal_trigger' + ] +); $(document).ready(function() { var $table = $('#results'); var $form = $('#category-filters'); - tables.initTable($table, $form, 'filings', {}, columns, + tables.initTable($table, $form, 'filings', {}, filingsColumns, _.extend({}, tables.offsetCallbacks, { - afterRender: tables.modalRenderFactory( - filingsTemplate, - function(row) { - var url = helpers.buildUrl( - ['committee', row.committee_id, 'reports'], - {beginning_image_number: row.beginning_image_number} - ); - return $.getJSON(url).then(function(response) { - var result = response.results.length ? - response.results[0] : - {}; - return _.extend({}, row, result); - }); - } - ) + afterRender: filings.renderFilingsModal }), { // Order by receipt date descending diff --git a/static/js/pages/landing.js b/static/js/pages/landing.js index 7be58bac7..e6371eb32 100644 --- a/static/js/pages/landing.js +++ b/static/js/pages/landing.js @@ -5,31 +5,16 @@ var $ = require('jquery'); var tables = require('../modules/tables'); +var columns = require('../modules/columns'); -var columns = [ - tables.urlColumn('pdf_url', {data: 'document_description', className: 'all', orderable: false}), - { - data: 'committee_name', - className: 'min-desktop', - orderable: false, - render: function(data, type, row, meta) { - return tables.buildEntityLink(data, '/committee/' + row.committee_id + tables.buildCycle(row), 'committee'); - }, - }, - { - data: 'candidate_name', - className: 'min-desktop', - orderable: false, - render: function(data, type, row, meta) { - return tables.buildEntityLink(data, '/candidate/' + row.candidate_id + tables.buildCycle(row), 'candidate'); - }, - }, - tables.dateColumn({data: 'receipt_date', className: 'min-tablet', orderable: false}), -]; +var filingsColumns = columns.getColumns( + columns.filings, + ['pdf_url', 'committee_name', 'candidate_name', 'receipt_date'] +); $(document).ready(function() { var $table = $('#results'); - tables.initTable($table, null, 'filings', {per_page: 10}, columns, tables.offsetCallbacks, { + tables.initTable($table, null, 'filings', {per_page: 10}, filingsColumns, tables.offsetCallbacks, { // Order by receipt date descending order: [[3, 'desc']], useFilters: false, diff --git a/templates/partials/candidates-table.html b/templates/partials/candidates-table.html index 5f7b986b5..831850fe6 100644 --- a/templates/partials/candidates-table.html +++ b/templates/partials/candidates-table.html @@ -1,13 +1,13 @@ - - - - - - - - - - - - +
NameOfficeElection YearsPartyStateDistrict
+ + + + + + + + + + +
NameOfficeElection YearsPartyStateDistrict
diff --git a/templates/partials/filings-tab-committee.html b/templates/partials/filings-tab-committee.html index 64833d81e..e0c7db48f 100644 --- a/templates/partials/filings-tab-committee.html +++ b/templates/partials/filings-tab-committee.html @@ -22,9 +22,12 @@

Committee Filings {% include ' Total Receipts Total Disbursement Total Independent Expenditures + + +{% include 'partials/datatable-modal.html' %} From 9e927a7360cef6a96b6ec873fc3fe97154e366b9 Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 15:58:06 -0400 Subject: [PATCH 05/10] Flesh out filings detail template. --- static/templates/disbursements.hbs | 10 +++---- static/templates/filings.hbs | 42 ++++++++++++++++++++++++++---- 2 files changed, 42 insertions(+), 10 deletions(-) diff --git a/static/templates/disbursements.hbs b/static/templates/disbursements.hbs index b384890ec..d5f75694a 100644 --- a/static/templates/disbursements.hbs +++ b/static/templates/disbursements.hbs @@ -35,7 +35,7 @@ Description {{ disbursement_description }} - {{#if election_type_full }} + {{#if election_type_full }} Election Type {{ election_type_full }} @@ -55,19 +55,19 @@ Designation {{committee.designation_full}} - {{#if committee.type }} + {{#if committee.type}} Type {{committee.type_full}} - + {{/if}} Treasurer {{committee.treasurer_name}} - + Committee City & State {{ committee.city }}, {{ committee.state }}, {{ committee.zip }} - + diff --git a/static/templates/filings.hbs b/static/templates/filings.hbs index cdc333d7f..3fafa9b93 100644 --- a/static/templates/filings.hbs +++ b/static/templates/filings.hbs @@ -1,22 +1,54 @@

{{report_year}} {{report_type_full}}

-
Report coverage: {{coverage_start_date}} - {{coverage_end_date}}
+
Report coverage: {{datetime coverage_start_date}} - {{datetime coverage_end_date}}
- + - + + + + + + + + + + + + + + + + + + + + + - + - + + + + + + + + + + + + +
Total Receipts{{total_receipts_period}}{{{currency total_receipts_period}}}
Total Disbursements{{total_disbursements_period}}{{{currency total_disbursements_period}}}
Transfers to Authorized Committees{{{currency transfer_to_other_authorized_committee_period}}}
Individual Contributions{{{currency total_individual_contributions_period}}}
Itemized Individual Contributions{{{currency individual_itemized_contributions_period}}}
Unitemized Individual Contributions{{{currency individual_unitemized_contributions_period}}}
Loan Repayments{{{currency total_loan_repayments_period}}}
Beginning Cash on Hand{{cash_on_hand_beginning_period}}{{{currency cash_on_hand_beginning_period}}}
Ending Cash on Hand{{cash_on_hand_end_period}}{{{currency cash_on_hand_end_period}}}
Net Contributions{{{currency net_contributions_period}}}
Net Operating Expenditures{{{currency net_operating_expenditures_period}}}
Debts Owed by Committee{{{currency debts_owed_by_committee}}}
From 851232dc9cc40fec668141dc45dc6d5723b63563 Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 16:19:15 -0400 Subject: [PATCH 06/10] Check in filings helpers. --- static/js/modules/filings.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 static/js/modules/filings.js diff --git a/static/js/modules/filings.js b/static/js/modules/filings.js new file mode 100644 index 000000000..8313ab927 --- /dev/null +++ b/static/js/modules/filings.js @@ -0,0 +1,31 @@ +'use strict'; + +/* global require, module */ + +var $ = require('jquery'); +var _ = require('underscore'); + +var tables = require('./tables'); +var helpers = require('../modules/helpers'); + +var filingsTemplate = require('../../templates/filings.hbs'); + +var renderFilingsModal = tables.modalRenderFactory( + filingsTemplate, + function(row) { + var url = helpers.buildUrl( + ['committee', row.committee_id, 'reports'], + {beginning_image_number: row.beginning_image_number} + ); + return $.getJSON(url).then(function(response) { + var result = response.results.length ? + response.results[0] : + {}; + return _.extend({}, row, result); + }); + } +); + +module.exports = { + renderFilingsModal: renderFilingsModal +}; From b85c21671e832abb9fb2647e48462e106ac101fc Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Wed, 2 Sep 2015 16:28:15 -0400 Subject: [PATCH 07/10] Restore table ID. --- templates/partials/candidates-table.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/partials/candidates-table.html b/templates/partials/candidates-table.html index 831850fe6..45b7fe390 100644 --- a/templates/partials/candidates-table.html +++ b/templates/partials/candidates-table.html @@ -1,4 +1,4 @@ - +
From a3addcb5e2f8775acadf385dbad5d4f047bfeab3 Mon Sep 17 00:00:00 2001 From: Noah Manger Date: Wed, 2 Sep 2015 16:35:44 -0700 Subject: [PATCH 08/10] Fixing panel and sorting on committee filings table --- static/js/pages/committee-single.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/static/js/pages/committee-single.js b/static/js/pages/committee-single.js index 9eef197d4..6c3e3b8a2 100644 --- a/static/js/pages/committee-single.js +++ b/static/js/pages/committee-single.js @@ -281,9 +281,9 @@ $(document).ready(function() { afterRender: filings.renderFilingsModal }), { - dom: 't<"results-info results-info--bottom meta-box"lfrip>', + dom: '<"panel__main"t><"results-info results-info--bottom meta-box"lfrip>', // Order by receipt date descending - order: [[4, 'desc']], + order: [[2, 'desc']], useFilters: true } ); From 65a71ba528e259dfef4a5cb09089f3bd9c344e26 Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Thu, 3 Sep 2015 10:06:46 -0400 Subject: [PATCH 09/10] Add trigger class to relevant rows. --- static/js/modules/filings.js | 15 +++++++++++---- static/js/modules/tables.js | 11 ++++++++--- static/js/pages/candidates.js | 5 ++++- static/js/pages/committee-single.js | 3 ++- static/js/pages/committees.js | 5 ++++- static/js/pages/disbursements.js | 3 ++- static/js/pages/filings.js | 3 ++- static/js/pages/receipts.js | 3 ++- 8 files changed, 35 insertions(+), 13 deletions(-) diff --git a/static/js/modules/filings.js b/static/js/modules/filings.js index 8313ab927..a1463e303 100644 --- a/static/js/modules/filings.js +++ b/static/js/modules/filings.js @@ -8,10 +8,10 @@ var _ = require('underscore'); var tables = require('./tables'); var helpers = require('../modules/helpers'); -var filingsTemplate = require('../../templates/filings.hbs'); +var template = require('../../templates/filings.hbs'); -var renderFilingsModal = tables.modalRenderFactory( - filingsTemplate, +var renderModal = tables.modalRenderFactory( + template, function(row) { var url = helpers.buildUrl( ['committee', row.committee_id, 'reports'], @@ -26,6 +26,13 @@ var renderFilingsModal = tables.modalRenderFactory( } ); +function renderRow(row, data, index) { + if (data.form_type && data.form_type.match(/^F3/)) { + row.classList.add(tables.MODAL_TRIGGER_CLASS); + } +} + module.exports = { - renderFilingsModal: renderFilingsModal + renderModal: renderModal, + renderRow: renderRow }; diff --git a/static/js/modules/tables.js b/static/js/modules/tables.js index 679bafbfc..192ae3b2d 100644 --- a/static/js/modules/tables.js +++ b/static/js/modules/tables.js @@ -234,8 +234,12 @@ function identity(value) { return value; } -var MODAL_TRIGGER_CLASS = 'js-modal-trigger'; -var MODAL_TRIGGER_HTML = ''; +var MODAL_TRIGGER_CLASS = 'js-panel-trigger'; +var MODAL_TRIGGER_HTML = ''; + +function modalRenderRow(row, data, index) { + row.classList.add(MODAL_TRIGGER_CLASS); +} function modalRenderFactory(template, fetch) { fetch = fetch || identity; @@ -247,7 +251,7 @@ function modalRenderFactory(template, fetch) { $modal.appendTo($table); $table.find('tr').attr('tabindex', 0); - $table.on('click keypress', '.js-panel-toggle tr:has(.' + MODAL_TRIGGER_CLASS + ')', function(e) { + $table.on('click keypress', '.js-panel-toggle tr.' + MODAL_TRIGGER_CLASS, function(e) { if (e.which === 13 || e.type === 'click') { var $target = $(e.target); if ($target.is('a')) { @@ -471,6 +475,7 @@ module.exports = { barCurrencyColumn: barCurrencyColumn, dateColumn: dateColumn, barsAfterRender: barsAfterRender, + modalRenderRow: modalRenderRow, modalRenderFactory: modalRenderFactory, MODAL_TRIGGER_CLASS: MODAL_TRIGGER_CLASS, MODAL_TRIGGER_HTML: MODAL_TRIGGER_HTML, diff --git a/static/js/pages/candidates.js b/static/js/pages/candidates.js index 10a51ffeb..238e5d414 100644 --- a/static/js/pages/candidates.js +++ b/static/js/pages/candidates.js @@ -50,6 +50,9 @@ $(document).ready(function() { _.extend({}, tables.offsetCallbacks, { afterRender: tables.modalRenderFactory(candidatesTemplate) }), - {useFilters: true} + { + useFilters: true, + rowCallback: tables.modalRenderRow + } ); }); diff --git a/static/js/pages/committee-single.js b/static/js/pages/committee-single.js index 6c3e3b8a2..b7de18172 100644 --- a/static/js/pages/committee-single.js +++ b/static/js/pages/committee-single.js @@ -278,9 +278,10 @@ $(document).ready(function() { var $form = $('#category-filters'); tables.initTableDeferred($table, $form, 'committee/' + committeeId + '/filings', {}, filingsColumns, _.extend({}, tables.offsetCallbacks, { - afterRender: filings.renderFilingsModal + afterRender: filings.renderModal }), { + rowCallback: filings.renderRow, dom: '<"panel__main"t><"results-info results-info--bottom meta-box"lfrip>', // Order by receipt date descending order: [[2, 'desc']], diff --git a/static/js/pages/committees.js b/static/js/pages/committees.js index 5c2af1013..cd7af2654 100644 --- a/static/js/pages/committees.js +++ b/static/js/pages/committees.js @@ -46,5 +46,8 @@ $(document).ready(function() { _.extend(tables.offsetCallbacks, { afterRender: tables.modalRenderFactory(committeesTemplate) }), - {useFilters: true} + { + useFilters: true, + rowCallback: tables.modalRenderRow + } );}); diff --git a/static/js/pages/disbursements.js b/static/js/pages/disbursements.js index 2a29e3a10..adb9a2478 100644 --- a/static/js/pages/disbursements.js +++ b/static/js/pages/disbursements.js @@ -65,7 +65,8 @@ $(document).ready(function() { { order: [[3, 'desc']], pagingType: 'simple', - useFilters: true + useFilters: true, + rowCallback: tables.modalRenderRow } ); }); diff --git a/static/js/pages/filings.js b/static/js/pages/filings.js index 611173a5d..18c74c54d 100644 --- a/static/js/pages/filings.js +++ b/static/js/pages/filings.js @@ -23,9 +23,10 @@ $(document).ready(function() { var $form = $('#category-filters'); tables.initTable($table, $form, 'filings', {}, filingsColumns, _.extend({}, tables.offsetCallbacks, { - afterRender: filings.renderFilingsModal + afterRender: filings.renderModal }), { + rowCallback: filings.renderRow, // Order by receipt date descending order: [[3, 'desc']], useFilters: true diff --git a/static/js/pages/receipts.js b/static/js/pages/receipts.js index 9ad101cad..98a2fd468 100644 --- a/static/js/pages/receipts.js +++ b/static/js/pages/receipts.js @@ -65,7 +65,8 @@ $(document).ready(function() { { order: [[5, 'desc']], pagingType: 'simple', - useFilters: true + useFilters: true, + rowCallback: tables.modalRenderRow } ); }); From 897382718957bed1d9bcdc00238cb6b0bc66d94b Mon Sep 17 00:00:00 2001 From: Joshua Carp Date: Thu, 3 Sep 2015 11:57:48 -0400 Subject: [PATCH 10/10] Add multiple report templates. --- static/templates/filings.hbs => candidate.hbs | 6 +-- static/js/modules/filings.js | 17 ++++-- static/templates/filings/candidate.hbs | 54 +++++++++++++++++++ static/templates/filings/pac.hbs | 46 ++++++++++++++++ 4 files changed, 117 insertions(+), 6 deletions(-) rename static/templates/filings.hbs => candidate.hbs (88%) create mode 100644 static/templates/filings/candidate.hbs create mode 100644 static/templates/filings/pac.hbs diff --git a/static/templates/filings.hbs b/candidate.hbs similarity index 88% rename from static/templates/filings.hbs rename to candidate.hbs index 3fafa9b93..33cad4935 100644 --- a/static/templates/filings.hbs +++ b/candidate.hbs @@ -1,5 +1,5 @@
-

{{report_year}} {{report_type_full}}

+

{{document_description}}

Report coverage: {{datetime coverage_start_date}} - {{datetime coverage_end_date}}
Name
@@ -12,7 +12,7 @@ - + @@ -28,7 +28,7 @@ - + diff --git a/static/js/modules/filings.js b/static/js/modules/filings.js index a1463e303..c1032d211 100644 --- a/static/js/modules/filings.js +++ b/static/js/modules/filings.js @@ -8,10 +8,21 @@ var _ = require('underscore'); var tables = require('./tables'); var helpers = require('../modules/helpers'); -var template = require('../../templates/filings.hbs'); +var candidateTemplate = require('../../templates/filings/candidate.hbs'); +var pacTemplate = require('../../templates/filings/pac.hbs'); + +var templates = { + F3: candidateTemplate, + F3P: candidateTemplate, + F3X: pacTemplate +}; + +function resolveTemplate(row) { + return templates[row.form_type](row); +} var renderModal = tables.modalRenderFactory( - template, + resolveTemplate, function(row) { var url = helpers.buildUrl( ['committee', row.committee_id, 'reports'], @@ -27,7 +38,7 @@ var renderModal = tables.modalRenderFactory( ); function renderRow(row, data, index) { - if (data.form_type && data.form_type.match(/^F3/)) { + if (data.form_type && data.form_type.match(/^F3[XP]?$/)) { row.classList.add(tables.MODAL_TRIGGER_CLASS); } } diff --git a/static/templates/filings/candidate.hbs b/static/templates/filings/candidate.hbs new file mode 100644 index 000000000..33cad4935 --- /dev/null +++ b/static/templates/filings/candidate.hbs @@ -0,0 +1,54 @@ +
+

{{document_description}}

+
Report coverage: {{datetime coverage_start_date}} - {{datetime coverage_end_date}}
+
Transfers to Authorized Committees{{{currency transfer_to_other_authorized_committee_period}}}{{{currency transfers_to_other_authorized_committee_period}}}
Individual Contributions
Loan Repayments{{{currency total_loan_repayments_period}}}{{{currency total_loan_repayments_made_period}}}
Beginning Cash on Hand
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Total Receipts{{{currency total_receipts_period}}}
Total Disbursements{{{currency total_disbursements_period}}}
Transfers to Authorized Committees{{{currency transfers_to_other_authorized_committee_period}}}
Individual Contributions{{{currency total_individual_contributions_period}}}
Itemized Individual Contributions{{{currency individual_itemized_contributions_period}}}
Unitemized Individual Contributions{{{currency individual_unitemized_contributions_period}}}
Loan Repayments{{{currency total_loan_repayments_made_period}}}
Beginning Cash on Hand{{{currency cash_on_hand_beginning_period}}}
Ending Cash on Hand{{{currency cash_on_hand_end_period}}}
Net Contributions{{{currency net_contributions_period}}}
Net Operating Expenditures{{{currency net_operating_expenditures_period}}}
Debts Owed by Committee{{{currency debts_owed_by_committee}}}
+ diff --git a/static/templates/filings/pac.hbs b/static/templates/filings/pac.hbs new file mode 100644 index 000000000..c3c887507 --- /dev/null +++ b/static/templates/filings/pac.hbs @@ -0,0 +1,46 @@ +
+

{{document_description}}

+
Report coverage: {{datetime coverage_start_date}} - {{datetime coverage_end_date}}
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Total Receipts{{{currency total_receipts_period}}}
Total Disbursements{{{currency total_disbursements_period}}}
Individual Contributions{{{currency total_individual_contributions_period}}}
Itemized Individual Contributions{{{currency individual_itemized_contributions_period}}}
Unitemized Individual Contributions{{{currency individual_unitemized_contributions_period}}}
Beginning Cash on Hand{{{currency cash_on_hand_beginning_period}}}
Ending Cash on Hand{{{currency cash_on_hand_end_period}}}
Net Contributions{{{currency net_contributions_period}}}
Net Operating Expenditures{{{currency net_operating_expenditures_period}}}
Debts Owed by Committee{{{currency debts_owed_by_committee}}}
+