Location: PHPKode > projects > NetLink > netlink_os/egap/pic.php
<head>
<title>
PixPic&copy; - 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'/>&nbsp;&nbsp;&nbsp;<button value='Cancel' onclick='window.close()'>Cancel Image</button>
    </td>
  </tr>
</table>
Return current item: NetLink