Jump to content


Photo

Image additions


  • Please log in to reply
74 replies to this topic

#21 apeisa

apeisa

    Hero Member

  • Moderators
  • 3,154 posts
  • 1705

  • LocationVihti, Finland

Posted 23 July 2011 - 02:58 AM

Sounds good. Overall pw image manipulation is in good shape. This is something that is sometimes a real timesaver, but never a showstopper. English only admin is a showstopper for many.

#22 Soma

Soma

    Hero Member

  • Moderators
  • 5,050 posts
  • 3815

  • LocationSH, Switzerland

Posted 23 July 2011 - 03:34 AM

How about the possibility to create a config for defining various image sizes?

{
"news_small" => "50,0,70", ([w,h,compr])
"news-big" => "700,0,70",
"portfolio-small" => "50,50",
"portfolio-medium" => "100,100",
"portfolio-big" => "800,0,100"
}

So $image->original would be the uploaded raw picture, while you could use $image->thumb("portfolio-medium") ...
which would be produced on demand. Don't know if it would fit in your concept, but just wanted to throw in my thoughts.

@somartist | modules created | support me, flattr my work flattr.com


#23 apeisa

apeisa

    Hero Member

  • Moderators
  • 3,154 posts
  • 1705

  • LocationVihti, Finland

Posted 23 July 2011 - 04:39 AM

Soma: good idea, but that is pretty much supported already. You can do those resizes on the fly in your templates. What we are trying to achieve now is to have visual cropping tool without messing with UI and api too much.

#24 Pete

Pete

    Forum Admin

  • Administrators
  • 2,420 posts
  • 1455

  • LocationChester, England

Posted 23 July 2011 - 04:57 AM

But surely the problem with doing the on the fly is that they're done every page load and affects the user's experience when browsing the site if a thumbnail is to be created on the fly as well? Or am I not understanding this correctly (far more likely ;)).

I think the idea of a config setting where you can set options when creating the field could be the way to go.

#25 apeisa

apeisa

    Hero Member

  • Moderators
  • 3,154 posts
  • 1705

  • LocationVihti, Finland

Posted 23 July 2011 - 06:00 AM

But surely the problem with doing the on the fly is that they're done every page load and affects the user's experience when browsing the site if a thumbnail is to be created on the fly as well? Or am I not understanding this correctly (far more likely ;)).


Image resizing is done only on first page load, so it affects very little for overall user experience. PW always first checks if there is already required image on right size and resizes only if image is missing. You can actually do very nice resizing already: http://villarental.c...esidio-del-mar/ (new site developed by Ryan).

I have nothing against defining various image sizes. It is pretty much same than one of the ideas that Ryan mentioned in his long reply. Presetting different images, like thumbnail, medium etc...  That would require much more work in UI  (cropping for each variation? preview?) and also require more coding on field setting (although using JSON would be possible shortcut here). That would be very powerful solution, no doubt. Although I believe that over 90% of sites doesn't require more than one cropping variation of each image (sizes and center cropping are well supported already). If multiple sizes are possible with clear and well working solution, I am all for it.

#26 Pete

Pete

    Forum Admin

  • Administrators
  • 2,420 posts
  • 1455

  • LocationChester, England

Posted 23 July 2011 - 06:39 AM

Oh right, I didn't realise the system was already as smart as that :)

#27 ryan

ryan

    Reiska

  • Administrators
  • 7,797 posts
  • 6571

  • LocationAtlanta, GA

Posted 24 July 2011 - 09:05 AM

You can define config settings for your own use. What I do on a lot of sites is define some of the common image dimensions in my /site/config.php file and just call upon these when I need them:

$config->myThumbWidth = 150;
$config->myThumbHeight = 100;

Then when you need to create a thumbnail, just refer to those:

$thumb = $page->image->size($config->myThumbWidth, $config->myThumbHeight);

This may be a preferable way to do it if you have multiple templates that need to use the same dimensions. That way you aren't specifying the same dimensions in multiple places... though I'm not always that disciplined. :)

#28 Marty Walker

Marty Walker

    Sr. Member

  • Members
  • PipPipPipPip
  • 476 posts
  • 274

  • LocationKatoomba, AU

Posted 28 July 2011 - 04:31 AM

Hi,

Here's a video I made showing how I use textpattern (+ plugin) to create thumbnails. I wasn't sure I got my point across well enough in my post. I hope it makes sense. :)



Looks like the jCrop site is back up too: http://deepliquid.co...tent/Jcrop.html

Regards
Marty

#29 ryan

ryan

    Reiska

  • Administrators
  • 7,797 posts
  • 6571

  • LocationAtlanta, GA

Posted 28 July 2011 - 08:49 AM

Marty, thanks for making that video and posting. It was helpful to watch that, and I think it seems like a great jCrop implementation there. How did the thumbnails go from what you showed in the video into that grid of illustrations? Were they  tagged to appear there, or are they somehow placed with a richtext editor?

Thanks,
Ryan

#30 Adam Kiss

Adam Kiss

    Master of the universe

  • Moderators
  • 1,129 posts
  • 327

Posted 28 July 2011 - 09:09 AM

I'm sorry I still don't get how this applies to PW and its in-template-its-php-file thumbnail generation. Not to be sceptic, but I can't imagine right now how tool like jCrop can be beneficial in picture->thumbnail generation.

I can see this as a tool in the administration, to edit pictures in pages... but as a tool to generate thumbnails?

#31 ryan

ryan

    Reiska

  • Administrators
  • 7,797 posts
  • 6571

  • LocationAtlanta, GA

Posted 28 July 2011 - 09:56 AM

It's true that an interactive resize isn't all that valuable when working with just an image(s) field, because the site (via your template) is going to create it's own thumbnail automatically. While the resize may not be so useful there, the cropping still is, because the site will create it's thumbnail consistent with your defined crop. This is how you ensure that the auto-generated thumbnails aren't cutting off people's heads (as an example).

But things change when you bring in TinyMCE. In that context, cropping is just as useful as the existing resize functionality already built into it. As a matter of simplicity, we'll probably set it up so that resize+crop are accessible in any context, but a copy of the original image will always be kept behind-the-scenes.

#32 Marty Walker

Marty Walker

    Sr. Member

  • Members
  • PipPipPipPip
  • 476 posts
  • 274

  • LocationKatoomba, AU

Posted 28 July 2011 - 04:50 PM

Hi Ryan,

All that plugin does is replace the system's internally generated thumbnail with it's own. In textpattern there's an association between the full image and the thumbnail - if it exists. There's what's called an "article image" field that has an image picker (another plugin) which lets him select a thumbnail to go there. The code below (using another plugin) links the thumbnail to the original image.

So my lightbox code looked like this:
<li><a href="<txp:upm_img_full_url />" title="<txp:title />" rel="lightbox"><img src="<txp:upm_img_thumb_url />" alt="<txp:title />"></a></li>

Otherwise the ordinary textpattern tag to display a thumbail would be:
<txp:article_image thumbnail="1" />
.

@adamkiss: It's really all about having more control over what part of the image I want to show as a thumbnail. I am looking at this with artists in mind so my opinion might be skewed somewhat. :) Perhaps this kind of cropping option should be an optional module rather than a core feature.

Regards
Martin

Marty, thanks for making that video and posting. It was helpful to watch that, and I think it seems like a great jCrop implementation there. How did the thumbnails go from what you showed in the video into that grid of illustrations? Were they  tagged to appear there, or are they somehow placed with a richtext editor?

Thanks,
Ryan



#33 Marty Walker

Marty Walker

    Sr. Member

  • Members
  • PipPipPipPip
  • 476 posts
  • 274

  • LocationKatoomba, AU

Posted 01 August 2011 - 07:01 PM

Here's an interesting idea: http://www.defusion....519/cropper.php

Perhaps as an alternative to having manual cropping built in there could be some way to hold the coordinates of the selection. Those coordinates could then be used with phpThumb: http://phpthumb.sour...mo.demo.php#x24

I have no idea if this is even possible. Smarter minds than me could figure this out though. :)

Regards
Marty

#34 apeisa

apeisa

    Hero Member

  • Moderators
  • 3,154 posts
  • 1705

  • LocationVihti, Finland

Posted 02 August 2011 - 01:10 AM

Hmm.. This got me thinking. What we would need for API usage is not cropping, but just to set the point where to center the cropping. So if you have image of person's head, you could click between person's eyes so there wouldn't be any cropped heads.

For RTE-use I think just any working cropping tool would do, but I am not that interested about that :)

#35 Marty Walker

Marty Walker

    Sr. Member

  • Members
  • PipPipPipPip
  • 476 posts
  • 274

  • LocationKatoomba, AU

Posted 02 August 2011 - 05:05 AM

Hmm.. This got me thinking. What we would need for API usage is not cropping, but just to set the point where to center the cropping. So if you have image of person's head, you could click between person's eyes so there wouldn't be any cropped heads.

For RTE-use I think just any working cropping tool would do, but I am not that interested about that :)


But not all crops are based on squares. How do you allow for designs that require rectangular proportions?

#36 apeisa

apeisa

    Hero Member

  • Moderators
  • 3,154 posts
  • 1705

  • LocationVihti, Finland

Posted 02 August 2011 - 06:28 AM

It doesn't matter if it is square or rectangle. Rectangle has also a center point (sorry, don't know the actual terms here).

<?php
$thumb = $page->image->size(200, 100); //width: 200px, height: 100px


#37 Pete

Pete

    Forum Admin

  • Administrators
  • 2,420 posts
  • 1455

  • LocationChester, England

Posted 02 August 2011 - 06:46 AM

I think that for the jCrop type implementation you are giving the user the ability to set what gets cropped (which has already been said earlier) - by default it just goes of whether it hits the width or height of the original image first whereas what jCrop lets you do is select part of an image (and you can set fixed dimensions too so users are forced to drag a rectangle at 16:9 ratio for example) which then tied in better with thumbnailing on the front-end.

For now it works fine and on the site I'm building I'm very impressed with it, but with some optional jCrop functionality it would be amazing :)

Looking back at that, I'm just reiterating what others have said here, but fixed aspect ratio is a good thing to be able to set as well I reckon.

#38 Pete

Pete

    Forum Admin

  • Administrators
  • 2,420 posts
  • 1455

  • LocationChester, England

Posted 16 August 2011 - 03:38 AM

Just a quick one as I know 2.1 is nearly here - is there any chance that we can have one of the things mentioned here applied to the functionality when you're adding an uploaded image to an RTE field?

Whilst it's useful to be able to drag an image down to size to create a thumbnail, it's a bit fiddly to get it to a precise size each time. There are a few pages where I want to dot pictures throughout an article but want the thumbnails to be consistently the same width.

The solution in another CMS is having two fields where you can enter width and height, and a checkbox that's checked by default that constrains the proportions (see attached image). Can something like this be added easily enough? I think it would just make it a bit easier to use.

Attached Thumbnails

  • image-editor.gif


#39 ryan

ryan

    Reiska

  • Administrators
  • 7,797 posts
  • 6571

  • LocationAtlanta, GA

Posted 16 August 2011 - 08:40 AM

I think that makes sense, I've added it to the list:

https://github.com/r...n/P21/issues/28

#40 Marty Walker

Marty Walker

    Sr. Member

  • Members
  • PipPipPipPip
  • 476 posts
  • 274

  • LocationKatoomba, AU

Posted 19 August 2011 - 05:52 AM

Hi,

I have a reasonably urgent need for something similar to jCrop in ProcessWire. If anyone is capable of working on this (as a paid gig) please get in touch: martin@smd.net.au :)

Regards
Martin




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users