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

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

Revision: 4571
          http://svn.sourceforge.net/linpha/?rev=4571&view=rev
Author:   fangehrn
Date:     2006-10-03 14:45:49 -0700 (Tue, 03 Oct 2006)

Log Message:
-----------
2006-10-03 flo
 * working on an ajax image view
	basic things will work now

Modified Paths:
--------------
    trunk/linpha2/ChangeLog
    trunk/linpha2/lib/classes/linpha.imgview.class.php
    trunk/linpha2/templates/default/view_img.html.php

Added Paths:
-----------
    trunk/linpha2/lib/classes/image.js
    trunk/linpha2/templates/default/view_img.head.php

Modified: trunk/linpha2/ChangeLog
===================================================================
--- trunk/linpha2/ChangeLog	2006-10-03 06:05:34 UTC (rev 4570)
+++ trunk/linpha2/ChangeLog	2006-10-03 21:45:49 UTC (rev 4571)
@@ -1,5 +1,6 @@
 2006-10-03 flo
- * working on an ajax image view... ;-)
+ * working on an ajax image view
+	basic things will work now
 
 2006-10-02 flo
  * working on an ajax image view... ;-)

Added: trunk/linpha2/lib/classes/image.js
===================================================================
--- trunk/linpha2/lib/classes/image.js	                        (rev 0)
+++ trunk/linpha2/lib/classes/image.js	2006-10-03 21:45:49 UTC (rev 4571)
@@ -0,0 +1,165 @@
+var http_request = false;
+
+function loadImage(imgid) {
+
+    http_request = false;
+
+    if (window.XMLHttpRequest) { // Mozilla, Safari,...
+        http_request = new XMLHttpRequest();
+        if (http_request.overrideMimeType) {
+            http_request.overrideMimeType('text/xml');
+            // zu dieser Zeile siehe weiter unten
+        }
+    } else if (window.ActiveXObject) { // IE
+        try {
+            http_request = new ActiveXObject("Msxml2.XMLHTTP");
+        } catch (e) {
+            try {
+                http_request = new ActiveXObject("Microsoft.XMLHTTP");
+            } catch (e) {}
+        }
+    }
+
+    if (!http_request) {
+        alert('Ende :( Kann keine XMLHTTP-Instanz erzeugen');
+        return false;
+    }
+    http_request.onreadystatechange = loadImageData;
+    http_request.open('GET', imagedata_url + '&id=' + imgid + '&xml', true);
+    http_request.send(null);
+
+}
+
+function loadImageData() {
+
+    if (http_request.readyState == 4) {
+        if (http_request.status == 200)
+        {
+//			alert(http_request.responseText);
+
+			var xmldoc = http_request.responseXML;
+
+			/**
+			 * set image source
+			 */
+			var imgid = xmldoc.getElementsByTagName('imgid').item(0).firstChild.data;
+			document.getElementById('mainimage').src = image_src + imgid;
+
+			/**
+			 * set meta data
+			 */
+			if(xmldoc.getElementsByTagName('meta').length > 0)
+			{
+				var DivRight = document.getElementById("right");
+				DivRight.innerHTML = '';
+
+				for(var i = 0; i < xmldoc.getElementsByTagName('meta').length; i++)
+				{
+					var meta = xmldoc.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 );
+
+					DivRight.appendChild(metaname);
+					DivRight.appendChild(metavalue);
+					DivRight.appendChild( document.createElement("br") );
+				}
+			}
+			
+			/**
+			 * set current thumb
+			 */
+			DivCurrentThumb = document.getElementById('thumbnavi_currentthumb');
+			DivCurrentThumb.innerHTML = '<a href="javascript:loadImage(' + imgid + ')"><img class="img_currentthumb" src="' + thumb_src + imgid + '" /></a>';
+
+			/**
+			 * set prev thumbs
+			 */
+			DivPrevThumbs = document.getElementById('thumbnavi_prevthumb');
+			DivPrevThumbs.innerHTML = '';
+			if(xmldoc.getElementsByTagName('prevthumb').length > 0)
+			{
+				for(var i = 0; i < xmldoc.getElementsByTagName('prevthumb').length; i++)
+				{
+					var prevThumbId = xmldoc.getElementsByTagName('prevthumb').item(i).firstChild.data;
+					
+					var ElemImg = document.createElement("img");
+					var myAttribute=document.createAttribute("class");
+					myAttribute.nodeValue = 'img_prevnextthumb';
+					ElemImg.setAttributeNode(myAttribute);
+					var myAttribute=document.createAttribute("src");
+					myAttribute.nodeValue = thumb_src + prevThumbId;
+					ElemImg.setAttributeNode(myAttribute);
+
+					var ElemA = document.createElement("a");
+					var myAttribute=document.createAttribute("href");
+					myAttribute.nodeValue = 'javascript:loadImage(' + prevThumbId + ')';
+					ElemA.setAttributeNode(myAttribute);
+					ElemA.appendChild(ElemImg);
+
+					var ElemDiv = document.createElement("div");
+					var myAttribute=document.createAttribute("class");
+					myAttribute.nodeValue = 'thumbnavi_prevnextthumb';
+					ElemDiv.setAttributeNode(myAttribute);
+					ElemDiv.appendChild(ElemA);
+					
+					DivPrevThumbs.appendChild(ElemDiv);
+				}
+			}
+
+			/**
+			 * set next thumbs
+			 */
+			DivNextThumbs = document.getElementById('thumbnavi_nextthumb');
+			DivNextThumbs.innerHTML = '';
+			if(xmldoc.getElementsByTagName('nextthumb').length > 0)
+			{
+				for(var i = 0; i < xmldoc.getElementsByTagName('nextthumb').length; i++)
+				{
+					var nextThumbId = xmldoc.getElementsByTagName('nextthumb').item(i).firstChild.data;
+					
+					var ElemImg = document.createElement("img");
+					var myAttribute=document.createAttribute("class");
+					myAttribute.nodeValue = 'img_prevnextthumb';
+					ElemImg.setAttributeNode(myAttribute);
+					var myAttribute=document.createAttribute("src");
+					myAttribute.nodeValue = thumb_src + nextThumbId;
+					ElemImg.setAttributeNode(myAttribute);
+
+					var ElemA = document.createElement("a");
+					var myAttribute=document.createAttribute("href");
+					myAttribute.nodeValue = 'javascript:loadImage(' + nextThumbId + ')';
+					ElemA.setAttributeNode(myAttribute);
+					ElemA.appendChild(ElemImg);
+
+					var ElemDiv = document.createElement("div");
+					var myAttribute=document.createAttribute("class");
+					myAttribute.nodeValue = 'thumbnavi_prevnextthumb';
+					ElemDiv.setAttributeNode(myAttribute);
+					ElemDiv.appendChild(ElemA);
+					
+					DivNextThumbs.appendChild(ElemDiv);
+				}
+			}
+
+//			<div class="thumbnavi_prevnextthumb"><a href="./?cat=alb&amp;id=9"><img class="img_prevnextthumb" src="./get_thumb.php?id=9" /></a><br />0067_img.jpg</div>
+
+//			var nextthumb = xmldoc.getElementsByTagName('nextthumb').item(0);
+//			alert(xmldoc.getElementsByTagName('nextthumb').length);
+//			alert(nextthumb.firstChild.data);
+
+//			var nextthumb = xmldoc.getElementsByTagName('nextthumb').item(1);
+//			alert(nextthumb.firstChild.data);
+
+//			var nextthumb = xmldoc.getElementsByTagName('nextthumb').item(2);
+//			alert(nextthumb.firstChild.data);
+
+//			var nextthumb = xmldoc.getElementsByTagName('nextthumb').item(3);
+//			alert(nextthumb.firstChild.data);
+				
+
+        } else {
+            alert('Bei dem Request ist ein Problem aufgetreten.');
+        }
+    }
+
+}
\ No newline at end of file

Modified: trunk/linpha2/lib/classes/linpha.imgview.class.php
===================================================================
--- trunk/linpha2/lib/classes/linpha.imgview.class.php	2006-10-03 06:05:34 UTC (rev 4570)
+++ trunk/linpha2/lib/classes/linpha.imgview.class.php	2006-10-03 21:45:49 UTC (rev 4571)
@@ -1086,35 +1086,45 @@
  */
 function viewImgAjax()
 {
-?>
-<xml>
+	header('Content-type: text/xml');
+	echo '<?xml version="1.0" ?>'."\n";
+	?>
+<root>
+<imgid><?php echo $this->id_current; ?></imgid>
 <?php
-foreach($this->xmldata['prev_thumb'] AS $value)
-{
-	echo '<prev_thumb>'.$value.'</prev_thumb>'."\n";
-}
-foreach($this->xmldata['next_thumb'] AS $value)
-{
-	echo '<next_thumb>'.$value.'</next_thumb>'."\n";
-}
+	if(isset($this->xmldata['prev_thumb'])) {
+		foreach($this->xmldata['prev_thumb'] AS $value)
+		{
+			echo '<prevthumb>'.$value.'</prevthumb>'."\n";
+		}
+	}
+	if(isset($this->xmldata['next_thumb'])) {
+		foreach($this->xmldata['next_thumb'] AS $value)
+		{
+			echo '<nextthumb>'.$value.'</nextthumb>'."\n";
+		}
+	}
 
-foreach($GLOBALS['linpha']->template->output['image_infos'] AS $value)
-{ ?>
+	foreach($GLOBALS['linpha']->template->output['image_infos'] AS $value)
+	{ ?>
 <meta>
 	<name><?php echo $value['name']; ?></name><value><?php echo $value['value']; ?></value>
 </meta>
 <?php
-}
+	}
 
-while($data = $GLOBALS['linpha']->template->output['image_comments']->FetchRow())
-{ ?>
+	while($data = $GLOBALS['linpha']->template->output['image_comments']->FetchRow())
+	{ ?>
 <comment>
 	<time><?php echo $data['meta_time']; ?></time>
 	<author><?php echo htmlspecialchars($data['meta_author'],ENT_QUOTES); ?></author>
 	<text><?php echo htmlspecialchars($data['meta_comment'],ENT_QUOTES); ?></text>
 </comment>		
-<?php }
+<?php } ?>
+</root>
 
+<?php
+
 } // end viewImgAjax()
 
 /**

Added: trunk/linpha2/templates/default/view_img.head.php
===================================================================
--- trunk/linpha2/templates/default/view_img.head.php	                        (rev 0)
+++ trunk/linpha2/templates/default/view_img.head.php	2006-10-03 21:45:49 UTC (rev 4571)
@@ -0,0 +1,6 @@
+<script language="JavaScript" type="text/javascript">
+var imagedata_url = '<?php echo convert_amp($GLOBALS['linpha']->template->URL_base); ?>';
+var image_src = '<?php echo LINPHA_DIR.'/get_image.php?id='; ?>';
+var thumb_src = '<?php echo LINPHA_DIR.'/get_thumb.php?id='; ?>';
+</script>
+<script type="text/javascript" language="javascript" src="<?php echo LINPHA_DIR; ?>/lib/classes/image.js"> </script>
\ No newline at end of file

Modified: trunk/linpha2/templates/default/view_img.html.php
===================================================================
--- trunk/linpha2/templates/default/view_img.html.php	2006-10-03 06:05:34 UTC (rev 4570)
+++ trunk/linpha2/templates/default/view_img.html.php	2006-10-03 21:45:49 UTC (rev 4571)
@@ -9,16 +9,32 @@
 		<img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/tl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
 	</div>
 
+<?php /*
 	<div id="thumbnavi">
 		<div class="thumbnavi_prevthumb">
-			<?php /*echo $GLOBALS['linpha']->template->output['prev_thumb'];*/ ?>
+			<?php /*echo $GLOBALS['linpha']->template->output['prev_thumb'];
 		</div>
-		<?php /*echo $GLOBALS['linpha']->template->output['current_thumb'];*/ ?>
+		<?php /*echo $GLOBALS['linpha']->template->output['current_thumb'];
 		<div class="thumbnavi_nextthumb">
-			<?php /*echo $GLOBALS['linpha']->template->output['next_thumb'];*/ ?>
+			<?php /*echo $GLOBALS['linpha']->template->output['next_thumb'];
 		</div>
 	</div>
+	
+	<a href="./?cat=alb&amp;id=8"><img class="img_currentthumb" src="./get_thumb.php?id=8" /></a><br />0066_img.jpg
+	<div class="thumbnavi_prevnextthumb"><a href="./?cat=alb&amp;id=9"><img class="img_prevnextthumb" src="./get_thumb.php?id=9" /></a><br />0067_img.jpg</div>
+	*/
+?>
 
+
+	<div id="thumbnavi">
+		<div class="thumbnavi_prevthumb" id="thumbnavi_prevthumb"></div>
+		<div class="thumbnavi_currentthumb" id="thumbnavi_currentthumb"></div>
+		<div class="thumbnavi_nextthumb" id="thumbnavi_nextthumb"></div>
+	</div>
+
+
+
+
 	<div class="roundbottom">
 		<img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/bl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
    </div>
@@ -44,7 +60,7 @@
 		<?php echo i18n("Add Comment"); ?>:<br />
 		<div id="comment_div_text">
 		<input type="text" id="comment_input_text" name="comment_text" value="" tabindex="1" size="40" maxlength="40" />
-		<a href="javascript:open_textarea()">(+)</a>
+		<a href="javascript:openTextarea()">(+)</a>
 		</div>
 		<textarea style="display: none;" id="comment_textarea" name="comment_textarea" tabindex="1" rows="10" cols="50"></textarea>
 		<?php echo i18n("Name"); ?>: <input type="text" name="author" value="" tabindex="2" size="10" maxlength="40" />
@@ -53,7 +69,7 @@
 		</form>
 		</div>
 		<script language="JavaScript" type="text/javascript">
-		function open_textarea()
+		function openTextarea()
 		{
 			document.getElementById('comment_textarea').style.display = 'block';
 			document.getElementById('comment_div_text').style.display = 'none';
@@ -97,4 +113,8 @@
 	<div class="roundbottom">
 		<img src="<?php echo LINPHA_DIR.'/templates/'.$GLOBALS['linpha']->template->template_name.'/images/bl.gif'; ?>" alt="" width="15" height="15" class="corner" style="display: none" />
    </div>
-</div>
\ No newline at end of file
+</div>
+
+<script language="JavaScript" type="text/javascript">
+loadImage(<?php echo $GLOBALS['linpha']->imgview->id_current; ?>);
+</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.