diff --git a/MiniProjects/DigitalClock/ImageSource.url b/MiniProjects/DigitalClock/ImageSource.url new file mode 100644 index 0000000..7495653 --- /dev/null +++ b/MiniProjects/DigitalClock/ImageSource.url @@ -0,0 +1 @@ +https://www.pexels.com/hu-hu/ \ No newline at end of file diff --git a/MiniProjects/DigitalClock/bgimg.jpg b/MiniProjects/DigitalClock/bgimg.jpg new file mode 100644 index 0000000..b0facb7 Binary files /dev/null and b/MiniProjects/DigitalClock/bgimg.jpg differ diff --git a/MiniProjects/DigitalClock/clock.html b/MiniProjects/DigitalClock/clock.html new file mode 100644 index 0000000..a787e87 --- /dev/null +++ b/MiniProjects/DigitalClock/clock.html @@ -0,0 +1,38 @@ + + + + + + Clock + + + +
+

00:00:00

+
+ + + \ No newline at end of file diff --git a/MiniProjects/DigitalClock/clock.js b/MiniProjects/DigitalClock/clock.js new file mode 100644 index 0000000..7881be0 --- /dev/null +++ b/MiniProjects/DigitalClock/clock.js @@ -0,0 +1,12 @@ + +function updateClock(){ + const time = new Date(); + const hours = time.getHours().toString().padStart(2, "0"); + const minutes = time.getMinutes().toString().padStart(2, "0"); + const seconds = time.getSeconds().toString().padStart(2, "0"); + const time_string = `${hours}:${minutes}:${seconds}`; + document.getElementById("clock").textContent = time_string; +} + +updateClock(); +setInterval(updateClock, 1000); \ No newline at end of file diff --git a/Practice/ArrysAndThings/index.html b/Practice/ArrysAndThings/index.html new file mode 100644 index 0000000..cd01ed3 --- /dev/null +++ b/Practice/ArrysAndThings/index.html @@ -0,0 +1,12 @@ + + + + + + Tittle + + +

For every output check out the console!!!

+ + + \ No newline at end of file diff --git a/Practice/ArrysAndThings/script.js b/Practice/ArrysAndThings/script.js new file mode 100644 index 0000000..1262b07 --- /dev/null +++ b/Practice/ArrysAndThings/script.js @@ -0,0 +1,111 @@ +//DESTRUCTING + +const colors = ["red", "blue", "green", "black", "white"]; +console.log(colors); + +//swap +[colors[0], colors[2]] = [colors[2], colors[0]]; +console.log(colors); + +const [firstn, secondn, thirdn, ...restn] = colors; + +console.log(firstn); +console.log(secondn); +console.log(thirdn); +console.log(restn); + +const person1 = { + first : "Sponge", + last : "Squarepants", + age : 30, + job : "FryCook" +}; +const person2 = { + first : "Patrick", + last : "Star", + age : 35, +}; + +const {first, last, age, job = "Unemployed"} = person2; +console.log(first); +console.log(last); +console.log(age); +console.log(job); + +function DisplayPerson({first, last, age, job = "Unemployed"}){ + console.log(`${first} ${last} age: ${age} is currently ${job}`); +} + +DisplayPerson(person1); +DisplayPerson(person2); + + + +//NESTED OBJECTS + +const persona = { + fullName : "Spongebob Squarepants", + age : 30, + isStudent : true, + hobbies : ["Karate", "Danceing", "Cooking"], + address : { + street : "Some st", + city : "Bikkini bottom", + country : "In Water" + } +} + +console.log(persona.fullName); +console.log(persona.age); +console.log(persona.isStudent); +console.log(persona.hobbies[0]); +console.log(persona.hobbies[1]); +console.log(persona.hobbies[2]); +console.log(persona.address.city); + +persona.hobbies.forEach(element => { + console.log(element) +}); + +for(const item in persona.address){ + console.log(persona.address[item]) +} + +class Person{ + constructor(name, age, ...adres){ + this.name = name; + this.age = age; + this.address = new Address(...adres); + } +} +class Address{ + constructor(street, city, country){ + this.street = street; + this.city = city; + this.country = country; + } +} + +const p = new Person("Spongebob", 32, "sth st.", "Bikini bottm", "In tha ater"); +console.log(p) + + +//SORTING + +colors.sort(); +console.log(colors) + +const nums = [1,2,6,8,4,41,2,5,6,10,2,0,1,2,5,7,8,9,3,3,2,5,4,25,74,85,25,36,66,41,23,36] +console.log(nums.sort()) + +console.log(nums.sort((a, b) => a - b)) +console.log(nums.sort((a, b) => b - a)) + + const people = [{name: "Sponge", age: 25, gpa: 5.2}, + {name: "Patrick", age: 35, gpa: 3.5}, + {name: "Sandy", age: 32, gpa: 4.7}, + {name: "Sqidwards", age: 32, gpa: 14.7}]; + +console.log(people.sort((a, b) => a.age - b.age)) +console.log(people.sort((a, b) => a.gpa - b.gpa)) +console.log(people.sort().name) diff --git a/Basics/index.html b/Practice/Basics/index.html similarity index 100% rename from Basics/index.html rename to Practice/Basics/index.html diff --git a/Basics/script.js b/Practice/Basics/script.js similarity index 100% rename from Basics/script.js rename to Practice/Basics/script.js diff --git a/ConditionalConquest/index.html b/Practice/ConditionalConquest/index.html similarity index 100% rename from ConditionalConquest/index.html rename to Practice/ConditionalConquest/index.html diff --git a/ConditionalConquest/script.js b/Practice/ConditionalConquest/script.js similarity index 100% rename from ConditionalConquest/script.js rename to Practice/ConditionalConquest/script.js diff --git a/FunctionalFun/IMG/1.jpg b/Practice/FunctionalFun/IMG/1.jpg similarity index 100% rename from FunctionalFun/IMG/1.jpg rename to Practice/FunctionalFun/IMG/1.jpg diff --git a/FunctionalFun/IMG/2.jpg b/Practice/FunctionalFun/IMG/2.jpg similarity index 100% rename from FunctionalFun/IMG/2.jpg rename to Practice/FunctionalFun/IMG/2.jpg diff --git a/FunctionalFun/IMG/3.jpg b/Practice/FunctionalFun/IMG/3.jpg similarity index 100% rename from FunctionalFun/IMG/3.jpg rename to Practice/FunctionalFun/IMG/3.jpg diff --git a/FunctionalFun/IMG/4.jpg b/Practice/FunctionalFun/IMG/4.jpg similarity index 100% rename from FunctionalFun/IMG/4.jpg rename to Practice/FunctionalFun/IMG/4.jpg diff --git a/FunctionalFun/IMG/5.jpg b/Practice/FunctionalFun/IMG/5.jpg similarity index 100% rename from FunctionalFun/IMG/5.jpg rename to Practice/FunctionalFun/IMG/5.jpg diff --git a/FunctionalFun/IMG/6.jpg b/Practice/FunctionalFun/IMG/6.jpg similarity index 100% rename from FunctionalFun/IMG/6.jpg rename to Practice/FunctionalFun/IMG/6.jpg diff --git a/FunctionalFun/index.html b/Practice/FunctionalFun/index.html similarity index 100% rename from FunctionalFun/index.html rename to Practice/FunctionalFun/index.html diff --git a/FunctionalFun/script.js b/Practice/FunctionalFun/script.js similarity index 100% rename from FunctionalFun/script.js rename to Practice/FunctionalFun/script.js diff --git a/ObjectiveMadness/index.html b/Practice/ObjectiveMadness/index.html similarity index 81% rename from ObjectiveMadness/index.html rename to Practice/ObjectiveMadness/index.html index e5b3e15..b583b6b 100644 --- a/ObjectiveMadness/index.html +++ b/Practice/ObjectiveMadness/index.html @@ -6,8 +6,7 @@ Document - - +

For every output check out the console!!!

\ No newline at end of file diff --git a/ObjectiveMadness/script.js b/Practice/ObjectiveMadness/script.js similarity index 100% rename from ObjectiveMadness/script.js rename to Practice/ObjectiveMadness/script.js diff --git a/Practice/TimesDatesTimers/index.html b/Practice/TimesDatesTimers/index.html new file mode 100644 index 0000000..b583b6b --- /dev/null +++ b/Practice/TimesDatesTimers/index.html @@ -0,0 +1,12 @@ + + + + + + Document + + +

For every output check out the console!!!

+ + + \ No newline at end of file diff --git a/Practice/TimesDatesTimers/script.js b/Practice/TimesDatesTimers/script.js new file mode 100644 index 0000000..4134fda --- /dev/null +++ b/Practice/TimesDatesTimers/script.js @@ -0,0 +1,45 @@ +//DATE OBJECTS + +//Date(year, month, day, hours, minutes, seconds, milliseconds) +const today = new Date(); +console.log(today); +console.log(today.toLocaleDateString()); +console.log(today.toLocaleTimeString()); +console.log(today.toDateString()); +console.log(today.toTimeString()); +console.log(today.getTime()); + + +//CLOSURES by using closures we can reuse a function without having to create a new one. And with this we an store variables safely. + +function createCounter(){ + let count = 0; + function increment(){ + count++; + console.log(count); + } + + function getCount(){ + return count; + } + return {increment}; +} + +counter = createCounter(); +counter.increment(); +counter.increment(); +counter.increment(); + + +//SETTIMEOUT Note this function is not too precise! + +function hello(){ + console.log("HOLA"); +} + +setTimeout(hello, 3000); //It will delay the function by 3 seconds +setTimeout( function(){console.log("HOLA")}, 3000); +setTimeout(() => window.alert("HOLA"), 3000); + +console.log("HOLA"); +