// // iWeb - DetailView.js // Copyright (c) 2007 Apple Inc. All rights reserved. // var DetailViewToggleNotification="DetailViewToggleNotification";function DetailView(instanceID) {if(instanceID!=null) {Widget.apply(this,arguments);this.mIsActive=false;this.mShowingThumbnails=false;this.needsHeightSet=true;this.p_setHeight();this.updateFromPreferences();if(this.runningInApp) {this.postToggleNotification(true);}}} DetailView.prototype=new Widget();DetailView.prototype.constructor=DetailView;DetailView.prototype.widgetIdentifier="com-apple-iweb-widget-detailview";DetailView.prototype.onload=function() {this.p_updateSlideshow();this.p_updateDownloadVisibility();this.p_addEvent(document,'onkeydown',this.p_keyDown.bind(this),true);this.p_addEvent(document,'onkeyup',this.p_keyUp.bind(this),true);this.div().select('.noselect').each(function(element) {if(windowsInternetExplorer) {element.onselectstart=function(){return false;};} else {element.onmousedown=function(){return false;};}});} DetailView.prototype.onunload=function() {} DetailView.prototype.loadFromStream=function(mediaStream) {if(mediaStream) {mediaStream.load(this.p_baseURL(),this.onStreamLoad.bind(this));}} DetailView.prototype.onStreamLoad=function(imageStream) {this.mCurrentMediaStream=imageStream;this.mThumbnailsInvalid=true;var slideshowDiv=this.getElementById("slideshow_placeholder");var slideshowAnchor=this.getElementById("slideshow_anchor");if(this.mSlideshow!=null) {this.mSlideshow.pause();slideshowDiv.innerHTML="";} var photos=[];for(var i=0;i0) {var height=width*3/4+"px";if(height!=parseFloat(slideshowDiv.style.height)) {slideshowDiv.parentNode.style.height=height;slideshowDiv.style.height=height;if(this.mSlideshow) {this.mSlideshow.updateSize();} this.needsHeightSet=false;if(this.runningInApp&&!window.onresize) {window.onresize=function() {this.needsHeightSet=true;this.p_setHeight();}.bind(this);}}} this.div().style.height='';var detailFooterDiv=this.getElementById("footer_controls");var gridID=this.preferenceForKey("gridID");var divTop=Position.cumulativeOffset(detailFooterDiv)[1]+detailFooterDiv.offsetHeight;if(divTop) {NotificationCenter.postNotificationWithInfo("DetailViewHeightNotification",gridID,{"top":divTop});}}} DetailView.prototype.p_setupThumbnails=function() {if(this.p_showThumbnails()) {if(!this.mShowingThumbnails) {this.p_toggleThumbnails(true,false);}} else {this.p_buildThumbnailView();}} DetailView.prototype.p_toggleThumbnails=function(show,animate) {if(this.mShowingThumbnails!=show) {var thumbnailView=this.getElementById("thumbnail_view");var back=this.getElementById("thumbnails_back");var forward=this.getElementById("thumbnails_forward");var viewSpan=this.getElementById("view");var thumbsOnOnly=viewSpan.select('.thumbs_on_only');var thumbsOffOnly=viewSpan.select('.thumbs_off_only');var thumbnailViewFullHeight=59;if(show) {this.mShowingThumbnails=true;if(animate) {var animation=new SimpleAnimation(function(){});animation.duration=300;animation.pre=function() {back.style.opacity=forward.style.opacity=0.0;back.style.visibility=forward.style.visibility="visible";thumbnailView.show();} animation.post=function() {thumbnailView.style.height=px(thumbnailViewFullHeight);back.style.opacity=forward.style.opacity=1.0;} animation.update=function(now) {thumbnailView.style.height=px(thumbnailViewFullHeight*now);back.style.opacity=forward.style.opacity=now;} animation.start();} else {back.style.visibility=forward.style.visibility="visible";back.style.opacity=forward.style.opacity=1.0;thumbnailView.style.height=px(thumbnailViewFullHeight);thumbnailView.show();} for(var i=0;i0) {container.innerHTML=badgeMarkup;} var img=document.createElement("img");var thumbnail=entry.micro();this.p_setThumbnail(img,thumbnail);anchor.href="#"+i;anchor.onclick=function(i,slideshow){setTimeout(slideshow.showPhotoNumber.bind(slideshow,i,true),0);}.bind(null,i,this.mSlideshow);anchor.appendChild(img);container.insertBefore(anchor,container.firstChild);thumbnailsDiv.appendChild(container);} this.p_updateThumbScrollers(currentIndex);back.onclick=function() {var thumbnailsDiv=this.getElementById("thumbnails");var left=0;if(thumbnailsDiv.style.left) {left=-parseFloat(thumbnailsDiv.style.left);} if(left>0) {var tileWidth=(thumbnailSize+thumbnailPadding);var nThumbs=Math.floor(thumbnailsDiv.parentNode.offsetWidth/tileWidth);this.p_setThumbnailLeft(Math.max(left-nThumbs*tileWidth,0));}}.bind(this);forward.onclick=function() {var thumbnailsDiv=this.getElementById("thumbnails");var left=0;if(thumbnailsDiv.style.left) {left=-parseFloat(thumbnailsDiv.style.left);} if(this.p_enableForward(thumbnailsDiv)) {var tileWidth=thumbnailSize+thumbnailPadding;var parentWidth=thumbnailsDiv.parentNode.offsetWidth;var nThumbs=Math.floor(parentWidth/tileWidth);this.p_setThumbnailLeft(Math.min(left+nThumbs*tileWidth,this.p_lastThumnbailRight()-parentWidth));}}.bind(this);}} DetailView.prototype.p_updateThumbScrollers=function(index) {var thumbnailsDiv=this.getElementById("thumbnails");var back=this.getElementById("thumbnails_back");var forward=this.getElementById("thumbnails_forward");if(index!==undefined) {var selected=thumbnailsDiv.select('.thumbnail')[index];if(selected) {this.p_ensureThumbnailIsVisible(selected);}} var left=parseFloat(thumbnailsDiv.style.left);var imgs=back.getElementsByTagName("img");if(left<0) {imgs[0].style.display="none";imgs[1].style.display="inline";} else {imgs[0].style.display="inline";imgs[1].style.display="none";} var imgs=forward.getElementsByTagName("img");if(this.p_enableForward(thumbnailsDiv)) {imgs[0].style.display="none";imgs[1].style.display="inline";} else {imgs[0].style.display="inline";imgs[1].style.display="none";}} DetailView.prototype.p_enableForward=function(thumbnailsDiv) {var enableForward=false;var thumbnails=thumbnailsDiv.select('.thumbnail');if(thumbnails&&thumbnails.length>0) {var lastThumbnail=thumbnails[thumbnails.length-1];var left=0;if(thumbnailsDiv.style.left) {left=parseFloat(thumbnailsDiv.style.left);} var panWidth=thumbnailsDiv.parentNode.offsetWidth;var right=panWidth-left;if(lastThumbnail.offsetLeft+lastThumbnail.offsetWidth>right) {enableForward=true;}} return enableForward;} DetailView.prototype.p_showSlideshow=function() {var show=this.preferenceForKey("showSlideshow");(function(){return show!==undefined}).assert();return show;} DetailView.prototype.p_updateSlideshow=function() {this.div().select('.play_slideshow').invoke(this.p_showSlideshow()?'show':'hide');} DetailView.prototype.p_showDownload=function() {var kDoNotDownloadImageSize=4;var photoSize=this.preferenceForKey("photoSize");var show=(photoSize==null||photoSize!=kDoNotDownloadImageSize);return show;} DetailView.prototype.p_updateDownloadVisibility=function() {this.getElementById("download").style.visibility=(this.p_showDownload()?'visible':'hidden');} DetailView.prototype.changedPreferenceForKey=function(key) {if(key=="mediaStream"||key=="mediaStreamObject") {var mediaStream=this.p_mediaStream();if(mediaStream!==null) {this.loadFromStream(mediaStream);}} else if(key=="captionHeight") {var captionDiv=this.div().selectFirst('.Caption');captionDiv.style.height=this.preferenceForKey("captionHeight")+"px";} else if(key=="movieTime") {this.mSlideshow.setMovieTime(this.preferenceForKey(key));} else if(key=="movieParams") {var params=this.preferenceForKey(key);this.mCurrentMediaStream[this.mSlideshow.currentPhotoNumber].setMovieParams(params);this.mSlideshow.setMovieParams(params);} else if(key=="canvas controls") {this.p_updateCanvasControls();} else if(key=="currentImageURL") {var entry=this.mCurrentMediaStream[this.mSlideshow.currentPhotoNumber];entry.setImageURL(this.preferenceForKey(key));this.mSlideshow.setImage(entry.image());} else if(key=="currentThumbnailURL") {var entry=this.mCurrentMediaStream[this.mSlideshow.currentPhotoNumber];var currentThumbnailURL=this.preferenceForKey(key);entry.setThumbnailURL(currentThumbnailURL);if(this.mThumbnailsInvalid==false) {var thumbnailsDiv=this.getElementById("thumbnails");var selectedThumbContainer=thumbnailsDiv.selectFirst('.selected');var img=selectedThumbContainer.getElementsByTagName("img")[0];this.p_setThumbnail(img,entry.thumbnail());}} else if(key=="showSlideshow") {this.p_updateSlideshow();} else if(key=="photoSize") {this.p_updateDownloadVisibility();}} DetailView.prototype.updateFromPreferences=function() {var mediaStream=this.p_mediaStream();this.loadFromStream(mediaStream);} DetailView.prototype.p_updateCanvasControls=function() {var canvasControlURLs=this.preferenceForKey("canvas controls");this.div().select('.canvas').each(function(img) {var canvasControlName="canvas_"+img.classNames().toArray()[1];setImgSrc(img,canvasControlURLs[canvasControlName]);});} DetailView.prototype.p_onPhotoChange=function(index) {var currentEntry=this.mCurrentMediaStream[index];var commentURL=currentEntry.commentAssetURL();if(this.runningInApp) {commentURL="iweb-widget:Comments/"+currentEntry.guid();this.preferences.postCrossWidgetNotification("IWCommentTargetChanged",{IWResourceURL:commentURL});} else {if(this.mIsActive) {NotificationCenter.postNotification(new IWNotification("IWCommentTargetChanged",null,{IWResourceURL:commentURL}));} var captionDiv=this.div().selectFirst('.Caption');if(captionDiv) {captionDiv.update(currentEntry.title());}} var thumbnailsDiv=this.getElementById("thumbnails");var oldSelected=thumbnailsDiv.selectFirst('.selected');if(oldSelected) {oldSelected.removeClassName("selected");} var newSelected=thumbnailsDiv.select('.thumbnail')[index];if(newSelected) {newSelected.addClassName("selected");this.p_ensureThumbnailIsVisible(newSelected);} this.p_updatePreviousNextControls(index);this.setPreferenceForKey(index,"currentPhoto");if(this.photoChangeCallback) {this.photoChangeCallback();this.photoChangeCallback=null;}} DetailView.prototype.p_lastThumnbailRight=function() {var thumbnailsDiv=this.getElementById("thumbnails");var thumbnails=thumbnailsDiv.select('.thumbnail');var lastThumbnail=thumbnails[thumbnails.length-1];var lastThumbnailRight=lastThumbnail.offsetLeft+lastThumbnail.offsetWidth;return lastThumbnailRight;} DetailView.prototype.p_ensureThumbnailIsVisible=function(thumbnail) {var thumbnailsDiv=this.getElementById("thumbnails");var startLeft=0;if(thumbnailsDiv.style.left) {startLeft=parseFloat(thumbnailsDiv.style.left);} var visibleArea=new IWRange(-startLeft,thumbnailsDiv.parentNode.offsetWidth);var thumbnailLeft=thumbnail.offsetLeft;var thumbnailRight=thumbnailLeft+thumbnail.offsetWidth;var targetLeft=visibleArea.location();if(thumbnailRight>visibleArea.max()) {var targetLeft=thumbnailLeft;targetLeft=Math.min(targetLeft,this.p_lastThumnbailRight()-visibleArea.length());} else if(thumbnailLeft=this.mCurrentMediaStream.length-1;var navigationClickHandler=function(i,slideshow) {setTimeout(slideshow.showPhotoNumber.bind(slideshow,i,true),0);} if(atFirstImage) {$(previousSpans[0]).show();$(previousSpans[1]).hide();} else {var previousIndex=index-1;$(previousSpans[0]).hide();$(previousSpans[1]).show();var anchors=$(previousSpans[1]).getElementsByTagName('a');$A(anchors).each(function(anchor){anchor.href='#'+previousIndex;anchor.onclick=navigationClickHandler.bind(null,previousIndex,this.mSlideshow);}.bind(this));} if(atLastImage) {$(nextSpans[0]).show();$(nextSpans[1]).hide();} else {var nextIndex=index+1;$(nextSpans[0]).hide();$(nextSpans[1]).show();var anchors=$(nextSpans[1]).getElementsByTagName('a');$A(anchors).each(function(anchor){anchor.href='#'+nextIndex;anchor.onclick=navigationClickHandler.bind(null,nextIndex,this.mSlideshow);}.bind(this));}} DetailView.prototype.p_mediaStream=function() {var mediaStream=null;if(this.preferences) {mediaStream=this.preferenceForKey("mediaStreamObject");if(mediaStream==null||mediaStream==undefined) {var mediaStreamCode=this.preferenceForKey("mediaStream");if(mediaStreamCode!=null&&mediaStreamCode.length>0) {mediaStream=eval(mediaStreamCode);}}} return mediaStream;} DetailView.prototype.p_backgroundColor=function() {var backgroundColor=null;if(this.preferences) {backgroundColor=this.preferenceForKey("color");} if(backgroundColor===undefined) {backgroundColor="transparent";} return backgroundColor;} DetailView.prototype.p_baseURL=function() {return this.preferenceForKey("baseURL");} DetailView.prototype.p_startIndex=function() {var startIndex=null;if(this.preferences) {startIndex=this.preferenceForKey("startIndex");} if(startIndex===undefined) {startIndex=0;} return startIndex;} DetailView.prototype.p_showThumbnails=function() {var showThumbnails=null;if(this.preferences) {showThumbnails=this.preferenceForKey("showThumbnails");} if(showThumbnails===undefined) {showThumbnails=false;} return showThumbnails;} DetailView.prototype.p_scaleMode=function() {var scaleMode=null;if(this.preferences) {scaleMode=this.preferenceForKey("scaleMode");} if(scaleMode===undefined) {scaleMode="fit";} return scaleMode;} DetailView.prototype.p_addEvent=function(object,event,functionName,capture) {if(object.addEventListener) {event=event.length>2?event.substring(2):event;capture=capture?capture:false;object.addEventListener(event,functionName,capture);} else if(object.attachEvent) {object.attachEvent(event,functionName);} else {try {object.setAttribute(event,functionName);} catch(e) {}}} DetailView.prototype.p_keyDown=function(event) {} DetailView.prototype.p_keyUp=function(event) {event=event?event:(window.event?window.event:"");var keyCode=event.which?event.which:event.keyCode;switch(keyCode) {case 37:event.cancelBubble=true;if(event.stopPropagation) {event.stopPropagation();} if(!(window.isWebKit&&window.isEarlyWebKitVersion)) {location.hash=this.mSlideshow.prevPhotoNumber();} this.mSlideshow.goBack();break;case 39:event.cancelBubble=true;if(event.stopPropagation) {event.stopPropagation();} if(!(window.isWebKit&&window.isEarlyWebKitVersion)) {location.hash=this.mSlideshow.nextPhotoNumber();} this.mSlideshow.advance();break;}}