<!DOCTYPE html>
<html>

<head>
  <script data-require="angular.js@1.6.6" data-semver="1.6.6" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="filtros.js"></script>
  <script src="script.js"></script>
</head>

<body ng-app="tuApp">
  <div ng-controller="Controlador">
    <strong>Fecha corta:</strong> {{fecha | fechaCorta}}<br>
    <strong>Fecha expresiva:</strong> {{fecha | fechaExpresiva}}<br>
  </div>
</body>

</html>
angular.module("tuApp", [])
  .controller("Controlador", ["$scope", function($scope) {
    $scope.fecha = new Date();
  }])
  .filter("fechaExpresiva", function() {
    return function(fecha) {
      if (!fecha) return "";
      fecha = new Date(fecha);
      return ["domingo", "lunes", "martes", "miércoles", "jueves", "viernes", "sábado"][fecha.getDay()] + ", " + fecha.getDate().toString() + " de " + ["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"][fecha.getMonth()] + " de " + fecha.getFullYear().toString() + " " + (fecha.getHours() > 9 ? fecha.getHours() : "0" + fecha.getHours()).toString() + ":" + (fecha.getMinutes() > 9 ? fecha.getMinutes() : "0" + fecha.getMinutes()).toString();
    };
  })
  .filter("fechaCorta", function() {
    return function(fecha) {
      if (!fecha) return "";
      fecha = new Date(fecha);
      return (fecha.getDate() > 9 ? fecha.getDate() : "0" + fecha.getDate()) + "/" + (["ene", "feb", "mar", "abr", "may", "jun", "jul", "ago", "sep", "oct", "nov", "dic"][fecha.getMonth()]) + "/" + fecha.getFullYear()
    };
  });
/* Styles go here */