Re: [Linpha-cvs] SF.net SVN: linpha: [4622] trunk/linpha2

[bzrudi <bz...@tu...>]

Hi all,

seems that the latest changes causes high CPU load. Every menu item
takes about 3 sec. to show up. Also browsing via thumb navi and showing
the main images is extremely slow. At least at my box.
Not sure if it is as of this change or because of any earlier or later
change, but it sure is a performance issue ;-)

cheers bzrudi

fan...@us... wrote:
> Revision: 4622
>           http://svn.sourceforge.net/linpha/?rev=4622&view=rev
> Author:   fangehrn
> Date:     2006-11-05 05:43:49 -0800 (Sun, 05 Nov 2006)
> 
> Log Message:
> -----------
> 2006-11-05 flo
>  * change the linpha2/?id to linpha2/?linId
>  * reorganized javascript classes and functions
>    there should be now no problem when including from other websites
>  * testing a new way of updating the menu using this javascript code
>    	replace( /linId=[0-9]*/g , "linId=" + IdCurrent );
>    	its just an search/replace of 'linId=x' in the menu
>    	its very fast (about 0 - 15ms) and its executed every time the image changes
> 
> Modified Paths:
> --------------
>     trunk/linpha2/ChangeLog
>     trunk/linpha2/admin/permissions_groups.php
>     trunk/linpha2/admin/permissions_readwrite.php
>     trunk/linpha2/admin/permissions_usergroup.php
>     trunk/linpha2/admin/permissions_users.php
>     trunk/linpha2/lib/classes/linpha.imgview.class.php
>     trunk/linpha2/lib/classes/linpha.sql.class.php
>     trunk/linpha2/lib/classes/linpha.template.class.php
>     trunk/linpha2/lib/include/basket_build_print.php
>     trunk/linpha2/lib/js/LinGlobal.js
>     trunk/linpha2/lib/js/LinImage.js
>     trunk/linpha2/lib/js/LinThumbnails.js
>     trunk/linpha2/lib/modules/module.ajax.php
>     trunk/linpha2/lib/modules/module.albums.php
>     trunk/linpha2/lib/modules/module.browse.php
>     trunk/linpha2/lib/modules/module.filemanager.php
>     trunk/linpha2/lib/modules/module.newimg.php
>     trunk/linpha2/lib/modules/module.search.php
>     trunk/linpha2/linpha2.specs.txt
>     trunk/linpha2/templates/default/basket.html.php
>     trunk/linpha2/templates/default/fragments.php
>     trunk/linpha2/templates/default/global.html.php
>     trunk/linpha2/templates/default/home.html.php
>     trunk/linpha2/templates/default/themes/default/DefsThumbView.js
>     trunk/linpha2/templates/default/view_basket.html.php
>     trunk/linpha2/templates/default/view_img.head.php
>     trunk/linpha2/templates/default/view_img.html.php
>     trunk/linpha2/templates/default/view_img_static.html.php
>     trunk/linpha2/templates/default/view_thumb.head.php
>     trunk/linpha2/templates/default/view_thumb_static.html.php
> 
> Modified: trunk/linpha2/ChangeLog
> ===================================================================
> --- trunk/linpha2/ChangeLog	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/ChangeLog	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -1,3 +1,12 @@
> +2006-11-05 flo
> + * change the linpha2/?id to linpha2/?linId
> + * reorganized javascript classes and functions
> +   there should be now no problem when including from other websites
> + * testing a new way of updating the menu using this javascript code
> +   	replace( /linId=[0-9]*/g , "linId=" + IdCurrent );
> +   	its just an search/replace of 'linId=x' in the menu
> +   	its very fast (about 0 - 15ms) and its executed every time the image changes
> +
>  2006-11-03 flo
>   * startet making linpha includable by other web pages
>     - introduced new constants:
> 
> Modified: trunk/linpha2/admin/permissions_groups.php
> ===================================================================
> --- trunk/linpha2/admin/permissions_groups.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/admin/permissions_groups.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -108,7 +108,7 @@
>  				<?php } ?>
>  				</form>
>  
> -				<form method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=group&amp;id='.$data['id']; ?>">
> +				<form method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=group&amp;linId='.$data['id']; ?>">
>  				<input type="submit" value="<?php echo i18n("Edit Group Members"); ?>" style="float: left;">
>  				</form>
>  			</td>
> 
> Modified: trunk/linpha2/admin/permissions_readwrite.php
> ===================================================================
> --- trunk/linpha2/admin/permissions_readwrite.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/admin/permissions_readwrite.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -215,7 +215,7 @@
>  		?>
>  		<br />
>  		<?php echo i18n("Permission Set"); ?>: <b><?php echo getReadablePerms($perm); ?></b>
> -		 (<a href="<?php echo LINPHA_DIR.'/admin/?cat=permissions_'.$cat2.'&amp;parent_id='.$parent_id.'&amp;cmd=edit&amp;id='.$parent_id; ?>">change</a>)
> +		 (<a href="<?php echo LINPHA_DIR.'/admin/?cat=permissions_'.$cat2.'&amp;parent_id='.$parent_id.'&amp;cmd=edit&amp;linId='.$parent_id; ?>">change</a>)
>  		<br /><br />
>  		<table border='1'>
>  			<tr>
> @@ -288,11 +288,11 @@
>  	
>  			if($i != 0)
>  			{
> -				echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_'.$GLOBALS['cat2'].'&amp;parent_id='.$GLOBALS['parent_id'].'&amp;cmd=edit&amp;id='.$data['id'].'">add</a>';
> +				echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_'.$GLOBALS['cat2'].'&amp;parent_id='.$GLOBALS['parent_id'].'&amp;cmd=edit&amp;linId='.$data['id'].'">add</a>';
>  			}
>  			else
>  			{
> -				echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_'.$GLOBALS['cat2'].'&amp;parent_id='.$GLOBALS['parent_id'].'&amp;cmd=edit&amp;id='.$data['id'].'">change</a>';
> +				echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_'.$GLOBALS['cat2'].'&amp;parent_id='.$GLOBALS['parent_id'].'&amp;cmd=edit&amp;linId='.$data['id'].'">change</a>';
>  			}
>  			echo '</td></tr>';
>  			
> 
> Modified: trunk/linpha2/admin/permissions_usergroup.php
> ===================================================================
> --- trunk/linpha2/admin/permissions_usergroup.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/admin/permissions_usergroup.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -8,7 +8,7 @@
>  $query = $linpha->db->Execute("SELECT id, group_name FROM ".PREFIX."groups ORDER by group_name");
>  while($data = $query->FetchRow())
>  {
> -	echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=group&amp;id='.$data['id'].'">'.$data['group_name'].'</a><br />';
> +	echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=group&amp;linId='.$data['id'].'">'.$data['group_name'].'</a><br />';
>  }
>  
>  echo '<br /><br />';
> @@ -20,7 +20,7 @@
>  $query = $linpha->db->Execute("SELECT id, username FROM ".PREFIX."users ORDER by username");
>  while($data = $query->FetchRow())
>  {
> -	echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=user&amp;id='.$data['id'].'">'.$data['username'].'</a><br />';
> +	echo '<a href="'.LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=user&amp;linId='.$data['id'].'">'.$data['username'].'</a><br />';
>  }
>  ?>
>  <br /><hr /><br />
> @@ -102,7 +102,7 @@
>  	 * get all groups/users
>  	 */
>  	?>
> -	<form method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit='.$_GET['edit'].'&amp;id='.$linpha->template->idCurrent; ?>">
> +	<form method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit='.$_GET['edit'].'&amp;linId='.$linpha->template->idCurrent; ?>">
>  	<select name="usergroup[]" size="5" style="width: 200;" multiple="multiple">
>  	<?php
>  	$query = $linpha->db->Execute("SELECT id, ".$other_select_name." " .
> 
> Modified: trunk/linpha2/admin/permissions_users.php
> ===================================================================
> --- trunk/linpha2/admin/permissions_users.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/admin/permissions_users.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -165,7 +165,7 @@
>                  <input type="submit" value="<?php echo i18n("Modify User"); ?>" style="float: left;">
>  	            </form>
>  
> -	           	<form name="edit_groups" method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=user&amp;id='.$data['id']; ?>">
> +	           	<form name="edit_groups" method="POST" action="<?php echo LINPHA_DIR.'/admin/?cat=permissions_usergroup&amp;edit=user&amp;linId='.$data['id']; ?>">
>                  <input type="submit" name="edit_groups" value="<?php echo i18n("Edit Groups"); ?>" style="float: left;">
>                  </form>
>  
> 
> Modified: trunk/linpha2/lib/classes/linpha.imgview.class.php
> ===================================================================
> --- trunk/linpha2/lib/classes/linpha.imgview.class.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/classes/linpha.imgview.class.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -49,7 +49,7 @@
>  
>  
>  /**
> - * set current view and set fileinfos of $GLOBALS['linpha']->template->idCurrent ($_GET['id'])
> + * set current view and set fileinfos of $GLOBALS['linpha']->template->idCurrent ($_GET['linId'])
>   * @param string $modulname (album, browse, search, ...)
>   */
>  function setCurrentView($modulename)
> @@ -288,7 +288,7 @@
>  	 		array(
>  				'name' => i18n("Permissions"),
>  				'value' => array(
> -					array('name' => i18n("Set Permissions"), 'value' => LINPHA_CLIENT.'/admin/?cat=permissions_view&amp;cmd=edit&amp;id='.$GLOBALS['linpha']->template->idCurrent)
> +					array('name' => i18n("Set Permissions"), 'value' => LINPHA_CLIENT.'/admin/?cat=permissions_view&amp;cmd=edit&amp;linId='.$GLOBALS['linpha']->template->idCurrent)
>  				)
>  			);
>  
> @@ -340,13 +340,13 @@
>  				$array = explode(',',$GLOBALS['linpha']->sql->config->value['sys_style_thumb_selectsizes']);
>  				foreach($array AS $value)
>  				{
> -					$array_tn_sizes_links[] = array('name' => $value.' '.i18n("Pixel"), 'value' => 'javascript:set_tn_size('.$value.')');
> +					$array_tn_sizes_links[] = array('name' => $value.' '.i18n("Pixel"), 'value' => 'javascript:myLinThumbnails.setTnSize('.$value.')');
>  				}
>  	
>  				$array = explode(',',$GLOBALS['linpha']->sql->config->value['sys_style_thumb_selectnrimages']);
>  				foreach($array AS $value)
>  				{
> -					$array_nr_links[] = array('name' => $value, 'value' =>"javascript:set_nr_images('".$value."')");
> +					$array_nr_links[] = array('name' => $value, 'value' =>"javascript:myLinThumbnails.setNrImages('".$value."')");
>  				}
>  				
>  				$array_views_links[] = array('name' => i18n("Normal"), 'value' => $GLOBALS['linpha']->template->URL_full.'&amp;view=thumb');
> @@ -378,7 +378,7 @@
>  		 	{
>  			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['name'] = i18n("Edit");
>  			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['name'] = i18n("Open Filemanager");
> -			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['value'] = LINPHA_LINK.'&amp;linCat=filemanager&amp;id='.$this->id_parent;
> +			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['value'] = LINPHA_LINK.'&amp;linCat=filemanager&amp;linId='.$this->id_parent;
>  		 	}
>  
>  		 	if($GLOBALS['linpha']->sql->checkPermission('metadata_edit'))
> @@ -410,15 +410,15 @@
>  			 			array('name' => i18n("Sort"), 'value' => $array_sort_orders_links),
>  			 			array('name' => i18n("View at"), 'value' => 
>  							array(
> -								array('name' => '640x480', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=640&amp;height=480', 'target' => '_blank'),
> -								array('name' => '800x600', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=800&amp;height=600', 'target' => '_blank'),
> -								array('name' => '1024x768', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1024&amp;height=768', 'target' => '_blank'),
> -								array('name' => '1280x800', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=800', 'target' => '_blank'),
> -								array('name' => '1280x960', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=960', 'target' => '_blank'),
> -								array('name' => '1280x1024', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=1024', 'target' => '_blank'),
> -								array('name' => '1600x1200', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1600&amp;height=1200', 'target' => '_blank'),
> -								array('name' => '1920x1200', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1920&amp;height=1200', 'target' => '_blank'),
> -								array('name' => $this->org_width.'x'.$this->org_height.' '.i18n("Fullscreen").')', 'value' => LINPHA_CLIENT.'/get_image.php?id='.$GLOBALS['linpha']->template->idCurrent.'&amp;width='.$this->org_width.'&amp;height='.$this->org_height, 'target' => '_blank'),
> +								array('name' => '640x480', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=640&amp;height=480', 'target' => '_blank'),
> +								array('name' => '800x600', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=800&amp;height=600', 'target' => '_blank'),
> +								array('name' => '1024x768', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1024&amp;height=768', 'target' => '_blank'),
> +								array('name' => '1280x800', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=800', 'target' => '_blank'),
> +								array('name' => '1280x960', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=960', 'target' => '_blank'),
> +								array('name' => '1280x1024', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1280&amp;height=1024', 'target' => '_blank'),
> +								array('name' => '1600x1200', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1600&amp;height=1200', 'target' => '_blank'),
> +								array('name' => '1920x1200', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width=1920&amp;height=1200', 'target' => '_blank'),
> +								array('id' => 'linLiViewAtFullscreen', 'name' => $this->org_width.'x'.$this->org_height.' ('.i18n("Fullscreen").')', 'value' => LINPHA_CLIENT.'/get_image.php?linId='.$GLOBALS['linpha']->template->idCurrent.'&amp;width='.$this->org_width.'&amp;height='.$this->org_height, 'target' => '_blank'),
>  							)
>  			 			)
>  			 		)
> @@ -438,7 +438,7 @@
>  		 	{
>  			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['name'] = i18n("Edit");
>  			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['name'] = i18n("Open Filemanager");
> -			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['value'] = LINPHA_LINK.'&amp;linCat=filemanager&amp;id='.$this->id_parent;
> +			 	$GLOBALS['linpha']->template->output['menu_More']['edit']['value'][2]['value'] = LINPHA_LINK.'&amp;linCat=filemanager&amp;linId='.$this->id_parent;
>  		 	}
>  
>  
> @@ -488,7 +488,7 @@
>  		 * slideshow icon
>  		 */
>  		if( useAjax() ) {
> -			$GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="javascript:slideshowStartFromThumbview()">'.
> +			$GLOBALS['linpha']->template->output['menu_Icons'] .= '<a href="javascript:myLinThumbnails.loadSlideshow()">'.
>  				'<img src="'.$GLOBALS['linpha']->template->themeFile('images/slideshow.png').'" border="0" title="'.i18n("Play Slideshow").'" />'
>  				.'</a>'."\n";
>  		}
> @@ -665,7 +665,7 @@
>  		 * this is a normal javascript array
>  		 * just another kind of definition...
>  		 */
> -		$GLOBALS['linpha']->template->output['files_db'] = 'var img_ids = ['."\n";
> +		$GLOBALS['linpha']->template->output['files_db'] = 'var linImgIds = ['."\n";
>  		if($this->tot_photos > 0)	// check if not all entries were folders
>  		{
>  			foreach($this->photos_filtered AS $key=>$value)
> @@ -846,7 +846,7 @@
>  		{
>  			if($value['img_type'] == 0)
>  			{
> -				$GLOBALS['linpha']->template->output['navigation'] .= '<a href="'.LINPHA_LINK.'&amp;linCat=alb&amp;id='.$value['id'].'">'.$value['name'].'</a><br />';
> +				$GLOBALS['linpha']->template->output['navigation'] .= '<a href="'.LINPHA_LINK.'&amp;linCat=alb&amp;linId='.$value['id'].'">'.$value['name'].'</a><br />';
>  				$nr_folders++;
>  			}
>  		}
> @@ -1116,7 +1116,7 @@
>  <imgwidth><?php echo $this->org_width; ?></imgwidth>
>  <imgheight><?php echo $this->org_height; ?></imgheight>
>  <imgnr><?php printf(i18n("Image %s of %s"),$this->current_key+1,count($this->photos_filtered)); ?></imgnr>
> -<title><?php echo str_replace('<','&lt;',$GLOBALS['linpha']->template->linpha_title." :: ".$GLOBALS['linpha']->template->output['title']); ?></title>
> +<title><?php /* oh, what an evil hack */ echo str_replace('<','&lt;',$GLOBALS['linpha']->template->linpha_title." :: ".$GLOBALS['linpha']->template->output['title']); ?></title>
>  <?php
>  	if(isset($this->xmldata['prev_thumb'])) {
>  		foreach($this->xmldata['prev_thumb'] AS $value)
> @@ -1289,8 +1289,8 @@
>  	$name = $this->photos_filtered[$key]['name']; 
>  
>  	$str = '<div class="thumbnavi_'.$class.'thumb">'
> -		. '<a href="'.$GLOBALS['linpha']->template->URL_base.'&amp;id='.$id.'">'
> -		. '<img class="img_'.$class.'thumb" src="'.LINPHA_CLIENT.'/get_thumb.php?id='.$id.'" /></a>'
> +		. '<a href="'.$GLOBALS['linpha']->template->URL_base.'&amp;linId='.$id.'">'
> +		. '<img class="img_'.$class.'thumb" src="'.LINPHA_CLIENT.'/get_thumb.php?linId='.$id.'" /></a>'
>  		. '<br />'.$name.'</div>'."\n";
>  		
>  	return $str;
> 
> Modified: trunk/linpha2/lib/classes/linpha.sql.class.php
> ===================================================================
> --- trunk/linpha2/lib/classes/linpha.sql.class.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/classes/linpha.sql.class.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -211,9 +211,9 @@
>  	 * linpha2/index.php/album1/file.jpg
>  	 * will set the correct id
>  	 */
> -	if(isset($_GET['id']))
> +	if(isset($_GET['linId']))
>  	{
> -		$GLOBALS['linpha']->template->idCurrent = intval($_GET['id']);
> +		$GLOBALS['linpha']->template->idCurrent = intval($_GET['linId']);
>  	}
>  	else
>  	{
> 
> Modified: trunk/linpha2/lib/classes/linpha.template.class.php
> ===================================================================
> --- trunk/linpha2/lib/classes/linpha.template.class.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/classes/linpha.template.class.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -127,12 +127,13 @@
>  <script type="text/javascript" language="JavaScript">
>  var LINPHA_LINK = '<?php echo LINPHA_LINK; ?>';
>  var LINPHA_CLIENT = '<?php echo LINPHA_CLIENT; ?>';
> +var linUrlBase = '<?php echo convert_amp($linTpl->URL_base); ?>';
>  var startIdCurrent = <?php echo $this->idCurrent; ?>;
>  var IdCurrent = startIdCurrent;
>  <?php
>  if(! isset($_SESSION['use_js']) && ! isset($_SESSION['disable_ajax']))
>  {
> -	echo "checkAjaxCompatibility();";
> +	echo "myLinGlobal.checkAjaxCompatibility();"."\n";
>  }
>  ?>
>  </script>
> @@ -230,7 +231,7 @@
>  
>  		if($comingfrom_ajax && isset($this->output['sys_log']) && !empty($this->output['sys_log']))
>  		{
> -			echo '<script language="JavaScript" type="text/javascript">linSyslog("'.$this->output['sys_log'].'");</script>';
> +			echo '<script language="JavaScript" type="text/javascript">myLinGlobal.linSyslog("'.$this->output['sys_log'].'");</script>';
>  		}
>  	}
>  	
> @@ -256,7 +257,7 @@
>  			{
>  				echo "\t".'<li><span>'.i18n($index).'&nbsp;&nbsp;</span>'."\n";
>  			}
> -			echo "\n".'<ul id="menu'.$index.'" onmouseover="reloadMenu()">'."\n";
> +			echo "\n".'<ul id="menu'.$index.'" onmouseover="myLinGlobal.reloadMenu()">'."\n";
>  	
>  			foreach($GLOBALS['linpha']->template->output['menu_'.$index] AS $key=>$value)
>  			{
> @@ -267,7 +268,14 @@
>  					} else {
>  						$target_str = '';
>  					}
> -					echo "\t".'<li><a href="'.$value['value'].'"'.$target_str.'>'.$value['name'].'</a></li>'."\n";  
> +					
> +					if(isset($value['id'])) {
> +						$id_str = ' id="'.$value['id'].'"';
> +					} else {
> +						$id_str = '';
> +					}
> +
> +					echo "\t".'<li'.$id_str.'><a href="'.$value['value'].'"'.$target_str.'>'.$value['name'].'</a></li>'."\n";  
>  				}
>  				else
>  				{
> @@ -284,7 +292,14 @@
>  							} else {
>  								$target_str = '';
>  							}
> -							echo "\t\t".'<li><a href="'.$sub_value['value'].'"'.$target_str.'>'.$sub_value['name'].'</a></li>'."\n";
> +							
> +							if(isset($sub_value['id'])) {
> +								$id_str = ' id="'.$sub_value['id'].'"';
> +							} else {
> +								$id_str = '';
> +							}
> +							
> +							echo "\t\t".'<li'.$id_str.'><a href="'.$sub_value['value'].'"'.$target_str.'>'.$sub_value['name'].'</a></li>'."\n";
>  						}
>  						else
>  						{
> @@ -294,15 +309,20 @@
>  										
>  							foreach($sub_value['value'] AS $subsub_value)
>  							{
> -
> -
>  								if(isset($subsub_value['target'])) {
>  									$target_str = ' target="'.$subsub_value['target'].'"';
>  								} else {
>  									$target_str = '';
>  								}
> -								echo "\t\t\t".'<li><a href="'.$subsub_value['value'].'"'.$target_str.'>'.$subsub_value['name'].'</a></li>'."\n";
>  
> +								if(isset($subsub_value['id'])) {
> +									$id_str = ' id="'.$subsub_value['id'].'"';
> +								} else {
> +									$id_str = '';
> +								}
> +
> +								echo "\t\t\t".'<li'.$id_str.'><a href="'.$subsub_value['value'].'"'.$target_str.'>'.$subsub_value['name'].'</a></li>'."\n";
> +
>  							}
>  							
>  							echo  "\t\t".'</ul>'."\n";
> 
> Modified: trunk/linpha2/lib/include/basket_build_print.php
> ===================================================================
> --- trunk/linpha2/lib/include/basket_build_print.php	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/include/basket_build_print.php	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -174,7 +174,7 @@
>  		echo "\n\t\t".'<td width="'.$print_w.'" height="'.$print_h.'">';
>  		echo '<img width="'.$img_w.'" height="'.$img_h.'" '.
>  				'src="'.LINPHA_CLIENT.'/get_image.php?'.
> -				'id='.$image_id.'&amp;'.
> +				'linId='.$image_id.'&amp;'.
>  				'width='.$nw.'&amp;'.
>  				'height='.$nh.'&amp;'.
>  				($_POST['l_or_h_quality'] == 'h' ? "quality=80&amp;" : '').	// if high quality selected, set quality to 80 (anything higher than 80 isn't meaningful), if low quality selected, no quality is given, and so get_thumbs_on_fly.php takes the default quality
> 
> Modified: trunk/linpha2/lib/js/LinGlobal.js
> ===================================================================
> --- trunk/linpha2/lib/js/LinGlobal.js	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/js/LinGlobal.js	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -1,145 +1,213 @@
>  
>  /**
> - * dynamically open syslog
> - * used in ajax context
> + * class and global definitions
>   */
> -function linSyslog(text)
> +var LinGlobal = Class.create();
> +var myLinGlobal;
> +
> +LinGlobal.prototype =
>  {
> -	if( typeof $('divSyslogText') != 'undefined' )
> +	/**
> +	 * initialize()
> +	 * Constructor runs on completion of the DOM loading.
> +	 */
> +	initialize: function()
>  	{
> -		if( $('divSyslogText').innerHTML == '' )
> +		this.menuNeedsUpdating = false;
> +		
> +		this.linInnerWidth = 0;
> +		this.linInnerHeight = 0;
> +		this.linPageXOffset = 0;
> +		this.linPageYOffset = 0;
> +	},
> +
> +	/**
> +	 * dynamically open syslog
> +	 * used in ajax context
> +	 */
> +	linSyslog: function(text)
> +	{
> +		if( typeof $('divSyslogText') != 'undefined' )
>  		{
> -			$('divSyslogText').innerHTML += text;	
> +			if( $('divSyslogText').innerHTML == '' )
> +			{
> +				$('divSyslogText').innerHTML += text;	
> +			}
> +			else
> +			{
> +				$('divSyslogText').innerHTML += '<br />' + text;
> +			}
> +			
> +			this.setScrollSize();
> +			$('divSyslog').style.top = this.linPageYOffset + 15;
> +			$('divSyslog').style.left = this.linPageXOffset + 15;
> +			Element.show('divSyslog');
>  		}
> +	},
> +	closeSyslog: function()
> +	{
> +		$('divSyslogText').innerHTML = '';
> +		Element.hide('divSyslog');
> +	},
> +	
> +	/**
> +	 * check ajax compatibilty
> +	 * will be on every page view until it was successfully
> +	 * then, the page will be reloaded
> +	 * 
> +	 * use this on every page and not only on home page, because if user is linked directly to an image
> +	 * 
> +	 * ajax may be disabled with ./?linCat=ajax&disable_ajax
> +	 * and may be re-enabled with ./?linCat=ajax&enable_ajax
> +	 * 
> +	 * http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
> +	 */
> +	checkAjaxCompatibility: function()
> +	{
> +		new Ajax.Request(LINPHA_LINK + '&linCat=ajax&use_js', {method:'get', asynchronous:true, onSuccess:myLinGlobal.checkAjaxCompatibilitySuccess} );
> +	},
> +	
> +	/**
> +	 * reload page, now with ajax activated
> +	 * will be called if the request in checkAjaxCompatibility() was successfully
> +	 */
> +	checkAjaxCompatibilitySuccess: function(t)
> +	{
> +		if( t.responseText == 'use_js saved' )
> +		{
> +			location.href = document.location;
> +			this.linSyslog('Ajax enabled');
> +		}
> +	},
> +	
> +	AjaxPost: function(parameters,successFunction)
> +	{
> +		var opt = {
> +			// Use POST
> +			method: 'post',
> +			// Send this lovely data
> +			postBody: parameters
> +			,
> +			// asynchron, of course
> +			asynchronous:true,
> +			
> +			// Handle successful response
> +			onSuccess: successFunction,
> +	
> +			// Handle 404
> +			on404: function(t) {
> +				alert('Error 404: location "' + t.statusText + '" was not found.');
> +			},
> +			// Handle other errors
> +			onFailure: function(t) {
> +				alert('Error ' + t.status + ' -- ' + t.statusText);
> +			}
> +		}
> +	
> +		new Ajax.Request(xmlUrl + '&linId=' + IdCurrent + '&xml', opt);
> +	},
> +	
> +	reloadMenu: function()
> +	{
> +		if( this.menuNeedsUpdating )
> +		{
> +			new Ajax.Updater('menu', LINPHA_LINK + '&linCat=ajax&reloadmenu&linId='+IdCurrent, {method: 'get', asynchronous:true, evalScripts:true});
> +			this.menuNeedsUpdating = false;
> +		}
> +	},
> +	
> +	/**
> +	 * setWindowSize()
> +	 * 
> +	 * sets two variables of the inner window width and height
> +	 * takes care of browser incompatibilities
> +	 */
> +	setWindowSize: function()
> +	{
> +		/**
> +		 * browser incompatibilities...
> +		 */
> +		if (window.innerHeight) // all except Explorer
> +		{
> +			this.linInnerWidth = self.innerWidth;
> +			this.linInnerHeight = self.innerHeight;
> +		}
> +		else if (document.body && document.body.offsetWidth)
> +		{
> +			this.linInnerWidth = document.body.offsetWidth;
> +			this.linInnerHeight = document.body.offsetHeight;
> +		}
>  		else
>  		{
> -			$('divSyslogText').innerHTML += '<br />' + text;
> -		}
> -		Element.show('divSyslog');
> -	}
> -}
> -function closeSyslog()
> -{
> -	$('divSyslogText').innerHTML = '';
> -	Element.hide('divSyslog');
> -}
> +			this.linInnerWidth = 500;
> +			this.linInnerHeight = 300;
> +		}	
> +	},
>  
> -/**
> - * check ajax compatibilty
> - * will be on every page view until it was successfully
> - * then, the page will be reloaded
> - * 
> - * use this on every page and not only on home page, because if user is linked directly to an image
> - * 
> - * ajax may be disabled with ./?linCat=ajax&disable_ajax
> - * and may be re-enabled with ./?linCat=ajax&enable_ajax
> - * 
> - * http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
> - */
> -function checkAjaxCompatibility()
> -{
> -	new Ajax.Request(LINPHA_LINK + '&linCat=ajax&use_js', {method:'get', asynchronous:true, onSuccess:checkAjaxCompatibilitySuccess} );
> -}
> -
> -/**
> - * reload page, now with ajax activated
> - * will be called if the request in checkAjaxCompatibility() was successfully
> - */
> -function checkAjaxCompatibilitySuccess(t)
> -{
> -	if( t.responseText == 'use_js saved' )
> +	/**
> +	 * setMainHeight
> +	 * 
> +	 * sets the height in thumb and image view of the "divmain"
> +	 */
> +	setMainHeight: function()
>  	{
> -		location.href = document.location;
> -		linSyslog('Ajax enabled');
> -	}
> -}
> -
> -function AjaxPost(parameters,successFunction)
> -{
> -	var opt = {
> -		// Use POST
> -		method: 'post',
> -		// Send this lovely data
> -		postBody: parameters
> -		,
> -		// asynchron, of course
> -		asynchronous:true,
> +		this.setWindowSize();
>  		
> -		// Handle successful response
> -		onSuccess: successFunction,
> -
> -		// Handle 404
> -		on404: function(t) {
> -			alert('Error 404: location "' + t.statusText + '" was not found.');
> -		},
> -		// Handle other errors
> -		onFailure: function(t) {
> -			alert('Error ' + t.status + ' -- ' + t.statusText);
> +		var newHeight = this.linInnerHeight - $('main').offsetTop - 40;	// 35 = 15 (bottom rounded corners) + 10 (margin-bottom) + 15 (??)
> +		if(newHeight < 100)
> +		{
> +			newHeight = 100;
>  		}
> -	}
> -
> -	new Ajax.Request(xmlUrl + '&id=' + IdCurrent + '&xml', opt);
> -}
> -
> -var menuNeedsUpdating = false;
> -function reloadMenu()
> -{
> -	if( menuNeedsUpdating )
> +	
> +		$('main').style.height = newHeight;
> +	},
> +	
> +	/**
> +	 * setScrollSize
> +	 * 
> +	 * sets two variables with the scroll offset
> +	 * takes care of browser incompatibilites
> +	 */
> +	setScrollSize: function()
>  	{
> -		new Ajax.Updater('menu', LINPHA_LINK + '&linCat=ajax&reloadmenu&id='+IdCurrent, {method: 'get', asynchronous:true, evalScripts:true});
> -		menuNeedsUpdating = false;
> +		if (self.pageYOffset) // all except Explorer
> +		{
> +			this.linPageXOffset = self.pageXOffset;
> +			this.linPageYOffset = self.pageYOffset;
> +		}
> +		else if (document.documentElement && document.documentElement.scrollTop)
> +			// Explorer 6 Strict
> +		{
> +			this.linPageXOffset = document.documentElement.scrollLeft;
> +			this.linPageYOffset = document.documentElement.scrollTop;
> +		}
> +		else if (document.body) // all other Explorers
> +		{
> +			this.linPageXOffset = document.body.scrollLeft;
> +			this.linPageYOffset = document.body.scrollTop;
> +		}
> +	},
> +	
> +	fOnError: function(txt_message, url, line) {
> +		var txt = "Error occured...\n\n";
> +		txt += "Message: " + txt_message + "\n";
> +		txt += "URL: " + url + "\n";
> +		txt += "Line: " + line;
> +		alert(txt);
>  	}
>  }
>  
>  /**
> - * setMainHeight
> + * initLinGlobal()
>   * 
> - * sets the height in thumb and image view of the "divmain"
> + * create the class object
>   */
> -var linInnerWidth, linInnerHeight;
> -
> -function getWindowSize()
> +function initLinGlobal()
>  {
> -	/**
> -	 * browser incompatibilities...
> -	 */
> -	if (window.innerHeight) // all except Explorer
> -	{
> -		linInnerWidth = self.innerWidth;
> -		linInnerHeight = self.innerHeight;
> -	}
> -	else if (document.body && document.body.offsetWidth)
> -	{
> -		linInnerWidth = document.body.offsetWidth;
> -		linInnerHeight = document.body.offsetHeight;
> -	}
> -	else
> -	{
> -		linInnerWidth = 500;
> -		linInnerHeight = 300;
> -	}	
> -}
> +	myLinGlobal = new LinGlobal();
>  
> -function setMainHeight()
> -{
> -	getWindowSize();
> -	
> -	var newHeight = linInnerHeight - $('main').offsetTop - 40;	// 35 = 15 (bottom rounded corners) + 10 (margin-bottom) + 15 (??)
> -	if(newHeight < 100)
> -	{
> -		newHeight = 100;
> -	}
> -
> -	$('main').style.height = newHeight;
> +	Event.observe(window, 'error', myLinGlobal.fOnError, false);
>  }
>  
> -
> -function fOnError(txt_message, url, line) {
> -	var txt = "Error occured...\n\n";
> -	txt += "Message: " + txt_message + "\n";
> -	txt += "URL: " + url + "\n";
> -	txt += "Line: " + line;
> -	alert(txt);
> -}
> -window.onerror = fOnError;
> -
> +//Event.observe(window, 'load', initLinGlobal, false);
> +initLinGlobal();
> 
> Modified: trunk/linpha2/lib/js/LinImage.js
> ===================================================================
> --- trunk/linpha2/lib/js/LinImage.js	2006-11-03 23:01:21 UTC (rev 4621)
> +++ trunk/linpha2/lib/js/LinImage.js	2006-11-05 13:43:49 UTC (rev 4622)
> @@ -1,51 +1,63 @@
>  
> -var errFunc = function(t) {
> -    alert('Error ' + t.status + ' -- ' + t.statusText);
> -}
> +/**
> + * class and global definitions
> + */
> +var LinImage = Class.create();
> +var myLinImage;
>  
> -var nextThumbs = new Array();
> -var prevThumbs = new Array();
> +LinImage.prototype = {
> +	
> +	/**
> +	 * initialize()
> +	 * 
> +	 * Constructor runs on completion of the DOM loading.
> +	 */
> +	initialize: function()
> +	{
> +		this.imgInfoColorNotActive = $('divinfolinks').style.color;
> +		this.imgInfoColorActive = $('hrefinfolinks').style.color;
> +		this.imgInfoShowHide = 'hide';
>  
> -var fullscreenActive = false;
> -var fullscreenOldMaxWidth, fullscreenOldMaxHeight;
> -var slideshowActive = false;
> -var ssCurrentTimerID;
> -var ssCurrentDelay = 5000;
> -var ssRandom = false;
> -var ssLoop = false;
>  
> -var xmlDoc = new Array();
> -var preloadImage = new Array();	// image array, will contain a lot of preloaded images
> -var preloadImageFinished = new Array();	// set to true after preload completed
> -var preloadXmlFinished = new Array();
> +		this.fullscreenActive = false;
> +		this.fullscreenOldMaxWidth, this.fullscreenOldMaxHeight;
> +		this.slideshowActive = false;
> +		this.ssCurrentTimerID;
> +		this.ssCurrentDelay = 5000;
> +		this.ssRandom = false;
> +		this.ssLoop = false;
> +		
> +		this.xmlDoc = new Array();
> +		this.nextThumbs = new Array();
> +		this.prevThumbs = new Array();
> +		this.preloadImageSrc = new Array();	// image array, will contain a lot of preloaded images
> +		this.finishedPreloadedImages = new Array();	// set to true after preload completed
> +		this.preloadXmlFinished = new Array();
> +		
> +		this.curLocationHash;
> +		this.timerResize;
> +		
> +		this.testarray = new Array();
> +		this.testarray[0] = 'test 2';
>  
> -var curLocationHash;
> +	},
>  
> -var borderSize = 0;
> -var resizeDuration = 0.5;
>  
> -var LinImage = Class.create();
> -var myLinImage;
> +	// -----------------------------------------------------------------------------------
> +	// functions to load xml data of images
> +	// -----------------------------------------------------------------------------------
>  
> -LinImage.prototype = {
> -	
> -	// initialize()
> -	// Constructor runs on completion of the DOM loading.
> -	//
> -	initialize: function() {
> -	},
> -
>  	loadImage: function(imgId) {
>  		if(IdCurrent != imgId)
>  		{
>  			IdCurrent = imgId;
> -			menuNeedsUpdating = true;	// IdCurrent changed, update menu on next hover of the menu
> +			//myLinGlobal.menuNeedsUpdating = true;	// IdCurrent changed, update menu on next hover of the menu
>  			location.hash = 'idCurrent='+IdCurrent;
>  		}
>  
> -		curLocationHash = location.hash;	// update current Hash, this value is periodically checked to reload the image if neccessary
> +		this.curLocationHash = location.hash;	// update current Hash, this value is periodically checked to reload the image if neccessary
>  
> -		if(preloadXmlFinished[imgId] && typeof xmlDoc[imgId] != "undefined" )	// use typeof to work in IE
> +		if(this.preloadXmlFinished[imgId] && typeof this.xmlDoc[imgId] != "undefined" )	// use typeof to work in IE
>  		{
>  			this.changeImage();
>  		}
> @@ -57,15 +69,23 @@
>  	
>  	loadImageXml: function(imgId) {
>  		// http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
> -		new Ajax.Request(xmlUrl + '&id=' + imgId + '&xml', {method:'get', asynchronous:true, onSuccess:this.loadImageContinue, onFailure:errFunc} );
> +		new Ajax.Request(
> +			xmlUrl + '&linId=' + imgId + '&xml',
> +			{
> +				method:'get',
> +				asynchronous:true,
> +				onSuccess:this.loadImageContinue,
> +				onFailure: function(t) { alert('Error ' + t.status + ' -- ' + t.statusText); }
> +			}
> +		);
>  	},
>  
>  	loadImageContinue: function(t) {
>  		var loadedimgid = t.responseXML.documentElement.getElementsByTagName('imgid').item(0).firstChild.data;
>  
>  		// save xml data
> -		xmlDoc[loadedimgid] = t.responseXML.documentElement;
> -		preloadXmlFinished[loadedimgid] = true;
> +		myLinImage.xmlDoc[loadedimgid] = t.responseXML.documentElement;
> +		myLinImage.preloadXmlFinished[loadedimgid] = true;
>  
>  		if( loadedimgid == IdCurrent )	// coming from loadImage()
>  		{
> @@ -77,22 +97,27 @@
>  		}
>  	},
>  
> +
> +	// -----------------------------------------------------------------------------------
> +	// Navigation functions
> +	// -----------------------------------------------------------------------------------
> +
>  	movePrev: function() {
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			clearTimeout(ssCurrentTimerID);
> +			clearTimeout(this.ssCurrentTimerID);
>  		}
>  
> -		if(prevThumbs[ prevThumbs.length - 1 ]) 
> +		if(this.prevThumbs[ this.prevThumbs.length - 1 ]) 
>  		{
>  			Element.setOpacity('ssImgPrev',0.7);
>  			new Effect.Appear('ssImgPrev', { duration: 0.5, from: 0.7, to: 1.0 });
> -			myLinImage.loadImage(prevThumbs[ prevThumbs.length - 1 ]);
> +			myLinImage.loadImage(this.prevThumbs[ this.prevThumbs.length - 1 ]);
>  			
> -			if( slideshowActive )
> +			if( this.slideshowActive )
>  			{
> -				clearTimeout(ssCurrentTimerID);
> -				ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +				clearTimeout(this.ssCurrentTimerID);
> +				this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  			}
>  		}
>  		else	// end reached, do nothing but enable keyboard navigation again
> @@ -100,24 +125,24 @@
>  			myLinImage.enableKeyboardNav();
>  		}
>  
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  	},
>  	moveNext: function() {
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			clearTimeout(ssCurrentTimerID);
> +			clearTimeout(this.ssCurrentTimerID);
>  		}
>  
> -		if(nextThumbs[0])
> +		if(this.nextThumbs[0])
>  		{
>  			Element.setOpacity('ssImgNext',0.7);
>  			new Effect.Appear('ssImgNext', { duration: 0.5, from: 0.7, to: 1.0 });
> -			myLinImage.loadImage(nextThumbs[0]);
> +			myLinImage.loadImage(this.nextThumbs[0]);
>  		}
> -		else if( ssLoop )
> +		else if( this.ssLoop )
>  		{
>  			Element.setOpacity('ssImgNext',0.7);
>  			new Effect.Appear('ssImgNext', { duration: 0.5, from: 0.7, to: 1.0 });
> @@ -128,63 +153,67 @@
>  			myLinImage.enableKeyboardNav();
>  		}
>  
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  	},
>  	moveFirst: function() {
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			clearTimeout(ssCurrentTimerID);
> +			clearTimeout(this.ssCurrentTimerID);
>  		}
>  
>  		Element.setOpacity('ssImgFirst',0.7);
>  		new Effect.Appear('ssImgFirst', { duration: 0.5, from: 0.7, to: 1.0 });
>  		myLinImage.loadImage( firstImgId );
>  
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  	},
>  	moveLast: function() {
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			clearTimeout(ssCurrentTimerID);
> +			clearTimeout(this.ssCurrentTimerID);
>  		}
>  
>  		Element.setOpacity('ssImgLast',0.7);
>  		new Effect.Appear('ssImgLast', { duration: 0.5, from: 0.7, to: 1.0 });
>  		myLinImage.loadImage( lastImgId );
>  
> -		if( slideshowActive )
> +		if( this.slideshowActive )
>  		{
> -			ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  	},
>  
> -	//
> -	//	changeImage()
> -	//
> +	// -----------------------------------------------------------------------------------
> +	// Change image functions
> +	// -----------------------------------------------------------------------------------
> +
> +	/**
> +	 * changeImage()
> +	 */
>  	changeImage: function() {	
>  		
>  		/**
>  		 * set height of outer div to prevent the whole page getting smaller, and if the image is loaded getting bigger again
>  		 * but in fullscreen, we want no activities in background
>  		 */
> -		if(! fullscreenActive) {
> +		if(! this.fullscreenActive) {
>  			$('divimage').style.height = $('mainImage').style.height;
>  		}
>  
>  		/**
>  		 * hide elements during transition
>  		 */
> -		hideImgInfoNow();	// hide meta text immediately
> +		this.hideImgInfoNow();	// hide meta text immediately
>  		Element.hide('mainImage');	// hide mainimage while changing image to prevent flicker
>  		Element.hide('divinfolinks');
>  
> -		if(! preloadImageFinished[IdCurrent] )
> +		if(! this.finishedPreloadedImages[IdCurrent] )
>  		{
>  			Element.show('divloading');
>  		}
> @@ -196,9 +225,9 @@
>  		/**
>  		 * set image width and height
>  		 */
> -			var orgWidth = xmlDoc[IdCurrent].getElementsByTagName('imgwidth').item(0).firstChild.data;
> -			var orgHeight = xmlDoc[IdCurrent].getElementsByTagName('imgheight').item(0).firstChild.data;
> -			var sizeArray = scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
> +			var orgWidth = this.xmlDoc[IdCurrent].getElementsByTagName('imgwidth').item(0).firstChild.data;
> +			var orgHeight = this.xmlDoc[IdCurrent].getElementsByTagName('imgheight').item(0).firstChild.data;
> +			var sizeArray = this.scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
>  			var imgWidth = sizeArray[0];
>  			var imgHeight = sizeArray[1];
>  
> @@ -216,16 +245,16 @@
>  		 * and hence the image was not resized correctly in resizeImageContainer() !!!
>  		 */
>  		imgPreloader.onload=function(){
> -			preloadImageFinished[IdCurrent] = true;
> +			myLinImage.finishedPreloadedImages[IdCurrent] = true;
>  			$('mainImage').src = currentImgSrc;
>  			myLinImage.resizeImageContainer(imgWidth, imgHeight);
>  		}
>  		imgPreloader.src = currentImgSrc;
>  	},
>  
> -	//
> -	//	resizeImageContainer()
> -	//
> +	/**
> +	 * resizeImageContainer()
> +	 */
>  	resizeImageContainer: function( imgWidth, imgHeight) {
>  
>  		// get current height and width
> @@ -260,16 +289,17 @@
>  		this.showImage();
>  	},
>  	
> -	//
> -	//	showImage()
> -	//	Display image and begin preloading next images.
> -	//
> +	/**
> +	 * showImage()
> +	 * 
> +	 * Display image and begin preloading next images.
> +	 */
>  	showImage: function(){
>  		Element.hide('divloading');
>  		
>  		if( useEffects )
>  		{
> -			new Effect.Appear('mainImage', { duration: 0.5, afterFinish: function(){	myLinImage.setImageData(); } });
> +			new Effect.Appear('mainImage', { duration: 0.5, afterFinish: function(){   myLinImage.setImageData(); } });
>  		}
>  		else
>  		{
> @@ -277,7 +307,8 @@
>  			this.setImageData()
>  		}
>  
> -		if(! fullscreenActive) {
> +		if(! this.fullscreenActive)
> +		{
>  			$('divimage').style.height = $('mainImage').style.height;	// reset to correct height to prevent trouble if image is bigger or smaller
>  		}
>  
> @@ -286,17 +317,38 @@
>  		 */
>  		if( typeof $('title') != 'undefined' )
>  		{
> -			$('title').innerHTML = xmlDoc[IdCurrent].getElementsByTagName('title').item(0).firstChild.data;
> +			$('title').innerHTML = this.xmlDoc[IdCurrent].getElementsByTagName('title').item(0).firstChild.data;
>  		}
>  
>  		this.enableKeyboardNav();
> -
>  	},
>  
> +	/**
> +	 * setImageData()
> +	 */
> +	setImageData: function()
> +	{
> +		this.setImageInfoLink();	// show the "info" link, must be called after Appear('mainImage')
>  
> -	setImageData: function() {
> -	
> -		this.setImageInfoLink();
> +		/**
> +		 * update the menu
> +		 */
> +			/**
> +			 * replace the image ids in the menu
> +			 * replace( /linId=[0-9]* /g , "linId=" + IdCurrent );
> +			 * its just an search/replace of 'linId=x' in the menu
> +			 * its very fast (about 0 - 15ms) and its executed every time the image changes
> +			 */
> +			$('menu').innerHTML = $('menu').innerHTML.replace( /linId=[0-9]*/g , "linId=" + IdCurrent );
> +			
> +			/**
> +			 * replace the width and height dimensions of the view at fullscreen link
> +			 */
> +			var orgWidth = this.xmlDoc[IdCurrent].getElementsByTagName('imgwidth').item(0).firstChild.data;
> +			var orgHeight = this.xmlDoc[IdCurrent].getElementsByTagName('imgheight').item(0).firstChild.data;
> +			$('linLiViewAtFullscreen').innerHTML = $('linLiViewAtFullscreen').innerHTML.replace( /width=[0-9]*/ , "width=" + orgWidth );
> +			$('linLiViewAtFullscreen').innerHTML = $('linLiViewAtFullscreen').innerHTML.replace( /height=[0-9]*/ , "height=" + orgHeight );
> +			$('linLiViewAtFullscreen').innerHTML = $('linLiViewAtFullscreen').innerHTML.replace( /[0-9]*x[0-9]*/ , orgWidth + "x" + orgHeight );
>  
>  		/**
>  		 * set current thumb
> @@ -307,13 +359,13 @@
>  		 * set prev thumbs
>  		 */
>  		$('thumbnavi_prevthumb').innerHTML = '';
> -		prevThumbs = new Array();
> -		if(xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length > 0)
> +		this.prevThumbs = new Array();
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length > 0)
>  		{
> -			for(var i = 0; i < xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length; i++)
> +			for(var i = 0; i < this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length; i++)
>  			{
> -				var thumbId = xmlDoc[IdCurrent].getElementsByTagName('prevthumb').item(i).firstChild.data;
> -				prevThumbs[i] = thumbId;
> +				var thumbId = this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').item(i).firstChild.data;
> +				this.prevThumbs[i] = thumbId;
>  				this.setPrevNextThumb(thumbId, 'thumbnavi_prevthumb');
>  			}
>  		}
> @@ -322,13 +374,13 @@
>  		 * set next thumbs
>  		 */
>  		$('thumbnavi_nextthumb').innerHTML = '';
> -		nextThumbs = new Array();
> -		if(xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length > 0)
> +		this.nextThumbs = new Array();
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length > 0)
>  		{
> -			for(var i = 0; i < xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length; i++)
> +			for(var i = 0; i < this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length; i++)
>  			{
> -				var thumbId = xmlDoc[IdCurrent].getElementsByTagName('nextthumb').item(i).firstChild.data;
> -				nextThumbs[i] = thumbId;
> +				var thumbId = this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').item(i).firstChild.data;
> +				this.nextThumbs[i] = thumbId;
>  				this.setPrevNextThumb(thumbId, 'thumbnavi_nextthumb');
>  			}
>  		}
> @@ -336,13 +388,13 @@
>  		/**
>  		 * set meta data
>  		 */
> -		if(xmlDoc[IdCurrent].getElementsByTagName('meta').length > 0)
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('meta').length > 0)
>  		{
>  			$('divmeta').innerHTML = '';
>  	
> -			for(var i = 0; i < xmlDoc[IdCurrent].getElementsByTagName('meta').length; i++)
> +			for(var i = 0; i < this.xmlDoc[IdCurrent].getElementsByTagName('meta').length; i++)
>  			{
> -				var meta = xmlDoc[IdCurrent].getElementsByTagName('meta').item(i);
> +				var meta = this.xmlDoc[IdCurrent].getElementsByTagName('meta').item(i);
>  				var metaname = document.createTextNode( meta.getElementsByTagName('name').item(0).firstChild.data + ': ' );
>  				var metavalue = document.createTextNode( meta.getElementsByTagName('value').item(0).firstChild.data );
>  	
> @@ -355,13 +407,13 @@
>  		/**
>  		 * set comments
>  		 */
> -		initTextareaAddComment();
> +		this.initTextareaAddComment();
>  		$('divcomments').innerHTML = '';
> -		if(xmlDoc[IdCurrent].getElementsByTagName('comment').length > 0)
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('comment').length > 0)
>  		{
> -			for(var i = 0; i < xmlDoc[IdCurrent].getElementsByTagName('comment').length; i++)
> +			for(var i = 0; i < this.xmlDoc[IdCurrent].getElementsByTagName('comment').length; i++)
>  			{
> -				var tagcomment = xmlDoc[IdCurrent].getElementsByTagName('comment').item(i);
> +				var tagcomment = this.xmlDoc[IdCurrent].getElementsByTagName('comment').item(i);
>  				var commenttime = document.createTextNode( tagcomment.getElementsByTagName('time').item(0).firstChild.data + ' by ' );
>  				var commentauthor = document.createTextNode( tagcomment.getElementsByTagName('author').item(0).firstChild.data );
>  				var commenttext = document.createTextNode( tagcomment.getElementsByTagName('text').item(0).firstChild.data );
> @@ -389,7 +441,7 @@
>  		 * set image nr
>  		 * currently only in slideshow used
>  		 */
> -		$('divSlideshowImgNr').innerHTML = xmlDoc[IdCurrent].getElementsByTagName('imgnr').item(0).firstChild.data;
> +		$('divSlideshowImgNr').innerHTML = this.xmlDoc[IdCurrent].getElementsByTagName('imgnr').item(0).firstChild.data;
>  		
>  		
>  		/**
> @@ -398,8 +450,13 @@
>  		this.preloadXml();
>  		
>  	
> -	},	// end function setImageData()
> +	},
>  	
> +	/**
> +	 * setPrevNextThumb()
> +	 * 
> +	 * code to generate a thumbnail with a <div><a><img> tag
> +	 */
>  	setPrevNextThumb: function(thumbId, divId)
>  	{
>  		var ElemImg = Builder.node('img', {id: 'thumb'+thumbId, className: 'img_prevnextthumb', src: thumbSrc + thumbId});
> @@ -410,48 +467,37 @@
>  		ElemDiv.appendChild( ElemA );
>  		$(divId).appendChild(ElemDiv);
>  		
> -		if(! preloadImageFinished[thumbId]) {
> +		if(! this.finishedPreloadedImages[thumbId]) {
>  			Element.setOpacity('thumb'+thumbId,0.5);
>  		}
>  
>  	},
>  	
> +
> +	// -----------------------------------------------------------------------------------
> +	// Keyboard actions
> +	// -----------------------------------------------------------------------------------
> +
>  	/**
> -	 * setImageInfoLink
> -	 * 
> -	 * set positions of info link
> -	 * could only be done after image has been completly loaded
> +	 * enableKeyboardNav()
>  	 */
> -	setImageInfoLink: function()
> -	{
> -		if(! fullscreenActive)
> -		{
> -			$('divinfolinks').style.top = $('mainImage').offsetTop + $('mainImage').offsetHeight;
> -			$('divinfolinks').style.left = $('mainImage').offsetLeft + $('mainImage').offsetWidth - 50; // 50: value of view_img.css width = 50px; can't get width with javascript because element is hidden
> -			Element.show('divinfolinks');
> -		}
> -	},
> -
> -	//
> -	//	enableKeyboardNav()
> -	//
>  	enableKeyboardNav: function() {
>  		document.onkeydown = this.keyboardAction; 
>  	},
>  
> -	//
> -	//	disableKeyboardNav()
> -	//
> +	/**
> +	 * disableKeyboardNav()
> +	 */
>  	disableKeyboardNav: function() {
>  		document.onkeydown = '';
>  	},
>  
> -	//
> -	//	keyboardAction()
> -	//
> -	// very nice
> -	// http://www.mediaevent.de/javascript/needful_tables.html
> -	//
> +	/**
> +	 * keyboardAction()
> +	 * 
> +	 * very nice
> +	 * http://www.mediaevent.de/javascript/needful_tables.html
> +	 */
>  	keyboardAction: function(e) {
>  		
>  		if (e == null) { // ie
> @@ -492,7 +538,7 @@
>  		}
>  		else if ((keycode == 122))									// F11
>  		{
> -			if( fullscreenActive ) {
> +			if( this.fullscreenActive ) {
>  				$('divSlideshowExit').show();		// hide exit button to force exit again with F11
>  				myLinImage.fullscreenStop();
>  			} else {
> @@ -512,26 +558,31 @@
>  			myLinImage.moveLast();
>  			return false;
>  		}
> -		else if( fullscreenActive && ((key == 'f') || (key == 'x') || (key == 'o') || (key == 'c') )	) // close fullscreen
> +		else if( this.fullscreenActive && ((key == 'f') || (key == 'x') || (key == 'o') || (key == 'c') )	) // close fullscreen
>  		{
>  			myLinImage.fullscreenStop();
>  		}
> -		else if(fullscreenActive &&  key == 's')	// start/stop slideshow
> +		else if(this.fullscreenActive &&  key == 's')	// start/stop slideshow
>  		{
>  			myLinImage.slideshowStartStop();
>  		}
> -		else if(fullscreenActive && key == 'p')		// display previous image
> +		else if(this.fullscreenActive && key == 'p')		// display previous image
>  		{
>  			myLinImage.disableKeyboardNav();
>  			myLinImage.movePrev();
>  		}
> -		else if(fullscreenActive && key == 'n')		// display next image
> +		else if(this.fullscreenActive && key == 'n')		// display next image
>  		{
>  			myLinImage.disableKeyboardNav();
>  			myLinImage.moveNext();
>  		}
>  	},
>  
> +
> +	// -----------------------------------------------------------------------------------
> +	// Preload functions
> +	// -----------------------------------------------------------------------------------
> +
>  	/**
>  	 * preloadXml()
>  	 * Preload previous and next images.
> @@ -544,16 +595,17 @@
>  	preloadXml: function() {
>  
>  		// preload nextthumb from left to right
> -		if(xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length > 0)
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length > 0)
>  		{
> -			for(var i = 0; i < xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length; i++)
> +			for(var i = 0; i < this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').length; i++)
>  			{
> -				var imgId = xmlDoc[IdCurrent].getElementsByTagName('nextthumb').item(i).firstChild.data;
> -				if(! preloadXmlFinished[imgId])
> +				var imgId = this.xmlDoc[IdCurrent].getElementsByTagName('nextthumb').item(i).firstChild.data;
> +
> +				if(! this.preloadXmlFinished[imgId])
>  				{
>  					this.loadImageXml(imgId);
>  				}
> -				else if(! preloadImageFinished[imgId] )
> +				else if(! this.finishedPreloadedImages[imgId] )
>  				{
>  					this.preloadImage(imgId);
>  				}
> @@ -561,16 +613,16 @@
>  		}
>  
>  		// preload prevthumb from right to left
> -		if(xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length > 0)
> +		if(this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length > 0)
>  		{
> -			for(var i = xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length-1; i >= 0; i--)
> +			for(var i = this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').length-1; i >= 0; i--)
>  			{
> -				var imgId = xmlDoc[IdCurrent].getElementsByTagName('prevthumb').item(i).firstChild.data;
> -				if(! preloadXmlFinished[imgId])
> +				var imgId = this.xmlDoc[IdCurrent].getElementsByTagName('prevthumb').item(i).firstChild.data;
> +				if(! this.preloadXmlFinished[imgId])
>  				{
>  					this.loadImageXml(imgId);
>  				}
> -				else if(! preloadImageFinished[imgId] )
> +				else if(! this.finishedPreloadedImages[imgId] )
>  				{
>  					this.preloadImage(imgId);
>  				}
> @@ -583,35 +635,34 @@
>  	 * 
>  	 * will be called after getting the xml data 
>  	 */
> -	preloadImage: function(imgId) {
> -		if(! preloadImageFinished[imgId] )
> +	preloadImage: function(imgId)
> +	{
> +		if(! this.finishedPreloadedImages[imgId] )
>  		{
>  			/**
>  			 * set image width and height
>  			 */
> -				var orgWidth = xmlDoc[imgId].getElementsByTagName('imgwidth').item(0).firstChild.data;
> -				var orgHeight = xmlDoc[imgId].getElementsByTagName('imgheight').item(0).firstChild.data;
> -				var sizeArray = scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
> +				var orgWidth = this.xmlDoc[imgId].getElementsByTagName('imgwidth').item(0).firstChild.data;
> +				var orgHeight = this.xmlDoc[imgId].getElementsByTagName('imgheight').item(0).firstChild.data;
> +				var sizeArray = this.scaleToFit(orgWidth,orgHeight,maxImageWidth,maxImageHeight,1);
>  				var imgWidth = sizeArray[0];
>  				var imgHeight = sizeArray[1];
>  	
> -			var currentImgSrc = imageSrc + imgId + '&width=' + imgWidth + '&height=' + imgHeight;
> -	
>  			/**
>  			 * preload image
>  			 */
> -			preloadImage[imgId] = new Image();
> +			this.preloadImageSrc[imgId] = new Image();
>  	
> -			preloadImage[imgId].onload=function(){
> +			this.preloadImageSrc[imgId].onload=function(){
>  				myLinImage.preloadImageFinished(imgId);
>  			}
> -			preloadImage[imgId].src = currentImgSrc;
> +			this.preloadImageSrc[imgId].src = imageSrc + imgId + '&width=' + imgWidth + '&height=' + imgHeight;
>  		}
>  	},
>  	
>  	preloadImageFinished: function(imgId) {
>  
> -		preloadImageFinished[imgId] = true;
> +		this.finishedPreloadedImages[imgId] = true;
>  
>  		if( $('thumb'+imgId) )	// maybe its not here anymore
>  		{
> @@ -619,16 +670,21 @@
>  		}
>  
>  	},
> +
> +
> +	// -----------------------------------------------------------------------------------
> +	// Slideshow functions
> +	// -----------------------------------------------------------------------------------
>  	
>  	fullscreenStart: function()
>  	{
> -		fullscreenActive = true;
> +		this.fullscreenActive = true;
>  
>  		/**
>  		 * save old values to restore if slideshow ends
>  		 */
> -		fullscreenOldMaxWidth = maxImageWidth;
> -		fullscreenOldMaxHeight = maxImageHeight;
> +		this.fullscreenOldMaxWidth = maxImageWidth;
> +		this.fullscreenOldMaxHeight = maxImageHeight;
>  
>  		/**
>  		 * disable scrollbars
> @@ -653,17 +709,15 @@
>  		 */
>  		onWindowResize();
>  	},
> -
> -
>  	fullscreenStop: function()
>  	{
> -		fullscreenActive = false;
> +		this.fullscreenActive = false;
>  
>  		/**
>  		 * restore max image size
>  		 */
> -		maxImageWidth = fullscreenOldMaxWidth;
> -		maxImageHeight = fullscreenOldMaxHeight;
> +		maxImageWidth = this.fullscreenOldMaxWidth;
> +		maxImageHeight = this.fullscreenOldMaxHeight;
>  
>  		/**
>  		 * re-enable scrollbars
> @@ -673,7 +727,7 @@
>  		/**
>  		 * delete preloaded images after stopping fullscreen
>  		 */
> -		preloadImageFinished = new Array();
> +		this.finishedPreloadedImages = new Array();
>  
>  		/**
>  		 * end slideshow with some superduper effects
> @@ -697,75 +751,242 @@
>  	slideshowStartStop: function()
>  	{
>  		// start Slideshow
> -		if(! slideshowActive)
> +		if(! this.slideshowActive)
>  		{
> -			slideshowActive = true;
> +			this.slideshowActive = true;
>  			Element.setOpacity('ssImgStart',0.7);
> -			ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  		else	// stop Slideshow
>  		{
> -			slideshowActive = false;
> +			this.slideshowActive = false;
>  			Element.setOpacity('ssImgStart',1);
> -			clearTimeout(ssCurrentTimerID);
> +			clearTimeout(this.ssCurrentTimerID);
>  		}
>  	},
>  	slideshowPlay: function()
>  	{
> -		if(nextThumbs[0] || ssLoop)
> +		if(this.nextThumbs[0] || this.ssLoop)
>  		{
>  			this.moveNext();
> -			//ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", ssCurrentDelay);
> +			//this.ssCurrentTimerID = setTimeout("myLinImage.slideshowPlay()", this.ssCurrentDelay);
>  		}
>  		else
>  		{
>  			// force stop slideshow
> -			slideshowActive = true;
> +			this.slideshowActive = true;
>  			this.slideshowStartStop();
>  		}
>  	},
>  
>  	slideshowChangeDelay: function()
>  	{
> -		ssCurrentDelay = $('ssDelay').options[ $('ssDelay').selectedIndex ].value * 1000;
> +		this.ssCurrentDelay = $('ssDelay').options[ $('ssDelay').selectedIndex ].value * 1000;
>  		//document.optionsForm.delay.options[document.optionsForm.delay.selectedIndex].value * 1000;
>  	},
>  	slideshowChangeLoop: function()
>  	{
> -		if(! ssLoop) {
> -			ssLoop = true;
> +		if(! this.ssLoop) {
> +			this.ssLoop = true;
>  			Element.setOpacity('ssImgLoop',0.7);
>  		} else {
> -			ssLoop = false;
> +			this.ssLoop = false;
>  			Element.setOpacity('ssImgLoop',1);			
>  		}
>  	},
>  	slideshowChangeRandom: function()
>  	{
> -		if(! ssRandom) {
> -			ssRandom = true;
> +		if(! this.ssRandom) {
> +			this.ssRandom = true;
>  			Element.setOpacity('ssImgRandom',0.7);
>  		} else {
> -			ssRandom = false;
> +			this.ssRandom = false;
>  			Element.setOpacity('ssImgRandom',1);			
>  		}
>  		alert('This feature is currently not implemented, do we really need that?');
> +	},
> +
> +
> +	// -----------------------------------------------------------------------------------
> +	// Image info functions
> +	// -----------------------------------------------------------------------------------
> +
> +	/**
> +	 * setImageInfoLink()
> +	 * 
> +	 * positions the info link on bottom right of the image
> +	 * could onl...
 
[truncated message content]