Localhost Parse Payment Test

by qwweee7467

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://parse.com/downloads/javascript/parse/latest/min.js"></script>
<script src="https://js.braintreegateway.com/js/braintree-2.21.0.min.js"></script>
<div ng-controller="myParseCtrl">

  <h2>My Payment Form</h2>

  <form id="checkout" action="javascript:checkout(this)" method="post">
    <input data-braintree-name="number" value="4111111111111111">
    <input data-braintree-name="cvv" value="100">

    <!-- you can also split expiration date into two fields -->
    <input data-braintree-name="expiration_month" value="10">
    <input data-braintree-name="expiration_year" value="2020">

    <input data-braintree-name="postal_code" value="94107">
    <input data-braintree-name="cardholder_name" value="John Smith">

    <input type="submit" id="submit" value="Pay">
  </form>

  <p>
    <button ng-click="getCustomerDefaultPayment()">getCustomerDefaultPayment</button>
    <button ng-click="createTransaction()">createTransaction</button>
    <button ng-click="getTransaction()">getTransaction</button>
    <button ng-click="updatePaymentMethod()">updatePaymentMethod</button>
  </p>
  {{result}}
</div>

JavaScript

var app = angular.module("myParseApp", []);

var customerId = "89254940";
app.controller("myParseCtrl", function($scope, $filter) {
  // init Parse
  Parse.initialize("appId", "jsAPIKey");
  Parse.serverURL = 'https://localhost:9001/parse';

  // STEP 1 : get client token
  Parse.Cloud.run('getPaymentClientToken', {}).then(function(clientToken) {
    console.log("clientToken is;" + clientToken);
    // STEP 2: initialize client SDK
    braintree.setup(clientToken, "custom", {
      id: "checkout"
    });
  });


  // STEP 5: admin creates transaction
  $scope.createTransaction = function() {
    Parse.Cloud.run('createSettledTransaction', {
      amount: "10.00",
      paymentMethodToken: $scope.defaultPaymentMethod.token
    }).then(function(result) {
      $scope.transaction = result.transaction;
      var result = "Payment transaction successfully created";
      console.log(result);
      $scope.result = result;
      $scope.$apply();
    }).fail(function(err) {
      debugger;
    });
  };

  // STEP 4: admin retrieve payment method token 
  $scope.getCustomerDefaultPayment = function() {
    Parse.Cloud.run('getPaymentCustomer', {
      customerId: customerId // TODO: FILL THIS!!!
    }).then(function(customer) {
      $scope.defaultPaymentMethod = $filter('filter')(customer.paymentMethods, {
        default: true
      })[0];
      var result = "Default payment successfully retrieved";
      console.log(result);
      $scope.result = result;
      $scope.$apply();
    });
  };

  // STEP 6: client retrieves payment transaction
  $scope.getTransaction = function() {
    Parse.Cloud.run('getPaymentTransaction', {
      transactionId: $scope.transaction.id
    }).then(function(transaction) {
      var result = "Payment transaction successfully retrieved";
      console.log(result);
      $scope.result = result;
      $scope.$apply();
    }).fail(function(err) {
      debugger;
    });
  };

  // STEP 7: client updates payment method
 ...