euscanwww: Favourite/Unfavourite template code refactored

* Now is more DRY, the JS code and the HTML code are in one place
* It works even without JS

Signed-off-by: volpino <fox91@anche.no>

euscanwww/djeuscan/templates/euscan/category.html

@@ -1,7 +1,8 @@
 {% extends "euscan/_datatable.html" %}
 
-{% load djeuscan_helpers %}
 {% load url from future %}
+{% load djeuscan_helpers %}
+{% load euscan_accounts_helpers %}
 
 {% block title %}
 {{ block.super }} - Category: {{ category }}
@@ -22,13 +23,8 @@
   Category: {{ category }}
 
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <span class="pull-right padding-bottom10">
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_category" category %}">
+      {% favourite_buttons "category" category %}
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
-      </button>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_category" category %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
     </span>
   {% endif %}
 </h2>
@@ -53,24 +49,7 @@
   <img alt="packages monthly" src="{% url "chart_category" category 'packages-monthly' %}" />
 </p>
 
-<script type="text/javascript">
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
-$(document).ready(function () {
-  $(".favourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".unfavourite-button").removeClass("hide");
-      $(".favourite-button").addClass("hide");
-    });
-  });
-
-  $(".unfavourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".favourite-button").removeClass("hide");
-      $(".unfavourite-button").addClass("hide");
-    });
-  });
-});
-</script>
-
 {% endblock %}
 
 {% block menus %}

euscanwww/djeuscan/templates/euscan/herd.html

@@ -1,7 +1,8 @@
 {% extends "euscan/_datatable.html" %}
 
-{% load djeuscan_helpers %}
 {% load url from future %}
+{% load djeuscan_helpers %}
+{% load euscan_accounts_helpers %}
 
 {% block title %}
 {{ block.super }} - Herd: {{ herd.herd }}
@@ -21,13 +22,8 @@
 <h2>
   Herd: {{ herd.herd }}
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <span class="pull-right padding-bottom10">
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_herd" herd.herd %}">
+      {% favourite_buttons "herd" herd.herd %}
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
-      </button>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_herd" herd.herd %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
     </span>
   {% endif %}
 
@@ -51,24 +47,7 @@
   <img alt="packages monthly" src="{% url "chart_herd" herd.herd 'packages-monthly' %}" />
 </p>
 
-<script type="text/javascript">
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
-$(document).ready(function () {
-  $(".favourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".unfavourite-button").removeClass("hide");
-      $(".favourite-button").addClass("hide");
-    });
-  });
-
-  $(".unfavourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".favourite-button").removeClass("hide");
-      $(".unfavourite-button").addClass("hide");
-    });
-  });
-});
-</script>
-
 {% endblock %}
 
 {% block menus %}

euscanwww/djeuscan/templates/euscan/maintainer.html

@@ -1,7 +1,8 @@
 {% extends "euscan/_datatable.html" %}
 
-{% load djeuscan_helpers %}
 {% load url from future %}
+{% load djeuscan_helpers %}
+{% load euscan_accounts_helpers %}
 
 {% block title %}
 {{ block.super }} - Maintainer: {{ maintainer.name }}
@@ -21,13 +22,8 @@
 <h2>
   Maintainer: {{ maintainer.name }} &lt;{{ maintainer.email }}&gt;
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <span class="pull-right padding-bottom10">
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_maintainer" maintainer.email %}">
+      {% favourite_buttons "maintainer" maintainer.email %}
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
-      </button>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_maintainer" maintainer.email %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
     </span>
   {% endif %}
 </h2>
@@ -52,24 +48,7 @@
   <img alt="packages monthly" src="{% url "chart_maintainer" maintainer.email 'packages-monthly' %}" />
 </p>
 
-<script type="text/javascript">
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
-$(document).ready(function () {
-  $(".favourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".unfavourite-button").removeClass("hide");
-      $(".favourite-button").addClass("hide");
-    });
-  });
-
-  $(".unfavourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".favourite-button").removeClass("hide");
-      $(".unfavourite-button").addClass("hide");
-    });
-  });
-});
-</script>
-
 {% endblock %}
 
 {% block menus %}

euscanwww/djeuscan/templates/euscan/overlay.html

@@ -2,6 +2,7 @@
 
 {% load url from future %}
 {% load djeuscan_helpers %}
+{% load euscan_accounts_helpers %}
 
 {% block title %}
 {{ block.super }} - Overlay: {{ overlay }}
@@ -11,13 +12,8 @@
 <h2>
   Overlay: {{ overlay }}
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <span class="pull-right padding-bottom10">
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_overlay" overlay %}">
+      {% favourite_buttons "overlay" overlay %}
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
-      </button>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_overlay" overlay %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
     </span>
   {% endif %}
 
@@ -25,22 +21,5 @@
 
 {% packages packages %}
 
-<script type="text/javascript">
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
-$(document).ready(function () {
-  $(".favourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".unfavourite-button").removeClass("hide");
-      $(".favourite-button").addClass("hide");
-    });
-  });
-
-  $(".unfavourite-button").click(function() {
-    $.post($(this).data("url"), function() {
-      $(".favourite-button").removeClass("hide");
-      $(".unfavourite-button").addClass("hide");
-    });
-  });
-});
-</script>
-
 {% endblock %}

euscanwww/djeuscan/templates/euscan/package.html

@@ -1,7 +1,8 @@
 {% extends "euscan/_datatable.html" %}
 
-{% load sub %}
 {% load url from future %}
+{% load sub %}
+{% load euscan_accounts_helpers %}
 
 {% block meta %}
 {{ block.super }}
@@ -34,7 +35,7 @@
   {{ package.category }}/{{ package.name }}
 
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <div class="pull-right">
       <form class="refresh-form inline"
             method="POST"
             action="{% url "refresh_package" package.category package.name %}">
@@ -46,13 +47,9 @@
       <button class="btn refresh-button-disabled disabled {% if not refresh_requested %}hide{% endif %}">
         <img src="{{ STATIC_URL}}/img/refresh-inactive.png" alt="Refresh" />
       </button>
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_package" package.category package.name %}">
+
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
+      {% favourite_buttons "package" package.category package.name %}
-      </button>
+    </div>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_package" package.category package.name %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
-    </span>
   {% endif %}
 </h2>
 
@@ -84,22 +81,9 @@
       });
       return false;
     });
-
-    $(".favourite-button").click(function() {
-      $.post($(this).data("url"), function() {
-        $(".unfavourite-button").removeClass("hide");
-        $(".favourite-button").addClass("hide");
-      });
-    });
-
-    $(".unfavourite-button").click(function() {
-      $.post($(this).data("url"), function() {
-        $(".favourite-button").removeClass("hide");
-        $(".unfavourite-button").addClass("hide");
-      });
-    });
-
   });
 </script>
 
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
+
 {% endblock %}

euscanwww/djeuscan/templates/euscan/world_scan.html

@@ -2,6 +2,7 @@
 
 {% load url from future %}
 {% load djeuscan_helpers %}
+{% load euscan_accounts_helpers %}
 
 {% block title %}
 {{ block.super }} - World Scan
@@ -23,13 +24,8 @@
 <h2>
   World scan:
   {% if user.is_authenticated %}
-    <span class="pull-right">
+    <span class="pull-right padding-bottom10">
-      <button class="btn favourite-button {% if favourited %}hide{% endif %}" data-url="{% url "favourite_world" %}">
+      {% favourite_buttons "world" %}
-        <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
-      </button>
-      <button class="btn unfavourite-button {% if not favourited %}hide{% endif %}" data-url="{% url "unfavourite_world" %}">
-        <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
-      </button>
     </span>
   {% endif %}
 </h2>
@@ -37,23 +33,9 @@
 {% packages packages %}
 
 <script type="text/javascript">
-  $(document).ready(function () {
+  window.packages = [{{ packages_ids|join:"," }}];
-    var packages = [{{packages_ids|join:","}}];
-
-    $(".favourite-button").click(function() {
-      $.post($(this).data("url"), {packages: packages}, function() {
-        $(".unfavourite-button").removeClass("hide");
-        $(".favourite-button").addClass("hide");
-      });
-    });
-
-    $(".unfavourite-button").click(function() {
-      $.post($(this).data("url"), {packages: packages}, function() {
-        $(".favourite-button").removeClass("hide");
-        $(".unfavourite-button").addClass("hide");
-      });
-    });
-  });
 </script>
 
+<script src="{{ STATIC_URL }}js/favourite.js" type="text/javascript"></script>
+
 {% endblock %}

euscanwww/djeuscan/views.py

@@ -313,7 +313,7 @@ def world_scan(request):
     packages_ids = [p.pk for p in packages]
 
     favourited = False
-    if request.user.is_authenticated():
+    if len(packages) > 0 and request.user.is_authenticated():
         profile = get_profile(request.user)
         if len(packages) == len(profile.packages.filter(id__in=packages_ids)):
             favourited = True

euscanwww/euscan_accounts/templates/euscan/_favourite.html

@@ -0,0 +1,23 @@
+<form class="favourite-form inline"
+      action="{{ favourite_url }}"
+      method="POST">
+  <button type="submit" class="btn favourite-button {% if favourited %}hide{% endif %}">
+    <img src="{{ STATIC_URL}}/img/watch-icon.png" alt="Watch" />
+  </button>
+  <input type="hidden" name="nojs" value="true" />
+  {% for pk in packages_ids %}
+    <input type="hidden" name="packages[]" value="{{ pk }}" />
+  {% endfor %}
+</form>
+
+<form class="unfavourite-form inline"
+      action="{{ unfavourite_url }}"
+      method="POST">
+  <button type="submit" class="btn unfavourite-button {% if not favourited %}hide{% endif %}">
+    <img src="{{ STATIC_URL}}/img/unwatch-icon.png" alt="Unwatch" />
+  </button>
+  <input type="hidden" name="nojs" value="true" />
+  {% for pk in packages_ids %}
+    <input type="hidden" name="packages[]" value="{{ pk }}" />
+  {% endfor %}
+</form>

euscanwww/euscan_accounts/templatetags/euscan_accounts_helpers.py

@@ -0,0 +1,11 @@
+from django import template
+from django.core.urlresolvers import reverse
+
+register = template.Library()
+
+
+@register.inclusion_tag('euscan/_favourite.html', takes_context=True)
+def favourite_buttons(context, subj, *args):
+    context["favourite_url"] = reverse("favourite_%s" % subj, args=args)
+    context["unfavourite_url"] = reverse("unfavourite_%s" % subj, args=args)
+    return context

euscanwww/euscan_accounts/views.py

@@ -1,6 +1,7 @@
 from annoying.decorators import render_to, ajax_request
 
-from django.shortcuts import get_object_or_404
+from django.shortcuts import get_object_or_404, redirect
+from django.core.urlresolvers import reverse
 from django.contrib.auth.decorators import login_required
 from django.views.decorators.http import require_POST
 
@@ -113,6 +114,8 @@ def accounts_overlays(request):
 def favourite_package(request, category, package):
     obj = get_object_or_404(Package, category=category, name=package)
     get_profile(request.user).packages.add(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("package", args=(category, package)))
     return {"success": True}
 
 
@@ -120,8 +123,10 @@ def favourite_package(request, category, package):
 @require_POST
 @ajax_request
 def unfavourite_package(request, category, package):
-    package = get_object_or_404(Package, category=category, name=package)
+    obj = get_object_or_404(Package, category=category, name=package)
-    get_profile(request.user).packages.remove(package)
+    get_profile(request.user).packages.remove(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("package", args=(category, package)))
     return {"success": True}
 
 
@@ -131,6 +136,8 @@ def unfavourite_package(request, category, package):
 def favourite_herd(request, herd):
     obj = get_object_or_404(Herd, herd=herd)
     get_profile(request.user).herds.add(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("herd", args=(herd, )))
     return {"success": True}
 
 
@@ -138,8 +145,10 @@ def favourite_herd(request, herd):
 @require_POST
 @ajax_request
 def unfavourite_herd(request, herd):
-    herd = get_object_or_404(Herd, herd=herd)
+    obj = get_object_or_404(Herd, herd=herd)
-    get_profile(request.user).herds.remove(herd)
+    get_profile(request.user).herds.remove(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("herd", args=(herd, )))
     return {"success": True}
 
 
@@ -149,6 +158,8 @@ def unfavourite_herd(request, herd):
 def favourite_maintainer(request, maintainer_id=None, maintainer_email=None):
     obj = get_maintainer_or_404(maintainer_id, maintainer_email)
     get_profile(request.user).maintainers.add(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("maintainer", args=(obj.email, )))
     return {"success": True}
 
 
@@ -158,6 +169,8 @@ def favourite_maintainer(request, maintainer_id=None, maintainer_email=None):
 def unfavourite_maintainer(request, maintainer_id=None, maintainer_email=None):
     obj = get_maintainer_or_404(maintainer_id, maintainer_email)
     get_profile(request.user).maintainers.remove(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("maintainer", args=(obj.email, )))
     return {"success": True}
 
 
@@ -167,6 +180,8 @@ def unfavourite_maintainer(request, maintainer_id=None, maintainer_email=None):
 def favourite_category(request, category):
     obj = Category.objects.get(name=category)
     get_profile(request.user).categories.add(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("category", args=(category, )))
     return {"success": True}
 
 
@@ -176,6 +191,8 @@ def favourite_category(request, category):
 def unfavourite_category(request, category):
     obj = Category.objects.get(name=category)
     get_profile(request.user).categories.remove(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("category", args=(category, )))
     return {"success": True}
 
 
@@ -185,6 +202,8 @@ def unfavourite_category(request, category):
 def favourite_overlay(request, overlay):
     obj = Overlay.objects.get(name=overlay)
     get_profile(request.user).overlays.add(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("overlay", args=(overlay, )))
     return {"success": True}
 
 
@@ -194,6 +213,8 @@ def favourite_overlay(request, overlay):
 def unfavourite_overlay(request, overlay):
     obj = Overlay.objects.get(name=overlay)
     get_profile(request.user).overlays.remove(obj)
+    if "nojs" in request.POST:
+        return redirect(reverse("overlay", args=(overlay, )))
     return {"success": True}
 
 
@@ -206,6 +227,8 @@ def favourite_world(request):
     packages = request.POST.getlist("packages[]")
     objs = Package.objects.filter(id__in=packages)
     get_profile(request.user).packages.add(*objs)
+    if "nojs" in request.POST:
+        return redirect(reverse("world"))
     return {"success": True}
 
 
@@ -218,4 +241,6 @@ def unfavourite_world(request):
     packages = request.POST.getlist("packages[]")
     objs = Package.objects.filter(id__in=packages)
     get_profile(request.user).packages.remove(*objs)
+    if "nojs" in request.POST:
+        return redirect(reverse("world"))
     return {"success": True}

euscanwww/htdocs/css/style.css

@@ -238,3 +238,7 @@ textarea {
 .inline {
     display: inline;
 }
+
+.padding-bottom10 {
+    padding-bottom: 10px;
+}

euscanwww/htdocs/js/favourite.js

@@ -0,0 +1,23 @@
+$(document).ready(function() {
+  $(".favourite-form").submit(function(e) {
+    e.preventDefault();
+    e.stopPropagation();
+
+    $.post($(this).attr("action"), {packages: window.packages}, function() {
+      $(".unfavourite-button").removeClass("hide");
+      $(".favourite-button").addClass("hide");
+    });
+    return false;
+  });
+
+  $(".unfavourite-form").submit(function(e) {
+    e.preventDefault();
+    e.stopPropagation();
+
+    $.post($(this).attr("action"), {packages: window.packages}, function() {
+      $(".favourite-button").removeClass("hide");
+      $(".unfavourite-button").addClass("hide");
+    });
+    return false;
+  });
+});