<head>
<title>
PixPic© - Rotide Egap
</title>
</head>
<script type='text/javascript'>
function preload_img()
{
<?php
$u=$_GET['u'];
$dir = '../Users/'.$u.'/';
#echo "DIR: $dir";
$flag = false;
$x=0;
if (is_dir($dir))
{
if ($handle = opendir($dir))
{
while (false !== ($pic = readdir($handle)))
{
if ($pic != "." && $pic != "..")
{
$tail=strtolower(substr($pic, -3));
if (($tail=="bmp")||($tail=="jpg")||($tail=="peg")||($tail=="png")||($tail=="gif")||($tail=="swf"))
{
echo "PIC_$x=new Image;\n";
echo "PIC_$x.src='http://netlink.kaibasoftware.com/Users/$u/$pic';\n";
#echo "alert(PIC_$x.src);\n";
$flag=true;
$x++;
}
}
}
}
}
?>
}
function preview()
{
sel_pic=document.getElementById("pic_sel").value;
if (sel_pic!="none")
{
pic_code="<img src='";
<?php
extract($_GET);
echo "picture='http://netlink.kaibasoftware.com/Users/$u/'+sel_pic;";
?>
myImage = new Image();
myImage.src=picture;
//alert(picture);
pic_code+=picture;
pic_code+="' alt=''/>";
document.getElementById("image_w").value=myImage.width;
document.getElementById("image_h").value=myImage.height;
document.getElementById("preview").innerHTML=pic_code;
window.opener.document.getElementById("saved").innerHTML="<span style='color: #CC0000;'>Not Saved</span>";
}
}
function create_code()
{
//alert("Creating Code...");
exist=window.opener.document.getElementById("preview").innerHTML;
pic_code=document.getElementById("preview").innerHTML;
window.opener.document.getElementById("preview").innerHTML+=pic_code;
window.opener.document.getElementById("egap_b_code").value+=pic_code
window.close();
}
function h_up()
{
prop=document.getElementById("prop").checked;
h_size=document.getElementById("image_h").value-=-5;
sel_pic=document.getElementById("pic_sel").value;
pic_code="<img src='";
pic_code+="http://netlink.kaibasoftware.com/Users/"
<?php
extract($_GET);
echo "pic_code+='$u'\n";
?>
pic_code+="/"+sel_pic+"' ";
pic_code+="height='"+h_size+"px' ";
if (prop==true)
w_size=document.getElementById("image_w").value-=-5;
else
w_size=document.getElementById("image_w").value;
pic_code+="width='"+w_size+"px' ";
pic_code+="alt=''/>";
document.getElementById("preview").innerHTML=pic_code+"<br/>";
}
function h_down()
{
prop=document.getElementById("prop").checked;
h_size=document.getElementById("image_h").value-=5;
sel_pic=document.getElementById("pic_sel").value;
pic_code="<img src='";
pic_code+="http://netlink.kaibasoftware.com/Users/"
<?php
extract($_GET);
echo "pic_code+='$u'\n";
?>
pic_code+="/"+sel_pic+"' ";
pic_code+="height='"+h_size+"px' ";
if (prop==true)
w_size=document.getElementById("image_w").value-=5;
else
w_size=document.getElementById("image_w").value;
pic_code+="width='"+w_size+"px' ";
pic_code+="alt=''/>";
document.getElementById("preview").innerHTML=pic_code+"<br/>";
}
function w_up()
{
prop=document.getElementById("prop").checked;
w_size=document.getElementById("image_w").value-=-5;
sel_pic=document.getElementById("pic_sel").value;
pic_code="<img src='";
pic_code+="http://netlink.kaibasoftware.com/Users/";
h_size=document.getElementById("image_h").value;
//ratio=(w_size/h_size);
//ratio=ratio.toFixed(2);
//alert(ratio);
<?php
extract($_GET);
echo "pic_code+='$u'\n";
?>
pic_code+="/"+sel_pic+"' ";
pic_code+="width='"+w_size+"px' ";
if (prop==true)
document.getElementById("image_h").value-=-5 /*(-h_size) - (-h_size*ratio)*/;
else
h_size=document.getElementById("image_h").value;
pic_code+="height='"+h_size+"px' ";
pic_code+="alt=''/>";
document.getElementById("preview").innerHTML=pic_code+"<br/>";
}
function w_down()
{
prop=document.getElementById("prop").checked;
w_size=document.getElementById("image_w").value-=5;
sel_pic=document.getElementById("pic_sel").value;
pic_code="<img src='";
pic_code+="http://netlink.kaibasoftware.com/Users/"
<?php
extract($_GET);
echo "pic_code+='$u'\n";
?>
pic_code+="/"+sel_pic+"' ";
pic_code+="width='"+w_size+"px' ";
if (prop==true)
h_size=document.getElementById("image_h").value-=5;
else
h_size=document.getElementById("image_h").value;
pic_code+="height='"+h_size+"px' ";
pic_code+="' alt=''/>";
document.getElementById("preview").innerHTML=pic_code+"<br/>";
}
function pic_align(align)
{
sel_pic=document.getElementById("pic_sel").value;
width=document.getElementById("image_w").value;
height=document.getElementById("image_h").value;
code="<div align='"+align+"'>\n<img src='http://netlink.kaibasoftware.com/Users/<?php echo $u;?>/"+sel_pic+"' alt='' height='"+height+"' width='"+width+"'/>\n</div>";
//alert(code);
document.getElementById("preview").innerHTML=code;
}
function pic_size(size){
if (size=="200"){
height="200";
width="200";
}
else if (size=="800"){
height="600";
width="800";
}
else if (size=="1024"){
height="768";
width="1024";
}
sel_pic=document.getElementById("pic_sel").value;
document.getElementById("image_w").value = width;
document.getElementById("image_h").value = height;
code="<div align='center'>\n<img src='http://netlink.kaibasoftware.com/Users/<?php echo $u;?>/"+sel_pic+"' alt='' height='"+height+"' width='"+width+"'/>\n</div>";
//alert(code);
document.getElementById("preview").innerHTML=code;
}
</script>
<link media="screen" type="text/css" rel="stylesheet" href="../main.css" />
<body onLoad='preview(), preload_img();'>
<div align='center'>
<img src='pix/pixpic.png' alt=''/><br/>
c/o R<small>OTIDE</small> E<small>GAP</small>
</div>
<br/>
<div style='font-size: 10pt;'>
Pick your picture from your account below. It will be previewed to the right. If you want that picture loaded onto your page, have it selected, then click <b>Select</b>.
</div>
<br/>
<form type='post' action='javascript:create_code();'>
<table summary='pic_table' border='1' width='100%' style='border: 1px black solid;'>
<tr>
<td valign='top' width='200px'>
<select id='pic_sel' name='pic_sel' onchange='preview(), preview();' >
<option value='none'> </option>
<?php
$u=$_GET['u'];
$dir = '../Users/'.$u.'/';
#echo "DIR: $dir";
$flag = false;
if (is_dir($dir))
{
if ($handle = opendir($dir))
{
while (false !== ($pic = readdir($handle)))
{
if ($pic != "." && $pic != "..")
{
$tail=strtolower(substr($pic, -3));
if (($tail=="bmp")||($tail=="jpg")||($tail=="peg")||($tail=="png")||($tail=="gif")||($tail=="swf"))
{
echo "<option value='$pic'>$pic</option>";
$flag=true;
}
}
}
}
}
if ($flag==false)
{
echo "<option value='no'>No Pictures Exist Yet!</option>";
}
?>
</select>
<hr style='color: #000000;'/>
<div style='font-size: 10pt;'>
Resize:
<br/>
Width: <input type='text' readonly='readonly' size='3' id='image_w'/><img src='pix/updown.jpg' ISMAP usemap='#width' alt='' border='0'/><br/>
Height: <input type='text' readonly='readonly' size='3' id='image_h'/><img src='pix/updown.jpg' ISMAP usemap='#height' alt='' border='0'/><br/>
Proportional? <input type='checkbox' id='prop' disabled='disabled' name='prop'/><small><i>Coming Soon!</i></small><br/>
<a href='javascript:preview()' class='under'>Reset Image</a>
<br/><br/>
<table id='options'>
<tr>
<td>
Alignment:
<br/>
<input type='radio' name='align_r' id='align_r' value='left' onclick="pic_align('left')" checked='checked'/> Left</input><br/>
<input type='radio' name='align_r' id='align_r' value='center' onclick="pic_align('center')"/> Center</input><br/>
<input type='radio' name='align_r' id='align_r' value='right' onclick="pic_align('right')"/> Right</input>
</div>
</td>
<!--Start MAPS-->
<!--Maps for Height Factor of Image-->
<map id='height' name='height'>
<area shape='rect' coords='0, 0, 8, 8' href='javascript:h_up()';/>
<area shape='rect' coords='0, 8, 16, 16' href='javascript:h_down()';/>
</map>
<!--Maps for Width Factor of Image-->
<map id='width' name='width'>
<area shape='rect' coords='0, 0, 8, 8' href='javascript:w_up()';/>
<area shape='rect' coords='0, 8, 16, 16' href='javascript:w_down()';/>
</map>
<!--End MAPS-->
</td>
<td>
<!--Set Size-->
Set Size<br/>
<input type='radio' name='set_size' id='set_size' value='200' onclick="pic_size('200')"/> 200 x 200</input><br/>
<input type='radio' name='set_size' id='set_size' value='800' onclick="pic_size('800')"/> 800 x 600</input><br/>
<input type='radio' name='set_size' id='set_size' value='1024' onclick="pic_size('1024')"/> 1024 x 768</input>
</td>
</tr>
</table>
</td>
<td align='center'>
<div id='preview' align='center'><!--DYNAMIC IMAGE STUFF GOES HERE--></div>
</td>
</tr>
<tr>
<td colspan='2' align='center'>
<input type='submit' value='Add Image' style='font-weight: bold'/> <button value='Cancel' onclick='window.close()'>Cancel Image</button>
</td>
</tr>
</table>