Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Licznik czasu
Forum PHP.pl > Forum > Przedszkole
atom90
4.07.2014, 11:11:30
Potrzebuje wykonać licznik, ktory bedzie miał za zadanie mierzenie aktywności uzytkowników (ruch myszy, przyciskanie klawiszy itp) ta aktywnośc ma zliczac przez nastepne 3 sec od wykonanej akcji.

Wygladać to powinno chyba mniej wiecej tak, ale niestety nie działa mi skrypt :/

Kod
function setStopTime
{
var stopTime = (new Date()).getTime() + 3000;
}

function setValue(value) {
                
                millis = value % 1000;
                value = Math.floor( value / 1000);
                sec = value % 60;
               value = Math.floor( value / 60 );

             if(value<10) {
               value="0" + value;
              }

               if(sec<10) {
               sec="0"+sec;
               }

                if(millis<100) {
               millis="00"+millis;
               }
              
               document.getElementById('zegar').innerHTML = value + ":" + sec +"." + millis;
}

function go2() {
            var millis = 0;
            var sec = 0;
            var temp = 0;
            var totalTime =0;
            
            var currentTime = (new Date()).getTime();
            var startTime = currentTime;
            
            var counter = setInterval(function() {
                if(currentTime>=stopTime) {
                    clearInterval(counter);
                    totalTime += stopTime - startTime;
                    setValue(totalTime);
                    return;
                }
                 temp = currentTime - startTime;
                 setValue(temp);
                currentTime = (new Date()).getTime();
                
            }, 1);
}
    
document.addEventListener('keydown', function() {setStopTime();go2();});

timon27
4.07.2014, 14:33:23
"var" oznacza deklarację zmiennej.
Jeśli deklarujesz zmienną w obszarze funkcji to tylko tam ma ona zasięg.
Dokładniej zmienna stopTime istnieje tylko wewnątrz funkcji setStopTime.
Musisz ją zadeklarować przed funkcją a w funkcji tylko nadać jeje wartość.
atom90
7.07.2014, 12:29:10
Dzieki. Kolejna rzecz jaka chce zrobic jest zrobienie tego jako obiekt, po to by uzyc 4 zegarow ich uruchamianie bedzie tak samo dzialac, ale warunkiem ma byc aktywny div w ktorym sie znajduje zegar.
Strona jest podzielona na 4 rowne kontenery, a w nich umieszczone zegary, gdy klikne na dany div robi mu sie ramka i jak porusze myszka czy klikne klawisz to sie uruchamia licznik w tym tylko divie.

poki co mam taki kod, ktory działa, eventy zrobiłem na 2 rozne zdarzenia i uruchamiaja inne zegary, by sprawdzic czy dzialaja osobno
Plik Js
Kod
function obiekt(id_z)


{
      var millis = 0;
            var sec = 0;
var stopTime=0;
var totalTime =0;
var temp = 0;
var startTime=0;
var work = false;

this.go2= function()
{
if (work == true ) return;
      
            work = true;
            document.getElementById(id_z).style.color="red";
            var currentTime = (new Date()).getTime();
            startTime = currentTime;
            
            var counter = setInterval(function() {
          if(currentTime >= stopTime)
          {
          document.getElementById(id_z).style.color="black";
                clearInterval(counter);
                totalTime+= stopTime - startTime;
                work = false;
                setValue(totalTime);
               return;
          }
                 temp = currentTime - startTime;
                 setValue(temp+totalTime);
                currentTime = (new Date()).getTime();
                
            }, 1);
}
function setValue(value)
{
                millis = value % 1000;
                value = Math.floor( value / 1000);
                sec = value % 60;
               value = Math.floor( value / 60 );

             if(value<10) {
               value="0" + value;
              }

               if(sec<10) {
               sec="0"+sec;
               }

                if(millis<100) {
               millis="0"+millis;
               }
              
               document.getElementById(id_z).innerHTML = value + ":" + sec +":" + millis;
  
}

this.setStopTime= function()
{
    stopTime = (new Date()).getTime() + 3000;
}

}

             var obiekt1=new obiekt("zegar1");
             var obiekt2=new obiekt("zegar2");
             var obiekt3=new obiekt("zegar3");
             var obiekt4=new obiekt("zegar4");



          
    document.addEventListener("keydown",  function() {obiekt2.setStopTime();obiekt2.go2();});
    document.addEventListener("mousemove",  function() {obiekt1.setStopTime();obiekt1.go2();});

Plik html
Kod
<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="style.css" />
     <script src="skrypt2.js"></script>
<title>Projekty</title>
</head>

<body onload="start()" >






<div id="one">
    <div  class ="zegar" id="zegar1">00:00:000</div>
</div>

<div id="two">
    <div class ="zegar" id="zegar2">00:00:000</div>
</div>
<div id="three">
    <div class ="zegar" id="zegar3">00:00:000</div>
</div>
<div id="four">
    <div class ="zegar" id="zegar4">00:00:000</div>
</div>

</body>

</html>


Jakies propozycje jak to zrobic?
tzm
7.07.2014, 12:50:51
Może to przerzućmy do jednego wątku?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.