Custom image size and position

studioahoy / 2013-11-16 10:08:38   

Hello :)

I'm working on migrating sarahsmutskennedy.com to indexhibit (dev.studioahoy.com). Two things remain that look like they may require editing ndxzstudio code:

1. Custom image size. Actually just the height. I imagine one button-set: small, medium, large.

2. Image alignment. Two buttons: top, bottom.

I'm no code-pro but I've had a look in the database and it looks like the 'media' table would require a couple of extra columns. Then it would make sense to display the buttons on the exhibit > image options frame where one would add a title/caption for an image. Looks like this might be the 'page_img()' function.

Is this possible/advisable?

Of course I've adapted the horizontal exhibit. I can see some workings relating to custom image height and alignment (looks like a centre align). Is this something in similar in the works? or just my wishful thinking?

The only workaround I can see would be to use the tag function to tag each image with height/alignment details and then have the exhibit read these when processing the images. Of course this would be an ugly hack of sorts perhaps rendering the tag function unusable.

Thoughts?

Vaska A / 2013-11-16 17:47:02   

Hello!

Custom height ONLY is a bit tricky - it depends upon the format. There is a beta of Horizontal that has that feature around here somewhere.

studioahoy / 2013-11-20 09:18:09   

OK. I've been successful in adding two fields to the media table (media_scale, media_pos) and also linking these with the CMS via radio buttons on the exhibit > image option frame. So that bit works but I've had no luck in getting the format to resize the images appropriately. I suspect the issue is with reading in the new database fields but here's a snapshot of my updated code in the horizontal format file:

            foreach ($do as $go)
            {
                // we should do the resize exercises here...
                if ($this->force_height != 0)
                {    
                    $dpx_height = 0;
                    $dpx_height = ($go['media_scale'] != 1) ? $this->half_height * 2 : $this->force_height * 2;
                    $name = 'rsz_h' . $dpx_height . '_' . $OBJ->vars->exhibit['id'] . '_' . $go['media_id'] . '.' . $go['media_mime'];
                    
                    if (!file_exists(DIRNAME . '/files/dimgs/' . $name))
                    {
                        // get dimensions and resize
                        // need to set this up for folder source as well - later
                        $path = ($go['media_dir'] != '') ? $go['media_dir'] : 'gimgs';
                        
                        $source = ($go['media_thumb_source'] == '') ? $go['media_file'] : $go['media_thumb_source'];
                        
                        $size = getimagesize(DIRNAME . "/files/$path/" . $source);
                        
                        //echo DIRNAME . "/files/$path/" . $go['media_file'] . ' / ';

                        // new dimensions based on the height
                        $new_width = (($size[0] * $dpx_height) / $size[1]);
                        
                        // we're going to resize and output
                        $R->reformat($new_width, $dpx_height, $size, $go, $OBJ->vars->exhibit['id'], $name, $go['media_dir']);
                        
                        $the_file = '/files/dimgs/' . $name;
                    }
                    else
                    {
                        $the_file = '/files/dimgs/' . $name;
                    }
                }
                else
                {
                    $the_file = GIMGS . '/' . $go['media_ref_id'] . '_' . $go['media_file'];
                }

Any help appreciated!

Vaska A / 2013-11-20 09:46:51   

Why would you need to do that?

You could simply embed this kind of into your format - since it's very custom.

I really don't understand what you are doing here...

studioahoy / 2013-11-20 18:07:14   

>>> Why would you need to do that?

Well, the idea is that the database records either a 1 or 0 to indicate whether the height of the image is full-height ($this->force_height) or half-height ($this->half_height). For each image the format uses this value to resize the image accordingly.

>>> You could simply embed this kind of into your format - since it's very custom.

I wish I could but unfortunately I'm no coding pro. The best I can do is try to follow what is happening in an existing format and add/alter at points.

>>> I really don't understand what you are doing here...

One thing I should have said is that dpx_height refers to 'double pixel height'. I've tried to make the images look good on high-res (retina) displays. To do this I've followed the approach of resizing the images to double the pixel dimensions (at a lower quality) but display them at the original dimensions. The increased filesize is offset by the lower quality image which doesn't affect how it looks on high-res display (iPad).

dev.studioahoy.com/

The outcome is that all the images resize to the half-height size which makes me think that perhaps the code is not reading the values from the database or there's just a problem with my syntax :)

Vaska A / 2013-11-20 18:31:42   

Ok, I still don't understand but you seem to know what you are doing with these things...not much I need to add here.

This thread has been closed, thank you.