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 🙏

© 2025 – Pkg Stats / Ryan Hefner

jquery-lifestream

v0.5.6-pre

Published

jQuery plugin to show a stream of your online activity.

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

devkatdevkat

Keywords

Readme

jQuery Lifestream Plug-in

jQuery Lifestream Logo

Show a stream of your online activity. Check out the example or create your own lifestream instantly.

Follow us on twitter

Requirements

Supported feeds

Currently supports the following feeds:

Feel free to fork the project and add your own feeds in. Just send a pull request to christianvuerings/jquery-lifestream when you're finished.

Extensions

Build

cd build
make

Available targets

Use make target and replace target with the target you want to use.

  • jls: Build jquery.lifestream.js, the non-minified version of jQuery Lifestream
  • jls-min: Build jquery.lifestream.min.js, the minified version of jQuery Lifestream
  • jls-css: Build css/lifestream.css, the stylesheet containing the favicons
  • script-min: Build download/js/script.min.js, this script is the main script for the download page
  • uglifyjs: Build download/js/uglify-cs.js, a custom version of UglifyJS patched to work in the browser
  • uglifyjs-min: Build download/js/uglify-cs.min.js, minified version of UglifyJS
  • service-list: Build download/services.json, a list of all the services which are available

Requirements

Usage

Add the following to the <head> or <body> tag of your HTML page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="//rawgithub.com/christianvuerings/jquery-lifestream/master/jquery.lifestream.min.js"></script>
<script>
  $("#lifestream").lifestream({
    list:[
      {
        service: "github",
        user: "christianvuerings"
      },
      {
        service: "twitter",
        user: "christianvuer"
      }
    ]
  });
</script>

The above code will always use the latest version of the script. If you want to use it in production, download the minified or uncompressed file and host it yourself.

You also need to add a bit of HTML:

<div id="lifestream">&nbsp;</div>

jQuery Templates

You have the ability to use jQuery templates for your feed. Checkout the template page to see an overview of the current available templates.

Usage:

{
  service: 'deviantart',
  user: 'gabbyd70',
  template: {
    deviationpost: 'heeft hetvolgende gepost: <a href="${url}">${title}</a>'
  }
}

Configuration

The plug-in accepts one configuration JSON object:

$("#lifestream").lifestream({
  classname: "lifestream",
  feedloaded: feedcallback,
  limit: 30,
  list:[
    {
      service: "github",
      user: "christianvuerings"
    },
    {
      service: "twitter",
      user: "christianvuer"
    }
  ]
});

classname: The name of the main lifestream class. We use this for the main ul class e.g. lifestream and for the specific feeds e.g. lifestream-twitter

feedloaded: (function) A callback function which is triggered each time a feed was loaded.

limit: (integer) Specify how many elements you want in your lifestream (default = 10).

list: (array) Array containing other JSON objects with information about each item. Each item should have a service and a user. For more information about each service, check out the source code of the example page.

Commit to the project

Add your own feed

Adding in your own feed is pretty easy. Have a look at this commit which adds support for the last.fm feed.

Add your favicon

  1. Convert the favicon.ico of a site to a .png file. (e.g. http://google.com/favicon.ico)
  2. Optimize the .png file. Save it in src/favicons/.

How to commit?

  1. Push the finished code to your own remote repository.
  2. Send a pull request to christianvuerings/jquery-lifestream.

Code Style Guidelines

  • Indentation: 2 spaces
  • Max column width: 78 characters
  • Trailing spaces: not allowed
  • Always use curly brackets {} for if/else/for
  • Put all var statements in the beginning of a function
  • Use === & !== for comparing variables
  • Use the following spacing rules:
for (var i = 0, j = length; i < j; i++) {
  • Use jshint on your files. .jshintrc contains the necessary configuration

Ideas

Stuff that isn't implemented yet, but would be nice to have:

Mentions

Places on the web where this plug-in got mentioned:

Used By

A list of sites that use the jQuery Lifestream plug-in:

Alesh Houdek, Armin Roșu, BrainDump2.0, Dennis Metzcher, Devin Berg, Erik Ostrom, Ethan Brown, Libby Baldwin, Sam Tardif, Sebastix, Simon Gaeremynck, Song Gao, Sunny Walker, Roni Laukkarinen

Special Thanks

Special thanks all the committers and gabbyd70 for letting us use her DeviantART username.

Version log

Have a look at our tags to see what we've been working on.