fixes #204 - add Account Transfer functionality

CHANGES.rst

@@ -11,6 +11,7 @@ Unreleased Changes
 * `Issue #198 <https://github.com/jantman/biweeklybudget/issues/198>`_ - Fix broken method of retrieving current US Prime Rate. Previously we used marketwatch.com for this but they've introduced javascript-based bot protection on their site (which is ironic since we were reading a value from the page's ``meta`` tags, which are specifically intended to be read by machines). Switch to using wsj.com instead and (ugh) parsing a HTML table. This *will* break when the format of the table changes. As previously, we cache this value in the DB for 48 hours in order to be a good citizen.
 * `Issue #197 <https://github.com/jantman/biweeklybudget/issues/197>`_ - Add notification for case where balance of all budget-funding accounts is *more* than sum of standing budgets, current payperiod remaining, and unreconciled. This is the opposite of the similar notification that already exists, intended to detect if there is money in accounts not accounted for in the budgets.
 * `Issue #196 <https://github.com/jantman/biweeklybudget/issues/196>`_ - Don't include inactive budgets in Budget select elements on Transaction Modal form, unless it's an existing Transaction using that budget.
+* `Issue #204 <https://github.com/jantman/biweeklybudget/issues/204>`_ - Add support for account transfer between non-Credit accounts.
 * Many dependency updates:
 
   * Upgrade SQLAlchemy from 1.2.0 to 1.2.11 for `python 3 bug fix (4291) <https://docs.sqlalchemy.org/en/latest/changelog/changelog_12.html#change-2cca6c216347ab83d04c766452b48c1a>`_.

biweeklybudget/flaskapp/static/js/account_transfer_modal.js

@@ -38,43 +38,42 @@ Jason Antman <[email protected]> <http://www.jasonantman.com>
 /**
  * Generate the HTML for the form on the Modal
  */
-function budgetTransferDivForm() {
-    return new FormBuilder('budgetTransferForm')
-        .addDatePicker('budg_txfr_frm_date', 'date', 'Date')
-        .addCurrency('budg_txfr_frm_amount', 'amount', 'Amount', { helpBlock: 'Transfer amount relative to from account; must be positive.' })
-        .addLabelToValueSelect('budg_txfr_frm_account', 'account', 'Account', acct_names_to_id, 'None', true)
-        .addLabelToValueSelect('budg_txfr_frm_from_budget', 'from_budget', 'From Budget', active_budget_names_to_id, 'None', true)
-        .addLabelToValueSelect('budg_txfr_frm_to_budget', 'to_budget', 'To Budget', active_budget_names_to_id, 'None', true)
-        .addText('budg_txfr_frm_notes', 'notes', 'Notes')
+function accountTransferDivForm() {
+    return new FormBuilder('accountTransferForm')
+        .addDatePicker('acct_txfr_frm_date', 'date', 'Date')
+        .addCurrency('acct_txfr_frm_amount', 'amount', 'Amount', { helpBlock: 'Transfer amount relative to from account; must be positive.' })
+        .addLabelToValueSelect('acct_txfr_frm_budget', 'budget', 'Budget', active_budget_names_to_id, 'None', true)
+        .addLabelToValueSelect('acct_txfr_frm_from_account', 'from_account', 'From Account', acct_names_to_id, 'None', true)
+        .addLabelToValueSelect('acct_txfr_frm_to_account', 'to_account', 'To Account', acct_names_to_id, 'None', true)
+        .addText('acct_txfr_frm_notes', 'notes', 'Notes')
         .render();
 }
 
 /**
- * Show the modal popup for transferring between budgets.
- * Uses :js:func:`budgetTransferDivForm` to generate the form.
+ * Show the modal popup for transferring between accounts.
+ * Uses :js:func:`accountTransferDivForm` to generate the form.
  *
  * @param {string} txfr_date - The date, as a "yyyy-mm-dd" string, to default
  *  the form to. If null or undefined, will default to
  *  ``BIWEEKLYBUDGET_DEFAULT_DATE``.
  */
-function budgetTransferModal(txfr_date) {
+function accountTransferModal(txfr_date) {
     if (txfr_date === undefined || txfr_date === null) {
       txfr_date = isoformat(BIWEEKLYBUDGET_DEFAULT_DATE);
     }
     $('#modalBody').empty();
-    $('#modalBody').append(budgetTransferDivForm());
-    $('#budg_txfr_frm_date').val(txfr_date);
-    $('#budg_txfr_frm_date_input_group').datepicker({
+    $('#modalBody').append(accountTransferDivForm());
+    $('#acct_txfr_frm_date').val(txfr_date);
+    $('#acct_txfr_frm_date_input_group').datepicker({
         todayBtn: "linked",
         autoclose: true,
         todayHighlight: true,
         format: 'yyyy-mm-dd'
     });
     $('#modalSaveButton').off();
     $('#modalSaveButton').click(function() {
-        handleForm('modalBody', 'budgetTransferForm', '/forms/budget_transfer', null);
+        handleForm('modalBody', 'accountTransferForm', '/forms/account_transfer', null);
     }).show();
-    $('#modalLabel').text('Budget Transfer');
-    $('#budg_txfr_frm_account option[value=' + default_account_id + ']').prop('selected', 'selected').change();
+    $('#modalLabel').text('Account Transfer');
     $("#modalDiv").modal('show');
 }

biweeklybudget/flaskapp/templates/accounts.html

@@ -10,6 +10,18 @@
         {% for name in min_pay_class_names|sort %}
         min_pay_class_names["{{ name }}"] = "{{ name }}";
         {% endfor %}
+        var acct_names_to_id = {};
+        {% for name in accts.keys()|sort %}
+        acct_names_to_id["{{ name }}"] = "{{ accts[name] }}";
+        {% endfor %}
+        var budget_names_to_id = {};
+        {% for id in budgets.keys()|sort %}
+        budget_names_to_id["{{ budgets[id] }}"] = "{{ id }}";
+        {% endfor %}
+        var active_budget_names_to_id = {};
+        {% for id in active_budgets.keys()|sort %}
+        active_budget_names_to_id["{{ active_budgets[id] }}"] = "{{ id }}";
+        {% endfor %}
     </script>
 {% endblock %}
 {% block body %}
@@ -20,11 +32,12 @@
                         <div class="panel-heading">
                             <i class="fa fa-bank fa-fw"></i> Bank Accounts
                             <button type="button" class="btn btn-primary btn-xs btn_add_account" id="btn_add_acct_bank">Add Account</button>
+                            <button type="button" class="btn btn-primary btn-xs btn_acct_txfr" id="btn_acct_txfr_bank">Transfer</button>
                         </div>
                         <!-- /.panel-heading -->
                         <div class="panel-body">
                             <div class="table-responsive">
-                                <table class="table table-bordered table-hover table-striped">
+                                <table class="table table-bordered table-hover table-striped" id="table-accounts-bank">
                                     <thead>
                                         <tr>
                                             <th>Account</th>
@@ -106,11 +119,12 @@
                         <div class="panel-heading">
                             <i class="glyphicon glyphicon-piggy-bank"></i> Investment Accounts
                             <button type="button" class="btn btn-primary btn-xs btn_add_account" id="btn_add_acct_invest">Add Account</button>
+                            <button type="button" class="btn btn-primary btn-xs btn_acct_txfr" id="btn_acct_txfr_invest">Transfer</button>
                         </div>
                         <!-- /.panel-heading -->
                         <div class="panel-body">
                             <div class="table-responsive">
-                                <table class="table table-bordered table-hover table-striped">
+                                <table class="table table-bordered table-hover table-striped" id="table-accounts-investment">
                                     <thead>
                                         <tr>
                                             <th>Account</th>
@@ -146,14 +160,21 @@
 {% include 'modal.html' %}
 {% endblock %}
 {% block extra_foot_script %}
+<!-- BootStrap DatePicker JS -->
+<script src="/utils/datetest.js"></script>
+<script src="/static/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
 <script src="/static/js/forms.js"></script>
 <script src="/static/js/formBuilder.js"></script>
 <script src="/static/js/accounts_modal.js"></script>
+<script src="/static/js/account_transfer_modal.js"></script>
 <script>
 $(document).ready(function() {
     $('.btn_add_account').click(function() {
         accountModal(null, null);
     });
+    $('.btn_acct_txfr').click(function() {
+        accountTransferModal();
+    });
 });
 /* BEGIN conditional default modal for /budgets/<id> */
 {% if account_id is defined and account_id is not none %}

biweeklybudget/flaskapp/templates/index.html

@@ -3,6 +3,20 @@
 {% block extra_head_css %}
     <!-- Morris Charts CSS -->
     <link href="/static/startbootstrap-sb-admin-2/vendor/morrisjs/morris.css" rel="stylesheet">
+    <script>
+        var acct_names_to_id = {};
+        {% for name in accts.keys()|sort %}
+        acct_names_to_id["{{ name }}"] = "{{ accts[name] }}";
+        {% endfor %}
+        var budget_names_to_id = {};
+        {% for id in budgets.keys()|sort %}
+        budget_names_to_id["{{ budgets[id] }}"] = "{{ id }}";
+        {% endfor %}
+        var active_budget_names_to_id = {};
+        {% for id in active_budgets.keys()|sort %}
+        active_budget_names_to_id["{{ active_budgets[id] }}"] = "{{ id }}";
+        {% endfor %}
+    </script>
 {% endblock %}
 {% block body %}
 {% include 'notifications.html' %}
@@ -95,11 +109,12 @@
                     <div class="panel panel-default" id="panel-bank-accounts">
                         <div class="panel-heading">
                             <i class="fa fa-bank fa-fw"></i> Bank Accounts
+                            <button type="button" class="btn btn-primary btn-xs btn_acct_txfr" id="btn_acct_txfr_bank">Transfer</button>
                         </div>
                         <!-- /.panel-heading -->
                         <div class="panel-body">
                             <div class="table-responsive">
-                                <table class="table table-bordered table-hover table-striped">
+                                <table class="table table-bordered table-hover table-striped" id="table-accounts-bank">
                                     <thead>
                                         <tr>
                                             <th>Account</th>
@@ -175,11 +190,12 @@
                     <div class="panel panel-default" id="panel-investment">
                         <div class="panel-heading">
                             <i class="glyphicon glyphicon-piggy-bank"></i> Investment Accounts
+                            <button type="button" class="btn btn-primary btn-xs btn_acct_txfr" id="btn_acct_txfr_invest">Transfer</button>
                         </div>
                         <!-- /.panel-heading -->
                         <div class="panel-body">
                             <div class="table-responsive">
-                                <table class="table table-bordered table-hover table-striped">
+                                <table class="table table-bordered table-hover table-striped" id="table-accounts-investment">
                                     <thead>
                                         <tr>
                                             <th>Account</th>
@@ -212,10 +228,24 @@
                 <!-- /.col-lg-4 -->
             </div>
             <!-- /.row -->
+{% include 'modal.html' %}
 {% endblock %}
 {% block extra_foot_script %}
     <!-- Morris Charts JavaScript -->
     <script src="/static/startbootstrap-sb-admin-2/vendor/raphael/raphael.min.js"></script>
     <script src="/static/startbootstrap-sb-admin-2/vendor/morrisjs/morris.min.js"></script>
     <script src="/static/js/index.js"></script>
+    <!-- BootStrap DatePicker JS -->
+    <script src="/utils/datetest.js"></script>
+    <script src="/static/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
+    <script src="/static/js/forms.js"></script>
+    <script src="/static/js/formBuilder.js"></script>
+    <script src="/static/js/account_transfer_modal.js"></script>
+    <script>
+    $(document).ready(function() {
+        $('.btn_acct_txfr').click(function() {
+            accountTransferModal();
+        });
+    });
+    </script>
 {% endblock %}