DanRader / capitolciderhouse

Repo for the new capitolciderhouse.com
0 stars 0 forks source link

Figure out Infinite scroll #2

Open DanRader opened 6 years ago

DanRader commented 6 years ago

welp I found this http://endless.horse/

DanRader commented 6 years ago

` feed.watchScroll = function() { var scrollTop = $(window).scrollTop(); /------------------------------------------------------ Check for Top/Bottom of Page and Load New Section ------------------------------------------------------/ if (!feed.isLoadingSection) { var topReloadPoint = feed.el.firstSection.height(); var bottomReloadPoint = feed.el.feed.outerHeight() - $(window).height() - feed.el.lastSection.height(); // Add section to TOP of current feed if (scrollTop <= topReloadPoint) { $newSection = feed.newSection(feed.currentName); feed.el.sections.prepend($newSection); feed.appendCount ++; feed.loadImages(); feed.el.lastSection.remove(); feed.el.lastSection = feed.el.sections.find("section:last"); feed.el.firstSection = feed.el.sections.find("section:first"); page.newScroll = scrollTop + feed.el.firstSection.height(); // Set page.prevScroll to the new scroll so our "page.stopScrolling" check doesn't get conffeed.used. page.prevScroll = page.newScroll; // Set the scroll. $(window).scrollTop(page.newScroll); } // Add section to BOTTOM of current feed if (scrollTop >= bottomReloadPoint) { $newSection = feed.newSection(feed.currentName); feed.el.firstSection.remove(); feed.el.sections.append($newSection); feed.appendCount ++; feed.loadImages(); feed.el.lastSection = feed.el.sections.find("section:last"); feed.el.firstSection = feed.el.sections.find("section:first"); page.newScroll = scrollTop - feed.el.firstSection.height(); // Set page.prevScroll to the new scroll so our "page.stopScrolling" check doesn't get conffeed.used. page.prevScroll = page.newScroll; // Set the scroll. $(window).scrollTop(page.newScroll); } } };

    // Setup
  feed.setup = function() {
    if($(window).width() > bp.s) {
      var offCenter = 140;
    } else {
      var offCenter = 80;
    }
    // Set initial scroll position to middle.
    var $theSections = feed.el.sections.find("section"),
      initialOffset = 0;
    initialOffset = $theSections.eq(Math.floor($theSections.length / 2)).offset().top - offCenter;
    page.prevScroll = initialOffset;
    $(window).scrollTop(initialOffset);
    page.goingDown = false;
  };`
DanRader commented 6 years ago

Fuzzco JS

https://www.dropbox.com/s/d7cstwvsyjp7krg/fuzzco.js?dl=0

DanRader commented 6 years ago

$(function() { ripe.utility.init(); // Calls everything }); var $w = $(window); $w.resize(function(e) { ripe.utility.onWindowResize(e); }); $w.scroll(function() { ripe.utility.throttle(ripe.utility.onWindowScroll(), 1200); }); /*

FUNCTION DECLARATIONS

============================================================================= / var ripe = (function() { / "Global" variable declarations / var isAnimating = false, // If a user clicks a nav item, this is set to true. Changes how ripe.userInput.navCatch functions. lastScrollTop = 0, lastScrollY = 0, ticking = false; //cache elements to reduce DOM pooling and improve performance var $pageHeader = $('#pageHeader'); // menu and branding (generally fixed) var $mobileHandle = $('#pageHeader .handle'); // hamburger icon link!! / Utility

    Various utility functions which are called on page load or
    on user interaction. Mostly behind the scenes tweaks to
    provide a more seamless experience for users with JS enabled.
*/
var utility = (function() {
    var init = function() { // Various tweaks to call on page load.
        var debug = false;
        /*
        =============================================================================
            FUNCTION CALLS
        =============================================================================
        */
        //ripe.homeVideo.init();
        ripe.visibility.constructContentList(); // Build object of content sections
        eventListeners(); // hook functions to events
        //CAPTCHA add the checkbox for humans
        $('#dynamic-field').append('<input id="nospam" type="checkbox" name="nospam" value="human"><label for="nospam" id="nospam-label" class="input-helper input-helper--checkbox">I am not a robot<em class="bad hidden">&larr; Aren\'t you a human?</em> <em class="good hidden">&larr; Glad you\'re one of us</em></label>');
        // Display the landing frame once the page loads
        $pageHeader.delay(700).animate({
            "opacity": "1"
        }, 700);
        $("#intro-wrapper").delay(700).animate({
            "opacity": "1"
        }, 700);

        if (Modernizr.touch) {
            homeVideo.unLoad();
        }

    };
    var eventListeners = function() { // These are all the app's event listeners in once place
        /*
        =============================================================================
            BACK BUTTON & URL
        =============================================================================
        */
        window.onhashchange = function() {
            //console.log('hash changed');
        };
        window.onpopstate = function(event) { // when the browser's active history channges
            ripe.nav.backButton(event);
        };
        /*
        =============================================================================
            NAVIGATION LINKS
        =============================================================================
        */
        $('#mainNav a').click(function(e) {
            ripe.userInput.navHandleClick(); // on mobile devices this hides the menu on click
            e.preventDefault(); // stop the linking!!
            // if this is the homepage, we need to hide video first
            // if this is the homepage, we need to hide video first
            if (nav.navState().currentNav.id === 'intro') {
                homeVideo.invisible();
                $that = $(this);
                setTimeout(function(e) {
                    nav.smoothScroll($that, 'href')
                }, 500);
            } else {
                nav.smoothScroll($(this), 'href'); // smooth scroll to the link target
            }
            _gaq.push(['_trackEvent', 'Menu Click', $(this).text()]); //add google analytics tracking
        });
        $mobileHandle.click(function() {
            userInput.navHandleClick();
        });
        $('#topanchor').click(function(e) {
            e.preventDefault(); // stop the linking!!
            nav.smoothScroll($(this), 'href'); // smooth scroll to the link target
            //requestTick();
        });
        $('#rfp-link').click(function(e) {
            e.preventDefault(); // stop the linking!!
            nav.smoothScroll($(this), 'href'); // smooth scroll to the link target
            //requestTick();
        });
        $('#start-link').click(function(e) {
            e.preventDefault(); // stop the linking!!
            // if this is the homepage, we need to hide video first
            if (nav.navState().currentNav.id === 'intro') {
                homeVideo.invisible();
                $that = $(this);
                setTimeout(function(e) {
                    nav.smoothScroll($that, 'href')
                }, 500);
            } else {
                nav.smoothScroll($(this), 'href'); // smooth scroll to the link target
            }
            _gaq.push(['_trackEvent', 'Start Link', 'Link Clicked']); //add google analytics tracking
        });
        /*
        =============================================================================
            HOMEPAGE VIDEO
        =============================================================================
        */
        $("#video_background video").bind("ended", function() {
            homeVideo.playNextVideo();
        });
        $('#play_pause').click(function(e) {
            e.preventDefault(); // stop the linking!!
            homeVideo.togglePlay();
        });
        $(document).keydown(function(e) {
            if (e.keyCode == 32) {
                if (nav.navState().currentNav.id === 'intro') {
                    e.preventDefault();
                    ripe.homeVideo.togglePlay();
                }
            }
        });
        /*
        =============================================================================
            CAREERS
        =============================================================================
        */
        $('#careers .link-list a').click(function() {
            ripe.userInput.careerClick($(this));
        });
        /*
        =============================================================================
            SELECTED BRANDS
        =============================================================================
        */
        $('.brand--container').mousedown(function() {
            ripe.selectedBrands.pulseDown($(this));
        });
        $('.brand--container').mouseup(function() {
            ripe.selectedBrands.pulseUp($(this));
        });
        $('.brand--container').bind("touchstart", function(e) {
            ripe.selectedBrands.pulseDown($(this));
        });
        $('.brand--container').bind("touchend", function(e) {
            ripe.selectedBrands.pulseUp($(this));
        });
        $('.brand--container').click(function() {
            ripe.selectedBrands.brandClick($(this));
        });
        $(document).on('click', '#slider-close', function() {
            ripe.selectedBrands.brandClose($('.open').attr('id'));
        });
        $(document).on('mouseenter', '#prev-next', function() {
            $('#slider').cycle('pause');
        });
        $(document).on('mouseleave', '#prev-next', function() {
            $('#slider').cycle('resume');
        });
        $(document).on('click', '#slider-playpause', function() {
            ripe.selectedBrands.sliderPlayPause($(this));
        });
        $('.brand--container').on('mouseenter.hoverdir, mouseleave.hoverdir', function(event) {
            ripe.selectedBrands.hoverHandle(event, $(this));
        });
        /*
        =============================================================================
            CONTACT FORM
        =============================================================================
        */
        /*$('.serviceName').on('click', function() {
            ripe.form_actions.toggleServiceVisibility($(this));
        });*/

        $('#submit').click(function() {
           // ripe.form_actions.requestNextQuestion($(this));
           //alert('test');
           //console.log('submit clicked');
           ripe.form_actions.sendMessage();
           _gaq.push(['_trackEvent', 'Form Submit', 'Clicked Submit']); //add google analytics tracking for submit click
        });
        // call form validation for required fields
        //  add in function hooks for the form submit function in the form_actions function
        $("#nospam").change(function() {
            // THIS SHOULD BE MOVED INTO THE FORM MODULE
             if ($('#nospam').prop('checked')) {

                $("label[for='nospam'] > em.good").removeClass('hidden');
                $("label[for='nospam'] > em.good").addClass('slideInUp');
                $("label[for='nospam'] > em.bad").addClass('hidden');
               // counter++;
            } else {
                $("label[for='nospam'] > em.good").addClass('hidden');
                $("label[for='nospam'] > em.bad").removeClass('hidden');
                $("label[for='nospam'] > em.bad").addClass('slideInUp');
            }
            ripe.form_actions.validatefField($(this));
        });
        $("#nospam").focus(function() {
            ripe.form_actions.clearStatus($(this));

        });
       $(".js-liveVal").focus(function() {
            ripe.form_actions.uiClearValidation($(this).parent('.fieldgroup'));
        });
       /*
        $(".js-liveVal").blur(function() {
            ripe.form_actions.validateField($(this));
        });*/
        $('#js-services input[type=checkbox]').change(function(){
            if ($('#js-services input[type=checkbox]:checked').length > 0) {
                $('#js-serviceLabel').removeClass('bad');
                $('#js-serviceLabel').removeClass('tooltip');
                $('#js-serviceLabel').removeClass('tooltip--always');
                $('#js-serviceLabel').removeClass('tooltip--right');
                $('#js-serviceLabel').removeClass('tooltip--error');
            }
        });
    }; // end eventListeners
    function debounce(func, wait, immediate) {
        var timeout;
        return function() {
            var context = this,
                args = arguments;
            clearTimeout(timeout);
            timeout = setTimeout(function() {
                timeout = null;
                if (!immediate) func.apply(context, args);
            }, wait);
            if (immediate && !timeout) func.apply(context, args);
        };
    };
    var onKeyPress = function(e) {};
    var onWindowResize = function() { // the beginning of a function to maintain the scroll position when a user resizes the window
        if (Modernizr.touch) {
            return false;
        }
        var throttle = function(func, rate) {
            var counter = 0;
            return function() {
                var context = this;
                var args = arguments;
                counter++;
                if (counter === rate) {
                    func.apply(context, args);
                    counter = 0;
                }
            }
        }
        throttle($('#' + nav.navState().currentNav.id).velocity("scroll", {
            duration: 1,
            easing: "easeInOutQuart"
        }), 700);
    };
    var onSmartResize = function...