ember-frost-demo-components

A collection of components and blueprints for showcasing frost components

• Installation
• Getting Started
• Components
• Blueprints
• Contributing

Installation

ember install ember-frost-demo-components

Getting Started

1. This addon installs CodeMirror and Prism for source editing and syntax highlighting. You must update ember-cli-build.js to include options for those addons to bring in necessary themes.

var app = EmberApp(defaults, {
  codemirror: {
    modes: ['javascript', 'handlebars', 'markdown'],
    // frost-demo-editor defaults to 'mdn-like'
    themes: ['mdn-like']
  },
  'ember-prism': {
    // we use coy for frost demos
    theme: 'coy',
    components: ['javascript']
  }
  ...
})

1. Update your application template to include frost-demo-navbar

{{frost-demo-navbar links=links}}
{{outlet}}

1. Update your application controller with navigation links

export default Ember.Controller.extend({
  links: [
    {
      title: 'Demo Title',
      route: 'demo-route'
    }
  ]
})

1. Generate a demo

ember generate frost-demo my-demo --dummy --pod

This generates the following files

tests/dummy
  └── app/pods
    └── my-demo
      └── controller.js
      └── route.js
      └── template.hbs
      └── README.md

1. Update router.js with the new routes.

router.map('my-demo')

1. Continue steps 3-5 for each demo you want to generate.

Components

The following components are available when you install ember-frost-demo-components

• frost-demo-editor
• frost-demo-navbar

Blueprints

This addon makes the frost-demo blueprint available to use to streamline creating demo pages.

ember generate frost-demo demo-1 --dummy --pod
 
# with fullscreen 
ember generate frost-demo demo-2 --fullscreen --dummy --pod

Development

Setup

git clone [e-mail]:ciena-frost/ember-frost-demo-components.git
cd ember-frost-demo-components
npm install && bower install

Development Server

A dummy application for development is available under ember-frost-demo-components/tests/dummy. To run the server run ember server (or npm start) from the root of the repository and visit the app at http://localhost:4200.

Testing

Run npm test from the root of the project to run linting checks as well as execute the test suite and output code coverage.