DaniWeb Forum Index > Web Development > PHP

Image Resizer

Please support our PHP advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Dec 2006

Posts: 1

Reputation: Poppa Pimp is an unknown quantity at this point

Solved Threads: 0

Poppa Pimp Poppa Pimp is offline

Offline

Newbie Poster

Image Resizer

Dec 10th, 2006

The URL of the page this is on in my site is http://poppa-pimps-wallpapers.com//ImageResizer.php You can click on browse and get image,but when you upload image it will go to another page and says ((unable to create emp directory)) Here is a site to be able to see script work http://tech.tailoredweb.com/image-editor-52/ and can be DL from there also. I am using FP 2003 and geocities pro Domain site. The script is as follows ---------------------------------------------
<?
session_start();

$refresh=$_SESSION["REFRESHED"]=($_SESSION["REFRESHED"])?0:1;

$imgsrc = ($_REQUEST["imgsrc"])?
$_REQUEST["imgsrc"]: "sample.jpg";

if (strpos($imgsrc,"sample.jpg")>0)
$imgfile = "sample.jpg";
else
$imgfile = substr($imgsrc, strpos($imgsrc,"/img_edt"));

$__min=base64_decode("RGV2ZWxvcGVkIEJ5IDxhIGlkPSJfX2tpbSIgaHJlZj0iaHR0cD ovL3RlY2guY2l0eXBvc3QuY2EiPkNpdHlQb3N0LmNhPC9hPg== ")
?>

<html>
<head>
<style>
img {border:none;}
body,table,td {font-family:Arial;font-size:12px}
form {display:inline;}
</style>
<title>Image Cropper / Resizer</title>
<script>
var isIE = (document.all)? true:false;
var minHeight=40, minWidth=40;

var canvasEl, imageEl, selector;
var oldX, oldY;
var mouseMoved;

document.onmousedown = mouseDown;
document.onmousemove = mouseMove;
document.onmouseup = mouseUp;

//------------ FUNCTIONS FOR DRAG AND DROP ----------------------------
//------------- mouseDown, mouseMove, mouseUp, --------------
//------------- grabEl, moveEl, dropEl --------------
function mouseDown(e) {
e = (!e)? window.event : e ;

var targetEl = (isIE)? e.srcElement : e.target;

while (targetEl.id != "image") {
targetEl = targetEl.parentNode;
if (targetEl == null) { return }
}

if (targetEl.id=="image") {
canvasEl = document.getElementById("canvas");
imageEl = document.getElementById("image");
selector = document.getElementById("selector");
oldX = (e.clientX + document.body.scrollLeft);
oldY = (e.clientY + document.body.scrollTop);
mouseMoved=false;
}
else
imageEl == null;

if (isIE)
e.returnValue = false;
else
e.preventDefault();
}

function mouseMove(e) {
e = (!e)? window.event : e ;
if (imageEl == null) { return };

mouseMoved = true;
var imageW = parseInt(imageEl.width, 10 );
var imageH = parseInt(imageEl.height, 10 );

var newX = (e.clientX + document.body.scrollLeft );
var newY = (e.clientY + document.body.scrollTop );

var x = oldX+canvasEl.scrollLeft-parseInt(canvasEl.style.left,10);
var y = oldY+canvasEl.scrollTop-parseInt(canvasEl.style.top,10);
var w = (newX - oldX);
var h = (newY - oldY);

w = Math.min( w, (imageW-x));
h = Math.min( h, (imageH-y));
w = Math.max( w, 1);
h = Math.max( h, 1);

selector.style.display = "block";
selector.style.width = w + "px";
selector.style.height = h + "px";
selector.style.left = x + "px";
selector.style.top = y + "px";
document.getElementById("crop").disabled = false;

document.resizefrm.width.value = w;
document.resizefrm.height.value = h;

document.cropfrm.x.value = x;
document.cropfrm.y.value = y;
document.cropfrm.w.value = w;
document.cropfrm.h.value = h;

if (isIE)
e.returnValue = false;
else
e.preventDefault();

}

function mouseUp(e) {
imageEl = null;
if (mouseMoved==false) {
selector.style.display = "none";
document.getElementById("crop").disabled = true;
}
}

function init() {
if (<?=$refresh?>)
window.location.reload();
var kim = document.getElementById('__kim');
if (kim==null || kim.tagName != "A" || kim.innerHTML<="" ) {
alert("This Image-Editor Version Requires Link To CityPost.ca");
return false;
}
}
</script>

</head>
<body onload="init()">
<div id="canvas" style="position:absolute;top:5px;left:5px;width:800px;hei ght:590px;border:1px solid black;overflow:auto;">
<div id="selector" style="display:none;position:absolute;border:1px solid blue;font-size:1px;"></div>
<img id="image" src="<?=$imgsrc?>" />
</div>

<div style="position:absolute;top:5px;left:810px">

<b>HOW TO? 1-2-3</b>
<br><br><b>1. Upload Your Image </b>
<br><font color=blue><?=$_REQUEST["m1"]?></font>
<form method=post action="proc_image_editor.php" ENCTYPE="multipart/form-data">
<input type=file name=imgfile size=10/>
<button type=submit name="upload">Upload Image</button>
</form>

<br><br><b>2. Resize or Crop</b>
<form name=resizefrm method=post action="proc_image_editor.php">
<br>  - Drag mouse or type numbers

<table cellpadding=0 cellspacing=0>
<tr><td colspan=4>
<font color=blue><?=$_REQUEST["m2"]?></font>
<tr>
<td>w:<td><input id="width" name="width" size=1/>
<td>h:<td><input id="height" name="height" size=1/><br>
<tr><td><td colspan=3>
<input type="hidden" id="imgfile" name="imgfile" value="<?=$imgfile?>" />
<button type=submit id="resize" name="resize" value="1">
      Resize     </button>
</table>
</form>

<form name=cropfrm method=post action="proc_image_editor.php">
<table cellpadding=0 cellspacing=0>
<tr><td colspan=4>
<font color=blue><?=$_REQUEST["m3"]?></font>
<tr>
<td>x: <td><input name="x" id="x" size=1 readonly>
<td>y: <td><input name="y" id="y" size=1 readonly>
<tr>
<td>w: <td><input name="w" id="w" size=1 readonly>
<td>h: <td><input name="h" id="h" size=1 readonly>
<tr><td><td colspan=3>
<input type="hidden" id="imgfile" name="imgfile" value="<?=$imgfile?>" />
<button type=submit id="crop" name="crop" value="1" disabled>
Crop Selection</button>
</table>
</form>

<? if ($imgsrc!=="sample.jpg") { ?>
<br><b>3. Save </b>
<br><button
onclick="window.location.href='proc_download.php?fl=<?=$imgsrc?>'">
Download Image
</button>

<br><br><b>4. Go Back </b>
<font color=blue><?=$_REQUEST["m4"]?></font>
<form action="proc_image_editor.php">
<input type="hidden" id="imgfile" name="imgfile" value="<?=$imgfile?>" />
<button type=submit id="recall" name="recall" value="1">
Recall Original
</button>
</form>