-
-
- Success! -
-- Information successfully updated. -
+
+
+
+
+
+
+
+
+ + Direct Deposit & Pay +
+Manage your direct deposit accounts and payment settings
+
+
+
-
+
+
+
+
+
+
+
+
+ Success!
+Information successfully updated.
+
+
+
+
+
+
+ Error!
+Failed to update. Please try again.
+
-
-
-
-
- - Error! -
-- Failed to update. -
-
-
-
-
+
-
-
- Direct Deposit
-
-
-
-
- <%= form_tag "#", {:class => "form-horizontal", :id => "bank_info_form" } do %>
-
+
-
- <%= text_field_tag :bank_account_num, params[:bank_account_num], {:placeholder => "Bank Account Number"} %>
- #
-
-
-
- <%= text_field_tag :bank_routing_num, params[:bank_routing_num], {:placeholder => "Bank Routing Number"} %>
- #
-
-
-
-
- <%= text_field_tag :dd_percent, params[:dd_percent], {:placeholder => "Percentage of Deposit"} %>
- %
-
-
-
- <%= submit_tag "Submit", {:id => "dd_form_btn", :style => "margin-left: 10px;", :class => "btn btn-medium btn-primary"} %>
- <% end %>
-
+
+
+
+
@@ -151,9 +253,8 @@
a user to delete that direct deposit entry
*/
function buildDeleteLink(dd_id){
- var link = '' +
- ''+
- ''
+ var link = '' +
+ ' Delete'
return link
};
@@ -165,13 +266,12 @@ function parseDirectDepostInfo(response){
var msg = jQuery.parseJSON(JSON.stringify(response));
$.each(msg.user, function(index, val){
$('#data_table').dataTable().fnAddData( [
- val.bank_account_num,
- val.bank_routing_num,
- val.percent_of_deposit,
- buildDeleteLink(val.id)
+ '
+
+
+ + Add Direct Deposit +
+Set up a new account
+
+ <%= form_tag "#", { class: "needs-validation", id: "bank_info_form" } do %>
+
-
-
-
-
+
+
-
+ <%= text_field_tag :bank_account_num, params[:bank_account_num], {
+ placeholder: "Enter account number",
+ class: "form-control"
+ } %>
+
+
+
+ Your bank account number
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Accounts
-
-
-
-
-
-
-
-
- | - Encrypted Bank Account Number - <%=link_to "#", { :style => "color:#AA6F93", :id => "encrypted_acct_question"} do %> - - - - <% end %> - | -- Bank Routing Number - | -- Percentage of Deposit - | -- Action - | -
|---|
-
-
-
+
+
+
-
+
+
+
-
+
-
-
- Decrypt Bank Account Number
-
-
-
+
- <%= form_tag "#", {:class => "form-horizontal", :id => "decrypt_form" } do %>
-
-
-
-
- <%= text_field_tag :value_to_decrypt, params[:value_to_decrypt], {:placeholder => "Bank Account Number"} %>
- #
-
-
-
- <%= submit_tag "Submit", {:id => "decrypt_btn", :style => "margin-left: 10px;", :class => "btn btn-medium btn-primary"} %>
- <% end %>
-
+
+
+
+
+ <%= text_field_tag :bank_routing_num, params[:bank_routing_num], {
+ placeholder: "Enter routing number",
+ class: "form-control"
+ } %>
+
+
+
+ 9-digit routing number
+
+
+
+
+ <%= text_field_tag :dd_percent, params[:dd_percent], {
+ placeholder: "e.g., 100",
+ class: "form-control"
+ } %>
+ %
+
+ What percentage to deposit (1-100)
+
+ <%= submit_tag "Add Account", {
+ id: "dd_form_btn",
+ class: "btn btn-success btn-lg"
+ } %>
+
+
+
+
+
+ Secure: All account information is encrypted
+
+
+ <% end %>
+
+
+
+
+ + Decrypt Account Number +
+View unencrypted account number
+
+ <%= form_tag "#", { class: "needs-validation", id: "decrypt_form" } do %>
+
+
+
+
+
+
+ <%= text_field_tag :value_to_decrypt, params[:value_to_decrypt], {
+ placeholder: "Paste encrypted value",
+ class: "form-control"
+ } %>
+
+
+
+
+ Copy from the table on the right
+
+ <%= submit_tag "Decrypt", {
+ id: "decrypt_btn",
+ class: "btn btn-warning btn-lg"
+ } %>
+
+
+
+
+
+ Decryption is for your convenience and security verification
+
+
+ <% end %>
+
+
-
+
+
+
+
+
+
+
+
+
+
+ + Direct Deposit Accounts +
+Your configured bank accounts
+
+
+
+
+
+
+
+ | + Encrypted Account Number + | ++ Routing Number + | ++ Deposit % + | ++ Actions + | +
|---|
+
+
+
+
+
+
+
+ + Instant Access +
++ Your paycheck is deposited directly into your account on payday. +
+
+
+
+
+
+
+
+ + Secure & Encrypted +
++ All banking information is encrypted using industry-standard security. +
+
+
+
+
+
+
+ + Split Deposits +
++ Allocate different percentages of your pay to multiple accounts. +
+' + val.bank_account_num + '',
+ '' + val.bank_routing_num + '',
+ '' + val.percent_of_deposit + '%',
+ buildDeleteLink(val.id)
] );
});
-
};
/*
@@ -198,7 +298,10 @@ function populateTable() {
*/
function createDataTable(){
$('#data_table').dataTable({
- "sPaginationType": "full_numbers"
+ "sPaginationType": "full_numbers",
+ "language": {
+ "emptyTable": "No direct deposit accounts configured yet"
+ }
});
};
@@ -206,12 +309,12 @@ function createDataTable(){
This function doesn't really work right now but is supposed to offer the user a
"delete confirmation" message
*/
-$('.delete-row').click(function () {
- var conf = confirm('Continue delete?');
- if (conf) $(this).parents('tr').fadeOut(function () {
- $(this).remove();
- });
+$(document).on('click', '.delete-row', function (e) {
+ var conf = confirm('Are you sure you want to delete this account?');
+ if (!conf) {
+ e.preventDefault();
return false;
+ }
});
/*
@@ -220,7 +323,27 @@ $('.delete-row').click(function () {
*/
function decryptShow(response){
var msg = jQuery.parseJSON(JSON.stringify(response));
- alert("Decrypted Account Number: " + msg.account_num);
+
+ // Modern alert using Bootstrap modal-like appearance
+ var alertHtml = '' +
+ '
';
+
+ $('body').append(alertHtml);
+
+ // Auto-remove after 5 seconds
+ setTimeout(function() {
+ $('.alert').fadeOut(function() {
+ $(this).remove();
+ });
+ }, 5000);
};
/*
@@ -239,6 +362,7 @@ $("#decrypt_btn").click(function(event){
success: function(response) {
$('#success').show(500).delay(1500).fadeOut();
decryptShow(response);
+ $('#decrypt_form')[0].reset();
},
error: function(event) {
$('#failure').show(500).delay(1500).fadeOut();
@@ -260,6 +384,7 @@ $("#dd_form_btn").click(function(event) {
type: "POST",
success: function(response) {
$('#success').show(500).delay(1500).fadeOut();
+ $('#bank_info_form')[0].reset();
populateTable();
},
error: function(event) {
@@ -270,10 +395,27 @@ $("#dd_form_btn").click(function(event) {
$("#encrypted_acct_question").click(function(event) {
event.preventDefault();
- alert("For your safety your account number is stored encrypted as well as presented to you \nin an encrypted form.\n\n" +
- "For your convenience, you can decrypt your bank account number at any time using our\n" +
- "conveniently located decryption function."
- )
+
+ // Create modern Bootstrap modal-like alert
+ var modalHtml = '' +
+ '' +
+ '
' +
+ '' +
+ '' +
+ '
' +
+ 'Decrypted Account Number
' + + '' + msg.account_num + '
' + + '' +
+ '
';
+
+ $('body').append(modalHtml);
});
/*
@@ -288,10 +430,65 @@ function makeActive(){
2) createDataTable - Initializes the dataTable as such
3) populateTable - populates the newly initialized dataTable
*/
-$(document).ready(
- makeActive,
- createDataTable(),
- populateTable()
- )
+$(document).ready(function() {
+ makeActive();
+ createDataTable();
+ populateTable();
+});
+
+// Handle Turbolinks page loads
+$(document).on('turbolinks:load', function() {
+ makeActive();
+});
+
+
' +
+ '
' +
+ '' +
+ '
' +
+ '' +
+ '
' +
+ 'Why Are Account Numbers Encrypted?
' + + '' + + '' +
+ '
' +
+ 'For your safety, your account number is stored encrypted in our database and presented to you in an encrypted form.
' + + 'For your convenience, you can decrypt your bank account number at any time using our conveniently located decryption function.
' + + '' +
+ '' +
+ '
' +
+ '