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

earthquake-list-widget

v0.1.2

Published

A javascript package for displaying recent earthquake information on a webpage.

Downloads

8

Readme

earthquake-list-widget

A javascript package for displaying recent earthquake information on a webpage.

Getting Started

To embed an earthquake list widget on your webpage, download and build the distributable code from this respository. Once you have built the dist/earthquake-list-widget.js and dist/earthquake-list-widget.css files, place them on your web server at an HTTP addressable URL. These files should be placed next to each other (in the same directory) on the web server.

Next, add a container element to your HTML page where you would like to embed the widget.

...
<div id="list-widget-container"></div>
...

Now include the earthquake-list-widget.js script on your page. Be sure you correctly reference the path to where you placed the script on your server.

...
<script src="path-to-js/earthquake-list-widget.js"></script>
...

Finally, write a tiny bit of Javascript in order to put the widget into your page:

<script>
var EqList = require('listwidget/EqList');
EqList({
  container: document.querySelector('#list-widget-container'),
  feed: EqList.SIG_URL_MONTH
});
</script>

The examples directory contains additional usage examples.

Custom Lists

A list can be customized in several ways.

First, you can provide a different URL for the feed parameter to the constructor. Any URL specified must return data in the USGS GeoJSONP feed format.

If a predefined feed does not provide the exact sub-set of earthquake data, it is recommended one use the smallest feed that is a superset of the desired earthquakes, then provide a custom includeEvent method as an optional parameter to the constructor.

Sort order is also customizable by providing the compareEvents method as an additional optional parameter to the constructor. The compareEvents function should conform to the Array.sort([compareFunction]) definition.

One may also customize the list output format by extending the EqList class. The EqList class provides several extension points for customization. At the highest level, one can override the getEventMarkup method (see source code for details).

If only minor changes are desired, one can override a sub-method (again, see source code for details):

  • getEventValue
  • getEventTitle
  • getEventSubtitle
  • getEventAside

Also, when sub-classing the EqList class, one may also create custom includeEvent and compareEvents methods if so desired.

License

Unless otherwise noted, This software is in the public domain because it contains materials that originally came from the United States Geological Survey, an agency of the United States Department of Interior. For more information, see the official USGS copyright policy at http://www.usgs.gov/visual-id/credit_usgs.html#copyright

Dependent libraries found are distributed under the open source (or open source-like) licenses/agreements. Appropriate license aggrements for each library can be found with the library content.

Libraries used at runtime