//滚动切换 SlideShow = function(slideShowId, recordCount, imageWidth, imageHeight, imageLazyLoading, verticalScroll, speed, manualSwitch, switchByKey, autoScaling) { this.slideShowId = slideShowId; this.recordCount = recordCount; this.imageWidth = imageWidth; this.imageHeight = imageHeight; this.imageLazyLoading = imageLazyLoading; imageLazyLoading=false; // this.verticalScroll = verticalScroll; this.speed = speed; this.manualSwitch = manualSwitch; this.needScaling = autoScaling && !imageLazyLoading; this.scrollIndex = 0; //当前记录 this.pageElement = document.getElementById("slideShow_" + this.slideShowId); this.contentDiv = DomUtils.getElement(this.pageElement, 'div', 'contentDiv'); this.recordsTable = DomUtils.getElement(this.pageElement, "table", "records"); //获取控制栏 this.controlBar = DomUtils.getElement(this.pageElement, null, "controlBar"); //获取控制栏边距 this.controlBarLeft = this.controlBar.style.left; this.controlBarTop = this.controlBar.style.top; this.controlBarRight = this.controlBar.style.right; this.controlBarBottom = this.controlBar.style.bottom; //获取控制栏记录容器 var selectedRecord = DomUtils.getElement(this.controlBar, null, "selectedRecord_0"); if(selectedRecord) { this.controlBarRecordsContainer = selectedRecord.parentNode.parentNode; //获取尺寸 this.controlBarRecordsContainerSize = CssUtils.getStyle(this.controlBarRecordsContainer.style.cssText, this.verticalScroll ? "height" : "width") || "100%"; //获取overflow样式 this.controlBarRecordsContainerOverflow = CssUtils.getElementComputedStyle(this.controlBarRecordsContainer, this.verticalScroll ? "overflow-y" : "overflow-x"); } this.appendSlideShowList(); //添加到列表 var slideShow = this; if(!this.needScaling) { //不需要自动调整尺寸 this._resizeControlBar(); //重置控制栏大小 } else { this._scaling(); EventUtils.addEvent(window, 'resize', function() { slideShow._scaling(); }); EventUtils.addEvent(window, 'load', function() { slideShow._scaling(true); }); } //创建滚动条 this.scroller = new Scroller(this.contentDiv, !this.verticalScroll, this.verticalScroll, false, false, false, true); this.scroller.onAfterScroll = function(x, y, isLeft, isRight, isTop, isBottom, touchEnd) { var index = slideShow.scrollIndex; if(slideShow.verticalScroll) { if(Math.abs(y) > slideShow.imageHeight/5) { //超过1/5 index += y<0 ? -1 : 1; } } else { if(Math.abs(x) > slideShow.imageWidth/5) { //超过1/5 index += x<0 ? -1 : 1; } } slideShow._slide(index==-1 ? slideShow.recordCount-1 : (index==slideShow.recordCount ? 0 : index)); }; if(switchByKey) { //方向键翻阅 EventUtils.addEvent(document, "keydown", function(event) { if(event.keyCode==37) { SlideShow.slideToNextImage(slideShowId, false); } else if(event.keyCode==39) { SlideShow.slideToNextImage(slideShowId, true); } }); } this.startAutoSwitch(); //启动切换 }; SlideShow.prototype._resizeControlBar = function() { //重置控制栏大小 try { if(this.pageElement.parentNode.offsetWidth==0) { if(this.resizeControlBarTimer) { return; } var slideShow = this; this.resizeControlBarTimer = window.setInterval(function() { slideShow._resizeControlBar(); }, 30); return; } if(this.resizeControlBarTimer) { window.clearInterval(this.resizeControlBarTimer); this.resizeControlBarTimer = null; } var imgs = this.controlBar.getElementsByTagName('img'); if(!imgs[0] || !imgs[0].src || imgs[0].src.indexOf('_breviary_')==-1) { //控制栏中没有缩略图 return; } //获取区域宽度或高度 var areaSize; if(!this.verticalScroll) { //水平滚动 areaSize = this.imageWidth ? this.imageWidth : (this.pageElement.rows.length==1 ? this.getMinImageSize().width : Number(this.contentDiv.parentNode.width.replace('px', ''))); if(isNaN(areaSize) || areaSize<=0) { return; } this.controlBarRecordsContainer.style.width = ''; areaSize -= this.controlBar.offsetWidth - this.controlBarRecordsContainer.offsetWidth; if(this.controlBarLeft.indexOf('px')!=-1) { areaSize -= Number(this.controlBarLeft.replace('px', '')); } if(this.controlBarRight.indexOf('px')!=-1) { areaSize -= Number(this.controlBarRight.replace('px', '')); } } else { //垂直方向滚动 areaSize = this.imageHeight>0 ? this.imageHeight : this.getMinImageSize().height; if(areaSize<=0) { return; } this.controlBarRecordsContainer.style.height = ''; areaSize -= this.controlBar.offsetHeight - this.controlBarRecordsContainer.offsetHeight; if(this.controlBarTop.indexOf('px')!=-1) { areaSize -= Number(this.controlBarTop.replace('px', '')); } if(this.controlBarBottom.indexOf('px')!=-1) { areaSize -= Number(this.controlBarBottom.replace('px', '')); } } var size = this.controlBarRecordsContainerSize; if(size.indexOf('%')!=-1) { size = areaSize * Number(size.replace(/%/, '')) / 100; } else { size = Number(size.replace(/px/, '')); } if(this.controlBarRecordsContainerOverflow=='hidden' || this.controlBarRecordsContainerOverflow=='auto') { //允许滚动 eval('this.controlBarRecordsContainer.style.' + (this.verticalScroll ? 'height' : 'width') + '= size + "px";'); return; } if(this.controlBarRecordsContainer.style.display=='none') { return; } var distance = (this.verticalScroll ? this.controlBarRecordsContainer.offsetHeight : this.controlBarRecordsContainer.offsetWidth) - size; if(!this.controlBarResized && distance<=0) { return; } this.controlBarResized = true; distance = Math.round(distance/this.recordCount); for(var i=0; i0 && (size.width==0 || width0 && (size.height==0 || height100 ? 10 : 5; step = step / loop; var count = 0; var timer = window.setInterval(function() { if((++count)= this.controlBarRecordsContainer.scrollHeight; } else { isScrollBegin = this.controlBarRecordsContainer.scrollLeft==0; isScrollEnd = this.controlBarRecordsContainer.scrollLeft + this.controlBarRecordsContainer.offsetWidth >= this.controlBarRecordsContainer.scrollWidth; } var previousPageButton = DomUtils.getElement(this.controlBar, null, 'previousPageButton'); if(previousPageButton) { if(isScrollBegin) { CssUtils.setGray(previousPageButton); } else { CssUtils.removeGray(previousPageButton); } } var nextPageButton = DomUtils.getElement(this.controlBar, null, 'nextPageButton'); if(nextPageButton) { if(isScrollEnd) { CssUtils.setGray(nextPageButton); } else { CssUtils.removeGray(nextPageButton); } } }; SlideShow.prototype.startAutoSwitch = function() { //启动自动切换 if(!this.manualSwitch) { //不是手动切换 var slideShow = this; this.scrollTimerId = window.setInterval(function() { slideShow._slide(slideShow.scrollIndex < slideShow.recordCount-1 ? slideShow.scrollIndex + 1 : 0); }, this.speed); //定时切换 } }; SlideShow.prototype.stopAutoSwitch = function() { //停止自动切换 if(this.scrollTimerId) { window.clearInterval(this.scrollTimerId); } }; SlideShow.prototype.appendSlideShowList = function() { //添加到列表 for(var i=0; i<(window.slideShowList ? window.slideShowList.length : 0); i++) { if(window.slideShowList[i].id==this.slideShowId) { window.slideShowList[i].slideShow = this; return; } } if(!window.slideShowList) { window.slideShowList = []; } window.slideShowList[window.slideShowList.length] = {id:this.slideShowId, slideShow:this}; }; SlideShow._getSlideShow = function(slideShowId) { //获取SlideShow对象 for(var i=0; i<(window.slideShowList ? window.slideShowList.length : 0); i++) { if(window.slideShowList[i].id==slideShowId) { return window.slideShowList[i].slideShow; } } }; SlideShow.slide = function(slideShowId, index) { //切换记录 var slideShow = SlideShow._getSlideShow(slideShowId); if(slideShow) { slideShow._slide(index); } }; SlideShow.openLink = function(slideShowId, index) { //打开链接 var slideShow = SlideShow._getSlideShow(slideShowId); if(slideShow) { slideShow.openLink(index); } }; SlideShow.showNextPreviousButton = function(slideShowId, show, src, event) { //显示或者隐藏“上一图片”“下一图片”按钮 var slideShow = SlideShow._getSlideShow(slideShowId); if(!slideShow) { return; } var showPreviousImageButton = show, showNextImageButton = show; if(show) { var pos = DomUtils.getAbsolutePosition(src, null, true); showPreviousImageButton = event.clientX < pos.left + src.offsetWidth / 2; showNextImageButton = !showPreviousImageButton; } var previousImageButton = DomUtils.getElement(slideShow.pageElement, 'div', 'previousImageButton'); if(previousImageButton) { previousImageButton.style.visibility = showPreviousImageButton ? 'visible' : 'hidden'; } var nextImageButton = DomUtils.getElement(slideShow.pageElement, 'div', 'nextImageButton'); if(nextImageButton) { nextImageButton.style.visibility = showNextImageButton ? 'visible' : 'hidden'; } }; SlideShow.onClickImage = function(slideShowId, imageClickAction, src, event) { //点击图片 var slideShow = SlideShow._getSlideShow(slideShowId); if(slideShow.controlBar && slideShow.controlBar.contains(event.srcElement)) { return; } if(imageClickAction=="nextImage") { SlideShow.slideToNextImage(slideShowId, true); } else { var pos = DomUtils.getAbsolutePosition(src, null, true); SlideShow.slideToNextImage(slideShowId, (event.clientX ? event.clientX : event.x) >= pos.left + src.offsetWidth / 2); } }; SlideShow.slideToNextImage = function(slideShowId, next) { //切换上一图片或者下一图片 var slideShow = SlideShow._getSlideShow(slideShowId); if(!slideShow) { return; } if(next && slideShow.scrollIndex < slideShow.recordCount-1) { slideShow._slide(slideShow.scrollIndex + 1); } else if(!next && slideShow.scrollIndex > 0) { slideShow._slide(slideShow.scrollIndex - 1); } }; SlideShow.gotoPage = function(slideShowId, next) { //翻页 var slideShow = SlideShow._getSlideShow(slideShowId); if(!slideShow) { return; } if(slideShow.verticalScroll) { slideShow.controlBarRecordsContainer.scrollTop += (next ? 1 : -1) * slideShow.controlBarRecordsContainer.offsetHeight; } else { slideShow.controlBarRecordsContainer.scrollLeft += (next ? 1 : -1) * slideShow.controlBarRecordsContainer.offsetWidth; } slideShow.controlBarRecordsContainer.style.overflow = "auto"; slideShow.controlBarRecordsContainer.style.overflow = "hidden"; slideShow._setPagingButtonState(); }; //滚动图片：头尾衔接 JoinScrollMarquee = function(marqueeElenent, marqueeContentElement, scrollAmount, speed) { this.marqueeElenent = marqueeElenent; this.marqueeContentElement = marqueeContentElement; this.scrollAmount = scrollAmount; this.speed = speed; var joinScrollMarquee = this; //添加事件处理 marqueeElenent.onmouseover = function() { window.clearTimeout(joinScrollMarquee.marqueeTimer); }; marqueeElenent.onmouseout = function() { joinScrollMarquee.scroll(); } this.scroll(); }; //滚动 JoinScrollMarquee.prototype.scroll = function() { if(this.marqueeElenent.scrollLeft >= this.marqueeContentElement.offsetWidth/2) { this.marqueeElenent.scrollLeft -= this.marqueeContentElement.offsetWidth/2; } else { this.marqueeElenent.scrollLeft += this.scrollAmount; } var joinScrollMarquee = this; window.clearTimeout(this.marqueeTimer); this.marqueeTimer = window.setTimeout(function() { joinScrollMarquee.scroll(); }, this.speed); }; //记录日历 RecordCalendar = function(title, startDate, dataUrl, terminalType) { this.title = title; this.startDate = startDate; this.dataUrl = dataUrl; this.terminalType = terminalType; this.isTouchMode = terminalType && terminalType!='' && terminalType!='computer'; this.id = ("" + Math.random()).substring(2); if(!window.recordCalendars) { window.recordCalendars = []; } window.recordCalendars['recordCalendar_' + this.id] = this; document.write('
'); this.calendarContainer = document.getElementById('recordCalendar_' + this.id); this._readCalendarData(); }; RecordCalendar.prototype._readCalendarData = function() { //创建记录日历 var recordCalendar = this; ScriptUtils.appendJsFile(document, this.dataUrl + '&recordCalendar.id=' + this.id + '&recordCalendar.startDate=' + this.startDate.format('yyyy-M-d') + '&seq=' + Math.random(), 'scriptRecordCalendar', function() { var calendarRecords = window.recordCalendars['recordCalendar_' + recordCalendar.id].calendarRecords; if(!recordCalendar.dateView) { recordCalendar._create(calendarRecords); } else { recordCalendar._processCalendarData(calendarRecords); } }, 'utf-8'); }; RecordCalendar.prototype._create = function(calendarRecords) { //创建日历视图 var recordCalendar = this; this.dateView = new DateView(this.startDate, this.terminalType, true); this.dateView.onload = function() { recordCalendar._processCalendarData(calendarRecords); }; this.dateView.onmonthchanged = function() { recordCalendar._hideCalendarData(); recordCalendar.startDate = new Date(recordCalendar.dateView.year + '/' + recordCalendar.dateView.month + '/1'); recordCalendar._readCalendarData(); }; if(this.isTouchMode) { this.dateView.onclick = function(srcElement) { recordCalendar._showCalendarData(srcElement); }; } else { this.dateView.onmouseover = function(srcElement) { recordCalendar._showCalendarData(srcElement); }; } this.dateView.create(this.calendarContainer); }; RecordCalendar.prototype._processCalendarData = function(calendarRecords) { //处理日历数据 var rows = this.dateView.dayTable.rows; for(var i = 1; i < rows.length; i++) { for(var j = 0; j < rows[i].cells.length; j++) { var html = this.calendarRecords['day_' + rows[i].cells[j].innerHTML]; this.dateView.setSelected(rows[i].cells[j], html ? true : false); } } }; RecordCalendar.prototype._showCalendarData = function(srcElement) { //显示日历数据 var html = this.calendarRecords['day_' + srcElement.innerHTML]; this._hideCalendarData(); if(!html) { return; } this.picker = new FormField.Picker(this.title, '' + html + '', srcElement, -1, -1, false, true, true, true, this.terminalType); this.picker.show(); this._startupTimerForHideCalendarData(); var recordCalendar = this; this.picker.pickerBody.onmousemove = function() { recordCalendar._startupTimerForHideCalendarData(); }; }; RecordCalendar.prototype._hideCalendarData = function() { //隐藏日历数据 if(!this.isTouchMode && this.picker) { this.picker.destory(); this.picker = null; } }; RecordCalendar.prototype._startupTimerForHideCalendarData = function() { //启动隐藏隐藏日历数据定时器 if(this.isTouchMode) { return; } if(this.calendarTimer) { window.clearTimeout(this.calendarTimer); } var recordCalendar = this; this.calendarTimer = window.setTimeout(function() { recordCalendar._hideCalendarData(); }, 5000); };