display owned hats at the top

files/classes/user.py

@@ -171,11 +171,6 @@ class User(Base):
 	def __repr__(self):
 		return f"<User(id={self.id}, username={self.username})>"
 
-	@property
-	@lazy
-	def owned_hats(self):
-		return [x[0] for x in g.db.query(Hat.hat_id).filter_by(user_id=self.id).all()]
-
 	@property
 	@lazy
 	def name_color(self):

files/routes/hats.py

@@ -10,9 +10,11 @@ from flask import g
 def hats(v):
 	if not FEATURES['HATS']: abort(404)
 
-	hats = g.db.query(HatDef, User).join(HatDef.author).order_by(HatDef.price).all()
+	owned_hats = [x[0] for x in g.db.query(Hat.hat_id).filter_by(user_id=v.id).all()]
+	owned = g.db.query(HatDef, User).join(HatDef.author).filter(HatDef.id.in_(owned_hats)).order_by(HatDef.price).all()
+	not_owned = g.db.query(HatDef, User).join(HatDef.author).filter(HatDef.id.notin_(owned_hats)).order_by(HatDef.price).all()
 
-	return render_template("hats.html", hats=hats, v=v)
+	return render_template("hats.html", owned=owned, not_owned=not_owned, v=v)
 
 @app.post("/buy_hat/<hat_id>")
 @auth_required

files/templates/hats.html

@@ -27,7 +27,7 @@
 		</thead>
 		
 		<tbody>
-			{% for hat, user in hats %}
+			{% for hat, user in owned %}
 				<tr>
 					<td><img loading="lazy" alt="{{hat.name}}" src="/i/hats/{{hat.name}}.webp"></td>
 					<td>{{hat.name}}</td>
@@ -37,13 +37,25 @@
 					{% endif %}
 					<td>{{hat.price}}</td>
 					<td class="shop-table-actions">
-						{% if hat.id in v.owned_hats %}
 						{% if hat.id == v.equipped_hat.id %}
 							<a id="unequip-{{hat.id}}" class="unequip btn btn-success" role="button" onclick="post_toast(this,'/unequip_hat',true)"><span class="m-auto">Unequip</span></a>
 						{% else %}
 							<a id="equip-{{hat.id}}" class="equip btn btn-success" role="button" onclick="post_toast(this,'/equip_hat/{{hat.id}}',true)"><span class="m-auto">Equip</span></a>
 						{% endif %}
-						{% else %}
+					</td>
+				</tr>
+			{% endfor %}
+
+			{% for hat, user in not_owned %}
+				<tr>
+					<td><img loading="lazy" alt="{{hat.name}}" src="/i/hats/{{hat.name}}.webp"></td>
+					<td>{{hat.name}}</td>
+					<td>{{hat.description}}</td>
+					{% if SITE == 'rdrama.net' %}
+						<td><a style="color:#{{user.name_color}}" href="/@{{user.username}}"><img loading="lazy" src="{{user.profile_url}}" class="pp20"><span {% if user.patron %}class="patron" style="background-color:#{{user.name_color}}"{% endif %}>{{user.username}}</span></a></td>
+					{% endif %}
+					<td>{{hat.price}}</td>
+					<td class="shop-table-actions">
 						<a id="buy1-{{hat.id}}" class="btn btn-success {% if v.coins < hat.price %}disabled{% endif %}" role="button" onclick="this.classList.add('d-none');document.getElementById('buy1-go-{{hat.id}}').classList.remove('d-none')"><span class="m-auto">Buy</span></a>
 
 						<a id="buy1-go-{{hat.id}}" class="d-none btn btn-success {% if v.coins < hat.price %}disabled{% endif %}" role="button" onclick="post_toast(this,'/buy_hat/{{hat.id}}',true)"><span class="m-auto">Are you sure?</span></a>
@@ -53,7 +65,6 @@
 
 							<a id="buy2-go-{{hat.id}}" class="d-none marseybux btn btn-success {% if v.procoins < hat.price %}disabled{% endif %}" role="button" onclick="post_toast(this,'/buy_hat/{{hat.id}}?mb=true',true)"><span class="m-auto">Are you sure?</span></a>
 						{% endif %}
-						{% endif %}
 					</td>
 				</tr>
 			{% endfor %}