ソースを参照

Create result.js

Yuliya Shatokhina 4 年 前
コミット
d97565b347
1 ファイル変更39 行追加0 行削除
  1. 39 0
      js/modules/result.js

+ 39 - 0
js/modules/result.js

@@ -0,0 +1,39 @@
+import {
+    formatNumber
+} from '../utils/format-number.js';
+
+export default class Result {
+    constructor(element) {
+        this.calculator = element;
+
+        this.main = element.querySelector(`.counter__result`);
+
+        this.rezultCaloriesMin = this.main.querySelector(`#calories-minimal`);
+        this.resultCaloriesNorm = this.main.querySelector(`#calories-norm`);
+        this.resultCaloriesMax = this.main.querySelector(`#calories-maximal`);
+    }
+
+    show(calories) {
+        this.rezultCaloriesMin.textContent = formatNumber(calories.min);
+        this.resultCaloriesNorm.textContent = formatNumber(calories.norm);
+        this.resultCaloriesMax.textContent = formatNumber(calories.max);
+
+        this.main.classList.remove(`counter__result--hidden`);
+        this.main.scrollIntoView({
+            block: `center`,
+            behavior: `smooth`
+        });
+    }
+
+    hide() {
+        this.resultCaloriesNorm.textContent = 0;
+        this.rezultCaloriesMin.textContent = 0;
+        this.resultCaloriesMax.textContent = 0;
+
+        this.main.classList.add(`counter__result--hidden`);
+        this.calculator.scrollIntoView({
+            block: `start`,
+            behavior: `smooth`
+        });
+    }
+}