text: (()=>{var n={529:n=>{function e(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=new Array(e);t<e;t++)r[t]=n[t];return r}function t(n,e){for(var t=0;t<e.length;t++){var r=e[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(n,r.key,r)}}n.exports=function(){function n(){!function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n)}var r,i;return r=n,(i=[{key:"sort",value:function(n){var t=this,r=document.querySelectorAll("li");this.current=null,this.currentpos=0,this.droppedpos=0,r.forEach((function(i){i.addEventListener("dragstart",(function(n){t.current=n.target,n.target.classList.add("dragged")})),i.addEventListener("dragenter",(function(n){n.target!==t.current&&n.target.classList.add("active")})),i.addEventListener("dragleave",(function(n){n.target.classList.remove("active")})),i.addEventListener("dragend",(function(){var n,t=function(n,t){var r="undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(!r){if(Array.isArray(n)||(r=function(n,t){if(n){if("string"==typeof n)return e(n,t);var r=Object.prototype.toString.call(n).slice(8,-1);return"Object"===r&&n.constructor&&(r=n.constructor.name),"Map"===r||"Set"===r?Array.from(n):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?e(n,t):void 0}}(n))||t&&n&&"number"==typeof n.length){r&&(n=r);var i=0,a=function(){};return{s:a,n:function(){return i>=n.length?{done:!0}:{done:!1,value:n[i++]}},e:function(n){throw n},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,s=!0,c=!1;return{s:function(){r=r.call(n)},n:function(){var n=r.next();return s=n.done,n},e:function(n){c=!0,o=n},f:function(){try{s||null==r.return||r.return()}finally{if(c)throw o}}}}(r);try{for(t.s();!(n=t.n()).done;){var i=n.value;i.classList.remove("active"),i.classList.remove("dragged")}}catch(n){t.e(n)}finally{t.f()}})),i.addEventListener("dragover",(function(n){n.preventDefault()})),i.addEventListener("drop",(function(e){if(e.preventDefault(),e.target!==t.current){for(var r=document.querySelectorAll("li"),i=0;i<r.length;i+=1)t.current===r[i]&&(t.currentpos=i),e.target===r[i]&&(t.droppedpos=i);t.currentpos<t.droppedpos?e.target.parentNode.insertBefore(t.current,e.target.nextSibling):e.target.parentNode.insertBefore(t.current,e.target),n(t.currentpos,t.droppedpos)}}))}))}}])&&t(r.prototype,i),n}()},754:n=>{function e(n,e){for(var t=0;t<e.length;t++){var r=e[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(n,r.key,r)}}n.exports=function(){function n(){!function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.tasks=JSON.parse(localStorage.getItem("tasks"))||[]}var t,r;return t=n,(r=[{key:"bindTaskListChange",value:function(n){this.onTaskListChanged=n}},{key:"commit",value:function(n){localStorage.setItem("tasks",JSON.stringify(n)),this.onTaskListChanged(n),window.location.reload()}},{key:"sort",value:function(n,e){var t=this.tasks[n],r=this.tasks[e];t.index=e,r.index=n,this.tasks.splice(e,1,t),this.tasks.splice(n,1,r),this.commit(this.tasks)}},{key:"addTask",value:function(n){var e={index:this.tasks.length>0?this.tasks[this.tasks.length-1].index+1:0,description:n,completed:!1};this.tasks.push(e),this.commit(this.tasks)}}])&&e(t.prototype,r),n}()},182:n=>{function e(n,e){for(var t=0;t<e.length;t++){var r=e[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(n,r.key,r)}}n.exports=function(){function n(e){!function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.commit=e}var t,r;return t=n,(r=[{key:"toggleTask",value:function(n,e){return this.tasks=e,this.tasks[n].completed=!this.tasks[n].completed,this.tasks}}])&&e(t.prototype,r),n}()},885:n=>{function e(n,e){for(var t=0;t<e.length;t++){var r=e[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(n,r.key,r)}}n.exports=function(){function n(){!function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.form=document.querySelector("FORM"),this.taskList=document.querySelector("#todoList"),this.input=document.querySelector("input[name=todo]")}var t,r;return t=n,(r=[{key:"taskText",get:function(){return this.input.value}},{key:"displayTasks",value:function(n){for(var e=this;this.taskList.firstChild;)this.taskList.removeChild(this.taskList.firstChild);if(0===n.length){var t=document.createElement("li");t.textContent="Nothing to do! Add a task?",this.taskList.append(t)}else n.forEach((function(n){var t=document.createElement("li");t.id=n.index,t.draggable=!0;var r=document.createElement("div");r.className="todo-item";var i=document.createElement("input");i.type="checkbox",i.id=n.index,i.checked=n.completed;var a=document.createElement("div","todo-drag");a.innerHTML='<i class="bi bi-grip-vertical"></i>';var o=document.createElement("span");if(o.contentEditable=!0,o.classList.add("editable"),n.completed){var s=document.createElement("s");s.textContent=n.description,o.append(s)}else o.textContent=n.description;r.append(i,o),t.append(r,a),e.taskList.append(t)}))}},{key:"bindAddTask",value:function(n){var e=this;this.form.addEventListener("submit",(function(t){t.preventDefault(),e.taskText&&(n(e.taskText),e.form.reset())}))}},{key:"bindToggleTask",value:function(n){this.taskList.addEventListener("change",(function(e){if("checkbox"===e.target.type){var t=parseInt(e.target.id,10);n(t)}}))}}])&&e(t.prototype,r),n}()},426:(n,e,t)=>{"use strict";t.d(e,{Z:()=>a});var r=t(645),i=t.n(r)()((function(n){return n[1]}));i.push([n.id,"@import url(https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css);"]),i.push([n.id,"*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n*:focus {\n  outline: none;\n}\n\nhtml {\n  font-family: sans-serif;\n  font-size: 1rem;\n  color: #444;\n}\n\n.container {\n  max-width: 450px;\n  margin: 2rem auto;\n  border: 2px solid rgba(0, 0, 0, 0.17);\n  border-radius: 0.5em;\n  padding: 0;\n}\n\n.input-field {\n  position: relative;\n  padding-right: 1.5em;\n}\n\n.field-icon {\n  position: absolute;\n  right: 0;\n  padding: 0;\n  margin: 1.2em 1.5em;\n  color: rgba(0, 0, 0, 0.27);\n}\n\nform input {\n  width: 100%;\n  border: none;\n  font-size: 1rem;\n  font-weight: 400;\n  font-style: italic;\n  color: rgba(0, 0, 0, 0.54);\n  padding: 1em 0 1em 1em;\n}\n\n.header {\n  display: flex;\n  justify-content: space-between;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.27);\n  align-items: center;\n  padding-right: 1.5em;\n}\n\n.header i {\n  color: rgba(0, 0, 0, 0.27);\n}\n\n.active {\n  background: rgba(0, 0, 0, 0.1);\n}\n\n.dragged {\n  background: rgba(0, 0, 0, 0.17);\n  opacity: 0.2;\n}\n\n.title {\n  color: #222;\n  font-size: 1.2rem;\n  font-weight: 500;\n  padding: 0.7em 1em;\n  margin: 0;\n}\n\n.todo-item {\n  display: flex;\n  align-items: center;\n}\n\n.todo-item input {\n  margin: 1em;\n}\n\n.todo-item p {\n  margin: 0;\n  font-size: 1.1rem;\n}\n\nul {\n  padding: 0;\n  margin: 0;\n}\n\nli {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0.4em 1em;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.27);\n  border-top: 1px solid rgba(0, 0, 0, 0.27);\n}\n\n.todo-drag {\n  padding-right: 0.4em;\n  color: rgba(0, 0, 0, 0.27);\n}\n\nli span {\n  display: inline-block;\n  padding: 0.5rem;\n  width: 250px;\n  border-radius: 4px;\n  border: 2px solid transparent;\n}\n\nli span:hover {\n  background: rgba(179, 215, 255, 0.52);\n}\n\nli span:focus {\n  outline: 0;\n  border: 2px solid #007bff;\n  background: rgba(179, 207, 255, 0.52);\n}\n\n.todo-clear {\n  font-size: 1rem;\n  text-align: center;\n  font-weight: 400;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.27);\n  padding: 1em;\n  margin: 0;\n  color: rgba(0, 0, 0, 0.54);\n  background: rgba(0, 0, 0, 0.02);\n}\n",""]);const a=i},645:n=>{"use strict";n.exports=function(n){var e=[];return e.toString=function(){return this.map((function(e){var t=n(e);return e[2]?"@media ".concat(e[2]," {").concat(t,"}"):t})).join("")},e.i=function(n,t,r){"string"==typeof n&&(n=[[null,n,""]]);var i={};if(r)for(var a=0;a<this.length;a++){var o=this[a][0];null!=o&&(i[o]=!0)}for(var s=0;s<n.length;s++){var c=[].concat(n[s]);r&&i[c[0]]||(t&&(c[2]?c[2]="".concat(t," and ").concat(c[2]):c[2]=t),e.push(c))}},e}},379:(n,e,t)=>{"use strict";var r,i=function(){var n={};return function(e){if(void 0===n[e]){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(n){t=null}n[e]=t}return n[e]}}(),a=[];function o(n){for(var e=-1,t=0;t<a.length;t++)if(a[t].identifier===n){e=t;break}return e}function s(n,e){for(var t={},r=[],i=0;i<n.length;i++){var s=n[i],c=e.base?s[0]+e.base:s[0],d=t[c]||0,l="".concat(c," ").concat(d);t[c]=d+1;var u=o(l),f={css:s[1],media:s[2],sourceMap:s[3]};-1!==u?(a[u].references++,a[u].updater(f)):a.push({identifier:l,updater:g(f,e),references:1}),r.push(l)}return r}function c(n){var e=document.createElement("style"),r=n.attributes||{};if(void 0===r.nonce){var a=t.nc;a&&(r.nonce=a)}if(Object.keys(r).forEach((function(n){e.setAttribute(n,r[n])})),"function"==typeof n.insert)n.insert(e);else{var o=i(n.insert||"head");if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(e)}return e}var d,l=(d=[],function(n,e){return d[n]=e,d.filter(Boolean).join("\n")});function u(n,e,t,r){var i=t?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(n.styleSheet)n.styleSheet.cssText=l(e,i);else{var a=document.createTextNode(i),o=n.childNodes;o[e]&&n.removeChild(o[e]),o.length?n.insertBefore(a,o[e]):n.appendChild(a)}}function f(n,e,t){var r=t.css,i=t.media,a=t.sourceMap;if(i?n.setAttribute("media",i):n.removeAttribute("media"),a&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),n.styleSheet)n.styleSheet.cssText=r;else{for(;n.firstChild;)n.removeChild(n.firstChild);n.appendChild(document.createTextNode(r))}}var p=null,h=0;function g(n,e){var t,r,i;if(e.singleton){var a=h++;t=p||(p=c(e)),r=u.bind(null,t,a,!1),i=u.bind(null,t,a,!0)}else t=c(e),r=f.bind(null,t,e),i=function(){!function(n){if(null===n.parentNode)return!1;n.parentNode.removeChild(n)}(t)};return r(n),function(e){if(e){if(e.css===n.css&&e.media===n.media&&e.sourceMap===n.sourceMap)return;r(n=e)}else i()}}n.exports=function(n,e){(e=e||{}).singleton||"boolean"==typeof e.singleton||(e.singleton=(void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r));var t=s(n=n||[],e);return function(n){if(n=n||[],"[object Array]"===Object.prototype.toString.call(n)){for(var r=0;r<t.length;r++){var i=o(t[r]);a[i].references--}for(var c=s(n,e),d=0;d<t.length;d++){var l=o(t[d]);0===a[l].references&&(a[l].updater(),a.splice(l,1))}t=c}}}}},e={};function t(r){var i=e[r];if(void 0!==i)return i.exports;var a=e[r]={id:r,exports:{}};return n[r](a,a.exports,t),a.exports}t.n=n=>{var e=n&&n.__esModule?()=>n.default:()=>n;return t.d(e,{a:e}),e},t.d=(n,e)=>{for(var r in e)t.o(e,r)&&!t.o(n,r)&&Object.defineProperty(n,r,{enumerable:!0,get:e[r]})},t.o=(n,e)=>Object.prototype.hasOwnProperty.call(n,e),(()=>{"use strict";var n=t(379),e=t.n(n),r=t(426);e()(r.Z,{insert:"head",singleton:!1}),r.Z.locals;var i=t(754),a=t.n(i),o=t(885),s=t.n(o),c=t(529),d=t.n(c),l=t(182),u=t.n(l);function f(n,e,t){return e in n?Object.defineProperty(n,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):n[e]=t,n}new function n(e,t,r,i){var a=this;!function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),f(this,"onTaskListChanged",(function(n){a.view.displayTasks(n)})),f(this,"handleAddTask",(function(n){a.task.addTask(n)})),f(this,"handleToggleTask",(function(n){var e=a.toggle.toggleTask(n,a.task.tasks);a.task.commit(e)})),f(this,"hendleDndTask",(function(n,e){a.task.sort(n,e)})),this.task=e,this.view=t,this.dnd=r,this.toggle=i,this.task.bindTaskListChange(this.onTaskListChanged),this.view.bindAddTask(this.handleAddTask),this.view.bindToggleTask(this.handleToggleTask),this.onTaskListChanged(this.task.tasks),this.dnd.sort(this.hendleDndTask)}(new(a()),new(s()),new(d()),new(u()))})()})();