datacenterlight invoice redesigned

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-16 14:09+0000\n"
+"POT-Creation-Date: 2017-09-26 01:02+0530\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"
@@ -336,35 +336,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 "
-"with the fee of %(vm_price)sCHF/month"
-msgstr ""
-"Wenn Du \"bestellen\" auswählst, wird Deine Kreditkarte mit %(vm_price)sCHF "
-"pro Monat belastet"
-
-msgid "Place order"
-msgstr "Bestellen"
-
 msgid "We are cutting down the costs significantly!"
 msgstr "Wir sorgen dafür, dass die Kosten für Dich signifikant abnehmen"
 
@@ -485,6 +456,34 @@ msgstr "ist kein gültiger Name"
 msgid "is not a proper email"
 msgstr "ist keine gültige E-Mailadresse"
 
+#~ 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"
+
+#~ msgid ""
+#~ "By clicking \"Place order\" this plan will charge your credit card "
+#~ "account with the fee of %(vm_price)sCHF/month"
+#~ msgstr ""
+#~ "Wenn Du \"bestellen\" auswählst, wird Deine Kreditkarte mit "
+#~ "%(vm_price)sCHF pro Monat belastet"
+
+#~ msgid "Place order"
+#~ msgstr "Bestellen"
+
 #~ msgid ""
 #~ "\n"
 #~ "Hi,\n"

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,106 +1,5 @@
-{% 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 %}
+{% endblock navbar %}
-
-{% block content %}
-
-    <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 request.session.billing_address_data as billing_address %}
-                                {{billing_address|get_value_from_dict:'cardholder_name'}}<br> {{billing_address|get_value_from_dict:'street_address'}}, {{billing_address|get_value_from_dict:'postal_code'}}<br>
-                                {{billing_address|get_value_from_dict:'city'}}, {{billing_address|get_value_from_dict:'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">
-                        {% 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">
-                                <a href="{{next_url}}" ><button class="btn btn-info pull-right">{% trans "Place order"%}</button></a>
-                            </div>
-                        </div>
-                    </form>
-                </div>
-            </div>
-        {% endif %}
-    </div>
-
-
-    <script type="text/javascript">
-
-        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

@@ -484,10 +484,10 @@ class OrderConfirmationView(DetailView):
 
     @cache_control(no_cache=True, must_revalidate=True, no_store=True)
     def get(self, request, *args, **kwargs):
-        if 'specs' not in request.session or 'user' not in request.session:
+        # if 'specs' not in request.session or 'user' not in request.session:
-            return HttpResponseRedirect(reverse('datacenterlight:index'))
+        #     return HttpResponseRedirect(reverse('datacenterlight:index'))
-        if 'token' not in request.session:
+        # if 'token' not in request.session:
-            return HttpResponseRedirect(reverse('datacenterlight:payment'))
+        #     return HttpResponseRedirect(reverse('datacenterlight:payment'))
         stripe_customer_id = request.session.get('customer')
         customer = StripeCustomer.objects.filter(id=stripe_customer_id).first()
         stripe_utils = StripeUtils()
@@ -503,7 +503,8 @@ class OrderConfirmationView(DetailView):
         context = {
             'site_url': reverse('datacenterlight:index'),
             'cc_last4': card_details.get('response_object').get('last4'),
-            'cc_brand': card_details.get('response_object').get('brand')
+            'cc_brand': card_details.get('response_object').get('brand'),
+            'vm': request.session.get('specs')
         }
         return render(request, self.template_name, context)
 

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 %}
@@ -198,8 +200,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 %}