Kастомный код работает только на платных планах (кроме архивного плана Creator). На плане Free кастомный код будет отображаться только в режиме превью и не будет работать после публикации.
В нашем проекте Oracle Cards of Design Manifestos по клику на кнопку Shuffle выдается одна из сотен вдохновляющих цитат. Сделать рандомайзер можно следующим образом:
- Создайте многостраничный проект с повторяющимся контентом. Добавьте виджет Button (Кнопка) для активации рандомайзера и зафиксируйте его на всех страницах.
- Найдите ID виджета с кнопкой по инструкции здесь.
- Скопируйте код, представленный ниже и вставьте его во вкладку BEFORE <BODY>. Не забудьте заменить фрагменты
"PASTE WIDGET ID HERE"
на ID виджета из пункта 2. Обратите внимание, что в коде есть два таких фрагмента.
Не забудьте заменить фрагменты "PASTE WIDGET ID HERE"
с ID из шага 2. Обратите внимание, что таких фрагмента в коде два.
Этот код работает только в опубликованной версии проекта.
<script>
let buttons;
let pages = [];
const randomInteger = (min, max) => {
let rand = min + Math.random() * (max + 1 - min);
return Math.floor(rand);
}
const getRandomPageNum = () => {
let pageNum;
for(let attempts = 10; attempts > 0; attempts--) {
const randomPageIndex = randomInteger(1, pages.length);
if (pages[randomPageIndex] && pages[randomPageIndex] !== window.RM.viewerRouter.mag.currentPage.num) {
pageNum = pages[randomPageIndex];
break;
}
if (attempts === 1 && !pageNum && pages[randomPageIndex]) {
pageNum = pages[randomPageIndex];
}
}
return pageNum;
};
let timerId = setInterval(() => {
buttons = document.querySelectorAll('.center-page .rmwidget[data-id="paste widget is here"]');
if (buttons && buttons.length) {
clearInterval(timerId);
initPages();
onButtonFound();
}
}, 200);
const initPages = () => {
pages = (window.ServerData.mags.mag.pages || []).map(page => page.num);
};
const onButtonFound = () => {
for (let button of buttons) {
button.addEventListener('click', onClick);
}
};
const onClick = () => {
const pageNum = getRandomPageNum();
console.log(pageNum);
if (pageNum) {
window.RM.viewerRouter.mag.showPage(pageNum, { animation: false });
}
let timerId = setInterval(() => {
const newButtons = document.querySelectorAll('.center-page .rmwidget[data-id="PASTE WIDGET ID HERE"]');
if (newButtons && newButtons.length) {
clearInterval(timerId);
buttons = newButtons;
onButtonFound();
}
}, 200);
// setTimeout(() => {
// for (let button of buttons) {
// button.removeEventListener('click', onClick);
// }
// buttons = document.querySelectorAll('.rmwidget[data-id="PASTE WIDGET ID HERE"]');
// if (buttons && buttons.length) {
// onButtonFound();
// }
// }, 250);
};
</script>
В результате вы получите: