Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FEAT] connect to React #145

Open
c0ncentus opened this issue Aug 10, 2020 · 0 comments
Open

[FEAT] connect to React #145

c0ncentus opened this issue Aug 10, 2020 · 0 comments

Comments

@c0ncentus
Copy link

c0ncentus commented Aug 10, 2020

hi,

Please make React basic usage work.

PS: now, few things can make react work i think. No selector, no jquery ... just replace selectors by DOM element and maybe controls button need to be review ...

  componentWillMount() {
    const node = findDOMNode(this);
    if (node instanceof HTMLElement) {
      const child = node.querySelector('.filter-container')! as HTMLElement;
      const options :RawOptions = {
        animationDuration: 0.5,
        callbacks: {
          onInit: function () { },
          onFilteringStart: function () { },
          onFilteringEnd: function () { },
          onShufflingStart: function () { },
          onShufflingEnd: function () { },
          onSortingStart: function () { },
          onSortingEnd: function () { }
        },

        controlsSelector: '.fltr-controls',
        delay: 0,
        delayMode: 'progressive',
        easing: 'ease-out',
        filter: 'all',
        filterOutCss: {
          opacity: 0,
          transform: 'scale(0.5)'
        },
        filterInCss: {
          opacity: 0,
          transform: 'scale(1)'
        },
        gridItemsSelector: '.filtr-item',
        gutterPixels: 0,
        layout: 'sameSize',
        multifilterLogicalOperator: 'or',
        // searchTerm: '',
        setupControls: true,
        spinner: {
          enabled: false,
          fillColor: '#2184D0',
          styles: {
            height: '75px',
            margin: '0 auto',
            width: '75px',
            'z-index': 2,
          },
        },
      };
      const filterizr = new Filterizr(child, options);
    }

  }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant