JAVASCRIPT   15

calendar.js

Guest on 15th August 2021 07:11:14 AM

  1.  
  2. angular
  3.    .module('fonderieComponent')
  4.    .filter('moment', [function() {
  5.  
  6.     return function(dateString, format) {
  7.         return moment(dateString).format(format);
  8.     };
  9.  
  10. }]);
  11.  
  12.  
  13. angular
  14.    .module('fonderieComponent')
  15.    .filter('momentunix', [function() {
  16.  
  17.     return function(dateString, format) {
  18.         return moment.unix(Number(dateString)).format(format);
  19.     };
  20.  
  21.  
  22. }]);
  23.  
  24.  
  25. angular
  26.    .module('fonderieComponent')
  27.    .directive('moment', function () {
  28.  
  29.         return {
  30.             restrict: 'E',
  31.             scope : {
  32.  
  33.                 format: "@",
  34.                 date : "@"
  35.  
  36.             },
  37.  
  38.             link: function ($scope, $element, $attr) {
  39.  
  40.                 $element.append(moment($scope.date).format($scope.format));
  41.  
  42.             }
  43.  
  44.         }
  45.  
  46.     });
  47.  
  48.  
  49.  
  50. angular
  51.    .module('fonderieComponent')
  52.    .directive('calendarMenu', [ 'Calendar', function (Calendar) {
  53.  
  54.         return {
  55.             restrict: 'E',
  56.             templateUrl:"js/partials/calendar-menu.html",
  57.             scope : {
  58.  
  59.                 date : "@"
  60.  
  61.             },
  62.             link: function ($scope, $element, $attr) {
  63.  
  64.                 moment.locale('fr');
  65.  
  66.  
  67.                 if($scope.date == undefined) {
  68.                     $scope.date =  moment().unix();
  69.                 }
  70.  
  71.                 $scope.activeDate = moment.unix($scope.date);
  72.  
  73.                 $scope.startDate = moment($scope.activeDate).weekday(1);
  74.                 $scope.endDate = moment($scope.activeDate).weekday(7);
  75.  
  76.  
  77.                 $scope.years = {};
  78.                 $scope.months = {};
  79.                 $scope.days = {};
  80.  
  81.                 var init = function () {
  82.  
  83.                     $scope.years = {};
  84.                     $scope.months = {};
  85.                     $scope.days = {};
  86.  
  87.                     var yearNow = Number(moment().format('YYYY'));
  88.  
  89.                     var yearStart = yearNow - 2;
  90.                     var yearEnd = yearNow + 2;
  91.  
  92.  
  93.                     for(var y = yearStart; y<=yearEnd; y++) {
  94.  
  95.                         var year = moment([y]);
  96.                         $scope.years[year.unix()]=year;
  97.                    
  98.                     }
  99.  
  100.                     var date = moment.unix($scope.date);
  101.  
  102.  
  103.                     for(var m = 0; m < 12; m++) {
  104.  
  105.                         var month = moment([date.year(), m]);
  106.                         $scope.months[month.unix()] = month;
  107.  
  108.                     }
  109.  
  110.                     for(var d=1; d <= date.daysInMonth(); d++) {
  111.  
  112.                         var day = moment([date.year(), date.month(), d]);
  113.                         $scope.days[day.unix()] = day;
  114.  
  115.                     }
  116.  
  117.  
  118.  
  119.                 }
  120.  
  121.                 init();
  122.  
  123.                 $scope.changeYear = function (date) {
  124.  
  125.                     $scope.days = {};
  126.                     $scope.months = {};
  127.  
  128.                     for(var m = 0; m < 12; m++) {
  129.  
  130.                         var month = moment([date.year(), m]);
  131.                         $scope.months[month.unix()] = month;
  132.  
  133.                     }
  134.  
  135.                     for(var d=1; d <= date.daysInMonth(); d++) {
  136.  
  137.                         var day = moment([date.year(), date.month(), d]);
  138.                         $scope.days[day.unix()] = day;
  139.                    
  140.  
  141.                     }
  142.  
  143.  
  144.                     $scope.activeDate.year(date.year());
  145.  
  146.  
  147.                     getData();
  148.  
  149.                 }
  150.  
  151.                 $scope.changeMonth = function (date) {
  152.  
  153.                     $scope.days = {};
  154.  
  155.                     for(var d=1; d <= date.daysInMonth(); d++) {
  156.  
  157.                         var day = moment([date.year(), date.month(), d]);
  158.                         $scope.days[day.unix()] = day;
  159.  
  160.                     }
  161.  
  162.                     $scope.activeDate.month(date.month());
  163.  
  164.                     getData();
  165.  
  166.                 }
  167.  
  168.                 $scope.changeDay = function (date) {
  169.  
  170.                     var unix = date.unix();
  171.  
  172.                     $scope.activeDate=moment.unix(unix);
  173.  
  174.                     getData();
  175.  
  176.                 }
  177.  
  178.                 $scope.getNextDay = function () {
  179.  
  180.  
  181.                     $scope.activeDate.add('days', 1);
  182.  
  183.                     getData();
  184.  
  185.  
  186.                 }
  187.  
  188.                 $scope.getPreviousDay = function () {
  189.  
  190.  
  191.                     $scope.activeDate.add('days', -1);
  192.  
  193.                     getData();
  194.  
  195.                 }
  196.  
  197.  
  198.                 var getData = function () {
  199.  
  200.                    
  201.                     $scope.startDate = $scope.activeDate;
  202.                    
  203.                     $scope.endDate = moment($scope.activeDate).add('days', 7);
  204.  
  205.  
  206.                     Calendar.getRange($scope.startDate, $scope.endDate);
  207.                 }
  208.  
  209.  
  210.                 getData();
  211.  
  212.  
  213.    
  214.             }
  215.         }
  216.     }]);
  217.  
  218.  
  219. angular
  220.    .module('fonderieComponent')
  221.    .directive('calendarItem', [ 'Calendar', '$compile', function (Calendar, $compile) {
  222.  
  223.         return {
  224.             restrict: 'A',
  225.             link: function ($scope, $element, $attr) {
  226.  
  227.                 Calendar.onUpdateDate(function(items) {
  228.  
  229.                     $element.empty();
  230.                
  231.  
  232.                     var output = "";
  233.  
  234.                     if(items != undefined) {
  235.                        
  236.                         for(var i in items) {
  237.  
  238.                             output += items[i].html;
  239.  
  240.                         }
  241.  
  242.  
  243.  
  244.                     }
  245.  
  246.                     $element.html(output);
  247.  
  248.                     $compile($element.contents())($scope);
  249.  
  250.  
  251.                 });
  252.  
  253.             }
  254.         }
  255.     }]);
  256.  
  257.  
  258.  
  259. angular
  260.     .module('fonderieComponent')
  261.     .service('Calendar', [ '$http', '$q', function($http, $q) {
  262.  
  263.  
  264.         var self = this;
  265.  
  266.         self.items={};
  267.         this.activeItemId =0;
  268.  
  269.         self.activeItems = [];
  270.  
  271.         self.updateDateCallbacks = [];
  272.  
  273.  
  274.         self.setItem =  function(date, item){
  275.  
  276.             self.items[date.unix()] = { 'date': date, 'html' : item };
  277.  
  278.             return self.items[date.unix()];
  279.  
  280.         };
  281.  
  282.         self.hasItem = function (date) {
  283.  
  284.             if(self.items[date.unix()] == undefined) {
  285.                
  286.                 return false;
  287.            
  288.             } else {
  289.  
  290.                 return true;
  291.  
  292.             }
  293.         }      
  294.  
  295.         self.getItem = function (date) {
  296.  
  297.             return self.items[date.unix()];
  298.         }
  299.  
  300.         self.onUpdateDate = function (cb) {
  301.  
  302.             self.updateDateCallbacks.push(cb)
  303.         }
  304.  
  305.         self.updateDate = function (items) {
  306.  
  307.             self.activeItems = self.activeItems.sort(function(a,b) {
  308.  
  309.                 return Number(a.date.unix()) > Number(b.date.unix());
  310.             });
  311.  
  312.  
  313.             for(var i in self.updateDateCallbacks) {
  314.  
  315.                 self.updateDateCallbacks[i](self.activeItems);
  316.             }
  317.         }
  318.  
  319.         self.getRange = function (start, end) {
  320.  
  321.             var current = moment(start);
  322.  
  323.             this.activeItemId = Math.random();
  324.  
  325.             self.activeItems = [];
  326.  
  327.             self.updateDate(self.activeItems);
  328.  
  329.             while(!current.isAfter(end)) {
  330.  
  331.                 var date = moment(current);
  332.  
  333.                 self.setActiveItem(date);
  334.  
  335.                 current.add(1, 'days');
  336.  
  337.             }
  338.  
  339.  
  340.  
  341.         }
  342.  
  343.         self.setActiveItem = function (date) {
  344.  
  345.             var local_id = this.activeItemId;
  346.  
  347.             if( self.hasItem(date) ) {
  348.  
  349.                 var item = self.getItem(date);
  350.  
  351.                 self.activeItems.push(item);
  352.  
  353.                 self.updateDate(self.activeItems);
  354.  
  355.  
  356.             } else {
  357.  
  358.  
  359.                 var baseTag = document.getElementsByTagName('base');
  360.  
  361.                 var baseUrl = baseTag[0].baseURI;
  362.                 $http({
  363.                     url : baseUrl+'api/calendrier.html',
  364.                     method : 'GET',
  365.                     params : {
  366.                         date : date.unix()
  367.                     }
  368.                 }).then(function (response) {
  369.  
  370.                     if(response.data == undefined) {
  371.  
  372.                     } else {
  373.  
  374.                        
  375.                         var item = self.setItem(moment(date), response.data);
  376.  
  377.                         if(local_id == self.activeItemId) {
  378.  
  379.                             self.activeItems.push(item);
  380.                             self.updateDate(self.activeItems);
  381.                         }
  382.  
  383.  
  384.  
  385.                     }
  386.  
  387.                 })
  388.  
  389.  
  390.             }
  391.  
  392.            
  393.         }
  394.  
  395.  
  396.     }]);

Raw Paste


Login or Register to edit or fork this paste. It's free.