var COURSE_TEASER_EXPANDED_CLASS = 'course--expanded';
var COURSE_TEASER_CHEVRON_CLASS = 'course-chevron';

document.addEventListener('DOMContentLoaded', function() {
  var courseTeaserId = #{String courseId};
  var courseTeaser = document.querySelector('#course-' + courseTeaserId);
  var courseTeaserChevron = courseTeaser.querySelector('.' + COURSE_TEASER_CHEVRON_CLASS);

  courseTeaserChevron.addEventListener('click', function(event) {
    event.preventDefault();
    courseTeaser.classList.toggle(COURSE_TEASER_EXPANDED_CLASS);
  });

  courseTeaser.addEventListener('keydown', function(event) {
    var eventKey = event.key;
    if (eventKey === ' ' || eventKey === 'Enter') {
      event.preventDefault();
      courseTeaser.classList.toggle(COURSE_TEASER_EXPANDED_CLASS);
    }
  });
});