diff --git a/datacenterlight/forms.py b/datacenterlight/forms.py index 33d95c29..3ffe403c 100644 --- a/datacenterlight/forms.py +++ b/datacenterlight/forms.py @@ -1,6 +1,6 @@ from django import forms -from .models import BetaAccess +from .models import BetaAccess, ContactUs class BetaAccessForm(forms.ModelForm): @@ -11,6 +11,13 @@ class BetaAccessForm(forms.ModelForm): model = BetaAccess +class ContactForm(forms.ModelForm): + + class Meta: + fields = ['name', 'email', 'message'] + model = ContactUs + + # class BetaAccessVMForm(forms.ModelForm): # type = forms.CharField(widget=forms.EmailInput()) diff --git a/datacenterlight/locale/de/LC_MESSAGES/django.po b/datacenterlight/locale/de/LC_MESSAGES/django.po index 3853d4e3..c0dc55ca 100644 --- a/datacenterlight/locale/de/LC_MESSAGES/django.po +++ b/datacenterlight/locale/de/LC_MESSAGES/django.po @@ -82,6 +82,24 @@ msgstr "Bitte gib eine gültige E-Mailadresse ein." msgid "Continue" msgstr "Weiter" +msgid "Thank you for contacting us." +msgstr "Nachricht gesendet." + +msgid "Your message was successfully sent to our team." +msgstr "Vielen Dank für Deine Nachricht." + +msgid "Get in touch with us!" +msgstr "Sende uns eine Nachricht." + +msgid "Message" +msgstr "Nachricht" + +msgid "Sorry, there was an unexpected error. Kindly retry." +msgstr "Bitte entschuldige, es scheint ein unerwarteter Fehler aufgetreten zu sein. Versuche es doch bitte noch einmal." + +msgid "SUBMIT" +msgstr "ABSENDEN" + msgid "Thank you for your request." msgstr "Vielen Dank für Ihre Anfrage." @@ -234,15 +252,12 @@ msgstr "" msgid "Affordable VM hosting based in Switzerland" msgstr "Bezahlbares VM Hosting in der Schweiz" +msgid "Contact us" +msgstr "Kontaktiere uns" + msgid "Switzerland " msgstr "Schweiz" -msgid "Questions?" -msgstr "Fragen?" - -msgid "Contact us!" -msgstr "Kontaktiere uns!" - msgid "Confirm Order" msgstr "Bestellung Bestätigen" @@ -412,6 +427,9 @@ msgstr "ist kein gültiger Name" msgid "is not a proper email" msgstr "ist keine gültige E-Mailadresse" +#~ msgid "Questions?" +#~ msgstr "Fragen?" + #~ msgid "Please enter a value greater than or equal to 1." #~ msgstr "Bitte gib einen Wert größer oder gleich 1 ein." diff --git a/datacenterlight/migrations/0007_contactus.py b/datacenterlight/migrations/0007_contactus.py new file mode 100644 index 00000000..12af594c --- /dev/null +++ b/datacenterlight/migrations/0007_contactus.py @@ -0,0 +1,24 @@ +# -*- coding: utf-8 -*- +# Generated by Django 1.9.4 on 2017-08-19 21:08 +from __future__ import unicode_literals + +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('datacenterlight', '0006_vmtemplate'), + ] + + operations = [ + migrations.CreateModel( + name='ContactUs', + fields=[ + ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')), + ('name', models.CharField(max_length=250)), + ('email', models.CharField(max_length=250)), + ('message', models.TextField()), + ], + ), + ] diff --git a/datacenterlight/migrations/0008_contactus_field.py b/datacenterlight/migrations/0008_contactus_field.py new file mode 100644 index 00000000..ceea8f8f --- /dev/null +++ b/datacenterlight/migrations/0008_contactus_field.py @@ -0,0 +1,23 @@ +# -*- coding: utf-8 -*- +# Generated by Django 1.9.4 on 2017-08-23 13:06 +from __future__ import unicode_literals + +import datetime +from django.db import migrations, models +from django.utils.timezone import utc + + +class Migration(migrations.Migration): + + dependencies = [ + ('datacenterlight', '0007_contactus'), + ] + + operations = [ + migrations.AddField( + model_name='contactus', + name='field', + field=models.DateTimeField(auto_now_add=True, default=datetime.datetime(2017, 8, 23, 13, 6, 24, 650869, tzinfo=utc)), + preserve_default=False, + ), + ] diff --git a/datacenterlight/models.py b/datacenterlight/models.py index f7b50a01..e2de41e1 100644 --- a/datacenterlight/models.py +++ b/datacenterlight/models.py @@ -57,7 +57,8 @@ class VMTemplate(models.Model): @classmethod def create(cls, name, opennebula_vm_template_id): - vm_template = cls(name=name, opennebula_vm_template_id=opennebula_vm_template_id) + vm_template = cls( + name=name, opennebula_vm_template_id=opennebula_vm_template_id) return vm_template @@ -71,3 +72,10 @@ class StripePlan(models.Model): def create(cls, stripe_plan_id): stripe_plan = cls(stripe_plan_id=stripe_plan_id) return stripe_plan + + +class ContactUs(models.Model): + name = models.CharField(max_length=250) + email = models.CharField(max_length=250) + message = models.TextField() + field = models.DateTimeField(auto_now_add=True) diff --git a/datacenterlight/static/datacenterlight/css/landing-page.css b/datacenterlight/static/datacenterlight/css/landing-page.css index a5562710..9d83a88f 100755 --- a/datacenterlight/static/datacenterlight/css/landing-page.css +++ b/datacenterlight/static/datacenterlight/css/landing-page.css @@ -323,9 +323,9 @@ button, input, optgroup, select, textarea { padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */ padding-bottom: 50px; - text-align: center; +/* text-align: center; */ color: #f8f8f8; - background: url(../img/banner-bg.jpg) no-repeat center center; + background: url(../img/pattern.jpg) no-repeat center center; background-size: cover; position: relative; } @@ -654,74 +654,161 @@ button, input, optgroup, select, textarea { position: relative; } -.full-contact-section { - background-image: -ms-linear-gradient(right, #29427A 50%, #4F6699 100%); - background-image: -moz-linear-gradient(right, #29427A 50%, #4F6699 100%); - background-image: -o-linear-gradient(right, #29427A 50%, #4F6699 100%); - background-image: -webkit-gradient(linear, right top, left top, color-stop(50, #29427A), color-stop(100, #4F6699)); - background-image: -webkit-linear-gradient(right, #29427A 50%, #4F6699 100%); - background-image: linear-gradient(to left, #29427A 50%, #4F6699 100%); -} - .contact-section { - padding: 60px 0; - color: #fff; + padding: 80px 0; + color: rgba(255,255,255,0.9); background-attachment: fixed; } -.contact-section .card { - text-align: center; - width: 350px; - margin: 0 auto; - background: #fff; - box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); - padding-bottom: 40px; - border-radius: 7px; - color: #4c4444; - box-sizing: border-box; - padding: 45px; - margin-top: -115px; +.contact-section .modal { + color: #333; } -.contact-section .card .social a { - color: #29427A; +.contact-details { + padding-left: 5px; +} + +.contact-section .description{ + font-size: 20px; +} + +.contact-section .social a { + color: #fff; font-size: 45px; } -.contact-section .card .subtitle h3 { - font-size: 30px; - margin-bottom: 23px; +.contact-section .social .fa-facebook { + font-size: 40px; + background: #fff; + border-radius: 100%; + color: #425d89; + width: 40px; + text-align: center; + top: -2px; + position: relative; + left: 10px; +} +.contact-section .social .fa-facebook:before { + font-size: 32px; + position: relative; + top: -1px; + left: -1px; } -.contact-section .card .social a:hover { +.contact-section .social a:hover { text-decoration: none; } -.contact-section .title { - margin-right: auto; - width: 80%; - max-width: 468px; +.contact-section .subtitle h3 { + font-size: 30px; + margin-bottom: 15px; +} + +.contact-section .contact-form-success { + font-size: 18px; + text-align: center; + background-color: rgba(0,0,0,0.2); + padding: 0 15px 35px; + margin-top: 25px; } .contact-section .title h2 { font-size: 65px; margin: 0; - color: #fff; - padding-bottom: 25px; position: relative; - text-align: right; +/* color: #eee; + padding-bottom: 25px; + text-align: right; */ } -.contact-section .title h2::before { - content: ""; +.contact-form .form-group { + border: 0; + margin-bottom: 20px; +} + +.contact-form .form-group label { + letter-spacing: 0.6px; + font-weight: 400; +} + +.contact-form .btn { + min-width: 140px; + background: rgba(23, 23, 23, 0.18); + color: #fff; + border-radius: 4px; + border-width: 2px; + box-shadow: none; + letter-spacing: 2px; + border-color: #fff; +} + +.contact-form .btn.sending { + cursor: wait; +} + +@keyframes sending { + 0% {content: '.';} + 50% {content: '..';} + 100% {content: '...';} +} + +.contact-form .btn.sending:after { + content: '.'; position: absolute; - bottom: 0; - background: #fff; - height: 7px; - width: 70px; - right: 0; + display: inline-block; + text-align: left; + margin-left: 5px; + width: 20px; + animation: sending 1s linear infinite; } +.contact-form .btn:hover, +.contact-form .btn:focus { + background: rgba(23, 23, 23, 0.28); + border-color: #fff; + box-shadow: none; + outline: 0; +} + +.contact-form .form-control { + box-shadow: none; + border-color: #ccc; +} + +.contact-form .errorlist { + list-style: none; + padding: 5px; + margin: 0; + color: rgb(255, 164, 164); + font-weight: 600; + letter-spacing: 0.4px; +} + +.contact-form .form-error { + background: rgba(255,255,255,0.9); + color: #eb4d5c; + padding: 10px; + text-align: center; + margin-bottom: 20px; + border-radius: 5px; +} + +.contact-form .has-error label { + color: #fff; +} + +.contact-form .has-error .form-control { + border: 2px solid #e8534b; + box-shadow: none; +} + +.contact-form .subtitle { + padding: 22px 0 15px; +} + +.contact-form textarea { + resize: none; +} /*Why DCL*/ @@ -1311,9 +1398,9 @@ tech-sub-sec h2 { margin: 0 auto; } .contact-section .title h2 { - font-size: 35px; + font-size: 45px; line-height: 40px; - text-align: center; +/* text-align: center; */ margin-top: 35px; } .contact-section .title h2::before { @@ -1558,4 +1645,4 @@ a.list-group-item-danger.active:focus { } .panel-danger > .panel-heading .badge { background-color: #eb4d5c; -} \ No newline at end of file +} diff --git a/datacenterlight/static/datacenterlight/img/facebook_logo.svg b/datacenterlight/static/datacenterlight/img/facebook_logo.svg new file mode 100644 index 00000000..c2ab1b51 --- /dev/null +++ b/datacenterlight/static/datacenterlight/img/facebook_logo.svg @@ -0,0 +1,11 @@ + + + + Slice 20 + Created with Sketch. + + + + + + \ No newline at end of file diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index 5594fe11..2e928955 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -39,7 +39,7 @@ _initScroll(); _initNavUrl(); _initPricing(); - + ajaxForms(); }); $(window).resize(function() { @@ -157,4 +157,27 @@ $('#valueTotal').text(numbers * price * 31); } -})(jQuery); + function ajaxForms() { + $('body').on('submit', '.ajax-form', function(e){ + e.preventDefault(); + var $form = $(this); + $form.find('[type=submit]').addClass('sending'); + $.ajax({ + url: $form.attr('action'), + type: $form.attr('method'), + data: $form.serialize(), + + success: function(response) { + var responseContain = $($form.attr('data-response')); + responseContain.html(response); + $form.find('[type=submit]').removeClass('sending'); + }, + + error: function() { + $form.find('[type=submit]').removeClass('sending'); + $form.find('.form-error').removeClass('hide'); + } + }); + }) + } +})(jQuery); \ No newline at end of file diff --git a/datacenterlight/templates/datacenterlight/contact_form.html b/datacenterlight/templates/datacenterlight/contact_form.html new file mode 100644 index 00000000..458d6168 --- /dev/null +++ b/datacenterlight/templates/datacenterlight/contact_form.html @@ -0,0 +1,50 @@ +{% load i18n %} + +{% if success %} +
+
+

{% trans "Thank you for contacting us." %}

+
+

+ {% trans "Your message was successfully sent to our team." %} +

+
+{% else %} +
+
+
+

{% trans "Get in touch with us!" %}

+
+
+
+
+ {% csrf_token %} +
+ +
+ + {{contact_form.name.errors}} +
+
+
+ +
+ + {{contact_form.email.errors}} +
+
+
+ +
+ + {{contact_form.message.errors}} +
+
+
+
+
{% trans "Sorry, there was an unexpected error. Kindly retry." %}
+ +
+
+
+{% endif %} \ No newline at end of file diff --git a/datacenterlight/templates/datacenterlight/index.html b/datacenterlight/templates/datacenterlight/index.html index 3ddb516d..3f89055c 100755 --- a/datacenterlight/templates/datacenterlight/index.html +++ b/datacenterlight/templates/datacenterlight/index.html @@ -1,5 +1,5 @@ {% extends "datacenterlight/base.html" %} -{% load staticfiles i18n%} +{% load staticfiles i18n %} {% block content %} @@ -149,32 +149,34 @@ - +
- -
-
+
+
+

{% trans "Contact us" %}

+
+
-

ungleich GmbH

+

ungleich GmbH

-

info@datacenterlight.ch

+

info@datacenterlight.ch

In der Au 7, Schwanden 8762

{% trans "Switzerland " %}

- +
+
-
-
-

{% trans "Questions?" %} {% trans "Contact us!" %}

+
+
+ {% include "datacenterlight/contact_form.html" %}
diff --git a/datacenterlight/urls.py b/datacenterlight/urls.py index a3aed7a6..f5f84ba9 100644 --- a/datacenterlight/urls.py +++ b/datacenterlight/urls.py @@ -1,17 +1,20 @@ from django.conf.urls import url from .views import IndexView, BetaProgramView, LandingProgramView, BetaAccessView, PricingView, SuccessView, \ - PaymentOrderView, OrderConfirmationView, WhyDataCenterLightView + PaymentOrderView, OrderConfirmationView, WhyDataCenterLightView, ContactUsView urlpatterns = [ url(r'^$', IndexView.as_view(), name='index'), - url(r'^whydatacenterlight/?$', WhyDataCenterLightView.as_view(), name='whydatacenterlight'), + url(r'^whydatacenterlight/?$', WhyDataCenterLightView.as_view(), + name='whydatacenterlight'), url(r'^beta-program/?$', BetaProgramView.as_view(), name='beta'), url(r'^landing/?$', LandingProgramView.as_view(), name='landing'), url(r'^pricing/?$', PricingView.as_view(), name='pricing'), url(r'^payment/?$', PaymentOrderView.as_view(), name='payment'), - url(r'^order-confirmation/?$', OrderConfirmationView.as_view(), name='order_confirmation'), + url(r'^order-confirmation/?$', OrderConfirmationView.as_view(), + name='order_confirmation'), url(r'^order-success/?$', SuccessView.as_view(), name='order_success'), url(r'^beta_access?$', BetaAccessView.as_view(), name='beta_access'), + url(r'^contact/?$', ContactUsView.as_view(), name='contact_us'), ] diff --git a/datacenterlight/views.py b/datacenterlight/views.py index fd1435a1..c7b258c2 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -1,6 +1,6 @@ from django.views.generic import FormView, CreateView, TemplateView, DetailView from django.http import HttpResponseRedirect -from .forms import BetaAccessForm +from .forms import BetaAccessForm, ContactForm from .models import BetaAccess, BetaAccessVMType, BetaAccessVM, VMTemplate from django.contrib import messages from django.core.urlresolvers import reverse @@ -23,6 +23,33 @@ from opennebula_api.serializers import VirtualMachineTemplateSerializer, \ from datacenterlight.tasks import create_vm_task +class ContactUsView(FormView): + template_name = "datacenterlight/contact_form.html" + form_class = ContactForm + + def get(self, request, *args, **kwargs): + return HttpResponseRedirect(reverse('datacenterlight:index')) + + def form_invalid(self, form): + if self.request.is_ajax(): + return self.render_to_response( + self.get_context_data(contact_form=form)) + else: + return render(self.request, + 'datacenterlight/index.html', + self.get_context_data(contact_form=form)) + + def form_valid(self, form): + form.save() + if self.request.is_ajax(): + return self.render_to_response( + self.get_context_data(success=True, contact_form=form)) + else: + return render(self.request, + 'datacenterlight/index.html', + self.get_context_data(success=True, contact_form=form)) + + class LandingProgramView(TemplateView): template_name = "datacenterlight/landing.html" @@ -314,8 +341,8 @@ 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()), + 'contact_form': ContactForm }) return context