move screenshots to own view, remove features from home view (features are in docs, don't duplicate)

remove links to individual static screenshots, they break the slideshow

fix spacing on home view, so footer is at bottom

nsupdate/main/templates/main/about.html

@@ -12,6 +12,12 @@
             client) can update a hostname, so you don't need to know or find
             out your current IP address.
         </p>
+    <h2>Screenshots?</h2>
+        <p>
+            We made some
+            <a href="{% url 'screenshots' %}">screenshots</a>
+            for you so you can see what you get without having to create an account first.
+        </p>
     <h2>Why another one?</h2>
         <p>
             We wanted a simple, usable, secure and free dynamic dns service.

nsupdate/main/templates/main/home.html

@@ -2,10 +2,9 @@
 {% load bootstrap %}
 {% load static %}
 
-{% block header %}
-
-  <div class="jumbotron">
-      <div class="container">
+{% block content %}
+<div class="container">
+    <div class="jumbotron">
         <h4>Your IP(s):</h4>
         {% if request.session.ipv4 %}
                 <h1>{{request.session.ipv4}}</h1>
@@ -16,12 +15,7 @@
         <p>
             nsupdate.info - the Dynamic DNS service you waited for.
         </p>
-      </div>
-   </div>
-
-{% endblock %}
-
-{% block content %}
+    </div>
 
 <div class="row">
     <div class="col-sm-4" style="text-align: center">
@@ -51,44 +45,5 @@
         </p>
     </div>
 </div>
-<hr>
-<div class="row">
-        <div class="col-lg-3">
-
-            <div class="well well-sm">
-                <h3>Features</h3>
-                <p>
-                    <i class="icon icon-ok"></i> Easy to use<br>
-                    <i class="icon icon-ok"></i> IP v4 and v6 support<br>
-                    <i class="icon icon-ok"></i> No spam, no nagging, no crap<br>
-                    <i class="icon icon-ok"></i> Free and Open-Source<br>
-                </p>
-            </div>
-        </div>
-        <div class="col-lg-9">
-            <div class="well well-sm">
-                <h3>Screenshots</h3>
-                <a id="screenshot_link" href="{% static 'screenshots/overview.png' %}">
-                    <img id="screenshot_image" src="{% static 'screenshots/overview.png' %}" class="img-responsive" alt="Responsive image">
-                </a>
-                <script>
-                var idx = 0;
-                var images = ["{% static 'screenshots/hostview.png' %}",
-                              "{% static 'screenshots/help.png' %}",
-                              "{% static 'screenshots/overview.png' %}",
-                              "{% static 'screenshots/generatesecret.png' %}"];
-                setInterval(function(){
-                    $('#screenshot_link').attr('href', images[idx]);
-                    $('#screenshot_image').attr('src', images[idx]);
-                    idx += 1;
-                    if(idx >= images.length) {
-                        idx = 0;
-                    }
-                }, 5000);
-                </script>
-            </div>
-        </div>
-    </div>
-
-<hr>
+</div>
 {% endblock %}

nsupdate/main/templates/main/screenshots.html

@@ -0,0 +1,28 @@
+{% extends "base.html" %}
+{% load bootstrap %}
+{% load static %}
+
+{% block content %}
+<div class="row">
+    <div class="col-lg-12">
+        <div class="well well-sm">
+            <h3>Screenshots</h3>
+            <img id="screenshot_image" src="{% static 'screenshots/overview.png' %}" class="img-responsive" alt="Responsive image">
+            <script>
+            var idx = 0;
+            var images = ["{% static 'screenshots/hostview.png' %}",
+                          "{% static 'screenshots/help.png' %}",
+                          "{% static 'screenshots/overview.png' %}",
+                          "{% static 'screenshots/generatesecret.png' %}"];
+            setInterval(function(){
+                $('#screenshot_image').attr('src', images[idx]);
+                idx += 1;
+                if(idx >= images.length) {
+                    idx = 0;
+                }
+            }, 5000);
+            </script>
+        </div>
+    </div>
+</div>
+{% endblock %}

nsupdate/main/urls.py

@@ -3,7 +3,7 @@ from django.views.generic import TemplateView
 
 from .views import (
     HomeView, OverviewView, HostView, DeleteHostView, AboutView, HelpView, GenerateSecretView,
-    RobotsTxtView, DomainOverwievView, DeleteDomainView)
+    RobotsTxtView, DomainOverwievView, DeleteDomainView, ScreenshotsView)
 from ..api.views import (
     MyIpView, DetectIpView, NicUpdateView, AuthorizedNicUpdateView)
 
@@ -15,6 +15,7 @@ urlpatterns = patterns(
     url(r'^legal/$',
         TemplateView.as_view(template_name='main/legal.html'), name="legal"),
     url(r'^help/$', HelpView.as_view(), name="help"),
+    url(r'^screenshots/$', ScreenshotsView.as_view(), name="screenshots"),
     url(r'^overview/$', OverviewView.as_view(), name='overview'),
     url(r'^host/(?P<pk>\d+)/$', HostView.as_view(), name='host_view'),
     url(r'^generate_secret/(?P<pk>\d+)/$', GenerateSecretView.as_view(), name='generate_secret_view'),

nsupdate/main/views.py

@@ -76,6 +76,15 @@ class HelpView(TemplateView):
         return context
 
 
+class ScreenshotsView(TemplateView):
+    template_name = "main/screenshots.html"
+
+    def get_context_data(self, *args, **kwargs):
+        context = super(ScreenshotsView, self).get_context_data(*args, **kwargs)
+        context['nav_help'] = True
+        return context
+
+
 class OverviewView(CreateView):
     model = Host
     template_name = "main/overview.html"