2021-06-06 23:48:43 +00:00
{{ template "base.html" . }}
{{ define "content" }}
< div class = "content-block no-bg-image" >
{{ with .CarouselProjects }}
2021-07-08 07:40:30 +00:00
< div class = "carousel-container mw-100 mv2 mv3-ns margin-center" >
< div class = "carousel pa3 h5 overflow-hidden bg--dim br2-ns" >
2021-06-06 23:48:43 +00:00
< div class = "dn db-l" > <!-- desktop carousel -->
{{ range $index, $project := . }}
2021-07-08 07:40:30 +00:00
< div class = "carousel-item flex pa3 w-100 h-100 bg--dim items-center {{ if eq $index 0 }}active{{ end }}" >
2021-06-06 23:48:43 +00:00
< div class = "flex-grow-1 pr3 relative flex flex-column h-100 justify-center" >
< a href = "{{ $project.Url }}" >
< h3 > {{ $project.Name }}< / h3 >
< / a >
2021-07-08 07:40:30 +00:00
< div class = "carousel-description" >
2021-06-06 23:48:43 +00:00
{{ $project.ParsedDescription }}
< / div >
2021-07-08 07:40:30 +00:00
< div class = "carousel-fade" > < / div >
2021-06-06 23:48:43 +00:00
< / div >
< div class = "flex-shrink-0 order-0 order-1-ns" >
< a href = "{{ $project.Url }}" >
< div class = "image bg-center cover w5 h5 br2" style = "background-image:url({{ $project.Logo }})" > < / div >
< / a >
< / div >
< / div >
{{ end }}
< / div >
< div class = "db dn-l" > <!-- mobile/tablet carousel -->
{{ range $index, $project := . }}
2021-07-08 07:40:30 +00:00
< div class = "carousel-item-small {{ if eq $index 0 }}active{{ end }}" >
2021-06-06 23:48:43 +00:00
{{ template "project_card.html" projectcarddata $project "h-100" }}
< / div >
{{ end }}
< / div >
< / div >
< div class = "flex justify-center pv2" >
{{ range $index, $project := . }}
< div
2021-07-08 07:40:30 +00:00
class="carousel-button br-pill w1 h1 mh2 {{ if eq $index 0 }}active{{ end }}"
2021-06-06 23:48:43 +00:00
onclick="carouselButtonClick({{ $index }})"
>< / div >
{{ end }}
< / div >
< / div >
{{ end }}
< div class = "flex flex-column flex-row-l mv3 items-start" >
< div class = "bg--dim-ns br2" >
< div class = "clear" > < / div >
< div class = "optionbar pv2 ph3" >
< a href = "{{ .ProjectAtomFeedUrl }}" > < span class = "icon big" > 4< / span > RSS Feed – New Projects< / span > < / a >
{{ template "pagination.html" .Pagination }}
< / div >
< div class = "projectlist ph3" >
{{ range .Projects }}
< div class = "mv3" >
{{ template "project_card.html" projectcarddata . ""}}
< / div >
{{ end }}
< / div >
< div class = "optionbar bottom pv2 ph3" >
< div class = "options order-1" > < / div >
< div class = "options order-0 order-last-ns" > {{ template "pagination.html" .Pagination }}< / div >
< / div >
< / div >
< div class = "w-100 w-40-l ph3 ph0-ns flex-shrink-0" >
< div class = "ml3-l mt3 mt0-l pa3 bg--dim br2" >
{{ if not .UserPendingProject }}
< div class = "content-block new-project p-spaced" >
2021-09-05 19:57:10 +00:00
< h2 > Project submissions are closed< / h2 >
2021-06-06 23:48:43 +00:00
< p >
2021-09-05 19:57:10 +00:00
We are reworking the way we approach projects on the network. In the meantime feel free to share your work on the < a href = "{{ .WIPForumUrl }}" > forums< / a > or on our < a href = "https://discord.gg/hxWxDee" > Discord< / a > .
2021-06-06 23:48:43 +00:00
< / p >
< / div >
{{ else }}
< div class = "content-block single" >
< h2 > Project pending< / h2 >
< p > Thanks for considering us as a home for< br / > < a href = "{{ .UserPendingProject.Url }}" > {{ .UserPendingProject.Name }}< / a > !< / p >
< br / >
{{ if .UserPendingProjectUnderReview }}
< p > We see it's ready for review by an administrator, great! We'll try and get back to you in a timely manner.< / p >
{{ else }}
< p > When you're ready for us to review it, let us know using the checkbox on {{ .UserPendingProject.Name }}'s profile editor.< / p >
{{ end }}
< / div >
{{ end }}
{{ if .UserApprovedProjects }}
< div class = "content-block single projectlist" >
{{ if .UserPendingProject }}
< h2 > Your other projects< / h2 >
{{ else }}
< h2 > Your projects< / h2 >
{{ end }}
{{ range .UserApprovedProjects }}
< div class = "mv3" >
{{ template "project_card.html" projectcarddata . "" }}
< / div >
{{ end }}
< / div >
{{ end }}
< / div >
< / div >
< / div >
< / div >
< script >
const numCarouselItems = {{ len .CarouselProjects }};
2021-07-08 07:40:30 +00:00
function activateCarousel(i) {
const items = document.querySelectorAll('.carousel-item');
2021-06-06 23:48:43 +00:00
items.forEach(item => item.classList.remove('active'));
items[i].classList.add('active');
2021-07-08 07:40:30 +00:00
const smallItems = document.querySelectorAll('.carousel-item-small');
2021-06-06 23:48:43 +00:00
smallItems.forEach(item => item.classList.remove('active'));
smallItems[i].classList.add('active');
2021-07-08 07:40:30 +00:00
const buttons = document.querySelectorAll('.carousel-button');
2021-06-06 23:48:43 +00:00
buttons.forEach(button => button.classList.remove('active'));
buttons[i].classList.add('active');
}
let carouselTimerCurrent = 0;
const carouselTimer = setInterval(() => {
const next = (carouselTimerCurrent + 1) % numCarouselItems;
2021-07-08 07:40:30 +00:00
activateCarousel(next);
2021-06-06 23:48:43 +00:00
carouselTimerCurrent = next;
}, 10000);
function carouselButtonClick(i) {
2021-07-08 07:40:30 +00:00
activateCarousel(i);
2021-06-06 23:48:43 +00:00
clearInterval(carouselTimer);
}
< / script >
{{ end }}