Add checkboxes for Inherited, Protected, Private, Deprecated

Author: Gaurav0

app/controllers/project-version/class.js

@@ -0,0 +1,36 @@
+import Ember from 'ember';
+import _ from 'lodash/lodash';
+
+const { computed } = Ember;
+
+
+export default Ember.Controller.extend({
+  filteredMethods: computed('model.methods.[]', 'showInherited', 'showProtected', 'showPrivate', 'showDeprecated', function() {
+    return this.filterItems('methods');
+  }),
+
+  filteredEvents: computed('model.events.[]', 'showInherited', 'showProtected', 'showPrivate', 'showDeprecated', function() {
+    return this.filterItems('events');
+  }),
+
+  filteredProperties: computed('model.properties.[]', 'showInherited', 'showProtected', 'showPrivate', 'showDeprecated', function() {
+    return this.filterItems('properties');
+  }),
+
+  filterItems(itemType) {
+    let items = this.get('model.' + itemType);
+    if (!this.get('showInherited')) {
+      items = items.filter(item => item.inherited !== true);
+    }
+    if (!this.get('showProtected')) {
+      items = items.filter(item => item.access !== 'protected');
+    }
+    if (!this.get('showPrivate')) {
+      items = items.filter(item => item.access !== 'private');
+    }
+    if (!this.get('showDeprecated')) {
+      items = items.filter(item => item.deprecated !== true);
+    }
+    return _.uniq(_.sortBy(items, 'name'), true, (item => item.name));
+  }
+});

app/styles/_class.scss

@@ -11,3 +11,7 @@ article.chapter ul {
     margin-bottom: 0;
   }
 }
+
+.access-checkbox {
+  display: inline;
+}

app/templates/project-version/class.hbs

@@ -2,12 +2,34 @@
   <h1>{{model.name}} {{#if model.access}}<span class="access">{{model.access}}</span>{{/if}}</h1>
 
   <p>{{{model.description}}}</p>
+
+  <section>
+    Show:
+    <label class="access-checkbox">
+      {{input type="checkbox" checked=showInherited}}
+      Inherited
+    </label>
+    <label class="access-checkbox">
+      {{input type="checkbox" checked=showProtected}}
+      Protected
+    </label>
+    <label class="access-checkbox">
+      {{input type="checkbox" checked=showPrivate}}
+      Private
+    </label>
+    <label class="access-checkbox">
+      {{input type="checkbox" checked=showDeprecated}}
+      Deprecated
+    </label>
+  </section>
+
+
   <section>
     <h2>Methods</h2>
 
     {{#if model.methods}}
       <ul class="spec-method-list">
-        {{#each model.methods as |method|}}
+        {{#each filteredMethods as |method|}}
           <li>
             {{#link-to 'methods.method' model.project.id model.projectVersion.version model.name method.name (query-params anchor=method.name)}}
               {{method.name}}
@@ -24,7 +46,7 @@
     <h2>Properties</h2>
     {{#if model.properties}}
       <ul class="spec-property-list">
-        {{#each model.properties as |property|}}
+        {{#each filteredProperties as |property|}}
           <li>
             {{#link-to 'properties.property' model.project.id model.projectVersion.version model.name property.name (query-params anchor=property.name)}}
               {{property.name}}
@@ -41,7 +63,7 @@
     <h2>Events</h2>
     {{#if model.events}}
       <ul class="spec-event-list">
-        {{#each model.events as |event|}}
+        {{#each filteredEvents as |event|}}
           <li>
             {{#link-to 'events.event' model.project.id model.projectVersion.version model.name event.name (query-params anchor=event.name)}}
               {{event.name}}

tests/acceptance/class-test.js

@@ -4,14 +4,26 @@ import $ from 'jquery';
 
 moduleForAcceptance('Class', {
   beforeEach() {
-    return visit('/ember/1.0.0/classes/Container');
+    return visit('/ember/1.0.0/classes/Container').then(() => {
+      click('.access-checkbox:contains(Inherited)');
+      click('.access-checkbox:contains(Protected)');
+      click('.access-checkbox:contains(Private)');
+      click('.access-checkbox:contains(Deprecated)');
+    });
   }
 });
 
 test('lists all the methods on the class page', function (assert) {
   const store = this.application.__container__.lookup('service:store');
   const container = store.peekRecord('class', 'ember-1.0.0-Container');
   assert.equal($(findWithAssert('.spec-method-list li')).length, container.get('methods.length'));
+
+  click('.access-checkbox:contains(Private)'); // turn private back off
+
+  andThen(() => {
+    assert.equal($(findWithAssert('.spec-method-list li')).length,
+      container.get('methods').filter(method => method.access !== 'private').length);
+  });
 });
 
 test('lists all the properties on the class page', function (assert) {
@@ -25,4 +37,3 @@ test('lists all the events on the class page', function (assert) {
   const container = store.peekRecord('class', 'ember-1.0.0-Container');
   assert.equal($(find('.spec-event-list li')).length, container.get('events.length'));
 });
-