Subversion Repositories Integrator Subversion

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1 espaco 1 
<?php
2 
 
3 
/**
4 
 * Jcrop image cropping plugin for jQuery
5 
 * Example cropping script
6 
 * @copyright 2008-2009 Kelly Hallman
7 
 * More info: http://deepliquid.com/content/Jcrop_Implementation_Theory.html
8 
 */
9 
 
10 
if ($_SERVER['REQUEST_METHOD'] == 'POST')
11 
{
12 
        $targ_w = $targ_h = 150;
13 
        $jpeg_quality = 90;
14 
 
15 
        $src = './demo_files/image5.jpg';
16 
        $img_r = imagecreatefromjpeg($src);
17 
 
18 
        $dst_r = ImageCreateTrueColor( $targ_w, $targ_h );
19 
 
20 
        imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],
21 
        $targ_w,$targ_h,$_POST['w'],$_POST['h']);
22 
 
23 
        header('Content-type: image/jpeg');
24 
        imagejpeg($dst_r,null,$jpeg_quality);
25 
 
26 
        exit;
27 
}
28 
 
29 
// If not a POST request, display page below:
30 
 
31 
?><!DOCTYPE html>
32 
<html lang="en">
33 
<head>
34 
  <title>Live Cropping Demo</title>
35 
  <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
36 
  <script src="../js/jquery.min.js"></script>
37 
  <script src="../js/jquery.Jcrop.js"></script>
38 
  <link rel="stylesheet" href="demo_files/main.css" type="text/css" />
39 
  <link rel="stylesheet" href="demo_files/demos.css" type="text/css" />
40 
  <link rel="stylesheet" href="../css/jquery.Jcrop.css" type="text/css" />
41 
 
42 
<script type="text/javascript">
43 
 
44 
  $(function(){
45 
 
46 
    $('#cropbox').Jcrop({
47 
      aspectRatio: 1,
48 
      onSelect: updateCoords
49 
    });
50 
 
51 
  });
52 
 
53 
  function updateCoords(c)
54 
  {
55 
    $('#x').val(c.x);
56 
    $('#y').val(c.y);
57 
    $('#w').val(c.w);
58 
    $('#h').val(c.h);
59 
  };
60 
 
61 
  function checkCoords()
62 
  {
63 
    if (parseInt($('#w').val())) return true;
64 
    alert('Please select a crop region then press submit.');
65 
    return false;
66 
  };
67 
 
68 
</script>
69 
<style type="text/css">
70 
  #target {
71 
    background-color: #ccc;
72 
    width: 500px;
73 
    height: 330px;
74 
    font-size: 24px;
75 
    display: block;
76 
  }
77 
 
78 
 
79 
</style>
80 
 
81 
</head>
82 
<body>
83 
 
84 
<div class="container">
85 
<div class="row">
86 
<div class="span12">
87 
<div class="jc-demo-box">
88 
 
89 
<div class="page-header">
90 
<ul class="breadcrumb first">
91 
  <li><a href="../index.html">Jcrop</a> <span class="divider">/</span></li>
92 
  <li><a href="../index.html">Demos</a> <span class="divider">/</span></li>
93 
  <li class="active">Live Demo (Requires PHP)</li>
94 
</ul>
95 
<h1>Server-based Cropping Behavior</h1>
96 
</div>
97 
 
98 
                <!-- This is the image we're attaching Jcrop to -->
99 
                <img src="demo_files/pool.jpg" id="cropbox" />
100 
 
101 
                <!-- This is the form that our event handler fills -->
102 
                <form action="crop.php" method="post" onsubmit="return checkCoords();">
103 
                        <input type="hidden" id="x" name="x" />
104 
                        <input type="hidden" id="y" name="y" />
105 
                        <input type="hidden" id="w" name="w" />
106 
                        <input type="hidden" id="h" name="h" />
107 
                        <input type="submit" value="Crop Image" class="btn btn-large btn-inverse" />
108 
                </form>
109 
 
110 
                <p>
111 
                        <b>An example server-side crop script.</b> Hidden form values
112 
                        are set when a selection is made. If you press the <i>Crop Image</i>
113 
                        button, the form will be submitted and a 150x150 thumbnail will be
114 
                        dumped to the browser. Try it!
115 
                </p>
116 
 
117 
 
118 
        </div>
119 
        </div>
120 
        </div>
121 
        </div>
122 
        </body>
123 
 
124 
</html>