diff --git a/Multiply/index.html b/Multiply/index.html new file mode 100644 index 0000000..702e9e9 --- /dev/null +++ b/Multiply/index.html @@ -0,0 +1,38 @@ + + + + + + Multiplication + + + +
+

Multiplication

+
+ +
+
+

Number: + + +

+
+ +
+

+ +

+
+
+ + + + + + + \ No newline at end of file diff --git a/Multiply/scrip.js b/Multiply/scrip.js new file mode 100644 index 0000000..3c08643 --- /dev/null +++ b/Multiply/scrip.js @@ -0,0 +1,23 @@ +function calcular() { +var txtn = window.document.getElementById('txtnum') +var n = Number(txtn.value) +var lista = document.getElementById('listaNumeros') +lista.innerHTML = '' + + if ( txtn.value.length == 0 || isNaN(n)) { + window.alert('Enter a number to Multiply!') + var opcao = document.createElement('option') + opcao.text = 'Enter a number above' + lista.add(opcao); + } else { + + for(var i = 0; i <= 10; i++) { + var opcao = document.createElement('option') + var calc = n * i + opcao.value = `tab${i}` + opcao.text = `${n} x ${i} = ${calc}` + lista.add(opcao); + } + } + txtn.value = '' +} \ No newline at end of file diff --git a/Multiply/style.css b/Multiply/style.css new file mode 100644 index 0000000..674c6f4 --- /dev/null +++ b/Multiply/style.css @@ -0,0 +1,30 @@ +body { + background-color: rgb(115, 115, 201); + font: normal 15pt arial; +} + +header { + color: white; + text-align: center; +} + +section { + background-color: white; + border-radius: 10px; + padding: 15px; + width: 500px; + margin: auto; + text-align: center; + box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.493); +} + +#lista{ + text-align: left; +} + +footer { + color: white; + text-align: center; + font-style: italic; + margin-top: 20px; +} \ No newline at end of file diff --git a/TodoList/index.js b/TodoList/index.js index d3ab656..4ba800a 100644 --- a/TodoList/index.js +++ b/TodoList/index.js @@ -7,52 +7,56 @@ let completedCount = 0; let totalCount = 0; addButton.addEventListener('click', function (e) { - e.preventDefault(); - const paragraph1 = document.createElement('div'); - const paragraph2 = document.createElement('div'); - const cont = document.createElement('div'); - const checkbox = document.createElement('input'); - checkbox.type = 'checkbox'; - paragraph1.appendChild(checkbox); - const text = document.createTextNode(input.value); - paragraph1.appendChild(text); - const editButton = document.createElement('button'); - editButton.textContent = '✒️'; - paragraph2.appendChild(editButton); - const deleteButton = document.createElement('button'); - deleteButton.textContent = '❎'; - paragraph2.appendChild(deleteButton); - cont.appendChild(paragraph1); - cont.appendChild(paragraph2); - todoContainer.appendChild(cont); - input.value = ''; - totalCount++; - updateCountDisplay(); - checkbox.addEventListener('click', function () { - if (checkbox.checked) { - cont.style.textDecoration = 'line-through'; - completedCount++; - } else { - cont.style.textDecoration = 'none'; - completedCount--; - } - updateCountDisplay(); - }); - editButton.addEventListener('click', function () { - const editText = prompt('Edit task:', text.textContent); - if (editText !== null) { - text.textContent = editText; - } - }); - deleteButton.addEventListener('click', function () { - todoContainer.removeChild(cont); - totalCount--; - if (checkbox.checked) { - completedCount--; - } + if (input.value.length == 0) { + window.alert("You cannot leave the field blank") + } else { + + e.preventDefault(); + const paragraph1 = document.createElement('div'); + const paragraph2 = document.createElement('div'); + const cont = document.createElement('div'); + const checkbox = document.createElement('input'); + checkbox.type = 'checkbox'; + paragraph1.appendChild(checkbox); + const text = document.createTextNode(input.value); + paragraph1.appendChild(text); + const editButton = document.createElement('button'); + editButton.textContent = '✒️'; + paragraph2.appendChild(editButton); + const deleteButton = document.createElement('button'); + deleteButton.textContent = '❎'; + paragraph2.appendChild(deleteButton); + cont.appendChild(paragraph1); + cont.appendChild(paragraph2); + todoContainer.appendChild(cont); + input.value = ''; + totalCount++; updateCountDisplay(); - }); -}); + checkbox.addEventListener('click', function () { + if (checkbox.checked) { + cont.style.textDecoration = 'line-through'; + completedCount++; + } else { + cont.style.textDecoration = 'none'; + completedCount--; + } + updateCountDisplay(); + }); + editButton.addEventListener('click', function () { + const editText = prompt('Edit task:', text.textContent); + if (editText !== null) { + text.textContent = editText; + } + }); + deleteButton.addEventListener('click', function () { + todoContainer.removeChild(cont); + totalCount--; + if (checkbox.checked) { + completedCount--; + } + updateCountDisplay(); + }); + }}); function updateCountDisplay() { countDisplay.textContent = `${completedCount} of ${totalCount} tasks done`; diff --git a/count-by-steps/index.html b/count-by-steps/index.html new file mode 100644 index 0000000..3488df3 --- /dev/null +++ b/count-by-steps/index.html @@ -0,0 +1,35 @@ + + + + + + Count + + + +
+

Let's count

+
+ +
+
+

Start:

+ +

End:

+ +

Steps:

+ +

+ +
+ +

Preparing Count

+
+ + + + + + \ No newline at end of file diff --git a/count-by-steps/scrip.js b/count-by-steps/scrip.js new file mode 100644 index 0000000..bffab8b --- /dev/null +++ b/count-by-steps/scrip.js @@ -0,0 +1,56 @@ +function count() { + var ini = window.document.getElementById('txtinicio') + var fim = window.document.getElementById('txtfim') + var passo = window.document.getElementById('txtpasso') + var res = document.querySelector('p#conta') + + var i = Number(ini.value) + var f = Number(fim.value) + var p = Number(passo.value) + + + if(ini.value.length == 0 || fim.value.length == 0 || passo.value.length == 0) { + window.alert('Fill in the start, end and step fields correctly') + res.innerHTML = 'Impossible to count' + } else if (p == 0 || p < 0) { + window.alert('Incorrect step, the program will assume the value 1') + res.innerHTML = `Counting:
` + p = 1 + + if (i < f) { + // Upward count with incorrect step + while (i <= f) { + res.innerHTML += `\u{1F449} ${i}` + i += p + } + res.innerHTML += `\u{1F449}` + res.innerHTML += '\u{1F3C1}' + } else { + // Countdown with incorrect step + while (i >= f) { + res.innerHTML += `\u{1F449} ${i}` + i -= p + } + res.innerHTML += `\u{1F449}` + res.innerHTML += '\u{1F3C1}' + } + + } else if (i < f) { + // Count up + res.innerHTML = `Counting:
` + while (i <= f) { + res.innerHTML += `\u{1F449} ${i}` + i += p + } + res.innerHTML += `\u{1F449} ` + res.innerHTML += '\u{1F3C1}' + } else { + // Countdown + res.innerHTML = `Counting:
` + while (i >= f) { + res.innerHTML += `\u{1F449} ${i}` + i -= p + } + } + +} \ No newline at end of file diff --git a/count-by-steps/style.css b/count-by-steps/style.css new file mode 100644 index 0000000..7d5bfec --- /dev/null +++ b/count-by-steps/style.css @@ -0,0 +1,26 @@ +body { + background-color: rgb(115, 115, 201); + font: normal 15pt arial; +} + +header { + color: white; + text-align: center; +} + +section { + background-color: white; + border-radius: 10px; + padding: 15px; + width: 500px; + margin: auto; + text-align: center; + box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.493); +} + +footer { + color: white; + text-align: center; + font-style: italic; + margin-top: 20px; +} \ No newline at end of file