Subversion-Projekte lars-tiefland.ci

<?php

/**

 * Jcrop image cropping plugin for jQuery

 * Example cropping script

 * @copyright 2008-2009 Kelly Hallman

 * More info: http://deepliquid.com/content/Jcrop_Implementation_Theory.html

 */

if ($_SERVER['REQUEST_METHOD'] == 'POST')

{

	$targ_w = $targ_h = 150;

	$jpeg_quality = 90;

	$src = './demo_files/image5.jpg';

	$img_r = imagecreatefromjpeg($src);

	$dst_r = ImageCreateTrueColor( $targ_w, $targ_h );

	imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],

	$targ_w,$targ_h,$_POST['w'],$_POST['h']);

	header('Content-type: image/jpeg');

	imagejpeg($dst_r,null,$jpeg_quality);

	exit;

}

// If not a POST request, display page below:

?><!DOCTYPE html>

<html lang="en">

<head>

  <title>Live Cropping Demo</title>

  <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />

  <script src="../js/jquery.min.js"></script>

  <script src="../js/jquery.Jcrop.js"></script>

  <link rel="stylesheet" href="demo_files/main.css" type="text/css" />

  <link rel="stylesheet" href="demo_files/demos.css" type="text/css" />

  <link rel="stylesheet" href="../css/jquery.Jcrop.css" type="text/css" />

<script type="text/javascript">

  $(function(){

    $('#cropbox').Jcrop({

      aspectRatio: 1,

      onSelect: updateCoords

    });

  });

  function updateCoords(c)

  {

    $('#x').val(c.x);

    $('#y').val(c.y);

    $('#w').val(c.w);

    $('#h').val(c.h);

  };

  function checkCoords()

  {

    if (parseInt($('#w').val())) return true;

    alert('Please select a crop region then press submit.');

    return false;

  };

</script>

<style type="text/css">

  #target {

    background-color: #ccc;

    width: 500px;

    height: 330px;

    font-size: 24px;

    display: block;

  }

</style>

</head>

<body>

<div class="container">

<div class="row">

<div class="span12">

<div class="jc-demo-box">

<div class="page-header">

<ul class="breadcrumb first">

  <li><a href="../index.html">Jcrop</a> <span class="divider">/</span></li>

  <li><a href="../index.html">Demos</a> <span class="divider">/</span></li>

  <li class="active">Live Demo (Requires PHP)</li>

</ul>

<h1>Server-based Cropping Behavior</h1>

</div>

		<!-- This is the image we're attaching Jcrop to -->

		<img src="demo_files/pool.jpg" id="cropbox" />

		<!-- This is the form that our event handler fills -->

		<form action="crop.php" method="post" onsubmit="return checkCoords();">

			<input type="hidden" id="x" name="x" />

			<input type="hidden" id="y" name="y" />

			<input type="hidden" id="w" name="w" />

			<input type="hidden" id="h" name="h" />

			<input type="submit" value="Crop Image" class="btn btn-large btn-inverse" />

		</form>

		<p>

			<b>An example server-side crop script.</b> Hidden form values

			are set when a selection is made. If you press the <i>Crop Image</i>

			button, the form will be submitted and a 150x150 thumbnail will be

			dumped to the browser. Try it!

		</p>

	</div>

	</div>

	</div>

	</div>

	</body>

</html>