It seems the Audit logging for a Flow would have worked; however, because we do no persist the work objects this was not a viable solution.  The two alternatives are to attach an activity to perform the logging at each desired element, for say a button.  The other solution was to create a jQuery CSS selector binding an even handler function in turn calling a activity server side.

Hope this helps for those in similar scenarios.  I have pasted the code for the jQuery CSS Selector.  Please keep in mind this was done with IAC so some functions may have to be substituted:

// Referencing the jQuery library from Google CDN

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

// CSS Selectors using jQuery

<script type="text/javascript">

    // when the document and all resource finished downloading

    $(document).ready(function() {

        // select all input elements and attach to the click event handler

        $("input").click(function() {

                // an AJAX call.  These are the call handlers

                var pingCallbackObj = {

                    success: function(d) {

                        alert("success");

                    },

                    failure: function(d) {

                        alert("failure");

                    }

                };

  // the paramater data for the Activty

                var outData = "Message=" + encodeURIComponent("Click Event from UI Javascript" + $(this).attr("value"));

  // the class.activity

                var oSafeUrl = new SafeURL("VZW-FW-SaveSeqFW-Work.UIInteractionLog");

  // converting the URL

                var strNextUrl = oSafeUrl.toURL();

  // and making the call

                var request = pega.util.Connect.asyncRequest('POST', strNextUrl, pingCallbackObj, outData);

        });

    });

</script>

It seems the Audit logging for a Flow would have worked; however, because we do no persist the work objects this was not a viable solution.  The two alternatives are to attach an activity to perform the logging at each desired element, for say a button.  The other solution was to create a jQuery CSS selector binding an even handler function in turn calling a activity server side.

Hope this helps for those in similar scenarios.  I have pasted the code for the jQuery CSS Selector.  Please keep in mind this was done with IAC so some functions may have to be substituted:

// Referencing the jQuery library from Google CDN

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

// CSS Selectors using jQuery

<script type="text/javascript">

    // when the document and all resource finished downloading

    $(document).ready(function() {

        // select all input elements and attach to the click event handler

        $("input").click(function() {

                // an AJAX call.  These are the call handlers

                var pingCallbackObj = {

                    success: function(d) {

                        alert("success");

                    },

                    failure: function(d) {

                        alert("failure");

                    }

                };

  // the paramater data for the Activty

                var outData = "Message=" + encodeURIComponent("Click Event from UI Javascript" + $(this).attr("value"));

  // the class.activity

                var oSafeUrl = new SafeURL("VZW-FW-SaveSeqFW-Work.UIInteractionLog");

  // converting the URL

                var strNextUrl = oSafeUrl.toURL();

  // and making the call

                var request = pega.util.Connect.asyncRequest('POST', strNextUrl, pingCallbackObj, outData);

        });

    });

</script>