add task solution

README.md

@@ -1,23 +1,25 @@
 1. Replace `<your_account>` with your Github username in the link
-    - [DEMO LINK](https://<your_account>.github.io/js_task_parse_list_DOM/)
+   - [DEMO LINK](https://YevhenProtasov.github.io/js_task_parse_list_DOM/)
 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/)
-    - Run `npm run test` command to test your code;
-    - Run `npm run test:only -- -n` to run fast test ignoring linter;
-    - Run `npm run test:only -- -l` to run fast test with additional info in console ignoring linter.
+   - Run `npm run test` command to test your code;
+   - Run `npm run test:only -- -n` to run fast test ignoring linter;
+   - Run `npm run test:only -- -l` to run fast test with additional info in console ignoring linter.
 
 ### Task: Parse list with data attributes
 
 Hey there! Can you parse data from the list and sort it based on data attributes?
 
 Your task: Sort list by salary in descending order.
-Get an array of employees. Write two functions: 
+Get an array of employees. Write two functions:
+
 - first, which sorts the list by salary from data attributes
 - second, which returns an array of objects, where objects are employees.
 
 The schema for the employee:
+
 ```
 {
-  name, 
+  name,
   position,
   salary,
   age
@@ -35,10 +37,11 @@ Expected result after soring:
 You can read about non-standard attributes and dataset [here](https://javascript.info/dom-attributes-and-properties#non-standard-attributes-dataset)
 
 ##### Steps to do this challenge:
-1) Find and get a list from the document.
-2) Create function `sortList`, which takes a `list` property, and sorts list items in descending order by salary from data attribute. (Salary from data attribute is a string, do not forget to convert it to number, write helper function for it). Append sorted items to list.
-3) Create function `getEmployees`, which takes a `list` property, and returns an array of right objects.
-4) Call both functions.
-5) Done.
+
+1. Find and get a list from the document.
+2. Create function `sortList`, which takes a `list` property, and sorts list items in descending order by salary from data attribute. (Salary from data attribute is a string, do not forget to convert it to number, write helper function for it). Append sorted items to list.
+3. Create function `getEmployees`, which takes a `list` property, and returns an array of right objects.
+4. Call both functions.
+5. Done.
 
 You don't need to change styles or HTML layout in this task. Change only `main.js` file.

src/scripts/main.js

@@ -1,3 +1,40 @@
 'use strict';
 
-// write code here
+const list = document.querySelector('ul');
+const listItems = [...document.querySelectorAll('[data-salary]')];
+
+function sortList(sourceList) {
+  return sourceList.sort(
+    (a, b) =>
+      convertSalaryToNumber(b.attributes['data-salary'].value) -
+      convertSalaryToNumber(a.attributes['data-salary'].value),
+  );
+}
+
+function convertSalaryToNumber(salaryValue) {
+  return Number(salaryValue.replace(/[,$]/g, ''));
+}
+
+function getEmployees(sourceList) {
+  return sourceList.map((item) => {
+    const employeeName = item.innerText;
+    const position = item.attributes['data-position'].value;
+    const salary = item.attributes['data-salary'].value;
+    const age = item.attributes['data-age'].value;
+
+    return {
+      name: employeeName,
+      position,
+      salary,
+      age,
+    };
+  });
+}
+
+const sortedList = sortList(listItems);
+
+sortedList.forEach((item) => {
+  list.appendChild(item);
+});
+
+getEmployees(sortedList);