Vis jam landing page

This commit is contained in:
Ben Visness 2023-03-07 11:37:01 -06:00
parent bb38d0b759
commit 55f56d8ae0
27 changed files with 326 additions and 274 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 138 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 423 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 77 KiB

View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 461 280" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g id="Layer1">
</g>
<circle cx="56.5" cy="200.5" r="22.5" style="fill:white;"/>
<circle cx="101.5" cy="147.5" r="22.5" style="fill:white;"/>
<circle cx="183.5" cy="188.5" r="22.5" style="fill:white;"/>
<circle cx="183.5" cy="97.5" r="22.5" style="fill:white;"/>
<circle cx="83.5" cy="52.5" r="22.5" style="fill:white;"/>
<path d="M83.948,51.442L101.948,146.442" style="fill:none;fill-rule:nonzero;stroke:white;stroke-width:6px;"/>
<path d="M53.713,198.058L98.713,145.058" style="fill:none;fill-rule:nonzero;stroke:white;stroke-width:6px;"/>
<path d="M183.59,99.544L103.59,149.544" style="fill:none;fill-rule:nonzero;stroke:white;stroke-width:6px;"/>
<path d="M181.645,190.677L100.645,149.677" style="fill:none;fill-rule:nonzero;stroke:white;stroke-width:6px;"/>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,457,-385)">
<path d="M442,41C442,38.24 439.76,36 437,36L426,36C423.24,36 421,38.24 421,41L421,85C421,87.76 423.24,90 426,90L437,90C439.76,90 442,87.76 442,85L442,41Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,426,-296)">
<path d="M382,70C382,67.24 379.76,65 377,65L366,65C363.24,65 361,67.24 361,70L361,114C361,116.76 363.24,119 366,119L377,119C379.76,119 382,116.76 382,114L382,70Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,486,-356)">
<path d="M442,70C442,67.24 439.76,65 437,65L426,65C423.24,65 421,67.24 421,70L421,159C421,161.76 423.24,164 426,164L437,164C439.76,164 442,161.76 442,159L442,70Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,455,-267)">
<path d="M382,99C382,96.24 379.76,94 377,94L366,94C363.24,94 361,96.24 361,99L361,188C361,190.76 363.24,193 366,193L377,193C379.76,193 382,190.76 382,188L382,99Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,515,-327)">
<path d="M442,99C442,96.24 439.76,94 437,94L426,94C423.24,94 421,96.24 421,99L421,158C421,160.76 423.24,163 426,163L437,163C439.76,163 442,160.76 442,158L442,99Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,484,-238)">
<path d="M382,128C382,125.24 379.76,123 377,123L366,123C363.24,123 361,125.24 361,128L361,187C361,189.76 363.24,192 366,192L377,192C379.76,192 382,189.76 382,187L382,128Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,544,-298)">
<path d="M442,128C442,125.24 439.76,123 437,123L426,123C423.24,123 421,125.24 421,128L421,238C421,240.76 423.24,243 426,243L437,243C439.76,243 442,240.76 442,238L442,128Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,513,-209)">
<path d="M382,157C382,154.24 379.76,152 377,152L366,152C363.24,152 361,154.24 361,157L361,267C361,269.76 363.24,272 366,272L377,272C379.76,272 382,269.76 382,267L382,157Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,573,-269)">
<path d="M442,157C442,154.24 439.76,152 437,152L426,152C423.24,152 421,154.24 421,157L421,187C421,189.76 423.24,192 426,192L437,192C439.76,192 442,189.76 442,187L442,157Z" style="fill:white;"/>
</g>
<g transform="matrix(-3.82857e-16,1,-1,-3.82857e-16,542,-180)">
<path d="M382,186C382,183.24 379.76,181 377,181L366,181C363.24,181 361,183.24 361,186L361,216C361,218.76 363.24,221 366,221L377,221C379.76,221 382,218.76 382,216L382,186Z" style="fill:white;"/>
</g>
<path d="M461,21.739C461,9.741 451.259,0 439.261,0L21.739,0C9.741,0 0,9.741 0,21.739L0,258.261C0,270.259 9.741,280 21.739,280L439.261,280C451.259,280 461,270.259 461,258.261L461,21.739ZM447,21.739L447,258.261C447,262.532 443.532,266 439.261,266C439.261,266 21.739,266 21.739,266C17.468,266 14,262.532 14,258.261L14,21.739C14,17.468 17.468,14 21.739,14L439.261,14C443.532,14 447,17.468 447,21.739Z" style="fill:white;"/>
<g transform="matrix(2.90789,0,0,1.65,-31.7105,-153.4)">
<rect x="14" y="236" width="152" height="20" style="fill:white;"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.4 KiB

BIN
public/visjam2023/npm.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

View File

Before

Width:  |  Height:  |  Size: 302 KiB

After

Width:  |  Height:  |  Size: 302 KiB

BIN
public/visjam2023/spall.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

BIN
public/visjam2023/v8.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 154 KiB

BIN
public/visjam2023/vmmap.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -1,22 +0,0 @@
<svg width="461" height="280" viewBox="0 0 461 280" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M22 0C9.84974 0 0 9.84974 0 22V258C0 270.15 9.84973 280 22 280H439C451.15 280 461 270.15 461 258V22C461 9.84974 451.15 0 439 0H22ZM36 14C23.8497 14 14 23.8497 14 36V236H447V36C447 23.8497 437.15 14 425 14H36Z" fill="white"/>
<circle cx="56.5" cy="200.5" r="22.5" fill="white"/>
<circle cx="101.5" cy="147.5" r="22.5" fill="white"/>
<circle cx="183.5" cy="188.5" r="22.5" fill="white"/>
<circle cx="183.5" cy="97.5" r="22.5" fill="white"/>
<circle cx="83.5" cy="52.5" r="22.5" fill="white"/>
<line x1="83.9476" y1="51.4415" x2="101.948" y2="146.442" stroke="white" stroke-width="6"/>
<line x1="53.7131" y1="198.058" x2="98.7131" y2="145.058" stroke="white" stroke-width="6"/>
<line x1="183.59" y1="99.544" x2="103.59" y2="149.544" stroke="white" stroke-width="6"/>
<line x1="181.645" y1="190.677" x2="100.645" y2="149.677" stroke="white" stroke-width="6"/>
<rect x="421" y="36" width="21" height="54" rx="5" transform="rotate(90 421 36)" fill="white"/>
<rect x="361" y="65" width="21" height="54" rx="5" transform="rotate(90 361 65)" fill="white"/>
<rect x="421" y="65" width="21" height="99" rx="5" transform="rotate(90 421 65)" fill="white"/>
<rect x="361" y="94" width="21" height="99" rx="5" transform="rotate(90 361 94)" fill="white"/>
<rect x="421" y="94" width="21" height="69" rx="5" transform="rotate(90 421 94)" fill="white"/>
<rect x="361" y="123" width="21" height="69" rx="5" transform="rotate(90 361 123)" fill="white"/>
<rect x="421" y="123" width="21" height="120" rx="5" transform="rotate(90 421 123)" fill="white"/>
<rect x="361" y="152" width="21" height="120" rx="5" transform="rotate(90 361 152)" fill="white"/>
<rect x="421" y="152" width="21" height="40" rx="5" transform="rotate(90 421 152)" fill="white"/>
<rect x="361" y="181" width="21" height="40" rx="5" transform="rotate(90 361 181)" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.9 KiB

View File

@ -41,10 +41,10 @@ var WRJ2022 = Jam{
var VJ2023 = Jam{
Event: Event{
StartTime: time.Date(2023, 4, 14, 0, 0, 0, 0, utils.Must1(time.LoadLocation("America/Los_Angeles"))),
EndTime: time.Date(2023, 4, 16, 8, 0, 0, 0, utils.Must1(time.LoadLocation("America/Los_Angeles"))),
StartTime: time.Date(2023, 4, 14, 0, 0, 0, 0, time.UTC),
EndTime: time.Date(2023, 4, 17, 0, 0, 0, 0, time.UTC),
},
Name: "Visualization Jam 2023",
Name: "Visibility Jam 2023",
Slug: "VJ2023",
}

View File

@ -70,11 +70,11 @@ func BuildJamIndex2022() string {
return Url("/jam/2022", nil)
}
var RegexVisualizationJamIndex2023 = regexp.MustCompile("^/visualization-jam/2023$")
var RegexJamIndex2023_Visibility = regexp.MustCompile("^/jam/visibility-2023$")
func BuildVisualizationJamIndex2023() string {
func BuildJamIndex2023_Visibility() string {
defer CatchPanic()
return Url("/visualization-jam/2023", nil)
return Url("/jam/visibility-2023", nil)
}
var RegexJamFeed2022 = regexp.MustCompile("^/jam/2022/feed$")

View File

@ -1,4 +1,4 @@
{{ template "visualization_jam_2023_base.html" . }} {{ define "content" }} {{
{{ template "jam_2023_visibility_base.html" . }} {{ define "content" }} {{
$discordInviteURL := "https://discord.gg/hmn" }}
<style>
@ -17,47 +17,50 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</style>
<div id="top-container" class="flex flex-column items-center ph3">
<img id="logo" src="{{ static "visualjam2023/logo.svg" }}">
<h1 id="title">Visualization Jam</h1>
<img id="logo" src="{{ static "visjam2023/logo.svg" }}">
<h1 id="title">Visibility Jam</h1>
<h2 id="dates">April 14 - 16, 2O23</h2>
<div id="tagline" class="center">
A jam to see things in a new way. {{ if gt .DaysUntilEnd 0 }} {{ if eq
.DaysUntilStart 0 }}
<b>Happening now.</b>
{{ else if eq .DaysUntilStart 1 }}
<b>Starting tomorrow.</b>
{{ else }}
<b>In {{ .DaysUntilStart }} days.</b>
{{ end }} {{ end }}
See things in a new way.
{{ if gt .DaysUntilEnd 0 }}
{{ if eq .DaysUntilStart 0 }}
<b>Happening now.</b>
{{ else if eq .DaysUntilStart 1 }}
<b>Starting tomorrow.</b>
{{ else }}
<b>Starting in {{ .DaysUntilStart }} days.</b>
{{ end }}
{{ end }}
</div>
<div class="actions flex justify-center">
{{ if gt .DaysUntilStart 0 }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
target="_blank"
href="https://github.com/HandmadeNetwork/wishlist/discussions"
>Find a project</a
>
{{ else if gt .DaysUntilEnd 0 }} {{ if .SubmittedProjectUrl }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
target="_blank"
href="{{ .SubmittedProjectUrl }}"
>Share your progress</a
>
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
href="#inspiration"
>Get inspired</a
>
{{ else if gt .DaysUntilEnd 0 }}
{{ if .SubmittedProjectUrl }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
target="_blank"
href="{{ .SubmittedProjectUrl }}"
>Share your progress</a
>
{{ else }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
target="_blank"
href="{{ .ProjectSubmissionUrl }}"
>Create your project</a
>
{{ end }}
{{ else }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
target="_blank"
href="{{ .ProjectSubmissionUrl }}"
>Create your project</a
>
{{ end }} {{ else }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
href="{{ .ShowcaseFeedUrl }}"
>See the results</a
>
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
href="{{ .ShowcaseFeedUrl }}"
>See the results</a
>
{{ end }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
@ -69,10 +72,15 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</div>
<div class="section mw8 margin-center ph3 ph4-l mv4">
<h1>
TODO: Needs copy -- guessing we'll use some of the images that Ben has
marked as TODO TODO TODO in the copy doc.
</h1>
<p>
Too many things in computing are <b>invisible</b>.
</p>
<p>
Bugs linger for years because nobody can see their effects. We run arcane command line tools just to find out what port a program is using. Your computer is full of helpful information, but no one can use it until someone <b>makes it visible.</b>
</p>
<p>
So for this jam, make it visible. Maybe it's a data structure in your program. Maybe it's some obscure metrics from your operating system. Maybe it's your sleep schedule. Whether you make a Graphviz diagram or an experimental code editor, you have a weekend to make it happen.
</p>
</div>
{{ if eq .DaysUntilEnd 0 }}
@ -80,8 +88,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
<div class="mw8 margin-center ph3 ph4-l">
<h2>Submitted projects</h2>
<div class="mt3 projects g3 back-to-normal">
{{ range .JamProjects }} {{ template "project_card.html" projectcarddata .
"" }} {{ end }}
{{ range .JamProjects }} {{ template "project_card.html" projectcarddata . "" }} {{ end }}
</div>
<div class="actions flex justify-center">
<a
@ -232,6 +239,85 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</script>
{{ end }}
<div id="inspiration" class="bg-black-20 pt4">
<div class="section mw8 margin-center ph3 ph4-l">
<h2>Inspiration</h2>
</div>
<div class="inspiration flex flex-column flex-wrap g3 ph3 ph4-l pt3 pt4-ns pb4 overflow-x-scroll">
<div class="pic">
<img src="{{ static "visjam2023/gource.png" }}">
<div class="caption">Gource lets you watch the structure of a codebase change over time.</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/npm.png" }}">
<div class="caption">See how often third-party packages ship breaking changes.</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/graphviz.jpeg" }}">
<div class="caption">Graphviz can be used to make debug visuals for almost any data structure.</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/wireshark.jpg" }}">
<div class="caption">Wireshark exposes all activity on all your network devices.</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/spall.png" }}">
<div class="caption">Flamegraphs let you see the big picture of code execution, not just summary stats.</div>
</div>
<div class="pic">
<blockquote class="twitter-tweet" data-conversation="none" data-dnt="true" data-theme="dark"><p lang="en" dir="ltr">A recipe for finding bugs:<br>* predict what the data should look like<br>* render the data<br>* be surprised and confused</p>&mdash; Jamie Brandon (@sc13ts) <a href="https://twitter.com/sc13ts/status/1600907692788580352?ref_src=twsrc%5Etfw">December 8, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<div class="pic">
<img src="{{ static "visjam2023/v8.png" }}">
<div class="caption">Bugs can be very obvious when you render out the data. (Example: a random number generator.)</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/bundle-analyzer.png" }}">
<div class="caption">Webpack Bundle Analyzer lets you see which JS libraries are causing the most bloat.</div>
</div>
<div class="pic">
<img src="{{ static "visjam2023/vmmap.png" }}">
<div class="caption">vmmap allows you to see exactly how your address space is allocated.</div>
</div>
</div>
</div>
<style>
.inspiration {
max-height: 34rem;
scrollbar-color: rgba(189, 89, 158, 0.58) rgba(0, 0, 0, 0.2);
}
.inspiration .pic {
max-width: 18rem;
}
@media screen and (min-width: 35em) {
.inspiration {
max-height: 42rem;
}
.inspiration .pic {
max-width: 22rem;
}
}
.inspiration .pic .twitter-tweet {
margin: 0 !important;
}
.inspiration .pic img {
border-radius: 4px;
}
.inspiration .pic .caption {
color: rgba(255, 255, 255, 0.8);
font-size: 0.8rem;
line-height: 1.2;
padding-top: 0.25rem;
}
</style>
<div class="pt4 pb3 pb4-ns">
<div class="section mw8 margin-center ph3 ph4-l">
<h2>How to participate</h2>
@ -241,11 +327,9 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</p>
<div class="{{ if gt .DaysUntilStart 0 }}emphasized{{ end }}">
<h3>Pick a project and form a team.</h3>
<h3>Pick a project.</h3>
<p>
Pick something to visualize! Maybe its some weird data structure you
want to debug. Maybe its a map of your codebase. Maybe its your sleep
schedule. Whatever it is, make a Handmade Network project for it
Pick something to visualize! If you want, you can brainstorm ideas in <b>#jam</b> on <a href="{{ $discordInviteURL }}" target="_blank">Discord</a>. You can also use this time to form a team - or you can choose to work solo.
</p>
</div>
@ -255,14 +339,13 @@ $discordInviteURL := "https://discord.gg/hmn" }}
<h3>Jam.</h3>
<p>
{{ if and (eq .DaysUntilStart 0) (not .SubmittedProjectUrl) }}
<a href="{{ .ProjectSubmissionUrl }}" target="_blank"
><b>Create a Handmade Network project</b></a
>
{{ else }} After the jam starts, create a Handmade Network project {{
end }} to track your work. Then, build your program! Share your work in
progress in #project-showcase on
<a href="{{ $discordInviteURL }}" target="_blank">Discord</a>, or
directly from your project page. Chat with other jammers in #jam too.
<a href="{{ .ProjectSubmissionUrl }}" target="_blank">
<b>Create a Handmade Network project.</b>
</a>
{{ else }}
After the jam starts, create a Handmade Network project.
{{ end }}
This project will act as your submission and can be used to share your work in progress. Then get started! Share screenshots and videos in #project-showcase on <a href="{{ $discordInviteURL }}" target="_blank">Discord</a>, or directly from your project page.
</p>
</div>
@ -271,8 +354,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
<p>
<b>Your Handmade Network project is your submission.</b> Fill out the
project description, making sure to explain the goals of the project and
how it improves on what came before. Also consider posting an update
with video of your program in action!
what inspired you to visualize it. Include plenty of pictures and videos!
</p>
{{ if and (eq .DaysUntilStart 0) (gt .DaysUntilEnd 0) }}
<p>
@ -293,25 +375,13 @@ $discordInviteURL := "https://discord.gg/hmn" }}
<div class="section mw8 margin-center ph3 ph4-l">
<h2>Rules</h2>
<ul>
<li>
Any tech is allowed, but we encourage you to use only use what you
really need. If you want some lightweight templates to get you started,
check out our
<a
href="https://github.com/HandmadeNetwork/jam_templates"
target="_blank"
>app templates</a
>.
</li>
<li>
You may work solo or in a team. (But we encourage you to work with a
team!)
</li>
<li>Any tech is allowed.</li>
<li>You may work solo or in a team.</li>
<li>Submit your work by the end of the day on April 16.</li>
</ul>
<p>
There are no explicit winners, but we will be selecting a few of our
favorite projects to highlight in a recap stream following the jam.
We will not be declaring winners, but we will publicly highlight some of our
favorite entries after the jam.
</p>
<h3>Submission rules</h3>
@ -327,7 +397,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</p>
<ul>
<li>
Explain the project's goals and how it improves on what came before.
Explain the project and what inspired you to visualize it.
Also share some closing thoughts - did it turn out how you hoped? What
did you learn? If you continue the project, what will you do
differently?
@ -345,47 +415,25 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</li>
<li>
If at all possible, please provide a way for people to either build or
download your program.
download your program, or to interact with any visualizations you produce.
</li>
</ul>
</div>
</div>
<div class="pt4">
<div class="flex-ns flex-row-ns mw8 margin-center ph3 ph4-l">
<div class="section flex-fair mb4 mb0-ns">
<h2>Make it by hand.</h2>
<p>
The Handmade ethos and Handmade community are software development
superpowers. Don't be afraid to question your foundations and rebuild
what needs rebuilding. The community is here to help you take on those
challenges and do what others might consider impossible.
</p>
<p>
Of course, this is a jam, so focus on what matters to your project.
There are many excellent libraries in the community that can save you
time and help you focus on your core ideas. Don't be afraid to use them.
But don't be afraid to do your own thing if they're holding you back.
</p>
</div>
<div class="section flex-fair ml4-m ml5-l">
<h2>Don't just rebuild. Reinvent.</h2>
<p>
This is a chance to build something <em>truly new</em>. Learn from
previous work, but don't settle for “the same, but better”. It would be
a huge shame to spend a week building nothing more than a clone of the
same broken software we use today.
</p>
<p>
This is where working with a team can really help. Bounce ideas off each
other, do some research, and brainstorm before the jam starts. The
software you end up building might be pretty different from your
original ideas.
</p>
<p>In the end, this is a jam. Get weird and try something different.</p>
</div>
</div>
</div>
<!-- This block of styles removes the top border from the footer and adjusts spacing so it looks better. Use this if the final content block has bg-black-20; comment it out otherwise. -->
<style>
footer {
border-top: none;
margin-bottom: 1rem; /* .mb3 */
}
@media screen and (min-width: 60em) {
footer {
margin-bottom: 2rem; /* .mb4-l */
}
}
</style>
<script>
const carouselContainer = document.querySelector(".carousel-container");

View File

@ -111,11 +111,10 @@
</div>
*/}}
{{/*
<div class="mb3 ph3 ph0-ns">
<style>
#jam-banner {
background: linear-gradient(174deg, #346ba6, #814cb7);
background: linear-gradient(174deg, #C8217E, #6E2C6B);
color: white !important;
text-align: center;
}
@ -153,11 +152,11 @@
}
</style>
<a id="jam-banner" class="pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href="{{ .JamUrl }}">
<img class="h3" src="{{ static "wheeljam2022/logo.svg" }}">
<img class="h3" src="{{ static "visjam2023/logo.svg" }}">
<div id="jam-title-container" class="flex flex-column pl3-m pl4-l pv3 pv0-ns">
<h3 id="jam-title">Wheel Reinvention Jam</h3>
<h3 id="jam-title">Visibility Jam</h3>
<div id="jam-details">
August 15 - 21.
April 14 - 16.
{{ if gt .JamDaysUntilEnd 0 }}
{{ if eq .JamDaysUntilStart 0 }}
<b>Happening now.</b>
@ -178,7 +177,6 @@
</div>
</a>
</div>
*/}}
{{ if not .User }}
<div class="mb3 ph3 ph0-ns">

View File

@ -8,8 +8,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" sizes="16x16" href="{{ static "visualjam2023/favicon-16x16.png" }}">
<link rel="icon" type="image/png" sizes="32x32" href="{{ static "visualjam2023/favicon-32x32.png" }}">
<link rel="icon" type="image/png" sizes="16x16" href="{{ static "visjam2023/favicon-16x16.png" }}">
<link rel="icon" type="image/png" sizes="32x32" href="{{ static "visjam2023/favicon-32x32.png" }}">
{{ if .CanonicalLink }}<link rel="canonical" href="{{ .CanonicalLink }}">{{ end }}
{{ range .OpenGraphItems }}
@ -35,7 +35,7 @@
<style>
/* Copy-paste from project.css yay */
{{ $c := hex2color "D10074" }}
{{ $c := hex2color "C8217E" }}
{{ $themeDim := eq .Theme "dark" | ternary (lightness 0.35 $c) (lightness 0.75 $c) | color2css }}
{{ $themeDimmer := eq .Theme "dark" | ternary (lightness 0.3 $c) (lightness 0.8 $c) | color2css }}
@ -60,8 +60,7 @@
}
body {
background: linear-gradient( #D10074, #6E2C6B );
// background: linear-gradient( #34e89e, #0f3443);
background: linear-gradient( #C8217E, #6E2C6B );
}
.user-options,
@ -86,7 +85,7 @@
}
header .submenu {
background-color: #D10074;
background-color: #C8217E;
}
#top-container {

View File

@ -11,6 +11,104 @@ import (
"git.handmade.network/hmn/hmn/src/utils"
)
func JamIndex2023_Visibility(c *RequestContext) ResponseData {
var res ResponseData
daysUntilStart := daysUntil(hmndata.VJ2023.StartTime)
daysUntilEnd := daysUntil(hmndata.VJ2023.EndTime)
baseData := getBaseDataAutocrumb(c, hmndata.VJ2023.Name)
baseData.OpenGraphItems = []templates.OpenGraphItem{
{Property: "og:site_name", Value: "Handmade.Network"},
{Property: "og:type", Value: "website"},
// TODO:
{Property: "og:image", Value: hmnurl.BuildPublic("visjam2023/opengraph.png", true)},
{Property: "og:description", Value: "See things in a new way. April 14 - 16."},
{Property: "og:url", Value: hmnurl.BuildJamIndex()},
}
type JamPageData struct {
templates.BaseData
DaysUntilStart, DaysUntilEnd int
StartTimeUnix, EndTimeUnix int64
SubmittedProjectUrl string
ProjectSubmissionUrl string
ShowcaseFeedUrl string
ShowcaseJson string
JamProjects []templates.Project
}
var showcaseItems []templates.TimelineItem
submittedProjectUrl := ""
if c.CurrentUser != nil {
projects, err := hmndata.FetchProjects(c, c.Conn, c.CurrentUser, hmndata.ProjectsQuery{
OwnerIDs: []int{c.CurrentUser.ID},
JamSlugs: []string{hmndata.VJ2023.Slug},
Limit: 1,
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch jam projects for current user"))
}
if len(projects) > 0 {
urlContext := hmndata.UrlContextForProject(&projects[0].Project)
submittedProjectUrl = urlContext.BuildHomepage()
}
}
jamProjects, err := hmndata.FetchProjects(c, c.Conn, c.CurrentUser, hmndata.ProjectsQuery{
JamSlugs: []string{hmndata.VJ2023.Slug},
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch jam projects for current user"))
}
pageProjects := make([]templates.Project, 0, len(jamProjects))
for _, p := range jamProjects {
pageProjects = append(pageProjects, templates.ProjectAndStuffToTemplate(&p, hmndata.UrlContextForProject(&p.Project).BuildHomepage(), c.Theme))
}
projectIds := make([]int, 0, len(jamProjects))
for _, jp := range jamProjects {
projectIds = append(projectIds, jp.Project.ID)
}
if len(projectIds) > 0 {
snippets, err := hmndata.FetchSnippets(c, c.Conn, c.CurrentUser, hmndata.SnippetQuery{
ProjectIDs: projectIds,
Limit: 12,
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch snippets for jam showcase"))
}
showcaseItems = make([]templates.TimelineItem, 0, len(snippets))
for _, s := range snippets {
timelineItem := SnippetToTimelineItem(&s.Snippet, s.Asset, s.DiscordMessage, s.Projects, s.Owner, c.Theme, false)
if timelineItem.CanShowcase {
showcaseItems = append(showcaseItems, timelineItem)
}
}
}
showcaseJson := templates.TimelineItemsToJSON(showcaseItems)
res.MustWriteTemplate("jam_2023_visibility.html", JamPageData{
BaseData: baseData,
DaysUntilStart: daysUntilStart,
DaysUntilEnd: daysUntilEnd,
StartTimeUnix: hmndata.VJ2023.StartTime.Unix(),
EndTimeUnix: hmndata.VJ2023.EndTime.Unix(),
ProjectSubmissionUrl: hmnurl.BuildProjectNewJam(),
SubmittedProjectUrl: submittedProjectUrl,
ShowcaseFeedUrl: hmnurl.BuildJamFeed2022(),
ShowcaseJson: showcaseJson,
JamProjects: pageProjects,
}, c.Perf)
return res
}
func JamIndex2022(c *RequestContext) ResponseData {
var res ResponseData
@ -93,7 +191,7 @@ func JamIndex2022(c *RequestContext) ResponseData {
showcaseJson := templates.TimelineItemsToJSON(showcaseItems)
res.MustWriteTemplate("wheeljam_2022_index.html", JamPageData{
res.MustWriteTemplate("jam_2022_wrj_index.html", JamPageData{
BaseData: baseData,
DaysUntilStart: daysUntilStart,
DaysUntilEnd: daysUntilEnd,
@ -164,7 +262,7 @@ func JamFeed2022(c *RequestContext) ResponseData {
}
var res ResponseData
res.MustWriteTemplate("wheeljam_2022_feed.html", JamFeedData{
res.MustWriteTemplate("jam_2022_wrj_feed.html", JamFeedData{
BaseData: baseData,
DaysUntilStart: daysUntilStart,
DaysUntilEnd: daysUntilEnd,
@ -226,7 +324,7 @@ func JamIndex2021(c *RequestContext) ResponseData {
ShowcaseItemsJSON string
}
res.MustWriteTemplate("wheeljam_2021_index.html", JamPageData{
res.MustWriteTemplate("jam_2021_wrj_index.html", JamPageData{
BaseData: baseData,
DaysUntil: daysUntilJam,
ShowcaseItemsJSON: showcaseJson,

View File

@ -153,8 +153,8 @@ func Index(c *RequestContext) ResponseData {
MarkAllReadUrl: hmnurl.HMNProjectContext.BuildForumMarkRead(0),
JamUrl: hmnurl.BuildJamIndex(),
JamDaysUntilStart: daysUntil(hmndata.WRJ2022.StartTime),
JamDaysUntilEnd: daysUntil(hmndata.WRJ2022.EndTime),
JamDaysUntilStart: daysUntil(hmndata.VJ2023.StartTime),
JamDaysUntilEnd: daysUntil(hmndata.VJ2023.EndTime),
HMSDaysUntilStart: daysUntil(hmndata.HMS2022.StartTime),
HMSDaysUntilEnd: daysUntil(hmndata.HMS2022.EndTime),

View File

@ -55,11 +55,11 @@ func NewWebsiteRoutes(conn *pgxpool.Pool) http.Handler {
hmnOnly.GET(hmnurl.RegexProjectSubmissionGuidelines, ProjectSubmissionGuidelines)
hmnOnly.GET(hmnurl.RegexConferences, Conferences)
hmnOnly.GET(hmnurl.RegexWhenIsIt, WhenIsIt)
hmnOnly.GET(hmnurl.RegexJamIndex, JamIndex2022)
hmnOnly.GET(hmnurl.RegexJamIndex, JamIndex2023_Visibility)
hmnOnly.GET(hmnurl.RegexJamIndex2021, JamIndex2021)
hmnOnly.GET(hmnurl.RegexJamIndex2022, JamIndex2022)
hmnOnly.GET(hmnurl.RegexJamFeed2022, JamFeed2022)
hmnOnly.GET(hmnurl.RegexVisualizationJamIndex2023, VisualizationIndex2023)
hmnOnly.GET(hmnurl.RegexJamIndex2023_Visibility, JamIndex2023_Visibility)
hmnOnly.GET(hmnurl.RegexStaffRolesIndex, StaffRolesIndex)
hmnOnly.GET(hmnurl.RegexStaffRole, StaffRole)

View File

@ -1,118 +0,0 @@
package website
import (
"net/http"
// "time"
"git.handmade.network/hmn/hmn/src/hmndata"
"git.handmade.network/hmn/hmn/src/hmnurl"
"git.handmade.network/hmn/hmn/src/oops"
"git.handmade.network/hmn/hmn/src/templates"
// "git.handmade.network/hmn/hmn/src/utils"
)
func VisualizationIndex2023(c *RequestContext) ResponseData {
var res ResponseData
daysUntilStart := daysUntil(hmndata.VJ2023.StartTime)
daysUntilEnd := daysUntil(hmndata.VJ2023.EndTime)
baseData := getBaseDataAutocrumb(c, hmndata.VJ2023.Name)
baseData.OpenGraphItems = []templates.OpenGraphItem{
{Property: "og:site_name", Value: "Handmade.Network"},
{Property: "og:type", Value: "website"},
// TODO:
{Property: "og:image", Value: hmnurl.BuildPublic("visualjam2023/opengraph.png", true)},
{Property: "og:description", Value: "See things in a new way. April 14 - 16."},
{Property: "og:url", Value: hmnurl.BuildJamIndex()},
}
type JamPageData struct {
templates.BaseData
DaysUntilStart, DaysUntilEnd int
StartTimeUnix, EndTimeUnix int64
SubmittedProjectUrl string
ProjectSubmissionUrl string
ShowcaseFeedUrl string
ShowcaseJson string
JamProjects []templates.Project
}
var showcaseItems []templates.TimelineItem
submittedProjectUrl := ""
if c.CurrentUser != nil {
projects, err := hmndata.FetchProjects(c, c.Conn, c.CurrentUser, hmndata.ProjectsQuery{
OwnerIDs: []int{c.CurrentUser.ID},
JamSlugs: []string{hmndata.VJ2023.Slug},
Limit: 1,
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch jam projects for current user"))
}
if len(projects) > 0 {
urlContext := hmndata.UrlContextForProject(&projects[0].Project)
submittedProjectUrl = urlContext.BuildHomepage()
}
}
jamProjects, err := hmndata.FetchProjects(c, c.Conn, c.CurrentUser, hmndata.ProjectsQuery{
JamSlugs: []string{hmndata.VJ2023.Slug},
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch jam projects for current user"))
}
pageProjects := make([]templates.Project, 0, len(jamProjects))
for _, p := range jamProjects {
pageProjects = append(pageProjects, templates.ProjectAndStuffToTemplate(&p, hmndata.UrlContextForProject(&p.Project).BuildHomepage(), c.Theme))
}
projectIds := make([]int, 0, len(jamProjects))
for _, jp := range jamProjects {
projectIds = append(projectIds, jp.Project.ID)
}
if len(projectIds) > 0 {
snippets, err := hmndata.FetchSnippets(c, c.Conn, c.CurrentUser, hmndata.SnippetQuery{
ProjectIDs: projectIds,
Limit: 12,
})
if err != nil {
return c.ErrorResponse(http.StatusInternalServerError, oops.New(err, "failed to fetch snippets for jam showcase"))
}
showcaseItems = make([]templates.TimelineItem, 0, len(snippets))
for _, s := range snippets {
timelineItem := SnippetToTimelineItem(&s.Snippet, s.Asset, s.DiscordMessage, s.Projects, s.Owner, c.Theme, false)
if timelineItem.CanShowcase {
showcaseItems = append(showcaseItems, timelineItem)
}
}
}
showcaseJson := templates.TimelineItemsToJSON(showcaseItems)
res.MustWriteTemplate("visualization_jam_2023.html", JamPageData{
BaseData: baseData,
DaysUntilStart: daysUntilStart,
DaysUntilEnd: daysUntilEnd,
StartTimeUnix: hmndata.VJ2023.StartTime.Unix(),
EndTimeUnix: hmndata.VJ2023.EndTime.Unix(),
ProjectSubmissionUrl: hmnurl.BuildProjectNewJam(),
SubmittedProjectUrl: submittedProjectUrl,
ShowcaseFeedUrl: hmnurl.BuildJamFeed2022(),
ShowcaseJson: showcaseJson,
JamProjects: pageProjects,
}, c.Perf)
return res
}
// func daysUntil(t time.Time) int {
// d := t.Sub(time.Now())
// if d < 0 {
// d = 0
// }
// return int(utils.DurationRoundUp(d, 24*time.Hour) / (24 * time.Hour))
// }