//////////////////////////////////////////////////////////////////////////////// /// DSPicViewer2 (DSPicViewer2.js) /// /// Version: 2.0.2 /// /// 30.07.2009 /// /// Copyright © 2007-2009 by Daniel Seichter /// /// /// ///--------------------------------------------------------------------------/// /// /// /// -> License/Lizenz <- /// /// /// /// You can modify and use this script in your own homepages/scripts for /// /// free, but if you use it or only parts of it, you have to add the name /// /// and the author of the following script in your homepages/scripts. /// /// /// /// Sie dürfen dieses Script nach belieben modifizieren und benutzten, /// /// unter der Bedienung, dass eine Erwähnung des Scriptes inkl. Autor /// /// innerhalb des Programms erfolgt, wenn das Script in irgendeiner /// /// Art und Weise benutzt wird. /// /// /// ///--------------------------------------------------------------------------/// /// /// /// -> ChangeLog <- /// /// /// /// 24.04.2007: First Release (Version 1) /// /// 21.10.2007: 2 BugFixes /// /// 17.02.2008: New Version (without "jQuery library") /// /// 22.07.2009: 1 BugFix in function "hide" /// /// 30.07.2009: rewrite positioning-system /// /// /// //////////////////////////////////////////////////////////////////////////////// /******************************************************************************* * class DSPicViewer2 * @access public * @param integer viewer_height viewer height * @param integer viewer_width viewer width * @param string viewer_loadpic_src path to the loading animation */ function DSPicViewer2(viewer_height,viewer_width,viewer_loadpic_src) { /*************************************************************************** * Variable that holds viewer_height */ this.viewer_height = viewer_height; /*************************************************************************** * Variable that holds viewer_width */ this.viewer_width = viewer_width; /*************************************************************************** * Variable that holds the path to the loading animation */ this.viewer_loadpic_src = null; this.viewer_loadpic_src = viewer_loadpic_src; /*************************************************************************** * Variables that hold the inforamtion of each pic */ this.pic_title = null; this.pic_desc = null; this.pic_src = null; } var thisDSPicViewer2 = DSPicViewer2.prototype; /*************************************************************************** * Pos_windows (pos each window(divlayer)) * @access private * @param pointer _this pointer to this class */ thisDSPicViewer2.pos_windows = function(_this) { //get vars var ClientWindowSize = get_clientwindowsize(); var PageSize = get_pagesize(); var PageScrollPos = get_page_scrollpos(); //pos OverlayWindow var OverlayWindow = document.getElementById("pv_overlaywindow"); set_element_style(OverlayWindow,"width",(ClientWindowSize[0] > PageSize[0]) ? ClientWindowSize[0]+"px" : (PageSize[0])+"px"); set_element_style(OverlayWindow,"height",(ClientWindowSize[1] > PageSize[1]) ? ClientWindowSize[1]+"px" : (PageSize[1])+"px"); if ((_this.viewer_height < ClientWindowSize[0]) && (_this.viewer_width < ClientWindowSize[1])) { //pos PicViewerWindow var PicViewerWindow = document.getElementById("pv_picviewerwindow"); set_element_style(PicViewerWindow,"left",(PageScrollPos[0] + (ClientWindowSize[0] - _this.viewer_width)/2)+"px"); set_element_style(PicViewerWindow,"top",(PageScrollPos[1] + (ClientWindowSize[1] - _this.viewer_height)/2)+"px"); //pos PicViewerContentWindow var PicViewerContentWindow = document.getElementById("pv_picviewercontentwindow"); set_element_style(PicViewerContentWindow,"left",(PageScrollPos[0] + (ClientWindowSize[0] - _this.viewer_width)/2)+"px"); set_element_style(PicViewerContentWindow,"top",(PageScrollPos[1] + (ClientWindowSize[1] - _this.viewer_height)/2)+"px"); } } /*************************************************************************** * changepic (change the pic in the viewer(divlayer)) * @access private * @param pointer obj pointer to layer * @param pointer _this pointer to this class * @param string img_src path to the new pic */ thisDSPicViewer2.changepic = function(obj,_this,img_src) { //change innerHTML obj.innerHTML = "

" +"" +"" +"" +"" +"" +"" +"" +"" +"" +"

"+_this.pic_title+"

"+_this.pic_desc+"

Schließen

"; } /*************************************************************************** * Show (open viewer) * @access public * @param string pic_title title of of the image * @param string pic_desc desc of of the image * @param string pic_src path to the image */ thisDSPicViewer2.Show = function(pic_title,pic_desc,pic_src) { //set important vars this.pic_title = pic_title; this.pic_desc = pic_desc; this.pic_src = pic_src; var _this = this; //override window-functions window.onscroll = function() { thisDSPicViewer2.pos_windows(_this); } window.onresize = function() { thisDSPicViewer2.pos_windows(_this); } //get vars var PageSize = get_pagesize(); var ClientWindowSize = get_clientwindowsize(); var PageScrollPos = get_page_scrollpos(); //create OverlayWindow var OverlayWindow = document.createElement("div"); OverlayWindow.setAttribute("id","pv_overlaywindow"); set_element_style(OverlayWindow,"left","0px"); set_element_style(OverlayWindow,"top","0px"); set_element_style(OverlayWindow,"width",(ClientWindowSize[0] > PageSize[0]) ? ClientWindowSize[0]+"px" : (PageSize[0])+"px"); set_element_style(OverlayWindow,"height",(ClientWindowSize[1] > PageSize[1]) ? ClientWindowSize[1]+"px" : (PageSize[1])+"px"); //show OverlayWindow (visibility is just for fix flickering) set_element_style(OverlayWindow,"visibility","hidden"); document.body.appendChild(OverlayWindow); set_element_style(OverlayWindow,"visibility","visible"); fade_to_opacity('pv_overlaywindow',0,40,300); //create PicViewerWindow var PicViewerWindow = document.createElement("div"); PicViewerWindow.setAttribute("id","pv_picviewerwindow"); set_element_style(PicViewerWindow,"left",(PageScrollPos[0] + (ClientWindowSize[0] - this.viewer_width)/2)+"px"); set_element_style(PicViewerWindow,"top",(PageScrollPos[1] + (ClientWindowSize[1] - this.viewer_height)/2)+"px"); set_element_style(PicViewerWindow,"width",this.viewer_width+"px"); set_element_style(PicViewerWindow,"height",this.viewer_height+"px"); //show PicViewerWindow (visibility is just for fix flickering) set_element_style(PicViewerWindow,"visibility","hidden"); document.body.appendChild(PicViewerWindow); set_element_style(PicViewerWindow,"visibility","visible"); fade_to_opacity('pv_picviewerwindow',0,70,500); //create PicViewerContentWindow var PicViewerContentWindow = document.createElement("div"); PicViewerContentWindow.setAttribute("id","pv_picviewercontentwindow"); set_element_style(PicViewerContentWindow,"left",(PageScrollPos[0] + (ClientWindowSize[0] - this.viewer_width)/2)+"px"); set_element_style(PicViewerContentWindow,"top",(PageScrollPos[1] + (ClientWindowSize[1] - this.viewer_height)/2)+"px"); set_element_style(PicViewerContentWindow,"width",this.viewer_width+"px"); set_element_style(PicViewerContentWindow,"height",this.viewer_height+"px"); //show loading-picture this.changepic(PicViewerContentWindow,_this,this.viewer_loadpic_src); //preload image var _img = new Image(); _img.onload = function() { //show loading-picture and replace with picture _this.changepic(PicViewerContentWindow,_this,_this.pic_src); } _img.src = this.pic_src; //show PicViewer (visibility is just for fix flickering) set_element_style(PicViewerContentWindow,"visibility","hidden"); document.body.appendChild(PicViewerContentWindow); set_element_style(PicViewerContentWindow,"visibility","visible"); setTimeout("fade_to_opacity('pv_picviewercontentwindow',0,100,50)",400); } /*************************************************************************** * Hide (close viewer) * @access public */ thisDSPicViewer2.Hide = function() { //fade out fade_to_opacity('pv_picviewercontentwindow',100,0,50); setTimeout("fade_to_opacity('pv_picviewerwindow',70,0,300)",100); setTimeout("fade_to_opacity('pv_overlaywindow',40,0,300)",100); //delete layer after fade setTimeout("document.body.removeChild(document.getElementById('pv_overlaywindow'))",420); setTimeout("document.body.removeChild(document.getElementById('pv_picviewerwindow'))",420); setTimeout("document.body.removeChild(document.getElementById('pv_picviewercontentwindow'))",420); //restore window-functions window.onscroll = function() { window.onscroll= null; } window.onresize = function() { window.onresize = null; } } //////////////////////////////////////////////////////////////////////////////// /// DSPicViewer2 (DSPicViewer2.js) /// /// Copyright © 2007-2009 by Daniel Seichter /// ////////////////////////////////////////////////////////////////////////////////