aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorredmatrix <git@macgirvin.com>2016-01-13 17:32:09 -0800
committerredmatrix <git@macgirvin.com>2016-01-13 17:32:09 -0800
commit9584ca080c10777407c59c5939dd0cf2a88a847b (patch)
treeeaa3aa8f820d83e3305156a8b8f5cd420013b874
parent86b550e43e91f39084398bf3540ec2bd3da5d179 (diff)
downloadvolse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.tar.gz
volse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.tar.bz2
volse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.zip
some initial work on uploading and cropping cover photos
-rw-r--r--include/photo/photo_driver.php3
-rw-r--r--include/photo/photo_gd.php17
-rw-r--r--include/photo/photo_imagick.php18
-rw-r--r--mod/profile_photo.php4
-rwxr-xr-xview/tpl/cover_photo.tpl23
-rwxr-xr-xview/tpl/cropcover.tpl58
6 files changed, 121 insertions, 2 deletions
diff --git a/include/photo/photo_driver.php b/include/photo/photo_driver.php
index 0de3b9c97..dce92d8da 100644
--- a/include/photo/photo_driver.php
+++ b/include/photo/photo_driver.php
@@ -69,6 +69,8 @@ abstract class photo_driver {
abstract function cropImage($max,$x,$y,$w,$h);
+ abstract function cropImageRect($maxx,$maxy,$x,$y,$w,$h);
+
abstract function imageString();
@@ -229,6 +231,7 @@ abstract class photo_driver {
$this->doScaleImage($dest_width,$dest_height);
}
+
public function scaleImageSquare($dim) {
if(!$this->is_valid())
return FALSE;
diff --git a/include/photo/photo_gd.php b/include/photo/photo_gd.php
index 2ac7287e4..24bdc204f 100644
--- a/include/photo/photo_gd.php
+++ b/include/photo/photo_gd.php
@@ -108,6 +108,23 @@ class photo_gd extends photo_driver {
$this->setDimensions();
}
+ public function cropImageRect($maxx,$maxy,$x,$y,$w,$h) {
+ if(!$this->is_valid())
+ return FALSE;
+
+ $dest = imagecreatetruecolor( $maxx, $maxy );
+ imagealphablending($dest, false);
+ imagesavealpha($dest, true);
+ if ($this->type=='image/png') imagefill($dest, 0, 0, imagecolorallocatealpha($dest, 0, 0, 0, 127)); // fill with alpha
+ imagecopyresampled($dest, $this->image, 0, 0, $x, $y, $maxx, $maxy, $w, $h);
+ if($this->image)
+ imagedestroy($this->image);
+ $this->image = $dest;
+ $this->setDimensions();
+ }
+
+
+
public function imageString() {
if(!$this->is_valid())
return FALSE;
diff --git a/include/photo/photo_imagick.php b/include/photo/photo_imagick.php
index 3f84fd06c..32bb61342 100644
--- a/include/photo/photo_imagick.php
+++ b/include/photo/photo_imagick.php
@@ -163,6 +163,24 @@ class photo_imagick extends photo_driver {
$this->doScaleImage($max,$max);
}
+ public function cropImageRect($maxx,$maxy,$x,$y,$w,$h) {
+ if(!$this->is_valid())
+ return FALSE;
+
+ $this->image->setFirstIterator();
+ do {
+ $this->image->cropImage($w, $h, $x, $y);
+ /**
+ * We need to remove the canvas,
+ * or the image is not resized to the crop:
+ * http://php.net/manual/en/imagick.cropimage.php#97232
+ */
+ $this->image->setImagePage(0, 0, 0, 0);
+ } while ($this->image->nextImage());
+
+ $this->doScaleImage($maxx,$maxy);
+ }
+
public function imageString() {
if(!$this->is_valid())
return FALSE;
diff --git a/mod/profile_photo.php b/mod/profile_photo.php
index 2884505f0..0091d0585 100644
--- a/mod/profile_photo.php
+++ b/mod/profile_photo.php
@@ -502,8 +502,8 @@ function profile_photo_crop_ui_head(&$a, $ph, $hash, $smallest){
$width = $ph->getWidth();
$height = $ph->getHeight();
- if($width < 300 || $height < 300) {
- $ph->scaleImageUp(200);
+ if($width < 500 || $height < 500) {
+ $ph->scaleImageUp(400);
$width = $ph->getWidth();
$height = $ph->getHeight();
}
diff --git a/view/tpl/cover_photo.tpl b/view/tpl/cover_photo.tpl
new file mode 100755
index 000000000..1db139e7b
--- /dev/null
+++ b/view/tpl/cover_photo.tpl
@@ -0,0 +1,23 @@
+<div class="generic-content-wrapper-styled">
+<h1>{{$title}}</h1>
+
+<form enctype="multipart/form-data" action="cover_photo" method="post">
+<input type='hidden' name='form_security_token' value='{{$form_security_token}}'>
+
+<div id="profile-photo-upload-wrapper">
+
+<label id="profile-photo-upload-label" class="form-label" for="profile-photo-upload">{{$lbl_upfile}}</label>
+<input name="userfile" class="form-input" type="file" id="profile-photo-upload" size="48" />
+<div class="clear"></div>
+
+<div id="profile-photo-submit-wrapper">
+<input type="submit" name="submit" id="profile-photo-submit" value="{{$submit}}">
+</div>
+</div>
+
+</form>
+
+<div id="profile-photo-link-select-wrapper">
+{{$select}}
+</div>
+</div>
diff --git a/view/tpl/cropcover.tpl b/view/tpl/cropcover.tpl
new file mode 100755
index 000000000..2bfd65a8f
--- /dev/null
+++ b/view/tpl/cropcover.tpl
@@ -0,0 +1,58 @@
+<h1>{{$title}}</h1>
+<p id="cropimage-desc">
+{{$desc}}
+</p>
+<div id="cropimage-wrapper">
+<img src="{{$image_url}}" id="croppa" class="imgCrop" alt="{{$title}}" />
+</div>
+<div id="cropimage-preview-wrapper" >
+<div id="previewWrap" ></div>
+</div>
+
+<script type="text/javascript" language="javascript">
+
+ function onEndCrop( coords, dimensions ) {
+ $( 'x1' ).value = coords.x1;
+ $( 'y1' ).value = coords.y1;
+ $( 'x2' ).value = coords.x2;
+ $( 'y2' ).value = coords.y2;
+ $( 'width' ).value = dimensions.width;
+ $( 'height' ).value = dimensions.height;
+ }
+
+ Event.observe( window, 'load', function() {
+ new Cropper.ImgWithPreview(
+ 'croppa',
+ {
+ previewWrap: 'previewWrap',
+ minWidth: 850,
+ minHeight: 310,
+ maxWidth: 2400,
+ maxHeight: 872,
+ ratioDim: { x: 100, y:36 },
+ displayOnInit: true,
+ onEndCrop: onEndCrop
+ }
+ );
+ }
+ );
+
+</script>
+
+<form action="cover_photo/{{$resource}}" id="crop-image-form" method="post" />
+<input type='hidden' name='form_security_token' value='{{$form_security_token}}'>
+
+<input type='hidden' name='profile' value='{{$profile}}'>
+<input type="hidden" name="cropfinal" value="1" />
+<input type="hidden" name="xstart" id="x1" />
+<input type="hidden" name="ystart" id="y1" />
+<input type="hidden" name="xfinal" id="x2" />
+<input type="hidden" name="yfinal" id="y2" />
+<input type="hidden" name="height" id="height" />
+<input type="hidden" name="width" id="width" />
+
+<div id="crop-image-submit-wrapper" >
+<input type="submit" name="submit" value="{{$done}}" />
+</div>
+
+</form>