Mercurial > public > sg101
changeset 1078:6bf83070b19f
Convert member search to V3 design.
author | Brian Neal <bgneal@gmail.com> |
---|---|
date | Fri, 22 Apr 2016 22:20:47 -0500 |
parents | 26f2b83e7468 |
children | 75189bd9c4ba |
files | bio/forms.py bio/views.py sg101/static/js/v3/autocomplete.js sg101/templates/bio/member_search.html |
diffstat | 4 files changed, 80 insertions(+), 17 deletions(-) [+] |
line wrap: on
line diff
--- a/bio/forms.py Tue Apr 19 21:01:48 2016 -0500 +++ b/bio/forms.py Fri Apr 22 22:20:47 2016 -0500 @@ -9,6 +9,7 @@ from django import forms from django.conf import settings from django.core.files.base import ContentFile +from django.core.urlresolvers import reverse from django.contrib.auth.models import User import pytz @@ -18,7 +19,6 @@ from core.html import ImageCheckError from core.images.utils import parse_image, downscale_image_square from core.markup import site_markup -from core.widgets import AutoCompleteUserInput class EditUserForm(forms.ModelForm): @@ -134,12 +134,21 @@ """ A form to search for users. """ - username = forms.CharField(max_length=30, widget=AutoCompleteUserInput()) + username = forms.CharField( + max_length=30, + widget=forms.TextInput(attrs={ + 'class': 'sg101-autocomplete', + })) + + def __init__(self, *args, **kwargs): + super(SearchUsersForm, self).__init__(*args, **kwargs) + url = reverse('core-ajax_users') + self.fields['username'].widget.attrs['data-autocomplete-url'] = url def clean_username(self): - username = self.cleaned_data['username'].strip() - try: - User.objects.get(username=username, is_active=True) - except User.DoesNotExist: - raise forms.ValidationError("That username does not exist.") - return username + username = self.cleaned_data['username'].strip() + try: + User.objects.get(username=username, is_active=True) + except User.DoesNotExist: + raise forms.ValidationError("That username does not exist.") + return username
--- a/bio/views.py Tue Apr 19 21:01:48 2016 -0500 +++ b/bio/views.py Fri Apr 22 22:20:47 2016 -0500 @@ -261,4 +261,7 @@ username = form.cleaned_data['username'] return redirect('bio-view_profile', username=username) - return render(request, 'bio/member_search.html', {'form': form}) + return render(request, 'bio/member_search.html', { + 'form': form, + 'V3_DESIGN': True, + })
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/sg101/static/js/v3/autocomplete.js Fri Apr 22 22:20:47 2016 -0500 @@ -0,0 +1,41 @@ +$(function() { + $(".sg101-autocomplete").each(function(index) { + var $this = $(this); + var cache = {}; + var cacheSize = 0; + var url = $this.data('autocompleteUrl'); + + $this.autocomplete({ + delay: 400, + minLength: 1, + source: function(request, response) { + if (cache[request.term]) { + response(cache[request.term]); + return; + } + $.ajax({ + url: url, + type: "GET", + data: { + q: request.term, + limit: 15 + }, + dataType: "json", + success: function(data, textStatus) { + if (cacheSize >= 128) { + cache = {}; + cacheSize = 0; + } + cache[request.term] = data; + ++cacheSize; + response(data); + }, + error: function(xhr, textStatus, ex) { + alert('Oops, an error occurred. ' + xhr.statusText + ' - ' + + xhr.responseText); + } + }); + } + }); + }); +});
--- a/sg101/templates/bio/member_search.html Tue Apr 19 21:01:48 2016 -0500 +++ b/sg101/templates/bio/member_search.html Fri Apr 22 22:20:47 2016 -0500 @@ -1,17 +1,27 @@ -{% extends "base.html" %} +{% extends "v3/base.html" %} +{% load static from staticfiles %} {% load script_tags %} {% block title %}Member Search{% endblock %} -{% block custom_js %} -{% script_tags 'jquery-ui' %} +{% block custom_css %} +{% css_tags 'jquery-ui' %} {% endblock %} {% block content %} <h2>Member Search</h2> <p>Looking for a member? Start typing a username in the form below.</p> <form action="." method="get"> -<fieldset> -<legend>Member Search</legend> - {{ form.as_p }} - <p><input type="submit" value="View Profile" /></p> -</fieldset> + <div class="row"> + <div class="small-12 medium-6 columns"> + {{ form.as_p }} + </div> + </div> + <div class="row"> + <div class="small-12 medium-6 columns"> + <p><input type="submit" class="primary button" value="View Profile" /></p> + </div> + </div> </form> {% endblock %} +{% block custom_js %} +{% js_tags 'jquery-ui' %} +<script src="{% static 'js/v3/autocomplete.js' %}"></script> +{% endblock %}