npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jbrowse-site-specific-help

v1.0.0

Published

A plugin to add a site-specific help menu item

Downloads

4

Readme

jbrowse-site-specific-help

A JBrowse 2 plugin to make a site specific help widget

Install

For use in JBrowse Web

No installation required; this plugin can be installed from the JBrowse plugin store though the documentation is written with a "WormBase slant"; that is, while non-WormBase users may find the documentation useful, all of the examples pertain to WormBase. This plugin does serve as a useful example of creating plugins that modify menu items.

Production

Add to the "plugins" of your JBrowse Web config:

{
  "plugins": [
    {
      "name": "JBrowseSiteSpecificHelp",
      "url": "https://wormbase.org/tools/genome/jbrowse2/plugins/JBrowseSiteSpecificHelp/jbrowse-site-specific-help.umd.development.js"
    }
  ]
}

Development

This plugin is relatively straightforward and serves as a good example of how to add items to menus. You can find the repo at https://github.com/scottcain/jbrowse-site-specific-help.

While this plugin is WormBase specific, generalizing it to your own site should not be difficult. Basically, find references to WormBase in the code and change them. I think these items are limited to:

  • Change the menu label in src/index.ts from WormBase Help to something else.
  • Edit src/WBHelpWidget/components/WBHelpWidget.tsx to change the label from JBrowse 2 @ WormBase to something else, and change the links and labels to what you want.
  • If you want to run the cypress tests, you'll also have to update the contents of the tests.

After running yarn and yarn build place jbrowse-site-specific-help.umd.development.js and jbrowse-site-specific-help.umd.development.js.map in a web-accessible place and modify the plugin json code above to point at it.

Testing

This plugin also has the infrastructure to run cypress tests. To run these test, first you have to have the test server running:

  yarn start
  yarn browse

which will start the test instance of JBrowse on http://localhost:8999/. Then you can run either yarn cypress:run to run the tests in a headless state, or run yarn cypress:open to open the cypress app and run the tests interactively.