From da448251947e37ed76bdb7d0bf62c9db028a90f9 Mon Sep 17 00:00:00 2001 From: Mike North Date: Wed, 1 Apr 2015 15:46:29 -0700 Subject: [PATCH 01/11] material badge --- addon/components/materialize-badge.js | 9 ++++ .../components/materialize-badge.hbs | 1 + app/components/materialize-badge.js | 3 ++ tests/dummy/app/router.js | 1 + tests/dummy/app/templates/badges.hbs | 49 +++++++++++++++++++ tests/dummy/app/templates/index.hbs | 35 ++++++++++--- .../unit/components/materialize-badge-test.js | 38 ++++++++++++++ 7 files changed, 130 insertions(+), 6 deletions(-) create mode 100644 addon/components/materialize-badge.js create mode 100644 addon/templates/components/materialize-badge.hbs create mode 100644 app/components/materialize-badge.js create mode 100644 tests/dummy/app/templates/badges.hbs create mode 100644 tests/unit/components/materialize-badge-test.js diff --git a/addon/components/materialize-badge.js b/addon/components/materialize-badge.js new file mode 100644 index 00000000..e321f420 --- /dev/null +++ b/addon/components/materialize-badge.js @@ -0,0 +1,9 @@ +import Ember from 'ember'; +import layout from '../templates/components/materialize-badge'; + +export default Ember.Component.extend({ + layout: layout, + tagName: 'span', + text: null, + classNames: ['badge'] +}); diff --git a/addon/templates/components/materialize-badge.hbs b/addon/templates/components/materialize-badge.hbs new file mode 100644 index 00000000..36fa1d69 --- /dev/null +++ b/addon/templates/components/materialize-badge.hbs @@ -0,0 +1 @@ +{{text}}{{yield}} diff --git a/app/components/materialize-badge.js b/app/components/materialize-badge.js new file mode 100644 index 00000000..7e973ae6 --- /dev/null +++ b/app/components/materialize-badge.js @@ -0,0 +1,3 @@ +import materializeBadge from 'ember-cli-materialize/components/materialize-badge'; + +export default materializeBadge; diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 5bd70d4a..83499aae 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -6,6 +6,7 @@ var Router = Ember.Router.extend({ }); Router.map(function() { + this.route("badges"); this.route("buttons"); this.route("navbar"); this.route("cards"); diff --git a/tests/dummy/app/templates/badges.hbs b/tests/dummy/app/templates/badges.hbs new file mode 100644 index 00000000..0d66e543 --- /dev/null +++ b/tests/dummy/app/templates/badges.hbs @@ -0,0 +1,49 @@ +
+
+
+
+

Badges

+
+
+
+
+ +
+
+
+

The component supports one option:

+
    +
  • text, default value null
    • +
+
+
+
+
+
+
    +
  • + 1. Steal Underpants + {{materialize-badge class='new' text="6"}} +
    • +
  • 2. ??? + {{#materialize-badge}}9{{/materialize-badge}} +
    • +
  • 3. Profit
    • +
+
+
+
+
+ + 
+          
+            {{materialize-badge class="new" text="6"}}
+            {{#materialize-badge}}9{{/materialize-badge}}
+          
+
+ +
+
+
+ +
diff --git a/tests/dummy/app/templates/index.hbs b/tests/dummy/app/templates/index.hbs index b89f03c7..c842b016 100644 --- a/tests/dummy/app/templates/index.hbs +++ b/tests/dummy/app/templates/index.hbs @@ -30,12 +30,35 @@

Usage

diff --git a/tests/unit/components/materialize-badge-test.js b/tests/unit/components/materialize-badge-test.js new file mode 100644 index 00000000..37d8354e --- /dev/null +++ b/tests/unit/components/materialize-badge-test.js @@ -0,0 +1,38 @@ +import { + moduleForComponent, + test +} from 'ember-qunit'; + +moduleForComponent('materialize-badge', { + // Specify the other units that are required for this test + // needs: ['component:foo', 'helper:bar'] +}); + +test('it renders', function(assert) { + assert.expect(2); + + // Creates the component instance + var component = this.subject(); + assert.equal(component._state, 'preRender'); + + // Renders the component to the page + this.render(); + assert.equal(component._state, 'inDOM'); +}); + + +test('binding to the text property works', function(assert) { + expect(2); + + var component = this.subject(); + + this.render(); + equal(component.$().text().trim(), '', 'By default the text property is empty'); + + Ember.run(function () { + component.set('text', 'Heisenberg'); + Ember.run.schedule('afterRender', function () { + equal(component.$().text().trim(), 'Heisenberg', 'Setting the text property updates the content of the badge'); + }); + }); +}); From dd33492de460ab9e476ab3e284c0ef3a6e08475d Mon Sep 17 00:00:00 2001 From: Mike North Date: Wed, 1 Apr 2015 15:51:04 -0700 Subject: [PATCH 02/11] Fix jshint errors --- tests/unit/components/materialize-badge-test.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/tests/unit/components/materialize-badge-test.js b/tests/unit/components/materialize-badge-test.js index 37d8354e..b4ea053b 100644 --- a/tests/unit/components/materialize-badge-test.js +++ b/tests/unit/components/materialize-badge-test.js @@ -1,3 +1,5 @@ +import Ember from 'ember'; + import { moduleForComponent, test @@ -22,17 +24,17 @@ test('it renders', function(assert) { test('binding to the text property works', function(assert) { - expect(2); + assert.expect(2); var component = this.subject(); this.render(); - equal(component.$().text().trim(), '', 'By default the text property is empty'); + assert.equal(component.$().text().trim(), '', 'By default the text property is empty'); Ember.run(function () { component.set('text', 'Heisenberg'); Ember.run.schedule('afterRender', function () { - equal(component.$().text().trim(), 'Heisenberg', 'Setting the text property updates the content of the badge'); + assert.equal(component.$().text().trim(), 'Heisenberg', 'Setting the text property updates the content of the badge'); }); }); }); From 58d8b66a67a846440e7a7d27660d2aa27d949d22 Mon Sep 17 00:00:00 2001 From: Mike North Date: Wed, 1 Apr 2015 17:22:49 -0700 Subject: [PATCH 03/11] Add emberobserver.com badge to the readme --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 4d1e76bf..ee25d5b0 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,7 @@ [![Build Status](https://travis-ci.org/sgasser/ember-cli-materialize.svg)](https://travis-ci.org/sgasser/ember-cli-materialize) [![Code Climate](https://codeclimate.com/github/sgasser/ember-cli-materialize/badges/gpa.svg)](https://codeclimate.com/github/sgasser/ember-cli-materialize) +[![Ember Observer Score](http://emberobserver.com/badges/ember-cli-materialize.svg)](http://emberobserver.com/addons/ember-cli-materialize) An [ember-cli](http://www.ember-cli.com) addon for using [Materialize](http://materializecss.com/) (CSS Framework based on [Material Design](http://www.google.com/design/spec/material-design/introduction.html)) in Ember applications. From f3780b6a99317debdfedf2a14c6128c6d93f16a7 Mon Sep 17 00:00:00 2001 From: Jaime Date: Thu, 2 Apr 2015 13:27:58 +0200 Subject: [PATCH 04/11] Feature: Set the type of the input --- addon/components/materialize-input.js | 7 ++++++- addon/templates/components/materialize-input.hbs | 3 +-- tests/dummy/app/templates/input.hbs | 16 +++++++++++++++- 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/addon/components/materialize-input.js b/addon/components/materialize-input.js index 15b6b5e6..b345e6c1 100644 --- a/addon/components/materialize-input.js +++ b/addon/components/materialize-input.js @@ -4,6 +4,7 @@ import layout from '../templates/components/materialize-input'; export default MaterializeInputField.extend({ layout: layout, + type: '', didInsertElement: function() { this._super(); // make sure the label moves when a value is bound. @@ -11,6 +12,10 @@ export default MaterializeInputField.extend({ if (Ember.isPresent(this.get('value')) && !labelSelector.hasClass('active')) { labelSelector.addClass('active'); } + + //If no type is set as parameter use "text" as default + if(Ember.isEmpty(this.get('type'))) { + this.set('type', 'text'); + } } }); - diff --git a/addon/templates/components/materialize-input.hbs b/addon/templates/components/materialize-input.hbs index 9e5717a9..fd5efc82 100644 --- a/addon/templates/components/materialize-input.hbs +++ b/addon/templates/components/materialize-input.hbs @@ -1,11 +1,10 @@ {{#if icon}} {{/if}} -{{input id=id value=value classNameBindings="validate:validate: errors.firstObject:invalid:valid" type="text" +{{input id=id value=value classNameBindings="validate:validate: errors.firstObject:invalid:valid" type=type required=required pattern=pattern maxlength=maxlength readonly=readonly disabled=disabled autocomplete=autocomplete}} {{#if errors}} {{errors.firstObject}} {{else}}   {{/if}} - diff --git a/tests/dummy/app/templates/input.hbs b/tests/dummy/app/templates/input.hbs index b6787b63..3ea56ba7 100644 --- a/tests/dummy/app/templates/input.hbs +++ b/tests/dummy/app/templates/input.hbs @@ -19,6 +19,7 @@
  • label, default value null
  • icon, default value null
  • value, default value null
    • +
  • type, default value text
  • required, default value false
  • readonly, default value false
  • disabled, default value false
    • @@ -56,6 +57,20 @@ +
    +

    Input with type="password"

    +
    +
    + {{materialize-input value="test" label='Password' type="password"}} + + 
    +
+    {{materialize-input value="test" label="Password" type="password"}}
+
+
    +
    +
    +

    Validations

    @@ -177,4 +192,3 @@ nameDidChange: function() {
    - From 6e3adaf0439143293d3ebefc85bd035aa9fc4662 Mon Sep 17 00:00:00 2001 From: jaimevent Date: Thu, 2 Apr 2015 14:03:32 +0200 Subject: [PATCH 05/11] New: Added test --- tests/unit/components/materialize-input-test.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/tests/unit/components/materialize-input-test.js b/tests/unit/components/materialize-input-test.js index 1ce2d65d..7c2b8cfa 100644 --- a/tests/unit/components/materialize-input-test.js +++ b/tests/unit/components/materialize-input-test.js @@ -51,3 +51,10 @@ test('has an icon', function(assert) { this.render(); assert.ok(component.$('>i').hasClass(icon)); }); + +test('has type password', function(assert) { + var type = 'password'; + var component = this.subject({ type: type }); + this.render(); + assert.equal(component.$('>input').attr('type'), type); +}); From 085c3e5a9053229a7196b25feb89678ccd11be8f Mon Sep 17 00:00:00 2001 From: jaimevent Date: Thu, 2 Apr 2015 14:04:18 +0200 Subject: [PATCH 06/11] Refactor: default type-property is text --- addon/components/materialize-input.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/addon/components/materialize-input.js b/addon/components/materialize-input.js index b345e6c1..73e581be 100644 --- a/addon/components/materialize-input.js +++ b/addon/components/materialize-input.js @@ -4,7 +4,7 @@ import layout from '../templates/components/materialize-input'; export default MaterializeInputField.extend({ layout: layout, - type: '', + type: 'text', didInsertElement: function() { this._super(); // make sure the label moves when a value is bound. @@ -12,10 +12,5 @@ export default MaterializeInputField.extend({ if (Ember.isPresent(this.get('value')) && !labelSelector.hasClass('active')) { labelSelector.addClass('active'); } - - //If no type is set as parameter use "text" as default - if(Ember.isEmpty(this.get('type'))) { - this.set('type', 'text'); - } } }); From 24f5d3a0f741053e2180a6a876d6930acd33a700 Mon Sep 17 00:00:00 2001 From: Stefan Gasser Date: Thu, 2 Apr 2015 19:35:38 +0200 Subject: [PATCH 07/11] Bufix: Using latest materialize version and sass version --- blueprints/ember-cli-materialize/index.js | 4 ++-- bower.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/blueprints/ember-cli-materialize/index.js b/blueprints/ember-cli-materialize/index.js index 4c46383e..63290a19 100644 --- a/blueprints/ember-cli-materialize/index.js +++ b/blueprints/ember-cli-materialize/index.js @@ -2,10 +2,10 @@ module.exports = { normalizeEntityName: function() {}, beforeInstall: function(options) { - return this.addBowerPackageToProject('materialize', '~0.95.0'); + return this.addBowerPackageToProject('materialize', '~0.96.0'); }, afterInstall: function() { - return this.addPackageToProject('ember-cli-sass', '^3.1.0'); + return this.addPackageToProject('ember-cli-sass', '^3.2.2'); } }; diff --git a/bower.json b/bower.json index 1a2c42df..b047911a 100644 --- a/bower.json +++ b/bower.json @@ -12,7 +12,7 @@ "ember-qunit": "0.3.0", "ember-qunit-notifications": "0.0.7", "qunit": "~1.17.1", - "materialize": "4cee70e6740b20ee16ac013cd0ea0f33fe52853c" + "materialize": "~0.96.0" }, "resolutions": { "jquery": "~1.11.1" From f6159ff64cc55e2200ea359ab806247c251579a3 Mon Sep 17 00:00:00 2001 From: Stefan Gasser Date: Thu, 2 Apr 2015 20:05:45 +0200 Subject: [PATCH 08/11] Refactor: Remove old code from README --- README.md | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/README.md b/README.md index ee25d5b0..fd82c221 100644 --- a/README.md +++ b/README.md @@ -13,9 +13,6 @@ An [ember-cli](http://www.ember-cli.com) addon for using [Materialize](http://ma * Imports [Materialize](http://materializecss.com/) sass (via [ember-cli-sass](https://www.npmjs.com/package/ember-cli-sass)) and fonts into your app. * It's a components library for all Materialize components -## Changelog -See [CHANGELOG file](https://github.com/sgasser/ember-cli-materialize/tree/master/CHANGELOG.md). - ## Usage The [online demo](http://sgasser.github.io/ember-cli-materialize) demonstrates all components with all possible options. @@ -32,19 +29,10 @@ $ ember serve ## Installation -Using ember-cli 0.1.5: ```sh $ ember install:addon ember-cli-materialize ``` -Using previous versions: -```sh -# install via npm -$ npm install ember-cli-materialize --save-dev -# make ember-cli fetch internal dependencies -$ ember g ember-cli-materialize -``` - ## Contributing See [CONTRIBUTING file](https://github.com/sgasser/ember-cli-materialize/tree/master/CONTRIBUTING.md). From 3550eab8d9d0c787a89e1196da076b7ffe5841f5 Mon Sep 17 00:00:00 2001 From: Stefan Gasser Date: Thu, 2 Apr 2015 20:16:12 +0200 Subject: [PATCH 09/11] Bugfix: Add missing fonts --- index.js | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/index.js b/index.js index 031133b0..742172b0 100644 --- a/index.js +++ b/index.js @@ -7,11 +7,25 @@ module.exports = { included: function(app) { this._super.included(app); - app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Bold.ttf', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Thin.woff2', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Thin.woff', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Thin.ttf', { destDir: 'font/roboto' }); + + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Light.woff2', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Light.woff', { destDir: 'font/roboto' }); app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Light.ttf', { destDir: 'font/roboto' }); - app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Medium.ttf', { destDir: 'font/roboto' }); + + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Regular.woff2', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Regular.woff', { destDir: 'font/roboto' }); app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Regular.ttf', { destDir: 'font/roboto' }); - app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Thin.ttf', { destDir: 'font/roboto' }); + + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Medium.woff2', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Medium.woff', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Medium.ttf', { destDir: 'font/roboto' }); + + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Bold.woff2', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Bold.woff', { destDir: 'font/roboto' }); + app.import(app.bowerDirectory + '/materialize/dist/font/roboto/Roboto-Bold.ttf', { destDir: 'font/roboto' }); app.import(app.bowerDirectory + '/materialize/dist/font/material-design-icons/Material-Design-Icons.eot', { destDir: 'font/material-design-icons' }); app.import(app.bowerDirectory + '/materialize/dist/font/material-design-icons/Material-Design-Icons.ttf', { destDir: 'font/material-design-icons' }); From d573edd300f836207737fb22dd82f6af8ea9dbb8 Mon Sep 17 00:00:00 2001 From: Stefan Gasser Date: Thu, 2 Apr 2015 20:24:07 +0200 Subject: [PATCH 10/11] 0.8.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a3988fca..8445b639 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-cli-materialize", - "version": "0.7.2", + "version": "0.8.0", "directories": { "doc": "doc", "test": "tests" From 05ce0fb667fda027a270d7389f8671fa1dc07021 Mon Sep 17 00:00:00 2001 From: Stefan Gasser Date: Thu, 2 Apr 2015 20:28:58 +0200 Subject: [PATCH 11/11] Refactor: Update README --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index fd82c221..15e33379 100644 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ An [ember-cli](http://www.ember-cli.com) addon for using [Materialize](http://materializecss.com/) (CSS Framework based on [Material Design](http://www.google.com/design/spec/material-design/introduction.html)) in Ember applications. -*Materialize Version 0.95.* +*Materialize Version ~0.96.0 ## Main features