npm

Need private packages and team management tools?Check out npm Orgs. »

ember-load

0.0.17 • Public • Published

Ember-load

A simple loading indicator, while your static assets download, and your Ember.js app starts up.

Build Status Code Climate npm version Ember Observer Score

Installing the Add-on

  • ember install ember-load

Configuration & Use

You can customize this addon in your environment/config.js

module.exports = function(environment) {
  var ENV = {
    // optional
    'ember-load': {
      // This is the default value, if you don't set this option
      loadingIndicatorClass: 'ember-load-indicator'
    }
    ...
  }
  ...
}  

And then place some HTML in your app/index.html

 
<div class="ember-load-indicator">
  CAN I HAS APP NOW?
</div>

Finally, place the following in your app/templates/application.hbs

{{ember-load-remover}}

The loading indicator will be removed when your application view is inserted into the DOM

But where do I find cool little spinners?!

Anything that's purely CSS or plain JavaScript should work beautifully. You'll have the best luck with things that require no scripts or assets (i.e., images) to run in the browser.

Advanced Usage

You may also override or extend the default "load indicator removal" hook, by creating a component in your app called ember-load-remover

app/components/ember-load-remover.js
import EmberLoadRemover from 'ember-load/components/ember-load-remover';
 
export default EmberLoadRemover.extend({
  removeLoadingIndicator() {
    // Perform default behavior
    this._super(...arguments);
    // Do something custom in addition to it
    console.log('Just so you know, your app has loaded. 🚀');
  }
});

Compatibility

This add-on can be used with or without Ember.Views

Ember Version Range Notes
>= 1.11 Can be used with Ember.View, or using the component ({{ember-load-remover}})
2.0 - 2.4 Can be used with Ember.View (via ember-legacy-views), or using the component ({{ember-load-remover}})
>= 2.5 Must be used via component ({{ember-load-remover}}), as ember-legacy-views is not compatible with Ember 2.5

Contributing

  • git clone this repository
  • npm install
  • bower install

Running

Running Tests

  • ember test
  • ember test --server

Building

  • ember build

For more information on using ember-cli, visit http://www.ember-cli.com/.

Keywords

install

npm i ember-load

Downloadsweekly downloads

4,401

version

0.0.17

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability