Remove autocomplete component
authorChloe Laisne <chloe.laisne@gmail.com>
Mon, 26 Sep 2016 20:54:58 +0200
changeset 299 2c16302b06f7
parent 298 a915633aa6cf
child 300 8f533ccc7e07
Remove autocomplete component
cms/app-client/app/components/filtering-component.js
cms/app-client/app/routes/tabs/thematiques.js
cms/app-client/app/styles/app.scss
cms/app-client/app/styles/components/filtering-component.scss
cms/app-client/app/templates/components/filtering-component.hbs
cms/app-client/app/templates/tabs/thematiques.hbs
cms/app-client/mirage/serializers/application.js.old
cms/app-client/tests/integration/components/filtering-component-test.js
--- a/cms/app-client/app/components/filtering-component.js	Mon Sep 26 20:49:10 2016 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,50 +0,0 @@
-import Ember from 'ember';
-
-export default Ember.Component.extend({
-
-    classNames: ['filtering-component'],
-
-    isDropdownOpen: false,
-
-    filter: Ember.inject.service(),
-
-    input: '',
-    filteredThemes: Ember.computed.filter('themes', function(item) {
-        return this.get('input') && item.get('label').match(new RegExp('^' + this.get('input')));
-    }).property('input'),
-
-    init: function() {
-        this._super(...arguments);
-        Ember.$(window).on('click', this, Ember.run.bind(this, this.get('elementFocusOut')));
-    },
-
-    elementFocusOut: function(event) {
-        if(this.get('element') && !Ember.$.contains(this.get('element'), event.target)) {
-            this.set('isDropdownOpen', false);
-        }
-    },
-
-    actions: {
-
-        setQueryParameters: function(id) {
-            this.get('filter').set('theme', id);
-            this.set('input', '');
-        },
-
-        focusIn: function() {
-            this.set('isDropdownOpen', true);
-        },
-
-        keyUp: function() {
-            this.set('input', Ember.$('input').val());
-        }
-
-    },
-
-
-    didDestroyElement: function() {
-        this._super(...arguments);
-        Ember.$(window).off('click', this.get('elementFocusOut'));
-    }
-
-});
--- a/cms/app-client/app/routes/tabs/thematiques.js	Mon Sep 26 20:49:10 2016 +0200
+++ b/cms/app-client/app/routes/tabs/thematiques.js	Mon Sep 26 20:54:58 2016 +0200
@@ -8,10 +8,6 @@
 
     themes: [],
 
-    all: Ember.computed(function() {
-        return this.store.findAll('theme');
-    }),
-
     model: Ember.observer('index', function() {
         var self = this;
         var promise = this.store.query('theme', {
@@ -30,8 +26,6 @@
 
     setupController: function(controller) {
         this._super(...arguments);
-        controller.set('all', this.get('all'));
-        // Add ArrayProxy to template context.
         controller.set('themes', this.get('themes'));
     },
 
--- a/cms/app-client/app/styles/app.scss	Mon Sep 26 20:49:10 2016 +0200
+++ b/cms/app-client/app/styles/app.scss	Mon Sep 26 20:54:58 2016 +0200
@@ -44,7 +44,6 @@
 }
 
 @import 'components/sorting-component';
-@import 'components/filtering-component';
 @import 'components/filter-component';
 @import 'components/playlist-component';
 @import 'components/discourses-component';
--- a/cms/app-client/app/styles/components/filtering-component.scss	Mon Sep 26 20:49:10 2016 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,90 +0,0 @@
-.filtering-component {
-    width: 250px;
-    margin: 0px auto;
-    padding: 14px 0px;
-    position: relative;
-}
-
-.filtering-component > * {
-    width: 100%;
-    line-height: 24px;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-}
-
-.filtering-component input,
-.filtering-component ul li {
-    height: 32px;
-    line-height: 32px;
-    padding: 0 15px;
-}
-
-.filtering-component input {
-    border: none;
-    background-color: transparent;
-    border: 1px solid $dark-blue;
-    font-family: sans-serif;
-    color: $dark-blue;
-    box-sizing: border-box;
-    font-size: 13px;
-}
-
-.filtering-component input::-webkit-input-placeholder {
-    color: $dark-blue;
-    font-weight: normal;
-    font-size: 12px;
-    line-height: 32px;
-}
-
-.filtering-component input::-moz-placeholder {
-    line-height: 32px;
-    color: $dark-blue;
-    opacity: 1;
-}
-
-.filtering-component input:focus {
-    border-color: $dark-blue;
-    color: $dark-blue;
-    outline: none;
-}
-
-.filtering-component ul {
-    display: none;
-    position: absolute;
-    z-index: 1;
-    list-style: none;
-    min-height: 0px;
-    max-height: 400px;
-    margin: 0;
-    padding: 0;
-    background-color: $light-white;
-    overflow-y: scroll;
-    border: 1px solid $dark-grey;
-    border-top: none;
-}
-
-.filtering-component ul.open {
-    display: block;
-}
-
-.filtering-component ul li {
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    cursor: pointer;
-}
-
-.filtering-component ul li:nth-child(even) {
-    background-color: $medium-white;
-}
-
-.filtering-component ul li:hover {
-    background-color: $light-blue;
-}
-
-
-.filtering-component ul li span {
-    margin-left: 5px;
-    font-weight: bold;
-}
\ No newline at end of file
--- a/cms/app-client/app/templates/components/filtering-component.hbs	Mon Sep 26 20:49:10 2016 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,8 +0,0 @@
-<input type="text" placeholder="Rechercher une thématique" {{action "keyUp" on="keyUp"}} {{action "focusIn" on="focusIn"}}>
-{{#if filteredThemes.length}}
-<ul class="filters{{if isDropdownOpen ' open'}}">
-    {{#each filteredThemes as |theme|}}
-    <li {{ action 'setQueryParameters' theme.id on='mouseUp'}}>{{ theme.label }}<span>({{ theme.count }})</span></li>
-    {{/each}}
-</ul>
-{{/if}}
\ No newline at end of file
--- a/cms/app-client/app/templates/tabs/thematiques.hbs	Mon Sep 26 20:49:10 2016 +0200
+++ b/cms/app-client/app/templates/tabs/thematiques.hbs	Mon Sep 26 20:54:58 2016 +0200
@@ -1,4 +1,3 @@
 <div id="tabs-thematiques">
-    {{ filtering-component themes=all }}
     {{ sorting-component themes=model load='setIndexQueryparams' sort='setSortQueryparams' }}
 </div>
\ No newline at end of file
--- a/cms/app-client/mirage/serializers/application.js.old	Mon Sep 26 20:49:10 2016 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,3 +0,0 @@
-import { RestSerializer } from 'ember-cli-mirage';
-
-export default RestSerializer;
--- a/cms/app-client/tests/integration/components/filtering-component-test.js	Mon Sep 26 20:49:10 2016 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,24 +0,0 @@
-import { moduleForComponent, test } from 'ember-qunit';
-import hbs from 'htmlbars-inline-precompile';
-
-moduleForComponent('filtering-component', 'Integration | Component | filtering component', {
-    integration: true
-});
-
-test('it renders', function(assert) {
-    // Set any properties with this.set('myProperty', 'value');
-    // Handle any actions with this.on('myAction', function(val) { ... });
-
-    this.render(hbs`{{filtering-component}}`);
-
-    assert.equal(this.$().text().trim(), '');
-
-    // Template block usage:
-    this.render(hbs`
-        {{#filtering-component}}
-            template block text
-        {{/filtering-component}}
-    `);
-
-    assert.equal(this.$().text().trim(), 'template block text');
-});