Online Documentation Server
 ПОИСК
ods.com.ua Web
 КАТЕГОРИИ
Home
Programming
Net technology
Unixes
Security
RFC, HOWTO
Web technology
Data bases
Other docs

 


 ПОДПИСКА

 О КОПИРАЙТАХ
Вся предоставленная на этом сервере информация собрана нами из разных источников. Если Вам кажется, что публикация каких-то документов нарушает чьи-либо авторские права, сообщите нам об этом.




Previous Table of Contents Next

When the page is loaded, the script displays the clock. Since JavaScript does not support image creation, all images are constructed via HTML:

// print initial clock
var openImage = "<IMG SRC=\"" + getPath(location.href) + "dg"
var closeImage = ".gif\" HEIGHT=21 WIDTH=16>"
document.write(openImage + hour1 + closeImage)
document.write(openImage + hour2 + closeImage)
document.write(openImage + "c.gif\" HEIGHT=21 WIDTH=9>")
document.write(openImage + minute1 + closeImage)
document.write(openImage + minute2 + closeImage)
document.write(openImage + ((ampm == 10) ? "am" : "pm") + closeImage)

The timerID variable, which holds the elapsed time before the next clock updating, is initialized to null before the clock starts running. For the same reason, the timerRunning variable is set to false. The function update() starts the infinite loop of running the clock:

var timerID = null
var timerRunning = false
update()

setClock()

function setClock() {
  if (getHour(0) != hour1) { // not getHours()!
 hour1 = getHour(0)
 document.images[start].src = digit[hour1].src
  }
  if (getHour(1) != hour2) { // not getHours()!
 hour2 = getHour(1)
 document.images[start + 1].src = digit[hour2].src
  }
  colon = !colon
  if (!colon)
 document.images[start + 2].src = digit[13].src
  else
 document.images[start + 2].src = digit[12].src
  if (getMinute(0) != minute1) { // not getMinutes()!
 minute1 = getMinute(0)
 document.images[start + 3].src = digit[minute1].src
  }
  if (getMinute(1) != minute2) { // not getMinutes()!
 minute2 = getMinute(1)
 document.images[start + 4].src = digit[minute2].src
  }
  if (getAmpm() != ampm) {
 ampm = getAmpm()
 document.images[start + 5].src = digit[ampm].src
  }
  timerID = setTimeout("setClock()",1000)
  timerRunning = true
}

This function retrieves the current value of each digit (and symbol) in the clock and updates only the necessary images, i.e., only those digits that have been changed since the previous iteration. The blinking colon effect is accomplished by simply reversing the value of colon. Notice that the index of the images array is an offset from the last image of the document, not counting the clock’s images. The variable timerID is now modified to recursively execute the function setClock(), after 1000 milliseconds.

update()

function update() {
  stopClock()
  setClock()
}

The function update() stops the clock and then restarts it.

stopClock()

function stopClock() {
  if (timerRunning)
  clearTimeout(timerID)
  timerRunning = false
}

This function clears the time out and sets the timerRunning variable to false, indicating that the timer is not running because no time out is set.

getHour(place)

function getHour(place) {
  var now = new Date()
  var hour = now.getHours()
  if (hour >= 12)
 hour –= 12
  hour = (hour == 0) ? 12 : hour
  if (hour < 10)
 hour = "0" + hour // do not parse number!
  hour += ""
  return parseInt(hour.charAt(place))
}

The getHour() function has been mentioned a lot before. It finds the digit in place position of a two-digit hour representation. Notice the computation to convert a 24-hour military time notation to AM/PM 12-hour notation. Pay attention, also, to the concatenation of a null string to force the conversion to a string, needed for the charAt() method. The returned value is converted back to integer format.

getMinute(place)

function getMinute(place) {
  var now = new Date()
  var minute = now.getMinutes()
  if (minute < 10)
 minute = "0" + minute // do not parse number!
  minute += ""
  return parseInt(minute.charAt(place))
}

This function is similar to the getHour() function. See the listings for that function.

getAmpm()

function getAmpm() {
  var now = new Date()
  var hour = now.getHours()
  if (hour >= 12)
 return 11 // pm
  /* else */
 return 10 // am
}

The getAmpm() function returns 11 if the current time is PM, and 10 if it is AM. Notice that, since a return statement immediately terminates a function, the else keyword is not needed here and is commented out.

getPath(url)

function getPath(url) {
  lastSlash = url.lastIndexOf("/")
  return url.substring(0, lastSlash + 1)
}

The script’s last function, getPath(), extracts the full URL of the document’s directory (or folder). It simply finds the last slash in the URL and returns the substring, starting at the beginning of the URL and ending at its last slash.

Previous Table of Contents Next


With any suggestions or questions please feel free to contact us