network: add record create view with wizard

network/forms.py

@@ -161,20 +161,17 @@ class RecordForm(ModelForm):
             Row(
                 Div(
                     Fieldset(
-                        'Identity',
+                        'Record properties',
+                        'type',
+                        'host',
                         'name',
                         'domain',
-                        'type',
                         'address',
                         'ttl',
-                        'host',
                         'description',
                         'owner',
                     ),
-                    css_class='span8'),
-                Div(
-                    HTML('<p>hello</p>'),
-                    css_class='span4'),
+                    css_class='span12'),
             ),
             ButtonHolder(
                 Submit('submit', 'Save'),

network/static/js/record-create.js

+$('#id_type').change(function() {
+    type = $(":selected", this).text();
+    resetForm();
+    resetName();
+});
+
+$('#id_host').change(function() {
+    var type = getType();
+    host_id = $(":selected", this).val();
+    host_name = $(":selected", this).text();
+
+    // if user selected "----" reset the inputs
+    if(!host_id) {
+        resetForm();
+    }
+    // if A or AAAA record
+    else if(type[0] === "A") {
+        promise = getHostData(host_id);
+        promise.success(function(data) {
+            hostname = document.getElementById("id_name");
+            hostname.disabled = true;
+            hostname.value = data.hostname;
+                    
+            addr = document.getElementById("id_address")
+            addr.disabled = true;
+            if(type === "A") {
+                addr.value = data.ipv4;
+            } else {
+                addr.value = data.ipv6;
+            }
+        });
+    }
+    // if CNAME
+    else if(type === "CNAME") {
+        resetForm();
+        promise = getHostData(host_id);
+        promise.success(function(data) {
+            hostname = document.getElementById('id_name');
+            hostname.disabled = true;
+            hostname.value = data.hostname;
+        });
+    }
+    // if MX
+    else if(type === "MX") {
+        resetForm();
+        promise = getHostData(host_id);
+        promise.success(function(data) {
+            addr = document.getElementById('id_name');
+            addr.value = "1D:" + data.fqdn;
+        });
+
+    }
+});
+
+// 
+function getHostData(pk) {
+    return $.ajax({                                                            
+        type: "GET",                                                    
+        url: "/network/hosts/" + pk + "/",                         
+    });        
+}
+
+// return the currently selected type's name
+function getType() {
+    return $("#id_type :selected").text();
+}
+
+/*
+ * reset the form
+ *
+ * enable hostname and address
+ * and set the value to nothing
+ *
+ */
+function resetForm() {
+    hostname = document.getElementById('id_name');
+    addr = document.getElementById('id_address');
+
+    hostname.disabled = false;
+    addr.disabled = false;
+
+    hostname.value = "";
+    addr.value = "";
+
+}
+
+
+// reset the hostname select
+function resetName() {
+    $("#id_host option").filter(function() {
+        return $(this).text()[0] == "-"; 
+    }).prop('selected', true);
+
+}
+
+/*
+ * hides all of the inputs except the first
+ *
+ * this supposed to be a wizard thingy
+ *
+ */
+$(function() {
+    $('div[id^="div_id_"]').hide();
+    $('#div_id_type .controls').append(
+        ' <a id="type_next" onclick="type_next()" class="btn btn-info">Next</a>'
+        );
+    $('#div_id_type').fadeIn();
+});
+
+// if user clicked the "Next" button, this function will be called
+function type_next() {
+    $('#js_error').remove();
+    if($('#div_id_type :selected').val()) {
+        $('#type_next').remove();
+        $('div[id^="div_id_"]').fadeIn();
+    } else {
+        appendMessage('error', 'type pls');
+    }
+    return false;
+}
+
+
+function appendMessage(type, message) {
+    message = '<div id="js_error" style="display: none;" class="alert alert-' + type + '">' + message + '</div>';
+    $('.form-horizontal').before(message);
+    $('#js_error').fadeIn();
+}

network/templates/network/base.html

@@ -65,5 +65,7 @@
     {% block extra_js %}
     {% endblock %}
     </script>
+    {% block extra_etc %}
+    {% endblock %}
   </body>
 </html>

network/templates/network/host-create.html

@@ -10,7 +10,6 @@
   <h2>Create a new host</h2>
 </div>
 
-
 <div class="row">
   <div class="span8">
     {% crispy form %}
@@ -18,4 +17,5 @@
   <div class="span4">
   </div><!-- span4 -->
 </div><!-- row -->
+
 {% endblock %}

network/templates/network/record-create.html

+{% extends "network/base.html" %}
+{% load render_table from django_tables2 %}
+{% load i18n %}
+{% load l10n %}
+{% load staticfiles %}
+{% load crispy_forms_tags %}
+
+{% block content %}
+<div class="page-heading">
+  <h2>Create a new record</h2>
+</div>
+
+
+<div class="row">
+  <div class="span8">
+    {% crispy form %}
+  </div>
+  <div class="span4">
+  </div><!-- span4 -->
+</div><!-- row -->
+{% endblock %}
+{% block extra_etc %}                                                       
+<script src="{% static "js/record-create.js" %}"></script>                   
+{% endblock %}                                                              
+~                       

network/templates/network/record-list.html

@@ -6,7 +6,13 @@
 
 {% block content %}
 <div class="page-heading">
-  <h1>Records <small>list of all records</small></h1>
+    <h1>
+        Records
+        <small>
+            list of all records
+            <a href="{% url network.record_create %}"><i class="icon-plus"></i></a>
+        </small>
+    </h1>
 </div>
 
 {% render_table table %}

network/urls.py

 from django.conf.urls import patterns, url
 
-from .views import (IndexView, HostList, HostDetail, HostCreate, VlanList,
-                    VlanDetail,
-                    DomainList, DomainDetail, GroupList, GroupDetail,
-                    RecordList, RecordDetail, BlacklistList, BlacklistDetail,
-                    RuleList, RuleDetail, VlanGroupList, VlanGroupDetail,
-                    RuleDelete, remove_host_group, add_host_group)
+from .views import (IndexView,
+                    HostList, HostDetail, HostCreate,
+                    VlanList, VlanDetail,
+                    DomainList, DomainDetail,
+                    GroupList, GroupDetail,
+                    RecordList, RecordDetail, RecordCreate,
+                    BlacklistList, BlacklistDetail,
+                    RuleList, RuleDetail, RuleDelete,
+                    VlanGroupList, VlanGroupDetail,
+                    remove_host_group, add_host_group)
 
 
 urlpatterns = patterns(
@@ -24,6 +28,8 @@ urlpatterns = patterns(
     url('^hosts/create$', HostCreate.as_view(), name='network.host_create'),
     url('^hosts/(?P<pk>\d+)/$', HostDetail.as_view(), name='network.host'),
     url('^records/$', RecordList.as_view(), name='network.record_list'),
+    url('^records/create$', RecordCreate.as_view(),
+        name='network.record_create'),
     url('^records/(?P<pk>\d+)/$', RecordDetail.as_view(),
         name='network.record'),
     url('^rules/$', RuleList.as_view(), name='network.rule_list'),
@@ -40,5 +46,5 @@ urlpatterns = patterns(
     url('^hosts/(?P<pk>\d+)/remove/(?P<group_pk>\d+)/$', remove_host_group,
         name='network.remove_host_group'),
     url('^hosts/(?P<pk>\d+)/add/$', add_host_group,
-        name='network.add_host_group')
+        name='network.add_host_group'),
 )

network/views.py

@@ -2,6 +2,7 @@ from django.views.generic import (TemplateView, UpdateView, DeleteView,
                                   CreateView)
 from django.core.urlresolvers import reverse_lazy
 from django.shortcuts import render, redirect
+from django.http import HttpResponse
 
 from django_tables2 import SingleTableView
 
@@ -14,6 +15,7 @@ from .forms import (HostForm, VlanForm, DomainForm, GroupForm, RecordForm,
                     BlacklistForm, RuleForm, VlanGroupForm)
 
 from itertools import chain
+import json
 
 
 class IndexView(TemplateView):
@@ -113,7 +115,6 @@ class HostList(SingleTableView):
 
     def get_table_data(self):
         vlan_id = self.request.GET.get('vlan')
-        print vlan_id
         if vlan_id:
             data = Host.objects.filter(vlan=vlan_id).all()
         else:
@@ -127,6 +128,21 @@ class HostDetail(UpdateView):
     template_name = "network/host-edit.html"
     form_class = HostForm
 
+    def get(self, request, *args, **kwargs):
+        if request.is_ajax():
+            host = Host.objects.get(pk=kwargs['pk'])
+            host = {
+                'hostname': host.hostname,
+                'ipv4': host.ipv4,
+                'ipv6': host.ipv6,
+                'fqdn': host.get_fqdn()
+            }
+            return HttpResponse(json.dumps(host),
+                                content_type="application/json")
+        else:
+            self.object = self.get_object()
+            return super(HostDetail, self).get(request, *args, **kwargs)
+
     def get_context_data(self, **kwargs):
         context = super(HostDetail, self).get_context_data(**kwargs)
         # own rules
@@ -187,6 +203,12 @@ class RecordDetail(UpdateView):
             return reverse_lazy('network.record', kwargs=self.kwargs)
 
 
+class RecordCreate(CreateView):
+    model = Record
+    template_name = "network/record-create.html"
+    form_class = RecordForm
+
+
 class RuleList(SingleTableView):
     model = Rule
     table_class = RuleTable
@@ -280,3 +302,7 @@ def add_host_group(request, **kwargs):
         group = Group.objects.get(pk=group_pk)
         host.groups.add(group)
         return redirect(reverse_lazy('network.host', kwargs=kwargs))
+
+
+def get_host_as_json(request, **kwargs):
+    pass