payment app
This commit is contained in:
parent
b14b3d2803
commit
6223f4a1ef
15 changed files with 379 additions and 101 deletions
|
|
@ -4,7 +4,8 @@
|
|||
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
|
||||
<link href="membership.css" rel="stylesheet" type="text/css">
|
||||
{% load static %}
|
||||
<link href="{% get_static_prefix %}membership.css" rel="stylesheet" type="text/css">
|
||||
</head><body>
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
|
|
@ -19,8 +20,15 @@
|
|||
<h2 class="text-center text-muted">Your membership is almost ready!</h2>
|
||||
<h5 class="text-center text-muted">If this is correct information, click CONFIRM</h5>
|
||||
<br>
|
||||
<h4 class="text-center text-muted">Name: Nico Schottelius</h4>
|
||||
<h4 class="text-center text-muted">Email: nico.schottelius@digitalglarus.ch</h4>
|
||||
<h4 class="text-center text-muted">Name: {{ name }}</h4>
|
||||
|
||||
{% if email %}
|
||||
<h4 class="text-center text-muted">Email: {{ email }}</h4>
|
||||
{% else %}
|
||||
<script type="text/javascript">
|
||||
|
||||
</script>
|
||||
{% endif %}
|
||||
<h4 class="text-center text-muted">Membership requested for:
|
||||
<br><br>01.01.2016-31.12.2016</h4>
|
||||
<br>
|
||||
|
|
@ -30,12 +38,12 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12 text-center">
|
||||
<p class="text-center text-muted">Have probelm? Contact
|
||||
<p class="text-center text-muted">Have problem? Contact
|
||||
<a href="">help@digitalglarus.ch.</a>
|
||||
<br>
|
||||
</p>
|
||||
<a class="btn btn-primary">GO BACK</a>
|
||||
<a class="btn btn-primary">CONFIRM</a>
|
||||
<a class="btn btn-primary" href="{% url 'reset' time=request.session.time %}">GO BACK</a>
|
||||
<a class="btn btn-primary" href='.'>CONFIRM</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,66 +1,104 @@
|
|||
<html><head>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
|
||||
<link href="membership.css" rel="stylesheet" type="text/css">
|
||||
</head><body>
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<script type="text/javascript"
|
||||
src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
|
||||
<script type="text/javascript"
|
||||
src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
|
||||
<script type="text/javascript">
|
||||
Stripe.setPublishableKey('{{ stripe_key }}');
|
||||
var stripeResponseHandler = function (status, response) {
|
||||
var $form = $('#payment-form');
|
||||
if (response.error) {
|
||||
debugger;
|
||||
// Show the errors on the form
|
||||
$form.find('.payment-errors').text(response.error.message);
|
||||
$form.find('button').prop('disabled', false);
|
||||
} else {
|
||||
// token contains id, last4, and card type
|
||||
var token = response.id;
|
||||
// Insert the token into the form so it gets submitted to the server
|
||||
$form.append($('<input type="hidden" name="stripeToken" />').val(token));
|
||||
// and re-submit
|
||||
$form.get(0).submit();
|
||||
}
|
||||
};
|
||||
jQuery(function ($) {
|
||||
$('#payment-form').submit(function (e) {
|
||||
var $form = $(this);
|
||||
m_y = $("#id_expiry_date").val().split("/")
|
||||
// Disable the submit button to prevent repeated clicks
|
||||
$form.find('button').prop('disabled', true);
|
||||
Stripe.card.createToken({
|
||||
number: $("#id_card_number").val(),
|
||||
cvc: $("#id_ccv").val(),
|
||||
exp_month:m_y[0],
|
||||
exp_year:m_y[1]
|
||||
}, stripeResponseHandler);
|
||||
// Prevent the form from submitting with the default action
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css"
|
||||
rel="stylesheet" type="text/css">
|
||||
{% load static %}
|
||||
<link href="{% get_static_prefix %}membership.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-2"></div>
|
||||
<div class="col-md-8">
|
||||
<h3 class="text-left text-muted">Payment details</h3>
|
||||
<hr>
|
||||
<div class="page-header text-muted" contenteditable="true">
|
||||
<h5>1 Year coworking membership (360 CHF)</h5>
|
||||
<h5> +2 free working days included (0 CHF)</h5>
|
||||
<div class="page-header text-muted">
|
||||
<h5>Valid 01.01.2016 - 31.12.2016 </h5>
|
||||
<h5>Coworker Name : Nico Schottelius </h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page-header text-muted">
|
||||
<h3 class="text-right">Total : 360 CHF</h3>
|
||||
</div>
|
||||
<form role="form">
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="exampleInputEmail1">Name*</label>
|
||||
<input class="form-control" id="exampleInputEmail1" placeholder="Enter name on card" type="email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="exampleInputPassword1">Card Number*</label>
|
||||
<input class="form-control" id="exampleInputPassword1" placeholder="Card Number" type="text">
|
||||
</div>
|
||||
</form>
|
||||
<form role="form">
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="exampleInputEmail1">Expiry Date*</label>
|
||||
<input class="form-control" id="exampleInputEmail1" placeholder="MM/YY" type="email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="exampleInputPassword1">CCV*</label>
|
||||
<input class="form-control" id="exampleInputPassword1" placeholder="CVV" type="password">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-block btn-primary">Submit</button>
|
||||
</form>
|
||||
<a class="btn btn-block btn-info">Cancel</a>
|
||||
</div>
|
||||
<div class="col-md-2"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-11">
|
||||
<br>
|
||||
<p class="text-center text-muted">Have probelm? Contact
|
||||
<a href="">help@digitalglarus.ch.</a>
|
||||
<br>
|
||||
<br>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-2"></div>
|
||||
<div class="col-md-8">
|
||||
<h3 class="text-left text-muted">Payment details</h3>
|
||||
<hr>
|
||||
<div class="page-header text-muted" contenteditable="true">
|
||||
<h5>{{ time }} coworking membership ({{ price }} CHF)</h5>
|
||||
<h5> +{{ free }} free working days included (0 CHF)</h5>
|
||||
|
||||
</body></html>
|
||||
<div class="page-header text-muted">
|
||||
<h5>Valid 01.01.2016 - 31.12.2016 </h5>
|
||||
<h5>Coworker Name : {{ name }} </h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page-header text-muted">
|
||||
<h3 class="text-right">Total : {{ price }} CHF</h3>
|
||||
</div>
|
||||
<form id="payment-form" role="form" method="post">
|
||||
<div class="payment-error"></div>
|
||||
{% csrf_token %}
|
||||
{% for field in form %}
|
||||
<div class="form-group">
|
||||
<label class="control-label">{{ field.label }}*</label>
|
||||
{{ field }}
|
||||
{% for error in field.errors %}
|
||||
{{ error|striptags }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<button type="submit" class="btn btn-block btn-primary">Submit</button>
|
||||
</form>
|
||||
<a class="btn btn-block btn-info">Cancel</a>
|
||||
</div>
|
||||
<div class="col-md-2"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-11">
|
||||
<br>
|
||||
|
||||
<p class="text-center text-muted">Have probelm? Contact
|
||||
<a href="">help@digitalglarus.ch.</a>
|
||||
<br>
|
||||
<br>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -2,12 +2,16 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"
|
||||
<script type="text/javascript"
|
||||
src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
|
||||
<script type="text/javascript"
|
||||
src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css"
|
||||
rel="stylesheet"
|
||||
type="text/css">
|
||||
{% load static %}
|
||||
<link href="{% get_static_prefix %}membership.css" rel="stylesheet" type="text/css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="section">
|
||||
|
|
@ -24,6 +28,8 @@
|
|||
<a href="">help@digitalglarus.ch</a>
|
||||
</p>
|
||||
|
||||
<p>{{ msg }}</p>
|
||||
|
||||
<p></p>
|
||||
</div>
|
||||
<a hrefhelp@digitalglarus.ch<="" p="">
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@
|
|||
for coworking. It is a perfect try-out package!
|
||||
<br>
|
||||
</p>
|
||||
<a class="btn btn-primary">Buy Now</a>
|
||||
<a class="btn btn-primary" href="/login/buy/month/">Buy Now</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -98,7 +98,7 @@
|
|||
membership.
|
||||
<br>
|
||||
</p>
|
||||
<a class="btn btn-primary">Buy Now</a>
|
||||
<a class="btn btn-primary" href="/login/buy/year/">Buy Now</a>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<img src="https://unsplash.imgix.net/photo-1413834932717-29e7d4714192?w=1024&q=50&fm=jpg&s=d9d6cbc32dd4968d0c21e331436a6af6" class="img-responsive">
|
||||
|
|
|
|||
|
|
@ -21,6 +21,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -8,13 +8,27 @@
|
|||
type="text/css">
|
||||
<link href="http://pingendo.github.io/pingendo-bootstrap/themes/default/bootstrap.css" rel="stylesheet"
|
||||
type="text/css">
|
||||
{% if request.session.next == None %}
|
||||
<script>
|
||||
type = "text/javascript" >
|
||||
setTimeout(function () {
|
||||
window.location.href = "/";
|
||||
}, 5000);
|
||||
</script>
|
||||
{% endif %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<h1 class="text-center text-muted">You're successfully validated!</h1>
|
||||
<h3 class="text-center text-muted">
|
||||
{% if msg == 'succeeded' %}
|
||||
Thank You for Your payment!<br> <p>redirecting...</p>
|
||||
{% else %}
|
||||
Your payment was not processed correctly.<br> Reason: {{ msg }}
|
||||
{% endif %}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue