Product listing

[Roaddoctor]

@@raiwa

Rainer- first thank you for your continuing improvements - great work!

 

I have one little optional tweak that others may or may not wish to use. This adds a nice title at the bottom of the colorbox popup

 

I added

title: '<?php echo $product_info['products_name']; ?>',

into this, like

<script type="text/javascript">
$(function() {
  $('#piGal').css({
    'visibility': 'hidden'
  });

  $('#piGal').photosetGrid({
    layout: '<?php echo $photoset_layout; ?>',
    width: '250px',
    highresLinks: true,
    rel: 'pigallery',
    onComplete: function() {
      $('#piGal').css({ 'visibility': 'visible'});

      $('#piGal a').colorbox({
        maxHeight: '90%',
        maxWidth: '90%',

  title: '<?php echo $product_info['products_name']; ?>',

        rel: 'pigallery'
      });

      $('#piGal img').each(function() {
        var imgid = $(this).attr('id').substring(9);

        if ( $('#piGalDiv_' + imgid).length ) {
          $(this).parent().colorbox({ inline: true, href: "#piGalDiv_" + imgid });
        }
      });
    }
  });
});
</script>

thx again!

[Guest]

@@raiwa

 

Not sure if you agree; however, I would prefer to leave the original image without any number appended to the title.

 

echo tep_image(DIR_WS_IMAGES . $pi['image'], addslashes($product_info['products_name']) . ($pi_counter > 1 ?  ' - ' . $pi_counter : ''), (($pi_counter > 1 )? round(KISSIT_MAIN_PRODUCT_IMAGE_WIDTH/(($pi_total <= 5)? $pi_total-1 : 5)) : KISSIT_MAIN_PRODUCT_IMAGE_WIDTH), (($pi_counter > 1 )? round(KISSIT_MAIN_PRODUCT_IMAGE_HEIGHT/(($pi_total <= 5)? $pi_total-1 : 5)) : KISSIT_MAIN_PRODUCT_IMAGE_HEIGHT), 'id="piGalImg_' . $pi_counter . '" '. preg_replace('%<img width="[0-9 ]+" height="[0-9 ]+" src="(.*)title=.+%', 'data-highres="$1', tep_image(DIR_WS_IMAGES . $pi['image'], null, $width, $height)));

 

I tested and all works great.  Nicely done.  :thumbsup:

[♥Dan Cole]

@raiwa

 

Rainer the image wrapper seems to be quite a bit different now in the 2.3.4BS version than what is shown in the instructions...the image wrapper code seems to have been altered to "prevent browsers from outputting the image filename as default".  Just wondering what is the best way to change this so I can add the KISS thumbnailer?  I presume that the instructions will need updating as well.

////
// The HTML image wrapper function
  function tep_image($src, $alt = '', $width = '', $height = '', $parameters = '', $responsive = true, $bootstrap_css = '') {
    if ( (empty($src) || ($src == DIR_WS_IMAGES)) && (IMAGE_REQUIRED == 'false') ) {
      return false;
    }
// alt is added to the img tag even if it is null to prevent browsers from outputting
// the image filename as default
    $image = '<img src="' . tep_output_string($src) . '" alt="' . tep_output_string($alt) . '"';
    if (tep_not_null($alt)) {
      $image .= ' title="' . tep_output_string($alt) . '"';
    }
    if ( (CONFIG_CALCULATE_IMAGE_SIZE == 'true') && (empty($width) || empty($height)) ) {
      if ($image_size = @getimagesize($src)) {
        if (empty($width) && tep_not_null($height)) {
          $ratio = $height / $image_size[1];
          $width = (int)($image_size[0] * $ratio);
        } elseif (tep_not_null($width) && empty($height)) {
          $ratio = $width / $image_size[0];
          $height = (int)($image_size[1] * $ratio);
        } elseif (empty($width) && empty($height)) {
          $width = $image_size[0];
          $height = $image_size[1];
        }
      } elseif (IMAGE_REQUIRED == 'false') {
        return false;
      }
    }
    if (tep_not_null($width) && tep_not_null($height)) {
      $image .= ' width="' . tep_output_string($width) . '" height="' . tep_output_string($height) . '"';
    }
    $image .= ' class="';
    if (tep_not_null($responsive) && ($responsive === true)) {
      $image .= 'img-responsive';
    }
    if (tep_not_null($bootstrap_css)) $image .= ' ' . $bootstrap_css;
    $image .= '"';
    if (tep_not_null($parameters)) $image .= ' ' . $parameters;
    $image .= ' />';
    return $image;
  }

Dan

[♥Dan Cole]

@raiwa

 

Rainer...never mind.  I had another coffee and the instructions make sense to me now!

 

Dan

[Guest]

@@raiwa

 

I just was testing on my dev site and noticed that when the watermark is enabled and you pull up product Microsoft IntelliMouse Pro, the watermark is the only thing visible.  I have .05 set for watermark. 

 

If I set it for .25, an image appears; however, the watermark is not transparent.  It may be due to the size of the original image.

 

I haven't backtracked your recent change to see if this was due to this or was it an issue that existed prior.

 

I'll have some time later this week to look into it more; however, if you want me to test a solution.  Let me know.

 

Thanks, M.

Edited August 25, 2015 by marcello

[♥raiwa]

@@marcello,

 

Instruction doc:

NOTE: The watermark support included in Version 14 will only work correct on jpg, indexed png and indexed gif images.
          It will not work correct (white instead transparent background) for RGB png images.

 

In any case I would recommend to do testing with jpg images in a reasonable size. The small demo images are not the size which would be used in a live store I guess.

[♥Moxamint]

@@raiwa,

 

This add-on works great on my BS [edge] site except it makes my languages and card acceptance boxes act weird.

 

Before KissIT: 
After KissIT: 

 

Did I do something wrong?

 

My KissIT version is r19.  Thanks in advance for your time and help.

[♥raiwa]

Hello @@Moxamint,

 

Yes, there is an issue in the tep image legacy function which doesn't pass correct the responsive parameter.

For now you could use this fast fix:

in: includes/html_output.php find:

  function tep_image_legacy($src, $alt = '', $width = '', $height = '', $parameters = '', $responsive = true, $bootstrap_css = '') {

and change to:

  function tep_image_legacy($src, $alt = '', $width = '', $height = '', $parameters = '', $responsive = 'true', $bootstrap_css = '') {

This is not definitive, I'll have a deeper look when I'll have a time.

 

Thanks for the report and kindest regards

Rainer

[♥Moxamint]

Hi @@raiwa,

 

It's working correctly now.

 

Thanks again, Eddy

[♥raiwa]

Hello Eddy @@Moxamint,

 

Please undo the before fix.

The correct fix is:

in: includes/html_output.php find:

    if ( !is_numeric ( $width ) || !is_numeric ( $height ) ) return tep_image_legacy( $src, $alt, $width, $height, $parameters );

and change to:

    if ( !is_numeric ( $width ) || !is_numeric ( $height ) ) return tep_image_legacy( $src, $alt, $width, $height, $parameters, $responsive, $bootstrap_css );

Please confirm, I'll upload then the update.

 

Thanks again and kind regards

Rainer

[♥Moxamint]

@@raiwa

 

Hi Rainer,

 

This is to confirm that the new fix works.  Thanks so much!

 

Cheers, Eddy

[dculley]

Help.  I deleted everything in my thumb directory to clean up old pictures not needed.  Now I'm getting;

Warning: getimagesize(images/no_image_available_150_150.gif): failed to open stream: No such file or directory in /home/ladyxxxxxxxxx/public_html/includes/modules/kiss_image_thumbnailer/classes/Image_Helper.php on line 79

 

What do I need to do?

[dculley]

The error as disappeared for now.  :sweating:

[newburns]

I see Gergely code for reset button is in the installation of R20, but I don't see where I missed the SQL script to run. Is that supposed to be apart of the db_install.php

INSERT INTO `configuration` (`configuration_title`, `configuration_key`, `configuration_value`, `configuration_description`, `configuration_group_id`, `sort_order`, `last_modified`, `date_added`, `use_function`, `set_function`) VALUES
('Reset thumbs', 'RESET_IMAGE_THUMBS', 'false', 'Reset thumbs cache', 4, 9, '2013-02-20 19:36:26', '2013-01-29 17:11:10', 'tep_cfg_reset_thumbs_cache', 'tep_cfg_select_option(array(''reset'', ''false''),');

[♥Dan Cole]

@@newburns Ray it sould be in the db_install.php file at around line 60...

 

Dan

[♥raiwa]

@@newburns,

 

It is included in includes/modules/kiss_image_thumbnailer/db_install.php

Lines 61-66

[discxpress]

@@raiwa

 

I just got a custom coded module similar to Also Purchased. I have Kissit for 2.3.4 BS installed. How do I resize the images to KISSit with watermark? 

 

Now I have SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT to make the images thumbnails.

 

Thanks

Edited September 9, 2015 by discxpress

[♥raiwa]

@@discxpress,

 

There are 2 requirements to generate thumbs (with or without watermark):

1. tep_image function must be used

2. width and height values must be included in the function

 

regards

Rainer

[discxpress]

Thanks, @@raiwa

 

I used KISSIT_MAIN_PRODUCT_WATERMARK_MIN_IMAGE_WIDTH, KISSIT_MAIN_PRODUCT_WATERMARK_MIN_IMAGE_HEIGHT. It appears to work but the watermark doesn't appear.

 

What should I put at the end of the tep_image line?

[♥raiwa]

@@discxpress,

 

KISSIT_MAIN_PRODUCT_WATERMARK_MIN_IMAGE_WIDTH and HEIGHT are the configuration values for the minimum image size from which on the watermark should be applied. So it shouldn't be used to define any image size.

You should use SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT like it was.

Now in admin configuration images, Small Image Width and Height must be bigger than KissIT min image width to apply Watermark.

 

The easiest way is to have a look on a standard module and use the same settings for the tep_image function (except the image name and path of course).

 

If you still have troubles, please post your tep_image function.

 

regards

Rainer

[newburns]

Any possibility to get this working in the admin side?

Using the same catalog thumbs folder if possible? So all thumbs are kind of shared...

[♥raiwa]

@@newburns,

 

apply the modification of the tep_image function in admin/includes/functions/html_output.php

that's the first step, then there maybe some mods needed for the paths to the kissit files.

[♥Moxamint]

@@raiwa,

 

Is it possible to apply opacity to the watermark?

 

Many thanks, Eddy

[♥raiwa]

@@Moxamint,
 
In a user addressable configuration setting, no.
It should be possible in the watermark function. Try in: includes/modules/kiss_image_thumbnailer/classes/image.php
within the watermark function:

		$transparent = imagecolorallocatealpha($new_image, 255, 255, 255, 127);
		imagefilledrectangle($new_stamp, 0, 0, $new_sx, $new_sy, $transparent);	
		imagecopyresampled ( $new_stamp, $stamp, 0,0,0,0, $new_sx, $new_sy, $sx, $sy);

Try to modify the value "127" in the first line. Values can be 0-127, where "0" is 100% opaque and "127" is 100% transparent.

Edited September 13, 2015 by raiwa

[♥Moxamint]

Thanks @@raiwa!

 

I think it would be convenient if that's included in the configuration settings.

 

Thanks again, Eddy