Advanced search  

News:

CPG Release 1.6.26
Correct PHP8.2 issues with user and language managers.
Additional fixes for PHP 8.2
Correct PHP8 error with SMF 2.0 bridge.
Correct IPTC supplimental category parsing.
Download and info HERE

Pages: [1]   Go Down

Author Topic: Filmstrip image display bordering using fixed height thumbnails  (Read 8824 times)

0 Members and 1 Guest are viewing this topic.

Cornetto

  • Coppermine newbie
  • Offline Offline
  • Posts: 9
Filmstrip image display bordering using fixed height thumbnails
« on: January 28, 2014, 10:24:17 pm »

Hello Operators,
1. Link to website with coppermine installation
http://www.ianscottphoto.com/mercury

2. Screenshot attached

3. Background information
Coppermine Version 1.5.26
Theme is a simple colored variant of "Eyeball", but this issue occurs across themes: curve, eyeball, classic, etc. (themes with horizontal filmstrips)

4. Explanation of issue:
We would like to have our images in the filmstrip have a 10px border around them and the images displayed on the filmstrip evenly, so that our "landscape style" images fit in neatly and predictably alongside our "portrait style" images.

5. Additional information
We use only two types of images, a "landscape style" image in which the original size is 1350px width and 900px height, and a "portrait style" image in which the original size is 600px width and 900px height.

Our current configuration settings are:
In "Image View": the "Number of items in filmstrip" is set to "5"
In "Thumbnail Settings": the "Use dimension" is set to "Height"
In "Thumbnail Settings": the "Max dimension of thumbnail" is set to "120px"

After an exhaustive search of the forum, I was able to find information that allowed us to set all of the images in the filmstrip to display within a 180px width cell, however this is not the solution to our issue, as our "portrait style" images display large (black) borders between any "portrait style" images as they display next to "landscape style" images in the filmstrip.
The setting to display all of the images in the thumbnail to a static width was to set the "thumb width" setting to "180" in line 3178 of the file "functions.inc.php" in the folder "Includes".

Could anyone enlighten me as to how to get the images in the filmstrip to have a set value border and for them to display next to each other in the filmstrip without the large border on our "portrait style" images?  Thanks in advance, looking forward to guidance from those in the know.
Logged

Cornetto

  • Coppermine newbie
  • Offline Offline
  • Posts: 9
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #1 on: January 29, 2014, 06:03:39 pm »

Apologies for the messed up section of my original post:


After an exhaustive search of the forum, I was able to find information that allowed us to set all of the images in the filmstrip to display within a 180px width cell, however this is not the solution to our issue, as our "portrait style" images display large (black) borders between any "portrait style" images as they display next to "landscape style" images in the filmstrip.
The setting to display all of the images in the thumbnailFILMSTRIP to a static width was to set the "thumb width" setting to "180" in line 3178 of the file "functions.inc.php" in the folder "Includes".


Please note that the unmodified code had the "thumb width" set to "120", but this caused the images in the filmstrip to overlap, where the landscape style images did not fully display and were overlapped by the portrait style images.
Code: [Select]
function display_film_strip($album, $cat, $pos,$ajax_call)
{
    global $CONFIG, $LINEBREAK;
    global $lang_date, $lang_display_thumbnails, $lang_byte_units, $lang_common, $pic_count,$ajax_call,$pos;

    $superCage = Inspekt::makeSuperCage();

    $max_item    = $CONFIG['max_film_strip_items'];
$CONFIG['thumb_width'] = '120';
    $thumb_width = $CONFIG['thumb_width'];

We changed the "thumb_width" setting to 180, as referenced in
http://forum.coppermine-gallery.net/index.php/topic,76163.msg367684.html#msg367684
but this change causes the portrait style images in the filmstrip to have large (black) borders while the landscape style images do not have the large borders.

Not sure if this additional information helps, still looking for assistance in getting our filmstrip to display landscapes with a 10px border next to portraits with a 10px border in the filmstrip.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #2 on: January 30, 2014, 10:51:00 am »

To display the film strip as you like, please undo your modification (actually, it doesn't matter, but you don't need it anymore). Instead, copy the block $template_film_strip from themes/sample/theme.php to your theme's theme.php file, if it doesn't exist.

Then, find
Code: [Select]
style="{ONE_WIDTH}and remove it completely.

Now the pictures should have the same space to each other. If this is how you want it to look, we still need to adjust the dynamically loaded film strip images (i.e. apply a similar mod to js/displayimage.js).
Logged

Cornetto

  • Coppermine newbie
  • Offline Offline
  • Posts: 9
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #3 on: January 30, 2014, 07:36:31 pm »

Andre,
[praise]You are indeed a master of coppermine and your ability to readily understand the description of our issue (and apply your knowledge and skill to correcting it) is amazing.[/praise]

 
Quote
If this is how you want it to look
Yes! This is how we want it to look, thank you so much!

Quote
we still need to adjust the dynamically loaded film strip images (i.e. apply a similar mod to js/displayimage.js).

I don't know how to do this, can you provide me with the details of how please?
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #4 on: January 31, 2014, 12:01:18 pm »

I've currently no access to a testbed, so I cannot test the change, but this should work as expected.

Open js/displayimage.js and remove all 4 occurrences of
Code: [Select]
style="width: '+width+'px; float: left"
Logged

Cornetto

  • Coppermine newbie
  • Offline Offline
  • Posts: 9
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #5 on: February 02, 2014, 08:26:18 pm »

Yes, the change works as expected, the dynamically loaded images work very well, thank you.
Now for the last missing piece of our puzzle, how to set the horizontal space in between the images in the filmstrip to a uniform size? (10 px)
So that the "displayed" filmstrip images have the same uniform 10px space between them and the dynamically loaded images will also?
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #6 on: February 03, 2014, 01:31:36 pm »

Depending on your theme's other CSS settings, add something like this to your theme's style.css file:
Code: [Select]
.strip_image {
    padding: 0 5px;
}

This code adds a padding of 5px left and right of each film strip thumbnail. E.g. this results in more than 10px in the curve them, as other elements already adds some space.
Logged

Cornetto

  • Coppermine newbie
  • Offline Offline
  • Posts: 9
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #7 on: February 03, 2014, 03:19:28 pm »

EUREKA!
You have solved the last piece of our puzzle, thank you ever so much!

"The mystery is solv-ed"
     -Inspector Clouseau  (The Pink Panther)


Now marking this topic as "TOPIC SOLVED"
Logged

Mate Matic

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 28
Re: Filmstrip image display bordering using fixed height thumbnails
« Reply #8 on: April 28, 2014, 09:43:54 am »

This was helpful. Thanks André.
Logged
Pages: [1]   Go Up
 

Page created in 0.021 seconds with 20 queries.