├── .gitignore ├── babel.config.js ├── .babelrc ├── src ├── modules │ ├── constructor.js │ ├── clearAll.js │ ├── removeFromStorage.js │ ├── updateid.js │ ├── toggleCompleted.js │ ├── tests │ │ ├── toggleCompleted.test.js │ │ ├── clearAll.test.js │ │ ├── interface.test.js │ │ ├── removeFromStorage.test.js │ │ └── storage.test.js │ ├── storage.js │ └── interface.js ├── index.html ├── index.js └── style.css ├── .hintrc ├── .eslintrc.json ├── .stylelintrc.json ├── webpack.config.js ├── dist ├── index.html └── main.js ├── LICENSE ├── package.json ├── .github └── workflows │ └── linters.yml └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | 3 | coverage -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [['@babel/preset-env', { targets: { node: 'current' } }]], 3 | }; 4 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "test": { 4 | "plugins": ["@babel/plugin-transform-modules-commonjs"] 5 | } 6 | } 7 | } -------------------------------------------------------------------------------- /src/modules/constructor.js: -------------------------------------------------------------------------------- 1 | // module to create task 2 | export default class Task { 3 | constructor(description = '', id = 1) { 4 | this.description = description; 5 | this.id = id; 6 | this.completed = false; 7 | this.editable = false; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/modules/clearAll.js: -------------------------------------------------------------------------------- 1 | function clearAll() { 2 | let tasks = []; 3 | if (localStorage.getItem('tasks') !== null) { 4 | tasks = JSON.parse(localStorage.getItem('tasks')); 5 | } 6 | const newTasks = tasks.filter((task) => task.completed === false); 7 | localStorage.setItem('tasks', JSON.stringify(newTasks)); 8 | 9 | return newTasks; 10 | } 11 | 12 | export default clearAll; -------------------------------------------------------------------------------- /.hintrc: -------------------------------------------------------------------------------- 1 | { 2 | "connector": { 3 | "name": "local", 4 | "options": { 5 | "pattern": ["**", "!.git/**", "!node_modules/**"] 6 | } 7 | }, 8 | "extends": ["development"], 9 | "formatters": ["stylish"], 10 | "hints": [ 11 | "button-type", 12 | "disown-opener", 13 | "html-checker", 14 | "meta-charset-utf-8", 15 | "meta-viewport", 16 | "no-inline-styles:error" 17 | ] 18 | } -------------------------------------------------------------------------------- /src/modules/removeFromStorage.js: -------------------------------------------------------------------------------- 1 | import updateid from './updateid.js'; 2 | 3 | const removeFromStorage = (id) => { 4 | let tasks = []; 5 | if (localStorage.getItem('tasks') !== null) { 6 | tasks = JSON.parse(localStorage.getItem('tasks')); 7 | } 8 | const newTasks = tasks.filter((task) => task.id !== +id); 9 | localStorage.setItem('tasks', JSON.stringify(newTasks)); 10 | updateid.storage(); 11 | }; 12 | 13 | export default removeFromStorage; -------------------------------------------------------------------------------- /src/modules/updateid.js: -------------------------------------------------------------------------------- 1 | const updateid = { 2 | storage() { 3 | let tasks; 4 | if (localStorage.getItem('tasks') === null) { 5 | tasks = []; 6 | } else { 7 | tasks = JSON.parse(localStorage.getItem('tasks')); 8 | } 9 | 10 | tasks.forEach((element, index) => { 11 | element.id = index + 1; 12 | }); 13 | 14 | localStorage.setItem('tasks', JSON.stringify(tasks)); 15 | }, 16 | }; 17 | 18 | export default updateid; 19 | -------------------------------------------------------------------------------- /src/modules/toggleCompleted.js: -------------------------------------------------------------------------------- 1 | const toggleCompleted = (id, completed) => { 2 | let tasks = []; 3 | if (localStorage.getItem('tasks') !== null) { 4 | tasks = JSON.parse(localStorage.getItem('tasks')); 5 | } 6 | 7 | if (completed) { 8 | tasks[id - 1].completed = true; 9 | } else { 10 | tasks[id - 1].completed = false; 11 | } 12 | localStorage.setItem('tasks', JSON.stringify(tasks)); 13 | 14 | return tasks[id - 1]; 15 | }; 16 | 17 | export default toggleCompleted; -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true, 5 | "jest": true 6 | }, 7 | "parser": "babel-eslint", 8 | "parserOptions": { 9 | "ecmaVersion": 2018, 10 | "sourceType": "module" 11 | }, 12 | "extends": ["airbnb-base"], 13 | "rules": { 14 | "no-shadow": "off", 15 | "no-param-reassign": "off", 16 | "eol-last": "off", 17 | "import/extensions": [ 1, { 18 | "js": "always", "json": "always" 19 | }] 20 | }, 21 | "ignorePatterns": [ 22 | "dist/", 23 | "build/" 24 | ] 25 | } -------------------------------------------------------------------------------- /.stylelintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["stylelint-config-standard"], 3 | "plugins": ["stylelint-scss", "stylelint-csstree-validator"], 4 | "rules": { 5 | "at-rule-no-unknown": [ 6 | true, 7 | { 8 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 9 | } 10 | ], 11 | "scss/at-rule-no-unknown": [ 12 | true, 13 | { 14 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 15 | } 16 | ], 17 | "csstree/validator": true 18 | }, 19 | "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css", "**/*.js", "**/*.jsx"] 20 | } -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 3 | 4 | module.exports = { 5 | entry: './src/index.js', 6 | devServer: { 7 | static: './dist', 8 | }, 9 | plugins: [ 10 | new HtmlWebpackPlugin({ 11 | template: './src/index.html', 12 | }), 13 | ], 14 | output: { 15 | filename: 'main.js', 16 | path: path.resolve(__dirname, 'dist'), 17 | clean: true, 18 | }, 19 | module: { 20 | rules: [ 21 | { 22 | test: /\.css$/i, 23 | use: ['style-loader', 'css-loader'], 24 | }, 25 | ], 26 | }, 27 | mode: 'development', 28 | }; -------------------------------------------------------------------------------- /src/modules/tests/toggleCompleted.test.js: -------------------------------------------------------------------------------- 1 | /** * @jest-environment jsdom */ 2 | 3 | import toggleCompleted from '../toggleCompleted.js'; 4 | 5 | const tasks = [ 6 | { 7 | description: 'Marco', 8 | id: 1, 9 | completed: false, 10 | editable: false, 11 | }, 12 | ]; 13 | 14 | const result = { 15 | description: 'Marco', 16 | id: 1, 17 | completed: true, 18 | editable: false, 19 | }; 20 | 21 | localStorage.setItem('tasks', JSON.stringify(tasks)); 22 | 23 | describe('Updating completed status', () => { 24 | test('if the completed attribute changes', () => { 25 | expect(toggleCompleted(1, true)).toEqual(result); 26 | }); 27 | }); -------------------------------------------------------------------------------- /src/modules/tests/clearAll.test.js: -------------------------------------------------------------------------------- 1 | /** * @jest-environment jsdom */ 2 | 3 | import clearAll from '../clearAll.js'; 4 | 5 | describe('clear all complete task', () => { 6 | const newTasks = [ 7 | { 8 | description: 'Mátyás', 9 | id: 1, 10 | completed: false, 11 | editable: false, 12 | }, 13 | { 14 | description: 'Vanessa', 15 | id: 2, 16 | completed: true, 17 | editable: false, 18 | }, 19 | { 20 | description: 'Vanessa', 21 | id: 3, 22 | completed: true, 23 | editable: false, 24 | }, 25 | ]; 26 | 27 | localStorage.setItem('tasks', JSON.stringify(newTasks)); 28 | 29 | it('clear one task', () => { 30 | expect(clearAll()).toHaveLength(1); 31 | }); 32 | }); -------------------------------------------------------------------------------- /src/modules/tests/interface.test.js: -------------------------------------------------------------------------------- 1 | /** * @jest-environment jsdom */ 2 | 3 | import Interface from '../interface.js'; 4 | 5 | document.body.innerHTML = ` 6 | 7 | 10 | `; 11 | 12 | const task = { 13 | description: 'content 1', 14 | id: 1, 15 | completed: false, 16 | editable: false, 17 | }; 18 | 19 | describe('testing the interface functions', () => { 20 | test('testing the clearFields function', () => { 21 | const input = document.getElementById('taskInput'); 22 | Interface.clearFields(); 23 | expect(input.value).toBe(''); 24 | }); 25 | test('testing the add function', () => { 26 | const list = document.getElementById('toDoItems'); 27 | expect(Interface.addTaskToList(task)).toBe(list.lastElementChild); 28 | }); 29 | }); 30 | -------------------------------------------------------------------------------- /src/modules/storage.js: -------------------------------------------------------------------------------- 1 | export default class Storage { 2 | static getTasks() { 3 | let tasks; 4 | if (!localStorage.getItem('tasks')) { 5 | tasks = []; 6 | } else { 7 | tasks = JSON.parse(localStorage.getItem('tasks')); 8 | } 9 | 10 | return tasks; 11 | } 12 | 13 | static addTask(task) { 14 | const tasks = Storage.getTasks(); 15 | 16 | tasks.push(task); 17 | 18 | localStorage.setItem('tasks', JSON.stringify(tasks)); 19 | 20 | return Storage.getTasks(); 21 | } 22 | 23 | static updateTask(task, description) { 24 | const tasks = Storage.getTasks(); 25 | 26 | const activeTask = tasks.find((selected) => selected.id === task.id); 27 | 28 | activeTask.description = description; 29 | 30 | localStorage.setItem('tasks', JSON.stringify(tasks)); 31 | 32 | return activeTask; 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | To-do list 8 | 9 | 10 |
11 |

To-do list

12 |
13 |
14 |

Today's to do

15 |
16 | 17 | 18 |
19 |
20 | 22 |
23 | 24 |
25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | To-do list 8 | 9 | 10 |
11 |

To-do list

12 |
13 |
14 |

Today's to do

15 |
16 | 17 | 18 |
19 |
20 | 22 |
23 | 24 |
25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/modules/tests/removeFromStorage.test.js: -------------------------------------------------------------------------------- 1 | /** * @jest-environment jsdom */ 2 | 3 | import removeFromStorage from '../removeFromStorage.js'; 4 | 5 | window.localStorage = Storage.prototype; 6 | 7 | const newTasks = [ 8 | { 9 | description: 'Mátyás', 10 | id: 1, 11 | completed: false, 12 | editable: false, 13 | }, 14 | 15 | { 16 | description: 'Vanessa', 17 | id: 2, 18 | completed: false, 19 | editable: false, 20 | }, 21 | ]; 22 | 23 | localStorage.setItem('tasks', JSON.stringify(newTasks)); 24 | 25 | describe('check the localStorage', () => { 26 | test('Remove from storage', () => { 27 | const task1 = [ 28 | { 29 | description: 'Mátyás', 30 | id: 1, 31 | completed: false, 32 | editable: false, 33 | }, 34 | ]; 35 | removeFromStorage(2); 36 | const dataStorage = JSON.parse(localStorage.getItem('tasks')) || []; 37 | expect(dataStorage).toEqual(task1); 38 | }); 39 | }); 40 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | ## Copyright 2021, [Mátyás Gombos] 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this [APP TYPE] and associated documentation files, to deal in the [APP TYPE] without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the [APP TYPE], and to permit persons to whom the [APP TYPE] is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the [APP TYPE]. 6 | 7 | THE [APP TYPE] IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE [APP TYPE] OR THE USE OR OTHER DEALINGS IN THE [APP TYPE]. -------------------------------------------------------------------------------- /src/modules/tests/storage.test.js: -------------------------------------------------------------------------------- 1 | /** * @jest-environment jsdom */ 2 | 3 | import Storage from '../storage.js'; 4 | 5 | window.localStorage = Storage.prototype; 6 | 7 | describe('test storage functionalities', () => { 8 | const newTasks = [ 9 | { 10 | description: 'Mátyás', 11 | id: 1, 12 | completed: false, 13 | editable: false, 14 | }, 15 | { 16 | description: 'Vanessa', 17 | id: 2, 18 | completed: true, 19 | editable: false, 20 | }, 21 | { 22 | description: 'Vanessa', 23 | id: 3, 24 | completed: true, 25 | editable: false, 26 | }, 27 | ]; 28 | 29 | const task = { 30 | description: 'Marco', 31 | id: 4, 32 | completed: false, 33 | editable: false, 34 | }; 35 | 36 | const task2 = { 37 | description: 'new description', 38 | id: 4, 39 | completed: false, 40 | editable: false, 41 | }; 42 | localStorage.setItem('tasks', JSON.stringify(newTasks)); 43 | 44 | it('getting a task from storage', () => { 45 | expect(Storage.getTasks()).toHaveLength(3); 46 | }); 47 | it('adding a task to storage', () => { 48 | expect(Storage.addTask(task)).toHaveLength(4); 49 | }); 50 | it('updating description in storage', () => { 51 | expect(Storage.updateTask(task, 'new description')).toStrictEqual(task2); 52 | }); 53 | }); 54 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "to-do-list-webpack-v2", 3 | "version": "1.0.0", 4 | "description": "", 5 | "private": true, 6 | "scripts": { 7 | "test": "jest --coverage", 8 | "start": "webpack serve --open", 9 | "watch": "jest --watch *.js", 10 | "build": "webpack" 11 | }, 12 | "repository": { 13 | "type": "git", 14 | "url": "git+https://github.com/MattGomb/To-do-list-webpack-v2.git" 15 | }, 16 | "keywords": [], 17 | "author": "", 18 | "license": "ISC", 19 | "bugs": { 20 | "url": "https://github.com/MattGomb/To-do-list-webpack-v2/issues" 21 | }, 22 | "homepage": "https://github.com/MattGomb/To-do-list-webpack-v2#readme", 23 | "devDependencies": { 24 | "@babel/core": "^7.19.3", 25 | "@babel/plugin-proposal-decorators": "^7.19.3", 26 | "@babel/plugin-syntax-decorators": "^7.19.0", 27 | "@babel/plugin-transform-modules-commonjs": "^7.18.6", 28 | "@babel/preset-env": "^7.19.4", 29 | "babel-eslint": "^10.1.0", 30 | "babel-jest": "^29.1.2", 31 | "css-loader": "^6.7.1", 32 | "eslint": "^7.32.0", 33 | "eslint-config-airbnb-base": "^14.2.1", 34 | "eslint-plugin-import": "^2.26.0", 35 | "hint": "^7.1.3", 36 | "html-webpack-plugin": "^5.5.0", 37 | "jest": "^29.1.2", 38 | "jest-environment-jsdom": "^29.1.2", 39 | "style-loader": "^3.3.1", 40 | "stylelint": "^13.13.1", 41 | "stylelint-config-standard": "^21.0.0", 42 | "stylelint-csstree-validator": "^1.9.0", 43 | "stylelint-scss": "^3.21.0", 44 | "webpack": "^5.74.0", 45 | "webpack-cli": "^4.10.0", 46 | "webpack-dev-server": "^4.11.1" 47 | }, 48 | "dependencies": { 49 | "lodash": "^4.17.21" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/modules/interface.js: -------------------------------------------------------------------------------- 1 | import Storage from './storage.js'; 2 | 3 | export default class Interface { 4 | static displayTasks() { 5 | const tasks = Storage.getTasks(); 6 | document.querySelector('#toDoItems').innerHTML = ''; 7 | if (tasks.length !== 0) { 8 | tasks.forEach((task) => Interface.addTaskToList(task)); 9 | } 10 | } 11 | 12 | static addTaskToList(task) { 13 | const list = document.querySelector('#toDoItems'); 14 | const taskelement = document.createElement('li'); 15 | taskelement.setAttribute('id', task.id); 16 | list.appendChild(taskelement); 17 | 18 | const wrapper = document.createElement('div'); 19 | taskelement.appendChild(wrapper); 20 | 21 | const label = document.createElement('label'); 22 | label.setAttribute('for', `check${task.id}`); 23 | wrapper.appendChild(label); 24 | 25 | const checkbox = document.createElement('input'); 26 | checkbox.setAttribute('type', 'checkbox'); 27 | checkbox.classList.add('checkbox'); 28 | checkbox.id = `check${task.id}`; 29 | wrapper.appendChild(checkbox); 30 | 31 | const text = document.createElement('input'); 32 | text.classList.add('text'); 33 | text.setAttribute('id', `text${task.id}`); 34 | text.setAttribute('disabled', true); 35 | text.value = task.description; 36 | wrapper.appendChild(text); 37 | 38 | const morebtn = document.createElement('button'); 39 | morebtn.classList.add('morebtn'); 40 | morebtn.innerHTML = '⋮'; 41 | morebtn.id = `m${task.id}`; 42 | taskelement.appendChild(morebtn); 43 | 44 | const deletebtn = document.createElement('button'); 45 | deletebtn.classList.add('hidden'); 46 | deletebtn.classList.add('deletebtn'); 47 | deletebtn.innerHTML = '🗑'; 48 | deletebtn.id = `d${task.id}`; 49 | taskelement.appendChild(deletebtn); 50 | 51 | return taskelement; 52 | } 53 | 54 | static clearFields() { 55 | document.querySelector('#taskInput').value = ''; 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import './style.css'; 2 | 3 | import updateid from './modules/updateid.js'; 4 | 5 | import Task from './modules/constructor.js'; 6 | 7 | import Storage from './modules/storage.js'; 8 | 9 | import Interface from './modules/interface.js'; 10 | 11 | import removeFromStorage from './modules/removeFromStorage.js'; 12 | 13 | import toggleCompleted from './modules/toggleCompleted.js'; 14 | 15 | import clearAll from './modules/clearAll.js'; 16 | 17 | document.addEventListener('DOMContentLoaded', Interface.displayTasks); 18 | 19 | document.querySelector('.form').addEventListener('submit', (e) => { 20 | e.preventDefault(); 21 | 22 | const description = document.querySelector('#taskInput').value; 23 | 24 | let tasks = []; 25 | if (localStorage.getItem('tasks') !== null) { 26 | tasks = JSON.parse(localStorage.getItem('tasks')); 27 | } 28 | const id = tasks.length !== 0 ? tasks.length + 1 : 1; 29 | const task = new Task(description, id); 30 | 31 | Interface.addTaskToList(task); 32 | 33 | Storage.addTask(task); 34 | 35 | Interface.clearFields(); 36 | }); 37 | 38 | document.querySelector('#toDoItems').addEventListener('click', (e) => { 39 | if (e.target.textContent === '⋮') { 40 | e.target.nextElementSibling.classList.remove('hidden'); 41 | e.target.classList.add('hidden'); 42 | e.target.previousElementSibling.lastElementChild.removeAttribute('disabled'); 43 | } 44 | if (e.target.textContent === '🗑') { 45 | const { id } = e.target.parentElement; 46 | e.target.parentElement.remove(); 47 | removeFromStorage(id); 48 | Interface.displayTasks(); 49 | } 50 | }); 51 | 52 | document.querySelector('#toDoItems').addEventListener('keypress', (e) => { 53 | if (e.key === 'Enter') { 54 | e.target.setAttribute('disabled', true); 55 | e.target.parentElement.nextElementSibling.classList.remove('hidden'); 56 | e.target.parentElement.nextElementSibling.nextElementSibling.classList.add('hidden'); 57 | const selectedTask = Storage.getTasks() 58 | .find((task) => task.id === Number(e.target.parentElement.parentElement.id)); 59 | const selectedDesc = e.target.value; 60 | Storage.updateTask(selectedTask, selectedDesc); 61 | } 62 | }); 63 | 64 | document.querySelector('#toDoItems').addEventListener('change', (e) => { 65 | const { id } = e.target.parentElement.parentElement; 66 | const completed = e.target.checked; 67 | toggleCompleted(id, completed); 68 | }); 69 | 70 | document.querySelector('#clearAllBtn').addEventListener('click', () => { 71 | clearAll(); 72 | updateid.storage(); 73 | Interface.displayTasks(); 74 | }); 75 | -------------------------------------------------------------------------------- /.github/workflows/linters.yml: -------------------------------------------------------------------------------- 1 | name: Linters 2 | 3 | on: pull_request 4 | 5 | env: 6 | FORCE_COLOR: 1 7 | 8 | jobs: 9 | lighthouse: 10 | name: Lighthouse 11 | runs-on: ubuntu-22.04 12 | steps: 13 | - uses: actions/checkout@v2 14 | - uses: actions/setup-node@v1 15 | with: 16 | node-version: "12.x" 17 | - name: Setup Lighthouse 18 | run: npm install -g @lhci/cli@0.7.x 19 | - name: Lighthouse Report 20 | run: lhci autorun --upload.target=temporary-public-storage --collect.staticDistDir=. 21 | webhint: 22 | name: Webhint 23 | runs-on: ubuntu-22.04 24 | steps: 25 | - uses: actions/checkout@v2 26 | - uses: actions/setup-node@v1 27 | with: 28 | node-version: "12.x" 29 | - name: Setup Webhint 30 | run: | 31 | npm install --save-dev hint@7.x 32 | [ -f .hintrc ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.hintrc 33 | - name: Webhint Report 34 | run: npx hint . 35 | stylelint: 36 | name: Stylelint 37 | runs-on: ubuntu-22.04 38 | steps: 39 | - uses: actions/checkout@v2 40 | - uses: actions/setup-node@v1 41 | with: 42 | node-version: "12.x" 43 | - name: Setup Stylelint 44 | run: | 45 | npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x 46 | [ -f .stylelintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.stylelintrc.json 47 | - name: Stylelint Report 48 | run: npx stylelint "**/*.{css,scss}" 49 | eslint: 50 | name: ESLint 51 | runs-on: ubuntu-22.04 52 | steps: 53 | - uses: actions/checkout@v2 54 | - uses: actions/setup-node@v1 55 | with: 56 | node-version: "12.x" 57 | - name: Setup ESLint 58 | run: | 59 | npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x 60 | [ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.eslintrc.json 61 | - name: ESLint Report 62 | run: npx eslint . 63 | nodechecker: 64 | name: node_modules checker 65 | runs-on: ubuntu-22.04 66 | steps: 67 | - uses: actions/checkout@v2 68 | - name: Check node_modules existence 69 | run: | 70 | if [ -d "node_modules/" ]; then echo -e "\e[1;31mThe node_modules/ folder was pushed to the repo. Please remove it from the GitHub repository and try again."; echo -e "\e[1;32mYou can set up a .gitignore file with this folder included on it to prevent this from happening in the future." && exit 1; fi -------------------------------------------------------------------------------- /src/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,400;0,600;0,700;0,800;1,100;1,200;1,400;1,600;1,700;1,800&display=swap'); 2 | 3 | * { 4 | font-family: 'Raleway', sans-serif; 5 | margin: 0; 6 | padding: 0; 7 | box-sizing: border-box; 8 | } 9 | 10 | header { 11 | margin-bottom: 2rem; 12 | } 13 | 14 | .title { 15 | margin-top: 2rem; 16 | display: flex; 17 | justify-content: center; 18 | } 19 | 20 | body { 21 | background-color: rgb(245, 245, 245); 22 | display: block; 23 | margin-left: 5%; 24 | } 25 | 26 | main { 27 | display: flex; 28 | flex-direction: column; 29 | box-shadow: 0 2px 5px gray; 30 | max-width: 95%; 31 | } 32 | 33 | main p { 34 | padding: 1rem; 35 | display: flex; 36 | justify-content: space-between; 37 | background-color: white; 38 | margin-bottom: 2px; 39 | font-weight: bold; 40 | } 41 | 42 | .form { 43 | display: flex; 44 | justify-content: space-between; 45 | background-color: white; 46 | } 47 | 48 | #enterbtn, 49 | #taskInput { 50 | padding: 1rem; 51 | } 52 | 53 | #enterbtn { 54 | border: none; 55 | background-color: transparent; 56 | } 57 | 58 | #taskInput { 59 | border: none; 60 | width: 95%; 61 | } 62 | 63 | li { 64 | display: flex; 65 | justify-content: space-between; 66 | background-color: white; 67 | } 68 | 69 | li div { 70 | width: 95%; 71 | } 72 | 73 | #toDoList ul li div { 74 | padding: 1rem 0 1rem 1rem; 75 | display: flex; 76 | } 77 | 78 | .checkbox { 79 | margin-right: 1rem; 80 | } 81 | 82 | .morebtn, 83 | #enterbtn { 84 | cursor: pointer; 85 | } 86 | 87 | .morebtn { 88 | padding: 1rem; 89 | border: none; 90 | background-color: transparent; 91 | } 92 | 93 | #toDoItems { 94 | margin-top: 2px; 95 | display: flex; 96 | flex-direction: column; 97 | gap: 2px; 98 | } 99 | 100 | #clearAllBtn { 101 | display: flex; 102 | background-color: rgb(228, 228, 228); 103 | padding: 1rem 1rem 1rem 0.5rem; 104 | border: none; 105 | color: gray; 106 | justify-content: center; 107 | font-size: 1.125rem; 108 | } 109 | 110 | .hidden { 111 | display: none; 112 | } 113 | 114 | .deletebtn { 115 | padding: 0 0.5rem 0 0.5rem; 116 | max-height: 3rem; 117 | margin: 1rem 0.5rem 1rem 0; 118 | background-color: transparent; 119 | border: none; 120 | font-size: 1.125rem; 121 | } 122 | 123 | .text { 124 | padding: 0.25rem; 125 | width: 90%; 126 | border: none; 127 | background-color: transparent; 128 | } 129 | 130 | #toDoItems li input[type='checkbox']:checked + input { 131 | text-decoration: line-through; 132 | } 133 | 134 | li:has(.morebtn.hidden) { 135 | background-color: rgb(255, 224, 167); 136 | } 137 | 138 | #clearAllBtn, 139 | .deletebtn { 140 | cursor: pointer; 141 | } 142 | 143 | #clearAllBtn:hover { 144 | background-color: rgba(255, 0, 0, 0.55); 145 | color: black; 146 | } 147 | 148 | #clearAllBtn:active { 149 | background-color: rgba(0, 128, 0, 0.55); 150 | color: white; 151 | } 152 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![](https://img.shields.io/badge/Microverse-blueviolet) 2 | 3 | # Project Name 4 | 5 | > This project is an example of the use of webpack utility and logic. The project itself is a to-do list, with multiple functionalities such as: 6 | - Adding and removing tasks from a list 7 | - Marking items on the list with a checkbox, and a button to remove all marked items 8 | - 'more' button that splits into an editing button and a single remove button 9 | - Local storage to store items on the list 10 | 11 | 12 | ## Built With 13 | 14 | - HTML, CSS, JavaScript 15 | - webpack 16 | - Git, GitHub, VSCode 17 | 18 | ## Live Demo (if available) 19 | 20 | [Live Demo Link](https://mattgomb.github.io/To-do-list-webpack-v2/dist/) 21 | 22 | 23 | ## Getting Started 24 | 25 | 1 - Above the list of files, click on the "Code" button 26 | 27 | 2 - Copy the URL for the repository. 28 | 29 | 3 - To clone the repository using HTTPS, under "HTTPS", click . To clone the repository using an SSH key, including a certificate issued by your organization's SSH certificate authority, click SSH, then click . To clone a repository using GitHub CLI, click GitHub CLI, then click . The clipboard icon for copying the URL to clone a repository with GitHub CLI 30 | 31 | 4 - Open Git Bash. 32 | 33 | 5 - Change the current working directory to the location where you want the cloned directory. 34 | 35 | 6 - Type git clone, and then paste the URL you copied earlier. 36 | 37 | 7 - Press Enter to create your local clone. 38 | 39 | 40 | To get a local copy up and running follow these simple example steps. 41 | 42 | ### Prerequisites 43 | 44 | - Installation of Node.js, Node Package Manager, webpack module bundler, Jest testing environment, and Babel 45 | 46 | Functioning computer 47 | Internet connection 48 | Basic understanding of Git and GitHub 49 | 50 | ### Setup 51 | 52 | - The setup of webpack (https://webpack.js.org/guides/getting-started/) 53 | 54 | ### Install 55 | 56 | - A code editor (e.g. VSC) /text editor (e.g. notepad++) 57 | - Node.js 58 | 59 | 60 | ### Usage 61 | 62 | - Feel free to use this repo to play around with basic HTML, CSS, and JavaScript elements and solutions 63 | 64 | 65 | ### Run tests 66 | 67 | - No testing required 68 | 69 | ### Deployment 70 | 71 | 72 | 73 | ## Authors 74 | 75 | 👤 **Author1** 76 | 77 | - GitHub: [@MattGomb](https://github.com/MattGomb) 78 | - Twitter: [@MtysGombos1](https://twitter.com/MtysGombos1) 79 | - LinkedIn: [LinkedIn](https://www.linkedin.com/in/vaneoliverosp/) 80 | 81 | 82 | 👤 **Author2** 83 | 84 | 85 | - GitHub: [@vvoo21](https://github.com/vvoo21) 86 | - Twitter: [@vaneoliverosp](https://twitter.com/vaneoliverosp) 87 | - LinkedIn: [LinkedIn](https://linkedin.com/in/gombos-mátyás-28139771/) 88 | 89 | 90 | ## 🤝 Contributing 91 | 92 | Contributions, issues, and feature requests are welcome! 93 | 94 | Feel free to check the [issues page](../../issues/). 95 | 96 | ## Show your support 97 | 98 | Give a ⭐️ if you like this project! 99 | 100 | ## Acknowledgments 101 | 102 | - 103 | 104 | ## 📝 License 105 | 106 | This project is [MIT](./LICENSE) licensed. 107 | -------------------------------------------------------------------------------- /dist/main.js: -------------------------------------------------------------------------------- 1 | /* 2 | * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development"). 3 | * This devtool is neither made for production nor for readable output files. 4 | * It uses "eval()" calls to create a separate source file in the browser devtools. 5 | * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/) 6 | * or disable the default devtool with "devtool: false". 7 | * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/). 8 | */ 9 | /******/ (() => { // webpackBootstrap 10 | /******/ "use strict"; 11 | /******/ var __webpack_modules__ = ({ 12 | 13 | /***/ "./node_modules/css-loader/dist/cjs.js!./src/style.css": 14 | /*!*************************************************************!*\ 15 | !*** ./node_modules/css-loader/dist/cjs.js!./src/style.css ***! 16 | \*************************************************************/ 17 | /***/ ((module, __webpack_exports__, __webpack_require__) => { 18 | 19 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n___CSS_LOADER_EXPORT___.push([module.id, \"@import url(https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,400;0,600;0,700;0,800;1,100;1,200;1,400;1,600;1,700;1,800&display=swap);\"]);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"* {\\r\\n font-family: 'Raleway', sans-serif;\\r\\n margin: 0;\\r\\n padding: 0;\\r\\n box-sizing: border-box;\\r\\n}\\r\\n\\r\\nheader {\\r\\n margin-bottom: 2rem;\\r\\n}\\r\\n\\r\\n.title {\\r\\n margin-top: 2rem;\\r\\n display: flex;\\r\\n justify-content: center;\\r\\n}\\r\\n\\r\\nbody {\\r\\n background-color: rgb(245, 245, 245);\\r\\n display: block;\\r\\n margin-left: 5%;\\r\\n}\\r\\n\\r\\nmain {\\r\\n display: flex;\\r\\n flex-direction: column;\\r\\n box-shadow: 0 2px 5px gray;\\r\\n max-width: 95%;\\r\\n}\\r\\n\\r\\nmain p {\\r\\n padding: 1rem;\\r\\n display: flex;\\r\\n justify-content: space-between;\\r\\n background-color: white;\\r\\n margin-bottom: 2px;\\r\\n font-weight: bold;\\r\\n}\\r\\n\\r\\n.form {\\r\\n display: flex;\\r\\n justify-content: space-between;\\r\\n background-color: white;\\r\\n}\\r\\n\\r\\n#enterbtn,\\r\\n#taskInput {\\r\\n padding: 1rem;\\r\\n}\\r\\n\\r\\n#enterbtn {\\r\\n border: none;\\r\\n background-color: transparent;\\r\\n}\\r\\n\\r\\n#taskInput {\\r\\n border: none;\\r\\n width: 95%;\\r\\n}\\r\\n\\r\\nli {\\r\\n display: flex;\\r\\n justify-content: space-between;\\r\\n background-color: white;\\r\\n}\\r\\n\\r\\nli div {\\r\\n width: 95%;\\r\\n}\\r\\n\\r\\n#toDoList ul li div {\\r\\n padding: 1rem 0 1rem 1rem;\\r\\n display: flex;\\r\\n}\\r\\n\\r\\n.checkbox {\\r\\n margin-right: 1rem;\\r\\n}\\r\\n\\r\\n.morebtn,\\r\\n#enterbtn {\\r\\n cursor: pointer;\\r\\n}\\r\\n\\r\\n.morebtn {\\r\\n padding: 1rem;\\r\\n border: none;\\r\\n background-color: transparent;\\r\\n}\\r\\n\\r\\n#toDoItems {\\r\\n margin-top: 2px;\\r\\n display: flex;\\r\\n flex-direction: column;\\r\\n gap: 2px;\\r\\n}\\r\\n\\r\\n#clearAllBtn {\\r\\n display: flex;\\r\\n background-color: rgb(228, 228, 228);\\r\\n padding: 1rem 1rem 1rem 0.5rem;\\r\\n border: none;\\r\\n color: gray;\\r\\n justify-content: center;\\r\\n font-size: 1.125rem;\\r\\n}\\r\\n\\r\\n.hidden {\\r\\n display: none;\\r\\n}\\r\\n\\r\\n.deletebtn {\\r\\n padding: 0 0.5rem 0 0.5rem;\\r\\n max-height: 3rem;\\r\\n margin: 1rem 0.5rem 1rem 0;\\r\\n background-color: transparent;\\r\\n border: none;\\r\\n font-size: 1.125rem;\\r\\n}\\r\\n\\r\\n.text {\\r\\n padding: 0.25rem;\\r\\n width: 90%;\\r\\n border: none;\\r\\n background-color: transparent;\\r\\n}\\r\\n\\r\\n#toDoItems li input[type='checkbox']:checked + input {\\r\\n text-decoration: line-through;\\r\\n}\\r\\n\\r\\nli:has(.morebtn.hidden) {\\r\\n background-color: rgb(255, 224, 167);\\r\\n}\\r\\n\\r\\n#clearAllBtn,\\r\\n.deletebtn {\\r\\n cursor: pointer;\\r\\n}\\r\\n\\r\\n#clearAllBtn:hover {\\r\\n background-color: rgba(255, 0, 0, 0.55);\\r\\n color: black;\\r\\n}\\r\\n\\r\\n#clearAllBtn:active {\\r\\n background-color: rgba(0, 128, 0, 0.55);\\r\\n color: white;\\r\\n}\\r\\n\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/style.css?./node_modules/css-loader/dist/cjs.js"); 20 | 21 | /***/ }), 22 | 23 | /***/ "./node_modules/css-loader/dist/runtime/api.js": 24 | /*!*****************************************************!*\ 25 | !*** ./node_modules/css-loader/dist/runtime/api.js ***! 26 | \*****************************************************/ 27 | /***/ ((module) => { 28 | 29 | eval("\n\n/*\n MIT License http://www.opensource.org/licenses/mit-license.php\n Author Tobias Koppers @sokra\n*/\nmodule.exports = function (cssWithMappingToString) {\n var list = []; // return the list of modules as css string\n\n list.toString = function toString() {\n return this.map(function (item) {\n var content = \"\";\n var needLayer = typeof item[5] !== \"undefined\";\n\n if (item[4]) {\n content += \"@supports (\".concat(item[4], \") {\");\n }\n\n if (item[2]) {\n content += \"@media \".concat(item[2], \" {\");\n }\n\n if (needLayer) {\n content += \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\");\n }\n\n content += cssWithMappingToString(item);\n\n if (needLayer) {\n content += \"}\";\n }\n\n if (item[2]) {\n content += \"}\";\n }\n\n if (item[4]) {\n content += \"}\";\n }\n\n return content;\n }).join(\"\");\n }; // import a list of modules into the list\n\n\n list.i = function i(modules, media, dedupe, supports, layer) {\n if (typeof modules === \"string\") {\n modules = [[null, modules, undefined]];\n }\n\n var alreadyImportedModules = {};\n\n if (dedupe) {\n for (var k = 0; k < this.length; k++) {\n var id = this[k][0];\n\n if (id != null) {\n alreadyImportedModules[id] = true;\n }\n }\n }\n\n for (var _k = 0; _k < modules.length; _k++) {\n var item = [].concat(modules[_k]);\n\n if (dedupe && alreadyImportedModules[item[0]]) {\n continue;\n }\n\n if (typeof layer !== \"undefined\") {\n if (typeof item[5] === \"undefined\") {\n item[5] = layer;\n } else {\n item[1] = \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\").concat(item[1], \"}\");\n item[5] = layer;\n }\n }\n\n if (media) {\n if (!item[2]) {\n item[2] = media;\n } else {\n item[1] = \"@media \".concat(item[2], \" {\").concat(item[1], \"}\");\n item[2] = media;\n }\n }\n\n if (supports) {\n if (!item[4]) {\n item[4] = \"\".concat(supports);\n } else {\n item[1] = \"@supports (\".concat(item[4], \") {\").concat(item[1], \"}\");\n item[4] = supports;\n }\n }\n\n list.push(item);\n }\n };\n\n return list;\n};\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/css-loader/dist/runtime/api.js?"); 30 | 31 | /***/ }), 32 | 33 | /***/ "./node_modules/css-loader/dist/runtime/noSourceMaps.js": 34 | /*!**************************************************************!*\ 35 | !*** ./node_modules/css-loader/dist/runtime/noSourceMaps.js ***! 36 | \**************************************************************/ 37 | /***/ ((module) => { 38 | 39 | eval("\n\nmodule.exports = function (i) {\n return i[1];\n};\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/css-loader/dist/runtime/noSourceMaps.js?"); 40 | 41 | /***/ }), 42 | 43 | /***/ "./src/style.css": 44 | /*!***********************!*\ 45 | !*** ./src/style.css ***! 46 | \***********************/ 47 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 48 | 49 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ \"./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleDomAPI.js */ \"./node_modules/style-loader/dist/runtime/styleDomAPI.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertBySelector.js */ \"./node_modules/style-loader/dist/runtime/insertBySelector.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ \"./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertStyleElement.js */ \"./node_modules/style-loader/dist/runtime/insertStyleElement.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleTagTransform.js */ \"./node_modules/style-loader/dist/runtime/styleTagTransform.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../node_modules/css-loader/dist/cjs.js!./style.css */ \"./node_modules/css-loader/dist/cjs.js!./src/style.css\");\n\n \n \n \n \n \n \n \n \n \n\nvar options = {};\n\noptions.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());\noptions.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());\n\n options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, \"head\");\n \noptions.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());\noptions.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());\n\nvar update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"], options);\n\n\n\n\n /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"] && _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals ? _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals : undefined);\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/style.css?"); 50 | 51 | /***/ }), 52 | 53 | /***/ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js": 54 | /*!****************************************************************************!*\ 55 | !*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***! 56 | \****************************************************************************/ 57 | /***/ ((module) => { 58 | 59 | eval("\n\nvar stylesInDOM = [];\n\nfunction getIndexByIdentifier(identifier) {\n var result = -1;\n\n for (var i = 0; i < stylesInDOM.length; i++) {\n if (stylesInDOM[i].identifier === identifier) {\n result = i;\n break;\n }\n }\n\n return result;\n}\n\nfunction modulesToDom(list, options) {\n var idCountMap = {};\n var identifiers = [];\n\n for (var i = 0; i < list.length; i++) {\n var item = list[i];\n var id = options.base ? item[0] + options.base : item[0];\n var count = idCountMap[id] || 0;\n var identifier = \"\".concat(id, \" \").concat(count);\n idCountMap[id] = count + 1;\n var indexByIdentifier = getIndexByIdentifier(identifier);\n var obj = {\n css: item[1],\n media: item[2],\n sourceMap: item[3],\n supports: item[4],\n layer: item[5]\n };\n\n if (indexByIdentifier !== -1) {\n stylesInDOM[indexByIdentifier].references++;\n stylesInDOM[indexByIdentifier].updater(obj);\n } else {\n var updater = addElementStyle(obj, options);\n options.byIndex = i;\n stylesInDOM.splice(i, 0, {\n identifier: identifier,\n updater: updater,\n references: 1\n });\n }\n\n identifiers.push(identifier);\n }\n\n return identifiers;\n}\n\nfunction addElementStyle(obj, options) {\n var api = options.domAPI(options);\n api.update(obj);\n\n var updater = function updater(newObj) {\n if (newObj) {\n if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {\n return;\n }\n\n api.update(obj = newObj);\n } else {\n api.remove();\n }\n };\n\n return updater;\n}\n\nmodule.exports = function (list, options) {\n options = options || {};\n list = list || [];\n var lastIdentifiers = modulesToDom(list, options);\n return function update(newList) {\n newList = newList || [];\n\n for (var i = 0; i < lastIdentifiers.length; i++) {\n var identifier = lastIdentifiers[i];\n var index = getIndexByIdentifier(identifier);\n stylesInDOM[index].references--;\n }\n\n var newLastIdentifiers = modulesToDom(newList, options);\n\n for (var _i = 0; _i < lastIdentifiers.length; _i++) {\n var _identifier = lastIdentifiers[_i];\n\n var _index = getIndexByIdentifier(_identifier);\n\n if (stylesInDOM[_index].references === 0) {\n stylesInDOM[_index].updater();\n\n stylesInDOM.splice(_index, 1);\n }\n }\n\n lastIdentifiers = newLastIdentifiers;\n };\n};\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?"); 60 | 61 | /***/ }), 62 | 63 | /***/ "./node_modules/style-loader/dist/runtime/insertBySelector.js": 64 | /*!********************************************************************!*\ 65 | !*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***! 66 | \********************************************************************/ 67 | /***/ ((module) => { 68 | 69 | eval("\n\nvar memo = {};\n/* istanbul ignore next */\n\nfunction getTarget(target) {\n if (typeof memo[target] === \"undefined\") {\n var styleTarget = document.querySelector(target); // Special case to return head of iframe instead of iframe itself\n\n if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {\n try {\n // This will throw an exception if access to iframe is blocked\n // due to cross-origin restrictions\n styleTarget = styleTarget.contentDocument.head;\n } catch (e) {\n // istanbul ignore next\n styleTarget = null;\n }\n }\n\n memo[target] = styleTarget;\n }\n\n return memo[target];\n}\n/* istanbul ignore next */\n\n\nfunction insertBySelector(insert, style) {\n var target = getTarget(insert);\n\n if (!target) {\n throw new Error(\"Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.\");\n }\n\n target.appendChild(style);\n}\n\nmodule.exports = insertBySelector;\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/insertBySelector.js?"); 70 | 71 | /***/ }), 72 | 73 | /***/ "./node_modules/style-loader/dist/runtime/insertStyleElement.js": 74 | /*!**********************************************************************!*\ 75 | !*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***! 76 | \**********************************************************************/ 77 | /***/ ((module) => { 78 | 79 | eval("\n\n/* istanbul ignore next */\nfunction insertStyleElement(options) {\n var element = document.createElement(\"style\");\n options.setAttributes(element, options.attributes);\n options.insert(element, options.options);\n return element;\n}\n\nmodule.exports = insertStyleElement;\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/insertStyleElement.js?"); 80 | 81 | /***/ }), 82 | 83 | /***/ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js": 84 | /*!**********************************************************************************!*\ 85 | !*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***! 86 | \**********************************************************************************/ 87 | /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 88 | 89 | eval("\n\n/* istanbul ignore next */\nfunction setAttributesWithoutAttributes(styleElement) {\n var nonce = true ? __webpack_require__.nc : 0;\n\n if (nonce) {\n styleElement.setAttribute(\"nonce\", nonce);\n }\n}\n\nmodule.exports = setAttributesWithoutAttributes;\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js?"); 90 | 91 | /***/ }), 92 | 93 | /***/ "./node_modules/style-loader/dist/runtime/styleDomAPI.js": 94 | /*!***************************************************************!*\ 95 | !*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***! 96 | \***************************************************************/ 97 | /***/ ((module) => { 98 | 99 | eval("\n\n/* istanbul ignore next */\nfunction apply(styleElement, options, obj) {\n var css = \"\";\n\n if (obj.supports) {\n css += \"@supports (\".concat(obj.supports, \") {\");\n }\n\n if (obj.media) {\n css += \"@media \".concat(obj.media, \" {\");\n }\n\n var needLayer = typeof obj.layer !== \"undefined\";\n\n if (needLayer) {\n css += \"@layer\".concat(obj.layer.length > 0 ? \" \".concat(obj.layer) : \"\", \" {\");\n }\n\n css += obj.css;\n\n if (needLayer) {\n css += \"}\";\n }\n\n if (obj.media) {\n css += \"}\";\n }\n\n if (obj.supports) {\n css += \"}\";\n }\n\n var sourceMap = obj.sourceMap;\n\n if (sourceMap && typeof btoa !== \"undefined\") {\n css += \"\\n/*# sourceMappingURL=data:application/json;base64,\".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), \" */\");\n } // For old IE\n\n /* istanbul ignore if */\n\n\n options.styleTagTransform(css, styleElement, options.options);\n}\n\nfunction removeStyleElement(styleElement) {\n // istanbul ignore if\n if (styleElement.parentNode === null) {\n return false;\n }\n\n styleElement.parentNode.removeChild(styleElement);\n}\n/* istanbul ignore next */\n\n\nfunction domAPI(options) {\n var styleElement = options.insertStyleElement(options);\n return {\n update: function update(obj) {\n apply(styleElement, options, obj);\n },\n remove: function remove() {\n removeStyleElement(styleElement);\n }\n };\n}\n\nmodule.exports = domAPI;\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/styleDomAPI.js?"); 100 | 101 | /***/ }), 102 | 103 | /***/ "./node_modules/style-loader/dist/runtime/styleTagTransform.js": 104 | /*!*********************************************************************!*\ 105 | !*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***! 106 | \*********************************************************************/ 107 | /***/ ((module) => { 108 | 109 | eval("\n\n/* istanbul ignore next */\nfunction styleTagTransform(css, styleElement) {\n if (styleElement.styleSheet) {\n styleElement.styleSheet.cssText = css;\n } else {\n while (styleElement.firstChild) {\n styleElement.removeChild(styleElement.firstChild);\n }\n\n styleElement.appendChild(document.createTextNode(css));\n }\n}\n\nmodule.exports = styleTagTransform;\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./node_modules/style-loader/dist/runtime/styleTagTransform.js?"); 110 | 111 | /***/ }), 112 | 113 | /***/ "./src/index.js": 114 | /*!**********************!*\ 115 | !*** ./src/index.js ***! 116 | \**********************/ 117 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 118 | 119 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _style_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./style.css */ \"./src/style.css\");\n/* harmony import */ var _modules_updateid_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/updateid.js */ \"./src/modules/updateid.js\");\n/* harmony import */ var _modules_constructor_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules/constructor.js */ \"./src/modules/constructor.js\");\n/* harmony import */ var _modules_storage_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modules/storage.js */ \"./src/modules/storage.js\");\n/* harmony import */ var _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modules/interface.js */ \"./src/modules/interface.js\");\n/* harmony import */ var _modules_removeFromStorage_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./modules/removeFromStorage.js */ \"./src/modules/removeFromStorage.js\");\n/* harmony import */ var _modules_toggleCompleted_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./modules/toggleCompleted.js */ \"./src/modules/toggleCompleted.js\");\n/* harmony import */ var _modules_clearAll_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./modules/clearAll.js */ \"./src/modules/clearAll.js\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\ndocument.addEventListener('DOMContentLoaded', _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"].displayTasks);\n\ndocument.querySelector('.form').addEventListener('submit', (e) => {\n e.preventDefault();\n\n const description = document.querySelector('#taskInput').value;\n\n let tasks = [];\n if (localStorage.getItem('tasks') !== null) {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n const id = tasks.length !== 0 ? tasks.length + 1 : 1;\n const task = new _modules_constructor_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"](description, id);\n\n _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"].addTaskToList(task);\n\n _modules_storage_js__WEBPACK_IMPORTED_MODULE_3__[\"default\"].addTask(task);\n\n _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"].clearFields();\n});\n\ndocument.querySelector('#toDoItems').addEventListener('click', (e) => {\n if (e.target.textContent === '⋮') {\n e.target.nextElementSibling.classList.remove('hidden');\n e.target.classList.add('hidden');\n e.target.previousElementSibling.lastElementChild.removeAttribute('disabled');\n }\n if (e.target.textContent === '🗑') {\n const { id } = e.target.parentElement;\n e.target.parentElement.remove();\n (0,_modules_removeFromStorage_js__WEBPACK_IMPORTED_MODULE_5__[\"default\"])(id);\n _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"].displayTasks();\n }\n});\n\ndocument.querySelector('#toDoItems').addEventListener('keypress', (e) => {\n if (e.key === 'Enter') {\n e.target.setAttribute('disabled', true);\n e.target.parentElement.nextElementSibling.classList.remove('hidden');\n e.target.parentElement.nextElementSibling.nextElementSibling.classList.add('hidden');\n const selectedTask = _modules_storage_js__WEBPACK_IMPORTED_MODULE_3__[\"default\"].getTasks()\n .find((task) => task.id === Number(e.target.parentElement.parentElement.id));\n const selectedDesc = e.target.value;\n _modules_storage_js__WEBPACK_IMPORTED_MODULE_3__[\"default\"].updateTask(selectedTask, selectedDesc);\n }\n});\n\ndocument.querySelector('#toDoItems').addEventListener('change', (e) => {\n const { id }= e.target.parentElement.parentElement;\n const completed = e.target.checked;\n (0,_modules_toggleCompleted_js__WEBPACK_IMPORTED_MODULE_6__[\"default\"])(id, completed);\n});\n\ndocument.querySelector('#clearAllBtn').addEventListener('click', () => {\n (0,_modules_clearAll_js__WEBPACK_IMPORTED_MODULE_7__[\"default\"])();\n _modules_updateid_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"].storage();\n _modules_interface_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"].displayTasks();\n});\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/index.js?"); 120 | 121 | /***/ }), 122 | 123 | /***/ "./src/modules/clearAll.js": 124 | /*!*********************************!*\ 125 | !*** ./src/modules/clearAll.js ***! 126 | \*********************************/ 127 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 128 | 129 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nfunction clearAll() {\n let tasks = [];\n if (localStorage.getItem('tasks') !== null) {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n const newTasks = tasks.filter((task) => task.completed === false);\n localStorage.setItem('tasks', JSON.stringify(newTasks));\n \n return newTasks;\n\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (clearAll);\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/clearAll.js?"); 130 | 131 | /***/ }), 132 | 133 | /***/ "./src/modules/constructor.js": 134 | /*!************************************!*\ 135 | !*** ./src/modules/constructor.js ***! 136 | \************************************/ 137 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 138 | 139 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Task)\n/* harmony export */ });\n// module to create task\nclass Task {\n constructor(description = '', id = 1) {\n this.description = description;\n this.id = id;\n this.completed = false;\n this.editable = false;\n }\n}\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/constructor.js?"); 140 | 141 | /***/ }), 142 | 143 | /***/ "./src/modules/interface.js": 144 | /*!**********************************!*\ 145 | !*** ./src/modules/interface.js ***! 146 | \**********************************/ 147 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 148 | 149 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Interface)\n/* harmony export */ });\n/* harmony import */ var _storage_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./storage.js */ \"./src/modules/storage.js\");\n\n\nclass Interface {\n static displayTasks() {\n const tasks = _storage_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"].getTasks();\n document.querySelector('#toDoItems').innerHTML = '';\n if (tasks.length !== 0) {\n tasks.forEach((task) => Interface.addTaskToList(task));\n }\n }\n\n static addTaskToList(task) {\n const list = document.querySelector('#toDoItems');\n const taskelement = document.createElement('li');\n taskelement.setAttribute('id', task.id);\n list.appendChild(taskelement);\n\n const wrapper = document.createElement('div');\n taskelement.appendChild(wrapper);\n\n const label = document.createElement('label');\n label.setAttribute('for', `check${task.id}`);\n wrapper.appendChild(label);\n\n const checkbox = document.createElement('input');\n checkbox.setAttribute('type', 'checkbox');\n checkbox.classList.add('checkbox');\n checkbox.id = `check${task.id}`;\n wrapper.appendChild(checkbox);\n\n const text = document.createElement('input');\n text.classList.add('text');\n text.setAttribute('id', `text${task.id}`);\n text.setAttribute('disabled', true);\n text.value = task.description;\n wrapper.appendChild(text);\n\n const morebtn = document.createElement('button');\n morebtn.classList.add('morebtn');\n morebtn.innerHTML = '⋮';\n morebtn.id = `m${task.id}`;\n taskelement.appendChild(morebtn);\n\n const deletebtn = document.createElement('button');\n deletebtn.classList.add('hidden');\n deletebtn.classList.add('deletebtn');\n deletebtn.innerHTML = '🗑';\n deletebtn.id = `d${task.id}`;\n taskelement.appendChild(deletebtn);\n\n return taskelement;\n }\n\n static clearFields() {\n document.querySelector('#taskInput').value = '';\n }\n}\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/interface.js?"); 150 | 151 | /***/ }), 152 | 153 | /***/ "./src/modules/removeFromStorage.js": 154 | /*!******************************************!*\ 155 | !*** ./src/modules/removeFromStorage.js ***! 156 | \******************************************/ 157 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 158 | 159 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _updateid_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./updateid.js */ \"./src/modules/updateid.js\");\n\n\nconst removeFromStorage = (id) => {\n let tasks = [];\n if (localStorage.getItem('tasks') !== null) {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n const newTasks = tasks.filter((task) => task.id !== +id);\n localStorage.setItem('tasks', JSON.stringify(newTasks));\n _updateid_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"].storage();\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (removeFromStorage);\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/removeFromStorage.js?"); 160 | 161 | /***/ }), 162 | 163 | /***/ "./src/modules/storage.js": 164 | /*!********************************!*\ 165 | !*** ./src/modules/storage.js ***! 166 | \********************************/ 167 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 168 | 169 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Storage)\n/* harmony export */ });\nclass Storage {\n static getTasks() {\n let tasks;\n if (!localStorage.getItem('tasks')) {\n tasks = [];\n } else {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n\n return tasks;\n }\n\n static addTask(task) {\n const tasks = Storage.getTasks();\n\n tasks.push(task);\n\n localStorage.setItem('tasks', JSON.stringify(tasks));\n \n return Storage.getTasks();\n \n }\n\n static updateTask(task, description) {\n const tasks = Storage.getTasks();\n\n const activeTask = tasks.find((selected) => selected.id === task.id);\n\n activeTask.description = description;\n\n localStorage.setItem('tasks', JSON.stringify(tasks));\n\n return activeTask;\n }\n}\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/storage.js?"); 170 | 171 | /***/ }), 172 | 173 | /***/ "./src/modules/toggleCompleted.js": 174 | /*!****************************************!*\ 175 | !*** ./src/modules/toggleCompleted.js ***! 176 | \****************************************/ 177 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 178 | 179 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nconst toggleCompleted = (id, completed) => {\n let tasks = [];\n if (localStorage.getItem('tasks') !== null) {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n\n if (completed) {\n tasks[id - 1].completed = true;\n } else {\n tasks[id - 1].completed = false;\n }\n localStorage.setItem('tasks', JSON.stringify(tasks));\n\n return tasks[id - 1];\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (toggleCompleted);\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/toggleCompleted.js?"); 180 | 181 | /***/ }), 182 | 183 | /***/ "./src/modules/updateid.js": 184 | /*!*********************************!*\ 185 | !*** ./src/modules/updateid.js ***! 186 | \*********************************/ 187 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 188 | 189 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nconst updateid = {\n storage() {\n let tasks;\n if (localStorage.getItem('tasks') === null) {\n tasks = [];\n } else {\n tasks = JSON.parse(localStorage.getItem('tasks'));\n }\n\n tasks.forEach((element, index) => {\n element.id = index + 1;\n });\n\n localStorage.setItem('tasks', JSON.stringify(tasks));\n },\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (updateid);\n\n\n//# sourceURL=webpack://to-do-list-webpack-v2/./src/modules/updateid.js?"); 190 | 191 | /***/ }) 192 | 193 | /******/ }); 194 | /************************************************************************/ 195 | /******/ // The module cache 196 | /******/ var __webpack_module_cache__ = {}; 197 | /******/ 198 | /******/ // The require function 199 | /******/ function __webpack_require__(moduleId) { 200 | /******/ // Check if module is in cache 201 | /******/ var cachedModule = __webpack_module_cache__[moduleId]; 202 | /******/ if (cachedModule !== undefined) { 203 | /******/ return cachedModule.exports; 204 | /******/ } 205 | /******/ // Create a new module (and put it into the cache) 206 | /******/ var module = __webpack_module_cache__[moduleId] = { 207 | /******/ id: moduleId, 208 | /******/ // no module.loaded needed 209 | /******/ exports: {} 210 | /******/ }; 211 | /******/ 212 | /******/ // Execute the module function 213 | /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); 214 | /******/ 215 | /******/ // Return the exports of the module 216 | /******/ return module.exports; 217 | /******/ } 218 | /******/ 219 | /************************************************************************/ 220 | /******/ /* webpack/runtime/compat get default export */ 221 | /******/ (() => { 222 | /******/ // getDefaultExport function for compatibility with non-harmony modules 223 | /******/ __webpack_require__.n = (module) => { 224 | /******/ var getter = module && module.__esModule ? 225 | /******/ () => (module['default']) : 226 | /******/ () => (module); 227 | /******/ __webpack_require__.d(getter, { a: getter }); 228 | /******/ return getter; 229 | /******/ }; 230 | /******/ })(); 231 | /******/ 232 | /******/ /* webpack/runtime/define property getters */ 233 | /******/ (() => { 234 | /******/ // define getter functions for harmony exports 235 | /******/ __webpack_require__.d = (exports, definition) => { 236 | /******/ for(var key in definition) { 237 | /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { 238 | /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); 239 | /******/ } 240 | /******/ } 241 | /******/ }; 242 | /******/ })(); 243 | /******/ 244 | /******/ /* webpack/runtime/hasOwnProperty shorthand */ 245 | /******/ (() => { 246 | /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) 247 | /******/ })(); 248 | /******/ 249 | /******/ /* webpack/runtime/make namespace object */ 250 | /******/ (() => { 251 | /******/ // define __esModule on exports 252 | /******/ __webpack_require__.r = (exports) => { 253 | /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 254 | /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 255 | /******/ } 256 | /******/ Object.defineProperty(exports, '__esModule', { value: true }); 257 | /******/ }; 258 | /******/ })(); 259 | /******/ 260 | /******/ /* webpack/runtime/nonce */ 261 | /******/ (() => { 262 | /******/ __webpack_require__.nc = undefined; 263 | /******/ })(); 264 | /******/ 265 | /************************************************************************/ 266 | /******/ 267 | /******/ // startup 268 | /******/ // Load entry module and return exports 269 | /******/ // This entry module can't be inlined because the eval devtool is used. 270 | /******/ var __webpack_exports__ = __webpack_require__("./src/index.js"); 271 | /******/ 272 | /******/ })() 273 | ; --------------------------------------------------------------------------------