Notify President Madagascar


    1.3.2 • Public • Published

    NPM version Dependency Status Build Status


    Extended spine framework. It gives you ability to work with controllers almost like in Angular.

    You can use it for example with SimQ.


    Unfortunately I don't have any more time to maintain this repository :-(

    sad cat


    $ npm install extended-spine


    Before everything, you have to add this one line of code into your javascript.

    Controller = require 'extended-spine'


    Now only spine controller is extended.

    Controller = require 'extended-spine/Controller'
    class MyController extends Controller
        constructor: (@el) ->
    module.exports = MyController

    As you can see, everything is same like in classic spine, only extended class is different.

    Creating controllers from data-controller attribute

    This module will automatically look for elements in your page with data-application attribute. If it will not find it, whole html page will be used. Every element inside this data-application element with data-controller element will be used for controller. Example is much better for explain.

    <div data-application>
        <div data-controller="/path/to/controller/for/this/element">...</div>

    Text in data-controller attribute is path used in require method.

    This means that now you don't have to instantiate controllers on your own. :-)

    Using dependency-injection

    If you like dependency injection pattern with autowired dependencies (again for example like in angular), you can use this feature also with this module.

    Uses dependency-injection module.

    DI = require 'dependency-injection'
    di = new DI
    Controller.init($, di)

    Some controller:

    Controller = require 'extended-spine/Controller'
    class Chat extends Controller
        http: null
        jquery: null
        model: null
        constructor: (@el, @http, @jquery, @model) ->
    module.exports = Chat

    Chat module is dependent on three services. First argument will always be the container element and others will be services from DI container.

    Check documentation of dependency-injection module to see how to add services into your DI container.

    This works only with controllers which were created with data-controller attribute.

    Refreshing elements

    If your application uses for example ajax for repainting elements, you can use two methods, showed below for refreshing your controllers.

    Controller = require 'extended-spine/Controller'
    el = $('#element-which-will-be-repainted')
    $.get(url, (data) ->

    Methods unbind and refresh manipulates also with element on which it was called. You can of course disable that.

    Controller.unbind(el, false)
    Controller.refresh(el, false)

    Finding controllers

    From jQuery element:

    menu = $('#menu').getController()
    // or
    menu = $('[data-controller="/app/controller/Menu"]').getController()


    menu = Controller.find('/app/controller/Menu')

    Lazy controllers

    If you don't want to instantiate some controller immediately, you can add html attribute data-lazy to.

    <div data-controller="/path/to/my/controller" data-lazy></div>

    Now when you want to create instance of this controller, you have to get it's controller factory and use it.

    factory = Controller.find('/path/to/my/controller')		// for lazy controllers, factory function is returned
    controller = factory()									// just call it and it will return created controller

    Mobile/computer specific controllers

    You can also set if some of your controllers is only for mobile or only for computers.

    <div data-controller="/app/controllers/just/for/mobile" data-mobile>
    <div data-controller="/app/controllers/just/for/computer" data-computer>


    $ npm test


    • 1.3.2

      • Move under Carrooi organization
      • Abandon package
    • 1.3.1

      • Bug in init method
    • 1.3.0

      • Refactoring
      • Added dependency injection (package extended-spine-di will be removed)
      • Added property fullName into controllers
      • Updated dependencies
      • Better find method
    • 1.2.0

      • Tests modules does not need to be installed globally
      • Some updates
      • Added find method
      • Added lazy controller option
      • Added lazy option
      • Added badges
      • Added travis
    • 1.1.0

      • Automatically creates html id
      • Some optimization
    • 1.0.4

      • Wrong variable names
    • 1.0.2 - 1.0.3

      • Bug with inheritance
    • 1.0.1

      • Typo in tests
      • Better documentation
    • 1.0.0

      • Initial version


    npm i extended-spine

    DownloadsWeekly Downloads






    Last publish


    • sakren