Update rule controller to have some auto complete functionality.

public/js/ff/rules/create-edit.js

@@ -11,25 +11,47 @@
 var triggerCount = 0;
 var actionCount = 0;
 
+/**
+ * This method triggers when a new trigger must be added to the form.
+ */
 function addNewTrigger() {
     "use strict";
     triggerCount++;
 
+    // get the HTML for the new trigger
     $.getJSON('json/trigger', {count: triggerCount}).done(function (data) {
+
+        // append it:
         $('tbody.rule-trigger-tbody').append(data.html);
 
+        // update all "remove trigger"-buttons so they will respond correctly
+        // and remove the trigger.
         $('.remove-trigger').unbind('click').click(function (e) {
             removeTrigger(e);
 
             return false;
         });
 
+        // update all "select trigger type" dropdown buttons so they will respond correctly
+        $('select[name^="rule-trigger["]').unbind('change').change(function (e) {
+            var target = $(e.target);
+            updateTriggerAutoComplete(target)
+        });
+
+        // update all "select trigger type" dropdowns
+        // so the accompanying text-box has the correct autocomplete.
+        onAddNewTrigger();
+
+
     }).fail(function () {
         alert('Cannot get a new trigger.');
     });
 
 }
 
+/**
+ * Method triggers when a new action must be added to the form..
+ */
 function addNewAction() {
     "use strict";
     actionCount++;
@@ -49,6 +71,11 @@ function addNewAction() {
     });
 }
 
+/**
+ * Method fires when a trigger must be removed from the form.
+ *
+ * @param e
+ */
 function removeTrigger(e) {
     "use strict";
     var target = $(e.target);
@@ -64,6 +91,11 @@ function removeTrigger(e) {
     }
 }
 
+/**
+ * Method fires when an action must be removed from the form.
+ *
+ * @param e
+ */
 function removeAction(e) {
     "use strict";
     var target = $(e.target);
@@ -79,6 +111,72 @@ function removeAction(e) {
     }
 }
 
+/**
+ * Method fires when a new trigger is added. It will update ALL trigger value input fields.
+ */
+function onAddNewTrigger() {
+    "use strict";
+    console.log('updateTriggerAutoComplete');
+    $.each($('.rule-trigger-holder'), function (i, v) {
+        var holder = $(v);
+        var select = holder.find('select');
+        console.log('Now at input #' + i);
+        updateTriggerAutoComplete(select);
+    });
+}
+
+/**
+ * Creates a nice auto complete trigger depending on the type of the select list value thing.
+ *
+ * @param selectList
+ */
+function updateTriggerAutoComplete(selectList) {
+    // the actual row this select list is in:
+    var parent = selectList.parent().parent();
+    // the text input we're looking for:
+    var input = parent.find('input[name^="rule-trigger-value["]');
+    switch (selectList.val()) {
+        default:
+            input.typeahead('destroy');
+            console.log('Cannot or will not add autocomplete to "' + selectList.val() + '"');
+            break;
+        case 'from_account_starts':
+        case 'from_account_ends':
+        case 'from_account_is':
+        case 'from_account_contains':
+        case 'to_account_starts':
+        case 'to_account_ends':
+        case 'to_account_is':
+        case 'to_account_contains':
+            createAutoComplete(input, 'json/all-accounts');
+            break;
+        case 'transaction_type':
+            createAutoComplete(input, 'json/transaction-types');
+            break;
+        case 'description_starts':
+        case 'description_ends':
+        case 'description_contains':
+        case 'description_is':
+            createAutoComplete(input, 'json/transaction-journals/all');
+            break;
+    }
+}
+
+/**
+ * Create actual autocomplete
+ * @param input
+ * @param URI
+ */
+function createAutoComplete(input, URI) {
+    console.log('Will create auto-complete for "' + URI + '".');
+    input.typeahead('destroy');
+    $.getJSON(URI).done(function (data) {
+        input.typeahead({source: data});
+        console.log('Created new auto-complete!');
+    });
+
+}
+
 function testRuleTriggers() {
     "use strict";