Remote transaction form

app/assets/javascripts/transactions.coffee

@@ -1,17 +0,0 @@
-# Place all the behaviors and hooks related to the matching controller here.
-# All this logic will automatically be available in application.js.
-# You can use CoffeeScript in this file: http://coffeescript.org/
-ready = ->
-  $("#new_transaction").on("ajax:success", (e, data, status, xhr) ->
-    console.log("success")
-  ).on("ajax:error", (e, xhr, status, error) ->
-    console.log(e)
-    console.log(xhr)
-    console.log("failed")
-  )
-$.ajaxSetup({
-  dataType: 'json'
-})
-
-$(document).ready(ready)
-$(document).on('page:load', ready)

app/assets/javascripts/transactions.js

@@ -0,0 +1,33 @@
+ready = function() {
+  form          = $("#new_transaction")
+  submit_button = $(form).find("input[type=submit]")
+  errors        = $("#transaction_errors")
+  panel_ul      = $(errors).find(".panel-body ul")
+  flash_success = $("#transaction_success")
+
+  $(form).on("ajax:before", function(xhr, settings) {
+    $(flash_success).addClass("hidden")
+    $(submit_button).val("Processing")
+    $(submit_button).attr('disabled', 'disabled');
+  }).on("ajax:success", function(data, status, xhr) {
+    $(flash_success).removeClass("hidden")
+    $(errors).addClass("hidden")
+    $(form)[0].reset()
+  }).on("ajax:error", function(xhr, status, error) {
+    $(errors).removeClass("hidden")
+    $(panel_ul).empty()
+    $.each(JSON.parse(status.responseText), function(index, val) {
+      $(panel_ul).append("<li>" + val + "</li>")
+    })
+  }).on("ajax:complete", function(xhr, status) {
+    $(submit_button).val("Send it")
+    $(submit_button).attr('disabled', false);
+  })
+}
+
+$.ajaxSetup({
+  dataType: 'text'
+})
+
+$(document).ready(ready)
+$(document).on('page:load', ready)

app/controllers/application_controller.rb

@@ -18,6 +18,6 @@ class ApplicationController < ActionController::Base
   def current_ability
     @current_ability ||=
       current_client.try { |c| ClientAbility.new(c) } ||
-      Ability.new(current_user)
+      ClientAbility.new(current_user)
   end
 end

app/controllers/transactions_controller.rb

@@ -4,6 +4,7 @@ class TransactionsController < ApplicationController
 
   before_action :authenticate_user!, except: :create
   before_action :authenticate_user_or_client!, only: :create
+  respond_to :js, only: :create
 
   def index
     @transactions = Transaction.all

app/controllers/users_controller.rb

@@ -4,7 +4,9 @@ class UsersController < ApplicationController
   def show
     @user = User.find(params[:id])
     respond_to do |format|
-      format.html
+      format.html do
+        @transaction = Transaction.new
+      end
       format.json do
         datatable = DataTable.new(@user, params)
         render json: datatable.json

app/helpers/transactions_helper.rb

@@ -1,2 +1,5 @@
 module TransactionsHelper
+  def amount a
+    a.zero? ? nil : number_with_precision(a/100.0, precision: 2)
+  end
 end

app/models/client_ability.rb

@@ -1,4 +1,4 @@
-class Ability
+class ClientAbility
   include CanCan::Ability
 
   def initialize(client)

app/models/user_ability.rb

@@ -1,4 +1,4 @@
-class Ability
+class UserAbility
   include CanCan::Ability
 
   def initialize(user)

app/views/layouts/application.html.haml

@@ -14,8 +14,6 @@
             - if current_user
               %li.pure-menu-item
                 = link_to current_user.name.capitalize, current_user, class: "pure-menu-link"
-              %li.pure-menu-item
-                = link_to "New Transaction", new_transaction_path, class: "pure-menu-link"
             - else
               = link_to "Sign in", user_omniauth_authorize_path(:zeuswpi), class: "pure-menu-link" unless current_user
       .pure-u-1

app/views/partials/_form_errors.html.haml

@@ -1,10 +1,6 @@
-- if object.errors.any?
+#transaction_errors.panel.panel-error.hidden
-  .panel.panel-error
   .panel-header
     %h3.panel-title
       This transaction could not be saved.
   .panel-body
     %ul
-        - object.errors.full_messages.each do |tr|
-          %li
-            = tr

app/views/transactions/_new.html.haml

@@ -1,4 +1,7 @@
+#transaction_success.pure-alert.pure-alert-success.hidden
+  Transaction created!
 = render 'partials/form_errors', object: @transaction
+
 = form_for @transaction, remote: true, html: { class: "pure-form" } do |f|
   - if current_user.penning
     = f.collection_select :debtor, User.all, :name, :name,
@@ -13,7 +16,7 @@
   = f.text_field :message, placeholder: "Message", size: 75
   -# = f.text_field :message, required: true, placeholder: "Message", size: 75
   %fieldset.pure-group-inline
-    %span.euro.pure-group-addon
+    %span.icon-euro.pure-group-addon
     = f.number_field :euros, value: amount(@transaction.amount),
         placeholder: "Bedrag", step: 0.01, min: 0.01, class: "pure-group-addon price", size: 20
     -# placeholder: "Bedrag", step: 0.01, min: 0.01, class: "pure-group-addon price", size: 20, required: true

app/views/users/show.html.haml

@@ -1,5 +1,7 @@
 %h2= @user.name
 
+= render 'transactions/new'
+
 .panel.panel-default.data-table-filters
   .panel-header
     %h3.panel-title Filters

config/routes.rb

@@ -5,6 +5,6 @@ Rails.application.routes.draw do
 
   root to: 'high_voltage/pages#show', id: "landing"
 
-  resources :transactions, only: [:new, :index, :create]
+  resources :transactions, only: [:index, :create]
   resources :users, only: [:show, :index]
 end