gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Get the expand all / collapse all view working on the map

Browse Source
This commit is contained in:
Quincy Larson
2016-01-16 01:03:22 -08:00
parent 4a767c0016
commit cb972cacc8
3 changed files with 35 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/less/main.less
View File

@ -967,6 +967,10 @@ hr {
opacity: 0.5; opacity: 0.5;
} }
.slightly-faded {
opacity: 0.75;
}
.padded-ionic-icon { .padded-ionic-icon {
padding-top: 5px; padding-top: 5px;
} }

19
client/main.js
View File

@ -277,4 +277,23 @@ $(document).ready(function() {
$('.map-aside-action-collapse').on('click', () => { $('.map-aside-action-collapse').on('click', () => {
$('.map-aside').addClass('is-collapsed'); $('.map-aside').addClass('is-collapsed');
}); });
$('.collapse').on('show.bs.collapse', function(){
console.log(this);
$(this).siblings().find(".fa-caret-right").removeClass("fa-caret-right").addClass("fa-caret-down");
}).on('hide.bs.collapse', function(){
$(this).siblings().find(".fa-caret-down").removeClass("fa-caret-down").addClass("fa-caret-right");
});
$('#showAll').on('click', () => {
var mapExpanded = $('#showAll').hasClass('active');
if (!mapExpanded) {
$('.map-collapse').addClass('in');
$('#showAll').text('Collapse all challenges');
return $('#showAll').addClass('active');
};
$('.map-collapse').removeClass('in');
$('#showAll').text('Expand all challenges');
return $('#showAll').removeClass('active');
});
}); });

19
server/views/map/show.jade
View File

@ -6,7 +6,8 @@ block content
.row .row
.col-xs-10.col-xs-offset-1.col-sm-6.col-sm-offset-3.col-md-4.col-md-offset-4 .col-xs-10.col-xs-offset-1.col-sm-6.col-sm-offset-3.col-md-4.col-md-offset-4
a.btn.btn-primary.btn-block(href='/map' target='_blank') View this map in full screen a.btn.btn-primary.btn-block(href='/map' target='_blank') View this map in full screen
// .btn.btn-primary.btn-block#showAll Expand .btn.btn-primary.btn-block#showAll Expand all challenges
hr hr
#accordion #accordion
for superBlock, index in superBlocks for superBlock, index in superBlocks
@ -15,23 +16,25 @@ block content
|   |  
a.collapsed(data-toggle='collapse', data-parent='#accordion', href='#collapse'+superBlock.name.split(' ').join('-')) a.collapsed(data-toggle='collapse', data-parent='#accordion', href='#collapse'+superBlock.name.split(' ').join('-'))
| #{superBlock.name} | #{superBlock.name}
div.margin-left-10(id = 'collapse'+superBlock.name.split(' ').join('-') class = "panel-collapse collapse no-transition") div.margin-left-10(id = 'collapse'+superBlock.name.split(' ').join('-') class = "collapse map-collapse no-transition")
#nested.panel-group #nested
for challengeBlock in superBlock.blocks for challengeBlock in superBlock.blocks
h3 h3
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse'+challengeBlock.name.replace(/(\W)/gi, '').split(' ').join('-'))
i.fa.fa-caret-right i.fa.fa-caret-right
|   |  
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse'+challengeBlock.name.replace(/(\W)/gi, '').split(' ').join('-')) |  
| #{challengeBlock.name} (#{challengeBlock.time}) | #{challengeBlock.name} (#{challengeBlock.time})
div.margin-left-10(id = "nested-collapse"+challengeBlock.name.replace(/\W/gi, '').split(' ').join('-') class = "panel-collapse collapse no-transition") div.margin-left-10(id = "nested-collapse"+challengeBlock.name.replace(/\W/gi, '').split(' ').join('-') class = "collapse map-collapse no-transition")
.button-spacer
for challenge in challengeBlock.challenges for challenge in challengeBlock.challenges
if challenge.completed if challenge.completed
p.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")     p.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a.faded(href="/challenges/#{challenge.dashedName}" target='_parent') a(href="/challenges/#{challenge.dashedName}" target='_parent')
= challenge.title = challenge.title
span.sr-only= " Complete" span.sr-only= " Complete"
else if challenge.isRequired else if challenge.isRequired
p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")     p.slightly-faded.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '') a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
span= challenge.title span= challenge.title
span.sr-only= " Incomplete" span.sr-only= " Incomplete"
@ -46,7 +49,7 @@ block content
span.text-primary     span.text-primary    
strong * strong *
else else
p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")     p.slightly-faded.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '') a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
span= challenge.title span= challenge.title
span.sr-only= " Incomplete" span.sr-only= " Incomplete"