Skip to content
vic

jsmestad/socialite

Support (and manage) Authentication with multiple OmniAuth providers in your Rails application

jsmestad/socialite.json
{
"createdAt": "2011-09-14T19:58:54Z",
"defaultBranch": "master",
"description": "Support (and manage) Authentication with multiple OmniAuth providers in your Rails application",
"fullName": "jsmestad/socialite",
"homepage": "https://github.com/jsmestad/socialite",
"language": "Ruby",
"name": "socialite",
"pushedAt": "2013-10-30T18:31:06Z",
"stargazersCount": 58,
"topics": [
"authentication",
"engine",
"oauth2",
"omniauth",
"rails"
],
"updatedAt": "2024-01-27T00:58:07Z",
"url": "https://github.com/jsmestad/socialite"
}

Because if you’re selling your soul, you may as well do it asynchronously.

Section titled “Because if you’re selling your soul, you may as well do it asynchronously.”

Socialite provides a very easy way to implement and activate a plethora of social sharing buttons — any time you wish. On document load, on article hover, on any event!

For a demo visit: socialitejs.com

Author: David Bushell http://dbushell.com @dbushell

Contributor: Tom Morton http://twmorton.com @tmort

Copyright © 2013

Please be aware that class names used by Socialite have changed since version 1. All instances start with the class socialite, they gain the class socialite-instance once processed, and finally socialite-loaded once activated. Pinterest and Spotify extensions are no longer in the default build of socialite.js. See end of this README for full change log.

Create an element with the class socialite and a class like twitter-share to specify the social network and type of widget. Best practice is to provide an accessible fallback URL like the example below. Style it however you like, though avoid using overflow: hidden in CSS as it will crop overlays. See http://socialitejs.com for demos.

<a class="socialite twitter-share" href="http://twitter.com/share" data-url="http://socialitejs.com">
Share on Twitter
</a>

Use data-* attributes to configure your button. These configurations directly correlate to the individual network implementations, so while Twitter uses data-url, Facebook uses data-href. Not ideal but I’d rather keep this script very small!

Supported widgets are currently:

  • Facebook: facebook-like
  • Twitter: twitter-share, twitter-follow, twitter-mention, twitter-hashtag and twitter-embed (for individual tweets)
  • Google+: googleplus-one, googleplus-share, googleplus-badge
  • LinkedIn: linkedin-share, linkedin-recommend

Also available as extensions:

  • Pinterest: pinterest-pinit
  • Spotify: spotify-play
  • Hacker News: hackernews-share
  • GitHub: github-watch, github-fork, github-follow
  • DZone: dzone-submit

For all individual button configurations visit Twitter, Google+, Facebook, LinkedIn, Pinterest, and Spotify. Important: don’t include the scripts provided by these networks, Socialite does that for you! Include socialite.js right at the end of your document and activate with the options below.

Please note: you can easily edit socialite.js to remove the social networks you don’t need.

Socialite.load();

The main Socialite function. load will search the document for elements with the class socialite and magically transform them into sharing buttons (based on a network class and data-* attributes).

Always wait for at least the DOMContentLoaded event — $(document).ready(function() { }); with jQuery.

Socialite.load(context);

Be kind! Provide a scope to search within using context (a containing element) rather than the whole document.

Socialite.activate(element, 'widget');

activate replaces a single element (or an array of) with the specific social widget.

Socialite.process();

Run process only once when the document has loaded to prepare all Socialite instances. This may be necessary to avoid conflicts when multiple or unsupported widgets exist on the page (e.g. Pinterest buttons). Note that process removes all fallback content for some widgets. This optional will be implemented more intelligently in future versions of Socialite.

Socialite.setup({ /* settings */ });

setup allows you to specify settings for each network such as localisation (see below for all options).

Socialite.setup({
facebook: {
lang : 'en_GB',
appId : 123456789,
onlike : function(url) { /* ... */ },
onunlike : function(url) { /* ... */ },
onsend : function(url) { /* ... */ }
}
});

See Facebook’s documentation on Internationalization for supported language codes.

Socialite.setup({
twitter: {
lang : 'en',
onclick : function(e) { /* ... */ },
ontweet : function(e) { /* ... */ },
onretweet : function(e) { /* ... */ },
onfavorite : function(e) { /* ... */ },
onfollow : function(e) { /* ... */ }
}
});

See Twitter’s documentation for support on Web Intents Javascript Events and supported Languages.

Twitter share buttons can override the global language setting with a data-lang attribute.

Socialite.setup({
googleplus: {
lang : 'en-GB',
onstartinteraction : function(el, e) { /* ... */ },
onendinteraction : function(el, e) { /* ... */ },
callback : function(el, e) { /* ... */ }
}
});

See Google’s documentation for support on Events and Languages.

Send me feedback and testing issues!

The main core of Socialite is built for extensibility. It’s basically a fancy script loader designed for social widgets. They can be stripped out easily if not used and new ones added:

Socialite.network('network', params);
Socialite.widget('network', 'widget', params);

With these two functions you can add extended support. See the source code for examples (more guides to come here). I’m always working on support and settings for more networks, check back frequently!

Tom Morton @tmort has also created a WordPress plugin that packages WPSocialite and makes it a one step installation into your WordPress powered website. Download it from here: http://wordpress.org/plugins/wpsocialite/.

  • added GitHub Buttons extension
  • Google+ window.gapi.render() now used on inner gplus div to avoid inline styles on the socialite element
  • added Google+ googleplus-badge widget
  • added a Buffer App extension
  • created an extensions folder in the repository
  • Pinterest and Spotify removed from the default socialite.js and socialite.min.js builds.

This is an opinionated Rails 3.1 mountable engine provides your application with support for managing multiple OAuth providers per User.

Every site I have built in the past couple years has required implementing authentication support for Users. Now this was simple enough when it was only one provider (in my case, “Login with Facebook”), but more often then not it evolved into “Login with <insert_oauth_provider>”.

Now OmniAuth has some good write-ups on handling multiple providers, but it lacked any support for restricting a user to one identity per provider. Socialite aims to solve this and while enforcing every user to have a Basic Authentication identity as a fall-back in case of password recovery.

  1. Every User can only have one identity per supported provider
  • Example: User can have only 1 linked Facebook Identity at any given time
  1. Every User must have an basic-auth identity
  • Example: User signs up through Facebook, but unlinks it. Enforcing a local basic auth mechanism aids account recovery.
  1. Supports any provider strategy in the OmniAuth project.

To use Socialite in a Rails 3.1 application:

  • Require it in the Gemfile: gem 'socialite', git: 'git://github.com/jsmestad/socialite
  • Install the gem it by running bundle install.
  • Run the socialite generator using rails g socialite:install for typical installs and rails g active_record:socialite for specifying custom options.

This project began as a fork of Tim Riley’s great Omnisocial plugin. The motivation for this fork is that I required multiple authorizations for each account (linking support) and wanted a proper mountable Rails 3.1 Engine.

Socialite is Copyright (c) 2011- 2013 Justin Smestad. All Rights are Reserved. Code is distributed under the Apache 2.0 License. See LICENSE file for more information.

The original OmniSocial code is Copyright (c) 2010-2011 Tim Riley and Icelab, and is released under MIT License.