{"id":18890028,"url":"https://github.com/shipshapecode/ember-newton-cradle-loader","last_synced_at":"2025-04-14T23:31:03.491Z","repository":{"id":66096974,"uuid":"53284297","full_name":"shipshapecode/ember-newton-cradle-loader","owner":"shipshapecode","description":"Ember addon for showing a newton cradle loading animation","archived":false,"fork":false,"pushed_at":"2019-01-05T18:38:38.000Z","size":2048,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-05-01T22:05:45.424Z","etag":null,"topics":["cradle-loader","ember-addon","loading","loading-animations","newton-cradle","spinner"],"latest_commit_sha":null,"homepage":"http://shipshapecode.github.io/ember-newton-cradle-loader/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/shipshapecode.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-03-07T00:39:10.000Z","updated_at":"2019-01-05T18:38:39.000Z","dependencies_parsed_at":"2023-06-27T16:18:15.096Z","dependency_job_id":null,"html_url":"https://github.com/shipshapecode/ember-newton-cradle-loader","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shipshapecode%2Fember-newton-cradle-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shipshapecode%2Fember-newton-cradle-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shipshapecode%2Fember-newton-cradle-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shipshapecode%2Fember-newton-cradle-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shipshapecode","download_url":"https://codeload.github.com/shipshapecode/ember-newton-cradle-loader/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248978529,"owners_count":21192810,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cradle-loader","ember-addon","loading","loading-animations","newton-cradle","spinner"],"created_at":"2024-11-08T07:52:09.550Z","updated_at":"2025-04-14T23:31:03.485Z","avatar_url":"https://github.com/shipshapecode.png","language":"JavaScript","readme":"# Ember-newton-cradle-loader\n\n\u003ca href=\"https://shipshape.io/\"\u003e\u003cimg src=\"http://i.imgur.com/DWHQjA5.png\" alt=\"Ship Shape\" width=\"100\" height=\"100\"/\u003e\u003c/a\u003e\n\n**[ember-newton-cradle-loader is built and maintained by Ship Shape. Contact us for Ember.js consulting, development, and training for your project](https://shipshape.io/ember-consulting/)**.\n\n[![npm version](https://badge.fury.io/js/ember-newton-cradle-loader.svg)](http://badge.fury.io/js/ember-newton-cradle-loader)\n[![npm](https://img.shields.io/npm/dm/ember-newton-cradle-loader.svg)]()\n[![Ember Observer Score](http://emberobserver.com/badges/ember-newton-cradle-loader.svg)](http://emberobserver.com/addons/ember-newton-cradle-loader)\n[![Build Status](https://travis-ci.org/shipshapecode/ember-newton-cradle-loader.svg)](https://travis-ci.org/shipshapecode/ember-newton-cradle-loader)\n[![Code Climate](https://codeclimate.com/github/shipshapecode/ember-newton-cradle-loader/badges/gpa.svg)](https://codeclimate.com/github/shipshapecode/ember-newton-cradle-loader)\n[![Test Coverage](https://codeclimate.com/github/shipshapecode/ember-newton-cradle-loader/badges/coverage.svg)](https://codeclimate.com/github/shipshapecode/ember-newton-cradle-loader/coverage)\n\n[![Demo](http://i.imgur.com/hDPxb2H.gif)](http://shipshapecode.github.io/ember-newton-cradle-loader/)\n[http://shipshapecode.github.io/ember-newton-cradle-loader/](http://shipshapecode.github.io/ember-newton-cradle-loader/)\n\n# Installation\n`ember install ember-newton-cradle-loader`\n\n# Usage\n\nThis addon automatically creates an `application-loading.hbs` template for you, and drops a nice newton cradle loading animation in it, so that whenever your model hooks are waiting to resolve, the loader will show up. If you use pods for your routes and loading states, you may need to delete this template and manually create another one.\n\nYou can also use this loader as a component, wherever you like, by simply including `{{newton-cradle-loader}}` in your template.\n\n\n# Styles\n\nEmber-Newton-Cradle-Loader uses Sass for styles. The default styles for the cradle loader are stored in an overridable Sass map. This is accomplished by supplying a `$ember-newton-cradle-loader` map with any or all of the keys found in the defaults map below.\n\n```scss\n$ember-newton-cradle-loader: (\n  'cradle-size': 1em,\n  'swing-distance': 2.5,\n  'shadow-distance': 1.5,\n  'animation-duration': .425s,\n  'gradient-start': #385c78,\n  'gradient-end': #db412c\n);\n```\n\nThere are seven more keys (in the form of `cradle-bg-n`) in the map available for customizing the background of the individual cradles, as well as seven more for customizing the shadow for each cradle (`cradle-shadow-n`), where `n` is the position of the cradle you want to customize. The individual cradle configurations will override the gradient on that cradle, even if it was manually specified. Customizing a cradle with its corresponding background could look like this:\n\n```scss\n$ember-newton-cradle-loader: (\n  'cradle-bg-1': blue,\n  'cradle-shadow-1': darkblue\n);\n```\n\nUnder the hood, the addon will merge the default settings and any settings supplied in an `$ember-newton-cradle-loader` map and use those to style the cradle loader.\n\nBe sure to `@import` the styles into your project *after* the map if you're using it to customize the look:\n\n```scss\n@import 'ember-newton-cradle-loader';\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshipshapecode%2Fember-newton-cradle-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshipshapecode%2Fember-newton-cradle-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshipshapecode%2Fember-newton-cradle-loader/lists"}