Creating a Rails Engine for jQuery Plugin

Notes from sitepoint.com:


bundle gem pnotifier
Outside the gem directory, create a sample app.

rails new pnotifier

rails g controller site index

gem 'image_zoomer', '0.0.1', path: '/Users/bparanj/work/projects/pnotifier/'

Edit the app/views/site/index.html.erb, replace the content with

<%= Pnotifier::VERSION %>

Start the server and visit http://localhost:3000/site/index. You will see 0.0.1

Create app/assets/javascripts in the gem's root directory. Go to the pnotify plugin Github page https://github.com/sciactive/pnotify/tree/master/dist and grab pnotify.js and place it in the app/assets/javascripts directory.

Create a engine.rb file in lib/pnotifier directory and paste the following code:

module Pnotifer
 class Engine < Rails::Engine
 end
end

In the dummy Rails application open app/assets/javascripts/application.js and append:

//= require pnotifier

Restart the server. Refresh the page.
Open lib/notifier.rb in the gem and paste:

require 'pnotifier/engine'

Restart the server and refresh the browser.
View page source. You will see script tag referencing pnotifier.js.

Create pnotifier_main.js in app/assets/javascripts directory in the gem and paste:

//= require_tree .

Open app/assets/javascripts/application.js in Rails app and replace //= require pnotifier with:

//= require pnotifier_main

Restart the web server, refresh the browser and view page source. Both javascript files from the gem will be there.

Create a file pnotifier_initializer.js in app/assets/javascripts with:


$(function(){
    new PNotify({
        title: 'Regular Notice',
        text: 'Check me out! I\'m a notice.'
    });
});

Refresh the browser. You will the see notifier appear and disappear after some time.