dasmoth / dalliance

Interactive web-based genome browser.
http://www.biodalliance.org/
BSD 2-Clause "Simplified" License
226 stars 68 forks source link

Dalliance on react #242

Closed kevinyao93 closed 5 years ago

kevinyao93 commented 5 years ago

I've been trying to get a working genome browser within my react project. I tried installing the npm of the biodalliance, but it hasn't been updated in a very long time and it seems to not work properly in my environment. I'm currently using pileup, but I just wanted to see if there was a method to use biodalliance in my project. I've tried a number of work-arounds, but nothing seems to work properly.

Any help would be much appreciated, whether it's a way to install Biodalliance in my environment properly, or a way to include the biodalliance package in a react environment. I've tried searching for a solution but nothing seems to work properly..

dasmoth commented 5 years ago

The current package on NPM was uploaded by someone else. I do now have the permissions needed to update it, and hope to do so once I get a chance to cut a new release. For now, my recommendation would be to install from Git.

React integration is definitely doable. You'll need the normal little bit of boilerplate to wrap direct-DOM-manipulating code as a React component. Roughly:

       class DallianceBrowser extends React.Component {
              render() {
                    return (
                            <div>Browser goes here...</div>
                    );
              }

              componentDidMount() {
                    this.dalliance = new Browser({
                         injectionPoint: ReactDOM.findDOMNode(this)
                         // Lots more options...
                         ...this.props
                    });
              }

              componentWillUnmount() {
                    this.dalliance.destroy();
              }
        }
kevinyao93 commented 5 years ago

Sorry for the late reply, I've been trying to test a number of things myself. How would I go about installing from git? One of the issues I have is that with the existing framework, I'm unable to access the HTML reliably. I'm not sure how to word it better, but please let me know if there's anything I can clarify.

dasmoth commented 5 years ago

For development purposes, npm link should do the trick. Or you can build a package with npm run compile && npm pack.

I'm afraid I'm not sure what you mean by "unable to access the HTML reliably".