###############################################
#   No Margin Pop Up Window Version 2.0       #
#              PHP Version                    #
###############################################
#                                             #
#   Script Made By Dodo                       #          
#   http://www.regretless.com                 #
#                                             # 
#   Script is Released Under LinkWare         #
#   You are free to use the script as         #
#   long as you link back to my page.         #
#                                             #
#                                             #
###############################################

===================
General Information
===================

I wrote this script because I wanted something that will allow me to call up many pop up windows that doesn't have margins for IMAGES for my digital camera page. With this script, you no longer need to write html for every single image in order to make them show up in popup without margins. I hope it will be useful for you all =)

In order to use this script, please make sure your server supports php.  If you are unsure, contact your tech support or check out the php tutorials at http://dodo.pitas.com.

Copyright notice: Please do not distribute this script without notifying me.  You may feel free to edit the script and it would be nice if you let me know how you made the script better. I would like to improve this script and create newer versions.

Thank you!

Send all comments to:
Dodo: dodo@regretless.com


==============
Included Files
==============
readme		- Everything you need to know about using my script
nmimage.php		- The file you use to pop images in the popup with no margins
test.php		- The page that shows you that my script works!
picture.gif		- Sample popup picture
picturethumbnail.gif
			- Sample popup picture thumbnail


============
Installation
============
1. Upload nmimage.php file to a directory perferrably where you want to use this script.
To call this script in your pages, you have to make sure
- Your server supports php
- The page you want to call the script from has a php extension.

2. Open test.php for an exmaple. The following part defines the function popup
<?php
## The pop up function for dodo's nmimage popup
function popup($nmdir, $title, $pic, $thumbnail, $des, $fmode = "false") {
global $target;
$target++;

$size = GetImageSize($pic);
$width = $size[0];
$height = $size[1];
if($thumbnail != "" && $thumbnail != "none") {
	$size = GetImageSize($thumbnail);
	$twidth = $size[0];
	$theight = $size[1];
}

// get function mode
if($fmode != "false") {
$fmode = explode(",", $fmode);
$mode = $fmode[0];
}
	print "
	<A HREF=\"#\" onMouseOver=\"window.status='$title';return true\" onMouseOut=\"window.status='';return true\" onClick=\"window.open('$nmdir";
print "nmimage.php?z=$dir$pic&width=$width&height=$height&title=$title','$target','width=$width,height=$height,directories=no,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,resizable=no,left=0,top=0,screenx=50,screeny=50');return false\">";
	if($thumbnail != "" && $thumbnail != "none") {
		if($mode == "highlight") {
			if(!$fmode[1])
				$fmode[1] = "black";
			if(!$fmode[2])
				$fmode[2] = "white";
			print "<img src=\"$thumbnail\" width=\"$twidth\" height=\"$theight\" border=\"0\" class=\"borderimage\" onMouseover=\"borderit(this,'$fmode[1]')\" onMouseout=\"borderit(this,'$fmode[2]')\"></a>";
		} elseif($mode == "shake") {			
			print "<img src=\"$thumbnail\" width=\"$twidth\" height=\"$theight\" border=\"0\" class=\"shakeimage\" onMouseover=\"init(this);rattleimage()\" onMouseout=\"stoprattle(this);top.focus()\" onClick=\"top.focus()\"></a>";
		} elseif($mode == "ghighlight") {	
			if(!$fmode[1])
				$fmode[1] = 50;		
			print "<img src=\"$thumbnail\" width=\"$twidth\" height=\"$theight\" border=\"0\" style=\"filter:alpha(opacity=$fmode[1])\" onMouseover=\"high(this)\" onMouseout=\"low(this)\"></a>";
		} else {
			print "<img src=\"$thumbnail\" width=\"$twidth\" height=\"$theight\" border=\"0\"></a>";
		}
	} else {
	print "$des</a>";
	}
} // end of function
?>
it must stay at the TOP of the file you are calling the pop up.

********************************
ABOUT SPECIAL EFFECTS
- skip if you are not interested
********************************
These special effects are done with the help of javascripts found here:
http://www.dynamicdrive.com/dynamicindex15/
In order to use this new function, you MUST add the corresponding header part of the javascript between your <head> </head>.

+++++++++++++
for highlight
+++++++++++++
add:
<style>
.borderimage{
border:1px solid white;
}
</style>
<script language="JavaScript1.2">

/*
Highlight Image Script II- 
© Dynamic Drive (www.dynamicdrive.com)
For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

function borderit(which,color){
//if IE 4+ or NS 6+
if (document.all||document.getElementById){
which.style.borderColor=color
}
}

</script>
where
<style>
.borderimage{
border:1px solid white;
}
</style>
is the configuration of the image when first load your page.
In the above configuration, the border width is "1px" and the border color is "white" by default. You may edit them accordingly.

+++++++++
for shake
+++++++++
add:
<style>
.shakeimage{
position:relative
}
</style>
<script language="JavaScript1.2">

/*
Shake image script (onMouseover)- 
© Dynamic Drive (www.dynamicdrive.com)
For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

//configure shake degree (where larger # equals greater shake)
var rector=3

///////DONE EDITTING///////////
var stopit=0 
var a=1

function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}

function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}

function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}

</script>
where
var rector=3 is the default speed


+++++++++++++++++++++
for gradual-highlight
+++++++++++++++++++++
add:
<script>

/*
Gradual-Highlight Image Script II- 
By J. Mark Birenbaum (birenbau@ugrad.cs.ualberta.ca)
Permission granted to Dynamicdrive.com to feature script in archive
For full source to script, visit http://dynamicdrive.com
*/

nereidFadeObjects = new Object();
nereidFadeTimers = new Object();

/* object - image to be faded (actual object, not name);
 * destop - destination transparency level (ie 80, for mostly solid)
 * rate   - time in milliseconds between trasparency changes (best under 100)
 * delta  - amount of change each time (ie 5, for 5% change in transparency)
 */

function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
    if (object != "[object]"){  //do this so I can take a string too
        setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
        return;
    }
        
    clearTimeout(nereidFadeTimers[object.sourceIndex]);
    
    diff = destOp-object.filters.alpha.opacity;
    direction = 1;
    if (object.filters.alpha.opacity > destOp){
        direction = -1;
    }
    delta=Math.min(direction*diff,delta);
    object.filters.alpha.opacity+=direction*delta;

    if (object.filters.alpha.opacity != destOp){
        nereidFadeObjects[object.sourceIndex]=object;
        nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
    }
}

</script>


*********************
NOW call the function
*********************
Then to call the function in your script, you only need ONE LINE, something like:
<?php
## call the function
popup("", "picture", "picture.gif", "picturethumbnail.gif", "this is my test picture", "highlight,red,white");
?>
let's go over all the parameters from left to right.
	a) the directory where your nmimage.php is stored with "/" at the end and leave it "" if it's the same directory.
	b) the title of the pop, the mouseover caption and the popup window target name.
	c) the picture that shows up in your pop up! You can also use "directory/images/picture.gif"
	d) the name of the thumbnail file of the popup. You can also use "directory/images/picturethumbnail.gif" If you do not wish to use thumbnail, please put "none" for that parameter!
	e) that is the description for your pop up link if you put "none" in your thumbnail paramter. Don't worry about it if you already have a thumbnail.
	---------------------------------------------
	using special effects
 	- ignore if you DO NOT want to use them
	---------------------------------------------
	f) optional mode parameter for the effect. Default to false. in the parameter you will specify which special effect you want to use and its corresponding variable components!
	--HIGHLIGHT--
	to use this effect, you need to specify the mode, mouseover border color and onmouseout border color. and you do like i.e. "highlight,#000000,#FFFFFF" separate the variables with COMMA ONLY (no space) Go to http://www.dynamicdrive.com/dynamicindex4/highlight2.htm if you are confused.
	--SHAKE--
	to use this effect, you need to specify the mode and that's it. put "shake".
	--GRADUAL-HIGHLIGHT--
	to use this effect, you need to specify the mode, and the default opacity from "0 - 99". and you do like i.e. "ghighlight,50" or "ghighlight,40" separate the variables with COMMA ONLY (no space) Go to http://www.dynamicdrive.com/dynamicindex4/highlightgrad.htm if you are confused.
	----------------------------------------------

Width and height of the thumbnail or popup image will be automatically detected by the script. WOOHOO, php rocks!

3. Make sure you change all the variables correctly every single time you call the popup for a different image.

===============
Online tutorial
===============
You may find it at http://dodo.pitas.com under toturials >> php, use the forum if you have difficulties with the script

================
Script In Action
================

To see the script in action, please visit
http://www.regretless.com/dodo/pure/dcam/

=======
Updates
=======
May 02, 2003: made sure the $target is automatically configured.
Feburary 15, 2002: Combined my script with the highlight javascript.
June 30, 2001: Added the option for wether you want thumbnail or description when linking the popup.
September 07, 2001: Added the GetImageSize so no need to enter width and height of the image. Added a function for calling the script!