(window.firstForma.portal.block()).onLoaded(function(event){ const W = 800, H = 600; let news = document.querySelectorAll('.mnp-news-item'); news.forEach(item => item.addEventListener('click', function() { let wnd = window.top.radopen('/spaex.aspx/portal/block//news-details/' + item.dataset.taskid + '?slave=true'); wnd.setSize(W, H); wnd.moveTo((window.top.innerWidth - W)/2, (window.top.innerHeight - H)/2); })); const itemWidth = news[0].offsetWidth + 20; const delta = 10; let wrapper = document.querySelector('.mnp-news-wrapper'), container = document.querySelector('.mnp-news-container'); container.style.width = (news.length * itemWidth) + 'px'; container.style.marginLeft = 0; let left = document.getElementById('mnp-news-arrow-left'), right = document.getElementById('mnp-news-arrow-right'); function setArrowsVisibility() { let arrowAcc = getArrowAccess(); left.style.visibility = arrowAcc.arrowLeft ? '' : 'hidden'; right.style.visibility = arrowAcc.arrowRight ? '' : 'hidden'; } function getArrowAccess() { let first = news[0], last = news[news.length - 1], arrowLeft = false, arrowRight = false; if (Math.abs(wrapper.offsetLeft - first.offsetLeft) <= delta) { arrowLeft = false; arrowRight = true; } else if (Math.abs(wrapper.offsetLeft + wrapper.offsetWidth - last.offsetLeft - itemWidth) <= delta) { arrowLeft = true; arrowRight = false; } else { arrowLeft = true; arrowRight = true; } return {arrowLeft: arrowLeft, arrowRight: arrowRight}; } left.addEventListener('click', function() { let first = news[0]; let scrollValue = Math.min(itemWidth, wrapper.offsetLeft - first.offsetLeft); container.style.marginLeft = (parseInt(container.style.marginLeft.replace('px', '')) + scrollValue) + 'px'; }); right.addEventListener('click', function() { let last = news[news.length - 1]; let scrollValue = Math.min(itemWidth, last.offsetLeft + itemWidth - wrapper.offsetLeft - wrapper.offsetWidth); container.style.marginLeft = (parseInt(container.style.marginLeft.replace('px', '')) - scrollValue) + 'px'; }); container.addEventListener('transitionend', setArrowsVisibility); setArrowsVisibility(); let swipeFunc = function() { let element = document.querySelector('.mnp-news-container'); window.swipe(element); element.addEventListener('swipe', function(e) { let arrowAcc = getArrowAccess(); if (e.detail.dir == 'right' && arrowAcc.arrowLeft) { left.click(); } if (e.detail.dir == 'left' && arrowAcc.arrowRight) { right.click(); } }); }; setTimeout(swipeFunc, 5000); });