if($body.hasClass('homepage')) { var advancePanelLink = ' '; // first unwrap the index sections so that they're on the same level as the pre-footer and footer $('#intro-1-section').unwrap().unwrap().find('.index-section-wrapper'); $body.append(advancePanelLink); setTimeout(function() { $body.addClass('videoComplete'); }, 15000); $('.advance-panel').on('click', function() { $.fn.fullpage.moveSectionDown(); return false; }); $('#preFooter').remove(); $('.fixedBackToTop').on('click', function() { $.fn.fullpage.moveTo(1); return false; }); // $('.index-section:not(#icons-1-section)').remove(); // $('.index-section').remove(); $('#header').remove(); var $homepage = $('body.homepage'); $homepage.append('
'); $homepage.append('
'); $homepage.append('
'); $homepage.append('
'); $homepage.append('
'); var $homeSiteWrapper = $('body.homepage #siteWrapper'); var $homePanels = $homeSiteWrapper.children(); var $panelTextBlocks = $('.index-section .sqs-block-html'); var $panelConentInners = $('.index-section .content-inner'); $homePanels.addClass('section'); //////////////////////////////////////// // section > create panel image //////////////////////////////////////// var $panelWrappers = $('.index-section-wrapper'); var panelImageHtml = ''; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
Train Leaving
at 9:02PM
'; panelImageHtml += '
Pick up groceries
'; panelImageHtml += '
Alert:
Major Delays Ahead.
Call an uber?
'; panelImageHtml += "
"; panelImageHtml += "
"; panelImageHtml += "
"; panelImageHtml += "
<\/div>"; panelImageHtml += " <\/div>"; panelImageHtml += " <\/div>"; panelImageHtml += " <\/div>"; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; panelImageHtml += '
'; $panelWrappers.append(panelImageHtml); $body.append('
'+panelImageHtml+'
'); var $fixedPanelImage = $body.children('.fixedPanelImage').find('.panelImage'); $homePanels.each(function() { var $this = $(this); var $thisImage = $this.find('.panelImage'); var thisEq = $this.index(); switch(thisEq) { case 1: $thisImage.attr('data-style', 'intro'); $this.addClass('bgStyle--dark bgStyle--black'); break; case 2: $thisImage.attr('data-style', 'time'); $this.addClass('bgStyle--dark bgStyle--lightBlue'); $this.attr('data-group', 'group1'); break; case 3: $thisImage.attr('data-style', 'time-fill'); $this.addClass('bgStyle--dark bgStyle--lightBlue'); $this.attr('data-group', 'group1'); break; case 4: $thisImage.attr('data-style', 'time-details'); $this.addClass('bgStyle--dark bgStyle--lightBlue'); $this.attr('data-group', 'group1'); break; case 5: $thisImage.attr('data-style', 'sidekick'); $this.addClass('bgStyle--dark bgStyle--lighterBlue'); break; case 6: $thisImage.attr('data-style', 'end'); $this.addClass('bgStyle--light'); break; default: $thisImage.hide(); } }); var fixedForegroundImageClass = 'fixedForeground'; var fullpageSliderSpeed = 700; if($html.hasClass('touch')) { fullpageSliderSpeed = 300; } $homeSiteWrapper.fullpage( { autoScrolling: true, fitToSection: true, setRecordHistory: false, bigSectionsDestination: 'top', // touchSensitivity: 10, scrollingSpeed: fullpageSliderSpeed, onLeave: function(index, nextIndex, direction){ $body.attr('data-slide-direction', direction); var $currentPanel = $homePanels.eq(index - 1); var $nextPanel = $homePanels.eq(nextIndex - 1); if(($currentPanel.data('group') === $nextPanel.data('group')) && $currentPanel.data('group')) { var thisStyle = $currentPanel.find('.panelImage').data('style'); $fixedPanelImage.attr('data-style', thisStyle); $body.addClass(fixedForegroundImageClass); setTimeout(function() { $body.removeClass(fixedForegroundImageClass); }, fullpageSliderSpeed); } // fixed header if(nextIndex > 1) { $body.addClass(primeFixedHeaderClassFirst); } else { $body.removeClass(primeFixedHeaderClassFirst); } if(nextIndex > 2) { $body.addClass(primeFixedHeaderClassSecond); } else { $body.removeClass(primeFixedHeaderClassSecond); } // add class to make fixed back to top link appear/disappear if(nextIndex > 2) { $body.addClass(scrollupClass); } else { $body.removeClass(scrollupClass); } } }); var $panelLine = $('.panelLine'); var windowHeight; var panelLine_panelStart = 2; var panelLine_panelStartPercent = 0.45; var panelLine_panelEnd = 6; var panelLine_panelEndPercent = 0.76; var panelsNum = $homePanels.length; //////////////////////////////////////// // section > functions for window resizing //////////////////////////////////////// var updateLinePosition = debounce(function() { //////////////////////////////////////// // todo: section > get the lines starting/stopping in the right place //////////////////////////////////////// windowHeight = $window.height(); $panelLine.css('top', (panelLine_panelStart - 1)*windowHeight + windowHeight*panelLine_panelStartPercent + 'px'); $panelLine.css('bottom', (panelsNum - panelLine_panelEnd)*windowHeight - windowHeight*panelLine_panelEndPercent + 'px'); //////////////////////////////////////// // section > make all the text blocks the same height //////////////////////////////////////// // $('.index-section .sqs-block-html').each //////////////////////////////////////// // section > all text should be centered within top 50% of a given panel // and take out some space to make way for the centered //////////////////////////////////////// $panelConentInners.css('padding-bottom', windowHeight/2 + 70 + 'px'); }, 250); updateLinePosition(); window.addEventListener('resize', updateLinePosition); // if you want... // scrollOverflow: true // } // end if($body.hasClass('homepage'))