src/virtual-scrolling-tree/VirtualScrollingTree.js
function prepareView() {
    _(this).el = document.createElement('div');
    _(this).el.setAttribute('class', 'VirtualScrollingTree');

    let contentDiv = `<div class="VirtualScrollingTree-content"></div>`;

    _(this).el.innerHTML = `
        ${_(this).smoothScrolling? '' : contentDiv}
        <div class="VirtualScrollingTree-scrollbar ${_(this).scrollbarClass}">
            ${_(this).smoothScrolling? contentDiv : ''}
            <div class="VirtualScrollingTree-scrollbarContent"></div>
        </div>
    `.replace(/\n\s+/g, '');

    _(this).view = {
        content: _(this).el.querySelector('.VirtualScrollingTree-content'),
        scrollbar:  _(this).el.querySelector('.VirtualScrollingTree-scrollbar'),
        scrollbarContent: _(this).el.querySelector('.VirtualScrollingTree-scrollbarContent')
    };

    if (!_(this).smoothScrolling) {
        _(this).view.content.addEventListener('wheel', e => {
            _(this).view.scrollbar.scrollTop += e.deltaY;
        }, true);
    } 

    // Scrolling either the content with the middle mouse wheel, or manually
    // scrolling the scrollbar directly should accomplish the same thing.
    // Note it's important for this to come after the transform above.
    // If it's not, when the DOM is being manipulated the scrollbar will jump.
    let lastScrollTop = 0;
    _(this).view.scrollbar.addEventListener('scroll', (e) => {
        if (_(this).scrollLocked) {
            return;
        }

        let newScrollTop = parseInt(_(this).view.scrollbar.scrollTop / _(this).itemHeight);

        if (lastScrollTop !== newScrollTop) {
            lastScrollTop = newScrollTop;
            if (_(this).smoothScrolling) {
                _(this).view.content.style.transform = `translateY(${newScrollTop * _(this).itemHeight}px)`;
            }

            requestData.call(this);
        }
    }, true);

    _(this).parent.appendChild(_(this).el);
}
function prepareView() {
    _(this).el = document.createElement('div');
    _(this).el.setAttribute('class', 'VirtualScrollingTree');

    let contentDiv = `<div class="VirtualScrollingTree-content"></div>`;

    _(this).el.innerHTML = `
        ${_(this).smoothScrolling? '' : contentDiv}
        <div class="VirtualScrollingTree-scrollbar ${_(this).scrollbarClass}">
            ${_(this).smoothScrolling? contentDiv : ''}
            <div class="VirtualScrollingTree-scrollbarContent"></div>
        </div>
    `.replace(/\n\s+/g, '');

    _(this).view = {
        content: _(this).el.querySelector('.VirtualScrollingTree-content'),
        scrollbar:  _(this).el.querySelector('.VirtualScrollingTree-scrollbar'),
        scrollbarContent: _(this).el.querySelector('.VirtualScrollingTree-scrollbarContent')
    };

    if (!_(this).smoothScrolling) {
        _(this).view.content.addEventListener('wheel', e => {
            _(this).view.scrollbar.scrollTop += e.deltaY;
        }, true);
    } 

    // Scrolling either the content with the middle mouse wheel, or manually
    // scrolling the scrollbar directly should accomplish the same thing.
    // Note it's important for this to come after the transform above.
    // If it's not, when the DOM is being manipulated the scrollbar will jump.
    let lastScrollTop = 0;
    _(this).view.scrollbar.addEventListener('scroll', (e) => {
        if (_(this).scrollLocked) {
            return;
        }

        let newScrollTop = parseInt(_(this).view.scrollbar.scrollTop / _(this).itemHeight);

        if (lastScrollTop !== newScrollTop) {
            lastScrollTop = newScrollTop;
            if (_(this).smoothScrolling) {
                _(this).view.content.style.transform = `translateY(${newScrollTop * _(this).itemHeight}px)`;
            }

            requestData.call(this);
        }
    }, true);

    _(this).parent.appendChild(_(this).el);
}
function prepareView ( ) { _ ( this ) . el = document . createElement ( 'div' ) ; _ ( this ) . el . setAttribute ( 'class' , 'VirtualScrollingTree' ) ; let contentDiv = ` ` ; _ ( this ) . el . innerHTML = ` ${ _ ( this ) . smoothScrolling ? '' : contentDiv } ${ _ ( this ) . scrollbarClass } ${ _ ( this ) . smoothScrolling ? contentDiv : '' } ` . replace ( / \n\s+ / g , '' ) ; _ ( this ) . view = { content : _ ( this ) . el . querySelector ( '.VirtualScrollingTree-content' ) , scrollbar : _ ( this ) . el . querySelector ( '.VirtualScrollingTree-scrollbar' ) , scrollbarContent : _ ( this ) . el . querySelector ( '.VirtualScrollingTree-scrollbarContent' ) } ; if ( ! _ ( this ) . smoothScrolling ) { _ ( this ) . view . content . addEventListener ( 'wheel' , e => { _ ( this ) . view . scrollbar . scrollTop += e . deltaY ; } , true ) ; } // Scrolling either the content with the middle mouse wheel, or manually // scrolling the scrollbar directly should accomplish the same thing. // Note it's important for this to come after the transform above. // If it's not, when the DOM is being manipulated the scrollbar will jump. let lastScrollTop = 0 ; _ ( this ) . view . scrollbar . addEventListener ( 'scroll' , ( e ) => { if ( _ ( this ) . scrollLocked ) { return ; } let newScrollTop = parseInt ( _ ( this ) . view . scrollbar . scrollTop / _ ( this ) . itemHeight ) ; if ( lastScrollTop !== newScrollTop ) { lastScrollTop = newScrollTop ; if ( _ ( this ) . smoothScrolling ) { _ ( this ) . view . content . style . transform = ` ${ newScrollTop * _ ( this ) . itemHeight } ` ; } requestData . call ( this ) ; } } , true ) ; _ ( this ) . parent . appendChild ( _ ( this ) . el ) ; }
Creates a shortcut view object which we can use to access
our DOM elements. Also sets up event handlers for the content.

@method prepareView
@private
Creates a shortcut view object which we can use to access our DOM elements . Also sets up event handlers for the content .