client: reorganize filters and add tests

test/client/unit/specs/filters/floor.spec.js

@@ -0,0 +1,8 @@
+import floorFilter from 'client/filters/floor';
+
+describe('floor filter', () => {
+  it('can floor a decimal number', () => {
+    expect(floorFilter(4.567)).to.equal(4.56);
+    expect(floorFilter(4.562)).to.equal(4.56);
+  });
+});

test/client/unit/specs/filters/round.spec.js

@@ -0,0 +1,8 @@
+import roundFilter from 'client/filters/round';
+
+describe('round filter', () => {
+  it('can round a decimal number', () => {
+    expect(roundFilter(4.567)).to.equal(4.57);
+    expect(roundFilter(4.562)).to.equal(4.56);
+  });
+});

website/client/components/appHeader.vue

@@ -100,12 +100,6 @@ export default {
   components: {
     Avatar,
   },
-  filters: {
-    percent,
-    round (val) {
-      return Math.round(val * 100) / 100;
-    },
-  },
   methods: {
     percent,
   },

website/client/components/appMenu.vue

@@ -32,7 +32,7 @@
       span {{userGems}}
     .item.with-img.gp-icon
       img(src="~assets/header/png/gold@3x.png")
-      span {{Math.floor(user.stats.gp * 100) / 100}}
+      span {{user.stats.gp | floor}}
     a.item.with-img.notifications-dropdown
       img(src="~assets/header/png/notifications@3x.png")
     .ui.simple.dropdown.pointing

website/client/filters/floor.js

@@ -0,0 +1,3 @@
+export default function floor (val) {
+  return Math.floor(val * 100) / 100;
+}

website/client/filters/registerGlobals.js

@@ -0,0 +1,6 @@
+import Vue from 'vue';
+import round from './round';
+import floor from './floor';
+
+Vue.filter('round', round);
+Vue.filter('floor', floor);

website/client/filters/round.js

@@ -0,0 +1,3 @@
+export default function round (val) {
+  return Math.round(val * 100) / 100;
+}

website/client/main.js

@@ -7,6 +7,7 @@ import VueResource from 'vue-resource';
 import AppComponent from './app';
 import router from './router';
 import store from './store';
+import './filters/registerGlobals';
 
 // TODO just for the beginning
 Vue.use(VueResource);