merged master, fixed translation

Changelog

@@ -1,3 +1,15 @@
+1.1: 2017-08-24
+    * #3637: [datacenterlight, hosting] Added Stripe error handler
+    * #3695: [hosting] Applied new design for VM list in hosting
+    * #3565: [datacenterlight, hosting] Changed warning text color
+    * #3622: [datacenterlight] Moved the create vm xml-rpc call made in the DCL VM purchase flow into a celery asynchronous task
+             [datacenterlight] Added test for create vm celery task
+    * #3711: [hosting] Displayed all IPv4s and IPv6s in the VM list
+    * #3697: [hosting] Applied new design for VM detail page
+    * #3645: [hosting] Fixed navbar movement on modal popup
+    * #3698: [hosting] Applied new design for My Orders page
+    * #3737: [all] Corrected/added missing google analytics and reformated code, fixed broken head tag
+    * #3701: [datacenterlight] Enabled monthly Stripe subscriptions
 1.0.24: 2017-08-15
     * #3699: [datacenterlight] Added oneadmin ssh key by default to the created VM via DCL landing
     * #3687: [datacenterlight] Added the name of the customer as description field of the stripe metadata

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-08-03 03:10+0530\n"
+"POT-Creation-Date: 2017-08-24 11:28+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"
@@ -276,6 +276,19 @@ msgstr "Konfiguration"
 msgid "Total"
 msgstr ""
 
+#, fuzzy
+#| msgid "month"
+msgid "Month"
+msgstr "Monat"
+
+#, 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"
 

datacenterlight/migrations/0007_stripeplan.py

@@ -0,0 +1,22 @@
+# -*- coding: utf-8 -*-
+# Generated by Django 1.9.4 on 2017-08-16 19:47
+from __future__ import unicode_literals
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('datacenterlight', '0006_vmtemplate'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='StripePlan',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('stripe_plan_id', models.CharField(max_length=100, null=True)),
+            ],
+        ),
+    ]

datacenterlight/migrations/0008_auto_20170821_2024.py

@@ -0,0 +1,20 @@
+# -*- coding: utf-8 -*-
+# Generated by Django 1.9.4 on 2017-08-21 20:24
+from __future__ import unicode_literals
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('datacenterlight', '0007_stripeplan'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='stripeplan',
+            name='stripe_plan_id',
+            field=models.CharField(max_length=256, null=True),
+        ),
+    ]

datacenterlight/models.py

@@ -59,3 +59,15 @@ class VMTemplate(models.Model):
     def create(cls, name, opennebula_vm_template_id):
         vm_template = cls(name=name, opennebula_vm_template_id=opennebula_vm_template_id)
         return vm_template
+
+
+class StripePlan(models.Model):
+    """
+    A model to store Data Center Light's created Stripe plans
+    """
+    stripe_plan_id = models.CharField(max_length=256, null=True)
+
+    @classmethod
+    def create(cls, stripe_plan_id):
+        stripe_plan = cls(stripe_plan_id=stripe_plan_id)
+        return stripe_plan

datacenterlight/tasks.py

@@ -41,13 +41,15 @@ def retry_task(task, exception=None):
 
 
 @app.task(bind=True, max_retries=settings.CELERY_MAX_RETRIES)
-def create_vm_task(self, vm_template_id, user, specs, template, stripe_customer_id, billing_address_data,
+def create_vm_task(self, vm_template_id, user, specs, template,
+                   stripe_customer_id, billing_address_data,
                    billing_address_id,
-                   charge):
+                   charge, cc_details):
     vm_id = None
     try:
         final_price = specs.get('price')
-        billing_address = BillingAddress.objects.filter(id=billing_address_id).first()
+        billing_address = BillingAddress.objects.filter(
+            id=billing_address_id).first()
         customer = StripeCustomer.objects.filter(id=stripe_customer_id).first()
         # Create OpenNebulaManager
         manager = OpenNebulaManager(email=settings.OPENNEBULA_USERNAME,
@@ -89,9 +91,9 @@ def create_vm_task(self, vm_template_id, user, specs, template, stripe_customer_
             billing_address_user_form.is_valid()
             billing_address_user_form.save()
 
-        # Associate an order with a stripe payment
+        # Associate an order with a stripe subscription
         charge_object = DictDotLookup(charge)
-        order.set_stripe_charge(charge_object)
+        order.set_subscription_id(charge_object, cc_details)
 
         # If the Stripe payment succeeds, set order status approved
         order.set_approved()
@@ -114,7 +116,8 @@ def create_vm_task(self, vm_template_id, user, specs, template, stripe_customer_
             'subject': settings.DCL_TEXT + " Order from %s" % context['email'],
             'from_email': settings.DCL_SUPPORT_FROM_ADDRESS,
             'to': ['info@ungleich.ch'],
-            'body': "\n".join(["%s=%s" % (k, v) for (k, v) in context.items()]),
+            'body': "\n".join(
+                ["%s=%s" % (k, v) for (k, v) in context.items()]),
             'reply_to': [context['email']],
         }
         email = EmailMessage(**email_data)
@@ -124,11 +127,13 @@ def create_vm_task(self, vm_template_id, user, specs, template, stripe_customer_
         try:
             retry_task(self)
         except MaxRetriesExceededError:
-            msg_text = 'Finished {} retries for create_vm_task'.format(self.request.retries)
+            msg_text = 'Finished {} retries for create_vm_task'.format(
+                self.request.retries)
             logger.error(msg_text)
             # Try sending email and stop
             email_data = {
-                'subject': '{} CELERY TASK ERROR: {}'.format(settings.DCL_TEXT, msg_text),
+                'subject': '{} CELERY TASK ERROR: {}'.format(settings.DCL_TEXT,
+                                                             msg_text),
                 'from_email': settings.DCL_SUPPORT_FROM_ADDRESS,
                 'to': ['info@ungleich.ch'],
                 'body': ',\n'.join(str(i) for i in self.request.args)

datacenterlight/templates/datacenterlight/order_detail.html

@@ -67,14 +67,17 @@
                             <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></p></h4>
+                            <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=" content pull-right">
+                    <div class="col-md-8 col-xs-7 pull-left tbl-no-padding">
-                        <a href="{{next_url}}" ><button class="btn btn-info">{% trans "Place order"%}</button></a>
+                        <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-md-4 col-xs-5 content tbl-no-padding">
+                        <a href="{{next_url}}" ><button class="btn btn-info pull-right">{% trans "Place order"%}</button></a>
                     </div>
                     </form>
                 </div>

datacenterlight/tests.py

@@ -1,3 +1,145 @@
 # from django.test import TestCase
 
+from time import sleep
+
+import stripe
+from celery.result import AsyncResult
+from django.conf import settings
+from django.core.management import call_command
 # Create your tests here.
+from django.test import TestCase, override_settings
+from model_mommy import mommy
+
+from datacenterlight.models import VMTemplate
+from datacenterlight.tasks import create_vm_task
+from membership.models import StripeCustomer
+from opennebula_api.serializers import VMTemplateSerializer
+from utils.models import BillingAddress
+from utils.stripe_utils import StripeUtils
+
+
+class CeleryTaskTestCase(TestCase):
+    @override_settings(
+        task_eager_propagates=True,
+        task_always_eager=True,
+    )
+    def setUp(self):
+        self.customer_password = 'test_password'
+        self.customer_email = 'celery-createvm-task-test@ungleich.ch'
+        self.customer_name = "Monty Python"
+        self.user = {
+            'email': self.customer_email,
+            'name': self.customer_name
+        }
+        self.customer = mommy.make('membership.CustomUser')
+        self.customer.set_password(self.customer_password)
+        self.customer.email = self.customer_email
+        self.customer.save()
+        self.stripe_utils = StripeUtils()
+        stripe.api_key = settings.STRIPE_API_PRIVATE_KEY_TEST
+        self.token = stripe.Token.create(
+            card={
+                "number": '4111111111111111',
+                "exp_month": 12,
+                "exp_year": 2022,
+                "cvc": '123'
+            },
+        )
+        # Run fetchvmtemplates so that we have the VM templates from
+        # OpenNebula
+        call_command('fetchvmtemplates')
+
+    def test_create_vm_task(self):
+        """Tests the create vm task for monthly subscription
+
+        This test is supposed to validate the proper execution
+        of celery create_vm_task on production, as we have no
+        other way to do this.
+        """
+
+        # We create a VM from the first template available to DCL
+        vm_template = VMTemplate.objects.all().first()
+        template_data = VMTemplateSerializer(vm_template).data
+
+        # The specs of VM that we want to create
+        specs = {
+            'cpu': 1,
+            'memory': 2,
+            'disk_size': 10,
+            'price': 15
+        }
+
+        stripe_customer = StripeCustomer.get_or_create(
+            email=self.customer_email,
+            token=self.token)
+        card_details = self.stripe_utils.get_card_details(
+            stripe_customer.stripe_id,
+            self.token)
+        card_details_dict = card_details.get('response_object')
+        billing_address = BillingAddress(
+            cardholder_name=self.customer_name,
+            postal_code='1232',
+            country='CH',
+            street_address='Monty\'s Street',
+            city='Hollywood')
+        billing_address.save()
+        billing_address_data = {'cardholder_name': self.customer_name,
+                                'postal_code': '1231',
+                                'country': 'CH',
+                                'token': self.token,
+                                'street_address': 'Monty\'s Street',
+                                'city': 'Hollywood'}
+
+        billing_address_id = billing_address.id
+        vm_template_id = template_data.get('id', 1)
+
+        cpu = specs.get('cpu')
+        memory = specs.get('memory')
+        disk_size = specs.get('disk_size')
+        amount_to_be_charged = (cpu * 5) + (memory * 2) + (disk_size * 0.6)
+        plan_name = "{cpu} Cores, {memory} GB RAM, {disk_size} GB SSD".format(
+            cpu=cpu,
+            memory=memory,
+            disk_size=disk_size)
+
+        stripe_plan_id = StripeUtils.get_stripe_plan_id(cpu=cpu,
+                                                        ram=memory,
+                                                        ssd=disk_size,
+                                                        version=1,
+                                                        app='dcl')
+        stripe_plan = self.stripe_utils.get_or_create_stripe_plan(
+            amount=amount_to_be_charged,
+            name=plan_name,
+            stripe_plan_id=stripe_plan_id)
+        subscription_result = self.stripe_utils.subscribe_customer_to_plan(
+            stripe_customer.stripe_id,
+            [{"plan": stripe_plan.get(
+                'response_object').stripe_plan_id}])
+        stripe_subscription_obj = subscription_result.get('response_object')
+        # Check if the subscription was approved and is active
+        if stripe_subscription_obj is None or \
+                        stripe_subscription_obj.status != 'active':
+            msg = subscription_result.get('error')
+            raise Exception("Creating subscription failed: {}".format(msg))
+
+        async_task = create_vm_task.delay(vm_template_id, self.user,
+                                          specs,
+                                          template_data,
+                                          stripe_customer.id,
+                                          billing_address_data,
+                                          billing_address_id,
+                                          stripe_subscription_obj,
+                                          card_details_dict)
+        new_vm_id = 0
+        res = None
+        for i in range(0, 10):
+            sleep(5)
+            res = AsyncResult(async_task.task_id)
+            if res.result is not None and res.result > 0:
+                new_vm_id = res.result
+                break
+
+        # We expect a VM to be created within 50 seconds
+        self.assertGreater(new_vm_id, 0,
+                           "VM could not be created. res._get_task_meta() = {}"
+                           .format(res._get_task_meta()))

datacenterlight/views.py

@@ -18,7 +18,8 @@ from hosting.models import HostingOrder
 from utils.stripe_utils import StripeUtils
 from membership.models import CustomUser, StripeCustomer
 from opennebula_api.models import OpenNebulaManager
-from opennebula_api.serializers import VirtualMachineTemplateSerializer, VMTemplateSerializer
+from opennebula_api.serializers import VirtualMachineTemplateSerializer, \
+    VMTemplateSerializer
 from datacenterlight.tasks import create_vm_task
 
 
@@ -35,9 +36,11 @@ class SuccessView(TemplateView):
         elif 'token' not in request.session:
             return HttpResponseRedirect(reverse('datacenterlight:payment'))
         elif 'order_confirmation' not in request.session:
-            return HttpResponseRedirect(reverse('datacenterlight:order_confirmation'))
+            return HttpResponseRedirect(
+                reverse('datacenterlight:order_confirmation'))
         else:
-            for session_var in ['specs', 'user', 'template', 'billing_address', 'billing_address_data',
+            for session_var in ['specs', 'user', 'template', 'billing_address',
+                                'billing_address_data',
                                 'token', 'customer']:
                 if session_var in request.session:
                     del request.session[session_var]
@@ -53,7 +56,8 @@ class PricingView(TemplateView):
             templates = manager.get_templates()
 
             context = {
-                'templates': VirtualMachineTemplateSerializer(templates, many=True).data,
+                'templates': VirtualMachineTemplateSerializer(templates,
+                                                              many=True).data,
             }
         except:
             messages.error(request,
@@ -77,7 +81,8 @@ class PricingView(TemplateView):
         manager = OpenNebulaManager()
         template = manager.get_template(template_id)
 
-        request.session['template'] = VirtualMachineTemplateSerializer(template).data
+        request.session['template'] = VirtualMachineTemplateSerializer(
+            template).data
 
         if not request.user.is_authenticated():
             request.session['next'] = reverse('hosting:payment')
@@ -99,7 +104,8 @@ class BetaAccessView(FormView):
 
     def form_valid(self, form):
         context = {
-            'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host())
+            'base_url': "{0}://{1}".format(self.request.scheme,
+                                           self.request.get_host())
         }
 
         email_data = {
@@ -129,7 +135,8 @@ class BetaAccessView(FormView):
         email = BaseEmail(**email_data)
         email.send()
 
-        messages.add_message(self.request, messages.SUCCESS, self.success_message)
+        messages.add_message(self.request, messages.SUCCESS,
+                             self.success_message)
         return render(self.request, 'datacenterlight/beta_success.html', {})
 
 
@@ -154,7 +161,8 @@ class BetaProgramView(CreateView):
         # data = VirtualMachineTemplateSerializer(templates, many=True).data
 
         context.update({
-            'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host()),
+            'base_url': "{0}://{1}".format(self.request.scheme,
+                                           self.request.get_host()),
             'vms': vms
         })
         return context
@@ -164,7 +172,8 @@ class BetaProgramView(CreateView):
         vms = BetaAccessVM.create(data)
 
         context = {
-            'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host()),
+            'base_url': "{0}://{1}".format(self.request.scheme,
+                                           self.request.get_host()),
             'email': data.get('email'),
             'name': data.get('name'),
             'vms': vms
@@ -181,7 +190,8 @@ class BetaProgramView(CreateView):
         email = BaseEmail(**email_data)
         email.send()
 
-        messages.add_message(self.request, messages.SUCCESS, self.success_message)
+        messages.add_message(self.request, messages.SUCCESS,
+                             self.success_message)
         return HttpResponseRedirect(self.get_success_url())
 
 
@@ -225,7 +235,8 @@ class IndexView(CreateView):
         storage_field = forms.IntegerField(validators=[self.validate_storage])
         price = request.POST.get('total')
         template_id = int(request.POST.get('config'))
-        template = VMTemplate.objects.filter(opennebula_vm_template_id=template_id).first()
+        template = VMTemplate.objects.filter(
+            opennebula_vm_template_id=template_id).first()
         template_data = VMTemplateSerializer(template).data
 
         name = request.POST.get('name')
@@ -237,36 +248,46 @@ class IndexView(CreateView):
             cores = cores_field.clean(cores)
         except ValidationError as err:
             msg = '{} : {}.'.format(cores, str(err))
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='cores')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form")
+                                 extra_tags='cores')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:index') + "#order_form")
 
         try:
             memory = memory_field.clean(memory)
         except ValidationError as err:
             msg = '{} : {}.'.format(memory, str(err))
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='memory')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form")
+                                 extra_tags='memory')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:index') + "#order_form")
 
         try:
             storage = storage_field.clean(storage)
         except ValidationError as err:
             msg = '{} : {}.'.format(storage, str(err))
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='storage')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form")
+                                 extra_tags='storage')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:index') + "#order_form")
 
         try:
             name = name_field.clean(name)
         except ValidationError as err:
             msg = '{} {}.'.format(name, _('is not a proper name'))
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='name')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form")
+                                 extra_tags='name')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:index') + "#order_form")
 
         try:
             email = email_field.clean(email)
         except ValidationError as err:
             msg = '{} {}.'.format(email, _('is not a proper email'))
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='email')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form")
+                                 extra_tags='email')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:index') + "#order_form")
 
         specs = {
             'cpu': cores,
@@ -293,14 +314,16 @@ class IndexView(CreateView):
     def get_context_data(self, **kwargs):
         context = super(IndexView, self).get_context_data(**kwargs)
         context.update({
-            'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host())
+            'base_url': "{0}://{1}".format(self.request.scheme,
+                                           self.request.get_host())
         })
         return context
 
     def form_valid(self, form):
 
         context = {
-            'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host())
+            'base_url': "{0}://{1}".format(self.request.scheme,
+                                           self.request.get_host())
         }
 
         email_data = {
@@ -330,7 +353,8 @@ class IndexView(CreateView):
         email = BaseEmail(**email_data)
         email.send()
 
-        messages.add_message(self.request, messages.SUCCESS, self.success_message)
+        messages.add_message(self.request, messages.SUCCESS,
+                             self.success_message)
         return super(IndexView, self).form_valid(form)
 
 
@@ -403,7 +427,8 @@ class PaymentOrderView(FormView):
             request.session['billing_address'] = billing_address.id
             request.session['token'] = token
             request.session['customer'] = customer.id
-            return HttpResponseRedirect(reverse('datacenterlight:order_confirmation'))
+            return HttpResponseRedirect(
+                reverse('datacenterlight:order_confirmation'))
         else:
             return self.form_invalid(form)
 
@@ -423,11 +448,15 @@ class OrderConfirmationView(DetailView):
         stripe_customer_id = request.session.get('customer')
         customer = StripeCustomer.objects.filter(id=stripe_customer_id).first()
         stripe_utils = StripeUtils()
-        card_details = stripe_utils.get_card_details(customer.stripe_id, request.session.get('token'))
+        card_details = stripe_utils.get_card_details(customer.stripe_id,
-        if not card_details.get('response_object') and not card_details.get('paid'):
+                                                     request.session.get(
+                                                         'token'))
+        if not card_details.get('response_object'):
             msg = card_details.get('error')
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='failed_payment')
+            messages.add_message(self.request, messages.ERROR, msg,
-            return HttpResponseRedirect(reverse('datacenterlight:payment') + '#payment_error')
+                                 extra_tags='failed_payment')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:payment') + '#payment_error')
         context = {
             'site_url': reverse('datacenterlight:index'),
             'cc_last4': card_details.get('response_object').get('last4'),
@@ -444,22 +473,53 @@ class OrderConfirmationView(DetailView):
         billing_address_data = request.session.get('billing_address_data')
         billing_address_id = request.session.get('billing_address')
         vm_template_id = template.get('id', 1)
-        final_price = specs.get('price')
 
         # Make stripe charge to a customer
         stripe_utils = StripeUtils()
-        charge_response = stripe_utils.make_charge(amount=final_price,
+        card_details = stripe_utils.get_card_details(customer.stripe_id,
-                                                   customer=customer.stripe_id)
+                                                     request.session.get(
+                                                         'token'))
+        if not card_details.get('response_object'):
+            msg = card_details.get('error')
+            messages.add_message(self.request, messages.ERROR, msg,
+                                 extra_tags='failed_payment')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:payment') + '#payment_error')
+        card_details_dict = card_details.get('response_object')
+        cpu = specs.get('cpu')
+        memory = specs.get('memory')
+        disk_size = specs.get('disk_size')
+        amount_to_be_charged = (cpu * 5) + (memory * 2) + (disk_size * 0.6)
+        plan_name = "{cpu} Cores, {memory} GB RAM, {disk_size} GB SSD".format(
+            cpu=cpu,
+            memory=memory,
+            disk_size=disk_size)
 
-        # Check if the payment was approved
+        stripe_plan_id = StripeUtils.get_stripe_plan_id(cpu=cpu,
-        if not charge_response.get('response_object') and not charge_response.get('paid'):
+                                                        ram=memory,
-            msg = charge_response.get('error')
+                                                        ssd=disk_size,
-            messages.add_message(self.request, messages.ERROR, msg, extra_tags='make_charge_error')
+                                                        version=1,
-            return HttpResponseRedirect(reverse('datacenterlight:payment') + '#payment_error')
+                                                        app='dcl')
-
+        stripe_plan = stripe_utils.get_or_create_stripe_plan(
-        charge = charge_response.get('response_object')
+            amount=amount_to_be_charged,
-        create_vm_task.delay(vm_template_id, user, specs, template, stripe_customer_id, billing_address_data,
+            name=plan_name,
+            stripe_plan_id=stripe_plan_id)
+        subscription_result = stripe_utils.subscribe_customer_to_plan(
+            customer.stripe_id,
+            [{"plan": stripe_plan.get(
+                'response_object').stripe_plan_id}])
+        stripe_subscription_obj = subscription_result.get('response_object')
+        # Check if the subscription was approved and is active
+        if stripe_subscription_obj is None or \
+                        stripe_subscription_obj.status != 'active':
+            msg = subscription_result.get('error')
+            messages.add_message(self.request, messages.ERROR, msg,
+                                 extra_tags='failed_payment')
+            return HttpResponseRedirect(
+                reverse('datacenterlight:payment') + '#payment_error')
+        create_vm_task.delay(vm_template_id, user, specs, template,
+                             stripe_customer_id, billing_address_data,
                              billing_address_id,
-                             charge)
+                             stripe_subscription_obj, card_details_dict)
         request.session['order_confirmation'] = True
         return HttpResponseRedirect(reverse('datacenterlight:order_success'))

dynamicweb/settings/base.py

@@ -37,8 +37,10 @@ def int_env(val, default_value=0):
     try:
         return_value = int(os.environ.get(val))
     except Exception as e:
-        logger.error("Encountered exception trying to get env value for {}\nException details: {}".format(
+        logger.error(
-            val, str(e)))
+            ("Encountered exception trying to get env value for {}\nException "
+             "details: {}").format(
+                val, str(e)))
 
     return return_value
 
@@ -169,10 +171,12 @@ TEMPLATES = [
                  os.path.join(PROJECT_DIR, 'membership'),
                  os.path.join(PROJECT_DIR, 'hosting/templates/'),
                  os.path.join(PROJECT_DIR, 'nosystemd/templates/'),
-                 os.path.join(PROJECT_DIR, 'ungleich/templates/djangocms_blog/'),
+                 os.path.join(PROJECT_DIR,
+                              'ungleich/templates/djangocms_blog/'),
                  os.path.join(PROJECT_DIR, 'ungleich/templates/cms/ungleichch'),
                  os.path.join(PROJECT_DIR, 'ungleich/templates/ungleich'),
-                 os.path.join(PROJECT_DIR, 'ungleich_page/templates/ungleich_page'),
+                 os.path.join(PROJECT_DIR,
+                              'ungleich_page/templates/ungleich_page'),
                  os.path.join(PROJECT_DIR, 'templates/analytics'),
                  ],
         'APP_DIRS': True,
@@ -493,6 +497,7 @@ REGISTRATION_MESSAGE = {'subject': "Validation mail",
                         }
 STRIPE_API_PRIVATE_KEY = env('STRIPE_API_PRIVATE_KEY')
 STRIPE_API_PUBLIC_KEY = env('STRIPE_API_PUBLIC_KEY')
+STRIPE_API_PRIVATE_KEY_TEST = env('STRIPE_API_PRIVATE_KEY_TEST')
 
 ANONYMOUS_USER_NAME = 'anonymous@ungleich.ch'
 GUARDIAN_GET_INIT_ANONYMOUS_USER = 'membership.models.get_anonymous_user_instance'
@@ -535,9 +540,12 @@ GOOGLE_ANALYTICS_PROPERTY_IDS = {
     'ungleich.ch': 'UA-62285904-1',
     'digitalglarus.ch': 'UA-62285904-2',
     'blog.ungleich.ch': 'UA-62285904-4',
-    'hosting': 'UA-62285904-5',
+    'rails-hosting.ch': 'UA-62285904-5',
-    'datacenterlight.ch': 'UA-62285904-9',
+    'django-hosting.ch': 'UA-62285904-6',
-
+    'node-hosting.ch': 'UA-62285904-7',
+    'datacenterlight.ch': 'UA-62285904-8',
+    'devuanhosting.ch': 'UA-62285904-9',
+    'ipv6onlyhosting.ch': 'UA-62285904-10',
     '127.0.0.1:8000': 'localhost',
     'dynamicweb-development.ungleich.ch': 'development',
     'dynamicweb-staging.ungleich.ch': 'staging'
@@ -562,7 +570,8 @@ if ENABLE_DEBUG_LOGGING:
             'file': {
                 'level': 'DEBUG',
                 'class': 'logging.FileHandler',
-                'filename': "{PROJECT_DIR}/debug.log".format(PROJECT_DIR=PROJECT_DIR),
+                'filename': "{PROJECT_DIR}/debug.log".format(
+                    PROJECT_DIR=PROJECT_DIR),
             },
         },
         'loggers': {

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-08-22 21:38+0530\n"
+"POT-Creation-Date: 2017-08-24 11: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"
@@ -266,31 +266,26 @@ msgstr "Gesamt"
 msgid "Finish Configuration"
 msgstr "Konfiguration beenden"
 
+msgid "Order Nr."
+msgstr "Bestellung Nr."
+
 msgid "Amount"
 msgstr "Betrag"
 
 msgid "Status"
 msgstr ""
 
-msgid "Approved"
+msgid "See Invoice"
-msgstr "Akzeptiert"
+msgstr "Rechnung"
-
-msgid "Declined"
-msgstr "Abgelehnt"
 
 msgid "View Detail"
 msgstr "Details anzeigen"
 
-msgid "Cancel Order"
+msgid "Page"
-msgstr "Bestellung stornieren"
+msgstr ""
 
-#, fuzzy
+msgid "of"
-#| msgid "Do You want to delete your order?"
+msgstr ""
-msgid "Do you want to delete your order?"
-msgstr "Willst du deine Bestellung löschen?"
-
-msgid "Delete"
-msgstr "Löschen"
 
 msgid "Your Order"
 msgstr "Deine Bestellung"
@@ -301,6 +296,9 @@ msgstr "Konfiguration"
 msgid "including VAT"
 msgstr "inkl. Mehrwertsteuer"
 
+msgid "Month"
+msgstr "Monat"
+
 msgid "Billing Address"
 msgstr "Rechnungsadresse"
 
@@ -321,23 +319,10 @@ msgstr ""
 "\"https://stripe.com\" target=\"_blank\">Stripe</a> für die Bezahlung und "
 "speichern keine Informationen in unserer Datenbank."
 
-#, fuzzy
-#| msgid ""
-#| "\n"
-#| "                                            You are not making any "
-#| "payment yet. After submitting your card\n"
-#| "                                            information, you will be "
-#| "taken to the Confirm Order Page.\n"
-#| "                                            "
 msgid ""
-"\n"
+"You are not making any payment yet. After submitting your card information, "
-"                                                You are not making any "
+"you will be taken to the Confirm Order Page."
-"payment yet. After submitting your card\n"
-"                                                information, you will be "
-"taken to the Confirm Order Page.\n"
-"                                                "
 msgstr ""
-"\n"
 "Es wird noch keine Bezahlung vorgenommen. Nach der Eingabe Deiner "
 "Kreditkateninformationen wirst du auf die Bestellbestätigungsseite "
 "weitergeleitet."
@@ -406,6 +391,9 @@ msgstr ""
 msgid "Private Key"
 msgstr ""
 
+msgid "Delete"
+msgstr "Löschen"
+
 msgid "Delete SSH Key"
 msgstr "SSH Key löschen"
 
@@ -415,38 +403,70 @@ msgstr "Möchtest Du den Schlüssel löschen?"
 msgid "Show"
 msgstr "Anzeigen"
 
+#, fuzzy
+#| msgid "Public SSH Key"
 msgid "Public SSH Key"
 msgstr "Public SSH Key"
 
 msgid "Download"
 msgstr ""
 
-msgid "Settings"
+msgid "Your Virtual Machine Detail"
-msgstr "Einstellungen"
+msgstr "Virtuelle Maschinen Detail"
 
-msgid "Billing"
+msgid "VM Settings"
-msgstr "Abrechnungen"
+msgstr "VM Einstellungen"
 
-msgid "Ip not assigned yet"
+msgid "Copied"
-msgstr "Ip nicht zugewiesen"
+msgstr "Kopiert"
 
 msgid "Disk"
 msgstr "Festplatte"
 
-msgid "Current pricing"
+msgid "Billing"
+msgstr "Abrechnungen"
+
+msgid "Current Pricing"
 msgstr "Aktueller Preis"
 
-msgid "Current status"
+msgid "Your VM is"
-msgstr "Aktueller Status"
+msgstr "Deine VM ist"
 
-msgid "Terminate Virtual Machine"
+msgid "Pending"
-msgstr "Virtuelle Maschine beenden"
+msgstr "In Vorbereitung"
+
+msgid "Online"
+msgstr ""
+
+msgid "Failed"
+msgstr "Fehlgeschlagen"
+
+msgid "Terminate VM"
+msgstr "VM Beenden"
+
+msgid "Support / Contact"
+msgstr "Support / Kontakt"
+
+msgid "Something doesn't work?"
+msgstr "Etwas funktioniert nicht?"
+
+msgid "We are here to help you!"
+msgstr "Wir sind hier, um Dir zu helfen!"
+
+msgid "CONTACT"
+msgstr "KONTACT"
+
+msgid "BACK TO LIST"
+msgstr "ZURÜCK ZUR LISTE"
 
 msgid "Terminate your Virtual Machine"
-msgstr "Ihre virtuelle Maschine beenden"
+msgstr "Deine Virtuelle Maschine beenden"
 
-msgid "Are you sure do you want to cancel your Virtual Machine "
+msgid "Do you want to cancel your Virtual Machine"
-msgstr "Sind Sie sicher, dass Sie ihre virtuelle Maschine beenden wollen "
+msgstr "Bist Du sicher, dass Du Deine virtuelle Maschine beenden willst"
+
+msgid "OK"
+msgstr ""
 
 msgid "Virtual Machines"
 msgstr "Virtuelle Maschinen"
@@ -457,14 +477,8 @@ msgstr ""
 msgid "CREATE VM"
 msgstr "NEUE VM"
 
-msgid "Page"
-msgstr ""
-
-msgid "of"
-msgstr ""
-
 msgid "login"
-msgstr "einloggen"
+msgstr "Einloggen"
 
 msgid ""
 "Thank you for signing up. We have sent an email to you. Please follow the "
@@ -490,10 +504,8 @@ msgstr "Du kannst dich nun"
 msgid "Sorry. Your request is invalid."
 msgstr "Entschuldigung, deine Anfrage ist ungültig."
 
-#, fuzzy
-#| msgid "Credit Card"
 msgid "Invalid credit card"
-msgstr "Kreditkarte"
+msgstr "Ungültige Kreditkarte"
 
 msgid "Confirm Order"
 msgstr "Bestellung Bestätigen"
@@ -503,18 +515,26 @@ msgid ""
 "contact Data Center Light Support."
 msgstr ""
 
-#~ msgid ""
+#~ msgid "Approved"
-#~ "\n"
+#~ msgstr "Akzeptiert"
-#~ "                                        You are not making any payment "
+
-#~ "yet. After submitting your card\n"
+#~ msgid "Declined"
-#~ "                                        information, you will be taken to "
+#~ msgstr "Abgelehnt"
-#~ "the Confirm Order Page.\n"
+
-#~ "                                        "
+#~ msgid "Cancel Order"
-#~ msgstr ""
+#~ msgstr "Bestellung stornieren"
-#~ "\n"
+
-#~ "Es wird noch keine Bezahlung vorgenommen. Nach der Eingabe Deiner "
+#~ msgid "Do you want to delete your order?"
-#~ "Kreditkateninformationen wirst du auf die Bestellbestätigungsseite "
+#~ msgstr "Willst du deine Bestellung löschen?"
-#~ "weitergeleitet."
+
+#~ msgid "Ip not assigned yet"
+#~ msgstr "Ip nicht zugewiesen"
+
+#~ msgid "Current status"
+#~ msgstr "Aktueller Status"
+
+#~ msgid "Terminate Virtual Machine"
+#~ msgstr "Virtuelle Maschine beenden"
 
 #~ msgid "Ipv4"
 #~ msgstr "IPv4"
@@ -534,82 +554,12 @@ msgstr ""
 #~ msgid "Keys"
 #~ msgstr "Schlüssel"
 
-#, fuzzy
-#~| msgid "Contact"
-#~ msgid "Content"
-#~ msgstr "Kontakt"
-
-#, fuzzy
-#~| msgid "Contact"
-#~ msgid "DG.Contact"
-#~ msgstr "Kontakt"
-
-#, fuzzy
-#~| msgid "Home"
-#~ msgid "DG.Home"
-#~ msgstr "Home"
-
-#, fuzzy
-#~| msgid "Amount"
-#~ msgid "Country"
-#~ msgstr "Betrag"
-
 #~ msgid "Log in"
 #~ msgstr "Anmelden"
 
-#, fuzzy
-#~| msgid "Configuration"
-#~ msgid "Donation #"
-#~ msgstr "Konfiguration"
-
-#, fuzzy
-#~| msgid "Billing Address"
-#~ msgid "Billing Address:"
-#~ msgstr "Rechnungsadresse"
-
-#, fuzzy
-#~| msgid "Date"
-#~ msgid "Date:"
-#~ msgstr "Datum"
-
-#, fuzzy
-#~| msgid "Configuration"
-#~ msgid "Donation"
-#~ msgstr "Konfiguration"
-
-#, fuzzy
-#~| msgid "View Detail"
-#~ msgid "View Donations"
-#~ msgstr "Details anzeigen"
-
 #~ msgid "You haven been logged out"
 #~ msgstr "Sie wurden abgmeldet"
 
-#, fuzzy
-#~| msgid "Log in"
-#~ msgid "Log in "
-#~ msgstr "Anmelden"
-
-#, fuzzy
-#~| msgid "View Detail"
-#~ msgid "DG.Detail"
-#~ msgstr "Details anzeigen"
-
-#, fuzzy
-#~| msgid "Cancel"
-#~ msgid "France"
-#~ msgstr "Beenden"
-
-#, fuzzy
-#~| msgid "Enter your credit card number"
-#~ msgid "Enter your name or company name"
-#~ msgstr "Deine Kreditkartennummer"
-
-#, fuzzy
-#~| msgid "Card Number"
-#~ msgid "Cardholder Name"
-#~ msgstr "Kreditkartennummer"
-
 #~ msgid "How it works"
 #~ msgstr "So funktioniert es"
 
@@ -640,14 +590,6 @@ msgstr ""
 #~ msgid "Place Order"
 #~ msgstr "Bestelle"
 
-#~ msgid ""
-#~ "You are not making any payment yet. After placing your order, you will be "
-#~ "taken to the Submit Payment Page."
-#~ msgstr ""
-#~ "Es wird noch keine Bezahlung vorgenommen. Nach der Eingabe deiner "
-#~ "Kreditkateninformationen wirst du auf die Bestellbestätigungsseite "
-#~ "weitergeleitet."
-
 #~ msgid "CARD NUMBER"
 #~ msgstr "Kreditkartennummer"
 

hosting/migrations/0042_hostingorder_subscription_id.py

@@ -0,0 +1,20 @@
+# -*- coding: utf-8 -*-
+# Generated by Django 1.9.4 on 2017-08-17 16:34
+from __future__ import unicode_literals
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('hosting', '0041_userhostingkey_private_key'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='hostingorder',
+            name='subscription_id',
+            field=models.CharField(max_length=100, null=True),
+        ),
+    ]

hosting/models.py

@@ -50,6 +50,7 @@ class HostingOrder(AssignPermissionsMixin, models.Model):
     cc_brand = models.CharField(max_length=10)
     stripe_charge_id = models.CharField(max_length=100, null=True)
     price = models.FloatField()
+    subscription_id = models.CharField(max_length=100, null=True)
 
     permissions = ('view_hostingorder',)
 
@@ -66,7 +67,8 @@ class HostingOrder(AssignPermissionsMixin, models.Model):
         return self.ORDER_APPROVED_STATUS if self.approved else self.ORDER_DECLINED_STATUS
 
     @classmethod
-    def create(cls, price=None, vm_id=None, customer=None, billing_address=None):
+    def create(cls, price=None, vm_id=None, customer=None,
+               billing_address=None):
         instance = cls.objects.create(
             price=price,
             vm_id=vm_id,
@@ -86,6 +88,23 @@ class HostingOrder(AssignPermissionsMixin, models.Model):
         self.cc_brand = stripe_charge.source.brand
         self.save()
 
+    def set_subscription_id(self, subscription_object, cc_details):
+        """
+        When creating a Stripe subscription, we have subscription id.
+        We store this in the subscription_id field.
+        This method sets the subscription id from subscription_object
+        and also the last4 and credit card brands used for this order.
+
+        :param subscription_object: Stripe's subscription object
+        :param cc_details: A dict containing card details
+        {last4, brand}
+        :return:
+        """
+        self.subscription_id = subscription_object.id
+        self.last4 = cc_details.get('last4')
+        self.cc_brand = cc_details.get('brand')
+        self.save()
+
     def get_cc_data(self):
         return {
             'last4': self.last4,
@@ -137,5 +156,6 @@ class HostingBill(AssignPermissionsMixin, models.Model):
 
     @classmethod
     def create(cls, customer=None, billing_address=None):
-        instance = cls.objects.create(customer=customer, billing_address=billing_address)
+        instance = cls.objects.create(customer=customer,
+                                      billing_address=billing_address)
         return instance

hosting/static/hosting/css/landing-page.css

@@ -533,9 +533,21 @@ a.unlink:hover {
     padding-left: 5px;
 }
 
+.dcl-place-order-text{
+   font-size: 13px;
+   color: #808080;
+}
+
 .dcl-order-table-total .tbl-total {
     text-align: center;
     color: #000;
+    padding-left: 44px;
+}
+
+.tbl-total .dcl-price-month {
+    font-size: 16px;
+    text-transform: capitalize;
+    color: #000;
 }
 
 .tbl-no-padding {
@@ -782,4 +794,4 @@ a.list-group-item-danger.active:focus {
 }
 .panel-danger > .panel-heading .badge {
     background-color: #eb4d5c;
-}
+}

hosting/static/hosting/css/virtual-machine.css

@@ -1,3 +1,6 @@
+.virtual-machine-container {
+  max-width: 900px;
+}
 .virtual-machine-container .tabs-left, .virtual-machine-container .tabs-right {
   border-bottom: none;
   padding-top: 2px;
@@ -229,6 +232,204 @@
     }
 }
 
+/* Vm Details */
+
+.vm-detail-item, .vm-contact-us {
+    overflow: hidden;
+    border: 1px solid #ccc;
+    padding: 15px;
+    color: #555;
+    font-weight: 300;
+    margin-bottom: 15px;
+}
+
+.vm-detail-title {
+  margin-top: 0;
+  font-size: 20px;
+  font-weight: 300;
+}
+
+.vm-detail-title .un-icon {
+  float: right;
+  height: 24px;
+  width: 21px;
+  margin-top: 0;
+}
+
+.vm-detail-item .vm-name {
+  font-size: 16px;
+  margin-bottom: 15px;
+}
+
+.vm-detail-item p {
+  margin-bottom: 5px;
+  position: relative;
+}
+
+.vm-detail-ip {
+  padding-bottom: 5px;
+  border-bottom: 1px solid #ddd;
+  margin-bottom: 10px;
+}
+
+.vm-detail-ip .un-icon {
+  height: 14px;
+  width: 14px;
+}
+
+.vm-detail-ip .to_copy {
+  position: absolute;
+  right: 0;
+  top: 1px;
+  padding: 0;
+  line-height: 1;
+}
+
+.vm-vmid {
+  padding: 50px 0 70px;
+  text-align: center;
+}
+
+.vm-item-lg {
+  font-size: 22px;
+  margin-top: 5px;
+  margin-bottom: 15px;
+  letter-spacing: 0.6px;
+}
+
+.vm-color-online {
+  color: #37B07B;
+}
+
+.vm-color-pending {
+  color: #e47f2f;
+}
+
+.vm-detail-item .value{
+  font-weight: 400;
+}
+
+.vm-detail-config .value {
+  float: right;
+  font-weight: 600;
+}
+
+.vm-detail-contain {
+  margin-top: 25px;
+}
+
+.vm-contact-us {
+  margin: 25px 0 30px;
+  /* text-align: center; */
+}
+
+@media(min-width: 768px) {
+  .vm-detail-contain {
+    display: flex;
+    margin-left: -15px;
+    margin-right: -15px;
+  }
+  .vm-detail-item {
+    width: 33.333333%;
+    margin: 0 15px;
+  }
+  .vm-contact-us {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .vm-contact-us .vm-detail-title {
+    margin-bottom: 0;
+  }
+  .vm-contact-us .un-icon {
+    width: 22px;
+    height: 22px;
+    margin-right: 5px;
+  }
+  .vm-contact-us div {
+    padding: 0 15px;
+    position: relative;
+  }
+  .vm-contact-us-text {
+    display: flex;
+    align-items: center;
+  }
+}
+
+.value-sm-block {
+  display: block;
+  padding-top: 2px;
+}
+
+@media(max-width: 767px) {
+  .vm-contact-us div {
+    margin-bottom: 30px;
+  }
+  .vm-contact-us div span {
+    display: block;
+    margin-bottom: 3px;
+  }
+  .dashboard-title-thin {
+    font-size: 22px;
+  }
+}
+
+.btn-vm-invoice {
+  color: #87B6EA;
+  border: 2px solid #87B6EA;
+  padding: 4px 18px;
+  letter-spacing: 0.6px;
+}
+.btn-vm-invoice:hover, .btn-vm-invoice:focus {
+  color : #fff;
+  background: #87B6EA;
+}
+
+
+.btn-vm-term {
+  color: #aaa;
+  border: 2px solid #ccc;
+  background: #fff;
+  padding: 4px 18px;
+  letter-spacing: 0.6px;
+}
+.btn-vm-term:hover, .btn-vm-term:focus, .btn-vm-term:active {
+  color: #eb4d5c;
+  border-color: #eb4d5c;
+}
+
+.btn-vm-contact {
+  color: #fff;
+  background: #A3C0E2;
+  border: 2px solid #A3C0E2;
+  padding: 5px 25px;
+  font-size: 12px;
+  letter-spacing: 1.3px;
+}
+.btn-vm-contact:hover, .btn-vm-contact:focus {
+  background: #fff;
+  color: #a3c0e2;
+}
+
+.btn-vm-back {
+  color: #fff;
+  background: #C4CEDA;
+  border: 2px solid #C4CEDA;
+  padding: 5px 25px;
+  font-size: 12px;
+  letter-spacing: 1.3px;
+}
+.btn-vm-back:hover, .btn-vm-back:focus {
+  color: #fff;
+  background: #8da4c0;
+  border-color: #8da4c0;
+}
+
+.vm-contact-us-text {
+  letter-spacing: 0.4px;
+}
+
+
 /* New styles */
 .dashboard-container-head {
   padding: 0 8px;
@@ -239,10 +440,10 @@
 }
 
 .dashboard-title-thin .un-icon {
-  height: 34px;
+  height: 30px;
   margin-right: 5px;
   margin-top: -1px;
-  width: 20px;
+  width: 30px;
 }
 
 .dashboard-subtitle {
@@ -287,6 +488,24 @@
   color: #3770CC;
 }
 
+.btn-order-detail {
+  background: #87B6EA;
+  color: #fff;
+  font-weight: 400;
+  letter-spacing: 0.6px;
+  font-size: 14px;
+  border-radius: 3px;
+  border: 2px solid #87B6EA;
+  padding: 4px 20px;
+  min-width: 155px;
+  /*   padding-bottom: 7px; */
+}
+
+.btn-order-detail:hover, .btn-order-detail:focus, .btn-order-detail:active {
+  background: #fff;
+  color: #87B6EA;
+}
+
 .vm-status, .vm-status-active, .vm-status-failed {
   font-weight: 600;
 }
@@ -355,8 +574,8 @@
     position: relative;
     border-top: 1px solid #ddd;
     /* margin-top: 15px; */
-    padding-top: 5px;
+    padding-top: 10px;
-    padding-bottom: 15px;
+    padding-bottom: 13px;
   }
   .table-switch tbody tr:last-child {
     border-bottom: 1px solid #ddd;
@@ -373,11 +592,28 @@
     font-weight: 600;
     position: absolute;
     top: 5px;
-
+    left: 8px;
   }
   .table-switch .last-td {
     position: absolute;
-    bottom: 20px;
+    bottom: 13px;
     right: 0;
   }
+  .table-switch tbody tr .xs-td-inline {
+    text-align: right;
+    padding-top: 6px;
+  }
+  .table-switch tbody tr .xs-td-bighalf {
+    width: 52%;
+    display: inline-block;
+  }
+  .table-switch tbody tr .xs-td-smallhalf {
+    width: 47%;
+    text-align: right;
+    display: inline-block;
+  }
+  .table-switch tbody tr .xs-td-smallhalf:before {
+    left: auto;
+    right: 8px;
+  }
 }

hosting/static/hosting/img/24-hours-support.svg

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 <?xml version="1.0" encoding="UTF-8"?>
 <svg width="90px" height="90px" viewBox="0 0 90 90" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
@@ -12,4 +13,67 @@
             <path d="M58.1464578,21.1702096 L56.3768257,21.1702096 C55.8726195,21.1702096 55.4018025,21.4188055 55.1172921,21.8351895 L46.9332697,33.8154894 C46.6944942,34.1650949 46.5682322,34.5739032 46.5682322,34.9973018 L46.5682322,36.9386502 C46.5682322,37.7795551 47.2525723,38.4638952 48.0934772,38.4638952 L54.8120186,38.4638952 L54.8120186,40.0876245 C54.8120186,41.4274047 55.9020806,42.5174666 57.2418607,42.5174666 C58.5816409,42.5174666 59.6717028,41.4274047 59.6717028,40.0876245 L59.6717028,38.4638952 L59.9144064,38.4638952 C61.1593498,38.4638952 62.1722516,37.4509933 62.1722516,36.20605 C62.1722516,34.9611067 61.1593498,33.9482048 59.9144064,33.9482048 L59.6717028,33.9482048 L59.6717028,22.6954546 C59.6717028,21.8545497 58.9873628,21.1702096 58.1464578,21.1702096 Z M54.8122992,33.9482048 L51.7966014,33.9482048 L54.8122992,29.465062 L54.8122992,33.9482048 Z" id="Shape"></path>
         </g>
     </g>
-</svg>
+</svg>
+=======
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 279.525 279.525" style="enable-background:new 0 0 279.525 279.525;" xml:space="preserve">
+<g>
+	<path d="M165.066,1.544c-29.272,0-56.007,11.05-76.268,29.191c4.494,7.146,7.047,15.46,7.287,24.042l0.001,0.025l0.001,0.025
+		c0.102,3.867,0.333,7.735,0.664,11.597c15.368-21.117,40.258-34.88,68.315-34.88c46.571,0,84.459,37.888,84.459,84.459
+		c0,46.08-37.098,83.634-82.994,84.422c4.191,3.502,8.518,6.84,12.976,9.974l0.02,0.015l0.021,0.014
+		c6.07,4.282,11.014,9.896,14.483,16.317c49.133-12.861,85.493-57.633,85.493-110.742C279.525,52.89,228.18,1.544,165.066,1.544z"/>
+	<path d="M162.256,234.942c-13.076-10.438-21.234-17.389-32.909-28.204c-3.435-3.182-7.633-5.164-11.944-5.164
+		c-3.299,0-6.557,1.051-9.239,3.252c-2.768,2.33-5.536,4.66-8.305,6.989c-22.499-26.738-39.206-57.895-49.027-91.431
+		c3.472-1.016,6.945-2.033,10.417-3.049c7.652-2.343,11.252-10.512,10.129-18.701c-2.443-17.824-3.77-26.679-5.282-43.018
+		c-0.775-8.375-6.349-15.65-14.338-16.085c-1.246-0.121-2.491-0.181-3.726-0.181c-29.71,0-55.578,34.436-46.009,76.564
+		c11.907,52.172,37.684,100.243,74.551,139.031c15.102,15.856,33.603,23.036,50.312,23.036c17.627,0,33.261-7.984,40.833-22.195
+		C171.778,248.891,168.83,240.19,162.256,234.942z"/>
+	<path d="M130.645,118.121c-7.912,7.341-13.089,13.113-15.823,17.643c-1.93,3.195-3.338,6.573-4.187,10.04
+		c-0.399,1.632-0.032,3.326,1.007,4.649c1.038,1.321,2.596,2.079,4.276,2.079h37.758c4.626,0,8.39-3.764,8.39-8.39
+		c0-4.626-3.764-8.39-8.39-8.39h-17.051c0.139-0.164,0.282-0.328,0.428-0.493c1.114-1.254,3.842-3.874,8.107-7.785
+		c4.473-4.105,7.493-7.179,9.232-9.398c2.621-3.336,4.571-6.593,5.794-9.679c1.247-3.145,1.88-6.498,1.88-9.967
+		c0-6.224-2.254-11.507-6.699-15.705c-4.416-4.164-10.495-6.274-18.071-6.274c-6.884,0-12.731,1.802-17.377,5.356
+		c-2.803,2.146-4.961,5.119-6.415,8.839c-0.982,2.513-0.728,5.388,0.68,7.689c1.408,2.302,3.852,3.837,6.537,4.105
+		c0.299,0.03,0.597,0.045,0.891,0.045c3.779,0,7.149-2.403,8.387-5.979c0.388-1.121,0.901-2.012,1.527-2.65
+		c1.318-1.343,3.093-1.997,5.428-1.997c2.373,0,4.146,0.618,5.418,1.889c1.269,1.269,1.886,3.12,1.886,5.66
+		c0,2.359-0.843,4.819-2.505,7.314C140.862,108.028,138.199,111.083,130.645,118.121z"/>
+	<path d="M206.235,76.451h-6.307c-1.797,0-3.475,0.886-4.489,2.37l-29.168,42.698c-0.851,1.246-1.301,2.703-1.301,4.212v6.919
+		c0,2.997,2.439,5.436,5.436,5.436h23.945v5.787c0,4.775,3.885,8.66,8.66,8.66c4.775,0,8.66-3.885,8.66-8.66v-5.787h0.865
+		c4.437,0,8.047-3.61,8.047-8.047c0-4.437-3.61-8.047-8.047-8.047h-0.865V81.887C211.671,78.89,209.232,76.451,206.235,76.451z
+		 M194.352,121.992h-10.748l10.748-15.978V121.992z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
+>>>>>>> master

hosting/static/hosting/img/billing.svg

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 <?xml version="1.0" encoding="UTF-8"?>
 <svg width="90px" height="90px" viewBox="0 0 90 90" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
@@ -10,4 +11,7 @@
             <path d="M18.1542471,16.7096222 L53.9157029,16.7096222 L53.9157029,22.9370402 L18.1542471,22.9370402 L18.1542471,16.7096222 Z M18.1542471,29.1690778 L53.9157029,29.1690778 L53.9157029,35.4011155 L18.1542471,35.4011155 L18.1542471,29.1690778 Z M18.1542471,41.6285335 L53.9157029,41.6285335 L53.9157029,47.8605712 L18.1542471,47.8605712 L18.1542471,41.6285335 Z" id="Shape"></path>
         </g>
     </g>
-</svg>
+</svg>
+=======
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="symbol symbol-billing" aria-labelledby="title" role="img"><title id="title">billing icon</title><g data-name="Layer 1"><path class="cls-1" d="M.37.023v15.954l2.775-1.387 2.775 1.387L8 14.59l2.775 1.387 2.081-1.387 2.775 1.387V.023zm13.873 13.709l-1.487-.744-2.081 1.387L7.9 12.989l-2.08 1.387-2.675-1.337-1.387.694V1.41h12.485z" role="presentation"/><path class="cls-1" d="M4.206 3.617h7.741v1.348H4.206zm0 2.697h7.741v1.349H4.206zm0 2.697h7.741v1.349H4.206z" role="presentation"/></g></svg>
+>>>>>>> master

hosting/static/hosting/img/shopping-cart.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="512px" height="512px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
+<g>
+	<g>
+		<polygon points="447.992,336 181.555,336 69.539,80 0.008,80 0.008,48 90.477,48 202.492,304 447.992,304 		"/>
+	</g>
+	<path d="M287.992,416c0,26.5-21.5,48-48,48s-48-21.5-48-48s21.5-48,48-48S287.992,389.5,287.992,416z"/>
+	<path d="M447.992,416c0,26.5-21.5,48-48,48s-48-21.5-48-48s21.5-48,48-48S447.992,389.5,447.992,416z"/>
+	<g>
+		<polygon points="499.18,144 511.992,112 160.008,112 172.805,144 		"/>
+		<polygon points="211.195,240 223.992,272 447.992,272 460.805,240 		"/>
+		<polygon points="486.398,176 185.602,176 198.398,208 473.586,208 		"/>
+	</g>
+</g>
+</svg>

hosting/static/hosting/js/initial.js

@@ -16,7 +16,7 @@ $( document ).ready(function() {
     /*
      * Replace all SVG images with inline SVG
      */
-    $('.svg-img').each(function(){
+    $('.svg-img').each(function() {
         console.log('asa')
         var $img = $(this);
         var imgID = $img.attr('id');
@@ -48,6 +48,64 @@ $( document ).ready(function() {
             $img.replaceWith($svg);
 
         }, 'xml');
+    });
 
+    $('.alt-text').on('mouseenter mouseleave', function(e){
+        var $this = $(this);
+        var txt = $this.text();
+        var alt = $this.attr('data-alt');
+        $this.text(alt);
+        $this.attr('data-alt', txt);
+    });
+
+});
+
+function getScrollbarWidth() {
+    var outer = document.createElement("div");
+    outer.style.visibility = "hidden";
+    outer.style.width = "100px";
+    outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
+
+    document.body.appendChild(outer);
+
+    var widthNoScroll = outer.offsetWidth;
+    // force scrollbars
+    outer.style.overflow = "scroll";
+
+    // add innerdiv
+    var inner = document.createElement("div");
+    inner.style.width = "100%";
+    outer.appendChild(inner);
+
+    var widthWithScroll = inner.offsetWidth;
+
+    // remove divs
+    outer.parentNode.removeChild(outer);
+
+    return widthNoScroll - widthWithScroll;
+}
+
+// globally stores the width of scrollbar
+var scrollbarWidth = getScrollbarWidth();
+var paddingAdjusted = false;
+
+$( document ).ready(function() {
+    // add proper padding to fixed topnav on modal show
+    $('body').on('click', '[data-toggle=modal]', function(){
+        var $body = $('body');
+        if ($body[0].scrollHeight > $body.height()) {
+            scrollbarWidth = getScrollbarWidth();
+            var topnavPadding = parseInt($('.navbar-fixed-top.topnav').css('padding-right'));
+            $('.navbar-fixed-top.topnav').css('padding-right', topnavPadding+scrollbarWidth);
+            paddingAdjusted = true;
+        }
+    });
+
+    // remove added padding on modal hide
+    $('body').on('hidden.bs.modal', function(){
+        if (paddingAdjusted) {
+            var topnavPadding = parseInt($('.navbar-fixed-top.topnav').css('padding-right'));
+            $('.navbar-fixed-top.topnav').css('padding-right', topnavPadding-scrollbarWidth);
+        }
     });
 });

hosting/templates/hosting/base.html

@@ -38,7 +38,6 @@
     <![endif]-->
 
     {% with 'hosting/img/'|add:hosting|add:'-intro-bg.png' as image_static %}
-     alt="">   
     <style media="screen" type="text/css">
     .intro-header {
         background: url("{% static image_static %}") no-repeat center center;

hosting/templates/hosting/orders.html

@@ -3,95 +3,64 @@
 {% load i18n %}
 
 {% block content %}
-
+<div class="dashboard-container">
-    <div>
+    <div class="dashboard-container-head">
-        <div class="orders-container">
+        <h3 class="dashboard-title-thin"><img src="{% static 'hosting/img/shopping-cart.svg' %}" class="un-icon" style="margin-top: -4px; width: 30px;"> {% trans "My Orders" %}</h3>
-            <div class="row">
+        {% if messages %}
-                <div class="container-table col-md-8 col-md-offset-2">
+            <div class="alert alert-warning">
-                    <table class="table borderless table-hover">
+                {% for message in messages %}
-                        <h3><i class="fa fa-credit-card fa-separate"></i>{% trans "My Orders"%}</h3>
+                <span>{{ message }}</span>
-                        <br/>
+                {% endfor %}
-                        <thead>
-                        <tr>
-                            <th>#</th>
-                            <th>{% trans "Date"%}</th>
-                            <th>{% trans "Amount"%}</th>
-                            <th>{% trans "Status"%}</th>
-                            <th></th>
-                        </tr>
-                        </thead>
-                        <tbody>
-                        {% for order in orders %}
-                            <tr>
-                                <td scope="row">{{ order.id }}</td>
-                                <td>{{ order.created_at | date:"M d, Y" }}</td>
-                                <td>{{ order.price }} CHF</td>
-                                <td>{% if order.approved %}
-                                    <span class="text-success strong">{% trans "Approved"%}</span>
-                                {% else %}
-                                    <span class="text-danger strong">{% trans "Declined"%}</span>
-                                {% endif %}
-                                </td>
-                                <td>
-                                    <a class="btn btn-default"
-                                            href="{% url 'hosting:orders' order.id %}">{% trans "View Detail"%}</a>
-                                    <button type="button" class="btn btn-default" data-toggle="modal"
-                                            data-target="#Modal{{ order.id }}"><a
-                                            href="#">{% trans "Cancel Order"%}</a>
-                                    </button>
-                                </td>
-                            </tr>
-                            <div class="modal fade" id="Modal{{ order.id }}" tabindex="-1" role="dialog"
-                                 aria-labelledby="exampleModalLabel">
-                                <div class="modal-dialog" role="document">
-                                    <div class="modal-content">
-                                        <div class="modal-header">
-                                            <button type="button" class="close" data-dismiss="modal"
-                                                    aria-label="Confirm"><span
-                                                    aria-hidden="true">&times;</span>
-                                            </button>
-                                        </div>
-                                        <div class="modal-body">
-                                            <div class="modal-icon"><i class="fa fa-trash" aria-hidden="true"></i></div>
-                                            <h4 class="modal-title" id="ModalLabel">{% trans "Do you want to delete your order?"%}</h4>
-
-                                            <form method="post"
-                                                  action="{% url 'hosting:delete_order' order.id %}">
-                                                {% csrf_token %}
-                                                <div class="modal-footer">
-                                                    <button type="submit" class="btn btn-danger">{% trans "Delete"%}
-                                                    </button>
-                                                </div>
-                                            </form>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        {% endfor %}
-                        </tbody>
-                    </table>
-
-                    {% if is_paginated %}
-                        <div class="pagination">
-			            <span class="page-links">
-			                {% if page_obj.has_previous %}
-                                <a href="{{ request.path }}?page={{ page_obj.previous_page_number }}">{% trans "previous"%}</a>
-                            {% endif %}
-                            <span class="page-current">
-			                    Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
-			                </span>
-                            {% if page_obj.has_next %}
-                                <a href="{{ request.path }}?page={{ page_obj.next_page_number }}">{% trans "next"%}</a>
-                            {% endif %}
-			            </span>
-                        </div>
-                    {% endif %}
-
-                </div>
-
             </div>
-        </div>
+        {% endif %}
-
+        <div class="dashboard-subtitle"></div>
     </div>
 
+    <table class="table table-switch">
+        <thead>
+            <tr>
+                <th>{% trans "Order Nr." %}</th>
+                <th>{% trans "Date" %}</th>
+                <th>{% trans "Amount" %}</th>
+                <th>{% trans "Status" %}</th>
+                <th></th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for order in orders %}
+                <tr>
+                    <td class="xs-td-inline" data-header="{% trans 'Order Nr.' %}">{{ order.id }}</td>
+                    <td class="xs-td-bighalf" data-header="{% trans 'Date' %}">{{ order.created_at | date:"M d, Y" }}</td>
+                    <td class="xs-td-smallhalf" data-header="{% trans 'Amount' %}">{{ order.price }}</td>
+                    <td data-header="{% trans 'Status' %}">
+                        {% if order.approved %}
+                            <span class="vm-status-active"><strong>Approved</strong></span>
+                        {% else %}
+                            <span class="vm-status-failed"><strong>Declined</strong></span>
+                        {% endif %}
+                    </td>
+                    <td class="text-right last-td">
+                        <a class="btn btn-order-detail alt-text" href="{% url 'hosting:orders' order.pk %}" data-alt="{% trans 'See Invoice' %}">{% trans "View Detail" %}</a>
+                    </td>
+                </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+
+    {% if is_paginated %}
+        <div class="pagination">
+            <span class="page-links">
+                {% if page_obj.has_previous %}
+                    <a href="{{request.path}}?page={{ page_obj.previous_page_number }}">{% trans "previous" %}</a>
+                {% endif %}
+                <span class="page-current">
+                    {% trans "Page" %} {{ page_obj.number }} {% trans "of" %} {{ page_obj.paginator.num_pages }}.
+                </span>
+                {% if page_obj.has_next %}
+                    <a href="{{request.path}}?page={{ page_obj.next_page_number }}">{% trans "next" %}</a>
+                {% endif %}
+            </span>
+        </div>
+    {% endif %}
+</div>
 {% endblock %}

hosting/templates/hosting/payment.html

@@ -41,9 +41,9 @@
                         {%trans "Total" %} <span>{%trans "including VAT" %}</span>
                     </div>
                     <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 tbl-no-padding">
-                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"></div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4"></div>
-                        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 tbl-total">{{request.session.specs.price}}
+                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 tbl-total">{{request.session.specs.price}}
-                            CHF
+                            CHF<span class="dcl-price-month">/{% trans "Month" %}</span>
                         </div>
                     </div>
                 </div>
@@ -87,10 +87,7 @@
                                 <div class="col-xs-12">
                                         {% if not messages and not form.non_field_errors %}
                                             <p class="card-warning-content card-warning-addtional-margin">
-                                                {% blocktrans %}
+                                                {% trans "You are not making any payment yet. After submitting your card information, you will be taken to the Confirm Order Page." %}
-                                                You are not making any payment yet. After submitting your card
-                                                information, you will be taken to the Confirm Order Page.
-                                                {% endblocktrans %}
                                             </p>
                                         {% endif %}
                                         <div id='payment_error'>
@@ -147,10 +144,7 @@
                                     <div class="col-xs-12">
                                         {% if not messages and not form.non_field_errors %}
                                             <p class="card-warning-content">
-                                                {% blocktrans %}
+                                                {% trans "You are not making any payment yet. After submitting your card information, you will be taken to the Confirm Order Page." %}
-                                                You are not making any payment yet. After submitting your card
-                                                information, you will be taken to the Confirm Order Page.
-                                                {% endblocktrans %}
                                             </p>
                                         {% endif %}
                                         <div id='payment_error'>

hosting/templates/hosting/virtual_machine_detail.html

@@ -3,193 +3,110 @@
 {% load i18n %}
 
 {% block content %}
-<div>
+	{% if messages %}
-	<div class="virtual-machine-container dashboard-container ">
+	    <div class="alert alert-warning">
-		<div class="row">
+	        {% for message in messages %}
-			<div class="col-md-9 col-md-offset-2">
+	        <span>{{ message }}</span>
-				 <div  class="col-sm-12">
+	        {% endfor %}
-				        <h3><i class="fa fa-cloud fa-separate" aria-hidden="true"></i> {{virtual_machine.name}}</h3>
+	    </div>
-				        <hr/>
+	{% endif %}
-				        <div class="col-md-3"> <!-- required for floating -->
+	<div class="virtual-machine-container dashboard-container">
-				          <!-- Nav tabs -->
+    <h1 class="dashboard-title-thin">{% trans "Your Virtual Machine Detail" %}</h1>
-				          <ul class="nav nav-tabs tabs-left sideways">
+		<div class="vm-detail-contain">
-				            <li class="active">
+			<div class="vm-detail-item">
-				            	<a href="#settings-v" data-toggle="tab">
+				<h2 class="vm-detail-title">{% trans "VM Settings" %} <img src="{% static 'hosting/img/settings.svg' %}" class="un-icon"></h2>
-				            		<i class="fa fa-cogs" aria-hidden="true"></i>
+				<h3 class="vm-name">{{virtual_machine.name}}</h3>
-				            		{% trans "Settings"%}
+				{% if virtual_machine.ipv6 %}
-				            	</a>
+					<div class="vm-detail-ip">
-				            </li>
+						<p>
-				            <li>
+							<span>IPv4:</span>
-				            	<a href="#billing-v" data-toggle="tab">
+							<span class="value">{{virtual_machine.ipv4}}</span>
-				            		<i class="fa fa-money" aria-hidden="true"></i>
+							<button data-clipboard-text="{{virtual_machine.ipv4}}" class="to_copy btn btn-link" data-toggle="tooltip" data-placement="left" title="{% trans 'Copied' %}" data-trigger="click">
-				            		{% trans "Billing"%}
+								<img class="un-icon" src="{% static 'hosting/img/copy.svg' %}">
-				            	</a>
+							</button>
-				            </li>
+						</p>
-				            <li>
+						<p>
-				            	<a href="#status-v" data-toggle="tab">
+							<span>IPv6:</span>
-				            		<i class="fa fa-signal" aria-hidden="true"></i> {% trans "Status"%}
+							<span class="value value-sm-block">{{virtual_machine.ipv6}}</span>
-				            	</a>
+							<button data-clipboard-text="{{virtual_machine.ipv6}}" class="to_copy btn btn-link" data-toggle="tooltip" data-placement="left" title="{% trans 'Copied' %}" data-trigger="click">
-				            </li>
+								<img class="un-icon" src="{% static 'hosting/img/copy.svg' %}">
-				          </ul>
+							</button>
-				        </div>
+						</p>
-
+					</div>
-				        <div class="col-md-9">
+				{% endif %}
-				          <!-- Tab panes -->
+				<div class="vm-detail-config">
-				          <div class="tab-content">
+					<p><span>{% trans "Cores" %}:</span><span class="value">{{virtual_machine.cores}}</span></p>
-				            <div class="tab-pane active" id="settings-v">
+					<p><span>{% trans "Memory" %}:</span><span class="value">{{virtual_machine.memory}} GB</span></p>
-				            	<div class="row">
+					<p><span>{% trans "Disk" %}:</span><span class="value">{{virtual_machine.disk_size|floatformat:2}} GB</span></p>
-									<div class="col-md-12 inline-headers">
+					<p><span>{% trans "Configuration" %}:</span><span class="value">{{virtual_machine.configuration}}</span></p>
-									<h3>{{virtual_machine.hosting_company_name}}</h3>
-
-										{% if virtual_machine.ipv6 %}
-											<div class="pull-right right-place">
-												<button type="link"
-					data-clipboard-text="{{virtual_machine.ipv4}}" id="copy_vm_id" class="to_copy btn btn-link"
-													data-toggle="tooltip"  data-placement="bottom" title="Copied"  data-trigger="click">
-														Ipv4: {{virtual_machine.ipv4}} <i class="fa fa-files-o" aria-hidden="true"></i>
-												</button>
-												<button type="link"
-					data-clipboard-text="{{virtual_machine.ipv6}}" id="copy_vm_id" class="to_copy btn btn-link"
-													data-toggle="tooltip"  data-placement="bottom" title="Copied"  data-trigger="click">
-														Ipv6: {{virtual_machine.ipv6}} <i class="fa fa-files-o" aria-hidden="true"></i>
-												</button>
-											</div>
-										{% else %}
-
-											<div class="pull-right right-place">
-												<span class="label label-warning"><strong>{% trans "Ip not assigned yet"%}</strong></span>
-												<i data-toggle="tooltip"  title="Your ip will be assigned soon" class="fa fa-info-circle" aria-hidden="true"></i>
-											</div>
-
-										{% endif %}
-
-									<hr>
-
-									</div>
-				            	</div>
-								<div class="row">
-								  <div class="col-md-12">
-								    <div class="row">
-								      <div class="col-md-3">
-								        <div class="well text-center box-setting">
-								        	<i class="fa fa-cubes" aria-hidden="true"></i>
-								        	<span>{% trans "Cores"%}</span>
-								        	<span class="label label-success">{{virtual_machine.cores}}</span>
-								        </div>
-								      </div>
-								      <div class="col-md-3">
-								        <div class="well text-center box-setting">
-								        	<i class="fa fa-tachometer" aria-hidden="true"></i> {% trans "Memory"%} <br/>
-								        	<span class="label label-success">{{virtual_machine.memory}} GB</span>
-								        </div>
-								      </div>
-								      <div class="col-md-3">
-								        <div class="well text-center box-setting">
-								        	<i class="fa fa-hdd-o" aria-hidden="true"></i>
-								        	<span>{% trans "Disk"%}</span>
-								        	<span class="label label-success">{{virtual_machine.disk_size|floatformat:2}} GB</span>
-								        </div>
-								      </div>
-								    </div><!--/row-->
-								  </div><!--/col-12-->
-								</div><!--/row-->
-								<div class="row">
-									<div class="col-md-12">
-										{% trans "Configuration"%}: {{virtual_machine.configuration}}
-									</div>
-								</div>
-
-
-				            </div>
-				            <div class="tab-pane" id="billing-v">
-
-				            	<div class="row ">
-									<div class="col-md-12 inline-headers">
-										<h3>{% trans "Current pricing"%}</h3>
-										<span class="h3 pull-right"><strong>{{virtual_machine.price|floatformat}} CHF</strong>/month</span>
-										<hr>
-									</div>
-				            	</div>
-				            </div>
-				            <div class="tab-pane" id="status-v">
-				            	<div class="row ">
-									<div class="col-md-12 inline-headers">
-										<h3>{% trans "Current status"%}</h3>
-
-										<div  class="pull-right space-above">
-											{% if virtual_machine.state == 'PENDING' %}
-												<span class="label
-                                                    label-warning"><strong>Pending</strong></span>
-											{% elif  virtual_machine.state == 'ACTIVE' %}
-												<span class="label
-                                                    label-success"><strong>Online</strong></span>
-											{% elif  virtual_machine.state == 'FAILED'%}
-												<span class="label
-                                                    label-danger"><strong>Failed</strong></span>
-											{% endif %}
-										</div>
-									</div>
-				            	</div>
-				            	{% if not virtual_machine.status == 'canceled' %}
-				            	<div class="row">
-									<div class="col-md-12 separate-md">
-										<div class="pull-right">
-											<form method="POST"
-                 id="virtual_machine_cancel_form" class="cancel-form" action="{% url 'hosting:virtual_machines' virtual_machine.vm_id %}">
-											{% csrf_token %}
-											</form>
-
-												<button type="text" data-href="{% url 'hosting:virtual_machines' virtual_machine.vm_id %}" data-toggle="modal" data-target="#confirm-cancel" class="btn btn-danger">{% trans "Terminate Virtual Machine"%}</button>
-
-										</div>
-
-									</div>
-                                    <div class="col-md-12">
-                                        <br/>
-                                        {% if messages %}
-                                            <div class="alert alert-warning">
-                                                {% for message in messages %}
-                                                <span>{{ message }}</span>
-                                                {% endfor %}
-                                            </div>
-                                        {% endif %}
-                                    </div>
-
-									<!-- Cancel Modal -->
-									<div class="modal fade" id="confirm-cancel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-									    <div class="modal-dialog">
-									        <div class="modal-content">
-												<div class="modal-header">
-													<button type="button" class="close" data-dismiss="modal"
-															aria-label="Confirm"><span
-															aria-hidden="true">&times;</span>
-													</button>
-												</div>
-									            <div class="modal-body">
-													<div class="modal-icon"><i class="fa fa-ban" aria-hidden="true"></i></div>
-													<h4 class="modal-title" id="ModalLabel">{% trans "Terminate your Virtual Machine"%}</h4>
-									                <p class="modal-text">{% trans "Are you sure do you want to cancel your Virtual Machine "%} {{virtual_machine.name}} ?</p>
-									            </div>
-									            <div class="modal-footer">
-									                <a class="btn btn-danger btn-ok">OK</a>
-									            </div>
-									        </div>
-									    </div>
-									</div>
-									<!-- / Cancel Modal -->
-				            	</div>
-				            	{% endif %}
-				            </div>
-				          </div>
-				        </div>
-
-				        <div class="clearfix"></div>
 				</div>
 			</div>
-
+			<div class="vm-detail-item">
+				<h2 class="vm-detail-title">{% trans "Billing" %} <img src="{% static 'hosting/img/billing.svg' %}" class="un-icon"></h2>
+				<div class="vm-vmid">
+					<div class="vm-item-subtitle">{% trans "Current Pricing" %}</div>
+					<div class="vm-item-lg">{{virtual_machine.price|floatformat}} CHF/{% trans "Month" %}</div>
+					<a class="btn btn-vm-invoice" href="{% url 'hosting:orders' order.pk %}">{% trans "See Invoice" %}</a>
+				</div>
+			</div>
+			<div class="vm-detail-item">
+				<h2 class="vm-detail-title">{% trans "Status" %} <img src="{% static 'hosting/img/connected.svg' %}" class="un-icon"></h2>
+				<div class="vm-vmid">
+					<div class="vm-item-subtitle">{% trans "Your VM is" %}</div>
+					{% if virtual_machine.state == 'PENDING' %}
+						<div class="vm-item-lg vm-color-pending">{% trans "Pending" %}</div>
+					{% elif  virtual_machine.state == 'ACTIVE' %}
+						<div class="vm-item-lg vm-color-online">{% trans "Online" %}</div>
+					{% elif  virtual_machine.state == 'FAILED'%}
+						<div class="vm-item-lg vm-color-failed">{% trans "Failed" %}</div>
+					{% endif %}
+					{% if not virtual_machine.status == 'canceled' %}
+						<form method="POST" id="virtual_machine_cancel_form" class="cancel-form" action="{% url 'hosting:virtual_machines' virtual_machine.vm_id %}">
+							{% csrf_token %}
+						</form>
+						<button data-href="{% url 'hosting:virtual_machines' virtual_machine.vm_id %}" data-toggle="modal" data-target="#confirm-cancel" class="btn btn-vm-term">{% trans "Terminate VM" %}</button>
+					{% endif %}
+				</div>
+			</div>
+		</div>
+		<div class="vm-contact-us">
+			<div>
+				<h2 class="vm-detail-title">{% trans "Support / Contact" %} <img class="un-icon visible-xs" src="{% static 'hosting/img/24-hours-support.svg' %}"></h2>
+			</div>
+			<div class="vm-contact-us-text text-center">
+				<img class="un-icon hidden-xs" src="{% static 'hosting/img/24-hours-support.svg' %}">
+				<div>
+					<span>{% trans "Something doesn't work?" %}</span> <span>{% trans "We are here to help you!" %}</span>
+				</div>
+			</div>
+			<div class="text-center">
+				<a class="btn btn-vm-contact" href="mailto:support@datacenterlight.ch">{% trans "CONTACT" %}</a>
+			</div>
+		</div>
+		<div class="text-center">
+			<a class="btn btn-vm-back" href="{% url 'hosting:virtual_machines' %}">{% trans "BACK TO LIST" %}</a>
+		</div>
+	</div>
+	<!-- Cancel Modal -->
+	<div class="modal fade" id="confirm-cancel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+	    <div class="modal-dialog">
+	        <div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Confirm"><span aria-hidden="true">&times;</span></button>
+				</div>
+	            <div class="modal-body">
+					<div class="modal-icon"><i class="fa fa-ban" aria-hidden="true"></i></div>
+					<h4 class="modal-title" id="ModalLabel">{% trans "Terminate your Virtual Machine"%}</h4>
+					<div class="modal-text">
+						<p>{% trans "Do you want to cancel your Virtual Machine" %} ?</p>
+						<p><strong>{{virtual_machine.name}}</strong></p>
+					</div>
+	            </div>
+	            <div class="modal-footer">
+	                <a class="btn btn-danger btn-ok">{% trans "OK" %}</a>
+	            </div>
+	        </div>
 	    </div>
 	</div>
-
+	<!-- / Cancel Modal -->
-</div>
-
 {%endblock%}

hosting/views.py

@@ -257,7 +257,7 @@ class SignupValidatedView(SignupValidateView):
         else:
             home_url = '<a href="' + \
                        reverse('datacenterlight:index') + \
-                '">Data Center Light</a>'
+                       '">Data Center Light</a>'
             message = '{sorry_message} <br />{go_back_to} {hurl}'.format(
                 sorry_message=_("Sorry. Your request is invalid."),
                 go_back_to=_('Go back to'),
@@ -583,7 +583,7 @@ class PaymentVMView(LoginRequiredMixin, FormView):
                                                        customer=customer.stripe_id)
 
             # Check if the payment was approved
-            if not charge_response.get('response_object') and not charge_response.get('paid'):
+            if not charge_response.get('response_object'):
                 msg = charge_response.get('error')
                 messages.add_message(
                     self.request, messages.ERROR, msg, extra_tags='make_charge_error')
@@ -846,6 +846,7 @@ class VirtualMachineView(LoginRequiredMixin, View):
             serializer = VirtualMachineSerializer(vm)
             context = {
                 'virtual_machine': serializer.data,
+                'order': HostingOrder.objects.get(vm_id=serializer.data['vm_id'])
             }
         except:
             pass

requirements.txt

@@ -83,9 +83,16 @@ wheel==0.29.0
 django-admin-honeypot==1.0.0
 coverage==4.3.4
 git+https://github.com/ungleich/python-oca.git#egg=python-oca
-djangorestframework
+djangorestframework==3.6.3
 flake8==3.3.0
 python-memcached==1.58
 celery==4.0.2
 redis==2.10.5
 django-celery-results==1.0.1
+kombu==4.1.0
+mccabe==0.6.1
+pycodestyle==2.3.1
+pyflakes==1.5.0
+billiard==3.5.0.3
+amqp==2.2.1
+vine==1.1.4

utils/stripe_utils.py

@@ -1,6 +1,10 @@
+import logging
 import stripe
 from django.conf import settings
+from datacenterlight.models import StripePlan
+
 stripe.api_key = settings.STRIPE_API_PRIVATE_KEY
+logger = logging.getLogger(__name__)
 
 
 def handleStripeError(f):
@@ -26,7 +30,8 @@ def handleStripeError(f):
             response.update({'error': err['message']})
             return response
         except stripe.error.RateLimitError as e:
-            response.update({'error': "Too many requests made to the API too quickly"})
+            response.update(
+                {'error': "Too many requests made to the API too quickly"})
             return response
         except stripe.error.InvalidRequestError as e:
             response.update({'error': "Invalid parameters"})
@@ -55,6 +60,10 @@ class StripeUtils(object):
     CURRENCY = 'chf'
     INTERVAL = 'month'
     SUCCEEDED_STATUS = 'succeeded'
+    STRIPE_PLAN_ALREADY_EXISTS = 'Plan already exists'
+    STRIPE_NO_SUCH_PLAN = 'No such plan'
+    PLAN_EXISTS_ERROR_MSG = 'Plan {} exists already.\nCreating a local StripePlan now.'
+    PLAN_DOES_NOT_EXIST_ERROR_MSG = 'Plan {} does not exist.'
 
     def __init__(self):
         self.stripe = stripe
@@ -96,7 +105,8 @@ class StripeUtils(object):
                 customer = stripe.Customer.retrieve(id)
             except stripe.InvalidRequestError:
                 customer = self.create_customer(token, user.email, user.name)
-                user.stripecustomer.stripe_id = customer.get('response_object').get('id')
+                user.stripecustomer.stripe_id = customer.get(
+                    'response_object').get('id')
                 user.stripecustomer.save()
         return customer
 
@@ -129,13 +139,92 @@ class StripeUtils(object):
         return charge
 
     @handleStripeError
-    def create_plan(self, amount, name, id):
+    def get_or_create_stripe_plan(self, amount, name, stripe_plan_id):
-        self.stripe.Plan.create(
+        """
-            amount=amount,
+        This function checks if a StripePlan with the given
-            interval=self.INTERVAL,
+        stripe_plan_id already exists. If it exists then the function
-            name=name,
+        returns this object otherwise it creates a new StripePlan and
-            currency=self.CURRENCY,
+        returns the new object.
-            id=id)
+
+        :param amount: The amount in CHF
+        :param name: The name of the Stripe plan to be created.
+        :param stripe_plan_id: The id of the Stripe plan to be
+               created. Use get_stripe_plan_id_string function to
+               obtain the name of the plan to be created
+        :return: The StripePlan object if it exists else creates a
+               Plan object in Stripe and a local StripePlan and
+               returns it. Returns None in case of Stripe error
+        """
+        _amount = float(amount)
+        amount = int(_amount * 100)  # stripe amount unit, in cents
+        stripe_plan_db_obj = None
+        try:
+            stripe_plan_db_obj = StripePlan.objects.get(
+                stripe_plan_id=stripe_plan_id)
+        except StripePlan.DoesNotExist:
+            try:
+                self.stripe.Plan.create(
+                    amount=amount,
+                    interval=self.INTERVAL,
+                    name=name,
+                    currency=self.CURRENCY,
+                    id=stripe_plan_id)
+                stripe_plan_db_obj = StripePlan.objects.create(
+                    stripe_plan_id=stripe_plan_id)
+            except stripe.error.InvalidRequestError as e:
+                if self.STRIPE_PLAN_ALREADY_EXISTS in str(e):
+                    logger.debug(
+                        self.PLAN_EXISTS_ERROR_MSG.format(stripe_plan_id))
+                    stripe_plan_db_obj = StripePlan.objects.create(
+                        stripe_plan_id=stripe_plan_id)
+        return stripe_plan_db_obj
+
+    @handleStripeError
+    def delete_stripe_plan(self, stripe_plan_id):
+        """
+        Deletes the Plan in Stripe and also deletes the local db copy
+        of the plan if it exists
+
+        :param stripe_plan_id: The stripe plan id that needs to be
+               deleted
+        :return: True if the plan was deleted successfully from
+               Stripe, False otherwise.
+        """
+        return_value = False
+        try:
+            plan = self.stripe.Plan.retrieve(stripe_plan_id)
+            plan.delete()
+            return_value = True
+            StripePlan.objects.filter(
+                stripe_plan_id=stripe_plan_id).all().delete()
+        except stripe.error.InvalidRequestError as e:
+            if self.STRIPE_NO_SUCH_PLAN in str(e):
+                logger.debug(
+                    self.PLAN_DOES_NOT_EXIST_ERROR_MSG.format(stripe_plan_id))
+        return return_value
+
+    @handleStripeError
+    def subscribe_customer_to_plan(self, customer, plans):
+        """
+        Subscribes the given customer to the list of given plans
+
+        :param customer: The stripe customer identifier
+        :param plans: A list of stripe plans.
+        Ref: https://stripe.com/docs/api/python#create_subscription-items
+              e.g.
+                    plans = [
+                                {
+                                  "plan": "dcl-v1-cpu-2-ram-5gb-ssd-10gb",
+                                },
+                            ]
+        :return: The subscription StripeObject
+        """
+
+        subscription_result = self.stripe.Subscription.create(
+            customer=customer,
+            items=plans,
+        )
+        return subscription_result
 
     @handleStripeError
     def make_payment(self, customer, amount, token):
@@ -145,3 +234,29 @@ class StripeUtils(object):
             customer=customer
         )
         return charge
+
+    @staticmethod
+    def get_stripe_plan_id(cpu, ram, ssd, version, app='dcl', hdd=None):
+        """
+        Returns the stripe plan id string of the form
+        `dcl-v1-cpu-2-ram-5gb-ssd-10gb` based on the input parameters
+
+        :param cpu: The number of cores
+        :param ram: The size of the RAM in GB
+        :param ssd: The size of ssd storage in GB
+        :param hdd: The size of hdd storage in GB
+        :param version: The version of the Stripe plans
+        :param app: The application to which the stripe plan belongs
+        to. By default it is 'dcl'
+        :return: A string of the form `dcl-v1-cpu-2-ram-5gb-ssd-10gb`
+        """
+        dcl_plan_string = 'cpu-{cpu}-ram-{ram}gb-ssd-{ssd}gb'.format(cpu=cpu,
+                                                                     ram=ram,
+                                                                     ssd=ssd)
+        if hdd is not None:
+            dcl_plan_string = '{dcl_plan_string}-hdd-{hdd}gb'.format(
+                dcl_plan_string=dcl_plan_string, hdd=hdd)
+        stripe_plan_id_string = '{app}-v{version}-{plan}'.format(app=app,
+                                                                 version=version,
+                                                                 plan=dcl_plan_string)
+        return stripe_plan_id_string

utils/tests.py

@@ -1,10 +1,15 @@
-from django.test import TestCase
+import uuid
-from django.test import Client
+from unittest.mock import patch
-from django.http.request import HttpRequest
 
-from model_mommy import mommy
-from utils.stripe_utils import StripeUtils
 import stripe
+from django.http.request import HttpRequest
+from django.test import Client
+from django.test import TestCase
+from model_mommy import mommy
+
+from datacenterlight.models import StripePlan
+from membership.models import StripeCustomer
+from utils.stripe_utils import StripeUtils
 from django.conf import settings
 
 
@@ -18,8 +23,9 @@ class BaseTestCase(TestCase):
         self.dummy_password = 'test_password'
 
         # Users
-        self.customer, self.another_customer = mommy.make('membership.CustomUser',
+        self.customer, self.another_customer = mommy.make(
-                                                          _quantity=2)
+            'membership.CustomUser',
+            _quantity=2)
         self.customer.set_password(self.dummy_password)
         self.customer.save()
         self.another_customer.set_password(self.dummy_password)
@@ -94,17 +100,16 @@ class TestStripeCustomerDescription(TestCase):
     """
 
     def setUp(self):
-        self.dummy_password = 'test_password'
+        self.customer_password = 'test_password'
-        self.dummy_email = 'test@ungleich.ch'
+        self.customer_email = 'test@ungleich.ch'
+        self.customer_name = "Monty Python"
         self.customer = mommy.make('membership.CustomUser')
-        self.customer.set_password(self.dummy_password)
+        self.customer.set_password(self.customer_password)
-        self.customer.email = self.dummy_email
+        self.customer.email = self.customer_email
         self.customer.save()
-        stripe.api_key = settings.STRIPE_API_PRIVATE_KEY
+        self.stripe_utils = StripeUtils()
-
+        stripe.api_key = settings.STRIPE_API_PRIVATE_KEY_TEST
-    def test_creating_stripe_customer(self):
+        self.token = stripe.Token.create(
-        test_name = "Monty Python"
-        token = stripe.Token.create(
             card={
                 "number": '4111111111111111',
                 "exp_month": 12,
@@ -112,8 +117,121 @@ class TestStripeCustomerDescription(TestCase):
                 "cvc": '123'
             },
         )
-        stripe_utils = StripeUtils()
+        self.failed_token = stripe.Token.create(
-        stripe_data = stripe_utils.create_customer(token.id, self.customer.email, test_name)
+            card={
+                "number": '4000000000000341',
+                "exp_month": 12,
+                "exp_year": 2022,
+                "cvc": '123'
+            },
+        )
+
+    def test_creating_stripe_customer(self):
+        stripe_data = self.stripe_utils.create_customer(self.token.id,
+                                                        self.customer.email,
+                                                        self.customer_name)
         self.assertEqual(stripe_data.get('error'), None)
         customer_data = stripe_data.get('response_object')
-        self.assertEqual(customer_data.description, test_name)
+        self.assertEqual(customer_data.description, self.customer_name)
+
+
+class StripePlanTestCase(TestStripeCustomerDescription):
+    """
+    A class to test Stripe plans
+    """
+
+    def test_get_stripe_plan_id_string(self):
+        plan_id_string = StripeUtils.get_stripe_plan_id(cpu=2, ram=20, ssd=100,
+                                                        version=1, app='dcl')
+        self.assertEqual(plan_id_string, 'dcl-v1-cpu-2-ram-20gb-ssd-100gb')
+        plan_id_string = StripeUtils.get_stripe_plan_id(cpu=2, ram=20, ssd=100,
+                                                        version=1, app='dcl',
+                                                        hdd=200)
+        self.assertEqual(plan_id_string,
+                         'dcl-v1-cpu-2-ram-20gb-ssd-100gb-hdd-200gb')
+
+    def test_get_or_create_plan(self):
+        stripe_plan = self.stripe_utils.get_or_create_stripe_plan(2000,
+                                                                  "test plan 1",
+                                                                  stripe_plan_id='test-plan-1')
+        self.assertIsNone(stripe_plan.get('error'))
+        self.assertIsInstance(stripe_plan.get('response_object'), StripePlan)
+
+    @patch('utils.stripe_utils.logger')
+    def test_create_duplicate_plans_error_handling(self, mock_logger):
+        """
+        Test details:
+            1. Create a test plan in Stripe with a particular id
+            2. Try to recreate the plan with the same id
+            3. This creates a Stripe error, the code should be able to handle the error
+
+        :param mock_logger:
+        :return:
+        """
+        unique_id = str(uuid.uuid4().hex)
+        new_plan_id_str = 'test-plan-{}'.format(unique_id)
+        stripe_plan = self.stripe_utils.get_or_create_stripe_plan(2000,
+                                                                  "test plan {}".format(
+                                                                      unique_id),
+                                                                  stripe_plan_id=new_plan_id_str)
+        self.assertIsInstance(stripe_plan.get('response_object'), StripePlan)
+        self.assertEqual(stripe_plan.get('response_object').stripe_plan_id,
+                         new_plan_id_str)
+
+        # Test creating the same plan again and expect the PLAN_EXISTS_ERROR_MSG
+        # We first delete the local Stripe Plan, so that the code tries to create a new plan in Stripe
+        StripePlan.objects.filter(
+            stripe_plan_id=new_plan_id_str).all().delete()
+        stripe_plan_1 = self.stripe_utils.get_or_create_stripe_plan(2000,
+                                                                    "test plan {}".format(
+                                                                        unique_id),
+                                                                    stripe_plan_id=new_plan_id_str)
+        mock_logger.debug.assert_called_with(
+            self.stripe_utils.PLAN_EXISTS_ERROR_MSG.format(new_plan_id_str))
+        self.assertIsInstance(stripe_plan_1.get('response_object'), StripePlan)
+        self.assertEqual(stripe_plan_1.get('response_object').stripe_plan_id,
+                         new_plan_id_str)
+
+        # Delete the test stripe plan that we just created
+        delete_result = self.stripe_utils.delete_stripe_plan(new_plan_id_str)
+        self.assertIsInstance(delete_result, dict)
+        self.assertEqual(delete_result.get('response_object'), True)
+
+    @patch('utils.stripe_utils.logger')
+    def test_delete_unexisting_plan_should_fail(self, mock_logger):
+        plan_id = 'crazy-plan-id-that-does-not-exist'
+        result = self.stripe_utils.delete_stripe_plan(plan_id)
+        self.assertIsInstance(result, dict)
+        self.assertEqual(result.get('response_object'), False)
+        mock_logger.debug.assert_called_with(
+            self.stripe_utils.PLAN_DOES_NOT_EXIST_ERROR_MSG.format(plan_id))
+
+    def test_subscribe_customer_to_plan(self):
+        stripe_plan = self.stripe_utils.get_or_create_stripe_plan(2000,
+                                                                  "test plan 1",
+                                                                  stripe_plan_id='test-plan-1')
+        stripe_customer = StripeCustomer.get_or_create(
+            email=self.customer_email,
+            token=self.token)
+        result = self.stripe_utils.subscribe_customer_to_plan(
+            stripe_customer.stripe_id,
+            [{"plan": stripe_plan.get(
+                'response_object').stripe_plan_id}])
+        self.assertIsInstance(result.get('response_object'),
+                              stripe.Subscription)
+        self.assertIsNone(result.get('error'))
+        self.assertEqual(result.get('response_object').get('status'), 'active')
+
+    def test_subscribe_customer_to_plan_failed_payment(self):
+        stripe_plan = self.stripe_utils.get_or_create_stripe_plan(2000,
+                                                                  "test plan 1",
+                                                                  stripe_plan_id='test-plan-1')
+        stripe_customer = StripeCustomer.get_or_create(
+            email=self.customer_email,
+            token=self.failed_token)
+        result = self.stripe_utils.subscribe_customer_to_plan(
+            stripe_customer.stripe_id,
+            [{"plan": stripe_plan.get(
+                'response_object').stripe_plan_id}])
+        self.assertIsNone(result.get('response_object'), None)
+        self.assertIsNotNone(result.get('error'))