Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   исправить и оптимизировать скрипт (https://javascript.ru/forum/misc/83179-ispravit-i-optimizirovat-skript.html)

Блондинка 07.10.2021 21:56

исправить и оптимизировать скрипт
 
есть такой скрипт
<!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <style>
    body { margin: 0; padding: 0; }
    #holiday {
        display: none;
        background: hsl(0,0%,90%);
        color: hsl(340,100%,50%);
        font: bold 24px/20px serif;
        text-align: center;
        padding: 15px 20px;
        border: 1px solid hsl(0,0%,50%);
        border-radius: 12px/9px;
    }
    </style>
    </head>
    <body>
        <div id="header">
        <div id="logo"></div>
        <div id="block_time-data"></div>
        </div>
        <div id="holiday">
        </div>
    <script type="text/javascript">
    var holidays = [
        
        { // January Январь
            '1': {'start': 0, 'duration': 24, 'compliments': 'С новым годом !'},
            '7': {'start': 0, 'duration': 24, 'compliments': 'С рождеством !'} },
        
        { // February Февраль
            '23': {'start': 0, 'duration': 24, 'compliments': 'С 23 февраля !'} },
        
        { // March Март
            '8': {'start': 0, 'duration': 12, 'compliments': 'С 8 марта !'} },
        
        { // April Апрель
            '12': {'start': 0, 'duration': 12, 'compliments': 'С днём космонавтики !'} },
        
        { // May Май
            '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 мая !'},
            '2': {'start': 0, 'duration': 24, 'compliments': 'Петя, с ДНЮХОЙ !'},
            '9': {'start': 0, 'duration': 24, 'compliments': 'С 9 мая !'} },
        
        { // June Июнь
            '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 июня, Всемирным днём родителей !'} },
        
        { // July Июль
        
            '3': {'start': 0, 'duration': 24, 'compliments': '3 июля, день независимости Республики Беларусь !'} },
        
        { // August Август
        
            '12': {'start': 0, 'duration': 24, 'compliments': '12 августа международный день молодёжи !'} },
        
        { // September Сентябрь
            '1': {'start': 0, 'duration': 24, 'compliments': '1 сентября, день знаний !'} },
        
        { // October Октябрь
            '1': {'start': 0, 'duration': 24, 'compliments': '1 октября, международный день пожилых людей !'} },
        
        { // November Ноябрь
            '7': {'start': 0, 'duration': 24, 'compliments': '7 ноября, день октябрьской революции !'} },
            
        { // December Декабрь
            '25': {'start': 0, 'duration': 24, 'compliments': 'С католическим рождеством !'} }
            
    ];
    function catholicDate(year)
    {
    var a = year % 19;
    var b = year % 4;
    var c = year % 7;
    var k = Math.floor(year / 100);
    var p = Math.floor((13 + 8 * k) / 25);
    var q = Math.floor(k / 4);
    var m = (15 - p + k - q) % 30;
    var n = (4 + k - q) % 7;
    var d = (19 * a + m) % 30;
    var e = (2 * b + 4 * c + 6 * d + n) % 7;
    if (d === 29 && e === 6)
    return new Date(year, 3, 19);
    if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19))
    return new Date(year, 3, 18);
    if (d + e > 9)
    return new Date(year, 3, d + e - 9);
    else
    return new Date(year, 2, 22 + d + e);
    }
    
    function orthodoxDate(year)
    {
    var a = year % 19;
    var b = year % 4;
    var c = year % 7;
    var d = (19 * a + 15) % 30;
    var e = (2 * b + 4 * c + 6 * d + 6) % 7;
    var f = d + e;
    return f <= 26
    ? new Date(year, 3, 4 + f)
    : new Date(year, 4, f - 26);
    }
    
    function getActualCompliments()
    {
    var now = new Date("2 May 2021"); // кат.пасха "4 April 2021 00:00:00:000", прав.пасха "2 May 2021 00:00:00:000", радуница "11 May 2021 00:00:00:000", троица "20 June 2021 00:00:00:000"
    var result = holidays.filter(v =>
    {
    var currentDate = new Date(now.getFullYear(), v.month - 1, v.day, v.hour);
    var durms = v.duration * 3600000;
    console.log(now, currentDate, (now - currentDate) / 3600000);
    var rg = now - currentDate;
    return rg <= durms && rg >= 0;
    }).map(v => v.compliments);
    var caholic = catholicDate(now.getFullYear());
    var ortodox = orthodoxDate(now.getFullYear());
    if (caholic.getMonth() == now.getMonth() && caholic.getDate() == now.getDate())
    result.push("С католической пасхой!");
    if (ortodox.getMonth() == now.getMonth() && ortodox.getDate() == now.getDate())
    result.push("С православной пасхой!");
    
    var radunitsa = new Date(ortodox);
    radunitsa.setDate(radunitsa.getDate() + 9);
    if (radunitsa.getMonth() == now.getMonth() && radunitsa.getDate() == now.getDate())
    result.push("С радуницей !");
    
    var trinity = new Date(ortodox);
    trinity.setDate(trinity.getDate() + 49);
    if (trinity.getMonth() == now.getMonth() && trinity.getDate() == now.getDate())
    result.push("С троицей!");
    return result;
    }
    
    var actualCompliments = getActualCompliments();
    console.log(actualCompliments);
    if (actualCompliments.length > 0)
    {
    var hollyday = document.getElementById("holiday");
    hollyday.style.display = "block";
    for (var c of actualCompliments)
    {
    var div = document.createElement("div");
    hollyday.appendChild(div);
    div.innerHTML = c;
    }
    }
    function foo(month, day, compliment, hour = 0)
    {
    return { month: month, day: day, hour: hour, compliment: compliment }
    }
    
    var now9 = new Date();
    now9.setDate(now9.getDate() + 9);
    console.log(now9);
    
    var now49 = new Date();
    now49.setDate(now49.getDate() + 49);
    console.log(now49);
    
        d = new Date( "2 May 2021"); // d = new Date( "9 May 2021 00:00:00:001" )
    
    if((m = holidays[d.getMonth()]) && m[d.getDate()]) {
                m = m[d.getDate()];
        if(d.getHours()>=m.start) {
        var b = document.getElementById("holiday");
        if (!b) {
        b = document.createElement("div");
        b.id = "holiday";
        document.querySelector("body").appendChild(b);
        }
        b.innerHTML = m.compliments;
        b.style.display = "block";
        }  
    }
    </script>
    <div id="footer"></div>
    </body>
    </html>


1.) почему не отображается поздравление с пасхой, если в 108 строке указана дата 2.05.2021 ?

2.) как сделать чтобы массив с месяцами шёл не по порядку? (например в октябре нет праздников, и октябрь надо удалить из массива, или другими словами присвоить месяцам порядковый номер 1-12...)

Блондинка 10.10.2021 20:48

почему не отображается поздравление с пасхой, если в 108 строке указана дата 2.05.2021 ?

voraa 11.10.2021 08:19

Разберитесь в строках 167-175.
Что то вы не туда добавляете и затираете предыдущее поздравление (с пасхой)

Если заменить эти строки на
var h = document.getElementById("holiday");
 //       if (!b) {
        b = document.createElement("div");
//        b.id = "holiday";
        b.innerHTML = m.compliments;
        b.style.display = "block";
        h.appendChild(b);
 //       }

То появляются оба поздравления.

Блондинка 11.10.2021 14:46

<!DOCTYPE HTML>
   <html>
   <head>
   <meta charset="utf-8">
   <style>
   body { margin: 0; padding: 0; }
   #holiday {
   display: none;
   background: hsl(0,0%,90%);
   border: 1px solid hsl(0,0%,50%);
   border-radius: 12px/9px;
   }
   .public_holiday {
   color: hsl(340,100%,50%);
   }
   .holiday {
   color: hsl(210,100%,50%);
   }
   .birthday {
   color: hsl(120,100%,25%);
   }
   #holiday, .public_holiday, .holiday, .birthday {
   display: block;
   font: bold 24px/20px serif;
   text-align: center;
   padding: 15px 20px;
   }
   </style>
   </head>
   <body>
       <div id="header">
       <div id="logo"></div>
       <div id="block_time-data"></div>
       </div>
       <div id="holiday">
       </div>
   <script>
   var holidays = [
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С новым годом !'},
           '7': {'start': 0, 'duration': 24, 'compliments': 'С рождеством !'} },
       {
           '23': {'start': 0, 'duration': 24, 'compliments': 'С 23 февраля !'} },
       {
           '8': {'start': 0, 'duration': 24, 'compliments': 'С 8 марта !'} },
       {
           '12': {'start': 0, 'duration': 24, 'compliments': 'С днём космонавтики !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 мая !'},
           '2': {'start': 0, 'duration': 24, 'compliments': '<span class="birthday">С ДНЮХОЙ !</span>'},
           '2': {'start': 0, 'duration': 24, 'compliments': '<span class="holiday">С 2 мая !</span>'},
           '9': {'start': 0, 'duration': 24, 'compliments': 'С 9 мая !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 июня, Всемирным днём родителей !'} },
       {
           '3': {'start': 0, 'duration': 24, 'compliments': '3 июля, день независимости Республики Беларусь !'} },
       {
           '12': {'start': 0, 'duration': 24, 'compliments': '12 августа международный день молодёжи !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': '1 сентября, день знаний !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': '1 октября, международный день пожилых людей !'} },
       {
           '7': {'start': 0, 'duration': 24, 'compliments': '7 ноября, день октябрьской революции !'} },
       {
           '25': {'start': 0, 'duration': 24, 'compliments': 'С католическим рождеством !'} }
   ];
   function catholicDate(year)
   {
   var a = year % 19;
   var b = year % 4;
   var c = year % 7;
   var k = Math.floor(year / 100);
   var p = Math.floor((13 + 8 * k) / 25);
   var q = Math.floor(k / 4);
   var m = (15 - p + k - q) % 30;
   var n = (4 + k - q) % 7;
   var d = (19 * a + m) % 30;
   var e = (2 * b + 4 * c + 6 * d + n) % 7;
   if (d === 29 && e === 6)
   return new Date(year, 3, 19);
   if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19))
   return new Date(year, 3, 18);
   if (d + e > 9)
   return new Date(year, 3, d + e - 9);
   else
   return new Date(year, 2, 22 + d + e);
   }
   
   function orthodoxDate(year)
   {
   var a = year % 19;
   var b = year % 4;
   var c = year % 7;
   var d = (19 * a + 15) % 30;
   var e = (2 * b + 4 * c + 6 * d + 6) % 7;
   var f = d + e;
   return f <= 26
   ? new Date(year, 3, 4 + f)
   : new Date(year, 4, f - 26);
   }
   
   function getActualCompliments()
   {
   var now = new Date( "2 May 2021 00:00:00:001" ); // кат.пасха "4 April 2021 00:00:00:000", прав.пасха "2 May 2021 00:00:00:000", радуница "11 May 2021 00:00:00:000", троица "20 June 2021 00:00:00:000"
   var result = holidays.filter(v =>
   {
   var currentDate = new Date(now.getFullYear(), v.month - 1, v.day, v.hour);
   var durms = v.duration * 3600000;
   console.log(now, currentDate, (now - currentDate) / 3600000);
   var rg = now - currentDate;
   return rg <= durms && rg >= 0;
   }).map(v => v.compliments);
   var caholic = catholicDate(now.getFullYear());
   var ortodox = orthodoxDate(now.getFullYear());
   if (caholic.getMonth() == now.getMonth() && caholic.getDate() == now.getDate())
   result.push("С католической пасхой!");
   if (ortodox.getMonth() == now.getMonth() && ortodox.getDate() == now.getDate())
   result.push("С православной пасхой!");
   
   var radunitsa = new Date(ortodox);
   radunitsa.setDate(radunitsa.getDate() + 9);
   if (radunitsa.getMonth() == now.getMonth() && radunitsa.getDate() == now.getDate())
   result.push("С радуницей !");
   
   var trinity = new Date(ortodox);
   trinity.setDate(trinity.getDate() + 49);
   if (trinity.getMonth() == now.getMonth() && trinity.getDate() == now.getDate())
   result.push("С троицей!");
   return result;
   }
   
   var actualCompliments = getActualCompliments();
   console.log(actualCompliments);
   if (actualCompliments.length > 0)
   {
   var hollyday = document.getElementById("holiday");
   hollyday.style.display = "block";
   for (var c of actualCompliments)
   {
   var div = document.createElement("div");
   hollyday.appendChild(div);
   div.innerHTML = c;
   }
   }
   function foo(month, day, compliment, hour = 0)
   {
   return { month: month, day: day, hour: hour, compliment: compliment }
   }
   
   var now9 = new Date();
   now9.setDate(now9.getDate() + 9);
   console.log(now9);
   
   var now49 = new Date();
   now49.setDate(now49.getDate() + 49);
   console.log(now49);
   
       d = new Date( "2 May 2021 00:00:00:001" ); // d = new Date( "9 May 2021 00:00:00:001" )
   
   if((m = holidays[d.getMonth()]) && m[d.getDate()]) {
               m = m[d.getDate()];
       if(d.getHours()>=m.start) {
       
       var h = document.getElementById("holiday");
        //       if (!b) {
       b = document.createElement("div");
       b.id = "holiday";
       b.innerHTML = m.compliments;
       b.style.display = "block";
       h.appendChild(b);
       }
       
   }
   </script>
   <div id="footer"></div>
   </body>
   </html>


Так есть два поздравления, а третье (строка 50) где-то потерялось...

и как сделать чтобы все три поздравления были в отдельных спанах, внутри дива, с соответствующими классами? другими словами присвоить поздравлению с пасхой, класс госпраздника (public_holiday) ?

voraa 11.10.2021 16:19

Я не совсем понимаю, что и как там должно работать?
Что такое
var currentDate = new Date(now.getFullYear(), v.month - 1, v.day, v.hour);

В v нет таких полей.

Блондинка 18.10.2021 00:08

<!DOCTYPE HTML>
   <html>
   <head>
   <meta charset="utf-8">
   <style>
   body { margin: 0; padding: 0; }
   #holiday {
   display: none;
   background: hsl(0,0%,90%);
   border: 1px solid hsl(0,0%,50%);
   border-radius: 12px/9px;
   }
   .public_holiday {
   color: hsl(340,100%,50%);
   }
   .holiday {
   color: hsl(210,100%,50%);
   }
   .birthday {
   color: hsl(120,100%,25%);
   }
   #holiday, .public_holiday, .holiday, .birthday {
   display: block;
   font: bold 24px/20px serif;
   text-align: center;
   padding: 15px 20px;
   }
   </style>
   </head>
   <body>
       <div id="header">
       <div id="logo"></div>
       <div id="block_time-data"></div>
       </div>
       <div id="holiday">
       </div>
   <script>
   var holidays = [
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С новым годом !'},
           '7': {'start': 0, 'duration': 24, 'compliments': 'С рождеством !'} },
       {
           '23': {'start': 0, 'duration': 24, 'compliments': 'С 23 февраля !'} },
       {
           '8': {'start': 0, 'duration': 24, 'compliments': 'С 8 марта !'} },
       {
           '12': {'start': 0, 'duration': 24, 'compliments': 'С днём космонавтики !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 мая !'},
           '2': {'start': 0, 'duration': 24, 'compliments': '<span class="birthday">С ДНЮХОЙ !</span>'},
           '2': {'start': 0, 'duration': 24, 'compliments': '<span class="holiday">С 2 мая !</span>'},
           '9': {'start': 0, 'duration': 24, 'compliments': 'С 9 мая !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': 'С 1 июня, Всемирным днём родителей !'} },
       {
           '3': {'start': 0, 'duration': 24, 'compliments': '3 июля, день независимости Республики Беларусь !'} },
       {
           '12': {'start': 0, 'duration': 24, 'compliments': '12 августа международный день молодёжи !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': '1 сентября, день знаний !'} },
       {
           '1': {'start': 0, 'duration': 24, 'compliments': '1 октября, международный день пожилых людей !'} },
       {
           '7': {'start': 0, 'duration': 24, 'compliments': '7 ноября, день октябрьской революции !'} },
       {
           '25': {'start': 0, 'duration': 24, 'compliments': 'С католическим рождеством !'} }
   ];
   function catholicDate(year)
   {
   var a = year % 19;
   var b = year % 4;
   var c = year % 7;
   var k = Math.floor(year / 100);
   var p = Math.floor((13 + 8 * k) / 25);
   var q = Math.floor(k / 4);
   var m = (15 - p + k - q) % 30;
   var n = (4 + k - q) % 7;
   var d = (19 * a + m) % 30;
   var e = (2 * b + 4 * c + 6 * d + n) % 7;
   if (d === 29 && e === 6)
   return new Date(year, 3, 19);
   if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19))
   return new Date(year, 3, 18);
   if (d + e > 9)
   return new Date(year, 3, d + e - 9);
   else
   return new Date(year, 2, 22 + d + e);
   }
   
   function orthodoxDate(year)
   {
   var a = year % 19;
   var b = year % 4;
   var c = year % 7;
   var d = (19 * a + 15) % 30;
   var e = (2 * b + 4 * c + 6 * d + 6) % 7;
   var f = d + e;
   return f <= 26
   ? new Date(year, 3, 4 + f)
   : new Date(year, 4, f - 26);
   }
   
   function getActualCompliments()
   {
   var now = new Date( "2 May 2021 00:00:00:001" ); // кат.пасха "4 April 2021 00:00:00:000", прав.пасха "2 May 2021 00:00:00:000", радуница "11 May 2021 00:00:00:000", троица "20 June 2021 00:00:00:000"
   var result = holidays.filter(v =>
   {
   var currentDate = new Date(now.getFullYear(), v.month - 1, v.day, v.hour);
   var durms = v.duration * 3600000;
   console.log(now, currentDate, (now - currentDate) / 3600000);
   var rg = now - currentDate;
   return rg <= durms && rg >= 0;
   }).map(v => v.compliments);
   var caholic = catholicDate(now.getFullYear());
   var ortodox = orthodoxDate(now.getFullYear());
   if (caholic.getMonth() == now.getMonth() && caholic.getDate() == now.getDate())
   result.push("С католической пасхой!");
   if (ortodox.getMonth() == now.getMonth() && ortodox.getDate() == now.getDate())
   result.push("<span class='public_holiday'>С православной пасхой!</span>");
   
   var radunitsa = new Date(ortodox);
   radunitsa.setDate(radunitsa.getDate() + 9);
   if (radunitsa.getMonth() == now.getMonth() && radunitsa.getDate() == now.getDate())
   result.push("С радуницей !");
   
   var trinity = new Date(ortodox);
   trinity.setDate(trinity.getDate() + 49);
   if (trinity.getMonth() == now.getMonth() && trinity.getDate() == now.getDate())
   result.push("С троицей!");
   return result;
   }
   
   var actualCompliments = getActualCompliments();
   console.log(actualCompliments);
   if (actualCompliments.length > 0)
   {
   var hollyday = document.getElementById("holiday");
   hollyday.style.display = "block";
   for (var c of actualCompliments)
   {
   var div = document.createElement("div");
   hollyday.appendChild(div);
   div.innerHTML = c;
   }
   }
   function foo(month, day, compliment, hour = 0)
   {
   return { month: month, day: day, hour: hour, compliment: compliment }
   }
   
   var now9 = new Date();
   now9.setDate(now9.getDate() + 9);
   console.log(now9);
   
   var now49 = new Date();
   now49.setDate(now49.getDate() + 49);
   console.log(now49);
   
       d = new Date( "2 May 2021 00:00:00:001" ); // d = new Date( "9 May 2021 00:00:00:001" )
   
   if((m = holidays[d.getMonth()]) && m[d.getDate()]) {
               m = m[d.getDate()];
       if(d.getHours()>=m.start) {
       
       var h = document.getElementById("holiday");
        //       if (!b) {
       b = document.createElement("div");
       b.id = "holiday";
       b.innerHTML = m.compliments;
       b.style.display = "block";
       h.appendChild(b);
       }
       
   }
   </script>
   <div id="footer"></div>
   </body>
   </html>


как исправить строки 38-67, чтобы поздравление с днюхой не затиралось поздравлением с 2 мая, чтобы на странице были все три поздравления и с пасхой, и с 2 мая и с днюхой?

voraa 18.10.2021 17:02

Зачем вы поставили console.log в строке 110?
А если поставили, то почему не смотрите, что там выдается?

(Если уж взялись писать программы, так учитесь.
Подсказать можно, но писать за вас влом.)

voraa 18.10.2021 17:18

111 var rg = now - currentDate;

Где вы та лихо научились даты вычитать?

рони 18.10.2021 17:35

Цитата:

Сообщение от voraa
Где вы та лихо научились даты вычитать?

:) что-то не так?

Блондинка 18.10.2021 22:48

Цитата:

Сообщение от voraa (Сообщение 540772)
(Если уж взялись писать программы, так учитесь.
Подсказать можно, но писать за вас влом.)

так подскажите по конкретным строкам, 49-51, как их исправить чтобы поздравление с 2 мая не затирало поздравление с днюхой...


Часовой пояс GMT +3, время: 04:35.