From a78e4176e772ff1c005775d6f04f13d191ac9aa3 Mon Sep 17 00:00:00 2001
From: "dima.rogkov" <dima.rogkov@cheitgroup.com>
Date: Sat, 27 Jan 2024 23:28:28 +0200
Subject: [PATCH] add solution

---
 .editorconfig              |  1 +
 .github/workflows/test.yml |  2 +-
 README.md                  |  5 ++--
 package.json               |  2 +-
 src/scripts/main.js        | 55 +++++++++++++++++++++++++++++++++++++-
 5 files changed, 60 insertions(+), 5 deletions(-)

diff --git a/.editorconfig b/.editorconfig
index fd380d57..ed9eb233 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -8,3 +8,4 @@ charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
 end_of_line = lf
+quote_type = single
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index f3065d38..b9c880dc 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -11,7 +11,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [14.x]
 
     steps:
     - uses: actions/checkout@v2
diff --git a/README.md b/README.md
index 36dc318d..4cf365d6 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,7 @@
 1. Replace `<your_account>` with your Github username in the link
-    - [DEMO LINK](https://<your_account>.github.io/js_get_data_DOM/)
+   - [DEMO LINK](https://dimarogkov.github.io/js_get_data_DOM/)
 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/)
-    - There are no tests for this task so use `npm run lint` command instead of `npm test` 
+   - There are no tests for this task so use `npm run lint` command instead of `npm test`
 
 ### Task: TOP 10 LARGEST COUNTRIES BY POPULATION
 
@@ -9,6 +9,7 @@ Hello! In this task, you need to parse data from the list, and based on it get t
 You no need to change styles or HTML layout in this task. Change only `main.js` file.
 
 Steps to do this challenge:
+
 1. Get all text data from `span` with class `population`
 2. Make sure that the given string can be converted to a number and convert it to number.
 3. Calculate average and total value-based to parsed numbers.
diff --git a/package.json b/package.json
index 4f30be30..29f90b3e 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@mate-academy/bemlint": "^0.1.1",
     "@mate-academy/eslint-config": "*",
     "@mate-academy/linthtml-config": "*",
-    "@mate-academy/scripts": "^1.2.10",
+    "@mate-academy/scripts": "^1.3.2",
     "@mate-academy/stylelint-config": "0.0.11",
     "@parcel/transformer-sass": "2.10.2",
     "backstopjs": "^6.2.2",
diff --git a/src/scripts/main.js b/src/scripts/main.js
index c6e3f878..0f901893 100644
--- a/src/scripts/main.js
+++ b/src/scripts/main.js
@@ -1,3 +1,56 @@
 'use strict';
 
-// write your code here
+document.addEventListener('DOMContentLoaded', () => {
+  // calc populations
+  const calcPopulationsInit = () => {
+    const list = document.querySelector('.list');
+
+    if (list) {
+      const averagePopulation = document.querySelector('.average-population');
+      const totalPopulation = document.querySelector('.total-population');
+      const populations = list.querySelectorAll('.population');
+      const items = list.querySelectorAll('.list__item');
+
+      // get total
+      const getTotal = () => {
+        return [...populations].reduce((a, b) => {
+          return a + +b.textContent.split(',').join('');
+        }, 0);
+      };
+
+      // get average
+      const getAverage = (number) => number / items.length;
+
+      // formatted number
+      const formatNumber = (number) => number.toLocaleString('en-US');
+
+      // set population
+      const setPopulation = (population, block) => {
+        block.textContent = population;
+      };
+
+      // calc total
+      const calcTotal = () => {
+        const total = getTotal();
+        const res = formatNumber(total);
+
+        setPopulation(res, totalPopulation);
+      };
+
+      // calc average
+      const calcAverage = () => {
+        const total = getTotal();
+        const average = getAverage(total);
+        const res = formatNumber(average);
+
+        setPopulation(res, averagePopulation);
+      };
+
+      // run func
+      calcTotal();
+      calcAverage();
+    }
+  };
+
+  calcPopulationsInit();
+});