115 replies to this topic

[Parikesit]

OsCommerce Product Image - OPI Module, is another product image handling with advanced features.


Module Name: OsCommerce Product Image - OPI
Release Date: August 17, 2011
Release Version: Version 1.0
Download: http://addons.oscommerce.com/info/8139




REQUIREMENTS:

• jQuery & jQuery-UI (included in OsC 2.3)
  
• PHP GD library
  
• Apache ModRewrite (recommended for Apache server)

FEATURES:

• Upload image (Ajax),
  
• Browse images on server (Ajax),
  
• Delete images on server (Ajax),
  
• Create new directory inside image folder (Ajax),
  
• Admin privileges configurable for: delete image & create new directory
  
• Thumbnail configurable,
  
• Watermark configurable,
  
• Fancy image url (SEO) with Apache ModRewrite (or direct access to PHP image handling for IIS)
  
• Multi-languages javascript interface

Note:
I created this module based on OsC version 2.3, but I guess this will also works on lower version. Just add jQuery and jQuery-UI to your admin/categories.php page.


Cheers,

[Parikesit]

SNAPSHOTS of OPI

OPI: Main View (when creating/editing product)
[img]http://www.flickr.com/photos/lokamaya/6055815917/[/img]

OPI: Upload Image Dialog
[img]http://www.flickr.com/photos/lokamaya/6056362502/[/img]

OPI: Browse Image Dialog
[img]http://www.flickr.com/photos/lokamaya/6056362578/[/img]

OPI: Create Directory Dialog
[img]http://www.flickr.com/photos/lokamaya/6055816127/[/img]

Edited by Parikesit, 18 August 2011, 15:38.

[francois21]

Hello
excuse my bad english (I am in France)
Thank's for this work.
All is ok.
How can I activate watermak on images? It's don't work for me . I have not watermark on old image and new image.

In admin, when a product have just one image, I can't delete this image.

In old system of image, we can add html: Ex for samsung image with youtube extract.
in Opi is this possible?

Thank's for this great addon for manage images
Francois

[Parikesit]

francois21, on 20 August 2011, 10:18, said:

How can I activate watermak on images? It's don't work for me . I have not watermark on old image and new image.

Hi Francois,

You can configure watermark on opi_thumbnail.php

Line 104: (absolute path to your watermark image)

define('OPI_FS_IMAGES_WATERMARK', str_replace('/', DIRECTORY_SEPARATOR, DIR_WS_IMAGES . '_hidden_/watermarked.png') );

Line 110-111:

define('OPI_IMAGES_WM_WMIN', 400);   //set to 0 to disable watermark
define('OPI_IMAGES_WM_HMIN', 100);   //set to 0 to disable watermark

OPI_IMAGES_WM_WMIN=400 & OPI_IMAGES_WM_HMIN=100 means that watermark will be added to the image if you request a thumbnail equal or larger than 400 X 100 pixel. If you want to add watermark to every thumbnail, just set OPI_IMAGES_WM_WMIN=1 & OPI_IMAGES_WM_HMIN=1.

Btw, watermark only works on thumbnail image.

Hope this help,
Cheers

[Parikesit]

francois21, on 20 August 2011, 10:18, said:

In admin, when a product have just one image, I can't delete this image.

Did you mean "delete" the image from server? or "remove" the image from a product?

To "delete" the image from server, that image should be located inside directory or sub-directory of "OPI: Relative Directory". If you want to enable delete all images inside "path_to_your_oscommerce_installation/images/", than just set the value "OPI: Relative Directory" to empty. Login to admin page, than go to:
:: Configuration > Images > OPI: Relative Directory

By default "OPI: Relative Directory" value is products (translated to path: path_to_your_oscommerce_installation/images/products/). You can create new directory, upload new image, and delete existing image only relative to the value of this configuration.

However, you still can request thumbnail of an image from 'outside' this "OPI: Relative Directory". That's why your existing product-images still appear in admin page (but you can delete them if it's 'outside' "OPI: Relative Directory").

francois21, on 20 August 2011, 10:18, said:

In old system of image, we can add html: Ex for samsung image with youtube extract.
in Opi is this possible?

That's not possible.

But this module works flawlessly with existing OsC image gallery (jQuery). You can find the sample of edited "product_info.php" in the download file inside "oscommerce-2.3.1-edited" folder.

Best,
Zaenal

[francois21]

Hello
thank's for your fast response.
Did you mean "delete" the image from server? or "remove" the image from a product?

I create a product ex-->Microsoft IntelliMouse Pro

for image whith Opi
button donwnload-->new directory-->mouse-->create
after directory = Mouse (images/products/mouse)
download ex mynewimage.

all is ok, new image is download en my product image is here --> products/mouse/microsoft-intellimouse-pro-2.jpg

in configuration--images OPI: Relative Directory is products

All work great.

But if I want no image for this product, if I try to delete image whith X button --> it si not possible I have the waiting image and nothing, when I Save, image is here and not delete.
If I browse server and try to delete this image from server it is not possible

alert message Can not delete image: image still in use by other products :: microsoft-intellimouse-explorer-1.jpg

If i want some product without image, how can I do?
Thank's

Francois

[Parikesit]

francois21, on 20 August 2011, 10:18, said:

In admin, when a product have just one image, I can't delete this image.
Francois

Parikesit, on 20 August 2011, 13:13, said:

Did you mean "delete" the image from server? or "remove" the image from a product?
zaenal

Oh, well, I got your point and thanks for pointing that...

I try it myself and found that the "preview image" in the left always show the 'spinner' gif animation as if it has not been completed. Technically, the image has been removed from product; it's just minor bug on 'display'.

You can make small edit on file ext/jquery/plugins/jquery.oscProductImage.js at line 573 :

Change:

$("#opiImageDefault").html('<img src="'+this.options.imageURL.transparent+'" />');

To:

$("#opiImageDefault").removeClass('loading').html('<img src="'+this.options.imageURL.transparent+'" />');

Once again, thanks Francois... I will fix it in the next release.

Best,
zaenal

Edited by Parikesit, 20 August 2011, 13:56.

[Parikesit]

The addon has been updated.

You can download it now in separated download file (http://addons.oscommerce.com/info/8139).

See history, and download "jquery.oscProductImage.js - minor bug" file.

Best,
zaenal

[Parikesit]

francois21, on 20 August 2011, 13:51, said:

But if I want no image for this product, if I try to delete image whith X button --> it si not possible I have the waiting image and nothing, when I Save, image is here and not delete.
If I browse server and try to delete this image from server it is not possible

alert message Can not delete image: image still in use by other products :: microsoft-intellimouse-explorer-1.jpg

If i want some product without image, how can I do?
Thank's

Francois

Oh... never though anyone want to create product without an image

Edit your path_to_admin/categories.php. Around line 231, insert the following code:

        } else {
            $sql_data_array['products_image'] = '';
            $sql_data_array['products_images'] = '';
        }

The complete block of code will look like this:

        $sql_data_array = array('products_quantity' => (int)tep_db_prepare_input($HTTP_POST_VARS['products_quantity']),
                                'products_model' => tep_db_prepare_input($HTTP_POST_VARS['products_model']),
                                'products_price' => tep_db_prepare_input($HTTP_POST_VARS['products_price']),
                                'products_date_available' => $products_date_available,
                                'products_weight' => (float)tep_db_prepare_input($HTTP_POST_VARS['products_weight']),
                                'products_status' => tep_db_prepare_input($HTTP_POST_VARS['products_status']),
                                'products_tax_class_id' => tep_db_prepare_input($HTTP_POST_VARS['products_tax_class_id']),
                                'manufacturers_id' => (int)tep_db_prepare_input($HTTP_POST_VARS['manufacturers_id']));

        $products_images = isset($_POST['products_images']) ? $_POST['products_images'] : array();
        $products_images = array_unique($products_images);
        if (tep_not_null($products_images)) {
            $sql_data_array['products_image'] = tep_db_prepare_input($products_images[0]);
            $sql_data_array['products_images'] = tep_db_prepare_input(implode(',', $products_images));
        } else {
            $sql_data_array['products_image'] = '';
            $sql_data_array['products_images'] = '';
        }

francois21, on 20 August 2011, 13:51, said:

alert message Can not delete image: image still in use by other products :: microsoft-intellimouse-explorer-1.jpg
Francois

That's right. OPI can not delete an image if that image still in use by any product.

Thanks'
zaenal

Edited by Parikesit, 20 August 2011, 14:53.

[Parikesit]

Updated the addon, and now can be downloaded in separated file (http://addons.oscommerce.com/info/8139).

See history, and download "categories.php - bug when emptying product image" file.

Best,
zaenal

[francois21]

Hello
thank's
All work great for me now.

This addon is very very better than old system for manage images
Francois

[kosbou]

hi
i have some problems with OPI.

I have installed OPI a few days ago but i had some problems like watermark, image display in product info page.

So i deside not to use it and I gone back to original categories.php and erase all the files from my server. Unfortunately i did not make a backup from SQL.

today i had more time so i decide to reinstall it. None of the images displayed in admin preview and in product info page.

Is there any way to solve all these???

thx in advance

[kosbou]

kosbou, on 25 August 2011, 11:06, said:

hi
i have some problems with OPI.

I have installed OPI a few days ago but i had some problems like watermark, image display in product info page.

So i deside not to use it and I gone back to original categories.php and erase all the files from my server. Unfortunately i did not make a backup from SQL.

today i had more time so i decide to reinstall it. None of the images displayed in admin preview and in product info page.

Is there any way to solve all these???

thx in advance

in admin preview is displaying the loading circle...

[Parikesit]

kosbou, on 25 August 2011, 11:49, said:

in admin preview is displaying the loading circle...

Can you "view source" and find the URL to the images... something like <img src="yourdomain/images/def/adminthumb/...etc" />

I would like to know the url to your image.

@zaenal

[kosbou]

Parikesit, on 26 August 2011, 02:01, said:

Can you "view source" and find the URL to the images... something like <img src="yourdomain/images/def/adminthumb/...etc" />

I would like to know the url to your image.

@zaenal

ok i have done it now.

Do i have to edit all the files in the edit diretctory????

[francois21]

Hello

I have not watermark on my images.

My opi_thumbnails.php

require_once('includes/configure.php');
error_reporting(0);

//NO APACHE REWRITE, remove/commented below line
if (basename($_SERVER['REQUEST_URI']) == basename(__FILE__)) imageScale404(); //preventing direct access to this file

//disable custom mode: crop,auto,clip,width and height request
define('OPI_ENABLE_CUSTOME_MODE', true); //if you disabled it, also edit .htaccess and remove rewriteRule that command customMode

//enable advance apache mod-rewrite (see readme.html)
define('OPI_ENABLE_ADVANCED_REWRITE', true);

define('DIR_FS_OPIFILE_HERE', dirname(__FILE__));                               // absolute path to this file
define('OPI_FS_IMAGES_OPI_PATH', DIR_FS_OPIFILE_HERE . str_replace('/', DIRECTORY_SEPARATOR, '/images/') );             // OSC_PRODUCT_IMAGE_ABSOLUTE_PATH
define('OPI_FS_IMAGES_OPI_THUMB', OPI_FS_IMAGES_OPI_PATH . str_replace('/', DIRECTORY_SEPARATOR, '_thumbnail_/'));      // OSC_PRODUCT_IMAGE_ABSOLUTE_PATH + OSC_PRODUCT_IMAGE_THUMBNAIL_DIRECTORY
define('OPI_FS_IMAGES_WATERMARK', str_replace('/', DIRECTORY_SEPARATOR, DIR_WS_IMAGES . '_hidden_/watermarked.png') );  // watermark file

define('OPI_IMAGES_MAXWIDTH', 1000); //set to 0 to disable
define('OPI_IMAGES_MAXHEIGHT', 1000);//set to 0 to disable
define('OPI_IMAGES_MINWIDTH', 50);   //set to 0 to disable
define('OPI_IMAGES_MINHEIGHT', 50);  //set to 0 to disable
define('OPI_IMAGES_WM_WMIN', 30);   //set to 0 to disable watermark
define('OPI_IMAGES_WM_HMIN', 30);   //set to 0 to disable watermark

/*definedMode*/
$definedMode = array();

//do not edit adminthumb and adminpreview -> for administration page
$definedMode['adminthumb']     = array('mode'=>'clip',  'width'=>80,  'height'=>80);
$definedMode['adminpreview']   = array('mode'=>'width', 'width'=>150, 'height'=>0);

//you can edit/add/remove definedMode's below
$definedMode['display']   = array('mode'=>'width', 'width'=>200, 'height'=>0);
$definedMode['small']     = array('mode'=>'clip',  'width'=>100,  'height'=>100);
$definedMode['large']     = array('mode'=>'auto',  'width'=>600, 'height'=>800);
$definedMode['square']    = array('mode'=>'clip',  'width'=>220, 'height'=>220);
$definedMode['customwidth']     = array('mode'=>'width', 'width'=>150, 'height'=>0);   //width & height must be defined
$definedMode['customheight']    = array('mode'=>'height','width'=>0,   'height'=>150); //width & height must be defined

What is not good please

Thank's
Francois

[Parikesit]

francois21, on 26 August 2011, 13:39, said:

Hello

I have not watermark on my images.

Thank's
Francois

Hi Francois,

Did you clean up the thumbnail cache after changing the code?
Just go to admin page: Configuration > Images > OPI: Cleanup Thumbnail

[francois21]

Hi
thank's for your fast response.
I have not watermark with your solution.
I have an other problem : Opi don't work in categories with IE. It work great with other like Firefox, Opera, Chrome, Safari but not with Internet Explorer.

An idea??
Francois

[francois21]

Hi
about my precedent post.
Some snapshot with Ie and with Firefox.
All is Ok with all browsers, without Ie
I try with YOUR categories_opi.php that I rename categories.php and I have the same result.
With IE http://imageshack.us/photo/my-images/204/opiie.jpg/
With firefox http://imageshack.us/photo/my-images/709/opifirefox.jpg/

Thank's
francois

[francois21]

Hi
sorry for my last post.

I try with an other pc, where I have backup of my last work with Opi and all work great with Ie.

Opi is very good and no bugs with IE
just I have not watermarks
Francois