diff options
| author | redmatrix <git@macgirvin.com> | 2016-01-13 17:32:09 -0800 |
|---|---|---|
| committer | redmatrix <git@macgirvin.com> | 2016-01-13 17:32:09 -0800 |
| commit | 9584ca080c10777407c59c5939dd0cf2a88a847b (patch) | |
| tree | eaa3aa8f820d83e3305156a8b8f5cd420013b874 /view | |
| parent | 86b550e43e91f39084398bf3540ec2bd3da5d179 (diff) | |
| download | volse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.tar.gz volse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.tar.bz2 volse-hubzilla-9584ca080c10777407c59c5939dd0cf2a88a847b.zip | |
some initial work on uploading and cropping cover photos
Diffstat (limited to 'view')
| -rwxr-xr-x | view/tpl/cover_photo.tpl | 23 | ||||
| -rwxr-xr-x | view/tpl/cropcover.tpl | 58 |
2 files changed, 81 insertions, 0 deletions
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> |