freeCodeCamp/server/views/challengeMap/show.jade

141 lines
8.0 KiB
Plaintext

extends ../layout
block content
.panel.panel-info
.panel-heading.text-center
h1 Challenge Map
.panel-body
if (Math.random() > 0.999)
img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner-dino.png')
audio(autoplay src='https://s3.amazonaws.com/freecodecamp/t-rex-roar.mp3')
else
img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png')
.col-xs-12.col-md-8.col-md-offset-2
h2.text-center
span.text-primary #{camperCount}  
| campers have joined our community
br
| since we launched  
span.text-primary #{daysRunning}  
| days ago.
.spacer
if (user && user.progressTimestamps.length > 5)
#tshirt-notice.col-xs-12.col-md-8.col-md-offset-2.hidden
h2.text-center Get our first-edition t-shirt
img.thumbnail.img-center.img-responsive(src="http://i.imgur.com/o07uuOL.png")
p.text-justify Our community has voted. Get our winning design emblazoned on a durable, American-made American Apparel shirt (available in women's and men's sizes). 
a(href="https://teespring.com/free-code-camp-shirt-eu" target="_blank") Also ships from Europe
| .
a.button.btn.btn-block.signup-btn(href="https://teespring.com/get-free-code-camp-t-shirt" target="_blank") Get yours
.button-spacer
#hideTshirtNoticeButton.button.btn.btn-block.btn-info Hide this forever
.spacer
.row
.col-xs-12.col-sm-8.col-sm-offset-2
h3 800 Hours of Practice:
ol
for challengeBlock in blocks
.row
if (user)
if (challengeBlock.completed === 100)
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.faded.negative-10
a(href='#' + challengeBlock.dashedName)= challengeBlock.name
else
.hidden-xs.col-sm-3.col-md-2
.progress.progress-bar-padding.text-center.thin-progress-bar
.progress-bar(role='progressbar', aria-valuenow=(challengeBlock.completed), aria-valuemin='0', aria-valuemax='100', style='width: ' + challengeBlock.completed + '%;')
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10
a(href='#' + challengeBlock.dashedName)= challengeBlock.name
else
.hidden-xs.col-sm-3.col-md-2
span.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10
a(href='#' + challengeBlock.dashedName)= challengeBlock.name
.row
.col-xs-12.col-sm-8.col-sm-offset-2.negative-28
h3 800 Hours of  
a(href="/nonprofits/directory") Real World Work Experience
| :
ol
.row
.hidden-xs.col-sm-3.col-md-2.ion-locked.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10 100-hour Nonprofit Project
.row
.hidden-xs.col-sm-3.col-md-2.ion-locked.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10 200-hour Nonprofit Project #1
.row
.hidden-xs.col-sm-3.col-md-2.ion-locked.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10 200-hour Nonprofit Project #2
.row
.hidden-xs.col-sm-3.col-md-2.ion-locked.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10 300-hour Nonprofit Project
hr
for challengeBlock in blocks
.row
a(href='#' name=challengeBlock.dashedName)
.spacer.negative-55
.row
.hidden-xs.col-sm-3.col-md-2
h3.text-primary.text-right.nowrap
i.fa.fa-clock-o  #{challengeBlock.time}
.col-xs-12.col-sm-9.col-md-10
h3 #{challengeBlock.name}  
.row
ol
for challenge in challengeBlock.challenges
if challenge.completed
.row
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center.map-p.negative-10
.col-xs-12.col-sm-9.col-md-10
li.faded.map-p.negative-10
a(href="/challenges/#{challenge.dashedName}")
span.capitalize= challenge.type + ': '
span= challenge.title
span.sr-only= " Complete"
else
.row
.hidden-xs.col-sm-3.col-md-2
span.negative-10
.col-xs-12.col-sm-9.col-md-10
li.map-p.negative-10
a(href="/challenges/#{challenge.dashedName}")
span.capitalize= challenge.type + ': '
span= challenge.title
span.sr-only= " Incomplete"
if (challengeBlock.completed === 100)
.button-spacer
.row
.col-xs-12.col-sm-8.col-md-6.col-sm-offset-3.col-md-offset-2.hidden
a.btn.btn-lg.btn-block.signup-btn.map-challenge-block-share Section complete. Share your Portfolio with your friends.
.hidden(id="#{challengeBlock.name}")
script.
var username = !{JSON.stringify(user && user.username || '')};
var lastCompleted = !{JSON.stringify(lastCompleted || false)}
$(document).ready(function () {
if (!localStorage || !localStorage.hideTshirtNotice) {
$("#tshirt-notice").removeClass("hidden");
}
$("#hideTshirtNoticeButton").on("click", function() {
$("#tshirt-notice").addClass('animated fadeOut');
setTimeout(function() {
$("#tshirt-notice").hide();
}, 1000);
localStorage.hideTshirtNotice = "true";
});
});