Page 1 of 1

understanding Paymill

Posted: Mon Jun 08, 2015 10:13 am
by gautamz07
hey guys ,

how are u doing ? i needed a small help from you . recently i got a opportunity to work on my first backend project , its for a website that accepts payments from customers in sweden, i will be using laravel 5 for this projects backend .

I have been given a little study material for this project , i need to undertsand how PAYMILL works (its a payment gateway) , see here https://developers.paymill.com/en/intro ... tructions/ . now i tried the 1st example in the introduction part , you can see the first example on git here https://github.com/gautamz07/paymill-integration


The HTML in the first example is as follows :

Code: Select all

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
  <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap.no-responsive.no-icons.min.css">
  <script type="text/javascript">c
      var PAYMILL_PUBLIC_KEY = '<YOUR_PAYMILL_PUBLIC_KEY>';
  </script>
</head>
<body>
  <div class="container span8">
    <!-- START: Payment form -->
    <div class="controls">
      <div class="span4">
        <div class="payment-errors text-error"></div>
      </div>
    </div>
    <div class="clearfix"></div>
    <div class="well span5">
      <div class="controls controls-row">
        <div class="btn-group span4">
          <button id="btn-paymenttype-cc"  class="paymenttype btn btn-primary disabled" value="cc" translate="iframe">Kreditkarte</button>
          <button id="btn-paymenttype-elv" class="paymenttype btn" value="elv" translate="iframe">ELV</button>
          <button id="btn-paymenttype-iban" class="paymenttype btn" value="elv" translate="iframe">IBAN/BIC</button>
        </div><br /><br />
      </div>
 
      <form id="payment-form" action="request.php" method="POST">
        <div class="clearfix"></div>
 
        <div id="payment-form-cc" class="payment-input">
          <input class="card-amount-int" type="hidden" value="15"/>
          <input class="card-currency" type="hidden" value="EUR"/>
          <div class="controls controls-row">
            <div class="span3"><label>Card number</label>
                <input class="card-number span3" type="text" size="20" value="4111111111111111"/>
            </div>
            <div class="span1"><label>CVC</label>
                <input class="card-cvc span1" type="text" size="4" value="111"/>
            </div>
          </div>
          <div class="controls">
            <div class="span4">
              <label>Card holder</label>
              <input class="card-holdername span4" type="text" size="20" value="Max Mustermann"/>
            </div>
          </div>
          <div class="controls">
            <div class="span3">
              <label>Valid until (MM/YYYY)</label>
              <input class="card-expiry-month span1" type="text" size="2" value="12"/>
              <span> / </span>
              <input class="card-expiry-year span1" type="text" size="4" value="2015"/>
            </div>
          </div>
        </div>
 
        <div id="payment-form-elv" class="payment-input" style="display: none;">
          <div class="controls">
            <div class="span3">
              <label>Account holder</label>
              <input class="elv-holdername span3" type="text" size="20" value="Max Mustermann"/>
            </div>
          </div>
          <div class="controls controls-row">
            <div class="span3"><label>Account number</label>
                <input class="elv-account span3" type="text" size="20" value="1234567890"/>
            </div>
          </div>
          <div class="controls">
            <div class="span3">
              <label>Bank code</label>
              <input class="elv-bankcode span3" type="text" size="20" value="40050150"/>
            </div>
          </div>
        </div>
 
        <div id="payment-form-iban" class="payment-input" style="display: none;">
          <div class="controls">
            <div class="span3">
              <label translate="iframe">Kontoinhaber</label>
              <input class="ibanbic-holdername span3" type="text" size="20" value="Max Mustermann"/>
            </div>
          </div>
          <div class="controls controls-row">
            <div class="span3"><label translate="iframe">IBAN</label>
                <input class="iban span3" type="text" size="27" value="DE12 3456 7890 1234 5678 90"/>
            </div>
          </div>
          <div class="controls">
            <div class="span3">
              <label translate="iframe">BIC</label>
              <input class="bic span3" type="text" size="20" value="MARKDEF1100"/>
            </div>
          </div>
        </div>
 
        <div class="controls">
          <div class="span3">
            <button class="submit-button btn btn-primary" type="submit">Buy now</button>
          </div>
        </div>
      </form>
    </div>
    <!-- END: Payment form -->
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
  <script src="https://bridge.paymill.com/"></script>
  <script language="javascript" type="text/javascript">
      $(document).ready(function () {
          function PaymillResponseHandler(error, result) {
              if (error) {
                  // Show the error message above the form
                  $(".payment-errors").text(error.apierror);
              } else {
                  $(".payment-errors").text("");
                  var form = $("#payment-form");
                  // Token
                  var token = result.token;
                  // Insert token into the payment form
                  form.append("<input type='hidden' name='paymillToken' value='" + token + "'/>");
                  form.get(0).submit();
              }
              $(".submit-button").removeAttr("disabled");
          }
 
          $("#payment-form").submit(function (event) {
              // Deactivate the submit button to avoid further clicks
              $('.submit-button').attr("disabled", "disabled");
              if (false == paymill.validateCardNumber($('.card-number').val())) {
                  $(".payment-errors").text("Invalid card number");
                  $(".submit-button").removeAttr("disabled");
                  return false;
              }
 
              if (false == paymill.validateExpiry($('.card-expiry-month').val(), $('.card-expiry-year').val())) {
                  $(".payment-errors").text("Invalid date of expiry");
                  $(".submit-button").removeAttr("disabled");
                  return false;
              }
              
              try{
                  if (false == paymill.validateIban($('.iban').val())) {
                      $(".payment-errors").text("Invalid IBAN");
                      $(".submit-button").removeAttr("disabled");
                      return false;
                  }
              } catch(e) {
                  $(".payment-errors").text("IBAN: Invalid country");
                  $(".submit-button").removeAttr("disabled");
                  return false;
              }

              if (false == paymill.validateBic($('.bic').val())) {
                  $(".payment-errors").text("Invalid BIC");
                  $(".submit-button").removeAttr("disabled");
                  return false;
              }
 
              var method = 'cc';
                if (jQuery('#btn-paymenttype-elv').hasClass('btn-primary')) method = 'elv';
                if (jQuery('#btn-paymenttype-iban').hasClass('btn-primary')) method = 'iban/bic';
 
                switch (method) {
                    case "cc":
                        var params = {
                            amount:         $('.card-amount-int').val(),
                            currency:       $('.card-currency').val(),
                            number:         $('.card-number').val(),
                            exp_month:      $('.card-expiry-month').val(),
                            exp_year:       $('.card-expiry-year').val(),
                            cvc:            $('.card-cvc').val(),
                            cardholder:     $('.card-holdername').val()
                        };
                        break;
 
                    case "elv":
                        var params = {
                            number:         $('.elv-account').val(),
                            bank:           $('.elv-bankcode').val(),
                            accountholder:  $('.elv-holdername').val()
                        };
                        break;
 
                    case "iban/bic":
                        var params = {
                            iban:           $('.iban').val(),
                            bic:            $('.bic').val(),
                            accountholder:  $('.ibanbic-holdername').val()
                        };
                        break;
              }
              paymill.createToken(params, PaymillResponseHandler);
 
              return false;
          });
 
          // Toggle buttons and forms
         $(".paymenttype").click(function() {
            if (jQuery(this).hasClass('btn-primary')) return;
 
            jQuery('.paymenttype').removeClass('btn-primary');
            jQuery(this).addClass('btn-primary');
            var index = jQuery('.paymenttype').index(this);
 
            jQuery('.payment-input').hide();
            jQuery('.payment-input').eq(index).show();
        });
      });
  </script>
</body>
</html>
and the PHP is as follows :

Code: Select all

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" 
              content="text/html; charset=utf-8"/>
        <link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet">
        <?php

        // Please download the newest version of our Paymill PHP Wrapper at
        // https://github.com/paymill/paymill-php/releases and put it into a folder where it can be autoloaded
        // or
        // Download the newest stable version via composer "paymill/paymill": "v3.*" on packagist.org
        // https://packagist.org/packages/paymill/paymill
        
        define('PAYMILL_API_KEY', '<YOUR_PAYMILL_PRIVATE_KEY>');
        
        if (isset($_POST['paymillToken'])) {
            $token = $_POST['paymillToken'];
            $request = new Paymill\Request(PAYMILL_API_KEY);
            $transaction = new Paymill\Models\Request\Transaction();
            $transaction->setAmount(4200) // e.g. "4200" for 42.00 EUR
                        ->setCurrency('EUR')
                        ->setToken($token)
                        ->setDescription('Test Transaction');
        
            $response = $request->create($transaction);
        }
        ?>
    </head>
    <body>
        <div class="container">
            <h1>We appreciate your purchase!</h1>
 
            <h4>Transaction:</h4> 
            <pre>
               <?php print_r($response); ?>
            </pre>
        </div>
        <script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
    </body>
</html>
now there are a few pre-requisites for this to work , as stated in the documentation :
pre-requisites below.

1. Paymill Private Key
2. Paymill PHP Wrapper (zip)
3. cURL extension for PHP

my question is about the 2nd requirement , on the github repo(https://github.com/Paymill/Paymill-PHP# ... th-paymill) of Paymill php wrapper ,i see the following .

=================================================================
Please include this library via Composer in your composer.json and execute composer update to refresh the autoload.php.
==================================================================

so does that mean that in the root directory of my project where i have my html and php file , i add a composer.JSON file and add the following to the composer.JSON file .

Code: Select all

{
  "repositories": [
    {
      "type": "vcs",
      "url": "https://github.com/paymill/paymill-php"
    }
  ],
  "require": {
    "paymill/paymill": "dev-master"
  }
}


and then open the command line and cd to my project directory and then run composer update ?

Re: understanding Paymill

Posted: Mon Jun 08, 2015 10:36 am
by Celauran
If it's a Laravel project, you'll already have composer.json in your project directory. Just add the paymill requirements and composer update.

Re: understanding Paymill

Posted: Mon Jun 08, 2015 10:48 am
by gautamz07
hey celauran ! noo i am just trying plain php as of now ! . so what do i do ?

also before i run composer update do i have to cd to my project root directory ?

Re: understanding Paymill

Posted: Mon Jun 08, 2015 11:04 am
by Celauran
You'll run composer update from wherever your composer.json file is. Typically that's your project root, but it doesn't have to be. That sample composer.json should be all you need to get started, though I suspect you'll want to pull in other libraries as well, which you can simply add to the same file.

Re: understanding Paymill

Posted: Mon Jun 08, 2015 12:12 pm
by gautamz07
Thanks celauran.

Re: understanding Paymill

Posted: Mon Jun 08, 2015 12:42 pm
by Celauran
Also, FYI, it looks like they're on Packagist https://packagist.org/packages/paymill/paymill

Re: understanding Paymill

Posted: Mon Jun 08, 2015 12:52 pm
by gautamz07
superhelpful ! Thanks ..