Merge pull request #510 from ungleich/tiwariav-task/3808/dcl_order_confirm

Task/3808 dcl order confirmation redesign

datacenterlight/locale/de/LC_MESSAGES/django.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2017-09-29 19:59+0000\n"
+"POT-Creation-Date: 2017-10-01 22:13+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -388,24 +388,6 @@ msgstr "Weiter"
 msgid "Enter your credit card number"
 msgstr "Deine Kreditkartennummer"
 
-msgid "Confirm Order"
-msgstr "Bestellung Bestätigen"
-
-msgid "Date"
-msgstr "Datum"
-
-msgid "Billed To:"
-msgstr "Rechnungsadresse"
-
-msgid "Payment Method:"
-msgstr "Bezahlmethode"
-
-msgid "ending in"
-msgstr "endend in"
-
-msgid "Order summary"
-msgstr "Bestellungsübersicht"
-
 #, python-format
 msgid ""
 "By clicking \"Place order\" this plan will charge your credit card account "
@@ -417,21 +399,6 @@ msgstr ""
 msgid "Place order"
 msgstr "Bestellen"
 
-msgid "Processing..."
-msgstr "Abarbeitung..."
-
-msgid "Hold tight, we are processing your request"
-msgstr "Bitte warten - wir verbeiten Deine Anfrage gerade"
-
-msgid "OK"
-msgstr ""
-
-msgid "Close"
-msgstr ""
-
-msgid "Some problem encountered. Please try again later."
-msgstr "Ein Problem ist aufgetreten. Bitte versuche es später noch einmal."
-
 msgid "Thank you for order! Our team will contact you via email"
 msgstr ""
 "Vielen Dank für die Bestellung. Unser Team setzt sich sobald wie möglich mit "
@@ -525,6 +492,9 @@ msgstr "Ungültige RAM-Grösse"
 msgid "Invalid storage size"
 msgstr "Ungültige Speicher-Grösse"
 
+msgid "Confirm Order"
+msgstr "Bestellung Bestätigen"
+
 msgid "Error."
 msgstr ""
 
@@ -532,8 +502,8 @@ msgid ""
 "There was a payment related error. On close of this popup, you will be "
 "redirected back to the payment page."
 msgstr ""
-"Es ist ein Fehler bei der Zahlung betreten. Du wirst nach dem "
+"Es ist ein Fehler bei der Zahlung betreten. Du wirst nach dem Schliessen vom "
-"Schliessen vom Popup zur Bezahlseite weitergeleitet."
+"Popup zur Bezahlseite weitergeleitet."
 
 msgid "Thank you for the order."
 msgstr "Danke für Deine Bestellung."
@@ -545,6 +515,30 @@ msgstr ""
 "Deine VM ist gleich bereit. Wir senden Dir eine Bestätigungsemail, sobald Du "
 "auf sie zugreifen kannst."
 
+#~ msgid "Date"
+#~ msgstr "Datum"
+
+#~ msgid "Billed To:"
+#~ msgstr "Rechnungsadresse"
+
+#~ msgid "Payment Method:"
+#~ msgstr "Bezahlmethode"
+
+#~ msgid "ending in"
+#~ msgstr "endend in"
+
+#~ msgid "Order summary"
+#~ msgstr "Bestellungsübersicht"
+
+#~ msgid "Processing..."
+#~ msgstr "Abarbeitung..."
+
+#~ msgid "Hold tight, we are processing your request"
+#~ msgstr "Bitte warten - wir verbeiten Deine Anfrage gerade"
+
+#~ msgid "Some problem encountered. Please try again later."
+#~ msgstr "Ein Problem ist aufgetreten. Bitte versuche es später noch einmal."
+
 #~ msgid "We are cutting down the costs significantly!"
 #~ msgstr "Wir sorgen dafür, dass die Kosten für Dich signifikant abnehmen"
 

datacenterlight/static/datacenterlight/css/landing-page.css

@@ -1501,6 +1501,8 @@ tech-sub-sec h2 {
     font-size: 14px;
     font-weight: 300;
     letter-spacing: 2px;
+    line-height: 24px;
+    display: block;
 }
 
 .content-section-a {

datacenterlight/templates/datacenterlight/index.html

@@ -16,7 +16,7 @@
                         <hr class="intro-divider">
                         <ul class="list-inline intro-social-buttons">
                             <li>
-                                <a class="btn btn-default btn-lg btn-transparent url" href="#how"><i class="#Services"></i> <span class="network-name">{% trans "Highlights" %}</span></a>
+                                <a class="btn btn-default btn-lg btn-transparent url" href="#how"><span class="network-name">{% trans "Highlights" %}</span></a>
                             </li>
                             <li>
                                 <a class="btn btn-primary btn-lg page-scroll url" href="#price"><span class="network-name">{% trans "I want it!" %}</span></a>

datacenterlight/templates/datacenterlight/order_detail.html

@@ -1,143 +1,24 @@
-{% extends "hosting/base_short.html" %}
+{% extends "hosting/order_detail.html" %}
-{% load staticfiles bootstrap3 %}
 {% load i18n %}
-{% load custom_tags %}
 
 {% block navbar %}
     {% include "datacenterlight/includes/_navbar.html" %}
 {% endblock navbar %}
 
-{% block content %}
+{% block submit_btn %}
+  <form id="virtual_machine_create_form" action="" method="POST">
+      {% csrf_token %}
+      <div class="row">
+          <div class="col-sm-8">
+              <div class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month{% endblocktrans %}.</div>
+          </div>
+          <div class="col-sm-4 order-confirm-btn text-right">
+              <button class="btn choice-btn" id="btn-create-vm"
+                      data-toggle="modal" data-target="#createvm-modal">
+				{% trans "Place order" %}
+              </button>
+          </div>
+      </div>
+  </form>
+{% endblock submit_btn %}
 
-<div class="order-detail-container">
-   {% if messages %}
-        <div class="row">
-            <div class="col-xs-12 col-md-8 col-md-offset-2">
-                <br/>
-                <div class="alert alert-warning">
-                    {% for message in messages %}
-                    <span>{{ message }}</span>
-                    {% endfor %}
-                </div>
-            </div>
-        </div>
-    {% endif %}
-    {% if not error %}
-        <div class="row">
-            <div class="col-xs-12 col-md-8 col-md-offset-2">
-                <div class="invoice-title">
-                    <h2>{% trans "Confirm Order"%}</h2>
-                </div>
-                <hr>
-                <div class="row">
-                    <div class="col-xs-12 col-sm-6 pull-right order-confirm-date">
-                        <address>
-                            <strong>{% trans "Date"%}:</strong><br>
-                            <span id="order-created_at">{% now "Y-m-d H:i" %}</span><br><br>
-                        </address>
-                    </div>
-                    <div class="col-xs-12 col-sm-6">
-                        <address>
-                        <h3><b>{% trans "Billed To:"%}</b></h3>
-                        {% with billing_address_data as billing_address %}
-                            {{billing_address.cardholder_name}}<br> {{billing_address.street_address}}, {{billing_address.postal_code}}<br>
-                            {{billing_address.city}}, {{billing_address.country}}.
-                        {% endwith %}
-                        </address>
-                    </div>
-                </div>
-                <div class="row">
-                    <div class="col-xs-6">
-                        <address>
-                            <strong>{% trans "Payment Method:"%}</strong><br>
-                                {{cc_brand}} {% trans "ending in" %} **** {{cc_last4}}<br>
-                                {{request.session.user.email}}
-                        </address>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="row">
-            <div class="col-md-8 col-md-offset-2">
-                <h3><b>{% trans "Order summary"%}</b></h3>
-                <hr>
-                <div class="content">
-                    {% with request.session.specs as vm %}
-                        <p><b>{% trans "Cores"%}</b> <span class="pull-right">{{vm.cpu}}</span></p>
-                        <hr>
-                        <p><b>{% trans "Memory"%}</b> <span class="pull-right">{{vm.memory}} GB</span></p>
-                        <hr>
-                        <p><b>{% trans "Disk space"%}</b> <span class="pull-right">{{vm.disk_size}} GB</span></p>
-                        <hr>
-                        <p><b>{% trans "Configuration"%}</b> <span class="pull-right">{{request.session.template.name}}</span></p>
-                        <hr>
-                        <h4>{% trans "Total"%}<p class="pull-right"><b>{{vm.price}} CHF</b><span class="dcl-price-month"> /{% trans "Month" %}</span></p></h4>
-                    {% endwith %}
-                </div>
-                <br/>
-                <form method="post" id="virtual_machine_create_form">
-                    {% csrf_token %}
-                    <div class="row">
-                        <div class="col-sm-8">
-                            <p class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month{% endblocktrans %}.</p>
-                        </div>
-                        <div class="col-sm-4 content">
-                            <button class="btn btn-info pull-right"
-                                    id="btn-create-vm"
-                                    data-href="{% url 'hosting:order-confirmation' %}"
-                                    data-toggle="modal"
-                                    data-target="#createvm-modal">
-                                {% trans "Place order"%}
-                            </button>
-                        </div>
-                    </div>
-                </form>
-            </div>
-        </div>
-    {% endif %}
-</div>
-<!-- Create VM Modal -->
-<div class="modal fade" id="createvm-modal" tabindex="-1" role="dialog"
-     aria-hidden="true" data-backdrop="static" data-keyboard="false">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-header">
-                <button type="button" class="close hidden" data-dismiss="modal"
-                        aria-label="create-vm-close">
-                    <span aria-hidden="true">&times;</span>
-                </button>
-            </div>
-            <div class="modal-body">
-                <div class="modal-icon">
-                    <i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
-                    <span class="sr-only">{% trans "Processing..." %}</span>
-                </div>
-                <h4 class="modal-title" id="createvm-modal-title">
-                </h4>
-                <div class="modal-text" id="createvm-modal-body">
-                    {% trans "Hold tight, we are processing your request" %}
-                </div>
-                <div class="modal-footer">
-                    <a id="createvm-modal-done-btn" class="btn btn-success btn-ok btn-wide hide" href="">{% trans "OK" %}</a>
-                    <button id="createvm-modal-close-btn" type="button" class="btn btn-danger btn-ok btn-wide hide" data-dismiss="modal" aria-label="create-vm-close">{% trans "Close" %}</button>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-<!-- / Create VM Modal -->
-
-
-<script type="text/javascript">
-    {% trans "Some problem encountered. Please try again later." as err_msg %}
-    var create_vm_error_message = '{{err_msg|safe}}.';
-
-    window.onload = function () {
-        var locale_date = moment.utc(document.getElementById("order-created_at").textContent,'YYYY-MM-DD HH:mm').toDate();
-        locale_date =  moment(locale_date).format("YYYY-MM-DD h:mm:ss a");
-        document.getElementById('order-created_at').innerHTML = locale_date;
-    };
-
-</script>
-{%endblock%}

datacenterlight/views.py

@@ -463,6 +463,8 @@ class OrderConfirmationView(DetailView):
             'site_url': reverse('datacenterlight:index'),
             'cc_last4': card_details.get('response_object').get('last4'),
             'cc_brand': card_details.get('response_object').get('brand'),
+            'vm': request.session.get('specs'),
+            'page_header_text': _('Confirm Order'),
             'billing_address_data': request.session.get('billing_address_data')
         }
         return render(request, self.template_name, context)

hosting/locale/de/LC_MESSAGES/django.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2017-10-01 20:57+0000\n"
+"POT-Creation-Date: 2017-10-01 22:12+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -331,8 +331,8 @@ msgstr "Alle Benachrichtigungen"
 msgid "%(page_header_text)s"
 msgstr ""
 
-msgid "Invoice Date"
+msgid "Date"
-msgstr "Rechnung Datum"
+msgstr "Datum"
 
 msgid "Status"
 msgstr ""
@@ -355,6 +355,9 @@ msgstr "Bezahlmethode"
 msgid "ending in"
 msgstr "endend in"
 
+msgid "Credit Card"
+msgstr "Kreditkarte"
+
 msgid "Order summary"
 msgstr "Bestellungsübersicht"
 
@@ -362,7 +365,7 @@ msgid "Product"
 msgstr "Produkt"
 
 msgid "Period"
-msgstr ""
+msgstr "Periode"
 
 msgid "Cores"
 msgstr "Prozessorkerne"
@@ -408,9 +411,6 @@ msgstr "Ein Problem ist aufgetreten. Bitte versuche es später noch einmal."
 msgid "Order Nr."
 msgstr "Bestellung Nr."
 
-msgid "Date"
-msgstr "Datum"
-
 msgid "Amount"
 msgstr "Betrag"
 
@@ -435,9 +435,6 @@ msgstr "inkl. Mehrwertsteuer"
 msgid "Billing Address"
 msgstr "Rechnungsadresse"
 
-msgid "Credit Card"
-msgstr "Kreditkarte"
-
 msgid ""
 "\n"
 "                                Please fill in your credit card information "
@@ -696,8 +693,8 @@ msgid ""
 "There was a payment related error. On close of this popup, you will be "
 "redirected back to the payment page."
 msgstr ""
-"Es ist ein Fehler bei der Zahlung betreten. Du wirst nach dem "
+"Es ist ein Fehler bei der Zahlung betreten. Du wirst nach dem Schliessen vom "
-"Schliessen vom Popup zur Bezahlseite weitergeleitet"
+"Popup zur Bezahlseite weitergeleitet"
 
 msgid "Thank you for the order."
 msgstr "Danke für Deine Bestellung."
@@ -736,8 +733,12 @@ msgid "Virtual Machine Cancellation"
 msgstr "VM Kündigung"
 
 msgid "There was an error processing your request. Please try again."
-msgstr "Es gab einen Fehler bei der Bearbeitung Deine Anfrage. Bitte"
+msgstr ""
-" versuche es noch einmal."
+"Es gab einen Fehler bei der Bearbeitung Deine Anfrage. Bitte versuche es "
+"noch einmal."
+
+#~ msgid "Invoice Date"
+#~ msgstr "Rechnung Datum"
 
 #~ msgid "VM %(VM_ID)s terminated successfully"
 #~ msgstr "VM %(VM_ID)s erfolgreich beendet"

hosting/templates/hosting/order_detail.html

@@ -17,10 +17,12 @@
             <h1 class="dashboard-title-thin">
                 <img src="{% static 'hosting/img/billing.svg' %}" class="un-icon">{% blocktrans with page_header_text=page_header_text|default:"Invoice" %}{{page_header_text}}{% endblocktrans %}
             </h1>
-            <div class="dashboard-container-options">
+            {% if order %}
-                <button type="button" class="btn-plain btn-pdf" data-target="#order-detail{{order.pk}}"><img src="{% static 'hosting/img/icon-pdf.svg' %}" class="svg-img"></button>
+                <div class="dashboard-container-options">
-                <button type="button" class="btn-plain btn-print"><img src="{% static 'hosting/img/icon-print.svg' %}" class="svg-img"></button>
+                    <button type="button" class="btn-plain btn-pdf" data-target="#order-detail{{order.pk}}"><img src="{% static 'hosting/img/icon-pdf.svg' %}" class="svg-img"></button>
-            </div>
+                    <button type="button" class="btn-plain btn-print"><img src="{% static 'hosting/img/icon-print.svg' %}" class="svg-img"></button>
+                </div>
+            {% endif %}
         </div>
         <div class="order-details">
             {% if order %}
@@ -29,7 +31,7 @@
                 </p>
             {% endif %}
             <p>
-                <strong>{% trans "Invoice Date" %}:</strong>
+                <strong>{% trans "Date" %}:</strong>
                 <span id="order-created_at">
                     {% if order %}
                         {{order.created_at|date:'Y-m-d H:i'}}
@@ -80,8 +82,7 @@
                         {{order.last4}}<br>
                         {{user.email}}
                     {% else %}
-                        {{cc_brand|default:'Card'}} {% trans "ending in" %} ****
+                        {{cc_brand|default:_('Credit Card')}} {% trans "ending in" %} ****{{cc_last4}}<br>
-                        {{cc_last4}}<br>
                         {% if request.user.is_authenticated %}
                             {{request.user.email}}
                         {% else %}
@@ -94,7 +95,12 @@
             <div>
                 <h4>{% trans "Order summary" %}</h4>
                 <p>
-                    <strong>{% trans "Product" %}:</strong> {{vm.name}}
+                    <strong>{% trans "Product" %}:</strong>&nbsp;
+                    {% if vm.name %}
+                        {{ vm.name }}
+                    {% else %}
+                        {{ request.session.template.name }}
+                    {% endif %}
                 </p>
                 <div class="row">
                     <div class="col-sm-6">
@@ -132,19 +138,21 @@
             {% endif %}
         </div>
         {% if not order %}
-            <form method="post" id="virtual_machine_create_form">
+            {% block submit_btn %}
-                {% csrf_token %}
+                <form method="post" id="virtual_machine_create_form">
-                <div class="row">
+                    {% csrf_token %}
-                    <div class="col-sm-8">
+                    <div class="row">
-                        <div class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month{% endblocktrans %}.</div>
+                        <div class="col-sm-8">
+                            <div class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month{% endblocktrans %}.</div>
+                        </div>
+                        <div class="col-sm-4 order-confirm-btn text-right">
+                            <button class="btn choice-btn" id="btn-create-vm" data-href="{% url 'hosting:order-confirmation' %}" data-toggle="modal" data-target="#createvm-modal">
+                                {% trans "Place order" %}
+                            </button>
+                        </div>
                     </div>
-                    <div class="col-sm-4 order-confirm-btn text-right">
+                </form>
-                        <button class="btn choice-btn" id="btn-create-vm" data-href="{% url 'hosting:order-confirmation' %}" data-toggle="modal" data-target="#createvm-modal">
+            {% endblock submit_btn %}
-                            {% trans "Place order" %}
-                        </button>
-                    </div>
-                </div>
-            </form>
         {% endif %}
     {% endif %}
 </div>
@@ -197,8 +205,10 @@
 {%endblock%}
 
 {% block js_extra %}
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script>
+    {% if order %}
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script>
-    <script src="{% static 'hosting/js/html2pdf.js' %}"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
-    <script src="{% static 'hosting/js/order.js' %}"></script>
+        <script src="{% static 'hosting/js/html2pdf.js' %}"></script>
+        <script src="{% static 'hosting/js/order.js' %}"></script>
+    {% endif %}
 {% endblock js_extra %}

hosting/views.py

@@ -686,6 +686,11 @@ class OrdersHostingDetailView(LoginRequiredMixin,
                 context['vm'] = vm_detail.__dict__
                 context['vm']['name'] = '{}-{}'.format(
                     context['vm']['configuration'], context['vm']['vm_id'])
+                context['vm']['price'] = get_vm_price(
+                    cpu=context['vm']['cores'],
+                    disk_size=context['vm']['disk_size'],
+                    memory=context['vm']['memory']
+                )
             except VMDetail.DoesNotExist:
                 try:
                     manager = OpenNebulaManager(

utils/stripe_utils.py

@@ -28,28 +28,34 @@ def handleStripeError(f):
             body = e.json_body
             err = body['error']
             response.update({'error': err['message']})
+            logger.error(str(e))
             return response
         except stripe.error.RateLimitError as e:
             response.update(
                 {'error': "Too many requests made to the API too quickly"})
             return response
         except stripe.error.InvalidRequestError as e:
+            logger.error(str(e))
             response.update({'error': "Invalid parameters"})
             return response
         except stripe.error.AuthenticationError as e:
             # Authentication with Stripe's API failed
             # (maybe you changed API keys recently)
+            logger.error(str(e))
             response.update({'error': common_message})
             return response
         except stripe.error.APIConnectionError as e:
+            logger.error(str(e))
             response.update({'error': common_message})
             return response
         except stripe.error.StripeError as e:
             # maybe send email
+            logger.error(str(e))
             response.update({'error': common_message})
             return response
         except Exception as e:
             # maybe send email
+            logger.error(str(e))
             response.update({'error': common_message})
             return response