From 4843d99bcea4977070f3840b5648e722aff8b908 Mon Sep 17 00:00:00 2001
From: jopen <solimonra@gmail.com>
Date: Wed, 13 Aug 2025 12:58:30 +0200
Subject: [PATCH 1/2] logica cronometro terminada

---
 javascript/chronometer.js | 39 +++++++++++++++++++++++++++++++--------
 javascript/index.js       |  2 ++
 2 files changed, 33 insertions(+), 8 deletions(-)

diff --git a/javascript/chronometer.js b/javascript/chronometer.js
index 7a1349680..7a5c84887 100644
--- a/javascript/chronometer.js
+++ b/javascript/chronometer.js
@@ -1,34 +1,57 @@
 class Chronometer {
   constructor() {
-    // ... your code goes here
+    this.currentTime = 0;
+    this.intervalId = 0;
   }
 
   start(callback) {
-    // ... your code goes here
+    this.intervalId = setInterval(() => {
+      this.currentTime += 1;
+
+      if (callback) {
+        callback();
+      }
+  }, 1000);
   }
 
   getMinutes() {
-    // ... your code goes here
+    this.minutes = Math.floor(this.currentTime / 60);
+    console.log(`${this.minutes}`);
+    return `${this.minutes}`;
   }
 
   getSeconds() {
-    // ... your code goes here
+    this.seconds = Math.floor(this.currentTime % 60);
+    console.log(`${this.seconds}`)
+    return `${this.seconds}`
   }
 
   computeTwoDigitNumber(value) {
-    // ... your code goes here
+    let valueString = value + ""
+
+
+    if (valueString.length < 2) {
+    valueString = "0" + valueString;
+    }
+
+    return valueString;
   }
 
   stop() {
-    // ... your code goes here
+    clearInterval(this.intervalId)
   }
 
   reset() {
-    // ... your code goes here
+    this.currentTime = 0;
+
+    document.getElementById("minDec").innerHTML = "0";
+    document.getElementById("minUni").innerHTML = "0";
+    document.getElementById("secDec").innerHTML = "0";
+    document.getElementById("secUni").innerHTML = "0";
   }
 
   split() {
-    // ... your code goes here
+    return `${this.computeTwoDigitNumber(this.getMinutes())} : ${this.computeTwodigitNumber(this.getSeconds)}`
   }
 }
 
diff --git a/javascript/index.js b/javascript/index.js
index fb3a43ab4..2ed47452d 100644
--- a/javascript/index.js
+++ b/javascript/index.js
@@ -4,6 +4,8 @@ const chronometer = new Chronometer();
 const btnLeftElement = document.getElementById('btnLeft');
 const btnRightElement = document.getElementById('btnRight');
 
+
+
 // get the DOM elements that will serve us to display the time:
 const minDecElement = document.getElementById('minDec');
 const minUniElement = document.getElementById('minUni');

From 31849ece1f06397b1e7066e4fb87a696800047c4 Mon Sep 17 00:00:00 2001
From: jopen <solimonra@gmail.com>
Date: Fri, 22 Aug 2025 17:04:16 +0200
Subject: [PATCH 2/2] ejercicio chronometro logica y manipulacion DOM

---
 javascript/chronometer.js | 43 ++++++++++++++---------
 javascript/index.js       | 72 ++++++++++++++++++++++++++++++++++-----
 2 files changed, 89 insertions(+), 26 deletions(-)

diff --git a/javascript/chronometer.js b/javascript/chronometer.js
index 7a5c84887..f711f9075 100644
--- a/javascript/chronometer.js
+++ b/javascript/chronometer.js
@@ -1,44 +1,48 @@
 class Chronometer {
   constructor() {
     this.currentTime = 0;
-    this.intervalId = 0;
+    this.milliSeconds = 0; //centesimas
+    this.intervalId = null;
   }
 
   start(callback) {
     this.intervalId = setInterval(() => {
+      this.milliSeconds += 1; // cada 10 ms se suma 1 centesima
+
+      if (this.milliSeconds === 100) {
       this.currentTime += 1;
+      this.milliSeconds = 0;
+      }
 
       if (callback) {
         callback();
       }
-  }, 1000);
+  }, 10);
   }
 
+  // mejor hacerlo sin this. no guardas nada extra en el objeto.
   getMinutes() {
-    this.minutes = Math.floor(this.currentTime / 60);
-    console.log(`${this.minutes}`);
-    return `${this.minutes}`;
+    return Math.floor(this.currentTime / 60);
+    
   }
 
   getSeconds() {
-    this.seconds = Math.floor(this.currentTime % 60);
-    console.log(`${this.seconds}`)
-    return `${this.seconds}`
+    return this.currentTime % 60;
+    
   }
 
-  computeTwoDigitNumber(value) {
-    let valueString = value + ""
-
+  getMilliseconds() {
+    return this.milliSeconds;
+  }
 
-    if (valueString.length < 2) {
-    valueString = "0" + valueString;
-    }
+  computeTwoDigitNumber(value) {
+    let valueString = "0" + value 
 
-    return valueString;
+    return valueString.slice(-2);
   }
 
   stop() {
-    clearInterval(this.intervalId)
+    clearInterval(this.intervalId);
   }
 
   reset() {
@@ -48,10 +52,15 @@ class Chronometer {
     document.getElementById("minUni").innerHTML = "0";
     document.getElementById("secDec").innerHTML = "0";
     document.getElementById("secUni").innerHTML = "0";
+    milDecElement.innerHTML = "0";
+    milUniElement.innerHTML = "0";
   }
 
   split() {
-    return `${this.computeTwoDigitNumber(this.getMinutes())} : ${this.computeTwodigitNumber(this.getSeconds)}`
+    const mm = this.computeTwoDigitNumber(this.getMinutes())
+    const ss = this.computeTwoDigitNumber(this.getSeconds())
+    const cc = this.computeTwoDigitNumber(this.getMilliseconds())
+    return `${mm}:${ss}:${cc}`
   }
 }
 
diff --git a/javascript/index.js b/javascript/index.js
index 2ed47452d..59c18d0ea 100644
--- a/javascript/index.js
+++ b/javascript/index.js
@@ -6,6 +6,7 @@ const btnRightElement = document.getElementById('btnRight');
 
 
 
+
 // get the DOM elements that will serve us to display the time:
 const minDecElement = document.getElementById('minDec');
 const minUniElement = document.getElementById('minUni');
@@ -15,21 +16,33 @@ const milDecElement = document.getElementById('milDec');
 const milUniElement = document.getElementById('milUni');
 const splitsElement = document.getElementById('splits');
 
+
+
 function printTime() {
-  // ... your code goes here
+  printMinutes();
+  printSeconds();
+  printMilliseconds();
 }
 
 function printMinutes() {
-  // ... your code goes here
+  const minutes = chronometer.computeTwoDigitNumber(chronometer.getMinutes());
+  minDecElement.innerHTML = minutes.slice(0, 1);
+  minUniElement.innerHTML = minutes.slice(1);
 }
 
 function printSeconds() {
-  // ... your code goes here
+  const seconds = chronometer.computeTwoDigitNumber(chronometer.getSeconds())
+  secDecElement.innerHTML = seconds[0]
+  secUniElement.innerHTML = seconds[1]
+  
 }
 
 // ==> BONUS
 function printMilliseconds() {
-  // ... your code goes here
+  const milliSeconds = chronometer.computeTwoDigitNumber(chronometer.getMilliseconds())
+  milDecElement.innerHTML = milliSeconds.slice(0, 1)
+  milUniElement.innerHTML = milliSeconds.slice(1)
+
 }
 
 function printSplit() {
@@ -49,19 +62,60 @@ function setSplitBtn() {
 }
 
 function setStartBtn() {
-  // ... your code goes here
+  
 }
 
 function setResetBtn() {
   // ... your code goes here
 }
 
+
+//HAY QUE HACER UN toogle (alternar estados)
 // Start/Stop Button
 btnLeftElement.addEventListener('click', () => {
-  // ... your code goes here
-});
+  if (btnLeftElement.innerText === 'START') {
+    btnLeftElement.innerText = 'STOP';
+    btnRightElement.innerText = 'SPLIT';
+    btnLeftElement.className = "btn stop";
+    btnRightElement.className = 'btn split';
+    chronometer.start(printTime);
+
+  } else if (btnLeftElement.innerText === 'STOP') {
+    btnLeftElement.innerText = 'START';
+    btnRightElement.innerText = 'RESET';
+    btnLeftElement.className = "btn start";
+    btnRightElement.className = "btn reset";
+    chronometer.stop()
+  }
+
+
+  }
+);
 
 // Reset/Split Button
 btnRightElement.addEventListener('click', () => {
-  // ... your code goes here
-});
+  if (btnRightElement.innerText === "SPLIT") {
+    const tablaSplits = document.getElementById('splits'); //es mejor meterlos fuera de la funcion?
+    const newSplit = document.createElement('li');
+    tablaSplits.appendChild(newSplit);
+    newSplit.innerText = chronometer.split() 
+  }
+
+  else if (btnRightElement.innerText === "RESET") {
+    chronometer.reset()
+    const ilSplits = document.querySelectorAll("#splits li")
+    const ilSplitsArr = [...ilSplits]
+    for (let split of ilSplitsArr) {
+      split.remove();
+    };
+  }
+})
+    
+
+
+
+  
+
+
+
+