Automatic and user friendly intro-image thumbnails creation

487 views
Skip to first unread message

OLSA

unread,
Sep 26, 2013, 2:25:26 PM9/26/13
to joomla-de...@googlegroups.com
Hello for all,

my opinion is that one of Joomla drawback is intro-view, and always had to do some improvisations to get different view variant like for "category blog" to get that intro-images go to left, and on the right title with limited intro-text (something like news, portal sites). And, ok it's can be done with intro-image field inside article manager and with template overide.

But, my new idea is to create simplest process for users:
1. in editor user upload some image
- and after that:
2. right click on that image and option "set as intro-image"

- or

2. select image, and with new editor button/plugin "Set as intro-image"

In that event javascript grab selected image path and write new generated path value inside input filed "art_intro_image".
That value has to include path to new created thumbnail, and that is my question:

Has anyone done anything similar - creating thumbnails on some event inside editor and automatic writing that new path value to intro-image field?

After that it would be possible with template overide, or new menu type to create many different variants of intro view, and it would be user friendly.

Thanks.

Matt Thomas

unread,
Sep 26, 2013, 3:21:21 PM9/26/13
to Joomla! General Development
You might want to take a look at how K2 does that.

Best,

Matt Thomas
Founder betweenbrain
Phone: 203.632.9322
Twitter: @betweenbrain




--
You received this message because you are subscribed to the Google Groups "Joomla! General Development" group.
To unsubscribe from this group and stop receiving emails from it, send an email to joomla-dev-gene...@googlegroups.com.
To post to this group, send an email to joomla-de...@googlegroups.com.
Visit this group at http://groups.google.com/group/joomla-dev-general.
For more options, visit https://groups.google.com/groups/opt_out.

Message has been deleted
Message has been deleted

OLSA

unread,
Sep 26, 2013, 4:25:32 PM9/26/13
to joomla-de...@googlegroups.com
@betweenbrain

Thank you, yes I know that but I prefer to use Joomla native structure (much as possible)

like content tables etc.
And also there is no need to change table structure because intro-image filed
already store value in Json format (images cell in Json format, inside #__content).

piotr_cz

unread,
Sep 26, 2013, 4:49:53 PM9/26/13
to joomla-de...@googlegroups.com
Hi, this is definitely possible using content plugin.

You check if thumbnail is already available and if not, you create one using great JImage package and update the database

You may even easily sharpen it after resizing.

Check out the framework manual, just remember to use JImage instead of Image:


I've submitted 2 pull requests to enhance generating thumbnails, but these aren't merged yet:

Fill image background with custom color:

Scale to fit

OLSA

unread,
Sep 27, 2013, 12:28:41 AM9/27/13
to joomla-de...@googlegroups.com

thanks, I totally agree with you to use JImage for thumbnails, but in what step or event? Inside article creation with Joomla image uploader/insertion.. than use JImage..., or totally different direction, like many Joomla resize plugins do, onContentPrepare, or onContentBeforeDisplay (and parse HTML with regular expression to check/get image data).
I want to avoid onContentPrepare for that part (generate thumbnails). Also want that users have controll to select specific article image as intro...

piotr_cz

unread,
Sep 27, 2013, 4:19:08 AM9/27/13
to joomla-de...@googlegroups.com
It's you job to figure out which event to use.
From checking content plugins, I think the simplest think would be to use something alike:

onContentPrepare($context, &$article, &$params, $page = 0)
{
    // If not an article, exit
    if ($context !== 'com.content.article')
    {
        return;
    }

    // Access image
    $images = new JRegistry($article->images);

    $imageIntro = $images->get('image_intro');
    $imageFull = $images->get('image_full');

    // Exit if intro image assigned manually or there's no full image
    if ($imagesIntro || !$imageFull)
    {
        return;
    }

    // Get path to thumbnail
    $imageIntroPath = 'images/thumbails/' . $imageIntro;

    // If thumbnail hasn't been already generated and doesn't exist
    if (!is_file($imageIntro))
    {
        // Generate and save
        //..
    }

    $images->set('image_intro', $imageIntroPath);

    // Assign to article as a JSON string
    $article->images = (string) $images;

OLSA

unread,
Sep 27, 2013, 5:45:22 AM9/27/13
to joomla-de...@googlegroups.com
 piotr_cz,

we have little disagreement ;) completly understand you and agree 100% in that case, but I don't want to "catch" or check db values for intro->image, or full->image fields,
I want to get user option to select image inside editor (Tyni, JCK...) and press button "Set as intro image". That event can initialise some ajax call to some simple "com_thumbs", and inside it
 something like "jimport('joomla.image.image')"..... generating thumbnail, and at the and we get sucsesfull response with something like "path/art_id_dimension_imgName.jpg".
and last step would be something like "document.getElementById('art_image_intro').value =  response".

Right now I want to find option how to communicate with editors (get selected image path), because all others works ok..

Your suggestion to use JImage was helpful to me! My first idea was to import some different library (I am still on 2.5...), but no need for that, you were right. Thank you!
  

piotr_cz

unread,
Sep 27, 2013, 6:40:24 AM9/27/13
to joomla-de...@googlegroups.com
ah, I see.
In that case you probably want to create an xtd-editor button that will execute com_thumbs which will pass the new thumbnail to Editor window using simple editor API:
jInsertEditorText(tag, editorId);
Reply all
Reply to author
Forward
0 new messages