added some sick ui updates, including search

items/forms.py

@@ -3,8 +3,6 @@ from items.models import Item, address_is_valid_monero
 
 
 class CreateItemForm(forms.ModelForm):
-    payout_address = forms.CharField(validators=[address_is_valid_monero])
-
     class Meta:
         model = Item
         fields = ['name', 'description', 'whereabouts', 'ask_price_xmr', 'payout_address']
@@ -13,6 +11,22 @@ class CreateItemForm(forms.ModelForm):
             'payout_address': 'Payout Wallet Address'
         }
         help_texts = {
-            'payout_address': 'Monero address where funds will be sent after sale is confirmed',
+            'name': 'Use a succinct name for your item. Don\'t be spammy or obscene.',
-            'whereabouts': 'A simple pointer to your general region - a nearby ZIP code would be perfect.'
+            'description': 'Describe the condition of the item and any important information. Try to refrain from sharing personally identifiable information like phone numbers or social media links.',
+            'whereabouts': 'A simple pointer to your general region - a nearby ZIP code or capital city would be perfect.',
+            'ask_price_xmr': 'How many moneroj do you want for your item?',
+            'payout_address': 'A Monero wallet address where funds will be sent after sale is confirmed.',
         }
+
+class SearchItemForm(forms.Form):
+    search = forms.CharField(
+        label='',
+        max_length=100,
+        required=False,
+        widget=forms.TextInput(
+            attrs={'placeholder':'Search whereabouts, item name, or description'}
+        )
+    )
+
+    def process(self):
+        cd = self.cleaned_data

items/views.py

@@ -1,10 +1,11 @@
+from django.db.models import Q
 from django.shortcuts import render, HttpResponseRedirect, reverse
 from django.contrib.auth.decorators import login_required
 from django.contrib.auth.models import User
 from django.contrib import messages
 from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
 from django.forms import inlineformset_factory
-from items.forms import CreateItemForm
+from items.forms import CreateItemForm, SearchItemForm
 from items.models import Item, ItemImage
 from bids.models import ItemBid
 from sales.models import ItemSale
@@ -12,15 +13,23 @@ from sales.models import ItemSale
 
 def list_items(request):
     page_query = request.GET.get('page', 1)
-    user_query = request.GET.get('user', 0)
+    mine_query = request.GET.get('mine')
+    search_form = SearchItemForm(request.GET or None)
+
+    # If the 'mine_query' query string is present, show the user's items
+    if mine_query and request.user.is_authenticated:
+        item_list = Item.objects.filter(owner=request.user).order_by('-list_date')
+    # If 'search_form' query string is present, retrieve matches containing it's data
+    elif search_form.is_valid():
+        search_form.process()
+        item_list = Item.objects.filter(
+            Q(name__icontains=search_form.cleaned_data.get('search')) |
+            Q(whereabouts__icontains=search_form.cleaned_data.get('search')) |
+            Q(description__icontains=search_form.cleaned_data.get('search'))
+        )
+    else:
         item_list = Item.objects.all().order_by('-list_date')
 
-    # If the user query string resolves to real user, show their items, otherwise show all
-    if user_query:
-        user = User.objects.filter(id=user_query).first()
-        if user:
-            item_list = Item.objects.filter(owner=user).order_by('-list_date')
-
     paginator = Paginator(item_list, 20)
 
     try:
@@ -31,7 +40,8 @@ def list_items(request):
         items = paginator.page(paginator.num_pages)
 
     context = {
-        'items': items
+        'items': items,
+        'search_form': search_form
     }
 
     return render(request, 'items/list_items.html', context)

web/static/css/style-small.css

@@ -69,3 +69,7 @@
 			padding-left: 0;
 			display: block;
 		}
+
+#donation-address {
+  width: 90%;
+}

web/static/css/style.css

@@ -64,7 +64,7 @@ New color: fd4e05
 		color: #666;
 		font-weight: 300;
 		line-height: 1em;
-		margin: 0 0 1em 0;
+		margin: 0 0 .5em 0;
 	}
 
 		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
@@ -74,7 +74,7 @@ New color: fd4e05
 
 	h2 {
 		font-size: 1.75em;
-		line-height: 1.5em;
+		line-height: 1.2em;
 	}
 
 	h3 {
@@ -195,7 +195,7 @@ New color: fd4e05
 
 	header.major {
 		text-align: center;
-		margin-bottom: 3em;
+		margin-bottom: 2em;
 	}
 
 		header.major h2 {
@@ -760,14 +760,14 @@ New color: fd4e05
 		input[type="reset"]:hover,
 		input[type="button"]:hover,
 		.button:hover {
-			background-color: #ca3e04; /*#42b972*/;
+			background-color: #ca3e04;
 		}
 
 		input[type="submit"]:active,
 		input[type="reset"]:active,
 		input[type="button"]:active,
 		.button:active {
-			background-color: #34935a;
+			background-color: #efc5b3;
 		}
 
 		input[type="submit"].icon,
@@ -978,7 +978,7 @@ New color: fd4e05
 		background-repeat: no-repeat;
 		background-size: cover;
 		color: #ffffff;
-		padding: 16em 0em 14em;
+		padding: 12em 0em 14em;
 		text-align: center;
 	}
 
@@ -1012,7 +1012,7 @@ New color: fd4e05
 /* Wrapper */
 
 	.wrapper {
-		padding: 4em 0em 4em;
+		padding: 3em 0em 1em;
 	}
 
 		.wrapper.style1 {
@@ -1162,13 +1162,18 @@ New color: fd4e05
 
 #donation-address {
   text-align: center;
-  width: 50%;
+  width: 100%;
   overflow-wrap: break-word;
   display: block;
   margin: auto;
   color: grey;
 }
 
+.search-bar {
+  margin-top: 1.2em;
+  display: block;
+}
+
 html {
   height: 100%;
 }

web/templates/base.html

@@ -78,6 +78,14 @@
   					position: 'top-right',
   					side: 'right',
   					width: 250
+  				},
+  				navButton: {
+  					breakpoints: 'medium',
+  					height: '4em',
+            html: '<span class="toggle" data-action="toggleLayer" data-args="navPanel"></span>',
+  					position: 'top-right',
+  					side: 'top',
+  					width: '6em'
   				}
   			}
   		}
@@ -105,6 +113,7 @@
       <h1><a href="{% url 'home' %}">{{ site_meta.name }}</a></h1>
       <nav id="nav">
         <ul>
+          <li><a href="{% url 'list_items' %}">View Items</a></li>
           {% if user.is_authenticated %}
             <li><a href="{% url 'logout' %}">Logout ({{ request.user }})</a></li>
           {% else %}
@@ -151,7 +160,7 @@
           <li><a href="{% url 'get_privacy' %}">Terms</a></li>
           <li><a href="{% url 'get_terms' %}">FAQ</a></li>
         </ul>
-        <br>
+        <hr>
         <p id="donation-address"><strong>Donation Address</strong>:<br> {{ site_meta.donation_address }}</p>
       </div>
     </footer>

web/templates/home.html

@@ -7,8 +7,8 @@
   <!-- <h2>Home</h2> -->
   <ul class="actions">
     <li><a href="{% url 'create_item' %}" class="button">Sell An Item</a></li>
-    <li><a href="{% url 'list_items' %}" class="button">View Items</a></li>
     <li><a href="{% url 'list_bids' %}" class="button">View Bids</a></li>
+    <li><a href="{% url 'list_items' %}" class="button">View Items</a></li>
     <li><a href="{% url 'logout' %}" class="button">Logout ({{ request.user.username }})</a></li>
   </ul>
   {% else %}

web/templates/items/list_items.html

@@ -5,8 +5,24 @@
 <section id="main" class="wrapper">
   <div class="container">
     <header class="major">
-      <h2>Browse Items</h2>
+      <h2>View Items</h2>
+      <a href="{% url 'list_items' %}?mine=true" class="button">Your Items</a>
+      <a href="{% url 'list_items' %}" class="button alt">All Items</a>
+      <form method="GET" enctype="multipart/form-data" action="">
+        {% for field in search_form %}
+        <div class="fieldWrapper">
+            {{ field.errors }}
+            {{ field.label_tag }} {{ field }}
+            {% if field.help_text %}
+            <p class="help">{{ field.help_text|safe }} <i class="fa fa-search"></i></p>
+            {% endif %}
+        </div>
+        {% endfor %}
+      </form>
+
     </header>
+    <div id="item-search"></div>
+    {% if items %}
     <table class="table">
       <tr>
         <th>ID</th>
@@ -16,7 +32,7 @@
         <th>Asking Price (XMR)</th>
       </tr>
       {% for item in items %}
-      <tr>
+      <tr class="{% if item.owner == request.user %}item-mine{% endif %}">
         <td>#{{ item.id }}</td>
         <td><a href="https://duckduckgo.com/?q={{ item.whereabouts }}" target="_blank">{{ item.whereabouts }}</a></td>
         <td><a href="{% url 'get_item' item.id %}">{{ item.name }}</a></td>
@@ -25,13 +41,16 @@
       </tr>
       {% endfor %}
     </table>
+    {% else %}
+    <p>No results from the search. Try again!</p>
+    {% endif %}
   </div>
 </section>
 
 {% if items.has_other_pages %}
 <ul class="pagination">
   {% if items.has_previous %}
-    <li><a href="?page={{ items.previous_page_number }}">&laquo;</a></li>
+    <li><a href="?{{ request.GET.urlencode }}&page={{ items.previous_page_number }}">&laquo;</a></li>
   {% else %}
     <li class="disabled"><span>&laquo;</span></li>
   {% endif %}
@@ -39,11 +58,11 @@
     {% if items.number == i %}
       <li class="active"><span>{{ i }} <span class="sr-only"></span></span></li>
     {% else %}
-      <li><a href="?page={{ i }}">{{ i }}</a></li>
+      <li><a href="?{{ request.GET.urlencode }}&page={{ i }}">{{ i }}</a></li>
     {% endif %}
   {% endfor %}
   {% if items.has_next %}
-    <li><a href="?page={{ items.next_page_number }}">&raquo;</a></li>
+    <li><a href="?{{ request.GET.urlencode}}&page={{ items.next_page_number }}">&raquo;</a></li>
   {% else %}
     <li class="disabled"><span>&raquo;</span></li>
   {% endif %}