--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/helpers/is-checked.js Mon Jul 18 02:37:48 2016 +0200
@@ -0,0 +1,20 @@
+import Ember from 'ember';
+
+export function isChecked(params) {
+ var dates = params[0];
+
+ var decade = [];
+ var next = params[1] + 10;
+ while(params[1] < next) {
+ decade.push(params[1]);
+ params[1] ++;
+ }
+
+ var filter = decade.filter(function(date){ return dates.indexOf(date) > -1; });
+ if(filter.length === decade.length) {
+ return true
+ }
+ return false;
+}
+
+export default Ember.Helper.helper(isChecked);
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/helpers/is-indeterminate.js Mon Jul 18 02:37:48 2016 +0200
@@ -0,0 +1,20 @@
+import Ember from 'ember';
+
+export function isIndeterminate(params) {
+ var dates = params[0];
+
+ var decade = [];
+ var next = params[1] + 10;
+ while(params[1] < next) {
+ decade.push(params[1]);
+ params[1] ++;
+ }
+
+ var filter = decade.filter(function(date){ return dates.indexOf(date) > -1; });
+ if(filter.length !== decade.length && filter.length) {
+ return true
+ }
+ return false;
+}
+
+export default Ember.Helper.helper(isIndeterminate);
--- a/cms/app-client/app/styles/app.scss Sun Jul 17 23:58:55 2016 +0200
+++ b/cms/app-client/app/styles/app.scss Mon Jul 18 02:37:48 2016 +0200
@@ -75,9 +75,9 @@
}
.corpus-app-container h2 {
- padding: 20px;
- font-size: 16px;
- color: $dark-blue;
+ color: $dark-grey;
+ line-height: 60px;
+ font-size: 14px;
}
.corpus-window {
--- a/cms/app-client/app/styles/tabs/chrono.scss Sun Jul 17 23:58:55 2016 +0200
+++ b/cms/app-client/app/styles/tabs/chrono.scss Mon Jul 18 02:37:48 2016 +0200
@@ -1,10 +1,11 @@
#chrono-table{
- margin-top: 40px;
- line-height: 40px;
+ margin-top: 54px;
+ line-height: 43px;
}
#chrono-table .interval {
margin-bottom: 5px;
+ overflow: hidden;
}
#chrono-table .decades {
@@ -21,21 +22,20 @@
}
#chrono-table li {
- width: 40px;
- height: 40px;
+ width: 43px;
+ height: 43px;
text-align: center;
vertical-align: middle;
display: inline-block;
margin: 0px 0px 0px 5px;
cursor: pointer;
- background-color: $medium-grey;
- color: $light-blue;
+ background-color: $light-blue;
+ color: $medium-blue;
font-size: 12px;
box-sizing: border-box;
}
#chrono-table li.highlighted {
color: $light-white;
- border: 1px solid $light-white;
background-color: $medium-blue;
}
--- a/cms/app-client/app/templates/components/visu-chrono.hbs Sun Jul 17 23:58:55 2016 +0200
+++ b/cms/app-client/app/templates/components/visu-chrono.hbs Mon Jul 18 02:37:48 2016 +0200
@@ -1,5 +1,5 @@
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 1960}}>1960</span>
+ {{input type="checkbox" checked=(is-checked filter.date 1960) indeterminate=(is-indeterminate filter.date 1960) click=(action 'selectDecade' 1960)}}
<ul class="1960">
<li title="1960" id="1960">1960</li>
<li title="1961" id="1961">1961</li>
@@ -14,7 +14,7 @@
</ul>
</div>
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 1970}}>1970</span>
+ {{input type="checkbox" checked=(is-checked filter.date 1970) indeterminate=(is-indeterminate filter.date 1970) click=(action 'selectDecade' 1970)}}
<ul class="1970">
<li title="1970" id="1970">1970</li>
<li title="1971" id="1971">1971</li>
@@ -29,7 +29,7 @@
</ul>
</div>
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 1980}}>1980</span>
+ {{input type="checkbox" checked=(is-checked filter.date 1980) indeterminate=(is-indeterminate filter.date 1980) click=(action 'selectDecade' 1980)}}
<ul class="1980">
<li title="1980" id="1980">1980</li>
<li title="1981" id="1981">1981</li>
@@ -44,7 +44,7 @@
</ul>
</div>
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 1990}}>1990</span>
+ {{input type="checkbox" checked=(is-checked filter.date 1990) indeterminate=(is-indeterminate filter.date 1990) click=(action 'selectDecade' 1990)}}
<ul class="1990">
<li title="1990" id="1990">1990</li>
<li title="1991" id="1991">1991</li>
@@ -59,7 +59,7 @@
</ul>
</div>
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 2000}}>2000</span>
+ {{input type="checkbox" checked=(is-checked filter.date 2000) indeterminate=(is-indeterminate filter.date 2000) click=(action 'selectDecade' 2000)}}
<ul class="2000">
<li title="2000" id="2000">2000</li>
<li title="2001" id="2001">2001</li>
@@ -74,7 +74,7 @@
</ul>
</div>
<div class="interval">
- <span class="decades"{{ action 'selectDecade' 2010}}>2010</span>
+ {{input type="checkbox" checked=(is-checked filter.date 2010) indeterminate=(is-indeterminate filter.date 2010) click=(action 'selectDecade' 2010)}}
<ul class="2010">
<li title="2010" id="2010">2010</li>
<li title="2011" id="2011">2011</li>
--- a/cms/app-client/app/templates/tabs/chrono.hbs Sun Jul 17 23:58:55 2016 +0200
+++ b/cms/app-client/app/templates/tabs/chrono.hbs Mon Jul 18 02:37:48 2016 +0200
@@ -1,4 +1,4 @@
<div id="tabs-chrono">
- <h2>Sélectionnez des années ou intervalles d'années</h2>
+ <h2>Filtrez par années ou intervalles d'années</h2>
{{ visu-chrono }}
</div>
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/tests/unit/helpers/is-checked-test.js Mon Jul 18 02:37:48 2016 +0200
@@ -0,0 +1,10 @@
+import { isChecked } from 'app-client/helpers/is-checked';
+import { module, test } from 'qunit';
+
+module('Unit | Helper | is checked');
+
+// Replace this with your real tests.
+test('it works', function(assert) {
+ let result = isChecked([42]);
+ assert.ok(result);
+});
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/tests/unit/helpers/is-indeterminate-test.js Mon Jul 18 02:37:48 2016 +0200
@@ -0,0 +1,10 @@
+import { isIndeterminate } from 'app-client/helpers/is-indeterminate';
+import { module, test } from 'qunit';
+
+module('Unit | Helper | is indeterminate');
+
+// Replace this with your real tests.
+test('it works', function(assert) {
+ let result = isIndeterminate([42]);
+ assert.ok(result);
+});