From 7ae9147b23f72b4c9b72b2537a05f46be0370edb Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:14:23 -0400
Subject: [PATCH 01/19] Add yuidocs package for formulating documentation

Reference issue #53
---
 .gitignore   |  1 +
 package.json |  1 +
 yuidoc.json  | 17 +++++++++++++++++
 3 files changed, 19 insertions(+)
 create mode 100644 yuidoc.json

diff --git a/.gitignore b/.gitignore
index 86fceae..2591bb1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -15,3 +15,4 @@
 /libpeerconnection.log
 npm-debug.log
 testem.log
+/docs/*
diff --git a/package.json b/package.json
index 52af321..4b62376 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,7 @@
     "ember-cli-release": "0.2.8",
     "ember-cli-sri": "^2.1.0",
     "ember-cli-uglify": "^1.2.0",
+    "ember-cli-yuidoc": "0.8.4",
     "ember-data": "2.4.3",
     "ember-disable-prototype-extensions": "^1.1.0",
     "ember-disable-proxy-controllers": "^1.0.1",
diff --git a/yuidoc.json b/yuidoc.json
new file mode 100644
index 0000000..9787bd7
--- /dev/null
+++ b/yuidoc.json
@@ -0,0 +1,17 @@
+{
+  "name": "ember-tabular",
+  "description": "The default blueprint for ember-cli addons.",
+  "version": "0.1.0",
+  "options": {
+    "paths": [
+      "addon"
+    ],
+    "enabledEnvironments": ["development", "production"],
+    "exclude": "vendor",
+    "outdir": "docs",
+    "linkNatives": true,
+    "quiet": true,
+    "parseOnly": false,
+    "lint": false
+  }
+}
\ No newline at end of file

From dafb0726c1e6ba15cbe8499ab5a705f3ff8c60e7 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:15:05 -0400
Subject: [PATCH 02/19] Add comment blocks to main ember-tabular.js for YUIDocs
 parsing

Reference issue #53
---
 addon/components/ember-tabular.js | 288 +++++++++++++++++++++++++++++-
 1 file changed, 283 insertions(+), 5 deletions(-)

diff --git a/addon/components/ember-tabular.js b/addon/components/ember-tabular.js
index 2089c8e..8517726 100644
--- a/addon/components/ember-tabular.js
+++ b/addon/components/ember-tabular.js
@@ -1,13 +1,49 @@
 import Ember from 'ember';
 
+/**
+* @class EmberTabular
+*/
 export default Ember.Component.extend({
   store: Ember.inject.service('store'),
   action: null,
   classNames: ['ember-tabular'],
+  /**
+  * Component will attempt to make a request to fetch the data.
+  *
+  * @property makeRequest
+  * @type Boolean
+  * @default true
+  */
   makeRequest: true,
+  /**
+  * Used to toggle the filter row bar.
+  *
+  * @property showFilterRow
+  * @type Boolean
+  * @default false
+  */
   showFilterRow: false,
+  /**
+  * @property sortableClass
+  * @type String
+  * @default 'sortable'
+  */
   sortableClass: 'sortable',
+  /**
+  * Once the `isRecordLoaded` is determined if true and no data exists then this is displayed.
+  *
+  * @property tableLoadedMessage
+  * @type String
+  * @default 'No Data.'
+  */
   tableLoadedMessage: 'No Data.',
+  /**
+  * Computed Property to determine the column length dependent upon `columns`.
+  *
+  * @property columnLength
+  * @param columns {Array}
+  * @return {Number}
+  */
   columnLength: Ember.computed('columns', function () {
     return this.get('columns').length;
   }),
@@ -23,29 +59,115 @@ export default Ember.Component.extend({
     isFooter: true,
   },
 
-  // Model to be requested
+  /**
+  * Model to be requested using `makeRequest: true`.
+  *
+  * @property modelName
+  * @type String
+  * @default null
+  */
   modelName: null,
-  // Bind variable for table data
+  /**
+  * This is typically bound to the controller and is used to iterate over the table's model data.
+  *
+  * @property record
+  * @type Object
+  * @default null
+  */
   record: null,
+  /**
+  * This is typically bound to the controller and is used to construct the table headers.
+  *
+  * @property columns
+  * @type Array
+  * @default null
+  */
   columns: null,
 
   // pagination defaults
+  /**
+  * @property page
+  * @type Number
+  * @default 1
+  */
   page: 1,
+  /**
+  * Used in request to construct pagination.
+  *
+  * @property limit
+  * @type Number
+  * @default 10
+  */
   limit: 10,
+  /**
+  * Number passed to the pagination add-on.
+  *
+  * @property pageLimit
+  * @type Number
+  * @default 0
+  */
   pageLimit: 0,
+  /**
+  * Used in request to construct pagination.
+  *
+  * @property offset
+  * @type Number
+  * @default 0
+  */
   offset: 0,
+  /**
+  * @property sort
+  * @type String
+  * @default null
+  */
   sort: null,
+  /**
+  * @property filter
+  * @type Object
+  * @default null
+  */
   filter: null,
-  // If additional static params are required in requests
-  // expects Object {}
+  /**
+  * Object to pass in static query-params that will not change based on any filter/sort criteria.
+  * Additional table-wide filters that need to be applied in all requests. Typically bound to the controller.
+  *
+  * @property staticParams
+  * @type Object
+  * @default null
+  */
   staticParams: null,
 
   // State flags
+  /**
+  * @property isSuccess
+  * @type Boolean
+  * @default false
+  */
   isSuccess: false,
+  /**
+  * @property isFailure
+  * @type Boolean
+  * @default false
+  */
   isFailure: false,
+  /**
+  * @property isLoading
+  * @type Boolean
+  * @default false
+  */
   isLoading: false,
 
+  /**
+  * @property defaultSuccessMessage
+  * @type String
+  * @default 'Success!'
+  */
   defaultSuccessMessage: 'Success!',
+  /**
+  * @property defaultFailureMessage
+  * @type String
+  * @default 'There was an issue. Please check below for errors.'
+  */
   defaultFailureMessage: 'There was an issue. Please check below for errors.',
 
   // Messages
@@ -53,8 +175,22 @@ export default Ember.Component.extend({
   failureMessage: Ember.get(Ember.Component, 'defaultFailureMessage'),
 
   // For pushing any per field errors
+  /**
+  * Conforms to json:api spec: http://jsonapi.org/format/#errors
+  *
+  * @property errors
+  * @type Array
+  * @default null
+  */
   errors: null,
 
+  /**
+  * Used to serialize the parameters within `request`.
+  *
+  * @method serialize
+  * @param params {Object} An object of query parameters.
+  * @return params {Object} The serialized query parameters.
+  */
   serialize(params) {
     // Serialize Pagination
     params = this.serializePagination(params);
@@ -66,6 +202,16 @@ export default Ember.Component.extend({
     return params;
   },
 
+  /**
+  * Transform params related to pagination into API expected format.
+  * Follows json:api spec by default: http://jsonapi.org/format/#fetching-pagination.
+  * `offset` => `?page[offset]`.
+  * `limit` => `?page[limit]`.
+  *
+  * @method serializePagination
+  * @param params {Object} An object of query parameters.
+  * @return params {Object} The serialized pagination query parameters.
+  */
   serializePagination(params) {
     // Override to set dynamic offset based on page and limit
     params.offset = (params.page * params.limit) - params.limit;
@@ -83,6 +229,15 @@ export default Ember.Component.extend({
     return params;
   },
 
+  /**
+  * Transform params related to filtering into API expected format.
+  * Follows json:api spec by default: http://jsonapi.org/recommendations/#filtering.
+  * `?filter[lastName]` => `?filter[last-name]`.
+  *
+  * @method serializeFilter
+  * @param params {Object} An object of query parameters.
+  * @return params {Object} The serialized filter query parameters.
+  */
   serializeFilter(params) {
     // serialize filter query params
     const filter = params.filter;
@@ -103,13 +258,29 @@ export default Ember.Component.extend({
     return params;
   },
 
+  /**
+  * Transform params related to sorting into API expected format.
+  * Follows json:api spec by default: http://jsonapi.org/format/#fetching-sorting.
+  * `?sort=lastName` => `?sort=last-name`.
+  *
+  * @method serializeSort
+  * @param params {Object} An object of query parameters.
+  * @return params {Object} The serialized sort query parameters.
+  */
   serializeSort(params) {
     params.sort = this.serializeProperty(params.sort);
 
     return params;
   },
 
-
+  /**
+  * Follows json:api dasherized naming.
+  * `lastName` => `last-name`.
+  *
+  * @method serializeProperty
+  * @param property {String}
+  * @return property {String}
+  */
   serializeProperty(property) {
     if (property) {
       return Ember.String.dasherize(property);
@@ -118,6 +289,14 @@ export default Ember.Component.extend({
     return null;
   },
 
+  /**
+  * Used to normalize query parameters returned from `request` to components expected format.
+  *
+  * @method normalize
+  * @param data {Object} Data object returned from request.
+  * @param params {Object} The returned object of query parameters.
+  * @return data {Object}
+  */
   normalize(data, params) {
     // Normalize Pagination
     data = this.normalizePagination(data, params);
@@ -129,6 +308,16 @@ export default Ember.Component.extend({
     return data;
   },
 
+  /**
+  * Used to normalize pagination related query parameters returned from `request` to components expected format.
+  * `?page[offset]` => `offset`.
+  * `?page[limit]` => `limit`.
+  *
+  * @method normalizePagination
+  * @param data {Object} Data object returned from request.
+  * @param params {Object} The returned object of query parameters.
+  * @return data {Object}
+  */
   normalizePagination(data, params) {
     // pagination - return number of pages
     const pageLimit = Math.ceil(data.meta.total / params.page.limit);
@@ -142,6 +331,15 @@ export default Ember.Component.extend({
     return data;
   },
 
+  /**
+  * Used to normalize filter related query parameters returned from `request` to components expected format.
+  * `?filter[last-name]` => `filter[lastName]`.
+  * `?filter[user.first-name]` => `filter[user.firstName]`.
+  *
+  * @method normalizeFilter
+  * @param query {Object} The returned object of query parameters.
+  * @return query {Object}
+  */
   normalizeFilter(query) {
     // normalize filter[property-key]
     // into filter[propertyKey]
@@ -171,10 +369,26 @@ export default Ember.Component.extend({
     return query;
   },
 
+  /**
+  * Used to normalize sort related query parameters returned from `request` to components expected format.
+  * Expects json:api by default.
+  *
+  * @method normalizeSort
+  * @param query {Object} The returned object of query parameters.
+  * @return query {Object}
+  */
   normalizeSort(query) {
     return query;
   },
 
+  /**
+  * Used to normalize properties to components expected format.
+  * By default this will camelize the property.
+  *
+  * @method normalizeProperty
+  * @param property {String}
+  * @return property {String}
+  */
   normalizeProperty(property) {
     if (property) {
       return Ember.String.camelize(property);
@@ -183,12 +397,22 @@ export default Ember.Component.extend({
     return null;
   },
 
+  /**
+  * @method segmentProperty
+  * @param property {String}
+  * @return segments {Array}
+  */
   segmentProperty(property) {
     let segments = property.split('.');
 
     return segments;
   },
 
+  /**
+  * Determine if `record` is loaded using a number of different property checks.
+  *
+  * @method isrecordLoaded
+  */
   isrecordLoaded: Ember.computed('errors', 'record', 'record.isFulfilled', 'record.isLoaded',
   'modelName', function () {
     // If record array isLoaded but empty
@@ -215,6 +439,11 @@ export default Ember.Component.extend({
     return false;
   }),
 
+  /**
+  * Used in templates to determine if table header will allow filtering.
+  *
+  * @property isColumnFilters
+  */
   isColumnFilters: Ember.computed('columns', function () {
     const columns = this.get('columns');
 
@@ -227,6 +456,11 @@ export default Ember.Component.extend({
     return false;
   }),
 
+  /**
+  * Runs on init to setup the table header default columns.
+  *
+  * @method setColumnDefaults
+  */
   setColumnDefaults: Ember.on('init', function () {
     this.get('columns').map(function (column) {
       // if column does not have a sort property defined set to true
@@ -240,6 +474,11 @@ export default Ember.Component.extend({
     });
   }),
 
+  /**
+  * Runs on init to set the default sort param.
+  *
+  * @method defaultSort
+  */
   defaultSort: Ember.on('init', function () {
     this.get('columns').map(function (el) {
       if (el.hasOwnProperty('defaultSort')) {
@@ -248,6 +487,12 @@ export default Ember.Component.extend({
     }.bind(this));
   }),
 
+  /**
+  * Constructs the query object to be used in `request`.
+  *
+  * @property query
+  * @type Object
+  */
   query: Ember.computed('page', 'limit', 'offset', 'sort', 'filter.@each.value',
   'staticParams', function () {
     let query = {};
@@ -268,6 +513,13 @@ export default Ember.Component.extend({
     return query;
   }),
 
+  /**
+  * Make request to API for data.
+  *
+  * @method request
+  * @param params {Object} Serialized query parameters.
+  * @param modelName {String}
+  */
   request(params, modelName) {
     params = this.serialize(params);
 
@@ -287,6 +539,11 @@ export default Ember.Component.extend({
     );
   },
 
+  /**
+  * Sets the `record` after the `request` is resolved.
+  *
+  * @method setModel
+  */
   setModel: Ember.on('init', Ember.observer('query', 'makeRequest', function () {
     Ember.run.once(this, function () {
       // If makeRequest is false do not make request and setModel
@@ -311,6 +568,12 @@ export default Ember.Component.extend({
     },
   },
 
+  /**
+  * Sets the active sort property.
+  *
+  * @method setSort
+  * @param sortProperty {String}
+  */
   setSort: Ember.on('didInsertElement', function (sortProperty) {
     if (this.get('sort') || sortProperty) {
       let property;
@@ -333,6 +596,12 @@ export default Ember.Component.extend({
     }
   }),
 
+  /**
+  * Sets the proper classes on table headers when sorting.
+  *
+  * @method updateSortUI
+  * @param sortProperty {String}
+  */
   updateSortUI: Ember.on('didInsertElement', function (sortProperty) {
     if (this.get('sort') || sortProperty) {
       const _this = this;
@@ -364,6 +633,10 @@ export default Ember.Component.extend({
     }
   }),
 
+  /**
+  * @method failure
+  * @param response {Object}
+  */
   failure(response) {
     this.reset();
     this.setProperties({
@@ -377,6 +650,11 @@ export default Ember.Component.extend({
     }
   },
 
+  /**
+  * Resets all state specific properties.
+  *
+  * @method reset
+  */
   reset() {
     this.setProperties({
       isLoading: false,

From f2deae1751841d9abdf46f7c2af2f3ecccf86de1 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:46:00 -0400
Subject: [PATCH 03/19] Add comment blocks for alert component

Reference issue #53
---
 addon/components/ember-tabular-alert.js | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/addon/components/ember-tabular-alert.js b/addon/components/ember-tabular-alert.js
index 25b3be3..976bdc8 100644
--- a/addon/components/ember-tabular-alert.js
+++ b/addon/components/ember-tabular-alert.js
@@ -1,8 +1,26 @@
 import Ember from 'ember';
 
+/**
+* @class EmberTabularAlert
+*/
 export default Ember.Component.extend({
+  /**
+  * @property tagName
+  * @type String
+  * @default 'div'
+  */
   tagName: 'div',
+  /**
+  * @property type
+  * @type String
+  * @default 'info'
+  */
   type: 'info',
+  /**
+  * @property typeClass
+  * @type String
+  * @default 'alert-[type]'
+  */
   typeClass: Ember.computed('type', function () {
     return `alert-${this.get('type')}`;
   }),

From af8b5a2da564e5362d86e01b755e6219698721b1 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:47:14 -0400
Subject: [PATCH 04/19] Add comment blocks for date filter component

Reference issue #53
---
 addon/components/ember-tabular-date-filter.js | 49 +++++++++++++++++++
 1 file changed, 49 insertions(+)

diff --git a/addon/components/ember-tabular-date-filter.js b/addon/components/ember-tabular-date-filter.js
index 4baf014..de61fce 100644
--- a/addon/components/ember-tabular-date-filter.js
+++ b/addon/components/ember-tabular-date-filter.js
@@ -1,13 +1,49 @@
 import Ember from 'ember';
 
+/**
+* @class EmberTabularDateFilter
+*/
 export default Ember.Component.extend({
+  /**
+  * @property tagName
+  * @type String
+  * @default 'div'
+  */
   tagName: 'div',
   classNames: ['table-filter'],
   action: null,
+  /**
+  * Property to be filtered upon.
+  *
+  * @property filterProperty
+  * @type String
+  * @default null
+  */
   filterProperty: null,
+  /**
+  * Value of filter.
+  *
+  * @property dateFilter
+  * @type String
+  * @default ''
+  */
   dateFilter: '',
 
+  /**
+  * Pass the `query` object from the parent component if it is different or if used outside of the context of the component, otherwise `query` is optional and the component will attempt to grab within the context of the parent component.
+  *
+  * @property query
+  * @type Object
+  * @default null
+  */
   query: null,
+  /**
+  * Must expose the `filter` property on the parent ember-tabular component to be able to pass the filter object back and forth between parent and child components.
+  *
+  * @property filter
+  * @type Object
+  * @default null
+  */
   filter: null,
 
   actions: {
@@ -15,15 +51,28 @@ export default Ember.Component.extend({
       this.set('dateFilter', '');
     },
   },
+  /**
+  * Debounce the `filterName` method.
+  *
+  * @method filterTable
+  */
   filterTable: Ember.observer('dateFilter', function () {
     Ember.run.debounce(this, 'filterName', 750);
   }),
+  /**
+  * @property isClearable
+  */
   isClearable: Ember.computed('dateFilter', function () {
     if (this.get('dateFilter')) {
       return true;
     }
     return false;
   }),
+  /**
+  * Constructs and sets the `filter` Object.
+  *
+  * @method filterName
+  */
   filterName() {
     // Reference parent component query obj
     const query = this.get('query') || this.get('parentView.query');

From 388fca6766cc45639219b289d98e7c44ba1de025 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:47:22 -0400
Subject: [PATCH 05/19] Add comment blocks for dropdown filter component

Reference issue #53
---
 addon/components/ember-tabular-dropdown-filter.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/addon/components/ember-tabular-dropdown-filter.js b/addon/components/ember-tabular-dropdown-filter.js
index 82aded6..ff6dc75 100644
--- a/addon/components/ember-tabular-dropdown-filter.js
+++ b/addon/components/ember-tabular-dropdown-filter.js
@@ -1,3 +1,7 @@
 import EmberTabularGlobalFilter from './ember-tabular-global-filter';
 
+/**
+* @class EmberTabularDropdownFilter
+* @extends EmberTabularGlobalFilter
+*/
 export default EmberTabularGlobalFilter.extend();

From dee6051325714bb426c035c8fc16e298771f97ee Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:47:30 -0400
Subject: [PATCH 06/19] Add comment blocks for filter component

Reference issue #53
---
 addon/components/ember-tabular-filter.js | 45 ++++++++++++++++++++++++
 1 file changed, 45 insertions(+)

diff --git a/addon/components/ember-tabular-filter.js b/addon/components/ember-tabular-filter.js
index 666f010..2d280e6 100644
--- a/addon/components/ember-tabular-filter.js
+++ b/addon/components/ember-tabular-filter.js
@@ -1,11 +1,40 @@
 import Ember from 'ember';
 
+/**
+* @class EmberTabularFilter
+*/
 export default Ember.Component.extend({
+  /**
+  * @property tagName
+  * @type String
+  * @default 'th'
+  */
   tagName: 'th',
   action: null,
+  /**
+  * Value of filter.
+  *
+  * @property headerFilter
+  * @type String
+  * @default ''
+  */
   headerFilter: '',
 
+  /**
+  * Pass the `query` object from the parent component if it is different or if used outside of the context of the component, otherwise `query` is optional and the component will attempt to grab within the context of the parent component.
+  *
+  * @property query
+  * @type Object
+  * @default null
+  */
   query: null,
+  /**
+  * Must expose the `filter` property on the parent ember-tabular component to be able to pass the filter object back and forth between parent and child components.
+  *
+  * @property filter
+  * @type Object
+  * @default null
+  */
   filter: null,
 
   actions: {
@@ -20,15 +49,26 @@ export default Ember.Component.extend({
       }
     },
   },
+  /**
+  * Debounce the `filterName` method.
+  *
+  * @method filterBy
+  */
   filterBy: Ember.observer('headerFilter', function () {
     Ember.run.debounce(this, 'filterName', 750);
   }),
+  /**
+  * @property isClearable
+  */
   isClearable: Ember.computed('headerFilter', function () {
     if (this.get('headerFilter')) {
       return true;
     }
     return false;
   }),
+  /**
+  * @property inputPlaceholder
+  */
   inputPlaceholder: Ember.computed('header.type', function () {
     const type = this.get('header.type');
 
@@ -36,6 +76,11 @@ export default Ember.Component.extend({
       return 'YYYY-MM-DD';
     }
   }),
+  /**
+  * Constructs and sets the `filter` Object.
+  *
+  * @method filterName
+  */
   filterName() {
     const query = this.get('query');
     const property = this.get('property');

From bd7b26d655fe0d7bcdc5491ccaeeac0d6548157b Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 14:47:38 -0400
Subject: [PATCH 07/19] Add comment blocks for global filter component

Reference issue #53
---
 .../components/ember-tabular-global-filter.js | 49 +++++++++++++++++++
 1 file changed, 49 insertions(+)

diff --git a/addon/components/ember-tabular-global-filter.js b/addon/components/ember-tabular-global-filter.js
index bcc5371..3c07aad 100644
--- a/addon/components/ember-tabular-global-filter.js
+++ b/addon/components/ember-tabular-global-filter.js
@@ -1,13 +1,49 @@
 import Ember from 'ember';
 
+/**
+* @class EmberTabularGlobalFilter
+*/
 export default Ember.Component.extend({
+  /**
+  * @property tagName
+  * @type String
+  * @default 'div'
+  */
   tagName: 'div',
   classNames: ['table-filter'],
   action: null,
+  /**
+  * Property to be filtered upon.
+  *
+  * @property filterProperty
+  * @type String
+  * @default null
+  */
   filterProperty: null,
+  /**
+  * Value of filter.
+  *
+  * @property searchFilter
+  * @type String
+  * @default ''
+  */
   searchFilter: '',
 
+  /**
+  * Pass the `query` object from the parent component if it is different or if used outside of the context of the component, otherwise `query` is optional and the component will attempt to grab within the context of the parent component.
+  *
+  * @property query
+  * @type Object
+  * @default null
+  */
   query: null,
+  /**
+  * Must expose the `filter` property on the parent ember-tabular component to be able to pass the filter object back and forth between parent and child components.
+  *
+  * @property filter
+  * @type Object
+  * @default null
+  */
   filter: null,
 
   actions: {
@@ -15,15 +51,28 @@ export default Ember.Component.extend({
       this.set('searchFilter', '');
     },
   },
+  /**
+  * Debounce the `filterName` method.
+  *
+  * @method filterTable
+  */
   filterTable: Ember.observer('searchFilter', function () {
     Ember.run.debounce(this, 'filterName', 750);
   }),
+  /**
+  * @property isClearable
+  */
   isClearable: Ember.computed('searchFilter', function () {
     if (this.get('searchFilter')) {
       return true;
     }
     return false;
   }),
+  /**
+  * Constructs and sets the `filter` Object.
+  *
+  * @method filterName
+  */
   filterName() {
     // Reference parent component query obj
     const query = this.get('query') || this.get('parentView.query');

From 34b0da2d54ec2dd9c7df02f56f6fb1fd93ebcff3 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 16:40:35 -0400
Subject: [PATCH 08/19] Add examples to methods

---
 addon/components/ember-tabular.js | 96 ++++++++++++++++++++++++++++++-
 1 file changed, 95 insertions(+), 1 deletion(-)

diff --git a/addon/components/ember-tabular.js b/addon/components/ember-tabular.js
index 8517726..8acf9f9 100644
--- a/addon/components/ember-tabular.js
+++ b/addon/components/ember-tabular.js
@@ -1,6 +1,62 @@
 import Ember from 'ember';
 
 /**
+* ### Template
+  ```hbs
+  {{! app/templates/my-route.hbs }}
+
+  {{#ember-tabular columns=columns modelName="user" record=users as |section|}}
+      {{#if section.isBody}}
+          {{#each users as |row|}}
+              <tr>
+                  <td>{{row.username}}</td>
+                  <td>{{row.emailAddress}}</td>
+                  <td>{{row.firstName}}</td>
+                  <td>{{row.lastName}}</td>
+                  <td>
+                      {{#link-to "index" class="btn btn-xs" role="button"}}
+                          Edit
+                      {{/link-to}}
+                  </td>
+              </tr>
+          {{/each}}
+      {{/if}}
+  {{/ember-tabular}}
+  ```
+* ### Controller
+* Setup the columns array, which is how the table headers are constructed, `label` is required in all cases.
+  ```js
+  // app/controllers/my-route.js
+
+  export default Ember.Controller.extend({
+    users: null,
+    columns: [
+      {
+        property: 'username',
+        label: 'Username',
+        defaultSort: 'username',
+      },
+      {
+        property: 'emailAddress',
+        label: 'Email',
+      },
+      {
+        property: 'firstName',
+        label: 'First Name',
+      },
+      {
+        property: 'lastName',
+        label: 'Last Name',
+      },
+      {
+        property: 'updatedAt',
+        label: 'Last Updated',
+        type: 'date',
+      },
+    ],
+  });
+  ```
+*
 * @class EmberTabular
 */
 export default Ember.Component.extend({
@@ -130,6 +186,19 @@ export default Ember.Component.extend({
   /**
   * Object to pass in static query-params that will not change based on any filter/sort criteria.
   * Additional table-wide filters that need to be applied in all requests. Typically bound to the controller.
+  ```js
+  // app/controllers/location.js
+
+  export default Ember.Controller.extend({
+    staticParams: Ember.computed('model', function() {
+      return {
+        'filter[is-open]': '1',
+        include: 'hours',
+      };
+    }),
+    ...
+  });
+  ```
   *
   * @property staticParams
   * @type Object
@@ -205,9 +274,29 @@ export default Ember.Component.extend({
   /**
   * Transform params related to pagination into API expected format.
   * Follows json:api spec by default: http://jsonapi.org/format/#fetching-pagination.
+  *
   * `offset` => `?page[offset]`.
+  *
   * `limit` => `?page[limit]`.
   *
+  * If you are not using Ember Data then you can extend this addon's component and override a set of serialize and normalized methods:
+  ```js
+  import EmberTabular from 'ember-tabular/components/ember-tabular';
+
+  export default EmberTabular.extend({
+      serializePagination(params) {
+          // override default pagination ?page[offset]= and ?[page]limit=
+          // offset and limit will be sent as ?offset= and ?limit=
+          params.offset = (params.page * params.limit) - params.limit;
+          if (isNaN(params.offset)) {
+              params.offset = null;
+          }
+
+          return params;
+      },
+  });
+  ```
+  *
   * @method serializePagination
   * @param params {Object} An object of query parameters.
   * @return params {Object} The serialized pagination query parameters.
@@ -411,7 +500,8 @@ export default Ember.Component.extend({
   /**
   * Determine if `record` is loaded using a number of different property checks.
   *
-  * @method isrecordLoaded
+  * @property isrecordLoaded
+  * @type Function
   */
   isrecordLoaded: Ember.computed('errors', 'record', 'record.isFulfilled', 'record.isLoaded',
   'modelName', function () {
@@ -443,6 +533,9 @@ export default Ember.Component.extend({
   * Used in templates to determine if table header will allow filtering.
   *
   * @property isColumnFilters
+  * @type Boolean
+  * @return {Boolean}
+  * @default false
   */
   isColumnFilters: Ember.computed('columns', function () {
     const columns = this.get('columns');
@@ -492,6 +585,7 @@ export default Ember.Component.extend({
   *
   * @property query
   * @type Object
+  * @return {Object}
   */
   query: Ember.computed('page', 'limit', 'offset', 'sort', 'filter.@each.value',
   'staticParams', function () {

From 7f82db3ff814734498fff0127b7ad87a3b1d5308 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Mon, 11 Jul 2016 17:04:35 -0400
Subject: [PATCH 09/19] Add additional examples for overriding methods

Reference issue #53
---
 addon/components/ember-tabular.js | 38 +++++++++++++++++++++++--------
 1 file changed, 28 insertions(+), 10 deletions(-)

diff --git a/addon/components/ember-tabular.js b/addon/components/ember-tabular.js
index 8acf9f9..1f0ae15 100644
--- a/addon/components/ember-tabular.js
+++ b/addon/components/ember-tabular.js
@@ -284,16 +284,16 @@ export default Ember.Component.extend({
   import EmberTabular from 'ember-tabular/components/ember-tabular';
 
   export default EmberTabular.extend({
-      serializePagination(params) {
-          // override default pagination ?page[offset]= and ?[page]limit=
-          // offset and limit will be sent as ?offset= and ?limit=
-          params.offset = (params.page * params.limit) - params.limit;
-          if (isNaN(params.offset)) {
-              params.offset = null;
-          }
-
-          return params;
-      },
+    serializePagination(params) {
+      // override default pagination ?page[offset]= and ?[page]limit=
+      // offset and limit will be sent as ?offset= and ?limit=
+      params.offset = (params.page * params.limit) - params.limit;
+      if (isNaN(params.offset)) {
+        params.offset = null;
+      }
+
+      return params;
+    },
   });
   ```
   *
@@ -366,6 +366,24 @@ export default Ember.Component.extend({
   * Follows json:api dasherized naming.
   * `lastName` => `last-name`.
   *
+  * If you are not supporting json:api's dasherized properties this can be extended to support other conventions:
+  ```js
+  import EmberTabular from 'ember-tabular/components/ember-tabular';
+
+  export default EmberTabular.extend({
+    serializeProperty(property) {
+      // Override to convert all properties sent in requests to camelize instead of the default dasherized
+      // ?filter[lastName]&sort=isAdmin
+      // (pseudo code)
+      if (property) {
+        return Ember.String.camelize(property);
+      }
+
+      return null;
+    },
+  });
+  ```
+  *
   * @method serializeProperty
   * @param property {String}
   * @return property {String}

From fa387857cdf683c1047aeea5acf362548b8dc3b3 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 12:56:21 -0400
Subject: [PATCH 10/19] Move/add documenation within the YuiDocs comments

Reference issue #53
---
 addon/components/ember-tabular-date-filter.js | 10 ++
 .../ember-tabular-dropdown-filter.js          | 43 +++++++++
 .../components/ember-tabular-global-filter.js | 12 +++
 addon/components/ember-tabular.js             | 92 ++++++++++++++++++-
 4 files changed, 156 insertions(+), 1 deletion(-)

diff --git a/addon/components/ember-tabular-date-filter.js b/addon/components/ember-tabular-date-filter.js
index de61fce..97ce951 100644
--- a/addon/components/ember-tabular-date-filter.js
+++ b/addon/components/ember-tabular-date-filter.js
@@ -1,6 +1,15 @@
 import Ember from 'ember';
 
 /**
+* Date filter changes `input type="date"` to take advantage of a browser's HTML5 date widget. Typically the date filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`. However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
+*
+* - Sent in request as: `?filter[filterProperty]=dateFilter`, e.g. `?filter[updated-at]=2015-06-29`
+```hbs
+{{ember-tabular-date-filter
+    filter=filter
+    filterProperty="updatedAt"
+    label="Last Updated"}}
+```
 * @class EmberTabularDateFilter
 */
 export default Ember.Component.extend({
@@ -61,6 +70,7 @@ export default Ember.Component.extend({
   }),
   /**
   * @property isClearable
+  * @default false
   */
   isClearable: Ember.computed('dateFilter', function () {
     if (this.get('dateFilter')) {
diff --git a/addon/components/ember-tabular-dropdown-filter.js b/addon/components/ember-tabular-dropdown-filter.js
index ff6dc75..de7bf7a 100644
--- a/addon/components/ember-tabular-dropdown-filter.js
+++ b/addon/components/ember-tabular-dropdown-filter.js
@@ -1,6 +1,49 @@
 import EmberTabularGlobalFilter from './ember-tabular-global-filter';
 
 /**
+* ## Dropdown Filter
+* Use the dropdown filter globally. One way to do this is by setting up a computed property that returns an array of label/value objects.
+```js
+export default Ember.Controller.extend({
+  users: null,
+  actions: {
+    setIsAdminFilter(object) {
+      if (object) {
+        this.set('isAdminFilter', object.value);
+      } else {
+        this.set('isAdminFilter', null);
+      }
+    },
+  },
+  adminContent: Ember.computed(function() {
+    return [
+      {
+        label: 'Yes',
+        value: true,
+      },
+      {
+        label: 'No',
+        value: false,
+      }
+    ];
+  }),
+});
+```
+```hbs
+{{#ember-tabular-dropdown-filter filter=filter filterProperty="isAdmin" label="Is Admin" searchFilter=isAdminFilter}}
+    {{#power-select
+        options=adminContent
+        selected=(find-by adminContent 'value' isAdminFilter)
+        searchField="label"
+        searchEnabled=false
+        placeholder="Select to filter"
+        onchange=(action "setIsAdminFilter")
+        as |option|}}
+            {{option.label}}
+    {{/power-select}}
+{{/ember-tabular-dropdown-filter}}
+```
+*
 * @class EmberTabularDropdownFilter
 * @extends EmberTabularGlobalFilter
 */
diff --git a/addon/components/ember-tabular-global-filter.js b/addon/components/ember-tabular-global-filter.js
index 3c07aad..8c59daa 100644
--- a/addon/components/ember-tabular-global-filter.js
+++ b/addon/components/ember-tabular-global-filter.js
@@ -1,6 +1,17 @@
 import Ember from 'ember';
 
 /**
+* ## Global Filter
+* Typically the global filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`. However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
+
+* - Sent in request as: `?filter[filterProperty]=searchFilter`, e.g. `?filter[username]=John.Doe2`
+```hbs
+{{ember-tabular-global-filter
+    filter=filter
+    filterProperty="username"
+    filterPlaceholder="Search by Username"}}
+```
+*
 * @class EmberTabularGlobalFilter
 */
 export default Ember.Component.extend({
@@ -61,6 +72,7 @@ export default Ember.Component.extend({
   }),
   /**
   * @property isClearable
+  * @default false
   */
   isClearable: Ember.computed('searchFilter', function () {
     if (this.get('searchFilter')) {
diff --git a/addon/components/ember-tabular.js b/addon/components/ember-tabular.js
index 1f0ae15..d12ca89 100644
--- a/addon/components/ember-tabular.js
+++ b/addon/components/ember-tabular.js
@@ -1,6 +1,10 @@
 import Ember from 'ember';
 
 /**
+* ## Basic Usage
+* - `columns` - Controller array to setup the table headers/columns (detailed below).
+  - `modelName` - for the component to make the proper request when filtering/sorting, you must pass the model type matching your Ember model structure. e.g. brand/diagram, product.
+  - `record` - this is bound to the controller and is used to iterate over the table's model data.
 * ### Template
   ```hbs
   {{! app/templates/my-route.hbs }}
@@ -86,6 +90,24 @@ export default Ember.Component.extend({
   */
   sortableClass: 'sortable',
   /**
+  * @property tableWrapperClass
+  * @type String
+  * @default ''
+  */
+  tableWrapperClass: '',
+  /**
+  * @property tableClass
+  * @type String
+  * @default 'table-bordered table-hover'
+  */
+  tableClass: 'table-bordered table-hover',
+  /**
+  * @property paginationWrapperClass
+  * @type String
+  * @default ''
+  */
+  paginationWrapperClass: '',
+  /**
   * Once the `isRecordLoaded` is determined if true and no data exists then this is displayed.
   *
   * @property tableLoadedMessage
@@ -132,7 +154,67 @@ export default Ember.Component.extend({
   */
   record: null,
   /**
-  * This is typically bound to the controller and is used to construct the table headers.
+  * This is typically setup on the controller and passed into the component, and is used to construct the table headers/filtering.
+  *
+  ```js
+  export default Ember.Controller.extend({
+    users: null,
+    columns: [
+      {
+        property: 'username',
+        label: 'Username',
+        defaultSort: 'username',
+      },
+      {
+        property: 'emailAddress',
+        label: 'Email',
+      },
+      {
+        property: 'firstName',
+        label: 'First Name',
+        sort: false,
+      },
+      {
+        property: 'isAdmin',
+        label: 'Is Admin',
+        list: [
+          {
+            label: 'Yes',
+            value: true,
+          },
+          {
+            label: 'No',
+            value: false,
+          }
+        ],
+      },
+      {
+        property: 'updatedAt',
+        label: 'Last Updated',
+        type: 'date',
+      },
+      {
+        label: 'Actions',
+      },
+    ],
+  });
+  ```
+  *
+  - `columns.property` - {String}
+    - Required for column filtering/sorting
+    - Properties should be in camelCase format
+  - `columns.label` - {String}
+    - Required in all use-cases
+  - `columns.type` - {String} - Default: text
+    - Sets the filter `<input type="">`
+  - `columns.sort` - {Boolean} - Default: `true`
+    - Required for column sorting
+  - `columns.list` - {Array} - Default: `null` - Filtering the column based on a dropdown list.
+    - `list.label` - Displayed to the user for selection.
+    - `list.value` - Value that is sent in the request.
+  - `columns.defaultSort` - {String}
+    - Initial sort value for API request
+    - Will be overridden with any sorting changes
   *
   * @property columns
   * @type Array
@@ -199,6 +281,14 @@ export default Ember.Component.extend({
     ...
   });
   ```
+
+  ```hbs
+  {{! app/templates/my-route.hbs }}
+
+  {{#ember-tabular columns=columns modelName="user" record=users staticParams=staticParams as |section|}}
+    ...
+  {{/ember-tabular}}
+  ```
   *
   * @property staticParams
   * @type Object

From 5b33795925a054e6b1fbae3749845cfe5632570b Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 12:58:14 -0400
Subject: [PATCH 11/19] Trim the readme for any duplicate or unncessary
 documentation

Reference issue #53
---
 README.md | 172 +++---------------------------------------------------
 1 file changed, 8 insertions(+), 164 deletions(-)

diff --git a/README.md b/README.md
index e79089f..98d8ff5 100644
--- a/README.md
+++ b/README.md
@@ -34,6 +34,7 @@ You have full control over your table's `tbody` content. We are setting this to
                 <td>{{row.emailAddress}}</td>
                 <td>{{row.firstName}}</td>
                 <td>{{row.lastName}}</td>
+                <td>{{row.updatedAt}}</td>
                 <td>
                     {{#link-to "index" class="btn btn-xs" role="button"}}
                         Edit
@@ -75,10 +76,15 @@ export default Ember.Controller.extend({
             label: 'Last Updated',
             type: 'date',
         },
+        {
+            label: 'Actions',
+        },
     ],
 });
 ```
 
+* Reference the [API specs/documentation](/docs/index.html) for more information.
+
 ### Request Format
 Ember Tabular sticks very closely to jsonapi spec, a few examples of requests:
 
@@ -90,92 +96,7 @@ Ember Tabular sticks very closely to jsonapi spec, a few examples of requests:
   * `sort` - Sort based on jsonapi's recommended sorting: http://jsonapi.org/format/#fetching-sorting
     * Ascending unless prefixed with `-` for descending. 
 
-## Advanced Usage
-### Template
-```hbs
-{{#ember-tabular 
-    columns=columns 
-    modelName="user" 
-    record=users 
-    class="table-default" 
-    tableClass="table-bordered table-hover table-striped" 
-    staticParams=staticParams 
-    as |section|}}
-    ...
-{{/ember-tabular}}
-```
-* `makeRequest` - boolean/string - Default: true
-  * If `true`: Ember Tabular will make request based on `modelName`.
-  * If `false`: Typically you'd bind the route's model to `record`.
-* `class` - string
-  * Wraps the entire component.
-* `tableClass` - string - Default: "table-bordered table-hover"
-  * Wraps only the `<table>` and replaces defaults if provided.
-* `staticParams` - object - Default: null
-  * Object to pass in static query-params that will not change based on any filter/sort criteria, ex. additional table-wide filters that need to be applied in all requests `?filter[is-open]=1`.
-
-      ```js
-      // app/controllers/location.js
-
-      export default Ember.Controller.extend({
-          staticParams: Ember.computed('model', function() {
-              return {
-                  'filter[is-open]': '1',
-                  'include': 'hours',
-              };
-          }),
-          ...
-      });
-      ```
-* `tableLoadedMessage` - string - Default: "No Data."
-  * In some cases when the API response is loaded but does not contain any data "No Data." will not apply, on a case by case basis you can override this. For example, if you'd like to prompt the user to do some kind of action. "No data, select a different product".
-
-### Controller
-```js
-export default Ember.Controller.extend({
-    users: null,
-    columns: [
-        {
-            property: 'username',
-            label: 'Username',
-            defaultSort: 'username',
-            type: 'text',
-        },
-        {
-            property: 'emailAddress',
-            label: 'Email',
-            type: 'text',
-        },
-        {
-            property: 'firstName',
-            label: 'First Name',
-            type: 'text',
-        },
-        {
-            property: 'lastName',
-            label: 'Last Name',
-            type: 'text',
-        },
-        {
-            property: 'updatedAt',
-            label: 'Last Updated',
-            type: 'date',
-        },
-    ],
-});
-```
-* `columns.property` - string
-  * Required for column filtering/sorting
-  * Properties should be in camelCase format
-* `columns.label` - string
-  * Required in all use-cases
-* `columns.type` - string - Default: text
-  * Sets the filter `<input type="">`
-* `columns.sort` - boolean - Default: true
-  * Required for column sorting
-* `columns.defaultSort` - string
-  * Initial sort value for API request
-  * Will be overridden with any sorting changes
+## Misc Notables
 
 ### Template - Yields
 ```hbs
@@ -206,26 +127,6 @@ Typically the global filter component would be rendered into the `{{yield header
     filterProperty="username" 
     filterPlaceholder="Search by Username"}}
 ```
-* `filter` - object - Default: null
-  * Required
-  * Must also expose the `filter` property on the parent `ember-tabular` component to be able to pass the `filter` object back and forth between parent and child components.
-* `query` - object - Default: `this.get('query') || this.get('parentView.query')`
-  * Pass the query object from the parent component if it is different or if used outside of the context of the component, otherwise query is optional and it component will attempt to grab within the context of the parent component.
-* `filterProperty` - string - Default: null
-  * Required
-  * Used with the "Global Filter Sub-Component".
-  * Pass the property name in camelCase format.
-* `filterPlaceholder` - string - Default: null
-  * Optional
-  * Placeholder to be used for the global-filter.
-* `label` - string - Default: null
-  * Optional
-  * Set a label on the global-filter.
-* `inputClass` - string - Default: null
-  * Optional
-  * Wraps the input field in a div.
-* `labelClass` - string - Default: null
-  * Optional
 
 #### Date Filter
 Date filter changes `input type="date"` to take advantage of a browser's HTML5 date widget. Typically the date filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`. However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
@@ -237,26 +138,6 @@ Date filter changes `input type="date"` to take advantage of a browser's HTML5 d
     filterProperty="updatedAt" 
     label="Last Updated"}}
 ```
-* `filter` - object - Default: null
-  * Required
-  * Must also expose the `filter` property on the parent `ember-tabular` component to be able to pass the `filter` object back and forth between parent and child components.
-* `query` - object - Default: `this.get('query') || this.get('parentView.query')`
-  * Pass the query object from the parent component if it is different or if used outside of the context of the component, otherwise query is optional and it component will attempt to grab within the context of the parent component.
-* `filterProperty` - string - Default: null
-  * Required
-  * Used with the "Global Filter Sub-Component".
-  * Pass the property name in camelCase format.
-* `dateFilter` - string - Default: null
-  * Optional
-  * Sets the input value.
-* `label` - string - Default: null
-  * Optional
-  * Set a label on the global-filter.
-* `inputClass` - string - Default: null
-  * Optional
-  * Wraps the input field in a div.
-* `labelClass` - string - Default: null
-  * Optional
 
 ## Note
 * This component adheres to jsonapi spec: http://jsonapi.org/
@@ -274,44 +155,7 @@ If you are using Ember Data, then you can lean on your application's custom adap
 * Filtering
   * This addon expects a `filter` object with nested property/value pairs.
 
-If you are not using Ember Data then you can extend this addon's component and override a set of serialize and normalized methods:
-```js
-import EmberTabular from 'ember-tabular/components/ember-tabular';
-
-export default EmberTabular.extend({
-    serializePagination(params) {
-        // override default pagination ?page[offset]= and ?[page]limit=
-        // offset and limit will be sent as ?offset= and ?limit=
-        params.offset = (params.page * params.limit) - params.limit;
-        if (isNaN(params.offset)) {
-            params.offset = null;
-        }
-
-        return params;
-    },
-});
-```
-```js
-import EmberTabular from 'ember-tabular/components/ember-tabular';
-
-export default EmberTabular.extend({
-    serializeProperty(property) {
-        // Override to convert all properties sent in requests to camelize instead of the default dasherized
-        // ?filter[lastName]&sort=isAdmin
-        // (pseudo code)
-        if (property) {
-            return Ember.String.camelize(property);
-        }
-
-        return null;
-    },
-});
-```
-Check add-on source for full list of serialized/normalized methods available for extension.
-Note:
-
-* On success you must set the `record` with the array of table data
-
+If you are not using Ember Data or following json:api then you can extend this component and override a set of serialize and normalized methods, checkout the [API specs/documentation](/docs/index.html) for more details/examples.
 
 # Contributing to this addon
 ## Installation

From 4aa60a5c56d853e7eaca42c966939d6988f4d0ff Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 13:04:06 -0400
Subject: [PATCH 12/19] Add documentation for dropdown filter to readme

---
 README.md | 47 ++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 46 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 98d8ff5..39443fc 100644
--- a/README.md
+++ b/README.md
@@ -83,7 +83,7 @@ export default Ember.Controller.extend({
 });
 ```
 
-* Reference the [API specs/documentation](/docs/index.html) for more information.
+* Reference the [API specs/documentation](/docs/index.html) for more information and for advanced usage.
 
 ### Request Format
 Ember Tabular sticks very closely to jsonapi spec, a few examples of requests:
@@ -139,6 +139,51 @@ Date filter changes `input type="date"` to take advantage of a browser's HTML5 d
     label="Last Updated"}}
 ```
 
+#### Dropdown Filter
+Use the dropdown filter globally. One way to do this is by setting up a computed property that returns an array of label/value objects.
+
+```js
+export default Ember.Controller.extend({
+  users: null,
+  actions: {
+    setIsAdminFilter(object) {
+      if (object) {
+        this.set('isAdminFilter', object.value);
+      } else {
+        this.set('isAdminFilter', null);
+      }
+    },
+  },
+  adminContent: Ember.computed(function() {
+    return [
+      {
+        label: 'Yes',
+        value: true,
+      },
+      {
+        label: 'No',
+        value: false,
+      }
+    ];
+  }),
+});
+```
+```hbs
+{{#ember-tabular-dropdown-filter filter=filter filterProperty="isAdmin" label="Is Admin" searchFilter=isAdminFilter}}
+    {{#power-select
+        options=adminContent
+        selected=(find-by adminContent 'value' isAdminFilter)
+        searchField="label"
+        searchEnabled=false
+        placeholder="Select to filter"
+        onchange=(action "setIsAdminFilter")
+        as |option|}}
+            {{option.label}}
+    {{/power-select}}
+{{/ember-tabular-dropdown-filter}}
+```
+
+
 ## Note
 * This component adheres to jsonapi spec: http://jsonapi.org/
 * This component expects jsonapi error format: http://jsonapi.org/format/#error-objects

From 30372bf8e8a0f98867ce648d0207e18af92a463f Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 13:06:36 -0400
Subject: [PATCH 13/19] Update change log

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 173e581..870a3e3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 - Adds ability to filter column/table using a dropdown.
 - Adds feature that allows ember-tabular to wait until controller is ready for request to fire.
 - Add additional configurable wrapper classes for additional styling.
+- Add support for YuiDocs for better API documentation.
 
 ### Changed
 - Update legacy name references in README.md.

From 0c9ae543f520706f5efa25603f155f47aced394e Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 13:22:08 -0400
Subject: [PATCH 14/19] Change the theme and tweak documentation

---
 addon/components/ember-tabular-alert.js         | 2 ++
 addon/components/ember-tabular-date-filter.js   | 5 ++++-
 addon/components/ember-tabular-filter.js        | 2 ++
 addon/components/ember-tabular-global-filter.js | 4 +++-
 package.json                                    | 9 +++++----
 yuidoc.json                                     | 4 +++-
 6 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/addon/components/ember-tabular-alert.js b/addon/components/ember-tabular-alert.js
index 976bdc8..9f70d56 100644
--- a/addon/components/ember-tabular-alert.js
+++ b/addon/components/ember-tabular-alert.js
@@ -1,6 +1,8 @@
 import Ember from 'ember';
 
 /**
+* Any errors returned from the request(s) are displayed in an alert box.
+*
 * @class EmberTabularAlert
 */
 export default Ember.Component.extend({
diff --git a/addon/components/ember-tabular-date-filter.js b/addon/components/ember-tabular-date-filter.js
index 97ce951..1804b69 100644
--- a/addon/components/ember-tabular-date-filter.js
+++ b/addon/components/ember-tabular-date-filter.js
@@ -1,7 +1,10 @@
 import Ember from 'ember';
 
 /**
-* Date filter changes `input type="date"` to take advantage of a browser's HTML5 date widget. Typically the date filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`. However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
+* ## Date Filter
+* Date filter changes `input type="date"` to take advantage of a browser's HTML5 date widget. Typically the date filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`.
+*
+* However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
 *
 * - Sent in request as: `?filter[filterProperty]=dateFilter`, e.g. `?filter[updated-at]=2015-06-29`
 ```hbs
diff --git a/addon/components/ember-tabular-filter.js b/addon/components/ember-tabular-filter.js
index 2d280e6..f380290 100644
--- a/addon/components/ember-tabular-filter.js
+++ b/addon/components/ember-tabular-filter.js
@@ -1,6 +1,8 @@
 import Ember from 'ember';
 
 /**
+* Filtering on a column by column basis within the component's `<table/>`.
+*
 * @class EmberTabularFilter
 */
 export default Ember.Component.extend({
diff --git a/addon/components/ember-tabular-global-filter.js b/addon/components/ember-tabular-global-filter.js
index 8c59daa..b828ca4 100644
--- a/addon/components/ember-tabular-global-filter.js
+++ b/addon/components/ember-tabular-global-filter.js
@@ -2,7 +2,9 @@ import Ember from 'ember';
 
 /**
 * ## Global Filter
-* Typically the global filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`. However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
+* Typically the global filter component would be rendered into the `{{yield header}}` of the main table component using the yield conditional `{{#if section.isHeader}} ...`.
+*
+* However, it can be used outside of the context of the main component if the proper properties are shared between the main component and sub-component.
 
 * - Sent in request as: `?filter[filterProperty]=searchFilter`, e.g. `?filter[username]=John.Doe2`
 ```hbs
diff --git a/package.json b/package.json
index 4b62376..9dc3b40 100644
--- a/package.json
+++ b/package.json
@@ -57,12 +57,13 @@
     "json api"
   ],
   "dependencies": {
+    "broccoli-funnel": "^1.0.0",
+    "broccoli-merge-trees": "^0.2.3",
     "ember-cli-babel": "^5.1.5",
-    "pagination-pager": "2.4.1",
-    "ember-truth-helpers": "1.2.0",
     "ember-power-select": "0.10.10",
-    "broccoli-merge-trees": "^0.2.3",
-    "broccoli-funnel": "^1.0.0"
+    "ember-truth-helpers": "1.2.0",
+    "pagination-pager": "2.4.1",
+    "yuidoc-bootstrap-theme": "^1.0.6"
   },
   "ember-addon": {
     "configPath": "tests/dummy/config"
diff --git a/yuidoc.json b/yuidoc.json
index 9787bd7..09ab1e9 100644
--- a/yuidoc.json
+++ b/yuidoc.json
@@ -12,6 +12,8 @@
     "linkNatives": true,
     "quiet": true,
     "parseOnly": false,
-    "lint": false
+    "lint": false,
+    "themedir" : "node_modules/yuidoc-bootstrap-theme",
+    "helpers" : [ "node_modules/yuidoc-bootstrap-theme/helpers/helpers.js" ]
   }
 }
\ No newline at end of file

From 8255201de0733da371209405da35f14680ae046a Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 13:23:55 -0400
Subject: [PATCH 15/19] Change heading on readme

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 39443fc..b50ea26 100644
--- a/README.md
+++ b/README.md
@@ -96,7 +96,7 @@ Ember Tabular sticks very closely to jsonapi spec, a few examples of requests:
   * `sort` - Sort based on jsonapi's recommended sorting: http://jsonapi.org/format/#fetching-sorting
     * Ascending unless prefixed with `-` for descending. 
 
-## Misc Notables
+## Misc
 
 ### Template - Yields
 ```hbs

From f812c1f569c2aea340ac2e5ab712ebaa6b48b76c Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Thu, 14 Jul 2016 23:51:54 -0400
Subject: [PATCH 16/19] Added ember-cli-github-pages addon

---
 package.json                      | 1 +
 tests/dummy/config/environment.js | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/package.json b/package.json
index 9dc3b40..d80b0df 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "ember-cli": "2.4.2",
     "ember-cli-app-version": "^1.0.0",
     "ember-cli-dependency-checker": "^1.2.0",
+    "ember-cli-github-pages": "0.1.0",
     "ember-cli-htmlbars": "^1.0.1",
     "ember-cli-htmlbars-inline-precompile": "^0.3.1",
     "ember-cli-inject-live-reload": "^1.3.1",
diff --git a/tests/dummy/config/environment.js b/tests/dummy/config/environment.js
index c59bcd5..cf8434f 100644
--- a/tests/dummy/config/environment.js
+++ b/tests/dummy/config/environment.js
@@ -40,6 +40,8 @@ module.exports = function(environment) {
   }
 
   if (environment === 'production') {
+    ENV.locationType = 'hash';
+    ENV.baseURL = '/ember-tabular/';
 
   }
 

From 64e56e094862661b8b7cc6451d4fcc3492f399d8 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Fri, 15 Jul 2016 00:13:26 -0400
Subject: [PATCH 17/19] Enable mirage on production and setup demoURL

Reference issue #56
---
 package.json                      | 3 ++-
 tests/dummy/config/environment.js | 3 +++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index d80b0df..dc4bc00 100644
--- a/package.json
+++ b/package.json
@@ -67,6 +67,7 @@
     "yuidoc-bootstrap-theme": "^1.0.6"
   },
   "ember-addon": {
-    "configPath": "tests/dummy/config"
+    "configPath": "tests/dummy/config",
+    "demoURL": "http://caxiam.github.io/ember-tabular/"
   }
 }
diff --git a/tests/dummy/config/environment.js b/tests/dummy/config/environment.js
index cf8434f..6b2d9a0 100644
--- a/tests/dummy/config/environment.js
+++ b/tests/dummy/config/environment.js
@@ -43,6 +43,9 @@ module.exports = function(environment) {
     ENV.locationType = 'hash';
     ENV.baseURL = '/ember-tabular/';
 
+    ENV['ember-cli-mirage'] = {
+      enabled: true
+    };
   }
 
   return ENV;

From 2cc12f9b4ace31591e8b5c4950b94b2214045d80 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Fri, 15 Jul 2016 00:43:33 -0400
Subject: [PATCH 18/19] Attempting to resolve issue with baseURL effecting
 Mirage config/routes

---
 tests/dummy/mirage/config.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/tests/dummy/mirage/config.js b/tests/dummy/mirage/config.js
index 6360d25..a126050 100644
--- a/tests/dummy/mirage/config.js
+++ b/tests/dummy/mirage/config.js
@@ -17,6 +17,7 @@ function filterObj(where, collection, query) {
 
 export default function() {
   this.namespace = '';
+  this.urlPrefix = '/';
 
   /*
   Routes

From 82c05b95460cfece388475745a7e6a0968632470 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@caxiam.com>
Date: Fri, 15 Jul 2016 00:53:59 -0400
Subject: [PATCH 19/19] Update change log

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 870a3e3..1ee09e3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,6 +12,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 - Adds feature that allows ember-tabular to wait until controller is ready for request to fire.
 - Add additional configurable wrapper classes for additional styling.
 - Add support for YuiDocs for better API documentation.
+- Setup deployment to gh-pages for demo URL.
 
 ### Changed
 - Update legacy name references in README.md.