thumbnail displaying incorrectly in RTL

[buzibuzi]

Hi,
first of all thanks for this great component,
i am developing a site in hebrew which is Right to Left. therefore the css is all RTL.
as you can see here, the thumbnails are not displaying correctly in IE. firefox is fine,
http://66.7.214.72/~blfyzgn/index.php?o ... &Itemid=37


i went through some of the posts here and changed "right" to "left" in the phocagalleryieall.css

it didn't help much.

does anyone have a working solution for this ?

Thanks

buzi

http://www.hubeza.com

[Jan]

Hi, still not, we wait for someone with RTL langauge who solve this problem ...

[buzibuzi]

Hi,

im using a temporary solution:

.phocagallery-box-file-first {

{

.phocagallery-box-file-second {
position:relative;
left: 0%;
top: 8%;
vertical-align: middle;
}

.phocagallery-box-file-third{

{

it is the best i can do for now.

i have a small issue - can you tell me what is causing the thumbnail to shift left when you hover over it ?

Thanks
Buzi
http://www.hubeza.com

[Jan]

maybe some hover has still the left postion...

in some CLASS:hover (CLASS.hover) ... the hover must be the same as the class

e.g.:

phocagallery a { position: left or left: x, top: x ...}
phocagallery a.hover (a:hover) {position left or left: x, top: x...}

[buzibuzi]

Hi
solved.
if anyone needs this in the future what needs to be changed in :

components/com_phocagallery/views/category/view.html.php

line 91

// CSS
$document->addCustomTag( "<style type=\"text/css\">\n"
." #phocagallery .name {color: $font_color ;}\n"
." .phocagallery-box-file {background: $background_color ; border:1px solid $border_color;margin: ".$margin_box."px;padding: ".$padding_box."px;direction:ltr; float:left;}\n"
." .phocagallery-box-file-first { $imageBgCSS }\n"
." .phocagallery-box-file:hover, .phocagallery-box-file.hover {border:1px solid $border_color_hover ; background: $background_color_hover ;}\n"
." .phocagallery-box-file-first {overflow: hidden; display: table; vertical-align:middle;position: relative; direction:ltr;}\n"
." .phocagallery-box-file-second {}\n"
." .phocagallery-box-file-third {}\n"
." .ol-foreground { background-color: $ol_fg_color ;}\n"
." .ol-background { background-color: $ol_bg_color ;}\n"
." .ol-textfont { font-family: Arial, sans-serif; font-size: 10px; color: $ol_tf_color ;}"
." .ol-captionfont {font-family: Arial, sans-serif; font-size: 12px; color: $ol_cf_color ; font-weight: bold;}"
." </style>\n");

thanks for your help
Buzi

[Jan]

Great, I will add it into the documenation site

[dsadok]

hi every one.
sorry but I didn't find where to put this code.
I tried in many places (line91) but always there is errors which appears.
could you tell me where to put it exactely.
I use PG 2.2.4 and this the file:

Code: Select all

<?php
/*
 * @package Joomla 1.5
 * @copyright Copyright (C) 2005 Open Source Matters. All rights reserved.
 * @license http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
 *
 * @component Phoca Gallery
 * @copyright Copyright (C) Jan Pavelka www.phoca.cz
 * @license http://www.gnu.org/copyleft/gpl.html GNU/GPL
 */
defined('_JEXEC') or die();
jimport( 'joomla.application.component.view');

class PhocaGalleryViewCategories extends JView
{
	function display($tpl = null) {		
		global $mainframe;
		$db 		= &JFactory::getDBO();
		$model		= &$this->getModel();
		$document	= &JFactory::getDocument();
		$user 		= &JFactory::getUser();
		$params		= &$mainframe->getParams();
		$tmpl		= array();
		$tmpl2		= array();
		
		// Library
		$library 				= &PhocaLibrary::getLibrary();
		$libraries['pg-css-ie'] = $library->getLibrary('pg-css-ie');
		
	
		if ( $libraries['pg-css-ie']->value == 0 ) {
			$document->addCustomTag("<!--[if lt IE 8]>\n<link rel=\"stylesheet\" href=\""
			.JURI::base(true)
			."/components/com_phocagallery/assets/phocagalleryieall.css\" type=\"text/css\" />\n<![endif]-->");
			$library->setLibrary('pg-css-ie', 1);
		}
		JHTML::stylesheet( 'phocagallery.css', 'components/com_phocagallery/assets/' );
	
		
		// PARAMS
		$image_categories_size 	= $params->get( 'image_categories_size', 4 );
		$hide_categories 		= $params->get( 'hide_categories', '' );
		$medium_image_width 	= $params->get( 'medium_image_width', 100 );
		$medium_image_height 	= $params->get( 'medium_image_height', 100 );
		$small_image_width 		= $params->get( 'small_image_width', 50 );
		$small_image_height 	= $params->get( 'small_image_height', 50 );
		
		$medium_image_height	= $medium_image_height + 18;
		$medium_image_width 	= $medium_image_width + 18;
		$small_image_width		= $small_image_width +18;
		$small_image_height		= $small_image_height +18;
		
		$catImg = PhocaGalleryHelperFront::getCategoriesImage($image_categories_size, $small_image_width, $small_image_height,  $medium_image_height, $medium_image_width);
		
		$tmpl['imagebg'] 		= $catImg['imagebg'];
		$tmpl['imagewidth'] 	= $catImg['imagewidth'];
		
		// PARAMS
		$tmpl['phocagallerywidth'] 	= $params->get( 'phocagallery_width', '' );
		$display_subcategories 		= $params->get( 'display_subcategories', 1 );
		$display_empty_categories 	= $params->get( 'display_empty_categories', 0 );
		$tmpl['categoriescolumns'] 	= $params->get( 'categories_columns', 1 );
		$tmpl['phocagalleryic'] 	= $params->get( 'display_phoca_info', 1 );
		$tmpl['phocagalleryic'] 	= PhocaGalleryHelper::getPhocaIc((int)$tmpl['phocagalleryic']);
		$categories					= $model->getData($display_subcategories, $display_empty_categories, $hide_categories);
		
		// PARMAS - Access Category - display category in category list, which user cannot access
		$display_access_category = $params->get( 'display_access_category', 1 );
		// Add link and unset the categories which user cannot see (if it is enabled in params)
		$unSet = 0;// If it will be unseted while access view, we must sort the keys from category array - ACCESS
	
		foreach ($categories as $key => $category) { 
			$categories[$key]->link	= JRoute::_('index.php?option=com_phocagallery&view=category&id='. $category->slug.'&Itemid='. JRequest::getVar('Itemid', 1, 'get', 'int') ); 
			

			// USER RIGHT - ACCESS =======================================
			$rightDisplay	= 1;
			
			if (isset($categories[$key]->params)) {
				$rightDisplay = PhocaGalleryHelper::getUserRight ($categories[$key]->params, 'accessuserid', $category->access, $user->get('aid', 0), $user->get('id', 0), $display_access_category);
			}
						
			
			// Display Key Icon (in case we want to display unaccessable categories in list view)
			$rightDisplayKey  = 1;
			if ($display_access_category == 1) {
				// we simulate that we want not to display unaccessable categories
				// so we get rightDisplayKey = 0 then the key will be displayed
				if (isset($categories[$key]->params)) {
					$rightDisplayKey = PhocaGalleryHelper::getUserRight ($categories[$key]->params, 'accessuserid', $category->access, $user->get('aid', 0), $user->get('id', 0), 0);
				}
			}
			
			$file_thumbnail			= PhocaGalleryHelperFront::displayFileOrNoImageCategories($category->filename, $image_categories_size, $rightDisplayKey); 
			$categories[$key]->linkthumbnailpath	= $file_thumbnail['rel'];
		
			if ($rightDisplay == 0) {
				unset($categories[$key]);
				$unSet = 1;
			}
			// ============================================================	
			
		}
		
		
		// ACCESS - in case we unset some category from the list, we must sort the array new
		if ($unSet == 1) {
			$categories = array_values($categories);
		}

		// PARAMS - Define image tag attributes
		if ($params->get('image') != -1) {
			$attribs['align']	= $params->get('image_align');
			$attribs['hspace']	= 6;
			// Use the static HTML library to build the image tag
			$tmpl['image'] 		= JHTML::_('image', 'images/stories/'.$params->get('image'), JText::_('Phoca gallery'), $attribs);
		}
		
		// PARAMS - Display or hide image beside the category name
		$tmpl['displayimagecategories'] = $params->get( 'display_image_categories', 1 );

		// ASSIGN
		$this->assignRef('tmpl',	$tmpl);
		$this->assignRef('params',	$params);
		$this->assignRef('categories',	$categories);
		
		// PARAMS - GEO
		$display_categories_geotagging 		= $params->get( 'display_categories_geotagging', 0 );
		
		if ($display_categories_geotagging == 1) {
		
			$tmpl2['categorieslng'] 		= $params->get( 'categories_lng', '' );
			$tmpl2['categorieslat'] 		= $params->get( 'categories_lat', '' );
			$tmpl2['categorieszoom'] 		= $params->get( 'categories_zoom', 2 );
			$tmpl2['googlemapsapikey'] 		= $params->get( 'google_maps_api_key', '' );
			$tmpl2['categoriesmapwidth'] 	= $params->get( 'categories_map_width', 500 );
			$tmpl2['categoriesmapheight'] 	= $params->get( 'categorires_map_height', 500 );
			
			// if no lng and lat will be added, Phoca Gallery will try to find it in categories
			if ($tmpl2['categorieslat'] == '' || $tmpl2['categorieslng'] == '') {
				$latLng = PhocaGalleryHelper::findLatLngFromCategory($categories);
				$tmpl2['categorieslng'] = $latLng['lng'];
				$tmpl2['categorieslat'] = $latLng['lat'];
			}
		
			$this->assignRef('tmpl2',	$tmpl2);
			
			parent::display('map');
		} else {
			parent::display($tpl);
		}
	}
}
?>

and thank you

[Jan]

Hi, did you read this faq:

https://www.phoca.cz/documents/2-phoca-g ... thumbnails

Jan

[dsadok]

thank you.
Yes I did read the article but I didn't know where exactly I must put the code in the components/com_phocagallery/views/category/view.html.php.
because when I added it in the 91 line I have many error in execution.
thank you for your respond

[Jan]

Hi, I cannot test it as I don't know how to use RTL langauges

You should not to add it on the line 91, you need to compare the obsolete code on this site:
https://www.phoca.cz/documents/2-phoca-g ... thumbnails

and add (coplete) the code here:
administrator/components/com_phocagallery/libraries/phocagallery/render/renderfront.php

(not in the obsolete file: components/com_phocagallery/views/category/view.html.php)

So somebody with php skills and with rtl language skills should help us

Jan