rejetto forum

thumbnails on the fly

SamePaul · 34 · 15197

0 Members and 1 Guest are viewing this topic.

Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
I guess it is not really right place to ask question, but can't create new topic.

Anyway, the question is: is there any way to run some program and use it's output as data to be sent to client?
For example, I have pictures gallery and want to show them in with small thumbnails. On regular web-server I would write something like
<a href="pic1.jpeg"><img src="gen_preview.php?file=pic1.jpeg&height=30" />pic1.jpeg</a>

Maybe in HFS template I can do something similar? The ideal would be running utility on the fly and use its output. But if HFS can somehow run utility to generate thumbnail file during HTTP request, it is good too.

Using original size of picture is not an option, because pictures are hi-res and I have relatively narrow upstream. Moreover, cellular traffic is still limited.


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
I guess it is not really right place to ask question, but can't create new topic.

you must go the the board's topics index, there you'll find the "new topic" button.
it's a mess, so consider CTRL+F to find it in the page.

Quote
Anyway, the question is: is there any way to run some program and use it's output as data to be sent to client?

yes, command {.exec.} does just that.
you'll find details at http://www.rejetto.com/wiki/index.php/HFS:_scripting_commands#Others

Quote
For example, I have pictures gallery and want to show them in with small thumbnails. On regular web-server I would write something like
<a href="pic1.jpeg"><img src="gen_preview.php?file=pic1.jpeg&height=30" />pic1.jpeg</a>

you should consider this is a very heavy task, this way of doing is not suited.
my suggestion is to refer to the thumbnail as a simple file whose name is derived directly from the original file.
like src="preview/%item-name%"
same name, but in a sub-folder.
just, at the time of pointing this thumbnail, you ensure it exists, and in negative case you run the program that creates it.
{.if not|{.exists|preview/%item-name%.}|{:{.exec|resize.exe "%item-name%" "preview/%item-name%".}:}.}

this is just a draft of course.


Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
excellent! Thanks for link and explanation.

In case i want to use program output, how it is sent?
Lets consider the following template:

<img src="{.exec|test.exe "%item-name%".}" />

and output of test.exe is "123456789". How this data is transferred? How would look final HTML? My guess is:
<img src="12345678" />
am I right?

If so how can i emulate PHPish behaviour?  maybe I can write template like this:

<img src="%item-name%?section=thumbnail" />

[thumbnail]
{.exec|resize.exe "%item-name%".}

where resize.exe outputs jpeg data to stdout. will this work? Not sure if URL syntax is correct, but I guess you get the idea.


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
I think you are muddling a bit.

The output of the exec will never be the jpeg itself. The browser is not reading in "src" the data itself, but only the path to the file.
So, eventually the utility you run should return the path, and i guess that's not what it is doing.
You'll probably will have to specify yourself the path to the utility, so you'll just have to copy this path to the "src" as well.
The only case you are supposed to capture this output is to check if the utility completed its job as it was supposed to do.

You are able anyway to return the output to the browser, you'll have to do
{.exec|command.exe|out=x.}{.^x.}
that means put the output in x, and then give x.
currently there's no option to give the output directly without using the variable.

more, i don't understand why you try to use that [section], i don't think you have any need of it.


Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
I'm not muddling, but you just misinterpret. Why not jpeg itself? Application can output whatever it wants, right? :)

Again, here is part of template. Originally I made mistake, because I didn't remember syntax. Here how it should be

Quote
...
<img src="%item-name%/~thumbnail" />
...

[thumbnail]
{.add header|Content-Type: image/jpeg.}
{.exec|resize.exe "%current-path%".}

HFS will generate the following HTML
Quote
...
<img src="picture1.jpeg/~thumbnail" />
...
Now browser receives this HTML, it sees <img> tag and 'src'. Assuming, that addres of page is http://mysite.com/somefolder/ the browser now tries to fetch URL "http://mysite.com/somefolder/picture1.jpeg/~thumbnail" to load image.

If I remember correctly it will cause HFS to take section "thumbnail" from template, process it and the result return to browser.
Now, if I understand right, you say that {.exec.} will not cause HFS to replicate application's output to browser?

Lets consider another example. I have section in template
[mysection]
{.exec|print_some_html.exe.}


output of print_some_html.exe is always same:
<html>
<body>
Hello World!
</body>
</html>


Now I type in browser this address
http://mysite.com/~mysection

What will I see in browser? Empty page? "Hello World"?


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
did you consider the part where i said
you should consider this is a very heavy task, this way of doing is not suited.

this will kill your computer.


What will I see in browser? Empty page? "Hello World"?

Empty. As i said you in my previous post, you just need to
{.exec|print_some_html.exe|out=x.}{.^x.}
« Last Edit: August 05, 2010, 01:01:18 PM by rejetto »


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
will consider for the future a command like this
{.image|src=file|width=x|dst=outfile.}
because it should be possible with very few lines


Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
did you consider the part where i said
this will kill your computer.
Of course I consider and it is good solution. Here is trade off, however, because once thumbnails are created they become visible in HFS as well and their displaying will cause creation of thumbnails of thumbnails recursively. This can be solved of course, but solution becomes less trivial than it seems.
About killing computer i wouldn't really worry. Firefox usually pipelines ~10-20 requests to server. Running 20 lightweight resizers simultaneously won't be tremendous hit... unless you use Photoshop for this purpose :)

Empty. As i said you in my previous post, you just need to
{.exec|print_some_html.exe|out=x.}{.^x.}

Ok, that's fine. Also, I think there is problem to invoke [section] on file.
For example, if I enter URL http://mysite.com/somefolder/picture1.jpeg/~thumbnail HFS will rather return error, than execute [thumbnail] section. :(


Offline SilentPliz

  • Operator
  • Tireless poster
  • *****
    • Posts: 1298
  • ....... chut ! shh!
    • View Profile
Firefox usually pipelines ~10-20 requests to server. Running 20 lightweight resizers simultaneously won't be tremendous hit... unless you use Photoshop for this purpose :)

Running 20 lightweight resizers simultaneously ...  performing their task on the client side.

People on your site will not tell you thank you.   ;)

To get an idea, put this in the default template, and browse to a folder containing twenty photographs (*.jpg).

[file=folder=link|private]
   <tr class='{.if not|{.or|{.get|can delete.}|{.get|can access.}|{.get|can archive item.}.}|non.}selectable {.if|{.mod|{.count|row.}|2.}|even.}'><td>
  {.if|{.get|is new.}|<span class='flag'>&nbsp;<BLINK>{.!NEW.}</BLINK>&nbsp;</span>.}
  {.if not|{.get|can access.}|<img src='/~img_lock'>.}
  <a class='the-item' href="%item-url%"><img src="%item-icon%"> %item-name%</a>
  {.if| {.?search.} |{:{.123 if 2|<div class='item-folder'>{.!item folder.} |{.breadcrumbs|{:<a href="%bread-url%">%bread-name%/</a>:}|from={.count substring|/|%folder%.}/breadcrumbs.}|</div>.}:} .}
{.switch|%item-ext%|,|jpg,gif,png,ico,bmp|
<table>
<a href="%item-url%" target="_blank" >
<fieldset>
<center><IMG alt="" src="%item-url%" style="width="120"; height="100"; border="5";</a></center>
</fieldset>
</table>
.}

{.123 if 2|<div class='comment'>|{.commentNL|%item-comment%.}|</div>.}
« Last Edit: August 05, 2010, 02:19:21 PM by SilentPliz »


Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
Running 20 lightweight resizers simultaneously ...  performing their task on the client side.

People on your site will not tell you thank you.   ;)
You are so sure. Pity you are not so right. ;)
Little piece of advice: don't dismiss user's requirements and don't substitute it with own.

Task is performed at correct side according to requirements and usage model.

<center><IMG alt="" src="%item-url%" style="width="120"; height="100"; border="5";</a></center>

specially for you again
Quote
Using original size of picture is not an option, because pictures are hi-res and I have relatively narrow upstream. Moreover, cellular traffic is still limited.


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
99.9% of systems out there save to file the result of the resizing, just the first time. Other times the result (the thumbnail) is simply accessed.
This way will spend like 2% of your hard drive space and will free like 80% of your CPU.
And i will not mention disk activity, being that for every 50kb thumbnail you will avoid reading the 1000kb full size version to resize it.
Doesn't this sound like a good option?


Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile
Ok, that's fine. Also, I think there is problem to invoke [section] on file.
For example, if I enter URL http://mysite.com/somefolder/picture1.jpeg/~thumbnail HFS will rather return error, than execute [thumbnail] section. :(

you should consider accessing /folder/~thumbnail?file=picture1.jpeg
and then using {.?file.} to know the file


Offline SamePaul

  • Occasional poster
  • *
    • Posts: 72
    • View Profile
99.9% of systems out there save to file the result of the resizing, just the first time. Other times the result (the thumbnail) is simply accessed.
This way will spend like 2% of your hard drive space and will free like 80% of your CPU.
And i will not mention disk activity, being that for every 50kb thumbnail you will avoid reading the 1000kb full size version to resize it.
Doesn't this sound like a good option?

As I said previously, it is definitely good solution worth of consideration. I just have another scenario which requires true dynamic thumbnail generation and for this task I insisted to clarify alternative solution. I was sure that HFS is capable of performing complex tasks, but my experience with templates is very limited.

you should consider accessing /folder/~thumbnail?file=picture1.jpeg
and then using {.?file.} to know the file

awesome! this would do the charm. Thank you very much!


Offline SilentPliz

  • Operator
  • Tireless poster
  • *****
    • Posts: 1298
  • ....... chut ! shh!
    • View Profile
You are so sure. Pity you are not so right. ;)
Little piece of advice: don't dismiss user's requirements and don't substitute it with own.

You're right.

Given the level of understanding, it is better that I should give my point where my contributions are understood.

Thank you anyway for the advice.

bye!


Offline TSG

  • Operator
  • Tireless poster
  • *****
    • Posts: 1935
    • View Profile
    • RAWR-Designs
If this is about HFS, I have seen it done using our TPGen http://www.rawr-designs.com/projects/tpgen/index.html

I really wish Giant Eagle would write a readme about how to use the command line operations for it.

I am not sure if it keeps re-making them or checks to see if they already exist. I know it can create only thumbnails/previews from 'new' images that don't already have it... but not sure about how it works through command line. Something for Richard to consider if he ever upgrades it some more.
« Last Edit: August 06, 2010, 11:11:36 AM by TSG »