start styling news for mobile
This commit is contained in:
Quincy Larson
@@ -913,12 +913,28 @@ iframe.iphone {
|
|||||||
// background-color: #e5e5e5;
|
// background-color: #e5e5e5;
|
||||||
//}
|
//}
|
||||||
|
|
||||||
.media-news {
|
.news-box {
|
||||||
width: 100%;
|
@media (min-width: 768px) {
|
||||||
|
margin-top: -40px;
|
||||||
|
}
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
padding: 5px;
|
||||||
|
border-color: @brand-info;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-radius: 5px;
|
||||||
|
width: 100%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.story-headline {
|
.story-headline {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#reply-to-main-post, #upvote {
|
#reply-to-main-post, #upvote {
|
||||||
@@ -954,6 +970,19 @@ iframe.iphone {
|
|||||||
height: 40px;
|
height: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.news-number {
|
||||||
|
font-size: 30px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-story-image {
|
||||||
|
border-radius: 5px;
|
||||||
|
width: 100%;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.alert a {
|
.alert a {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
@@ -980,6 +1009,9 @@ iframe.iphone {
|
|||||||
margin-right: -20px;
|
margin-right: -20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.border-radius-5 {
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
//uncomment this to see the dimensions of all elements outlined in red
|
//uncomment this to see the dimensions of all elements outlined in red
|
||||||
//* {
|
//* {
|
||||||
|
|||||||
@@ -2,162 +2,161 @@ extends ../layout
|
|||||||
block content
|
block content
|
||||||
script.
|
script.
|
||||||
var challengeName = 'Profile View';
|
var challengeName = 'Profile View';
|
||||||
.col-xs-12.col-sm-12.col-md-12
|
.panel.panel-info
|
||||||
.panel.panel-info
|
.panel-heading.text-center
|
||||||
.panel-heading.text-center
|
h1 #{username}'s portfolio
|
||||||
h1 #{username}'s portfolio
|
.panel-body
|
||||||
.panel-body
|
if (user && user.profile.username === username)
|
||||||
if (user && user.profile.username === username)
|
.row.text-center
|
||||||
.row.text-center
|
.col-xs-12.col-sm-10.col-sm-offset-1
|
||||||
.col-xs-12.col-sm-10.col-sm-offset-1
|
a.btn.btn-big.btn-primary.btn-block(href="/account") Update my portfolio page or manage my account
|
||||||
a.btn.btn-big.btn-primary.btn-block(href="/account") Update my portfolio page or manage my account
|
.spacer
|
||||||
.spacer
|
.col-xs-12.col-sm-10.col-sm-offset-1
|
||||||
.col-xs-12.col-sm-10.col-sm-offset-1
|
a.btn.btn-big.btn-success.btn-block(href="/signout") Sign out of Free Code Camp
|
||||||
a.btn.btn-big.btn-success.btn-block(href="/signout") Sign out of Free Code Camp
|
.spacer
|
||||||
.spacer
|
.row
|
||||||
.row
|
.col-xs-12
|
||||||
.col-xs-12
|
.col-xs-12.col-sm-12.col-md-5
|
||||||
.col-xs-12.col-sm-12.col-md-5
|
if picture
|
||||||
if picture
|
img.img-center.img-responsive.public-profile-img(src=picture)
|
||||||
img.img-center.img-responsive.public-profile-img(src=picture)
|
else
|
||||||
else
|
img.img-center.img-responsive.public-profile-img(src='https://s3.amazonaws.com/freecodecamp/camper-image-placeholder.png')
|
||||||
img.img-center.img-responsive.public-profile-img(src='https://s3.amazonaws.com/freecodecamp/camper-image-placeholder.png')
|
h1.text-center.negative-5
|
||||||
h1.text-center.negative-5
|
- if (twitterHandle)
|
||||||
- if (twitterHandle)
|
a.ion-social-twitter.text-primary(title="@#{username}'s Twitter Profile", href="http://twitter.com/#{twitterHandle}", target='_blank')
|
||||||
a.ion-social-twitter.text-primary(title="@#{username}'s Twitter Profile", href="http://twitter.com/#{twitterHandle}", target='_blank')
|
- if (githubProfile)
|
||||||
- if (githubProfile)
|
a.ion-social-github.text-primary(title="@#{username}'s GitHub Profile", href=githubProfile, target='_blank')
|
||||||
a.ion-social-github.text-primary(title="@#{username}'s GitHub Profile", href=githubProfile, target='_blank')
|
- if (linkedinProfile)
|
||||||
- if (linkedinProfile)
|
a.ion-social-linkedin.text-primary(title="@#{username}'s LinkedIn Profile", href=linkedinProfile, target='_blank')
|
||||||
a.ion-social-linkedin.text-primary(title="@#{username}'s LinkedIn Profile", href=linkedinProfile, target='_blank')
|
- if (codepenProfile)
|
||||||
- if (codepenProfile)
|
a.ion-social-codepen.text-primary(title="@#{username}'s CodePen Profile", href=codepenProfile, target='_blank')
|
||||||
a.ion-social-codepen.text-primary(title="@#{username}'s CodePen Profile", href=codepenProfile, target='_blank')
|
.visible-md.visible-lg
|
||||||
.visible-md.visible-lg
|
.col-xs-12.col-sm-12.col-md-4.text-justify
|
||||||
.col-xs-12.col-sm-12.col-md-4.text-justify
|
h1.flat-top.wrappable= name
|
||||||
h1.flat-top.wrappable= name
|
h3.flat-top.bolded.wrappable= location
|
||||||
h3.flat-top.bolded.wrappable= location
|
h4.flat-top.wrappable= bio
|
||||||
h4.flat-top.wrappable= bio
|
.visible-xs.visible-sm
|
||||||
.visible-xs.visible-sm
|
.col-xs-12.col-sm-12.col-md-4.text-center
|
||||||
.col-xs-12.col-sm-12.col-md-4.text-center
|
h1.flat-top.wrappable= name
|
||||||
h1.flat-top.wrappable= name
|
h3.flat-top.bolded.wrappable= location
|
||||||
h3.flat-top.bolded.wrappable= location
|
h4.flat-top.wrappable= bio
|
||||||
h4.flat-top.wrappable= bio
|
.col-xs-12.col-sm-12.col-md-3.text-center
|
||||||
.col-xs-12.col-sm-12.col-md-3.text-center
|
.background-svg.img-center
|
||||||
.background-svg.img-center
|
.points-on-top
|
||||||
.points-on-top
|
= "[ " + (user ? user.progressTimestamps.length : 0) + " ]"
|
||||||
= "[ " + (user ? user.progressTimestamps.length : 0) + " ]"
|
|
||||||
|
|
||||||
|
|
||||||
.row
|
.row
|
||||||
.col-xs-12
|
.col-xs-12
|
||||||
if (website1Title && website1Link && website1Image)
|
if (website1Title && website1Link && website1Image)
|
||||||
.row
|
.row
|
||||||
.col-xs-12.col-md-5
|
.col-xs-12.col-md-5
|
||||||
img.img-center.img-responsive.portfolio-image(src=website1Image, alt="@#{username}'s #{website1Title}")
|
img.img-center.img-responsive.portfolio-image(src=website1Image, alt="@#{username}'s #{website1Title}")
|
||||||
.col-xs-12.col-md-7
|
.col-xs-12.col-md-7
|
||||||
h3.text-center.wrappable.flat-top= website1Title
|
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank')
|
|
||||||
i.fa.icon-beaker
|
|
||||||
| Try it out
|
|
||||||
br
|
|
||||||
if (website1Title && website1Link && !website1Image)
|
|
||||||
.col-xs-12.col-md-12
|
|
||||||
h3.text-center.wrappable.flat-top= website1Title
|
h3.text-center.wrappable.flat-top= website1Title
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank')
|
a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank')
|
||||||
i.fa.icon-beaker
|
i.fa.icon-beaker
|
||||||
| Try it out
|
| Try it out
|
||||||
br
|
br
|
||||||
if (website2Title && website2Link && website2Image)
|
if (website1Title && website1Link && !website1Image)
|
||||||
.row
|
.col-xs-12.col-md-12
|
||||||
.col-xs-12.col-md-5
|
h3.text-center.wrappable.flat-top= website1Title
|
||||||
img.img-responsive.portfolio-image.img-center(src=website2Image, alt="@#{username}'s #{website2Title}")
|
a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank')
|
||||||
.col-xs-12.col-md-7
|
i.fa.icon-beaker
|
||||||
h3.text-center.wrappable.flat-top= website2Title
|
| Try it out
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank')
|
|
||||||
i.fa.icon-beaker
|
|
||||||
| Try it out
|
|
||||||
br
|
br
|
||||||
if (website2Title && website2Link && !website2Image)
|
if (website2Title && website2Link && website2Image)
|
||||||
.col-xs-12.col-md-12
|
.row
|
||||||
|
.col-xs-12.col-md-5
|
||||||
|
img.img-responsive.portfolio-image.img-center(src=website2Image, alt="@#{username}'s #{website2Title}")
|
||||||
|
.col-xs-12.col-md-7
|
||||||
h3.text-center.wrappable.flat-top= website2Title
|
h3.text-center.wrappable.flat-top= website2Title
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank')
|
a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank')
|
||||||
i.fa.icon-beaker
|
i.fa.icon-beaker
|
||||||
| Try it out
|
| Try it out
|
||||||
br
|
br
|
||||||
if (website3Title && website3Link && website3Image)
|
if (website2Title && website2Link && !website2Image)
|
||||||
.row
|
.col-xs-12.col-md-12
|
||||||
.col-xs-12.col-md-5
|
h3.text-center.wrappable.flat-top= website2Title
|
||||||
img.img-responsive.portfolio-image.img-center(src=website3Image, alt="@#{username}'s #{website1Title}")
|
a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank')
|
||||||
.col-xs-12.col-md-7
|
i.fa.icon-beaker
|
||||||
h3.text-center.wrappable.flat-top= website3Title
|
| Try it out
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank')
|
br
|
||||||
i.fa.icon-beaker
|
if (website3Title && website3Link && website3Image)
|
||||||
| Try it out
|
.row
|
||||||
if (website3Title && website3Link && !website3Image)
|
.col-xs-12.col-md-5
|
||||||
.col-xs-12.col-md-12
|
img.img-responsive.portfolio-image.img-center(src=website3Image, alt="@#{username}'s #{website1Title}")
|
||||||
|
.col-xs-12.col-md-7
|
||||||
h3.text-center.wrappable.flat-top= website3Title
|
h3.text-center.wrappable.flat-top= website3Title
|
||||||
a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank')
|
a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank')
|
||||||
i.fa.icon-beaker
|
i.fa.icon-beaker
|
||||||
| Try it out
|
| Try it out
|
||||||
|
if (website3Title && website3Link && !website3Image)
|
||||||
|
.col-xs-12.col-md-12
|
||||||
|
h3.text-center.wrappable.flat-top= website3Title
|
||||||
|
a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank')
|
||||||
|
i.fa.icon-beaker
|
||||||
|
| Try it out
|
||||||
|
|
||||||
.hidden-xs.col-sm-12
|
.hidden-xs.col-sm-12
|
||||||
script(src="//d3js.org/d3.v3.min.js")
|
script(src="//d3js.org/d3.v3.min.js")
|
||||||
script(src="//cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.min.js")
|
script(src="//cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.min.js")
|
||||||
#cal-heatmap.img-center
|
#cal-heatmap.img-center
|
||||||
script.
|
script.
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
var cal = new CalHeatMap();
|
var cal = new CalHeatMap();
|
||||||
var calendar = !{JSON.stringify(calender)};
|
var calendar = !{JSON.stringify(calender)};
|
||||||
cal.init({
|
cal.init({
|
||||||
itemSelector: "#cal-heatmap",
|
itemSelector: "#cal-heatmap",
|
||||||
domain: "month",
|
domain: "month",
|
||||||
subDomain: "day",
|
subDomain: "day",
|
||||||
data: calendar,
|
data: calendar,
|
||||||
cellSize: 15,
|
cellSize: 15,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cellRadius: 3,
|
cellRadius: 3,
|
||||||
cellPadding: 2,
|
cellPadding: 2,
|
||||||
tooltip: true,
|
tooltip: true,
|
||||||
range: 4,
|
range: 4,
|
||||||
start: new Date().setDate(new Date().getDate() - 90),
|
start: new Date().setDate(new Date().getDate() - 90),
|
||||||
legendColors: ["#cccccc", "#215f1e"],
|
legendColors: ["#cccccc", "#215f1e"],
|
||||||
legend: [1, 2, 3]
|
legend: [1, 2, 3]
|
||||||
});
|
});
|
||||||
}, 300);
|
}, 300);
|
||||||
});
|
});
|
||||||
.row
|
.row
|
||||||
.hidden-xs.col-sm-12.text-center
|
.hidden-xs.col-sm-12.text-center
|
||||||
.row.text-primary
|
.row.text-primary
|
||||||
h4.col-sm-6.text-right Longest Streak: #{longestStreak}
|
h4.col-sm-6.text-right Longest Streak: #{longestStreak}
|
||||||
h4.col-sm-6.text-left Current Streak: #{currentStreak}
|
h4.col-sm-6.text-left Current Streak: #{currentStreak}
|
||||||
|
|
||||||
- if (challenges.length > 0)
|
- if (challenges.length > 0)
|
||||||
.col-sm-12
|
.col-sm-12
|
||||||
table.table.table-striped
|
table.table.table-striped
|
||||||
thead
|
thead
|
||||||
tr
|
tr
|
||||||
th.col-xs-4 Challenge
|
th.col-xs-4 Challenge
|
||||||
th.col-xs-2 Completed
|
th.col-xs-2 Completed
|
||||||
th.col-xs-6 Link
|
th.col-xs-6 Link
|
||||||
for challenge in challenges
|
for challenge in challenges
|
||||||
tr
|
tr
|
||||||
td.col-xs-4= challenge.name
|
td.col-xs-4= challenge.name
|
||||||
td.col-xs-2= moment(challenge.completedDate, 'x').format("MMM DD, YYYY")
|
td.col-xs-2= moment(challenge.completedDate, 'x').format("MMM DD, YYYY")
|
||||||
td.col-xs-6
|
td.col-xs-6
|
||||||
a(href=challenge.solution) View my solution
|
a(href=challenge.solution) View my solution
|
||||||
|
|
||||||
br
|
br
|
||||||
- if (bonfires.length > 0)
|
- if (bonfires.length > 0)
|
||||||
.col-sm-12
|
.col-sm-12
|
||||||
table.table.table-striped
|
table.table.table-striped
|
||||||
thead
|
thead
|
||||||
tr
|
tr
|
||||||
th.col-xs-4 Bonfire
|
th.col-xs-4 Bonfire
|
||||||
th.col-xs-2 Completed
|
th.col-xs-2 Completed
|
||||||
th.col-xs-6 Solution
|
th.col-xs-6 Solution
|
||||||
for bonfire in bonfires
|
for bonfire in bonfires
|
||||||
tr
|
tr
|
||||||
td.col-xs-4= bonfire.name
|
td.col-xs-4= bonfire.name
|
||||||
td.col-xs-2= moment(bonfire.completedDate, 'x').format("MMM DD, YYYY")
|
td.col-xs-2= moment(bonfire.completedDate, 'x').format("MMM DD, YYYY")
|
||||||
td.col-xs-6= bonfire.solution
|
td.col-xs-6= bonfire.solution
|
||||||
br
|
br
|
||||||
|
|||||||
@@ -1,116 +1,114 @@
|
|||||||
extends ../layout
|
extends ../layout
|
||||||
block content
|
block content
|
||||||
.col-xs-12.col-sm-12.col-md-12
|
.panel.panel-info
|
||||||
.panel.panel-info
|
.panel-heading.text-center
|
||||||
.panel-heading.text-center
|
h1 Challenge Map
|
||||||
h1 Challenge Map
|
.panel-body
|
||||||
.panel-body
|
if (Math.random() > 0.99)
|
||||||
.col-xs-12
|
img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner-dino.png')
|
||||||
if (Math.random() > 0.99)
|
else
|
||||||
img.img-responsive.img-center(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner-dino.png')
|
img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png')
|
||||||
else
|
.col-xs-12.col-md-8.col-md-offset-2
|
||||||
img.img-responsive.img-center(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png')
|
h2.text-center
|
||||||
.col-xs-12.col-md-8.col-md-offset-2
|
span.text-primary #{camperCount}  
|
||||||
h2.text-center
|
| campers have joined our community
|
||||||
span.text-primary #{camperCount}  
|
br
|
||||||
| campers have joined our community
|
| since we launched  
|
||||||
br
|
span.text-primary #{daysRunning}  
|
||||||
| since we launched  
|
| days ago.
|
||||||
span.text-primary #{daysRunning}  
|
h2
|
||||||
| days ago.
|
span.fa.fa-flag
|
||||||
h2
|
| Waypoints (200 hours of lessons)
|
||||||
span.fa.fa-flag
|
|
||||||
| Waypoints (200 hours of lessons)
|
|
||||||
|
|
||||||
.col-xs-12
|
.col-xs-12.no-right-padding
|
||||||
h3.negative-15
|
h3.negative-15
|
||||||
ol
|
ol
|
||||||
for waypoint in waypoints
|
for waypoint in waypoints
|
||||||
if completedCoursewareList.indexOf(waypoint._id) > -1
|
if completedCoursewareList.indexOf(waypoint._id) > -1
|
||||||
.row
|
.row
|
||||||
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
li.faded
|
li.faded
|
||||||
a(href="/challenges/#{waypoint.name}")= waypoint.name
|
a(href="/challenges/#{waypoint.name}")= waypoint.name
|
||||||
|
|
||||||
else
|
else
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2
|
|
||||||
span
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li
|
|
||||||
a(href="/challenges/#{waypoint.name}")= waypoint.name
|
|
||||||
h2
|
|
||||||
span.ion-bonfire
|
|
||||||
| Bonfires (200 hours of JavaScript algorithm practice)
|
|
||||||
.col-xs-12
|
|
||||||
h3.negative-15
|
|
||||||
ol
|
|
||||||
for bonfire in bonfires
|
|
||||||
if completedBonfireList.indexOf(bonfire._id) > -1
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li.faded
|
|
||||||
a(href="/bonfires/#{bonfire.name}")= bonfire.name
|
|
||||||
else
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2
|
|
||||||
span
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li
|
|
||||||
a(href="/bonfires/#{bonfire.name}")= bonfire.name
|
|
||||||
h2
|
|
||||||
span.fa.fa-angle-double-right
|
|
||||||
| Ziplines (200 hours of front end development)
|
|
||||||
.col-xs-12
|
|
||||||
h3.negative-15
|
|
||||||
ol
|
|
||||||
for zipline in ziplines
|
|
||||||
if completedCoursewareList.indexOf(zipline._id) > -1
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li.faded
|
|
||||||
a(href="/challenges/#{zipline.name}")= zipline.name
|
|
||||||
else
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2
|
|
||||||
span
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li
|
|
||||||
a(href="/challenges/#{zipline.name}")= zipline.name
|
|
||||||
h2
|
|
||||||
span.fa.fa-level-down
|
|
||||||
| Basejumps (200 hours of full stack development)
|
|
||||||
.col-xs-12
|
|
||||||
h3.negative-15
|
|
||||||
ol
|
|
||||||
for basejump in basejumps
|
|
||||||
if completedCoursewareList.indexOf(basejump._id) > -1
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li.faded
|
|
||||||
a(href="/challenges/#{basejump.name}")= basejump.name
|
|
||||||
else
|
|
||||||
.row
|
|
||||||
.hidden-xs.col-sm-3.col-md-2
|
|
||||||
span
|
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
|
||||||
li
|
|
||||||
a(href="/challenges/#{basejump.name}")= basejump.name
|
|
||||||
h2
|
|
||||||
span.ion-ios-heart Nonprofit Projects (800 hours of real-world experience)*
|
|
||||||
h3.negative-15
|
|
||||||
ul
|
|
||||||
.row
|
.row
|
||||||
.hidden-xs.col-sm-3.col-md-2
|
.hidden-xs.col-sm-3.col-md-2
|
||||||
span
|
span
|
||||||
.col-xs-12.col-sm-9.col-md-10
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
li
|
li
|
||||||
a(href="/nonprofits/directory") Browse our nonprofit projects
|
a(href="/challenges/#{waypoint.name}")= waypoint.name
|
||||||
p * Complete all Waypoints, Bonfires, Ziplines and Basejumps to be assigned your first nonprofit project
|
h2
|
||||||
|
span.ion-bonfire
|
||||||
|
| Bonfires (200 hours of JavaScript algorithm practice)
|
||||||
|
.col-xs-12
|
||||||
|
h3.negative-15
|
||||||
|
ol
|
||||||
|
for bonfire in bonfires
|
||||||
|
if completedBonfireList.indexOf(bonfire._id) > -1
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li.faded
|
||||||
|
a(href="/bonfires/#{bonfire.name}")= bonfire.name
|
||||||
|
else
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2
|
||||||
|
span
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li
|
||||||
|
a(href="/bonfires/#{bonfire.name}")= bonfire.name
|
||||||
|
h2
|
||||||
|
span.fa.fa-angle-double-right
|
||||||
|
| Ziplines (200 hours of front end development)
|
||||||
|
.col-xs-12
|
||||||
|
h3.negative-15
|
||||||
|
ol
|
||||||
|
for zipline in ziplines
|
||||||
|
if completedCoursewareList.indexOf(zipline._id) > -1
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li.faded
|
||||||
|
a(href="/challenges/#{zipline.name}")= zipline.name
|
||||||
|
else
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2
|
||||||
|
span
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li
|
||||||
|
a(href="/challenges/#{zipline.name}")= zipline.name
|
||||||
|
h2
|
||||||
|
span.fa.fa-level-down
|
||||||
|
| Basejumps (200 hours of full stack development)
|
||||||
|
.col-xs-12
|
||||||
|
h3.negative-15
|
||||||
|
ol
|
||||||
|
for basejump in basejumps
|
||||||
|
if completedCoursewareList.indexOf(basejump._id) > -1
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li.faded
|
||||||
|
a(href="/challenges/#{basejump.name}")= basejump.name
|
||||||
|
else
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2
|
||||||
|
span
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li
|
||||||
|
a(href="/challenges/#{basejump.name}")= basejump.name
|
||||||
|
h2
|
||||||
|
span.ion-ios-heart Nonprofit Projects (800 hours of real-world experience)*
|
||||||
|
h3.negative-15
|
||||||
|
ul
|
||||||
|
.row
|
||||||
|
.hidden-xs.col-sm-3.col-md-2
|
||||||
|
span
|
||||||
|
.col-xs-12.col-sm-9.col-md-10
|
||||||
|
li
|
||||||
|
a(href="/nonprofits/directory") Browse our nonprofit projects
|
||||||
|
p * Complete all Waypoints, Bonfires, Ziplines and Basejumps to be assigned your first nonprofit project
|
||||||
|
|
||||||
//#announcementModal.modal(tabindex='-1')
|
//#announcementModal.modal(tabindex='-1')
|
||||||
// .modal-dialog
|
// .modal-dialog
|
||||||
|
|||||||
@@ -2,40 +2,37 @@ extends ../layout
|
|||||||
block content
|
block content
|
||||||
script.
|
script.
|
||||||
var challengeName = 'Field Guide View';
|
var challengeName = 'Field Guide View';
|
||||||
.col-xs-12.col-sm-12.col-md-12
|
.panel.panel-info.no-padding
|
||||||
.panel.panel-info
|
.panel-heading.text-center
|
||||||
.panel-heading.text-center
|
h1= title
|
||||||
h1= title
|
.panel-body
|
||||||
.panel-body
|
div!= description
|
||||||
.row
|
|
||||||
.col-xs-12
|
|
||||||
div!= description
|
|
||||||
.spacer
|
|
||||||
.spacer
|
|
||||||
.spacer
|
|
||||||
.col-xs-12.col-sm-6.col-sm-offset-3
|
|
||||||
.text-center
|
|
||||||
if user
|
|
||||||
.next-field-guide-button.btn.btn-primary.btn-big.btn-block Next article (ctrl + enter)
|
|
||||||
.ten-pixel-break
|
|
||||||
#showAllButton.btn.btn-info.btn-big.btn-block Show me all articles
|
|
||||||
if !user
|
|
||||||
.ten-pixel-break
|
|
||||||
a.btn.btn-big.signup-btn.btn-block(href="/login") Start learning to code (it's free)
|
|
||||||
.spacer
|
.spacer
|
||||||
#show-all-dialog.modal(tabindex='-1')
|
.spacer
|
||||||
.modal-dialog.animated.fadeInUp.fast-animation
|
.spacer
|
||||||
.modal-content
|
.col-xs-12.col-sm-6.col-sm-offset-3
|
||||||
.modal-header.all-list-header Field Guide Articles
|
.text-center
|
||||||
a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') ×
|
if user
|
||||||
.modal-body
|
.next-field-guide-button.btn.btn-primary.btn-big.btn-block Next article (ctrl + enter)
|
||||||
include ../partials/field-guide
|
.ten-pixel-break
|
||||||
#fieldGuideId.hidden= fieldGuideId
|
#showAllButton.btn.btn-info.btn-big.btn-block Show me all articles
|
||||||
script.
|
if !user
|
||||||
$(document).ready(function() {
|
.ten-pixel-break
|
||||||
$('body').keydown(function(e) {
|
a.btn.btn-big.signup-btn.btn-block(href="/login") Start learning to code (it's free)
|
||||||
if (e.ctrlKey && e.keyCode == 13) {
|
.spacer
|
||||||
$('.next-field-guide-button').click();
|
#show-all-dialog.modal(tabindex='-1')
|
||||||
}
|
.modal-dialog.animated.fadeInUp.fast-animation
|
||||||
});
|
.modal-content
|
||||||
|
.modal-header.all-list-header Field Guide Articles
|
||||||
|
a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') ×
|
||||||
|
.modal-body
|
||||||
|
include ../partials/field-guide
|
||||||
|
#fieldGuideId.hidden= fieldGuideId
|
||||||
|
script.
|
||||||
|
$(document).ready(function() {
|
||||||
|
$('body').keydown(function(e) {
|
||||||
|
if (e.ctrlKey && e.keyCode == 13) {
|
||||||
|
$('.next-field-guide-button').click();
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
});
|
||||||
|
|||||||
@@ -2,77 +2,76 @@ extends ../layout
|
|||||||
block content
|
block content
|
||||||
script.
|
script.
|
||||||
var challengeName = 'Nonprofits View';
|
var challengeName = 'Nonprofits View';
|
||||||
.col-xs-12.col-sm-12.col-md-12
|
.panel.panel-info
|
||||||
.panel.panel-info
|
.panel-heading.text-center= title
|
||||||
.panel-heading.text-center= title
|
.panel-body
|
||||||
.panel-body
|
.row
|
||||||
.row
|
.col-xs-12.col-sm-10.col-sm-offset-1
|
||||||
.col-xs-12.col-sm-10.col-sm-offset-1
|
.row
|
||||||
.row
|
.col-xs-12
|
||||||
|
img.img-center.img-responsive(src=imageUrl)
|
||||||
|
.spacer
|
||||||
|
.row
|
||||||
|
.col-xs-12.col-sm-4
|
||||||
|
img.img-responsive(src=logoUrl)
|
||||||
|
.col-xs-12.col-sm-8
|
||||||
.col-xs-12
|
.col-xs-12
|
||||||
img.img-center.img-responsive(src=imageUrl)
|
h4= whatDoesNonprofitDo
|
||||||
.spacer
|
h4
|
||||||
.row
|
a(href=websiteLink)= websiteLink
|
||||||
.col-xs-12.col-sm-4
|
.spacer
|
||||||
img.img-responsive(src=logoUrl)
|
h3 Project Description:
|
||||||
.col-xs-12.col-sm-8
|
.col-xs-12
|
||||||
.col-xs-12
|
h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper)
|
||||||
h4= whatDoesNonprofitDo
|
.spacer
|
||||||
h4
|
h3 This project involves building:
|
||||||
a(href=websiteLink)= websiteLink
|
h4.negative-15.col-xs-12
|
||||||
.spacer
|
if (approvedWebsite)
|
||||||
h3 Project Description:
|
.ion-android-globe Website
|
||||||
.col-xs-12
|
if (approvedDonor)
|
||||||
h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper)
|
.ion-card Donor Management System
|
||||||
.spacer
|
if (approvedInventory)
|
||||||
h3 This project involves building:
|
.ion-ios-box Inventory Management System
|
||||||
h4.negative-15.col-xs-12
|
if (approvedVolunteer)
|
||||||
if (approvedWebsite)
|
.ion-android-calendar Volunteer Management System
|
||||||
.ion-android-globe Website
|
if (approvedForm)
|
||||||
if (approvedDonor)
|
.ion-ios-list Webform
|
||||||
.ion-card Donor Management System
|
if (approvedCommunity)
|
||||||
if (approvedInventory)
|
.ion-ios-people Community Management System
|
||||||
.ion-ios-box Inventory Management System
|
if (approvedELearning)
|
||||||
if (approvedVolunteer)
|
.ion-university E-learning Platform
|
||||||
.ion-android-calendar Volunteer Management System
|
if (approvedOther)
|
||||||
if (approvedForm)
|
.ion-settings Other tools
|
||||||
.ion-ios-list Webform
|
h3 Project Status: #{currentStatus}
|
||||||
if (approvedCommunity)
|
if (interestedCampers && interestedCampers.length > 0)
|
||||||
.ion-ios-people Community Management System
|
h3 Interested campers:
|
||||||
if (approvedELearning)
|
.col-xs-12.text-left
|
||||||
.ion-university E-learning Platform
|
for interestedCamper in interestedCampers
|
||||||
if (approvedOther)
|
a(href='/' + interestedCamper.username class="interested-camper-image")
|
||||||
.ion-settings Other tools
|
img.profile-picture.float-right(src=interestedCamper.picture)
|
||||||
h3 Project Status: #{currentStatus}
|
if (assignedCampers && assignedCampers.length > 0)
|
||||||
if (interestedCampers && interestedCampers.length > 0)
|
h3 Assigned campers:
|
||||||
h3 Interested campers:
|
.col-xs-12.text-left
|
||||||
.col-xs-12.text-left
|
for assignedCamper in assignedCampers
|
||||||
for interestedCamper in interestedCampers
|
a(href='/' + assignedCamper.username class="interested-camper-image")
|
||||||
a(href='/' + interestedCamper.username class="interested-camper-image")
|
img.profile-picture.float-right(src=assignedCamper.picture)
|
||||||
img.profile-picture.float-right(src=interestedCamper.picture)
|
|
||||||
if (assignedCampers && assignedCampers.length > 0)
|
|
||||||
h3 Assigned campers:
|
|
||||||
.col-xs-12.text-left
|
|
||||||
for assignedCamper in assignedCampers
|
|
||||||
a(href='/' + assignedCamper.username class="interested-camper-image")
|
|
||||||
img.profile-picture.float-right(src=assignedCamper.picture)
|
|
||||||
.spacer
|
|
||||||
if (!buttonActive)
|
|
||||||
.col-xs-12.col-sm-8.col-sm-offset-2
|
|
||||||
.text-center
|
|
||||||
a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project *
|
|
||||||
p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this.
|
|
||||||
#showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects
|
|
||||||
if (buttonActive)
|
|
||||||
.col-xs-12.col-sm-8.col-sm-offset-2
|
|
||||||
.text-center
|
|
||||||
a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project
|
|
||||||
#showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects
|
|
||||||
.row
|
|
||||||
.col-xs-12.text-center
|
|
||||||
if !user
|
|
||||||
a.btn.btn-cta.signup-btn.btn-primary(href="/login") Start learning to code (it's free)
|
|
||||||
.spacer
|
.spacer
|
||||||
|
if (!buttonActive)
|
||||||
|
.col-xs-12.col-sm-8.col-sm-offset-2
|
||||||
|
.text-center
|
||||||
|
a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project *
|
||||||
|
p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this.
|
||||||
|
#showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects
|
||||||
|
if (buttonActive)
|
||||||
|
.col-xs-12.col-sm-8.col-sm-offset-2
|
||||||
|
.text-center
|
||||||
|
a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project
|
||||||
|
#showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects
|
||||||
|
.row
|
||||||
|
.col-xs-12.text-center
|
||||||
|
if !user
|
||||||
|
a.btn.btn-cta.signup-btn.btn-primary(href="/login") Start learning to code (it's free)
|
||||||
|
.spacer
|
||||||
#show-all-dialog.modal(tabindex='-1')
|
#show-all-dialog.modal(tabindex='-1')
|
||||||
.modal-dialog.animated.fadeInUp.fast-animation
|
.modal-dialog.animated.fadeInUp.fast-animation
|
||||||
.modal-content
|
.modal-content
|
||||||
|
|||||||
@@ -1,55 +1,70 @@
|
|||||||
.spacer
|
.spacer
|
||||||
.col-xs-12
|
.spacer
|
||||||
#story-list.story-list
|
#story-list.story-list
|
||||||
|
|
||||||
script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js")
|
script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js")
|
||||||
script.
|
script.
|
||||||
|
|
||||||
var getLinkedName = function getLinkedName(name) {
|
var getLinkedName = function getLinkedName(name) {
|
||||||
return name.trim().toLowerCase().replace(/\s/g, '-');
|
return name.trim().toLowerCase().replace(/\s/g, '-');
|
||||||
}
|
}
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: '/stories/hotStories',
|
url: '/stories/hotStories',
|
||||||
type: 'GET'
|
type: 'GET'
|
||||||
})
|
})
|
||||||
.success(
|
.success(
|
||||||
function(data) {
|
function(data) {
|
||||||
for (var i = 0; i < data.length; i++) {
|
for (var i = 0; i < data.length; i++) {
|
||||||
var div = document.createElement('div');
|
var div = document.createElement('div');
|
||||||
var linkedName = getLinkedName(data[i].storyLink);
|
var linkedName = getLinkedName(data[i].storyLink);
|
||||||
var rank = data[i].rank;
|
var rank = data[i].rank;
|
||||||
|
|
||||||
$(div)
|
$(div)
|
||||||
.html(
|
.html(
|
||||||
"<div class='col-xs-12 text-left'>" +
|
"<div class='row'>" +
|
||||||
"<h2 class='col-xs-1 col-sm-1 positive-5'>" +
|
"<div class='hidden-xs col-sm-2 col-md-1 positive-5 news-number'>" +
|
||||||
(i + 1) +
|
(i + 1) +
|
||||||
"</h2>" +
|
"</div>" +
|
||||||
"<div class='col-xs-2 col-sm-1'>" +
|
"<div class='visible-xs col-sm-2 col-md-1'>" +
|
||||||
"<a href='/" + data[i].author.username + "'>" +
|
"<a href='" + data[i].link + "'>" +
|
||||||
"<img src='" + data[i].author.picture + "' class='img-news'/>" +
|
"<img class='mobile-story-image img-responsive' src='" + (!!data[i].image ? data[i].image : data[i].author.picture) + "'/>" +
|
||||||
"</a>" +
|
"</a>" +
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"<div class='col-xs-9 col-sm-10'>" +
|
"<div class='hidden-xs col-sm-2 col-md-1'>" +
|
||||||
"<div class='row'>" +
|
"<a href='/" + data[i].author.username + "'>" +
|
||||||
"<div class='story-headline col-xs-12'>" +
|
"<img class='img-responsive ' src='" + data[i].author.picture + "'/>" +
|
||||||
"<a href='" + data[i].link + "' target='_blank'>" +
|
"</a>" +
|
||||||
data[i].headline +
|
"</div>" +
|
||||||
"</a>" +
|
"<div class='col-xs-12 col-sm-8 col-md-10'>" +
|
||||||
|
"<div class='row'>" +
|
||||||
|
"<div class='story-headline col-xs-12 wrappable'>" +
|
||||||
|
"<a href='" + data[i].link + "' target='_blank'>" +
|
||||||
|
data[i].headline +
|
||||||
|
"</a>" +
|
||||||
|
"</div>" +
|
||||||
|
"<div class='hidden-xs'>" +
|
||||||
|
"<span>" +
|
||||||
|
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' href='/stories/" + linkedName + "'>discuss</a> · " +
|
||||||
|
rank + (rank > 1 ? " points" : " point") + " · posted " +
|
||||||
|
moment(data[i].timePosted).fromNow() +
|
||||||
|
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
|
||||||
|
"</span>" +
|
||||||
|
"</div>" +
|
||||||
|
"<div class='visible-xs'>" +
|
||||||
|
"<div class='col-xs-12 text-center'>" +
|
||||||
|
rank + (rank > 1 ? " points" : " point") + " · posted " +
|
||||||
|
moment(data[i].timePosted).fromNow() +
|
||||||
|
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"<div class='col-xs-12'>" +
|
"<div class='col-xs-12'>" +
|
||||||
"<span>" +
|
"<br><a class='btn btn-no-shadow btn-primary btn-block btn-primary-ghost' href='/stories/" + linkedName + "'>discuss</a>" +
|
||||||
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' href='/stories/" + linkedName + "'>discuss</a> · " +
|
|
||||||
rank + (rank > 1 ? " points" : " point") + " · posted " +
|
|
||||||
moment(data[i].timePosted).fromNow() +
|
|
||||||
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
|
|
||||||
"</span>" +
|
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"</div>"
|
"</div>" +
|
||||||
);
|
"</div>"
|
||||||
$(div).addClass('story-list')
|
);
|
||||||
$(div).appendTo($('#story-list'));
|
$(div).addClass('story-list news-box')
|
||||||
}
|
$(div).appendTo($('#story-list'));
|
||||||
});
|
}
|
||||||
|
});
|
||||||
|
|||||||
@@ -19,8 +19,6 @@ block content
|
|||||||
.spacer
|
.spacer
|
||||||
if (page === 'hot')
|
if (page === 'hot')
|
||||||
include ./hot-stories
|
include ./hot-stories
|
||||||
if (page === 'recent')
|
|
||||||
include ./new-stories
|
|
||||||
if (page === 'submit')
|
if (page === 'submit')
|
||||||
if (user)
|
if (user)
|
||||||
include ./preliminary-submit
|
include ./preliminary-submit
|
||||||
@@ -29,8 +27,6 @@ block content
|
|||||||
.text-center
|
.text-center
|
||||||
a.btn.btn-cta.signup-btn.btn-primary(href="/login") Sign in to post your story (it's free)
|
a.btn.btn-cta.signup-btn.btn-primary(href="/login") Sign in to post your story (it's free)
|
||||||
.spacer
|
.spacer
|
||||||
if (page === 'search')
|
|
||||||
include ./search-stories
|
|
||||||
if (page === 'storySubmission')
|
if (page === 'storySubmission')
|
||||||
include ./submit-story
|
include ./submit-story
|
||||||
if (page === 'show')
|
if (page === 'show')
|
||||||
|
|||||||
@@ -1,43 +1,63 @@
|
|||||||
.col-xs-12
|
a.btn.btn-primary.btn-big.btn-block(href='/stories/submit' class="#{ page === 'hot' ? '' : 'hidden' }") Submit a link
|
||||||
|
a.btn.btn-success.btn-big.btn-block(href='/stories/hot' class="#{ (page === 'show' || page === 'submit' || page === 'storySubmission') ? '' : 'hidden' }") Show all Links
|
||||||
a.btn.btn-primary.btn-big.btn-block(href='/stories/submit' class="#{ page === 'hot' ? '' : 'hidden' }") Submit a Code-related Link
|
|
||||||
a.btn.btn-success.btn-big.btn-block(href='/stories/hot' class="#{ (page === 'show' || page === 'submit' || page === 'storySubmission') ? '' : 'hidden' }") Show all Links
|
|
||||||
//.visible-xs.visible-sm
|
|
||||||
// .btn-group.input-group.btn-group-justified(data-toggle='buttons')
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'hot' ? 'active' : '' }")
|
|
||||||
// input#option1(href='/stories/hot', type='radio', name='options')
|
|
||||||
// i.ion-ios-pulse-strong
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'recent' ? 'active' : '' }")
|
|
||||||
// input#option2(href='/stories/recent', type='radio', name='options')
|
|
||||||
// i.ion-ios-clock
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'submit' ? 'active' : page === 'storySubmission' ? 'active' : '' }")
|
|
||||||
// input#option3(href='/stories/submit', type='radio', name='options')
|
|
||||||
// i.ion-plus-circled
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'search' ? 'active' : '' }")
|
|
||||||
// input#option4(href='/stories/search', type='radio', name='options')
|
|
||||||
// i.ion-search
|
|
||||||
//.visible-md.visible-lg
|
|
||||||
// .btn-group.input-group.btn-group-justified(data-toggle='buttons')
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'hot' ? 'active' : '' }")
|
|
||||||
// input#option1(href='/stories/hot', type='radio', name='options')
|
|
||||||
// i.ion-ios-pulse-strong  
|
|
||||||
// | Hot
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'recent' ? 'active' : '' }")
|
|
||||||
// input#option2(href='/stories/recent', type='radio', name='options')
|
|
||||||
// i.ion-ios-clock  
|
|
||||||
// | New
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'submit' ? 'active' : page === 'storySubmission' ? 'active' : '' }")
|
|
||||||
// input#option3(href='/stories/submit', type='radio', name='options')
|
|
||||||
// i.ion-plus-circled  
|
|
||||||
// | Submit
|
|
||||||
// label.btn.btn-primary.btn-big(class="#{ page === 'search' ? 'active' : '' }")
|
|
||||||
// input#option4(href='/stories/search', type='radio', name='options')
|
|
||||||
// i.ion-search  
|
|
||||||
// | Search
|
|
||||||
|
|
||||||
script.
|
|
||||||
$('label').on('click', function() {
|
|
||||||
window.location = ($(this).children('input').attr('href'));
|
|
||||||
});
|
|
||||||
|
|
||||||
.spacer
|
.spacer
|
||||||
|
.input-group(class="#{ page === 'hot' ? '' : 'hidden' }")
|
||||||
|
input#searchArea.big-text-field.field-responsive.form-control(type='text', placeholder='Search our links', autofocus)
|
||||||
|
span.input-group-btn
|
||||||
|
button#searchbutton.btn.btn-big.btn-primary.btn-responsive(type='button') Search
|
||||||
|
.spacer
|
||||||
|
#search-results
|
||||||
|
.spacer
|
||||||
|
#story-list
|
||||||
|
ul#stories
|
||||||
|
script.
|
||||||
|
$('#searchArea').keypress(function (event) {
|
||||||
|
if (event.keyCode === 13 || event.which === 13) {
|
||||||
|
executeSearch();
|
||||||
|
$('#searchArea').focus();
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$('#searchbutton').on('click', function () {
|
||||||
|
executeSearch();
|
||||||
|
});
|
||||||
|
function executeSearch() {
|
||||||
|
$('#stories').empty();
|
||||||
|
var searchTerm = $('#searchArea').val();
|
||||||
|
var getLinkedName = function getLinkedName(name) {
|
||||||
|
return name.toLowerCase().replace(/\s/g, '-');
|
||||||
|
}
|
||||||
|
$.post('/stories/search',
|
||||||
|
{
|
||||||
|
data: {
|
||||||
|
searchValue: searchTerm
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.fail(function (xhr, textStatus, errorThrown) {
|
||||||
|
})
|
||||||
|
.done(function (data, textStatus, xhr) {
|
||||||
|
for (var i = 0; i < data.length; i++) {
|
||||||
|
var div = document.createElement('div');
|
||||||
|
var linkedName = getLinkedName(data[i].storyLink);
|
||||||
|
var rank = data[i].rank;
|
||||||
|
$(div).html(
|
||||||
|
"<div class='row text-left'>" +
|
||||||
|
"<div class='col-xs-4 col-sm-2 col-md-1'>" +
|
||||||
|
"<a href='" + data[i].link + "' target='_blank'>" +
|
||||||
|
"<img src='" + data[i].author.picture + "' class='img-responsive mobile-story-image'/>" +
|
||||||
|
"</div>" +
|
||||||
|
"<div class='col-xs-8 col-sm-10 col-md-11 text-center'>" +
|
||||||
|
"<div class='story-headline'>" +
|
||||||
|
"<a href='/stories/" + linkedName + "'>"
|
||||||
|
+ data[i].storyLink +
|
||||||
|
"</a><br>" +
|
||||||
|
"</div>" +
|
||||||
|
"Posted " +
|
||||||
|
moment(data[i].timePosted).fromNow() +
|
||||||
|
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
|
||||||
|
"</div>" +
|
||||||
|
"</div>")
|
||||||
|
$(div).appendTo($('#search-results'));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,73 +0,0 @@
|
|||||||
.col-xs-12
|
|
||||||
.spacer
|
|
||||||
h1.text-center Search
|
|
||||||
.input-group
|
|
||||||
input#searchArea.big-text-field.field-responsive.form-control(type='text', placeholder='Search our links', autofocus)
|
|
||||||
span.input-group-btn
|
|
||||||
button#searchbutton.btn.btn-big.btn-primary.btn-responsive(type='button') Search
|
|
||||||
.spacer
|
|
||||||
|
|
||||||
#story-list
|
|
||||||
ul#stories
|
|
||||||
script.
|
|
||||||
$('#searchArea').keypress(function(event) {
|
|
||||||
if (event.keyCode === 13 || event.which === 13) {
|
|
||||||
executeSearch();
|
|
||||||
$('#searchArea').focus();
|
|
||||||
event.preventDefault();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
$('#searchbutton').on('click', function() {
|
|
||||||
executeSearch();
|
|
||||||
});
|
|
||||||
function executeSearch() {
|
|
||||||
$('#stories').empty();
|
|
||||||
var searchTerm = $('#searchArea').val();
|
|
||||||
var getLinkedName = function getLinkedName(name) {
|
|
||||||
return name.toLowerCase().replace(/\s/g, '-');
|
|
||||||
}
|
|
||||||
$.post('/stories/search',
|
|
||||||
{
|
|
||||||
data: {
|
|
||||||
searchValue: searchTerm
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.fail(function (xhr, textStatus, errorThrown) {
|
|
||||||
})
|
|
||||||
.done(function (data, textStatus, xhr) {
|
|
||||||
for (var i = 0; i < data.length; i++) {
|
|
||||||
var li = document.createElement('li');
|
|
||||||
var linkedName = getLinkedName(data[i].storyLink);
|
|
||||||
var rank = data[i].rank;
|
|
||||||
|
|
||||||
$(li).html(
|
|
||||||
"<div class='row text-left'>" +
|
|
||||||
"<div class='col-xs-3 col-sm-1'>" +
|
|
||||||
"<div class='story-up-votes'>" +
|
|
||||||
"<span>" + rank + "</span>" +
|
|
||||||
"</div>" +
|
|
||||||
"</div>" +
|
|
||||||
"<div class='col-xs-2 col-sm-1'>" +
|
|
||||||
"<img src='" + data[i].author.picture + "' class='img-responsive'/>" +
|
|
||||||
"</div>" +
|
|
||||||
"<div class='col-xs-7 col-sm-10'>" +
|
|
||||||
"<div class='row'>" +
|
|
||||||
"<div class='col-xs-12'>" +
|
|
||||||
"<a href='/stories/" + linkedName + "'>"
|
|
||||||
+ data[i].storyLink +
|
|
||||||
"</a>" +
|
|
||||||
"</div>" +
|
|
||||||
"<div class='col-xs-12'>" +
|
|
||||||
"<span>Posted " +
|
|
||||||
moment(data[i].timePosted).fromNow() +
|
|
||||||
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
|
|
||||||
"</div>" +
|
|
||||||
"</div>" +
|
|
||||||
"</div>" +
|
|
||||||
"</div>" +
|
|
||||||
"</li>");
|
|
||||||
$(li).appendTo($('#stories'));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|||||||
Reference in New Issue
Block a user