Skip to content

Commit 1b85e1b

Browse files
author
=
committed
add tutorial videos
1 parent 71dbe17 commit 1b85e1b

File tree

8 files changed

+284
-90
lines changed

8 files changed

+284
-90
lines changed

‎auctions/models.py

+14
Original file line numberDiff line numberDiff line change
@@ -1317,6 +1317,20 @@ def location_link(self):
13171317
return reverse("edit_pickup", kwargs={"pk": self.location_qs.first().pk})
13181318
return reverse("auction_pickup_location", kwargs={"slug": self.slug})
13191319

1320+
@property
1321+
def video_tutorial(self):
1322+
if self.is_online:
1323+
return settings.ONLINE_TUTORIAL_YOUTUBE_ID
1324+
else:
1325+
return settings.IN_PERSON_TUTORIAL_YOUTUBE_ID
1326+
1327+
@property
1328+
def video_tutorial_chapters(self):
1329+
if self.is_online:
1330+
return settings.ONLINE_TUTORIAL_CHAPTERS
1331+
else:
1332+
return settings.IN_PERSON_TUTORIAL_CHAPTERS
1333+
13201334

13211335
class PickupLocation(models.Model):
13221336
"""

‎auctions/templates/auction_help.html

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{% extends "base.html" %}
2+
{% block title %}Help for {{ auction }}{% endblock %}
3+
{% load static %}
4+
{% block content %}
5+
{% include 'auction_ribbon.html' %}
6+
<h5>Help and support</h5>
7+
<div>
8+
This video will walk you through the entire process of running your auction.
9+
</div>
10+
{% include 'youtube_embed.html' with videoId=auction.video_tutorial chapters=auction.video_tutorial_chapters %}
11+
<div>
12+
<h5>Still got questions?</h5>
13+
<a href="{% url 'faq' %}">The FAQ covers nearly all questions</a><p>
14+
</div>
15+
<div>
16+
<h5>Found a bug? Got a request for a new feature?</h5>
17+
<a href="https://github.com/iragm/fishauctions/issues/">Open a GitHub issue</a><br>
18+
<small><span class='text-muted'>Github is the best place to report issues and suggest features, as other uses can provide feedback.</span></small><p>
19+
</div>
20+
<div>
21+
<h5>Still need help?</h5>
22+
Contact me at {{ admin_email | urlize }}<br>
23+
<small><span class='text-muted'>Please, watch the video and read the FAQ <span class='text-warning'>before</span> emailing. This is a volunteer-run project and help is provided on a limited basis.</span></small>
24+
</div>
25+
26+
27+
{% endblock %}
28+
{% block extra_js %}
29+
{% endblock %}

‎auctions/templates/auction_ribbon.html

+3-2
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,8 @@ <h3>{{auction}}</h3>
1717
<li>{% if auction.admin_checklist_additional_admin %}<i class="bi bi-check-square-fill text-success"></i>{% else %}<i class="bi bi-exclamation-square-fill text-danger"></i>{%endif%} Click a name to edit that user and <a href="/auctions/{{auction.slug}}/users">add an additional admin</a> to help you set lot winners</li>
1818
{% endif %}
1919
</ul>
20-
<small class="'text-muted">This message will disappear once you've finished setting up your auction.</small>
20+
<div>Having trouble? <a href='{% url "auction_help" slug=auction.slug %}'>Click here to get help</a></div>
21+
<small class="text-muted">This message will disappear once you've finished setting up your auction.</small>
2122
</div>
2223
{% endif %}
2324
{% endif %}
@@ -38,7 +39,7 @@ <h3>{{auction}}</h3>
3839
<a class="dropdown-item" href="{{ auction.location_link }}"><i class="bi bi-geo-alt-fill"></i> Location{% if auction.location_qs|length > 1 %}s{% endif %}</a>
3940
<a class="dropdown-item" href="{{ auction.set_lot_winners_link }}"><i class="bi bi-calendar-check"></i> Set lot winners</a>
4041
<a class="dropdown-item" href="/auctions/{{auction.slug}}/chat/"><i class="bi bi-chat-fill"></i> Chat messages</a>
41-
<a class="dropdown-item" href="/faq"><i class="bi bi-question-circle-fill"></i> Help and Support</a>
42+
<a class="dropdown-item" href='{% url "auction_help" slug=auction.slug %}'><i class="bi bi-question-circle-fill"></i> Help and Support</a>
4243
<a class="dropdown-item" href="/auctions/new?copy={{auction.slug}}"><i class="bi bi-plus-circle"></i> Copy to new auction</a>
4344
<a class="dropdown-item" href="/auctions/{{auction.slug}}/stats/"><i class="bi bi-graph-up"></i> Stats</a>
4445
{% if not auction.is_online %}<a class="dropdown-item" href='{% url "auction_printing" slug=auction.slug %}'><i class="bi bi-tags"></i> Print labels</a>{% endif %}

‎auctions/templates/promo.html

+75-77
Original file line numberDiff line numberDiff line change
@@ -160,110 +160,108 @@ <h5>This site provides all the tools you need to run traditional, in-person auct
160160
</ol>
161161
<p class="lead"><span class="it_gets_easier" style="visibility:hidden;">It gets easier with online auctions.</span> <span
162162
style="visibility:hidden;" class='free text-info'>Still completely free.</span></p>
163-
164-
165163
<div class="jumbotron jumbotron-fluid bg-primary">
166164
<div class="container">
167165
<h1 class="display-4">Easy to use. Better for everyone.</h1>
168166
<div class="row">
169-
<div class="col-lg-4 col-md-6">
170-
<div class="card border-secondary mb-3" style="max-width: 20rem;">
171-
<div class="card-header">Online auctions benefit everyone</div>
172-
<div class="card-body">
173-
<h4 class="card-title">Buyers and sellers</h4>
174-
<h3><img style='max-width:2em' src="{% static 'red_tail_cat.svg' %}" class="card-img-top" alt="Don't buy big fish"></h3>
175-
<p class="card-text">Take your time and research items before you bid
176-
<p>Set a minimum bid, so your items always sell for what they're worth</p>
177-
<p>No need to pack and transport unsold items</p>
178-
</p>
167+
<div class="col-lg-4 col-md-6">
168+
<div class="card border-secondary mb-3" style="max-width: 20rem;">
169+
<div class="card-header">Online auctions benefit everyone</div>
170+
<div class="card-body">
171+
<h4 class="card-title">Buyers and sellers</h4>
172+
<h3><img style='max-width:2em' src="{% static 'red_tail_cat.svg' %}" class="card-img-top" alt="Don't buy big fish"></h3>
173+
<p class="card-text">Take your time and research items before you bid
174+
<p>Set a minimum bid, so your items always sell for what they're worth</p>
175+
<p>No need to pack and transport unsold items</p>
176+
</p>
177+
</div>
179178
</div>
180179
</div>
181-
</div>
182-
<div class="col-lg-4 col-md-6">
183-
<div class="card border-secondary mb-3" style="max-width: 20rem;">
184-
<div class="card-header">A game-changer for clubs</div>
185-
<div class="card-body">
186-
<h4 class="card-title">Clubs</h4>
187-
<p class="card-text">
188-
<p>Attract new members</p>
189-
<p>No location rental costs</p>
190-
<p>No auctioneer costs</p>
191-
<p>Save time and hassle setting up</p>
192-
</p>
180+
<div class="col-lg-4 col-md-6">
181+
<div class="card border-secondary mb-3" style="max-width: 20rem;">
182+
<div class="card-header">A game-changer for clubs</div>
183+
<div class="card-body">
184+
<h4 class="card-title">Clubs</h4>
185+
<p class="card-text">
186+
<p>Attract new members</p>
187+
<p>No location rental costs</p>
188+
<p>No auctioneer costs</p>
189+
<p>Save time and hassle setting up</p>
190+
</p>
191+
</div>
193192
</div>
194193
</div>
195-
</div>
196-
<div class="col-lg-4 col-md-6">
197-
<div class="card border-secondary mb-3" style="max-width: 20rem;">
198-
<div class="card-header">Your auction, your way</div>
199-
<div class="card-body">
200-
<h4 class="card-title">Pants optional</h4>
201-
<p class="card-text"></p>
202-
Bid from the comfort of your home<br>
203-
<h3><img style='max-width:1em' src="{% static 'glass.svg' %}" class="card-img-top" alt="Don't drink and bid"></h3>
204-
<span class='text-info'>Sturgeon general's warning:</span> consumption of alcohol while bidding may be
205-
beneficial to your club's finances<br><br>
206-
</p>
194+
<div class="col-lg-4 col-md-6">
195+
<div class="card border-secondary mb-3" style="max-width: 20rem;">
196+
<div class="card-header">Your auction, your way</div>
197+
<div class="card-body">
198+
<h4 class="card-title">Pants optional</h4>
199+
<p class="card-text"></p>
200+
Bid from the comfort of your home<br>
201+
<h3><img style='max-width:1em' src="{% static 'glass.svg' %}" class="card-img-top" alt="Don't drink and bid"></h3>
202+
<span class='text-info'>Sturgeon general's warning:</span> consumption of alcohol while bidding may be
203+
beneficial to your club's finances<br><br>
204+
</p>
205+
</div>
207206
</div>
208207
</div>
209208
</div>
209+
<h1 class="text-end"><span class='magic'>Awesome.</span></h1>
210210
</div>
211-
<h1 class="text-end"><span class='magic'>Awesome.</span></h1>
212211
</div>
213-
</div>
214-
<div class="jumbotron jumbotron-fluid">
215-
<div class="container">
216-
<div class="row">
212+
<div class="jumbotron jumbotron-fluid">
213+
<div class="container">
217214
<div class="row">
218-
<div class="col-lg-4">
219-
<figure class="text-end">
220-
<blockquote class="blockquote">
221-
<p class="mb-0">I was reluctant at first, but after buying and selling, I am convinced this is the next generation of fish auctions. I love the fact my fish don't sit on a cold table all day long.</p>
222-
</blockquote>
223-
<figcaption class="blockquote-footer">rob.vermont</figcaption>
224-
</figure>
225-
</div>
226-
<div class="col-lg-4">
227-
<figure class="text-end">
228-
<blockquote class="blockquote">
229-
<p class="mb-0">Amazing! The best auction software I've ever seen</p>
230-
</blockquote>
231-
<figcaption class="blockquote-footer">Janine Banks</figcaption>
232-
</figure>
233-
</div>
234-
<div class="col-lg-4">
235-
<figure class="text-end">
236-
<blockquote class="blockquote">
237-
<p class="mb-0">This electronic age shit sucks !!!</p>
238-
</blockquote>
239-
<figcaption class="blockquote-footer">John Krol</figcaption>
240-
</figure>
241-
</div>
242-
</div>
243-
244-
215+
<div class="row">
216+
<div class="col-lg-4">
217+
<figure class="text-end">
218+
<blockquote class="blockquote">
219+
<p class="mb-0">I was reluctant at first, but after buying and selling, I am convinced this is the next generation of fish auctions. I love the fact my fish don't sit on a cold table all day long.</p>
220+
</blockquote>
221+
<figcaption class="blockquote-footer">rob.vermont</figcaption>
222+
</figure>
223+
</div>
224+
<div class="col-lg-4">
225+
<figure class="text-end">
226+
<blockquote class="blockquote">
227+
<p class="mb-0">Amazing! The best auction software I've ever seen</p>
228+
</blockquote>
229+
<figcaption class="blockquote-footer">Janine Banks</figcaption>
230+
</figure>
231+
</div>
232+
<div class="col-lg-4">
233+
<figure class="text-end">
234+
<blockquote class="blockquote">
235+
<p class="mb-0">This electronic age shit sucks !!!</p>
236+
</blockquote>
237+
<figcaption class="blockquote-footer">John Krol</figcaption>
238+
</figure>
239+
</div>
240+
</div>
241+
</div>
242+
{% include 'youtube_embed.html' with videoId=online_tutorial chapters=online_tutorial_chapters %}
245243
</div>
246244
</div>
247-
</div>
248-
</div>
249-
245+
</div>
250246
<div class="tab-pane fade show" id="runInPersonAuction">
251247
<br>
252248
<h4>All the software you need to run an in-person auction</h4>
253249
<ul>
254250
<li>Manage users and lots</li>
255251
<li>Quickly and easily set lot winners</li>
256-
<li>Get help from friends* to run the auction<br>
257-
<span class="text-muted"><small>*Friends not included -- you'll have to make some along the way</small></span></li>
252+
<li>Minimum bid (reserve) and buy now prices</li>
253+
<li>Using a projector, show pictures of a lot as it's being auctioned off</li>
254+
<li>Support for Breeder Award Programs/Breeder Participation Programs</li>
255+
<li>Easily copy lots, rules, and users between auctions</li>
256+
<li>One click export of data to generate marketing lists</li>
257+
<li>Different seller and club cuts for club members</li>
258258
<li>Automatic invoicing</li>
259+
<li>Make other users admins to help run the auction</li>
259260
<li>...and more!</li>
260261
</ul>
261262
<br>
263+
{% include 'youtube_embed.html' with videoId=in_person_tutorial chapters=in_person_tutorial_chapters %}
262264
</div>
263-
264-
265-
266-
267265
<div style="background:transparent !important" class="jumbotron jumbotron-fluid bg-primary">
268266
<div class="container">
269267
<h2 class="display-4">Ready to get started?</h2>

‎auctions/templates/youtube_embed.html

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<div class="video-container">
2+
<div id="player_{{videoId}}" class="embed-responsive"></div>
3+
</div>
4+
5+
<script>
6+
var tag = document.createElement('script');
7+
tag.src = "https://www.youtube.com/iframe_api";
8+
var firstScriptTag = document.getElementsByTagName('script')[0];
9+
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
10+
11+
var players = {};
12+
13+
function onYouTubeIframeAPIReady() {
14+
var videoElements = document.querySelectorAll('[id^=player_]');
15+
videoElements.forEach(function(el) {
16+
var videoId = el.id.replace('player_', '');
17+
players[videoId] = new YT.Player(el.id, {
18+
height: getPlayerHeight(),
19+
width: getPlayerWidth(),
20+
videoId: videoId,
21+
playerVars: {
22+
'playsinline': 1
23+
},
24+
});
25+
});
26+
}
27+
28+
function jumpToTime(videoId, seconds) {
29+
if (players[videoId] && players[videoId].seekTo) {
30+
players[videoId].seekTo(seconds, true);
31+
players[videoId].playVideo();
32+
}
33+
}
34+
35+
// Helper functions to get responsive width and height
36+
function getPlayerWidth() {
37+
if (window.innerWidth >= 1024) {
38+
return 875; // Larger width for tablets and desktops
39+
} else {
40+
return 583; // Default width for smaller screens (phones)
41+
}
42+
}
43+
44+
function getPlayerHeight() {
45+
if (window.innerWidth >= 1024) {
46+
return 531; // Corresponding height for the larger width
47+
} else {
48+
return 354; // Default height for smaller screens
49+
}
50+
}
51+
52+
// Recalculate the player sizes on window resize
53+
window.addEventListener('resize', function() {
54+
Object.keys(players).forEach(function(videoId) {
55+
players[videoId].setSize(getPlayerWidth(), getPlayerHeight());
56+
});
57+
});
58+
</script>
59+
60+
{% if chapters %}
61+
<div>
62+
<h5>Jump to content in this video</h5>
63+
<ul>
64+
{% for seconds, chapter in chapters %}
65+
<li><a href="javascript:void(0)" onclick="jumpToTime('{{videoId}}', {{seconds}})">{{ chapter }}</a></li>
66+
{% endfor %}
67+
</ul>
68+
</div>
69+
{% endif %}

‎auctions/urls.py

+5
Original file line numberDiff line numberDiff line change
@@ -173,6 +173,11 @@
173173
login_required(views.AuctionUsers.as_view()),
174174
name="auction_tos_list",
175175
),
176+
path(
177+
"auctions/<slug:slug>/help/",
178+
login_required(views.AuctionHelp.as_view()),
179+
name="auction_help",
180+
),
176181
path(
177182
"auctions/<slug:slug>/users/bulk-add/",
178183
login_required(views.BulkAddUsers.as_view()),

0 commit comments

Comments
 (0)