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

[<fan...@us...>]

Revision: 4765
          http://linpha.svn.sourceforge.net/linpha/?rev=4765&view=rev
Author:   fangehrn
Date:     2007-08-19 15:48:44 -0700 (Sun, 19 Aug 2007)

Log Message:
-----------
  - auto height and width for google map
  - started adding thumb navigation

Modified Paths:
--------------
    trunk/linpha2/ChangeLog
    trunk/linpha2/lib/classes/linpha.sql.class.php
    trunk/linpha2/lib/js/LinGlobal.js
    trunk/linpha2/lib/js/LinThumbnails.js
    trunk/linpha2/lib/plugins/maps/module.exampleMap.php
    trunk/linpha2/templates/default/map.head.php

Modified: trunk/linpha2/ChangeLog
===================================================================
--- trunk/linpha2/ChangeLog	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/ChangeLog	2007-08-19 22:48:44 UTC (rev 4765)
@@ -2,7 +2,12 @@
  * adding google maps support
   - modified gmapper class: increased the number of paragraphs "no image at this zoomlevel"
     used to auto zoom out
+    would be better if it is somehow possible to find out the number of the small map images
+    and only zoom out if all small images are not shown, it is now sometimes very annoying
+    when auto zoom out happens while zooming in -> turned off tilecheck completly
   - show thumbnails on google maps
+  - auto height and width for google map
+  - started adding thumb navigation
 
 2007-08-18 flo
  * adding google maps support

Modified: trunk/linpha2/lib/classes/linpha.sql.class.php
===================================================================
--- trunk/linpha2/lib/classes/linpha.sql.class.php	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/lib/classes/linpha.sql.class.php	2007-08-19 22:48:44 UTC (rev 4765)
@@ -699,7 +699,6 @@
 		 * because if we try to get infos from an id which doesn't exist anymore
 		 * we would run in an endless loop
 		 */
-		
 		if($i == 1000)
 		{
 			linSysLog(i18n("Error: cannot get informations, you want to run the database cleanup script"));

Modified: trunk/linpha2/lib/js/LinGlobal.js
===================================================================
--- trunk/linpha2/lib/js/LinGlobal.js	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/lib/js/LinGlobal.js	2007-08-19 22:48:44 UTC (rev 4765)
@@ -167,6 +167,7 @@
 	 * 
 	 * sets two variables with the scroll offset
 	 * takes care of browser incompatibilites
+	 * @uses  linSyslog()
 	 */
 	setScrollSize: function()
 	{
@@ -211,3 +212,23 @@
 
 //Event.observe(window, 'load', initLinGlobal, false);
 initLinGlobal();
+
+
+/**
+ * on resize functions
+ */
+function linEnableOnResize()
+{
+	Event.observe(window, 'resize', linOnResizeCreateTrigger, false);	
+}
+
+/**
+ * resizeWindow, use this wrapper function because internet explorer triggers the resize event to fast
+ * 
+ * linOnResizeWrapper() must be defined where it's actually used (LinThumbnails.js, LinMapView.js)
+ */
+function linOnResizeCreateTrigger()
+{
+	clearTimeout(this.timerResize);
+	this.timerResize = setTimeout(linOnResizeWrapper,250); 
+}

Modified: trunk/linpha2/lib/js/LinThumbnails.js
===================================================================
--- trunk/linpha2/lib/js/LinThumbnails.js	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/lib/js/LinThumbnails.js	2007-08-19 22:48:44 UTC (rev 4765)
@@ -384,28 +384,10 @@
 	{
 		location.href = linUrlBase + '&linId=' + linImgIds[0]['id'] + '&slideshow';
 	},
-
-	/**
-	 * resizeWindow, use this wrapper function because internet explorer triggers the resize event to fast
-	 */
-	resizeWindow: function ()
-	{
-		clearTimeout(this.timerResize);
-		this.timerResize = setTimeout(linThumbnailsWrapper,250); 
-	}
 }
 
-/**
- * linThumbnailsWrapper()
- * 
- * use this wrapper function if called from setTimeout()
- * because 'this.' would not work otherwise
- */
-function linThumbnailsWrapper()
-{
-	myLinThumbnails.displayThumbs();
-}
 
+
 /**
  * initLinThumbnails()
  * 
@@ -414,9 +396,14 @@
 function initLinThumbnails()
 {
 	myLinThumbnails = new LinThumbnails();
-	Event.observe(window, 'resize', myLinThumbnails.resizeWindow, false);
-	
+
+	linEnableOnResize();
 	myLinThumbnails.displayThumbs();
 }
 
+function linOnResizeWrapper()
+{
+	myLinThumbnails.displayThumbs();
+}
+
 Event.observe(window, 'load', initLinThumbnails, false);

Modified: trunk/linpha2/lib/plugins/maps/module.exampleMap.php
===================================================================
--- trunk/linpha2/lib/plugins/maps/module.exampleMap.php	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/lib/plugins/maps/module.exampleMap.php	2007-08-19 22:48:44 UTC (rev 4765)
@@ -1,115 +1,149 @@
 <?php
 require_once(LINPHA_DIR."/lib/plugins/maps/gmapper1/class.gmapper.php");
-$key = "ABQIAAAAAXCMfho4_sqSSh0VqMB80xT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSfO_6bbb_ScfT_zPgcnJMKyGltOg";	// key for http://localhost
 
-$GLOBALS['linpha']->template->output['googleMap'] = new gmap($key);
+if(isset($_GET['albId'])) {
+	$albId = intval($_GET['albId']);
+}
 
-ob_start();
-
-?>
-<div id="gmapper_map" style="height: 800px;"></div>
-
-<input type="text" id="adresse" size="30">
-<input type="button" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
-	"getAdress()", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/dash.png",32,32)); ?>" value="Geocode"> <br>
-<br /><br />
-<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
-	"Berlin", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/143.png",20,34)); ?>">Berlin</a><br>
-<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
-	"Muenchen", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/rot.png",20,34), 10); ?>">M&uuml;nchen</a><br>
-<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
-	"Koelner Dom", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/gruen.png",20,34), 17); ?>">K&ouml;lner Dom</a>
-
-<?php
-
-$GLOBALS['linpha']->template->output['googleMap']->map(
-	$zoom = 4,
-	$lat = '49.980067',
-	$lng = '10.8731',
-	$type = "hybrid",
-	$min_zoom = 1,
-	$max_zoom = 23,
-	$navcontrol = "large",
-	$overview = 1,
-	$mousezoom = 1,
-	$tilecheck = 1
-);
-
-$GLOBALS['linpha']->template->output['googleMap']->markstart();
-
-$tabs = array(
-    array('Tab 1', 'Content1'),
-    array('Tab 2', 'Lorem Ipsum Dolor sit amet Lorem Ipsum <br>Lorem Ispum'),
-    array('Tab 3', 'Lorem Ipsum Dolor sit amet Lorem Ipsum ')
-    );
-$GLOBALS['linpha']->template->output['googleMap']->tabMarker('52.6', '11.9' , $tabs, array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/gruen.png",20,34));
-
-
-
-
-$query = $GLOBALS['linpha']->db->Execute("SELECT id, gpslatituderef,gpslatitude,gpslongituderef,gpslongitude " .
+$query = $GLOBALS['linpha']->db->Execute("SELECT P.id, P.parent_id, P.name, gpslatituderef,gpslatitude,gpslongituderef,gpslongitude " .
 		"FROM ".LIN_PREFIX."meta_exif E INNER JOIN ".LIN_PREFIX."photos P on E.md5sum = P.md5sum " .
 		"WHERE gpslatituderef IS NOT NULL " .
 		"AND gpslatitude IS NOT NULL " .
 		"AND gpslongituderef IS NOT NULL " .
-		"AND gpslongitude IS NOT NULL");
+		"AND gpslongitude IS NOT NULL ");
 while($data = $query->FetchRow())
 {
-	$latlon = parsePJMTLatLon($data);
-	$GLOBALS['linpha']->template->output['googleMap']->otherMarker(
-		$latlon['gpslatitude'],
-		$latlon['gpslongitude'] , 
-		'<img src="'.LINPHA_CLIENT.'/get_thumb.php?linId='.$data['id'].'" />', 
-		array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/gelb.png",20,34)
-	);
+	$arrImg[] = $data;
+	$parentIds[ $data['parent_id'] ] = true;
 }
 
+$key = "ABQIAAAAAXCMfho4_sqSSh0VqMB80xT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSfO_6bbb_ScfT_zPgcnJMKyGltOg";	// key for http://localhost
+$GLOBALS['linpha']->template->output['googleMap'] = new gmap($key);
 
 
+/**
+ * here starts the output
+ */
+ob_start();
 
-$GLOBALS['linpha']->template->output['googleMap']->markend();
+?>
+	<div id="linDivMapTop">
+		<?php
+		echo i18n("Please select the album to show in Google Maps:");
+		echo '<br /><br /><a href="'.LINPHA_LINK.'&amp;linCat=map&amp;albId=0">'.i18n("All albums").'</a><br />';
+		
+		foreach($parentIds as $id=>$value)
+		{
+			echo '<a href="'.LINPHA_LINK.'&amp;linCat=map&amp;albId='.$id.'">';
+			echo implode( '/', LinSql::getFullFilenameFromId($id) );
+			echo '</a><br />';
+		}
+		?>
+		<br />
+	</div>
+	
+	<div id="linDivMapMain" style="height: 475px;">
+		<div id="linDivMapNav" style="width: 155px; height: 475px; float: right; overflow: auto; padding-left: 2px; padding-right: 1px;">
+		Nav
+		<br /><br /><br /><br /><br /><br /><br /><br /><br />tset
+		<br /><br /><br /><br /><br /><br /><br /><br /><br />tset
+		<br /><br /><br /><br /><br /><br /><br /><br /><br />tset
+		<br /><br /><br /><br /><br /><br /><br /><br /><br />tset
+		<br /><br /><br /><br /><br /><br /><br /><br /><br />tset
+		</div>
+		<div style="width: 5px; height: 100%; float: right; cursor: e-resize; background-color: grey; border: 1px solid black;" ondblClick="linToggleNav();"></div>
+		<div id="gmapper_map" style="height: 100%; margin-right: 165px; "></div>
+	</div>
+	
+	<div id="linDivMapBottom">
+		<input type="text" id="adresse" size="30">
+		<input type="button" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
+			"getAdress()", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/dash.png",32,32)); ?>" value="Geocode"> <br>
+		<br /><br />
+		<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
+			"Berlin", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/143.png",20,34)); ?>">Berlin</a><br />
+		<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
+			"Muenchen", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/rot.png",20,34), 10); ?>">M&uuml;nchen</a><br />
+		<a href="javascript:void(0)" onclick="<?php $GLOBALS['linpha']->template->output['googleMap']->geocode(
+			"Koelner Dom", "otherMarker", array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/gruen.png",20,34), 17); ?>">K&ouml;lner Dom</a>
+	</div>
+<?php
+	$GLOBALS['linpha']->template->output['googleMap']->map(
+		$zoom = 4,
+		$lat = '49.9801',
+		$lng = '10.8731',
+		$type = "hybrid",
+		$min_zoom = 1,
+		$max_zoom = 23,
+		$navcontrol = "large",
+		$overview = 1,
+		$mousezoom = 1,
+		$tilecheck = 0
+	);
+if(isset($albId))
+{
+	$GLOBALS['linpha']->template->output['googleMap']->markstart();
+	$GLOBALS['linpha']->template->output['googleMap']->bounds();
+	//$GLOBALS['linpha']->template->output['googleMap']->lockMap(); not needed
+	
+	foreach($arrImg as $data)
+	{
+		if($albId == 0 OR $albId == $data['parent_id'])
+		{
+			$latlon = parsePJMTLatLon($data);
+			$GLOBALS['linpha']->template->output['googleMap']->otherMarker(
+				$latlon['gpslatitude'],
+				$latlon['gpslongitude'] , 
+				'<img src="'.LINPHA_CLIENT.'/get_thumb.php?linId='.$data['id'].'" width="'.
+					$GLOBALS['linpha']->sql->config->value['sys_style_thumb_size_max'].'" height="'.
+					$GLOBALS['linpha']->sql->config->value['sys_style_thumb_size_max'].'" /><br />'.$data['name'], 
+				array(LINPHA_CLIENT."/lib/plugins/maps/gmapper1/gelb.png",20,34)
+			);
+			$GLOBALS['linpha']->template->output['googleMap']->boundsExtend();
+		}
+	}
+	
+	$GLOBALS['linpha']->template->output['googleMap']->zoomToBounds();
+	$GLOBALS['linpha']->template->output['googleMap']->markend();
 
+	/*$gpoint = $GLOBALS['linpha']->template->output['googleMap']->getGeoPoint("Saarbr\xFCcken Saarland Deutschland");
+	// Wir f\xFCgen einige Marker hinzu
+	$GLOBALS['linpha']->template->output['googleMap']->markstart();
+	$GLOBALS['linpha']->template->output['googleMap']->marker($gpoint[0], $gpoint[1], "dash.png");
+	$GLOBALS['linpha']->template->output['googleMap']->mapMarker('52.5', '13', "dash.png");
+	$GLOBALS['linpha']->template->output['googleMap']->mapMarker('48', '11', "gruen.png");
+	$GLOBALS['linpha']->template->output['googleMap']->marker('47.5', '13', "gelb.png");
+	// Marker mit Infoblase
+	$GLOBALS['linpha']->template->output['googleMap']->otherMarker('51.5', '12' , 'Text hier', "gelb.png");
+	$GLOBALS['linpha']->template->output['googleMap']->otherMarker('51', '10' , 'Hallo Welt!');
+	$tabs = array(
+	    array('Tab 1', 'Content1'),
+	    array('Tab 2', 'Lorem Ipsum Dolor sit amet Lorem Ipsum <br>Lorem Ispum'),
+	    array('Tab 3', 'Lorem Ipsum Dolor sit amet Lorem Ipsum ')
+	    );
+	$GLOBALS['linpha']->template->output['googleMap']->tabMarker('52.6', '11.9' , $tabs, "gruen.png");
+	$GLOBALS['linpha']->template->output['googleMap']->linkMarker('51.0', '6.5' , "http://www.gothic-singles.de", "rot.png");
+	// Array mit Punkten zwischen denen eine Linie gezeichnet wird.
+	$punkte = array(
+	    array('53.5', '12.7'),
+	    array('52.5', '13'),
+	    array('51.5', '12'),
+	    array('51', '10'),
+	    array('48', '11'),
+	    array('47.5', '13')
+	    );
+	// Linie erzeugen
+	$GLOBALS['linpha']->template->output['googleMap']->polyline($punkte, '#FF00FF', 4, 1, "", 1);
+	$dist = $GLOBALS['linpha']->template->output['googleMap']->getDistance($punkte);
+	$GLOBALS['linpha']->template->output['googleMap']->markend();
+	echo "L\xE4nge der Linie: $dist Meter";
+	*/
+}
 
 
 
-/*$gpoint = $GLOBALS['linpha']->template->output['googleMap']->getGeoPoint("Saarbr\xFCcken Saarland Deutschland");
-// Wir f\xFCgen einige Marker hinzu
-$GLOBALS['linpha']->template->output['googleMap']->markstart();
-$GLOBALS['linpha']->template->output['googleMap']->marker($gpoint[0], $gpoint[1], "dash.png");
-$GLOBALS['linpha']->template->output['googleMap']->mapMarker('52.5', '13', "dash.png");
-$GLOBALS['linpha']->template->output['googleMap']->mapMarker('48', '11', "gruen.png");
-$GLOBALS['linpha']->template->output['googleMap']->marker('47.5', '13', "gelb.png");
-// Marker mit Infoblase
-$GLOBALS['linpha']->template->output['googleMap']->otherMarker('51.5', '12' , 'Text hier', "gelb.png");
-$GLOBALS['linpha']->template->output['googleMap']->otherMarker('51', '10' , 'Hallo Welt!');
-$tabs = array(
-    array('Tab 1', 'Content1'),
-    array('Tab 2', 'Lorem Ipsum Dolor sit amet Lorem Ipsum <br>Lorem Ispum'),
-    array('Tab 3', 'Lorem Ipsum Dolor sit amet Lorem Ipsum ')
-    );
-$GLOBALS['linpha']->template->output['googleMap']->tabMarker('52.6', '11.9' , $tabs, "gruen.png");
-$GLOBALS['linpha']->template->output['googleMap']->linkMarker('51.0', '6.5' , "http://www.gothic-singles.de", "rot.png");
-// Array mit Punkten zwischen denen eine Linie gezeichnet wird.
-$punkte = array(
-    array('53.5', '12.7'),
-    array('52.5', '13'),
-    array('51.5', '12'),
-    array('51', '10'),
-    array('48', '11'),
-    array('47.5', '13')
-    );
-// Linie erzeugen
-$GLOBALS['linpha']->template->output['googleMap']->polyline($punkte, '#FF00FF', 4, 1, "", 1);
-$dist = $GLOBALS['linpha']->template->output['googleMap']->getDistance($punkte);
-$GLOBALS['linpha']->template->output['googleMap']->markend();
-echo "L\xE4nge der Linie: $dist Meter";
-*/
 
 
-
-
-
-
 $linpha->template->output['default'] = ob_get_clean();
 
 $linpha->template->setModuleName('default');
@@ -129,12 +163,11 @@
 	    [gpslongitude] => 1879048192/134217728 (14),1207959552/134217728 (9),472055494/16777216 (28.1367000341) (Degrees Minutes Seconds East or West)
 	)*/
 	
-	// use '?' to be \x84non-greedy\x93 (http://de.wikipedia.org/wiki/Regul%C3%A4rer_Ausdruck#Gieriges_Verhalten)
-	
-	
 	foreach(array('gpslatitude','gpslongitude') as $value)
 	{
 		$arrHits = array();
+
+		// use '?' to be \x84non-greedy\x93 (http://de.wikipedia.org/wiki/Regul%C3%A4rer_Ausdruck#Gieriges_Verhalten)
 		preg_match_all('/\((.*?)\)/', $LatLon[ $value ], $arrHits);
 
 		$return[ $value ] = $arrHits[1][0] + ($arrHits[1][1] * 1/60) + ($arrHits[1][2] * 1/60 * 1/60);

Modified: trunk/linpha2/templates/default/map.head.php
===================================================================
--- trunk/linpha2/templates/default/map.head.php	2007-08-19 14:47:57 UTC (rev 4764)
+++ trunk/linpha2/templates/default/map.head.php	2007-08-19 22:48:44 UTC (rev 4765)
@@ -1,7 +1,75 @@
 <?php
 $linTpl->output['googleMap']->headjs();
+?>
+<script type="text/javascript" language="JavaScript"  src="<?php echo LINPHA_CLIENT; ?>/lib/plugins/maps/gmapper1/bodyjs.js"></script>
+<script language="JavaScript" type="text/javascript">
 
-// <body onunload="GUnload()">
-// window.addEventListener("resize", function() {showZooms()}, false);
-?>
-<script type="text/javascript" language="JavaScript"  src="<?php echo LINPHA_CLIENT; ?>/lib/plugins/maps/gmapper1/bodyjs.js"></script>
\ No newline at end of file
+var linNavIsHidden = false;
+function linToggleNav()
+{
+
+	if( linNavIsHidden )
+	{
+		// restore save margin
+		$('gmapper_map').style.marginRight = $('linDivMapNav').style.marginRight;
+		$('linDivMapNav').style.marginRight = 0; 
+		
+		Element.show('linDivMapNav');
+		
+		linNavIsHidden = false;
+	}
+	else
+	{
+		Element.hide('linDivMapNav');
+		
+		// backup current margin
+		$('linDivMapNav').style.marginRight = $('gmapper_map').style.marginRight;
+		 
+		$('gmapper_map').style.marginRight = 7;
+		
+		linNavIsHidden = true;
+	}
+	
+	// update google map size
+	map.checkResize();
+}
+
+
+
+function linOnResizeWrapper()
+{
+	/**
+	 * tempoarely set the map heigth to a small value (zero does not work!)
+	 * in IE setMainHeight() would not work while reducing the window size
+	 * because IE takes always as much space as he actually needs ignoring
+	 * the height attribute  
+	 */
+
+	$('linDivMapNav').style.height = 10;
+	$('linDivMapMain').style.height = 10;
+	
+	myLinGlobal.setMainHeight();
+	
+	$('linDivMapMain').style.height = $('linDivMain').offsetHeight - $('linDivMapTop').offsetHeight - $('linDivMapBottom').offsetHeight - 5;
+	
+	/**
+	 * set also height of the navigation bar
+	 * overflow:auto does not work in IE with height: 100%
+	 */
+	$('linDivMapNav').style.height = $('linDivMapMain').style.height;
+	
+	// resize google map itself also
+	map.checkResize(); 
+}
+
+function initLinMap()
+{
+	linEnableOnResize();
+	linOnResizeWrapper();
+}
+Event.observe(window, 'load', initLinMap, false);
+
+// prevent memory leaks in internet explorer
+Event.observe(window, 'unload', GUnload, false);
+</script>
+  
\ No newline at end of file


This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.