kolber / stacey

Cheap & easy content management
http://staceyapp.com
MIT License
1.04k stars 132 forks source link

Ability to resize manual images (using Slir) as a text-file variable (Feature request) #95

Closed o-l-e closed 10 years ago

o-l-e commented 11 years ago

Hi, this is basically an idea for a way to use SLIR image resizing using text-file variables.

I already use the {{ path }} variable to fetch the actual image like this:

![Alt text]({{ path }}01.jpg "Title text")

But, it could be really nice to be able to do something like this (or some other way way of course):

![Alt text]({{ resize_path(path, 150, 150, 0, 100) }}01.jpg "Title text")

I thought it could be useful in cases where you want to create a smaller version of an image in your text content, but still use the often large image file your page folder.

I don't know if this would even be possible?

Would like to hear your thoughts on this, or even just a conformation if it's not possible.

Thanks again for a fantastic app!

mjau-mjau commented 11 years ago

I don't see the point of that. Why not just use the image.url or page.thumb.url and create two different sizes, for example: <img src="{{ resize_path( image.url, '600', '', '2:1', 95) }}" ... large <img src="{{ resize_path( image.url, '100', '', '1:1', 95) }}" ... small square

o-l-e commented 11 years ago

@suncat100 i see your point. I just thought of some way of extending the logic of the {{ path }} variable that is already there. But i guess your suggestion is the same.

o-l-e commented 11 years ago

@suncat100 the solution you suggested doesn't actually work.

I have tried this:

title: Index
content: +++
<img src="{{ resize_path( image.url, 100, 100, 0, 95) }}01.jpg" />
+++

and this:

title: Index
content: +++
<img src="{{ resize_path( page.image.url, 100, 100, 0, 95) }}01.jpg" />
+++

Doesn't seem like variables can be used within text-file variables :(

mjau-mjau commented 11 years ago

sorry, it depends on your template and how you are doing it, but first of all, you cannot append "01.jpg" to the end of it. The "resize_path" is a wrapper for the main SLIR function in Stacey, that looks up an image, resizes it (or gets from cache), and returns the URL string. It would just be wrong if you had 01.jpg at the end ... Furthermore, my variable names were just an example ... normally you might get the urls from a loop. For example I have this for some small images I am making:

{% for image in child.images %}
    <img src='{{ resize_path( image.url, "262", "", "2:1", 95) }}' alt='{{ image.title }}'>
{% endfor %}

If you are going to use variables, you would need to replace image.url with a variable that represents the path to the image ... not just a path to the folder. The resize_path() function needs an image.

o-l-e commented 11 years ago

aha, now i get it. I should of understood that it needs a wrapper in order to resize it. I was trying to do it like the old Stacey:

  ![Alt text](@path01.jpg "Title text")

I know how to use variables in templates, but in this case i want to use images in between text like a news article or similar. I Could resize the images manually if i have to.

But, again, wouldn't it be nice with some kind of variable to resize images manually like my initial question?

mjau-mjau commented 11 years ago

I guess my main point was that you can't add a FOLDER path to the resize_path() function (because its looking for an IMAGE). I am curious though, why do you need to store some path as a variable? What does that path refer to exactly? Most paths are stored in Stacey-created variables that are always accessible.

If you do insist on using a var, it should work like this, as long as the VAR represents a path to an image:

<img src='{{ resize_path( VAR, "500", "", "", 95) }}'>

You could create an image path variable from your folder path variable, and then apply it to the resize:

{% set image_path = path+'01.jpg' %}
<img src='{{ resize_path( image_path, "500", "", "", 95) }}'>

To be honest, TWIG seems a bit tedious when working with variables and stuff. I'm a bit new to it.

mjau-mjau commented 10 years ago

Just looking at some old posts, and not sure why this was not mentioned ... The resize_path() function is just an alias for the SLIR image resizer anyway, which you can also access like this:

render/w730-h-c2:1-q95/{{ path }}01.jpg

So basically, you can add resized images like that in your text file. Just set the resize parameters in the path as example above.

o-l-e commented 10 years ago

Sorry @suncat100, it does not work unfortunately.

This:
./render/w100-h100-c2:1-q95/{{path}}thumb.jpg
renders this:
./render/w100-h100-c2:1-q95/./content/index/thumb.jpg

It should render like this:
./render/w100-h100-c2:1-q95/index/thumb.jpg

Would it be possible to create a Twig extension for something like this? Though i don't know how to :)

mjau-mjau commented 10 years ago

sorry, I have not used this in yml/txt files ... but since the string is so complicated anyway, you might as well just write the correct path without using {{ path }}. I guess my point was that the resize functionality is still available to you, but not with the resize_path function.

/render/w100-h100-c2:1-q95/index/thumb.jpg

I don't think the txt/yml renders with TWIG at all (I might be wrong), and I think the {{ path }} var is simply a Stacey-native fix. I also think you will not see much work to add dynamic functionality to the yml/txt files ... Part of the point is that they are supposed to be static files providing content to the template files which do all the heavy lifting.