131 lines
3.0 KiB
JavaScript
131 lines
3.0 KiB
JavaScript
openPerson = false
|
|
|
|
$(() => {
|
|
$('a.openlink').click(function(e) {
|
|
e.preventDefault();
|
|
})
|
|
|
|
$('div.banner').click(function() {
|
|
if (!openPerson) {
|
|
// If no profile is open, open one...
|
|
openPerson = $(this).attr('data-person')
|
|
|
|
if (window.matchMedia('(orientation: portrait)').matches) {
|
|
// If we're opening in portrait mode...
|
|
$('.main.not' + openPerson).css({
|
|
height: '50vh',
|
|
minHeight: 0
|
|
})
|
|
|
|
$('.main.not' + openPerson).animate({
|
|
height: 0
|
|
}, {
|
|
duration: 300,
|
|
queue: false
|
|
})
|
|
|
|
$('#main-' + openPerson).animate({
|
|
minHeight: '100vh'
|
|
}, {
|
|
duration: 300,
|
|
queue: true,
|
|
complete: () => {
|
|
$('.main.not' + openPerson).css('width', 0)
|
|
$('#splash-' + openPerson).css({
|
|
width: '50vw',
|
|
height: '100vh'
|
|
})
|
|
}
|
|
})
|
|
|
|
} else {
|
|
// If we're opening in landscape mode...
|
|
$('#splash-' + openPerson).css('height', '100vh')
|
|
|
|
$('.main.not' + openPerson).animate({
|
|
width: 0
|
|
}, {
|
|
duration: 300,
|
|
queue: false
|
|
})
|
|
|
|
$('#splash-' + openPerson).animate({
|
|
width: '50vw'
|
|
}, {
|
|
duration: 300,
|
|
queue: true,
|
|
complete: () => {
|
|
$('.main.not' + openPerson).css({
|
|
height: 0,
|
|
minHeight: 0
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
// Display the links
|
|
setTimeout(() => {
|
|
$('#links-' + openPerson).animate({
|
|
height: $('#links-' + openPerson).get(0).scrollHeight
|
|
}, {
|
|
duration: 300,
|
|
queue: true
|
|
})
|
|
}, 300)
|
|
} else {
|
|
// If a profile is open, close it.
|
|
$('#links-' + openPerson).animate({
|
|
height: 0
|
|
}, {
|
|
duration: 300,
|
|
queue: true
|
|
})
|
|
|
|
if (window.matchMedia('(orientation: portrait)').matches) {
|
|
// If we're closing in portrait mode...
|
|
$('.main.not' + openPerson).css('width', '100vw')
|
|
|
|
$('#main-' + openPerson).animate({
|
|
minHeight: '50vh'
|
|
}, {
|
|
duration: 300,
|
|
queue: false
|
|
})
|
|
|
|
$('.main.not' + openPerson).animate({
|
|
height: '50vh'
|
|
}, {
|
|
duration: 300,
|
|
queue: false,
|
|
complete: () => {
|
|
$('.main, .splash').removeAttr('style')
|
|
openPerson = false
|
|
}
|
|
})
|
|
|
|
} else {
|
|
// If we're closing in landscape mode...
|
|
$('.main.not' + openPerson).css('height', '100vh')
|
|
|
|
$('#splash-' + openPerson).animate({
|
|
width: 0
|
|
}, {
|
|
duration: 300,
|
|
queue: false
|
|
})
|
|
|
|
$('.main.not' + openPerson).animate({
|
|
width: '50vw'
|
|
}, {
|
|
duration: 300,
|
|
queue: false,
|
|
complete: () => {
|
|
$('.main, .splash').removeAttr('style')
|
|
openPerson = false
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
})
|