Search code examples
javascriptnode.jshandlebars.jspugbraintree

How to convert a template from jade to HBS?


I am not too familiar with the jade template language, but quite familiar with handle bars. I need to use hbs because my project is based on hbs.

I have the following the braintree payment for nodejs express, and their view was based on jade. https://github.com/braintree/braintree_express_example/blob/master/views/checkouts/new.jade

    form#payment-form(action="/checkouts", method="post")
      section
        .bt-drop-in-wrapper
          #bt-dropin

        label(for="amount")
          span.input-label Amount
          .input-wrapper.amount-wrapper
            input#amount(name="amount" type="tel" min="1" placeholder="Amount" value="10")

      button.button(type="submit")
        span Test Transaction

  script(src="https://js.braintreegateway.com/js/braintree-2.27.0.min.js")
  script.
    (function () {
      var checkout = new Demo({
        formID: 'payment-form'
      });

      var token = "#{clientToken}";
      braintree.setup(token, "dropin", {
        container: "bt-dropin"
      });

Below is my router

router.post('/', parseUrlEnconded, function (request, response) {

  var transaction = request.body;

  gateway.transaction.sale({
    amount: 7,
    paymentMethodNonce: transaction.payment_method_nonce
  }, function (err, result) {

    if (err) throw err;

    if (result.success) {
     [...]

I essentially want the payment form to be shown in view, and the payment_method_nonce value submitted to the server


Solution

  • Use jade-to-handlebars, which is a nodejs module to do exactly what you ask.