Ejercicio 7.4 Reloj animado

//Se ejecutará cuando el documento esté cargado
$(function() {
  //Establecemos una rellamada a la función cada milisegundo
  window.setInterval(function() {
    alter_svg()
  }, 1);
  //Lamamos a la función
  alter_svg();

})
//Funciones de cálculo de coordenadas de nuestras líneas del reloj
function x2(n, i, x1, r) {
  return x1 + r * Math.sin(2 * Math.PI * n / i);
};

function y2(n, i, y1, r) {
  return y1 - r * Math.cos(2 * Math.PI * n / i);
};

//Función que saca una fecha y modifica nuestro reloj SVG
function alter_svg() {
  //Nueva fecha
  var now_date = new Date();
  var day, month, hours, minutes, seconds, millis;
  //Recogemos los datos de la fecha que nos interesan
  day = now_date.getDate();
  month = now_date.getUTCMonth();
  year = now_date.getFullYear();
  hours = now_date.getHours();
  minutes = now_date.getMinutes();
  seconds = now_date.getSeconds();
  millis = now_date.getMilliseconds();
  //Añadimos un 0 en caso de números de un dígito
  day = (day < 10) ? '0' + day : '' + day;
  month = (month < 10) ? '0' + (month + 1) : '' + (month + 1);
  hours = (hours < 10) ? '0' + hours : '' + hours;
  minutes = (minutes < 10) ? '0' + minutes : '' + minutes;
  seconds = (seconds < 10) ? '0' + seconds : '' + seconds;
  //Modificamos el SVG con los datos de la nueva fecha
  $("#date_svg").text(day + "/" + month + "/" + year);
  $("#time_svg").text(hours + ":" + minutes + ":" + seconds);
  $("#external_time").html(hours + ":" + minutes + ":" + seconds);
  $("#millis_svg").attr(
    "x2", x2(millis, 1000, 50, 5)
  ).attr("y2", y2(millis, 1000, 65, 5));
  /* Esta función se ejecuta cada milisegundo, por lo que nuestra
  línea de segundos se moverá constantemente, pero queremos hacer un
  efecto de arrastre y pausa, algo más similar a lo que se ve en los
  relojes tradicionales, por lo que solo actualizaremos la línea de 
  los segundos cuando los milisegundos sean menores a 500 */
  if (millis < 500) {
    $("#seconds_svg").attr(
      "x2", x2(+seconds + (millis / 1000), 60, 50, 32)
    ).attr("y2", y2(+seconds + (millis / 1000), 60, 50, 32));
  }
  $("#minutes_svg").attr(
    "x2", x2(+minutes + (seconds / 60), 60, 50, 28)
  ).attr("y2", y2(+minutes + (seconds / 60), 60, 50, 28));
  $("#hours_svg").attr(
    "x2", x2(+hours + (minutes / 60), 12, 50, 21)
  ).attr("y2", y2(+hours + (minutes / 60), 12, 50, 21));
}