Просмотр доступен тут: https://rawgithub.com/modifier/yapre/master/index.html
Тестовое задание на вакансию "Разработчик поисковых интерфейсов" в Яндексе. Формулировка задания:
Реализуйте систему для показа презентаций. Подумайте над тем, как реализовать переключение слайдов, навигацию. Предусмотрите возможность размещения нескольких презентаций на одной странице.
Так как в задании не сказано, в чём суть самой системы, я решил сделать его простым виджетом, который можно применить к какому-либо блоку. Структура проста: есть div.presentation > div.slides-wrapper, внутри последнего должны находиться элементы div.slide. После создания объекта через конструктор и вызова .init() все элементы управления будут добавлены сами.
.init() Вызывает инициализацию виджета. Добавляет элементы управления. Использование всех остальных методов объекта до инициализации пусть будет на совести программиста.
.setSlide(index) Устанавливает текущий слайд в позицию index.
.nextSlide() Переключает на следующий слайд.
.prevSlide() Переключает на предыдущий слайд.
.firstSlide() Переключает на первый слайд.
.lastSlide() Переключает на последний слайд.
.play(interval, loop) Включает воспроизведение презентации с интервалом interval. Аргумент loop устаналивает, зациклить ли воспроизведение презентации.
.setPlayParams(interval, loop) Устанавливает параметры воспроизведения, не включая само воспроизведение.
.togglePlayButton(enableOrDisable) Включает или выключает отображение кнопки воспроизведения.
.pause() Останавливает воспроизведение на текущем слайде.
.stop() Останавливает воспроизведение на самом первом слайде.
.toggleFullscreen(expandOrNot) Открывает презентацию в полноэкранном режиме либо закрывает её, если expandOrNot установлен в false. Также добавляет к блоку с презентацией класс fullscreen для пользовательской кастомизации (изменить размеры шрифтов, картинок, etc.).
.toggleFullscreenButton(enableOrDisable) Отображает либо скрывает кнопку выхода в полноэкранный режим.