//**************************************************************************************************/ // Lytebox v4.0 (modyfied by Me) // // Author: Markus F. Hay // Website: http://www.dolem.com/lytebox // Date: July 30, 2011 // License: Creative Commons Attribution 3.0 License (http://creativecommons.org/licenses/by/3.0/) //**************************************************************************************************/ //"use strict"; //for old browsers add trim function to object String if(typeof String.prototype.trim !== 'function') { String.prototype.trim = function () { return this.replace(/^\s+|\s+$/g, ''); }; } //for old browsers define method // https://piecioshka.pl/blog/2012/02/09/bind-obok-call-i-apply-jako-piekna-natura-jezyka.html if(!Function.prototype.bind) { Function.prototype.bind = function (that) { var method = this; var slice = Array.prototype.slice; var args = slice.apply(arguments, [1]); return function () { return method.apply(that, args.concat(slice.apply(arguments, [0]))); }; }; } //main object (constructor function) function Lytebox() { // Below are the default settings that the lytebox viewer will inherit (look and feel, behavior) when displaying content. // Properties that start with "__" can be manipulated via the data-lyte-options attribute (i.e. data-lyte-options="autoResize:false doAnimations:false"). /*** Configure Lytebox ***/ this.theme = (typeof lyteboxTheme !== 'undefined') && /^(black|grey|red|green|blue|gold)$/i.test(lyteboxTheme) ? lyteboxTheme : 'grey'; // themes: black, grey, red, green, blue, gold this.innerBorder = true; // controls whether to show the inner border around image/html content this.outerBorder = true; // controls whether to show the outer grey (or theme) border this.resizeSpeed = 9; // controls the speed of the image resizing (1=slowest and 10=fastest) this.maxOpacity = 60; // higher opacity = darker overlay, lower opacity = lighter overlay this.borderSize = 12; // if you adjust the padding in the CSS, you will need to update this variable -- otherwise, leave this alone... (#lbImageContainer, #lbIframeContainer) this.__hideObjects = true; // controls whether or not objects (such as Flash, Java, etc.) should be hidden when the viewer opens this.__autoResize = true; // controls whether or not images should be resized if larger than the browser window dimensions this.__doAnimations = true; // controls whether or not "animate" Lytebox, i.e. resize transition between images, fade in/out effects, etc. this.__forceCloseClick = false; // if true, users are forced to click on the "Close" button when viewing content this.__refreshPage = false; // force page refresh after closing Lytebox this.__showPrint = false; // true to show print button, false to hide this.__navType = 3; // 1 = "Prev/Next" buttons on top left and left (default) // 2 = "<< prev | next >>" links next to image number // 3 = navType_1 + navType_2 (show both) /*** Configure Lyteframe (html viewer) Options ***/ this.__width = '90%'; // default width of content viewer this.__height = '90%'; // default height of content viewer this.__scrollbars = 'auto'; // controls the content viewers scollbars -- options are auto|yes|no /*** Configure Lyteshow (slideshow) Options ***/ this.__slideInterval = 8000; // change value (milliseconds) to increase/decrease the time between "slides" this.__showNavigation = true; // true to display Next/Prev buttons/text during slideshow, false to hide this.__showClose = true; // true to display the Close button, false to hide this.__showDetails = true; // true to display image details (caption, count), false to hide this.__showPlayPause = true; // true to display pause/play buttons next to close button, false to hide this.__autoEnd = true; // true to automatically close Lytebox after the last image is reached, false to keep open this.__pauseOnNextClick = false; // true to pause the slideshow when the "Next" button is clicked this.__pauseOnPrevClick = false; // true to pause the slideshow when the "Prev" button is clicked this.__loopSlideshow = false; // true to continuously loop through slides, false otherwise this.__autostartSlideshow = false; // true or false autostart the slideshow start from first image /*** Configure Lytetip (tooltips) Options ***/ this.changeTipCursor = true; // true to change the cursor to 'help', false to leave default (inhereted) this.tipStyle = 'classic'; // sets the default tip style if none is specified via data-lyte-options. Possible values are classic, info, help, warning, error /*** Configure Event Callbacks ***/ this.__beforeStart = ''; // function to call before the viewer starts this.__afterStart = ''; // function to call after the viewer starts this.__beforeEnd = ''; // function to call before the viewer ends (after close click) this.__afterEnd = ''; // function to call after the viewer ends if(this.resizeSpeed > 10) { this.resizeSpeed = 10; } if(this.resizeSpeed < 1) { this.resizeSpeed = 1; } this.resizeDuration = (11 - this.resizeSpeed) * 10; // Hash for navType - by A.Popov http://s3blog.org this.navTypeHash = new Object(); this.navTypeHash['Hover_by_type_1'] = true; this.navTypeHash['Display_by_type_1'] = false; this.navTypeHash['Hover_by_type_2'] = false; this.navTypeHash['Display_by_type_2'] = true; this.navTypeHash['Hover_by_type_3'] = true; this.navTypeHash['Display_by_type_3'] = true; this.resizeWTimerArray = new Array(); this.resizeWTimerCount = 0; this.resizeHTimerArray = new Array(); this.resizeHTimerCount = 0; this.showContentTimerArray = new Array(); this.showContentTimerCount = 0; this.overlayTimerArray = new Array(); this.overlayTimerCount = 0; this.imageTimerArray = new Array(); this.imageTimerCount = 0; this.timerIDArray = new Array(); this.timerIDCount = 0; this.slideshowIDArray = new Array(); this.slideshowIDCount = 0; this.imageArray = new Array(); this.activeImage = null; this.slideArray = new Array(); this.activeSlide = null; this.frameArray = new Array(); this.activeFrame = null; this.checkFrame(); this.isSlideshow = false; this.isLyteframe = false; this.tipSet = false; this.ie = this.ie6 = this.ie7 = this.ie8 = this.ie9 = false; this.setIEVersion(); this.classAttribute = (((this.ie && this.doc.compatMode == 'BackCompat') || this.ie6 || this.ie7) ? 'className' : 'class'); this.classAttribute = (this.ie && (document.documentMode == 8 || document.documentMode == 9)) ? 'class' : this.classAttribute; //this.bodyOnscroll = document.body.onscroll; // (07/20/2011) Save func of body.onscroll - fixed by A.Popov http://s3blog.org //w innym miejscu jest zapamietywane, ale sprawdzic this.position_fixed_support = this.position_fixed_check(); this.zooming = false; //touch this.Zooming = false; //Desktop this.error = false; this.initialize(); } //adding methods (functions) Lytebox.prototype.position_fixed_check = function() { // no (solid) support on -1 ? true : false); this.ie6 = (ver == 6 ? true : false); this.ie7 = (ver == 7 ? true : false); this.ie8 = (ver == 8 ? true : false); this.ie9 = (ver == 9 ? true : false); } }; Lytebox.prototype.initialize = function() { var myLytebox = this; this.updateLyteboxItems(); var oBody = this.doc.getElementsByTagName('body').item(0); if (this.doc.getElementById('lbOverlay')) { if( this.doc.getElementById('lbLauncher') ) oBody.removeChild(this.doc.getElementById('lbLauncher')); oBody.removeChild(this.doc.getElementById('lbOverlay')); oBody.removeChild(this.doc.getElementById('lbMain')); } //The ability to launch Lytebox from a function call (i.e. myLytebox.launch('http://www.google.com', 'width:80% height:80% scrolling:auto'). var oLauncher = this.doc.createElement('a'); oLauncher.setAttribute('id','lbLauncher'); //oLauncher.setAttribute('aria-hidden','true'); oLauncher.style.display = 'none'; //oBody.appendChild(oLauncher); // OFF var oOverlay = this.doc.createElement('div'); oOverlay.setAttribute('id','lbOverlay'); //oOverlay.setAttribute('aria-hidden','true'); oOverlay.setAttribute(this.classAttribute, this.theme); if ((this.ie && this.ie6) || ((this.ie7 || this.ie8 || this.ie9) && this.doc.compatMode == 'BackCompat')) { oOverlay.style.position = 'absolute'; } oOverlay.style.display = 'none'; oBody.appendChild(oOverlay); var oLytebox = this.doc.createElement('div'); oLytebox.setAttribute('id','lbMain'); oLytebox.style.display = 'none'; oBody.appendChild(oLytebox); var oOuterContainer = this.doc.createElement('div'); oOuterContainer.setAttribute('id','lbOuterContainer'); oOuterContainer.setAttribute('tabindex','-1'); //oOuterContainer.setAttribute('role','dialog'); //czytnik NVDA wariuje po wyjsciu (czyta wszystkie obrazki zamiast jednego) oOuterContainer.setAttribute('aria-modal','true'); oOuterContainer.setAttribute('aria-label','Powiększone zdjęcie'); //oOuterContainer.setAttribute('aria-describedby','lbCaption lbNumberDisplay'); //oOuterContainer.setAttribute('aria-describedby','lbDetailsText'); oOuterContainer.setAttribute(this.classAttribute, this.theme); oLytebox.appendChild(oOuterContainer); var oIframeContainer = this.doc.createElement('div'); oIframeContainer.setAttribute('id','lbIframeContainer'); oIframeContainer.style.display = 'none'; oOuterContainer.appendChild(oIframeContainer); var oIframe = this.doc.createElement('iframe'); oIframe.setAttribute('id','lbIframe'); oIframe.setAttribute('name','lbIframe') oIframe.setAttribute('title','lbIframe'); //oIframe.setAttribute('frameBorder','0'); //Use CSS instead if (this.innerBorder) { oIframe.setAttribute(this.classAttribute, this.theme); } oIframe.style.display = 'none'; oIframeContainer.appendChild(oIframe); var oImageContainer = this.doc.createElement('div'); oImageContainer.setAttribute('id','lbImageContainer'); oOuterContainer.appendChild(oImageContainer); var oLyteboxImage = this.doc.createElement('img'); oLyteboxImage.setAttribute('id','lbImage'); oLyteboxImage.setAttribute('src','lytebox/images/blank.gif'); oLyteboxImage.setAttribute('alt',''); //powiększone zdjęcie //oLyteboxImage.setAttribute('aria-describedby','lbCaption lbNumberDisplay'); //oLyteboxImage.setAttribute('aria-labelledby','lbCaption lbNumberDisplay'); //oLyteboxImage.setAttribute('aria-labelledby','lbCaption'); if (this.innerBorder) { oLyteboxImage.setAttribute(this.classAttribute, this.theme); } oLyteboxImage.setAttribute('draggable',false); //oLyteboxImage.draggable = false; //to samo co linijka wyzej //oLyteboxImage.setAttribute('unselectable','on'); //For Opera and <= IE9 ? //oLyteboxImage.ondragstart = function () { return false; }; oImageContainer.appendChild(oLyteboxImage); var oLoading = this.doc.createElement('div'); oLoading.setAttribute('id','lbLoading'); oLoading.setAttribute('tabindex','-1'); oLoading.setAttribute('aria-label',' trwa ładowanie ...'); oLoading.setAttribute(this.classAttribute, this.theme); oOuterContainer.appendChild(oLoading); var oDetailsContainer = this.doc.createElement('div'); oDetailsContainer.setAttribute('id','lbDetailsContainer'); oDetailsContainer.setAttribute(this.classAttribute, this.theme); oDetailsContainer.setAttribute('tabindex','-1'); oOuterContainer.appendChild(oDetailsContainer); var oDetailsData =this.doc.createElement('div'); oDetailsData.setAttribute('id','lbDetailsData'); oDetailsData.setAttribute(this.classAttribute, this.theme); oDetailsData.setAttribute('tabindex','-1'); oDetailsContainer.appendChild(oDetailsData); var oDetails = this.doc.createElement('div'); oDetails.setAttribute('id','lbDetails'); oDetails.setAttribute('tabindex','-1'); oDetailsData.appendChild(oDetails); var oDetailsText = this.doc.createElement('span'); oDetailsText.setAttribute('id','lbDetailsText'); oDetailsText.setAttribute('tabindex','-1'); oDetails.appendChild(oDetailsText); var oCaption = this.doc.createElement('span'); oCaption.setAttribute('id','lbCaption'); oDetailsText.appendChild(oCaption); var oHoverNav1 = this.doc.createElement('div'); oHoverNav1.setAttribute('id','lbHoverNav1'); oImageContainer.appendChild(oHoverNav1); var oHoverNav2 = this.doc.createElement('div'); oHoverNav2.setAttribute('id','lbHoverNav2'); oImageContainer.appendChild(oHoverNav2); var oBottomNav = this.doc.createElement('div'); oBottomNav.setAttribute('id','lbBottomNav'); oBottomNav.setAttribute('tabindex','-1'); oDetailsData.appendChild(oBottomNav); var oPrev = this.doc.createElement('a'); oPrev.setAttribute('id','lbPrev'); oPrev.setAttribute(this.classAttribute, this.theme); //oPrev.setAttribute('href','javascript:void(0)'); oPrev.setAttribute('href',''); oPrev.setAttribute('href','#lbPrev'); //oPrev.setAttribute('role','button'); oPrev.setAttribute('aria-label','poprzedni'); oPrev.setAttribute('title','poprzedni'); oPrev.setAttribute('aria-hidden','true'); oPrev.setAttribute('tabindex','-1'); oHoverNav1.appendChild(oPrev); var oNext = this.doc.createElement('a'); oNext.setAttribute('id','lbNext'); oNext.setAttribute(this.classAttribute, this.theme); //oNext.setAttribute('href','javascript:void(0)'); oNext.setAttribute('href',''); oNext.setAttribute('href','#lbNext'); //oNext.setAttribute('role','button'); oNext.setAttribute('aria-label','następny'); oNext.setAttribute('title','następny'); oNext.setAttribute('aria-hidden','true'); oNext.setAttribute('tabindex','-1'); oHoverNav2.appendChild(oNext); var oNumberDisplay = this.doc.createElement('span'); oNumberDisplay.setAttribute('id','lbNumberDisplay'); oDetailsText.appendChild(oNumberDisplay); var oNavDisplay = this.doc.createElement('span'); oNavDisplay.setAttribute('id','lbNavDisplay'); oNavDisplay.style.display = 'none'; oDetails.appendChild(oNavDisplay); var oClose = this.doc.createElement('a'); oClose.setAttribute('id','lbClose'); oClose.setAttribute(this.classAttribute, this.theme); //oClose.setAttribute('href','javascript:void(0)'); oClose.setAttribute('href','#lbClose'); oClose.setAttribute('role','button'); oClose.setAttribute('aria-label','Zamknij'); oClose.setAttribute('title','Zamknij'); oBottomNav.appendChild(oClose); var oPrint = this.doc.createElement('a'); oPrint.setAttribute('id','lbPrint'); oPrint.setAttribute(this.classAttribute, this.theme); //oPrint.setAttribute('href','javascript:void(0)'); oPrint.setAttribute('href','#lbPrint'); oPrint.setAttribute('role','button'); oPrint.setAttribute('aria-label','drukuj'); oPrint.setAttribute('title','drukuj'); oPrint.style.display = 'none'; oBottomNav.appendChild(oPrint); var oPause = this.doc.createElement('a'); oPause.setAttribute('id','lbPause'); oPause.setAttribute(this.classAttribute, this.theme); //oPause.setAttribute('href','javascript:void(0)'); oPause.setAttribute('href','#lbPause'); oPause.setAttribute('role','button'); oPause.setAttribute('aria-label','pauza'); oPause.setAttribute('title','pauza'); oPause.style.display = 'none'; oBottomNav.appendChild(oPause); var oPlay = this.doc.createElement('a'); oPlay.setAttribute('id','lbPlay'); oPlay.setAttribute(this.classAttribute, this.theme); //oPlay.setAttribute('href','javascript:void(0)'); oPlay.setAttribute('href','#lbPlay'); oPlay.setAttribute('role','button'); oPlay.setAttribute('aria-label','play'); oPlay.setAttribute('title','play'); oPlay.style.display = 'none'; oBottomNav.appendChild(oPlay); //for touch devices var callbackSwipe = function(swipeDirection,swipeLength) { if ( swipeDirection == 'left' ) myLytebox.keyboardAction(null,'n'); else if ( swipeDirection == 'right' ) myLytebox.keyboardAction(null,'p'); else if ( swipeDirection == 'down' && swipeLength>myLytebox.getPageSize()[5]*0.75 ) myLytebox.keyboardAction(null,'c'); }; //Swipe_for_LyteBox().WatchSwipe('lbOuterContainer',callbackSwipe); Swipe_for_LyteBox(myLytebox).WatchSwipe(oOuterContainer,callbackSwipe); //Swipe_for_LyteBox().WatchSwipe('lbImage',callbackSwipe); }; Lytebox.prototype.updateLyteboxItems = function() { var myLytebox = this; // (07/20/2011) anchors = null fix provided by A.Popov http://s3blog.org, slightly modified by Markus Hay var anchors = (this.isFrame && window.parent.frames[window.name].document) ? window.parent.frames[window.name].document.getElementsByTagName('a') : document.getElementsByTagName('a'); anchors = (this.isFrame) ? anchors : document.getElementsByTagName('a'); var areas = (this.isFrame && window.parent.frames[window.name].document) ? window.parent.frames[window.name].document.getElementsByTagName('area') : document.getElementsByTagName('area'); var lyteLinks = this.combine(anchors, areas); var myLink , relAttribute , classAttribute , dataAttribute , tipStyle , tipImage , tipHtml , aSetting , sName , sValue; var myLink = relAttribute = classAttribute = dataAttribute = tipStyle = tipImage = tipHtml = aSetting = sName = sValue = null; for (var i = 0; i < lyteLinks.length; i++) { myLink = lyteLinks[i]; relAttribute = String(myLink.getAttribute('rel')); classAttribute = String(myLink.getAttribute(this.classAttribute)); if (myLink.getAttribute('href',2)) { if (relAttribute.toLowerCase().match('lytebox')) { myLink.onclick = function () { myLytebox.start(this, false, false); return false; } } else if (relAttribute.toLowerCase().match('lyteshow')) { myLink.onclick = function () { myLytebox.start(this, true, false); return false; } } else if (relAttribute.toLowerCase().match('lyteframe')) { myLink.onclick = function () { myLytebox.start(this, false, true); return false; } } else if (classAttribute.toLowerCase().match('lytetip') && myLink.getAttribute('title') != null && !this.tipsSet) { if (this.changeTipCursor) { myLink.style.cursor = 'help'; } dataAttribute = String(myLink.getAttribute('data-lyte-options')); if (dataAttribute == 'null') { tipStyle = this.tipStyle; } else { aSetting = dataAttribute.split(':'); if (aSetting.length > 1) { sName = String(aSetting[0]).trim().toLowerCase(); sValue = String(aSetting[1]).trim().toLowerCase(); tipStyle = (sName == 'tipstyle' ? (/classic|info|help|warning|error/.test(sValue) ? sValue : this.tipStyle) : this.tipStyle); } } switch(tipStyle) { case 'info': tipStyle = 'lbCustom lbInfo'; tipImage = 'lbTipImg lbInfoImg'; break; case 'help': tipStyle = 'lbCustom lbHelp'; tipImage = 'lbTipImg lbHelpImg'; break; case 'warning': tipStyle = 'lbCustom lbWarning'; tipImage = 'lbTipImg lbWarningImg'; break; case 'error': tipStyle = 'lbCustom lbError'; tipImage = 'lbTipImg lbErrorImg'; break; case 'classic': tipStyle = 'lbClassic'; break; default: tipStyle = tipImage = ''; } if (this.ie6 || this.ie7 || (this.ie8 && this.doc.compatMode == 'BackCompat')) { tipImage = ''; if (tipStyle != 'lbClassic' && tipStyle != '') { tipStyle += ' lbIEFix'; } } tipHtml = myLink.innerHTML; myLink.innerHTML = ''; myLink.innerHTML = tipHtml + '' + (tipImage ? '
' : '') + myLink.getAttribute('title') + '
'; myLink.setAttribute('title',''); } } } this.tipsSet = true; }; Lytebox.prototype.start = function(oLink, bLyteshow, bLyteframe) { var myLytebox = this; oLink.blur(); this.setOptions(String(oLink.getAttribute('data-lyte-options'))); if (this.beforeStart != '') { var callback = window[this.beforeStart]; if (typeof callback === 'function') { if (!callback()) { return; } } } if (this.ie && this.ie6) { this.toggleSelects('hide'); } if (this.hideObjects) { this.toggleObjects('hide'); } this.isLyteframe = (bLyteframe ? true : false); if (this.isFrame && window.parent.frames[window.name].document) { window.parent.myLytebox.printId = (this.isLyteframe ? 'lbIframe' : 'lbImage'); } else { this.printId = (this.isLyteframe ? 'lbIframe' : 'lbImage'); } var pageSize = this.getPageSize(); var objOverlay = this.doc.getElementById('lbOverlay'); var objBody = this.doc.getElementsByTagName("body").item(0); objOverlay.style.height = pageSize[1] + "px"; objOverlay.style.display = ''; this.appear('lbOverlay', (this.doAnimations ? 0 : this.maxOpacity)); var anchors = (this.isFrame && window.parent.frames[window.name].document) ? window.parent.frames[window.name].document.getElementsByTagName('a') : document.getElementsByTagName('a'); anchors = (this.isFrame) ? anchors : document.getElementsByTagName('a'); var areas = (this.isFrame) ? window.parent.frames[window.name].document.getElementsByTagName('area') : document.getElementsByTagName('area'); var lyteLinks = this.combine(anchors, areas); if (this.isLyteframe) { this.frameArray = []; this.frameNum = 0; if (oLink.getAttribute('rel') == 'lyteframe') { this.frameArray.push( new Array(oLink.getAttribute('href',2), oLink.getAttribute('title'), oLink) ); } else { if (oLink.getAttribute('rel') && oLink.getAttribute('rel').indexOf('lyteframe') != -1) { for (var i = 0; i < lyteLinks.length; i++) { var myLink = lyteLinks[i]; if (myLink.getAttribute('href',2) && myLink.getAttribute('rel') == oLink.getAttribute('rel')) { this.frameArray.push( new Array(myLink.getAttribute('href',2), myLink.getAttribute('title'), myLink) ); } } this.frameArray = this.removeDuplicates(this.frameArray); while(this.frameArray[this.frameNum][0] != oLink.getAttribute('href',2)) { this.frameNum++; } } } } else { this.imageArray = []; this.imageNum = 0; this.slideArray = []; this.slideNum = 0; if (oLink.getAttribute('rel') == 'lytebox') { this.imageArray.push( new Array(oLink.getAttribute('href',2), oLink.getAttribute('title'), oLink) ); } else { if (oLink.getAttribute('rel') && oLink.getAttribute('rel').indexOf('lytebox') != -1) { for (var i = 0; i < lyteLinks.length; i++) { var myLink = lyteLinks[i]; if (myLink.getAttribute('href',2) && myLink.getAttribute('rel') == oLink.getAttribute('rel')) { this.imageArray.push( new Array(myLink.getAttribute('href',2), myLink.getAttribute('title'), myLink) ); } } this.imageArray = this.removeDuplicates(this.imageArray); while(this.imageArray[this.imageNum][0] != oLink.getAttribute('href',2)) { this.imageNum++; } } if (oLink.getAttribute('rel') && oLink.getAttribute('rel').indexOf('lyteshow') != -1) { for (var i = 0; i < lyteLinks.length; i++) { var myLink = lyteLinks[i]; if (myLink.getAttribute('href',2) && myLink.getAttribute('rel') == oLink.getAttribute('rel')) { this.slideArray.push( new Array(myLink.getAttribute('href',2), myLink.getAttribute('title'), myLink) ); //this.slideArray.push( new Array(myLink.getAttribute('href',2), myLink.getAttribute('title')? myLink.getAttribute('title'):myLink.querySelector('img').getAttribute('alt'), myLink) ); } } this.slideArray = this.removeDuplicates(this.slideArray); while(this.slideArray[this.slideNum][0] != oLink.getAttribute('href',2)) { this.slideNum++; } } } } var object = this.doc.getElementById('lbMain'); object.style.display = ''; var contentHeight = this.doc.getElementById('lbOuterContainer').offsetHeight; //var ps = (pageSize[3] / 100); //top var ps = (pageSize[3] - contentHeight) / 2; //vertical centered // (07/20/2011) Viewer will stay in fixed position if scrolling up/down - fixed by A.Popov http://s3blog.org if( (document.all && document.all.item && !window.opera) || (!this.position_fixed_support) ) { object.style.top = (this.getPageScroll() + ps) + "px"; object.style.position = "absolute"; this.bodyOnscroll = document.body.onscroll; // (07/20/2011) Save last func of body.onscroll - fixed by A.Popov http://s3blog.org var handler = function() { if (!myLytebox.zooming) { //var pageSize = myLytebox.getPageSize(); //ponowne sprawdzenie var contentHeight = document.getElementById('lbOuterContainer').offsetHeight; //bo trzeba sprawdzić ponownie var ps = (pageSize[3] - contentHeight) / 2; //vertical centered document.getElementById('lbMain').style.top = (myLytebox.getPageScroll() + ps) + 'px'; } } if (window.addEventListener) { window.addEventListener('scroll', handler, false); } else if (window.attachEvent) { window.attachEvent('onscroll', handler); } } else { object.style.top = ps + "px"; object.style.position = "fixed"; } if (!this.outerBorder) { this.doc.getElementById('lbOuterContainer').style.border = 'none'; } else { this.doc.getElementById('lbOuterContainer').setAttribute(this.classAttribute, this.theme); } if (this.forceCloseClick) { this.doc.getElementById('lbOverlay').onclick = ''; } else { this.doc.getElementById('lbOverlay').onclick = function() { myLytebox.end(); return false; } } this.doc.getElementById('lbMain').onclick = function(e) { var e = e; if (!e) { if (window.name && window.parent.frames[window.name] && (parent.document.getElementsByTagName('frameset').length <= 0)) { e = window.parent.window.event; } else { e = window.event; } } var id = (e.target ? e.target.id : e.srcElement.id); if ((id == 'lbMain') && (!myLytebox.forceCloseClick)) { myLytebox.end(); return false; } } this.doc.getElementById('lbPrint').onclick = function() { myLytebox.printWindow(); return false; } this.doc.getElementById('lbClose').onclick = function() { myLytebox.end(); return false; } this.doc.getElementById('lbPause').onclick = function() { myLytebox.togglePlayPause("lbPause", "lbPlay"); return false; } this.doc.getElementById('lbPlay').onclick = function() { myLytebox.togglePlayPause("lbPlay", "lbPause"); return false; } this.isSlideshow = bLyteshow; if(this.autostartSlideshow) this.isPaused = (this.slideNum != 0 ? true : false); else this.isPaused = true; //always paused //this.isPaused = !this.autostartSlideshow; if (this.isSlideshow && this.showPlayPause && this.isPaused) { this.doc.getElementById('lbPlay').style.display = ''; this.doc.getElementById('lbPause').style.display = 'none'; } if (this.isLyteframe) { this.changeContent(this.frameNum); } else { if (this.isSlideshow) { this.changeContent(this.slideNum); } else { this.changeContent(this.imageNum); } } this.PageSize = this.getPageSize(); this.Orientation = this.detectOrientation(); //nazwa zmiennej musi byc duza litera this.watchOrientationChange(); this.Zoom = this.detectZoom(); this.watchZoomChange(); }; // The ability to launch Lytebox from a function call (i.e. myLytebox.launch('http://www.google.com', 'width:80% height:80% scrolling:auto'). Lytebox.prototype.launch = function(sUrl, sOptions) { var sExt = sUrl.split('.').pop().toLowerCase(); var sRel = 'lyteframe'; if (sExt == 'png' || sExt == 'jpg' || sExt == 'jpeg' || sExt == 'gif' || sExt == 'bmp') { sRel = 'lytebox'; } var oLauncher = this.doc.getElementById('lbLauncher'); if( oLauncher ) { oLauncher.setAttribute('href', sUrl); oLauncher.setAttribute('rel', sRel); oLauncher.setAttribute('data-lyte-options', !sOptions ? '' : sOptions); this.updateLyteboxItems(); this.start(oLauncher, false, (sRel == 'lyteframe')); } else alert('The ability to launch Lytebox from a function call is turned OFF'); }; Lytebox.prototype.changeContent = function(iImageNum) { var myLytebox = this; //this.doc.getElementById('lbOuterContainer').focus(); //if(this.zooming) { //if was modified back to previous state if(this.zooming || this.Zooming) { //if was modified back to previous state //nie wiem czy trzeba tak this.zooming = false; this.Zooming = false; //nie wiem czy trzeba var pageSize = this.getPageSize(); var contentHeight = this.doc.getElementById('lbOuterContainer').offsetHeight; //var ps = (pageSize[3] / 100); //top var ps = (pageSize[3] - contentHeight) / 2; //vertical centered var object = this.doc.getElementById('lbMain'); if( !( (document.all && document.all.item && !window.opera) || (!this.position_fixed_support) ) ) { object.style.top = ps + "px"; object.style.position = "fixed"; //set position to "fixed' (from "absolute") } else { object.style.top = (this.getPageScroll() + ps) + "px"; //sprawdzic to (np.dla starego Androida) } } if (this.isSlideshow) { for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); } } this.activeImage = this.activeSlide = this.activeFrame = iImageNum; if (!this.outerBorder) { this.doc.getElementById('lbOuterContainer').style.border = 'none'; } else { this.doc.getElementById('lbOuterContainer').setAttribute(this.classAttribute, this.theme); } this.doc.getElementById('lbLoading').style.display = ''; //try{ this.doc.getElementById('lbLoading').focus(); }catch(e){} //nie zawsze sprawdza sie this.doc.getElementById('lbImage').style.display = 'none'; this.doc.getElementById('lbIframe').style.display = 'none'; this.doc.getElementById('lbPrev').style.display = 'none'; this.doc.getElementById('lbNext').style.display = 'none'; this.doc.getElementById('lbPrint').style.display = 'none'; this.doc.getElementById('lbIframeContainer').style.display = 'none'; this.doc.getElementById('lbDetailsContainer').style.display = 'none'; this.doc.getElementById('lbNumberDisplay').style.display = 'none'; if (this.navTypeHash['Display_by_type_' + this.navType] || this.isLyteframe) { object = this.doc.getElementById('lbNavDisplay'); object.innerHTML = ''+ ''+ ''+ ' '+ ''+ ''+ ''; object.style.display = 'none'; } if (this.isLyteframe) { var iframe = myLytebox.doc.getElementById('lbIframe'); var pageSize = this.getPageSize(); // (07/20/2011) if width/height are percentages, determine width in pixels before setting - fixed by A.Popov http://s3blog.org var w = this.width.trim(); var h = this.height.trim(); if (/\%/.test(w)) { var percent = parseInt(w); w = parseInt((pageSize[2]-50)*percent/100); //nie testowalem w = w+'px'; } if (/\%/.test(h)) { var percent = parseInt(h); h = parseInt((pageSize[3]-100)*percent/100); //nie testowalem h = h+'px'; } iframe.height = h; iframe.width = w; iframe.scrolling = this.scrollbars.trim(); this.resizeContainer(parseInt(iframe.width), parseInt(iframe.height)); } else { var imgPreloader = new Image(); imgPreloader.onload = function() { var imageWidth = this.width; var imageHeight = this.height; if (myLytebox.autoResize) { var pagesize = myLytebox.getPageSize(); var x = pagesize[2] - 50; var y = pagesize[3] - ( pagesize[2]>pagesize[3]? 60:90); if( imageWidthpagesize[3] ) y -= 15; //dodalem if (imageWidth > x) { imageHeight = Math.round(imageHeight * (x / imageWidth)); imageWidth = x; if (imageHeight > y) { imageWidth = Math.round(imageWidth * (y / imageHeight)); imageHeight = y; } } else if (imageHeight > y) { imageWidth = Math.round(imageWidth * (y / imageHeight)); imageHeight = y; if (imageWidth > x) { imageHeight = Math.round(imageHeight * (x / imageWidth)); imageWidth = x; } } } var lbImage = myLytebox.doc.getElementById('lbImage'); lbImage.src = this.src; lbImage.width = imageWidth; lbImage.height = imageHeight; lbImage.alt = ''; //lbImage.title = ''; if (myLytebox.error) { myLytebox.error = false; if (myLytebox.innerBorder) lbImage.setAttribute(myLytebox.classAttribute, myLytebox.theme); else lbImage.setAttribute(myLytebox.classAttribute, ''); } myLytebox.resizeContainer(imageWidth, imageHeight); } imgPreloader.onerror = function() { var imageWidth = 170, imageHeight = 125; var lbImage = myLytebox.doc.getElementById('lbImage'); lbImage.src = this.src; lbImage.width = imageWidth; lbImage.height = imageHeight; lbImage.setAttribute(myLytebox.classAttribute, 'error'); lbImage.alt = 'error'; //lbImage.title = 'error occurred'; myLytebox.error = true; myLytebox.resizeContainer(imageWidth, imageHeight); //aby kontynuowac }; //start loading image imgPreloader.src = (this.isSlideshow ? this.slideArray[this.activeSlide][0] : this.imageArray[this.activeImage][0]); } }; Lytebox.prototype.resizeContainer = function(iWidth, iHeight) { this.wDone = false; this.hDone = false; //this.enableKeyboardNav(); this.wCur = this.doc.getElementById('lbOuterContainer').offsetWidth; this.wCur -= 4; //border of #lbOuterContainer.grey from css file (2x2 left and right) //in future look at https://www.quirksmode.org/dom/getstyles.html this.hCur = this.doc.getElementById('lbOuterContainer').offsetHeight; this.hCur -= 4; //border of #lbOuterContainer.grey from css file (2x2 top and bottom) //in future look at https://www.quirksmode.org/dom/getstyles.html if(this.doc.getElementById('lbOuterContainer').style.paddingBottom) this.hCur -= parseInt(this.doc.getElementById('lbOuterContainer').style.paddingBottom); this.xScale = ((iWidth + (this.borderSize * 2)) / this.wCur) * 100; this.yScale = ((iHeight + (this.borderSize * 2)) / this.hCur) * 100; var wDiff = (this.wCur - this.borderSize * 2) - iWidth; var hDiff = (this.hCur - this.borderSize * 2) - iHeight; if (!(hDiff == 0)) { this.hDone = false; this.resizeH('lbOuterContainer', this.hCur, iHeight + this.borderSize*2, this.getPixelRate(this.hCur, iHeight)); } else { this.hDone = true; } if (!(wDiff == 0)) { this.wDone = false; this.resizeW('lbOuterContainer', this.wCur, iWidth + this.borderSize*2, this.getPixelRate(this.wCur, iWidth)); } else { this.wDone = true; } if ((hDiff == 0) && (wDiff == 0)) { if (this.ie){ this.pause(250); } else { this.pause(100); } } this.doc.getElementById('lbPrev').style.height = iHeight + "px"; this.doc.getElementById('lbNext').style.height = iHeight + "px"; this.showContent(); }; Lytebox.prototype.showContent = function() { var myLytebox = this; if (!((this.ie7 || this.ie8 || this.ie9) && this.doc.compatMode == 'BackCompat') && !this.ie6) { this.doc.getElementById('lbOuterContainer').style.paddingBottom = 0; } if (this.wDone && this.hDone) { for (var i = 0; i < this.showContentTimerCount; i++) { window.clearTimeout(this.showContentTimerArray[i]); } //this.doc.getElementById('lbOuterContainer').focus(); this.doc.getElementById('lbLoading').style.display = 'none'; if (this.isLyteframe) { this.doc.getElementById('lbIframe').style.display = ''; this.appear('lbIframe', (this.doAnimations ? 70 : 100)); } else { this.doc.getElementById('lbImage').style.display = ''; this.appear('lbImage', (this.doAnimations ? 70 : 100)); this.preloadNeighborImages(); } if (this.isSlideshow) { if(this.activeSlide == (this.slideArray.length - 1)) { if (this.loopSlideshow) { //this.slideshowIDArray[this.slideshowIDCount++] = setTimeout("myLytebox.changeContent(0)", this.slideInterval); this.slideshowIDArray[this.slideshowIDCount++] = setTimeout(function(){myLytebox.changeContent(0)}, this.slideInterval); } else if (this.autoEnd) { //this.slideshowIDArray[this.slideshowIDCount++] = setTimeout("myLytebox.end('slideshow')", this.slideInterval); this.slideshowIDArray[this.slideshowIDCount++] = setTimeout(function(){myLytebox.end('slideshow')}, this.slideInterval); } } else { if (!this.isPaused) { //this.slideshowIDArray[this.slideshowIDCount++] = setTimeout("myLytebox.changeContent("+(this.activeSlide+1)+")", this.slideInterval); this.slideshowIDArray[this.slideshowIDCount++] = setTimeout(function(){myLytebox.changeContent((myLytebox.activeSlide+1))}, this.slideInterval); } } this.doc.getElementById('lbHoverNav1').style.display = this.doc.getElementById('lbHoverNav2').style.display = (this.showNavigation && this.navTypeHash['Hover_by_type_' + this.navType] ? '' : 'none'); this.doc.getElementById('lbClose').style.display = (this.showClose ? '' : 'none'); this.doc.getElementById('lbDetails').style.display = (this.showDetails ? '' : 'none'); this.doc.getElementById('lbPause').style.display = (this.showPlayPause && !this.isPaused ? '' : 'none'); this.doc.getElementById('lbPlay').style.display = (this.showPlayPause && !this.isPaused ? 'none' : ''); if(this.slideArray.length < 2 && this.isPaused) { this.doc.getElementById('lbPause').style.display = 'none'; this.doc.getElementById('lbPlay').style.display = 'none'; } this.doc.getElementById('lbNavDisplay').style.display = (this.showNavigation && this.navTypeHash['Display_by_type_' + this.navType] ? '' : 'none'); } else { this.doc.getElementById('lbHoverNav1').style.display = this.doc.getElementById('lbHoverNav2').style.display = (this.navTypeHash['Hover_by_type_' + this.navType] && !this.isLyteframe ? '' : 'none'); if ((this.navTypeHash['Display_by_type_' + this.navType] && !this.isLyteframe && this.imageArray.length > 1) || (this.frameArray.length > 1 && this.isLyteframe)) { this.doc.getElementById('lbNavDisplay').style.display = ''; } else { this.doc.getElementById('lbNavDisplay').style.display = 'none'; } this.doc.getElementById('lbClose').style.display = ''; this.doc.getElementById('lbDetails').style.display = ''; this.doc.getElementById('lbPause').style.display = 'none'; this.doc.getElementById('lbPlay').style.display = 'none'; } this.doc.getElementById('lbPrint').style.display = (this.showPrint ? '' : 'none'); this.doc.getElementById('lbImageContainer').style.display = (this.isLyteframe ? 'none' : ''); this.doc.getElementById('lbIframeContainer').style.display = (this.isLyteframe ? '' : 'none'); try { // (07/20/2011) identifier for cgi.script-server - by A.Popov http://s3blog.org var uri = this.frameArray[this.activeFrame][0]; if (/\?/.test(uri)) { uri += '&request_from=lytebox'; } else { uri += '?request_from=lytebox'; } this.doc.getElementById('lbIframe').src = uri; } catch(e) { } if (this.afterStart != '') { var callback = window[this.afterStart]; if (typeof callback === 'function') { callback(); } } } else { //this.showContentTimerArray[this.showContentTimerCount++] = setTimeout("myLytebox.showContent()", 200); this.showContentTimerArray[this.showContentTimerCount++] = setTimeout(function(){myLytebox.showContent()}, 200); } }; Lytebox.prototype.updateDetails = function() { var myLytebox = this; var object = this.doc.getElementById('lbCaption'); var oImage = this.doc.getElementById('lbImage'); var sTitle = (this.isSlideshow ? this.slideArray[this.activeSlide][1] : (this.isLyteframe ? this.frameArray[this.activeFrame][1] : this.imageArray[this.activeImage][1])); sTitle = sTitle || ''; if(sTitle) if(!oImage.alt) oImage.alt = sTitle; if( sTitle.indexOf("\n")!=-1 ){ //oImage.alt = sTitle.replace("\n",' '); sTitle = sTitle.replace("\n",'
')+''; }else sTitle = ''+sTitle+''; object.style.display = ''; //object.innerHTML = (!sTitle? '' : sTitle); object.innerHTML = (!sTitle? '' : ''+sTitle+''); //object.innerHTML = (!sTitle? '' : sTitle+'
 '); //if (sTitle) object.onclick = function(){ alert( (this.innerHTML).replace('
 ','') ) }; this.updateNav(); this.doc.getElementById('lbDetailsContainer').style.display = ''; object = this.doc.getElementById('lbNumberDisplay'); if (this.isSlideshow && this.slideArray.length > 1) { object.style.display = ''; object.innerHTML = "Obraz " + eval(this.activeSlide + 1) + " z " + this.slideArray.length; if(!oImage.alt) oImage.alt = '('+object.innerHTML+')'; this.doc.getElementById('lbNavDisplay').style.display = (this.navTypeHash['Display_by_type_' + this.navType] && this.showNavigation ? '' : 'none'); } else if (this.imageArray.length > 1 && !this.isLyteframe) { object.style.display = ''; object.innerHTML = "Image " + eval(this.activeImage + 1) + " of " + this.imageArray.length; this.doc.getElementById('lbNavDisplay').style.display = (this.navTypeHash['Display_by_type_' + this.navType] ? '' : 'none'); } else if (this.frameArray.length > 1 && this.isLyteframe) { object.style.display = ''; object.innerHTML = "Page " + eval(this.activeFrame + 1) + " of " + this.frameArray.length; this.doc.getElementById('lbNavDisplay').style.display = ''; } else { this.doc.getElementById('lbNavDisplay').style.display = 'none'; if(!oImage.alt) { if(this.slideArray.length == 1) { oImage.alt = '(duży obraz)'; //object.innerHTML = 'powiększenie'; object.style.display = ''; } } } if (!((this.ie7 || this.ie8 || this.ie9) && this.doc.compatMode == 'BackCompat') && !this.ie6) { //this.doc.getElementById('lbOuterContainer').style.paddingBottom = this.doc.getElementById('lbDetailsContainer').offsetHeight + 1 + 'px'; } this.appear('lbDetailsContainer', (this.doAnimations ? 20 : 100)); //koniec tworzenia kompletnego slajdu }; Lytebox.prototype.updateNav = function() { var myLytebox = this; if (this.isSlideshow) { if (this.activeSlide != 0) { if (this.navTypeHash['Display_by_type_' + this.navType]) { var object = this.doc.getElementById('lbPrev2'); object.style.display = ''; object.onclick = function() { if (myLytebox.pauseOnPrevClick) myLytebox.togglePlayPause("lbPause", "lbPlay"); myLytebox.changeContent(myLytebox.activeSlide - 1); return false; } } if (this.navTypeHash['Hover_by_type_' + this.navType]) { var object = this.doc.getElementById('lbPrev'); object.style.display = ''; object.onclick = function() { if (myLytebox.pauseOnPrevClick) myLytebox.togglePlayPause("lbPause", "lbPlay"); myLytebox.changeContent(myLytebox.activeSlide - 1); return false; } } } else { if (this.navTypeHash['Display_by_type_' + this.navType]) { this.doc.getElementById('lbPrev2_Off').style.display = ''; } } if (this.activeSlide != (this.slideArray.length - 1)) { if (this.navTypeHash['Display_by_type_' + this.navType]) { var object = this.doc.getElementById('lbNext2'); object.style.display = ''; object.onclick = function() { if (myLytebox.pauseOnNextClick) myLytebox.togglePlayPause("lbPause", "lbPlay"); myLytebox.changeContent(myLytebox.activeSlide + 1); return false; } } if (this.navTypeHash['Hover_by_type_' + this.navType]) { var object = this.doc.getElementById('lbNext'); object.style.display = ''; object.onclick = function() { if (myLytebox.pauseOnNextClick) myLytebox.togglePlayPause("lbPause", "lbPlay"); myLytebox.changeContent(myLytebox.activeSlide + 1); return false; } } } else { if (this.navTypeHash['Display_by_type_' + this.navType]) { this.doc.getElementById('lbNext2_Off').style.display = ''; } } } else if (this.isLyteframe) { if(this.activeFrame != 0) { var object = this.doc.getElementById('lbPrev2'); object.style.display = ''; object.onclick = function() { myLytebox.changeContent(myLytebox.activeFrame - 1); return false; } } else { this.doc.getElementById('lbPrev2_Off').style.display = ''; } if(this.activeFrame != (this.frameArray.length - 1)) { var object = this.doc.getElementById('lbNext2'); object.style.display = ''; object.onclick = function() { myLytebox.changeContent(myLytebox.activeFrame + 1); return false; } } else { this.doc.getElementById('lbNext2_Off').style.display = ''; } } else { if(this.activeImage != 0) { if (this.navTypeHash['Display_by_type_' + this.navType]) { var object = this.doc.getElementById('lbPrev2'); object.style.display = ''; object.onclick = function() { myLytebox.changeContent(myLytebox.activeImage - 1); return false; } } if (this.navTypeHash['Hover_by_type_' + this.navType]) { var object2 = this.doc.getElementById('lbPrev'); object2.style.display = ''; object2.onclick = function() { myLytebox.changeContent(myLytebox.activeImage - 1); return false; } } } else { if (this.navTypeHash['Display_by_type_' + this.navType]) { this.doc.getElementById('lbPrev2_Off').style.display = ''; } } if(this.activeImage != (this.imageArray.length - 1)) { if (this.navTypeHash['Display_by_type_' + this.navType]) { var object = this.doc.getElementById('lbNext2'); object.style.display = ''; object.onclick = function() { myLytebox.changeContent(myLytebox.activeImage + 1); return false; } } if (this.navTypeHash['Hover_by_type_' + this.navType]) { var object2 = this.doc.getElementById('lbNext'); object2.style.display = ''; object2.onclick = function() { myLytebox.changeContent(myLytebox.activeImage + 1); return false; } } } else { if (this.navTypeHash['Display_by_type_' + this.navType]) { this.doc.getElementById('lbNext2_Off').style.display = ''; } } } this.enableKeyboardNav(); }; //https://hiddedevries.nl/en/blog/2017-01-29-using-javascript-to-trap-focus-in-an-element Lytebox.prototype.trapFocus = function (e) { //return; var element = this.doc.getElementById('lbDetailsContainer'); //var focusableEls = element.querySelectorAll('a:not([style*="display:none"]):not([style*="display: none"])'); //not working in IE8 var focusableEls = element.querySelectorAll('a'); var focusableElsVisible = new Array(); for (var i=0; i < focusableEls.length; i++) { //alert('"'+focusableEls[i].style.display+'"') if (focusableEls[i].style.display!=='none') focusableElsVisible.push(focusableEls[i]); } focusableEls = focusableElsVisible; //console.log(focusableEls) var firstFocusableEl = focusableEls[0]; var lastFocusableEl = focusableEls[focusableEls.length - 1]; console.log(document.activeElement) if(e == null) e = window.event; //for IE if ( e.shiftKey ) /* shift + tab */ { if (document.activeElement === firstFocusableEl || document.activeElement.id=='lbDetailsText' ) { if(document.activeElement.id=='lbDetailsText') focusableEls[1].focus(); else lastFocusableEl.focus(); e.preventDefault ? e.preventDefault() : event.returnValue = false; } } else /* tab */ { if (document.activeElement === lastFocusableEl) { firstFocusableEl.focus(); e.preventDefault ? e.preventDefault() : event.returnValue = false; } } } //Lytebox.prototype.enableKeyboardNav = function() { document.onkeydown = this.keyboardAction; }; Lytebox.prototype.enableKeyboardNav = function() { document.onkeydown = this.keyboardAction.bind(this) }; //https://piecioshka.pl/blog/2012/02/09/bind-obok-call-i-apply-jako-piekna-natura-jezyka.html //Lytebox.prototype.enableKeyboardNav = function() { var self = this; document.onkeydown = function(e){self.keyboardAction.call(self,e)}; }; Lytebox.prototype.disableKeyboardNav = function() { document.onkeydown = ''; }; Lytebox.prototype.keyboardAction = function(e,key2) { //console.log(this) var myLytebox = this; var keycode = null; var key = null; if( typeof key2 !== 'undefined') key = key2; else { keycode = (e == null) ? event.keyCode : e.which; key = String.fromCharCode(keycode).toLowerCase(); } //var kescape = (e == null) ? 27 : e.DOM_VK_ESCAPE; //nie moze byc samo escape, bo to nazwa funkcji w js; ale i tak nie wiem po co taki zapis //console.log(e,e.shiftKey) if ((key == 'x') || (key == 'c') || (keycode == 27)) { //abort myLytebox.end(); } else if (!myLytebox.wDone || !myLytebox.hDone) { //return; } else if ((key == 'p') || (keycode == 37)) { //previous if (myLytebox.isSlideshow) { if(myLytebox.activeSlide != 0) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeSlide - 1); } } else if (myLytebox.isLyteframe) { if(myLytebox.activeFrame != 0) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeFrame - 1); } } else { if(myLytebox.activeImage != 0) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeImage - 1); } } } else if ((key == 'n') || (keycode == 39)) { //next if (myLytebox.isSlideshow) { if(myLytebox.activeSlide != (myLytebox.slideArray.length - 1)) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeSlide + 1); } } else if (myLytebox.isLyteframe) { if(myLytebox.activeFrame != (myLytebox.frameArray.length - 1)) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeFrame + 1); } } else { if(myLytebox.activeImage != (myLytebox.imageArray.length - 1)) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeImage + 1); } } } else if ((key == 'r') || (key == 'R')) { //reload if (myLytebox.isSlideshow) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeSlide); } else if (myLytebox.isLyteframe) { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeFrame); } else { myLytebox.disableKeyboardNav(); myLytebox.changeContent(myLytebox.activeImage); } } else if ( (key == 'Tab') || (keycode == 9) ) { //TAB myLytebox.trapFocus(e); } }; Lytebox.prototype.preloadNeighborImages = function() { var preloadNextImage , preloadPrevImage; if (this.isSlideshow) { if ((this.slideArray.length - 1) > this.activeSlide) { preloadNextImage = new Image(); preloadNextImage.src = this.slideArray[this.activeSlide + 1][0]; } if(this.activeSlide > 0) { preloadPrevImage = new Image(); preloadPrevImage.src = this.slideArray[this.activeSlide - 1][0]; } } else { if ((this.imageArray.length - 1) > this.activeImage) { preloadNextImage = new Image(); preloadNextImage.src = this.imageArray[this.activeImage + 1][0]; } if(this.activeImage > 0) { preloadPrevImage = new Image(); preloadPrevImage.src = this.imageArray[this.activeImage - 1][0]; } } }; Lytebox.prototype.togglePlayPause = function(sHideId, sShowId) { if (this.isSlideshow && sHideId == "lbPause") { for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); } } //this.doc.getElementById('lbOuterContainer').focus(); this.doc.getElementById(sHideId).style.display = 'none'; this.doc.getElementById(sShowId).style.display = ''; //this.doc.getElementById(sShowId).focus(); setTimeout(function(){document.getElementById(sShowId).focus()},300); //to lepsze if (sHideId == "lbPlay") { this.isPaused = false; if (this.activeSlide == (this.slideArray.length - 1)) { if (this.loopSlideshow) { //this.changeContent(0); this.showContent(); } else if (this.autoEnd) { //this.end(); this.showContent(); } } else { //this.changeContent(this.activeSlide + 1); //this.changeContent(this.activeSlide); this.showContent(); } } else { this.isPaused = true; } }; Lytebox.prototype.end = function(sCaller) { var closeClick = (sCaller == 'slideshow' ? false : true); if (this.isSlideshow && this.isPaused && !closeClick) { return; } if (this.beforeEnd != '') { var callback = window[this.beforeEnd]; if (typeof callback === 'function') { if (!callback()) { return; } } } this.disableKeyboardNav(); document.body.onscroll = this.bodyOnscroll; // (07/20/2011) Restore last func for body.onscroll - fixed by A.Popov http://s3blog.org if (this.refreshPage) { // (07/20/2011) Refresh main page? - by A.Popov http://s3blog.org //this.doc.getElementById('lbOuterContainer').focus(); this.doc.getElementById('lbLoading').style.display = ''; //try{ this.doc.getElementById('lbLoading').focus(); }catch(e){ this.doc.getElementById('lbOuterContainer').focus() } try{ this.doc.getElementById('lbLoading').focus(); }catch(e){} this.doc.getElementById('lbImage').style.display = 'none'; this.doc.getElementById('lbIframe').style.display = 'none'; this.doc.getElementById('lbPrev').style.display = 'none'; this.doc.getElementById('lbNext').style.display = 'none'; this.doc.getElementById('lbIframeContainer').style.display = 'none'; this.doc.getElementById('lbDetailsContainer').style.display = 'none'; this.doc.getElementById('lbNumberDisplay').style.display = 'none'; this.refreshPage = false; var uri_href = top.location.href; var reg=/\#.*$/g; uri_href=uri_href.replace(reg, ""); top.location.href = uri_href; return; } //this.doc.getElementById('lbOuterContainer').focus(); //console.log(this) //console.log(this.slideArray) //console.log(this.activeSlide) //if (this.slideArray.length) this.slideArray[this.activeSlide][2].focus(); //else if (this.imageArray.length) this.imageArray[this.activeImage][2].focus(); ( this.isSlideshow ? this.slideArray[this.activeSlide][2] : (this.isLyteframe ? this.frameArray[this.activeFrame][2] : this.imageArray[this.activeImage][2]) ).focus(); //console.log("returned focus") //this.doc.getElementById('lbMain').style.display = 'none'; //OFF this.fade('lbOverlay', (this.doAnimations ? this.maxOpacity : 0)); this.toggleSelects('visible'); if (this.hideObjects) { this.toggleObjects('visible'); } this.doc.getElementById('lbOuterContainer').style.width = '200px'; this.doc.getElementById('lbOuterContainer').style.height = '200px'; this.doc.getElementById('lbMain').style.display = 'none'; //OFF if (this.isSlideshow) { for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); } } if (this.isLyteframe) { this.initialize(); this.doc.getElementById('lbIframe').src = 'about:blank'; } if (this.afterEnd != '') { var callback = window[this.afterEnd]; if (typeof callback === 'function') { callback(); } } this.STOPwatchOrientationChange(); this.STOPwatchZoomChange(); this.zooming = false; //reset (nie wiem czy potrzebne - musialbym przetestowac, na pewno nie zaszkodzi) this.Zooming = false; }; Lytebox.prototype.checkFrame = function() { if (window.name && window.parent.frames[window.name] && (parent.document.getElementsByTagName('frameset').length <= 0)) { this.isFrame = true; this.lytebox = "window.parent." + window.name + ".myLytebox"; this.doc = parent.document; } else { this.isFrame = false; this.lytebox = "myLytebox"; this.doc = document; } }; Lytebox.prototype.getPixelRate = function(iCurrent, iDim) { var diff = (iDim > iCurrent) ? iDim - iCurrent : iCurrent - iDim; if (diff <= 100) return 20; if (diff <= 200) return 30; if (diff <= 300) return 40; if (diff <= 400) return 50; if (diff <= 500) return 60; if (diff <= 600) return 70; if (diff <= 700) return 80; return 90; }; Lytebox.prototype.appear = function(sId, iOpacity) { var myLytebox = this; var object = this.doc.getElementById(sId).style; object.opacity = (iOpacity / 100); object.MozOpacity = (iOpacity / 100); object.KhtmlOpacity = (iOpacity / 100); object.filter = "alpha(opacity=" + (iOpacity + 10) + ")"; if (iOpacity == 100 && (sId == 'lbImage' || sId == 'lbIframe')) { try { object.removeAttribute("filter"); } catch(e) {} this.updateDetails(); } else if (iOpacity >= this.maxOpacity && sId == 'lbOverlay') { for (var i = 0; i < this.overlayTimerCount; i++) { window.clearTimeout(this.overlayTimerArray[i]); } return; } else if (iOpacity >= 100 && sId == 'lbDetailsContainer') { try { object.removeAttribute("filter"); } catch(e) {} for (var i = 0; i < this.imageTimerCount; i++) { window.clearTimeout(this.imageTimerArray[i]); } this.doc.getElementById('lbOverlay').style.height = this.getPageSize()[1] + "px"; //console.log(1,document.activeElement) //try{ this.doc.getElementById('lbBottomNav').focus(); }catch(e){} //try{ this.doc.getElementById('lbClose').focus(); }catch(e){} //try{ this.doc.getElementById('lbDetails').focus(); }catch(e){} try{ this.doc.getElementById('lbDetailsText').focus(); }catch(e){} //to //try{ this.doc.getElementById('lbDetailsContainer').focus(); }catch(e){} //try{ this.doc.getElementById('lbClose').focus(); }catch(e){} //try{ setTimeout(function(){document.getElementById('lbBottomNav').focus();},10) }catch(e){} //console.log(2,document.activeElement) } else { if (sId == 'lbOverlay') { //this.overlayTimerArray[this.overlayTimerCount++] = setTimeout("myLytebox.appear('" + sId + "', " + (iOpacity+10) + ")", 1); this.overlayTimerArray[this.overlayTimerCount++] = setTimeout( function(){myLytebox.appear(sId ,(iOpacity+10))}, 1); } else { //this.imageTimerArray[this.imageTimerCount++] = setTimeout("myLytebox.appear('" + sId + "', " + (iOpacity+10) + ")", 1); this.imageTimerArray[this.imageTimerCount++] = setTimeout( function(){myLytebox.appear(sId,(iOpacity+10))}, 1); } } }; Lytebox.prototype.fade = function(sId, iOpacity) { var myLytebox = this; var object = this.doc.getElementById(sId).style; object.opacity = (iOpacity / 100); object.MozOpacity = (iOpacity / 100); object.KhtmlOpacity = (iOpacity / 100); object.filter = "alpha(opacity=" + iOpacity + ")"; if (iOpacity <= 0) { try { object.display = 'none'; } catch(err) { } } else if (sId == 'lbOverlay') { //this.overlayTimerArray[this.overlayTimerCount++] = setTimeout("myLytebox.fade('" + sId + "', " + (iOpacity-20) + ")", 1); this.overlayTimerArray[this.overlayTimerCount++] = setTimeout(function(){myLytebox.fade(sId, (iOpacity-20))}, 1); } else { //this.timerIDArray[this.timerIDCount++] = setTimeout("myLytebox.fade('" + sId + "', " + (iOpacity-20) + ")", 1); this.timerIDArray[this.timerIDCount++] = setTimeout(function(){myLytebox.fade(sId, (iOpacity-20))}, 1); } }; Lytebox.prototype.resizeW = function(sId, iCurrentW, iMaxW, iPixelRate, iSpeed) { var myLytebox = this; if (!this.hDone) { //this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout("myLytebox.resizeW('" + sId + "', " + iCurrentW + ", " + iMaxW + ", " + iPixelRate + ")", 100); this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout(function(){myLytebox.resizeW(sId, iCurrentW, iMaxW, iPixelRate)}, 100); return; } var object = this.doc.getElementById(sId); var timer = iSpeed ? iSpeed : (this.resizeDuration/2); var newW = (this.doAnimations ? iCurrentW : iMaxW); object.style.width = (newW) + "px"; if (newW < iMaxW) { newW += (newW + iPixelRate >= iMaxW) ? (iMaxW - newW) : iPixelRate; } else if (newW > iMaxW) { newW -= (newW - iPixelRate <= iMaxW) ? (newW - iMaxW) : iPixelRate; } //this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout("myLytebox.resizeW('" + sId + "', " + newW + ", " + iMaxW + ", " + iPixelRate + ", " + (timer+0.02) + ")", timer+0.02); this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout(function(){myLytebox.resizeW(sId, newW, iMaxW, iPixelRate, (timer+0.02))}, timer+0.02); if (parseInt(object.style.width) == iMaxW) { this.wDone = true; for (var i = 0; i < this.resizeWTimerCount; i++) { window.clearTimeout(this.resizeWTimerArray[i]); } } }; Lytebox.prototype.resizeH = function(sId, iCurrentH, iMaxH, iPixelRate, iSpeed, pageSize) { var myLytebox = this; var timer = iSpeed ? iSpeed : (this.resizeDuration/2); var object = this.doc.getElementById(sId); var newH = (this.doAnimations ? iCurrentH : iMaxH); var wrapper = this.doc.getElementById('lbMain'); pageSize = pageSize || this.getPageSize(); var ps = (((pageSize[3] - newH) / 2) - 16); //bo potem dochodzi jeszcze dolny pasek z informacjami if( (document.all && document.all.item && !window.opera) || (!this.position_fixed_support) ) wrapper.style.top = (this.getPageScroll() + ps) + "px"; else wrapper.style.top = ps + "px"; object.style.height = (newH) + "px"; if (newH < iMaxH) { newH += (newH + iPixelRate >= iMaxH) ? (iMaxH - newH) : iPixelRate; } else if (newH > iMaxH) { newH -= (newH - iPixelRate <= iMaxH) ? (newH - iMaxH) : iPixelRate; } //this.resizeHTimerArray[this.resizeHTimerCount++] = setTimeout("myLytebox.resizeH('" + sId + "', " + newH + ", " + iMaxH + ", " + iPixelRate + ", " + (timer+.02) + ")", timer+.02); this.resizeHTimerArray[this.resizeHTimerCount++] = setTimeout( function(){ myLytebox.resizeH(sId, newH, iMaxH, iPixelRate, (timer+.02), pageSize); }, timer+.02); if (parseInt(object.style.height) == iMaxH) { this.hDone = true; for (var i = 0; i < this.resizeHTimerCount; i++) window.clearTimeout(this.resizeHTimerArray[i]); } }; Lytebox.prototype.getPageScroll = function() { if (self.pageYOffset) { return this.isFrame ? parent.pageYOffset : self.pageYOffset; } else if (this.doc.documentElement && this.doc.documentElement.scrollTop){ return this.doc.documentElement.scrollTop; } else if (document.body) { return this.doc.body.scrollTop; } }; Lytebox.prototype.getPageSize = function() { var xScroll, yScroll, windowWidth, windowHeight; if (window.innerHeight && window.scrollMaxY) { //xScroll = this.doc.scrollWidth; //nie wiem czy to jest błąd, czy może tak musi być xScroll = this.doc.body.scrollWidth; //nie powinno być tak? yScroll = (this.isFrame ? parent.innerHeight : self.innerHeight) + (this.isFrame ? parent.scrollMaxY : self.scrollMaxY); } else if (this.doc.body.scrollHeight > this.doc.body.offsetHeight){ xScroll = this.doc.body.scrollWidth; yScroll = this.doc.body.scrollHeight; } else { xScroll = this.doc.getElementsByTagName("html").item(0).offsetWidth; yScroll = this.doc.getElementsByTagName("html").item(0).offsetHeight; xScroll = (xScroll < this.doc.body.offsetWidth) ? this.doc.body.offsetWidth : xScroll; yScroll = (yScroll < this.doc.body.offsetHeight) ? this.doc.body.offsetHeight : yScroll; } if (self.innerHeight) { windowWidth = (this.isFrame) ? parent.innerWidth : self.innerWidth; windowHeight = (this.isFrame) ? parent.innerHeight : self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode windowWidth = this.doc.documentElement.clientWidth; windowHeight = this.doc.documentElement.clientHeight; } else if (document.body) { windowWidth = this.doc.getElementsByTagName("html").item(0).clientWidth; windowHeight = this.doc.getElementsByTagName("html").item(0).clientHeight; windowWidth = (windowWidth == 0) ? this.doc.body.clientWidth : windowWidth; windowHeight = (windowHeight == 0) ? this.doc.body.clientHeight : windowHeight; } var pageHeight = (yScroll < windowHeight) ? windowHeight : yScroll; var pageWidth = (xScroll < windowWidth) ? windowWidth : xScroll; //alert(pageWidth +'\n'+ pageHeight +'\n'+ windowWidth +'\n'+ windowHeight +'\n\n'+ screen.availWidth +'\n'+ screen.availHeight ); //return new Array(pageWidth, pageHeight, screen.availWidth, screen.availHeight); //problem z wysrodkowaniem sie pojawia return new Array(pageWidth, pageHeight, windowWidth, windowHeight, screen.availWidth, screen.availHeight); }; Lytebox.prototype.toggleObjects = function(sState) { var objects = this.doc.getElementsByTagName("object"); for (var i = 0; i < objects.length; i++) { objects[i].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } var embeds = this.doc.getElementsByTagName("embed"); for (var i = 0; i < embeds.length; i++) { embeds[i].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } if (this.isFrame) { for (var i = 0; i < parent.frames.length; i++) { try { objects = parent.frames[i].window.document.getElementsByTagName("object"); for (var j = 0; j < objects.length; j++) { objects[j].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } } catch(e) { } try { embeds = parent.frames[i].window.document.getElementsByTagName("embed"); for (var j = 0; j < embeds.length; j++) { embeds[j].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } } catch(e) { } } } }; Lytebox.prototype.toggleSelects = function(sState) { var selects = this.doc.getElementsByTagName("select"); for (var i = 0; i < selects.length; i++ ) { selects[i].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } if (this.isFrame) { for (var i = 0; i < parent.frames.length; i++) { try { selects = parent.frames[i].window.document.getElementsByTagName("select"); for (var j = 0; j < selects.length; j++) { selects[j].style.visibility = (sState == "hide") ? 'hidden' : 'visible'; } } catch(e) { } } } }; Lytebox.prototype.pause = function(iMillis) { var now = new Date(); var exitTime = now.getTime() + iMillis; while (true) { now = new Date(); if (now.getTime() > exitTime) { return; } } }; Lytebox.prototype.combine = function(aAnchors, aAreas) { var lyteLinks = []; for (var i = 0; i < aAnchors.length; i++) { lyteLinks.push(aAnchors[i]); } for (var i = 0; i < aAreas.length; i++) { lyteLinks.push(aAreas[i]); } return lyteLinks; }; Lytebox.prototype.removeDuplicates = function (aArray) { for (var i = 1; i < aArray.length; i++) { if (aArray[i][0] == aArray[i-1][0]) { aArray.splice(i,1); } } return aArray; }; Lytebox.prototype.printWindow = function () { var myLytebox = this; var w = 400; var h = 300; var left = parseInt((screen.availWidth/2) - (w/2)); var top = parseInt((screen.availHeight/2) - (h/2)); var wOpts = "width=" + w + ",height=" + h + ",left=" + left + ",top=" + top + "screenX=" + left + ",screenY=" + top + "directories=0,location=0,menubar=0,resizable=0,scrollbars=0,status=0,titlebar=0,toolbar=0"; var d = new Date(); var wName = 'Print' + d.getTime(); var wUrl = document.getElementById(this.printId).src; this.wContent = window.open(wUrl, wName, wOpts); this.wContent.focus(); //var t = setTimeout("myLytebox.printContent()",1000); var t = setTimeout(function(){myLytebox.printContent()},1000); }; Lytebox.prototype.printContent = function() { var myLytebox = this; if (this.wContent.document.readyState == 'complete') { this.wContent.print(); this.wContent.close(); this.wContent = null; } else { //var t = setTimeout("myLytebox.printContent()",1000); var t = setTimeout(function(){myLytebox.printContent()},1000); } }; Lytebox.prototype.setOptions = function(sOptions) { this.hideObjects = this.__hideObjects; this.autoResize = this.__autoResize; this.doAnimations = this.__doAnimations; this.forceCloseClick = this.__forceCloseClick; this.refreshPage = this.__refreshPage; this.showPrint = this.__showPrint; this.navType = this.__navType; this.beforeStart = this.__beforeStart; this.afterStart = this.__afterStart this.beforeEnd = this.__beforeEnd; this.afterEnd = this.__afterEnd; this.scrollbars = this.__scrollbars; this.width = this.__width; this.height = this.__height; this.slideInterval = this.__slideInterval; this.showNavigation = this.__showNavigation; this.showClose = this.__showClose; this.showDetails = this.__showDetails; this.showPlayPause = this.__showPlayPause; this.autoEnd = this.__autoEnd; this.pauseOnNextClick = this.__pauseOnNextClick; this.pauseOnPrevClick = this.__pauseOnPrevClick; this.loopSlideshow = this.__loopSlideshow; this.autostartSlideshow = this.__autostartSlideshow; var sValue; var sName = sValue = ''; var aSetting = null; var aOptions = sOptions.split(' '); for (var i = 0; i < aOptions.length; i++) { aSetting = aOptions[i].split(':'); sName = (aSetting.length > 1 ? String(aSetting[0]).trim().toLowerCase() : ''); sValue = (aSetting.length > 1 ? String(aSetting[1]).trim() : ''); switch(sName) { case 'hideobjects': this.hideObjects = (/true|false/.test(sValue) ? (sValue == 'true') : this.__hideObjects); break; case 'autoresize': this.autoResize = (/true|false/.test(sValue) ? (sValue == 'true') : this.__autoResize); break; case 'doanimations': this.doAnimations = (/true|false/.test(sValue) ? (sValue == 'true') : this.__doAnimations); break; case 'forcecloseclick': this.forceCloseClick = (/true|false/.test(sValue) ? (sValue == 'true') : this.__forceCloseClick); break; case 'refreshpage': this.refreshPage = (/true|false/.test(sValue) ? (sValue == 'true') : this.__refreshPage); break; case 'showprint': this.showPrint = (/true|false/.test(sValue) ? (sValue == 'true') : this.__showPrint); break; case 'navtype': this.navType = (/[1-3]{1}/.test(sValue) ? parseInt(sValue) : this.__navType); break; case 'beforestart': this.beforeStart = (sValue != '' ? sValue : this.__beforeStart); break; case 'afterstart': this.afterStart = (sValue != '' ? sValue : this.__afterStart); break; case 'beforeend': this.beforeEnd = (sValue != '' ? sValue : this.__beforeEnd); break; case 'afterend': this.afterEnd = (sValue != '' ? sValue : this.__afterEnd); break; case 'scrollbars': this.scrollbars = (/auto|yes|no/.test(sValue) ? sValue : this.__scrollbars); break; case 'width': this.width = (/\d(%|px|)/.test(sValue) ? sValue : this.__width); break; case 'height': this.height = (/\d(%|px|)/.test(sValue) ? sValue : this.__height); break; case 'slideinterval': this.slideInterval = (/\d/.test(sValue) ? parseInt(sValue) : this.__slideInterval); break; case 'shownavigation': this.showNavigation = (/true|false/.test(sValue) ? (sValue == 'true') : this.__showNavigation); break; case 'showclose': this.showClose = (/true|false/.test(sValue) ? (sValue == 'true') : this.__showClose); break; case 'showdetails': this.showDetails = (/true|false/.test(sValue) ? (sValue == 'true') : this.__showDetails); break; case 'showplaypause': this.showPlayPause = (/true|false/.test(sValue) ? (sValue == 'true') : this.__showPlayPause); break; case 'autoend': this.autoEnd = (/true|false/.test(sValue) ? (sValue == 'true') : this.__autoEnd); break; case 'pauseonnextclick': this.pauseOnNextClick = (/true|false/.test(sValue) ? (sValue == 'true') : this.__pauseOnNextClick); break; case 'pauseonprevclick': this.pauseOnPrevClick = (/true|false/.test(sValue) ? (sValue == 'true') : this.__pauseOnPrevClick); break; case 'loopslideshow': this.loopSlideshow = (/true|false/.test(sValue) ? (sValue == 'true') : this.__loopSlideshow); break; case 'autostartslideshow': this.autostartSlideshow = (/true|false/.test(sValue) ? (sValue == 'true') : this.__autostartSlideshow); break; } } }; Lytebox.prototype.detectOrientation = function() { if( typeof window.orientation != 'undefined' ) return window.orientation; else if(window.matchMedia) { var orientation; var mql = window.matchMedia("(orientation: portrait)"); if( mql.matches ) orientation = 'portrait'; else orientation = 'landscape'; return orientation; } else return null; }; Lytebox.prototype.checkOrientation = function(myLytebox) { //var myLytebox = this; //console.log(myLytebox) var currentOrientation = myLytebox.detectOrientation(); if( currentOrientation !== myLytebox.Orientation ) { //console.log('The Orientation of the srceen has been changed (to '+currentOrientation+')'); //alert('The Orientation of the srceen has been changed (to '+currentOrientation+')'); myLytebox.Orientation = currentOrientation; //var pageSize1 = myLytebox.getPageSize(); var pageSize1 = myLytebox.PageSize; var delayChecking = function(){ var pageSize2 = myLytebox.getPageSize(); //alert(pageSize1+'\n'+pageSize2) if( pageSize1[0] != pageSize2[0] ) { myLytebox.PageSize = pageSize2; //myLytebox.keyboardAction(null,'r') //setTimeout("myLytebox.changeContent(myLytebox.activeSlide)", 400); //setTimeout("myLytebox.keyboardAction(null,'r')", 400); setTimeout(function(){myLytebox.keyboardAction(null,'r')}, 100); } else setTimeout(delayChecking,100); } setTimeout(delayChecking,100); } }; Lytebox.prototype.watchOrientationChange = function() { var myLytebox = this; if( window.addEventListener ) if( typeof window.orientation != 'undefined' ) //window.addEventListener("orientationchange", myLytebox.checkOrientation, false); // Listen for orientation changes window.addEventListener("orientationchange", myLytebox.checkOrientation_handler = function(){myLytebox.checkOrientation(myLytebox)}, false); // Listen for orientation changes else //window.addEventListener("resize", myLytebox.checkOrientation, false); // Listen for resize changes window.addEventListener("resize", myLytebox.checkOrientation_handler = function(){myLytebox.checkOrientation(myLytebox)}, false); // Listen for resize changes }; Lytebox.prototype.STOPwatchOrientationChange = function() { var myLytebox = this; if( window.removeEventListener ) if( typeof window.orientation != 'undefined' ) window.removeEventListener("orientationchange", myLytebox.checkOrientation_handler, false); // Stop Listen for orientation changes else window.removeEventListener("resize", myLytebox.checkOrientation_handler, false); // Stop Listen for resize changes }; Lytebox.prototype.FixedToAbsolute = function() { var myLytebox = this; if(!myLytebox.Zooming) { myLytebox.Zooming = true; var object = document.getElementById('lbMain'); //if(false) if( object.style.position == "fixed" ) { var pageSize = myLytebox.getPageSize(); var contentHeight = document.getElementById('lbOuterContainer').offsetHeight; //var ps = (pageSize[3] / 100); //top var ps = (pageSize[3] - contentHeight) / 2; //middle object.style.top = (myLytebox.getPageScroll() + ps) + "px"; object.style.position = "absolute"; } } }; Lytebox.prototype.AbsoluteToFixed = function() { var myLytebox = this; if(myLytebox.Zooming) { //if was modified back to previous state myLytebox.Zooming = false; if( !( (document.all && document.all.item && !window.opera) || (!myLytebox.position_fixed_support) ) ) { var pageSize = myLytebox.getPageSize(); var contentHeight = document.getElementById('lbOuterContainer').offsetHeight; //var ps = (pageSize[3] / 100); //top var ps = (pageSize[3] - contentHeight) / 2; //middle var object = myLytebox.doc.getElementById('lbMain'); object.style.top = ps + "px"; object.style.position = "fixed"; } } }; Lytebox.prototype.detectZoom = function() { var Zoom = window.devicePixelRatio; //dziala w desktopowych (nie na mobilnych) //console.log(Zoom); //var pageSize = myLytebox.getPageSize(); //moze z tego cos //console.log(pageSize); //alert(pageSize[3]) return Zoom; }; Lytebox.prototype.checkZoom = function() { //console.log(this) //alert(2) var myLytebox = this; //return; var currentZoom = myLytebox.detectZoom(); //alert(currentZoom) //return; //console.log('zoom', currentZoom); //alert('zoom: '+ currentZoom); //console.log(myLytebox.Zoom,currentZoom) if( currentZoom !== myLytebox.Zoom ) { //myLytebox.Zoom = currentZoom; //alert('The Zoom of the srceen has been changed') myLytebox.FixedToAbsolute(); } else myLytebox.AbsoluteToFixed(); }; Lytebox.prototype.watchZoomChange = function() { var myLytebox = this; //brakuje takiego eventy, ktory reagowal by na pinch zoom (resize nie reaguje) if( window.addEventListener ) //window.addEventListener("resize", myLytebox.checkZoom, false); // Listen for resize changes window.addEventListener("resize", myLytebox.checkZoom_handler = function(){myLytebox.checkZoom.call(myLytebox)}, false); // Listen for resize changes }; Lytebox.prototype.STOPwatchZoomChange = function() { var myLytebox = this; if( window.removeEventListener ) //window.removeEventListener("resize", myLytebox.checkZoom, false); // Stop Listen for resize changes window.removeEventListener("resize", myLytebox.checkZoom_handler, false); // Stop Listen for resize changes }; /* Lytebox.prototype.isMobile = function() { var ua = navigator.userAgent; return (ua.match(/ipad/i) != null) || (ua.match(/ipod/i) != null) || (ua.match(/iphone/i) != null) || (ua.match(/android/i) != null) || (ua.match(/opera mini/i) != null) || (ua.match(/blackberry/i) != null) || (ua.match(/(pre\/|palm os|palm|hiptop|avantgo|plucker|xiino|blazer|elaine)/i) != null) || (ua.match(/(iris|3g_t|windows ce|opera mobi|windows ce; smartphone;|windows ce; iemobile)/i) != null) || (ua.match(/(mini 9.5|vx1000|lge |m800|e860|u940|ux840|compal|wireless| mobi|ahong|lg380|lgku|lgu900|lg210|lg47|lg920|lg840|lg370|sam-r|mg50|s55|g83|t66|vx400|mk99|d615|d763|el370|sl900|mp500|samu3|samu4|vx10|xda_|samu5|samu6|samu7|samu9|a615|b832|m881|s920|n210|s700|c-810|_h797|mob-x|sk16d|848b|mowser|s580|r800|471x|v120|rim8|c500foma:|160x|x160|480x|x640|t503|w839|i250|sprint|w398samr810|m5252|c7100|mt126|x225|s5330|s820|htil-g1|fly v71|s302|-x113|novarra|k610i|-three|8325rc|8352rc|sanyo|vx54|c888|nx250|n120|mtk |c5588|s710|t880|c5005|i;458x|p404i|s210|c5100|teleca|s940|c500|s590|foma|samsu|vx8|vx9|a1000|_mms|myx|a700|gu1100|bc831|e300|ems100|me701|me702m-three|sd588|s800|8325rc|ac831|mw200|brew |d88|htc\/|htc_touch|355x|m50|km100|d736|p-9521|telco|sl74|ktouch|m4u\/|me702|8325rc|kddi|phone|lg |sonyericsson|samsung|240x|x320|vx10|nokia|sony cmd|motorola|up.browser|up.link|mmp|symbian|smartphone|midp|wap|vodafone|o2|pocket|kindle|mobile|psp|treo)/i) != null); }; */ //function initLytebox() { myLytebox = new Lytebox(); } // "myLytebox" is reserved for this script and must be global - teraz już nie musi, bo przerobiłem skrypt //function initLytebox() { var myLytebox = new Lytebox(); } //tu już nie musi być globalna function initLytebox() { new Lytebox(); } //tu już nie jest potrzebna żadna zmienna //start as soon as DOM will be ready if( document.addEventListener ) { //Mozilla, Opera, Webkit document.addEventListener( "DOMContentLoaded", function(){ //document.removeEventListener( "DOMContentLoaded", arguments.callee, false); //odwolanie nasluchu, tylko czy nie bedzie kolidowac z innym pluginem i po co w ogole ktos to dal initLytebox(); //wlasciwa funkcja }, false ); } else if ( document.attachEvent ) { //IE document.attachEvent("onreadystatechange", function(){ if( document.readyState === "complete" ) //if( document.readyState === "interactive" ) //ten wczesniej dziala //if( document.readyState === "interactive" || document.readyState === "complete" ) { //document.detachEvent( "onreadystatechange", arguments.callee ); //odwolanie nasluchu, tylko po co initLytebox(); } } ); } //else //jak jakas stara przegladarka //window.onload = function(){ initLytebox(); } //ale moze uniemozliwic innemu pluginowi start //setTimeout( function(){ initLytebox(); } , 2000 ); //troche bezpieczniejsze //ADDON function Swipe_for_LyteBox(myLytebox) { //return; // TOUCH-EVENTS SINGLE-FINGER SWIPE-SENSING JAVASCRIPT // http://padilicious.com/code/touchevents/ // *** this function need global variable "myLytebox" *** - JUŻ TERAZ NIE !! var minLength = 92; // the shortest distance the user may swipe var fingerCount, startX, startY, curX, curY; var callBack = null; function fTouchStart(event) { fingerCount = event.isPrimary || event.touches.length; // check if it's the first touch or get the total number of fingers touching the screen //if( fingerCount==true || fingerCount == 1 ) if( fingerCount == 1 ) //true to tez 1 przy porownywaniu == (bo przy === nie zadziala) { // get the coordinates of the touch startX = curX = event.pageX || event.touches[0].pageX; startY = curY = event.pageY || event.touches[0].pageY; } } function fTouchMove(event) { //if( window.navigator.msPointerEnabled && (event.pointerType=='mouse' || event.pointerType==4) ) return; //eliminacja myszy if( window.navigator.msPointerEnabled && ((event.pointerType=='mouse' || event.pointerType==4) && event.buttons!=1) ) return; //for WindowsPhone: only if the mouse button is held down while the user is moving the mouse we are going to continue //if( event.scale != 1.0 ) // iOS //if( event.isPrimary || event.touches.length == 1 ) // i tak najpierw jest touchstart if( fingerCount == 1 ) { //if(!myLytebox.zooming) //event.preventDefault(); //prevent from scrolling (nie wszystkie tego potrzebuja) - zastanowić się nad tym curX = event.pageX || event.touches[0].pageX; curY = event.pageY || event.touches[0].pageY; } //return; //else //if(false) //if(!myLytebox.position_fixed_support) //if( event.touches.length == 2 ) //starsze przegladraki lub systemy moga nie odczytywac wartosci innej niz 1 //if( (!myLytebox.zooming) && (event.touches.length == 2 || (event.scale && event.scale!=1.0) || (event.originalEvent && event.originalEvent.scale!=1.0) || !myLytebox.position_fixed_support) ) if( (!myLytebox.zooming) && ( (event.scale && event.scale!=1.0) || (event.originalEvent && event.originalEvent.scale!=1.0) || !myLytebox.position_fixed_support) ) { //alert(1) //if(!myLytebox.zooming) { myLytebox.zooming = true; var object = document.getElementById('lbMain'); //if(false) if( object.style.position == "fixed" ) { var pageSize = myLytebox.getPageSize(); var contentHeight = document.getElementById('lbOuterContainer').offsetHeight; //var ps = (pageSize[3] / 100); //top var ps = (pageSize[3] - contentHeight) / 2; //middle object.style.top = (myLytebox.getPageScroll() + ps) + "px"; object.style.position = "absolute"; } } } /* else if( window.navigator.msPointerEnabled ) //nie wiem jak wykryc w IE gest powiekszania, ale moze mozna przesuwac obraz dwoma palcami (przynajmniej na niektorych laptopach) { //https://msdn.microsoft.com/en-us/library/windows/apps/hh441180.aspx (MSGestureEvent object) //https://msdn.microsoft.com/en-us/library/windows/apps/hh771898.aspx //alert('pinch zoom detected') var object = document.getElementById('lbOuterContainer'); object.setAttribute("style","-ms-touch-action: manipulation;"); //object.style.msTouchAction = "manipulation"; //"pan-x pan-y pinch-zoom" (a moze lepiej "auto"?) // potem trzeba gdzies to odkrecic (chociaz niekoniecznie - patrz wyzej) } */ } function fTouchEnd(event) { //if( (fingerCount===true || fingerCount == 1) && ( (curX-startX)!=0 || (curY-startY)!=0 ) ) if( (fingerCount == 1) && ( (curX-startX)!=0 || (curY-startY)!=0 ) ) { var swipeLength = Math.round(Math.sqrt(Math.pow(curX - startX,2) + Math.pow(curY - startY,2))); // use the Distance Formula to determine the length of the swipe //console.log('swipeLength:',swipeLength) //alert(swipeLength) if( swipeLength >= minLength ) // if the user swiped more than the minimum length { var swipeAngle = caluculateAngle(); var swipeDirection = determineSwipeDirection(swipeAngle); if(callBack) callBack(swipeDirection,swipeLength); } } //fTouchCancel(event); // reset the variables (nie ma takiej koniecznosci) } function fTouchCancel(event) { // reset the variables fingerCount = startX = startY = curX = curY = 0; } function caluculateAngle() { var X = startX-curX; var Y = curY-startY; var Z = Math.round(Math.sqrt(Math.pow(X,2)+Math.pow(Y,2))); //the distance - rounded - in pixels var r = Math.atan2(Y,X); //angle in radians (Cartesian system) var swipeAngle = Math.round(r*180/Math.PI); //angle in degrees if( swipeAngle < 0 ) swipeAngle = 360 - Math.abs(swipeAngle); return swipeAngle; } function determineSwipeDirection(swipeAngle) { var swipeDirection; if ( swipeAngle>=0 && swipeAngle<=45 ) swipeDirection = 'left'; else if ( swipeAngle>45 && swipeAngle<135 ) swipeDirection = 'down'; else if ( swipeAngle>=135 && swipeAngle<=225 ) swipeDirection = 'right'; else if ( swipeAngle>=315 && swipeAngle<=360 ) swipeDirection = 'left'; else swipeDirection = 'up'; return swipeDirection; } function fWatchForSwipe(element,callback1) { callBack = callback1 || null; var swipeElement = (typeof element == 'string')? document.getElementById(element):element; if( swipeElement ) if(document.addEventListener) { var evStart = window.navigator.msPointerEnabled? "MSPointerDown" : "touchstart"; var evMove = window.navigator.msPointerEnabled? "MSPointerMove" : "touchmove"; var evEnd = window.navigator.msPointerEnabled? "MSPointerUp" : "touchend"; var evCancel = window.navigator.msPointerEnabled? "MSPointerCancel" : "touchcancel"; //swipeElement.addEventListener(evStart, function(event){ fTouchStart(event,this.id) } ); swipeElement.addEventListener(evStart, fTouchStart ); swipeElement.addEventListener(evMove, fTouchMove ); swipeElement.addEventListener(evEnd, fTouchEnd ); swipeElement.addEventListener(evCancel,fTouchCancel ); } } return { //mTouchStart : fTouchStart, //mTouchEnd : fTouchEnd, //mTouchMove : fTouchMove, //mTouchCancel : fTouchCancel, WatchSwipe : fWatchForSwipe }; } //end of Swipe function