Getcourse scripts
May 11, 2023

Оформить модуль, в  котором уроки недоступны + вывести дату выхода первого урока. JS код для списка тренингов в getcourse 

JS-код:

/**
 * Script Name: Добавить класс модулю, в  котором уроки недоступны + вывести дату выхода первого урока. JS код для списка тренингов в getcourse 
 * Version: 1.0
 * Author: Максим Калмыков
 * Url: https://t.me/getcomponent
 */


$(function () {
  // Название класса для модуля в котором недоступные уроки
  const notReachedClassName = 'not_reached';

  // Получить модули
  const modules = $('.stream-table > tbody > tr');

  if (modules.length === 0) return;

  modules.each(function (_, tr) {

    const link = $(tr).find('a').attr("href");

    $.get(link, function (data) {

      const pageDom = $('<div></div>').html(data);

      const lessons = pageDom.find('.lesson-list li:not(.lesson-is-hidden)');

      // Вывести дату первого урока
      showFirstLessonStart(lessons, tr);

      // Присвоить класс модулю, если нет доступных уроков внутри
      checkLessonsNotReached(lessons, tr);
    });

  });


  function checkLessonsNotReached(lessons, tr) {

    if (lessons.length === 0) return;

    let isNotReached = true;

    for (let i = 0; i < lessons.length; i++) {
      if (!$(lessons[i]).hasClass("user-state-not_reached")) {
        isNotReached = false;
        break;
      }
    }

    if (isNotReached) {
      $(tr).addClass(notReachedClassName)
    }
  }


  function showFirstLessonStart(lessons, tr) {

    const dateStartEl = lessons.eq(0).find('.has-start-at');

    if (dateStartEl.length === 0) return;

    $(tr).find('a').prepend(dateStartEl);

  }

})

*JS код вставлять в javascript блок или подключать через тему

*Данная версия скрипта(v 1.0) проверяет список уроков только на первом уровне вложенности (т.е. подмодули модуля скрипт не проверяет).

В результате работы скрипта:

  • Присвоился класс для модулей, в которых уроки недоступны
  • Добавлена дата выхода первого урока в списке (ищется именно первый урок в списке и в нем элемент даты)

Можно использовать добавленный класс not_reached чтобы обратиться к этим модулям для стилизации

Простой пример CSS кода для списка модулей

.xdget-trainingList .stream-table,
.xdget-trainingList .stream-table tbody,
.xdget-trainingList .stream-table tr,
.xdget-trainingList .stream-table tr td {
  display: block;
  margin: 0;
}


.xdget-trainingList .stream-table tr {
  margin-bottom: 10px;
  border: 1px solid #cccccc;
  border-radius: 10px;
}

.xdget-trainingList .stream-table tr.not_reached {
  opacity: 0.6;
  background-color: #f7f7f7;

}

.xdget-trainingList .stream-table tr td {
  height: auto;
  padding: 0;

}

.xdget-trainingList .stream-table tr td:hover {
  background-color: transparent;
}

.xdget-trainingList .stream-table tr a {
  padding: 10px 10px 10px 20px;
}

.xdget-trainingList .stream-table tr.not_reached a {
  cursor: default;
}

.xdget-trainingList .stream-table tr .has-start-at {
  font-size: 12px;
}


.xdget-trainingList .stream-table a>div>b {
  display: none;
}

Телеграм-канал: https://t.me/getcomponent