Exemplo n.º 1
0
									$num = substr($key,4);
									if (!isset($icon_link_count[$num])) $icon_link_count[$num]=0;
									$ikey=$icon_link_count[$num];
									$icons[$num][$ikey]['link']=$itemsArray[$key][$subkey];
									$icon_link_count[$num]++;
							}
							if (strpos($subkey, '-image')!==FALSE) {
									$num = substr($key,4);
									if (!isset($icon_image_count[$num])) $icon_image_count[$num]=0;
									$ikey=$icon_image_count[$num];
									$icons[$num][$ikey]['image']=$itemsArray[$key][$subkey];
									$icon_image_count[$num]++;
							}
						}
					}
					usquare_cache_images ($settings, $itemsArray, 180, 125, 0, 1);
					
					//print_r($icons);
					foreach ($itemsArray as $key => $arr) {
						$num = substr($key,4);
						if (!isset($arr['item-background-color'])) $arr['item-background-color']='#ef4939';
						if ($arr['item-background-color']=='') $arr['item-background-color']='#ef4939';
						
						if (!isset($arr['item-background-image'])) $arr['item-background-image']='';
						if (!isset($arr['item-alt'])) $arr['item-alt']='';
						if (!isset($arr['item-image-position'])) $arr['item-image-position']=0;						
						if (!isset($arr['item-link-image-url'])) $arr['item-link-image-url']='';						
						if (!isset($arr['item-link-image-rel'])) $arr['item-link-image-rel']='';
						if (!isset($arr['item-link-image-target'])) $arr['item-link-image-target']='';						
						if (!isset($arr['item-link-image'])) $arr['item-link-image']=0;
						if ($arr['item-link-image']==0) $arr['item-link-image']='';
Exemplo n.º 2
0
function generate_usquare(usquareAdmin &$usquare_this, $settings, &$itemsArray, $plugin_url, $id, $icons, $mode=0)
{
	global $usquare_init_number, $usquare_init;
	global $global_usquare_this;
	if (!isset($global_usquare_this)) $global_usquare_this=$usquare_this;
	if (!isset($usquare_init_number)) $usquare_init_number=0;
	$usquare_init_number++;
	
	if (!isset($usquare_init)) $usquare_init=array();

	$count=count($itemsArray);
	if ($count==0) return '';
	
	usquare_cache_images ($settings, $itemsArray);

	// normal resolution
	$items_per_row = $settings['usquare-items-per-line'];
	if ($count<$items_per_row) $items_per_row=$count;
	$item_width=$settings['item-width'];
	$item_height=$settings['item-height'];
	$item_half_width=round($settings['item-width']/2, 2);
	$item_extended_height=$settings['item-extended-height'];
	
	$item_width_scroll=$item_width-20;
	$item_width_scroll_inner=$item_width-40;

	$usquare_width=$items_per_row*$item_width;
	$close_button_left=$item_width-40;
	$item_extended_height_scroll=$item_extended_height-75-$settings['item-bottom-space'];
	$usquare_about_height=$item_extended_height-75-$settings['item-bottom-space'];
	
	$item_half_width_normal = $item_half_width;
	$item_width_normal = $item_width;
	$item_height_normal = $item_height;

	// mode 0 = print all
	// mode 1 = only css+js
	// mode 2 = only html
	
	if (!isset($usquare_init[$id]) && $mode==2) $mode=0;
	
	$usquare_init[$id]=1;
	$frontHtml='';
	
	//if (!isset($settings['skip-head-section'])) $settings['skip-head-section']=0;
	
	if ($usquare_this->settings['skip_head_section']==1) {
		if ($mode==1) return '';
		if ($mode==2) {
			$mode=0;
			if ($usquare_this->settings['use_separated_jquery']==1) {
				$frontHtml.=$usquare_this->get_separated_jquery_hack();
			}
		}
	}
	
	if ($mode==0 || $mode==1) {

		if (!isset($settings['title-font-weight']) && !isset($settings['title-font-style']) && isset($settings['title-font-variant'])) {
			$settings['title-font-weight']=get_font_weight_from_variant($settings['title-font-variant']);
			$settings['title-font-style']=get_font_style_from_variant($settings['title-font-variant']);
			//echo $settings['title-font-variant'].' = '.$settings['title-font-weight'].' - '.$settings['title-font-style'].'<br />';
		}
		if (!isset($settings['description-font-weight']) && !isset($settings['description-font-style']) && isset($settings['description-font-variant'])) {
			$settings['description-font-weight']=get_font_weight_from_variant($settings['description-font-variant']);
			$settings['description-font-style']=get_font_style_from_variant($settings['description-font-variant']);
			//echo $settings['description-font-variant'].' = '.$settings['description-font-weight'].' - '.$settings['description-font-style'].'<br />';
		}
		if (!isset($settings['content-font-weight']) && !isset($settings['content-font-style']) && isset($settings['content-font-variant'])) {
			$settings['content-font-weight']=get_font_weight_from_variant($settings['content-font-variant']);
			$settings['content-font-style']=get_font_style_from_variant($settings['content-font-variant']);
			//echo $settings['content-font-variant'].' = '.$settings['content-font-weight'].' - '.$settings['content-font-style'].'<br />';
		}
		if (!isset($settings['info-font-weight']) && !isset($settings['info-font-style']) && isset($settings['info-font-variant'])) {
			$settings['info-font-weight']=get_font_weight_from_variant($settings['info-font-variant']);
			$settings['info-font-style']=get_font_style_from_variant($settings['info-font-variant']);
			//echo $settings['info-font-variant'].' = '.$settings['info-font-weight'].' - '.$settings['info-font-style'].'<br />';
		}
		
		if ($settings['title-font-weight']!='400') $title_font_weight=$settings['title-font-weight'];
		else $title_font_weight='normal';
		$title_font_style=$settings['title-font-style'];

		if ($settings['description-font-weight']!='400') $description_font_weight=$settings['description-font-weight'];
		else $description_font_weight='normal';
		$description_font_style=$settings['description-font-style'];

		if ($settings['content-font-weight']!='400') $content_font_weight=$settings['content-font-weight'];
		else $content_font_weight='normal';
		$content_font_style=$settings['content-font-style'];

		if ($settings['info-font-weight']!='400') $info_font_weight=$settings['info-font-weight'];
		else $info_font_weight='normal';
		$info_font_style=$settings['info-font-style'];

		$fonts_to_load=array();
		$loaded_fonts=array();
		if ($settings['title-font-name']!='') {
			$v=$settings['title-font-name'];
			$add='';
			if ($settings['title-font-weight']!='400') $add.=$settings['title-font-weight'];
			if ($settings['title-font-style']!='regular') $add.=$settings['title-font-style'];
			if ($add!='') $v.=":".$add;
			if (!isset($loaded_fonts[$v])) {
				$fonts_to_load[]=$v;
				$loaded_fonts[$v]=1;
			}
		}
		if ($settings['description-font-name']!='') {
			$v=$settings['description-font-name'];
			$add='';
			if ($settings['description-font-weight']!='400') $add.=$settings['description-font-weight'];
			if ($settings['description-font-style']!='regular') $add.=$settings['description-font-style'];
			if ($add!='') $v.=":".$add;
			if (!isset($loaded_fonts[$v])) {
				$fonts_to_load[]=$v;
				$loaded_fonts[$v]=1;
			}
		}
		if ($settings['content-font-name']!='') {
			$v=$settings['content-font-name'];
			$add='';
			if ($settings['content-font-weight']!='400') $add.=$settings['content-font-weight'];
			if ($settings['content-font-style']!='regular') $add.=$settings['content-font-style'];
			if ($add!='') $v.=":".$add;
			if (!isset($loaded_fonts[$v])) {
				$fonts_to_load[]=$v;
				$loaded_fonts[$v]=1;
			}
		}
		if ($settings['info-font-name']!='') {
			$v=$settings['info-font-name'];
			$add='';
			if ($settings['info-font-weight']!='400') $add.=$settings['info-font-weight'];
			if ($settings['info-font-style']!='regular') $add.=$settings['info-font-style'];
			if ($add!='') $v.=":".$add;
			if (!isset($loaded_fonts[$v])) {
				$fonts_to_load[]=$v;
				$loaded_fonts[$v]=1;
			}
		}

		if (count($fonts_to_load)) {
			$frontHtml.='<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=';
			$foreach_i=0;
			foreach($fonts_to_load as $font) {
				if ($foreach_i) $frontHtml.='|';
				$frontHtml.=str_replace(' ', '%20', $font);
				$foreach_i++;
			}
			$frontHtml.='">';
		}
		$frontHtml.= '
<style type="text/css">
#usquare_'.$id.' {
	width: '.$usquare_width.'px;
	position: relative;
	margin: 0 auto;
	display: block;
	clear: both;
}
#usquare_'.$id.' .usquare_module_wrapper {
	width: 100%;
	position: relative;
	display: block;
}
#usquare_'.$id.' .usquare_module_wrapper h2 {';
	if ($settings['title-font-name']!='') $frontHtml.= "	font-family: '".$settings['title-font-name']."', 'OstrichSansMedium' !important;";
	$frontHtml.= " font-weight: ".$title_font_weight." !important; font-style: ".$title_font_style." !important;";
	$frontHtml.= ' font-size: '.$settings['title-font-size'].'px !important;';
	$frontHtml.= ' line-height: '.$settings['title-font-size'].'px !important;
}
#usquare_'.$id.' .usquare_module_wrapper span {';
	if ($settings['description-font-name']!='') $frontHtml.= "	font-family: '".$settings['description-font-name']."', 'PTSansRegular' !important;";
	$frontHtml.= " font-weight: ".$description_font_weight." !important; font-style: ".$description_font_style." !important;";
	$frontHtml.= ' font-size: '.$settings['description-font-size'].'px !important;';
	$frontHtml.= ' line-height: '.$settings['description-font-size'].'px !important;
}
#usquare_'.$id.' .usquare_block_extended .usquare_about {';
	if ($settings['content-font-name']!='') $frontHtml.= "	font-family: '".$settings['content-font-name']."', 'PTSansRegular' !important;";
	$frontHtml.= " font-weight: ".$content_font_weight." !important; font-style: ".$content_font_style." !important;";
	$frontHtml.= ' font-size: '.$settings['content-font-size'].'px !important;';
	$frontHtml.= ' line-height: '.$settings['content-font-size'].'px !important;
}
#usquare_'.$id.' .usquare_module_wrapper span.bold {';
	if ($settings['info-font-name']!='') $frontHtml.= "	font-family: '".$settings['info-font-name']."', 'PTSansRegular' !important;  ";
	else $frontHtml.= '	font-family: "PTSansRegular" !important;';
	$frontHtml.= " font-weight: ".$info_font_weight." !important; font-style: ".$info_font_style." !important;";
	$frontHtml.= ' font-size: '.$settings['info-font-size'].'px !important;';
	$frontHtml.= ' line-height: '.$settings['info-font-size'].'px !important;
}
#usquare_'.$id.' .usquare_block {
	width: '.$item_width.'px;
	height: '.$item_height.'px;
}
#usquare_'.$id.' .full_usquare_square {
	width: '.$item_width.'px; 
	height: '.$item_height.'px; 
	cursor: pointer;
}
#usquare_'.$id.' .half_usquare_square {
	width: '.$item_half_width.'px; 
	height: '.$item_height.'px; 
	cursor: pointer;
}
#usquare_'.$id.' .right_gray_usquare_square {
	position: absolute;
	left:  '.$item_half_width.'px;
}
#usquare_'.$id.' .usquare_block_extended {
	width: '.$item_width.'px; 
	height: '.$item_extended_height.'px; 
	margin-top: '.$item_height.'px; 
}
#usquare_'.$id.' .usquare_block_extended .close {
	left: '.$close_button_left.'px;
}
#usquare_'.$id.' .usquare_about { width: '.$item_width_scroll.'px; clear: both; margin: 0px; padding-left: 17px; height: '.$usquare_about_height.'px; }
#usquare_'.$id.' .usquare_about .viewport { width: '.$item_width_scroll_inner.'px; height: '.$item_extended_height_scroll.'px; }
';
}

// --- 960 resolution ---
	$items_per_row = $settings['usquare-items-per-row-960'];
	if ($count<$items_per_row) $items_per_row=$count;
	$item_width=$settings['item-width-960'];
	$item_height=$settings['item-height-960'];
	$item_half_width=round($settings['item-width-960']/2, 2);
	$item_extended_height=$settings['item-extended-height-960'];

	$item_width_scroll=$item_width-20;
	$item_width_scroll_inner=$item_width-40;
	$usquare_about_height=$item_extended_height-75-$settings['item-bottom-space-960'];
	$item_extended_height_scroll=$item_extended_height-75-$settings['item-bottom-space-960'];

	$usquare_width=$items_per_row*$item_width;
	$close_button_left=$item_width-40;

if ($mode==0 || $mode==1) {
$frontHtml .= '
@media screen and (max-width:960px) {
	#usquare_'.$id.' {
		width: '.$usquare_width.'px;
		position: relative;
		margin: 0 auto;
		display: block;
		clear: both;
	}
	#usquare_'.$id.' .usquare_block {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .full_usquare_square {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .half_usquare_square {
		width: '.$item_half_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .right_gray_usquare_square {
		position: absolute;
		left:  '.$item_half_width.'px;
	}
	#usquare_'.$id.' .usquare_block_extended {
		width: '.$item_width.'px; 
		height: '.$item_extended_height.'px; 
		margin-top: '.$item_height.'px; 
	}
	#usquare_'.$id.' .usquare_block_extended .close {
		left: '.$close_button_left.'px;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		height: '.$usquare_about_height.'px; 
	}
	#usquare_'.$id.' .usquare_about { width: '.$item_width_scroll.'px; clear: both; margin: 0px; padding-left: 16px; height: '.$usquare_about_height.'px; }
	#usquare_'.$id.' .usquare_about .viewport { width: '.$item_width_scroll_inner.'px; height: '.$item_extended_height_scroll.'px; }
	#usquare_'.$id.' .usquare_module_wrapper h2 {
		font-size: '.$settings['title-font-size-960'].'px !important;
		line-height: '.$settings['title-font-size-960'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span {
		font-size: '.$settings['description-font-size-960'].'px !important;
		line-height: '.$settings['description-font-size-960'].'px !important;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		font-size: '.$settings['content-font-size-960'].'px !important;
		line-height: '.$settings['content-font-size-960'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span.bold {
		font-size: '.$settings['info-font-size-960'].'px !important;
		line-height: '.$settings['info-font-size-960'].'px !important;
	}
}';
}

// --- 768 resolution ---
	$items_per_row = $settings['usquare-items-per-row-768'];
	if ($count<$items_per_row) $items_per_row=$count;
	$item_width=$settings['item-width-768'];
	$item_height=$settings['item-height-768'];
	$item_half_width=round($settings['item-width-768']/2, 2);
	$item_extended_height=$settings['item-extended-height-768'];

	$item_width_scroll=$item_width-20;
	$item_width_scroll_inner=$item_width-40;
	$usquare_about_height=$item_extended_height-75-$settings['item-bottom-space-768'];
	$item_extended_height_scroll=$item_extended_height-75-$settings['item-bottom-space-768'];

	$usquare_width=$items_per_row*$item_width;
	$close_button_left=$item_width-40;

if ($mode==0 || $mode==1) {
$frontHtml .= '
@media screen and (max-width:768px) {
	#usquare_'.$id.' {
		width: '.$usquare_width.'px;
		position: relative;
		margin: 0 auto;
		display: block;
		clear: both;
	}
	#usquare_'.$id.' .usquare_block {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .full_usquare_square {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .half_usquare_square {
		width: '.$item_half_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .right_gray_usquare_square {
		position: absolute;
		left:  '.$item_half_width.'px;
	}
	#usquare_'.$id.' .usquare_block_extended {
		width: '.$item_width.'px; 
		height: '.$item_extended_height.'px; 
		margin-top: '.$item_height.'px; 
	}
	#usquare_'.$id.' .usquare_block_extended .close {
		left: '.$close_button_left.'px;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		height: '.$usquare_about_height.'px; 
	}
	#usquare_'.$id.' .usquare_about { width: '.$item_width_scroll.'px; clear: both; margin: 0px; padding-left: 16px; height: '.$usquare_about_height.'px; }
	#usquare_'.$id.' .usquare_about .viewport { width: '.$item_width_scroll_inner.'px; height: '.$item_extended_height_scroll.'px; }
	#usquare_'.$id.' .usquare_module_wrapper h2 {
		font-size: '.$settings['title-font-size-768'].'px !important;
		line-height: '.$settings['title-font-size-768'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span {
		font-size: '.$settings['description-font-size-768'].'px !important;
		line-height: '.$settings['description-font-size-768'].'px !important;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		font-size: '.$settings['content-font-size-768'].'px !important;
		line-height: '.$settings['content-font-size-768'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span.bold {
		font-size: '.$settings['info-font-size-768'].'px !important;
		line-height: '.$settings['info-font-size-768'].'px !important;
	}
}';
}

// --- 440 resolution ---
	$items_per_row = $settings['usquare-items-per-row-440'];
	if ($count<$items_per_row) $items_per_row=$count;
	$item_width=$settings['item-width-440'];
	$item_height=$settings['item-height-440'];
	$item_half_width=round($settings['item-width-440']/2, 2);
	$item_extended_height=$settings['item-extended-height-440'];

	$item_width_scroll=$item_width-20;
	$item_width_scroll_inner=$item_width-40;
	$usquare_about_height=$item_extended_height-75-$settings['item-bottom-space-440'];
	$item_extended_height_scroll=$item_extended_height-75-$settings['item-bottom-space-440'];

	$usquare_width=$items_per_row*$item_width;
	$close_button_left=$item_width-40;

if ($mode==0 || $mode==1) {
$frontHtml .= '
@media screen and (max-width:440px) {
	#usquare_'.$id.' {
		width: '.$usquare_width.'px;
		position: relative;
		margin: 0 auto;
		display: block;
		clear: both;
	}
	#usquare_'.$id.' .usquare_block {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .full_usquare_square {
		width: '.$item_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .half_usquare_square {
		width: '.$item_half_width.'px; 
		height: '.$item_height.'px; 
	}
	#usquare_'.$id.' .right_gray_usquare_square {
		position: absolute;
		left:  '.$item_half_width.'px;
	}
	#usquare_'.$id.' .usquare_block_extended {
		width: '.$item_width.'px; 
		height: '.$item_extended_height.'px; 
		margin-top: '.$item_height.'px; 
	}
	#usquare_'.$id.' .usquare_block_extended .close {
		left: '.$close_button_left.'px;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		height: '.$usquare_about_height.'px; 
	}
	#usquare_'.$id.' .usquare_block_extended li {
		margin:11px 6px 0 6px;
	}
	#usquare_'.$id.' .usquare_block_extended ul {
		top: '.$item_half_width.'px;
	}
	#usquare_'.$id.' .usquare_about { width: '.$item_width_scroll.'px; clear: both; margin: 0px; padding-left: 16px; height: '.$usquare_about_height.'px; }
	#usquare_'.$id.' .usquare_about .viewport { width: '.$item_width_scroll_inner.'px; height: '.$item_extended_height_scroll.'px; }
	#usquare_'.$id.' .usquare_module_wrapper h2 {
		font-size: '.$settings['title-font-size-440'].'px !important;
		line-height: '.$settings['title-font-size-440'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span {
		font-size: '.$settings['description-font-size-440'].'px !important;
		line-height: '.$settings['description-font-size-440'].'px !important;
	}
	#usquare_'.$id.' .usquare_block_extended .usquare_about {
		font-size: '.$settings['content-font-size-440'].'px !important;
		line-height: '.$settings['content-font-size-440'].'px !important;
	}
	#usquare_'.$id.' .usquare_module_wrapper span.bold {
		font-size: '.$settings['info-font-size-440'].'px !important;
		line-height: '.$settings['info-font-size-440'].'px !important;
	}
}
</style>';
//echo $item_extended_height; exit;
}

//echo '<pre>';print_r($itemsArray);echo '</pre><hr />';

if ($mode==0 || $mode==2) {
$frontHtml .='<div id="usquare_'.$id.'"><div class="usquare_module_wrapper">
			<div class="usquare_module_shade"></div>
';

if (count($itemsArray)>0) {
	foreach ($itemsArray as $key => $arr) {
		$num = substr($key,4);
		//echo '<pre>';print_r($arr);echo '</pre>'; exit;
		
		if ($usquare_this->settings['fix_encoding']==1) {
			$arr['item-title']=mb_convert_encoding( $arr['item-title'], "HTML-ENTITIES", "UTF-8"); 
			$arr['item-description']=mb_convert_encoding( $arr['item-description'], "HTML-ENTITIES", "UTF-8"); 
			$arr['item-content']=mb_convert_encoding( $arr['item-content'], "HTML-ENTITIES", "UTF-8"); 
		}
		
		if (!isset($arr['item-background-color'])) $arr['item-background-color']='#ef4939';
		if ($arr['item-background-color']=='') $arr['item-background-color']='#ef4939';
		if (!isset($arr['item-background-image'])) $arr['item-background-image']='';
		
		$item_style='background-color: '.$arr['item-background-color'].';';
		if ($arr['item-background-image']!='') $item_style='background: url('.$arr['item-background-image'].');';
		
		if (!isset($arr['item-alt'])) $arr['item-alt']='';
		if ($arr['item-alt']!='') $alt=str_replace('"', "'", $arr['item-alt']);
		else $alt=str_replace('"', "'", $arr['item-title']);
		$alt_attr=' alt="'.$alt.'"';
		$title_attr=' title="'.$alt.'"';
		if (!isset($arr['image-position'])) $arr['image-position']=0;
		if (!isset($arr['item-link-image-url'])) $arr['item-link-image-url']='';
		if (!isset($arr['item-link-image-rel'])) $arr['item-link-image-rel']='';
		if (!isset($arr['item-link-image-target'])) $arr['item-link-image-target']='';
		if (!isset($arr['item-link-image'])) $arr['item-link-image']=0;
		if (!isset($arr['item-link-image-opened'])) $arr['item-link-image-opened']=0;

		if (!isset($arr['item-www'])) $arr['item-www']='';
		if (!isset($arr['item-email'])) $arr['item-email']='';
		if (!isset($arr['item-icons-target'])) $arr['item-icons-target']='';
		if (!isset($arr['item-title-color'])) $arr['item-title-color']='#ffffff';
		if (!isset($arr['item-description-color'])) $arr['item-description-color']='#ffffff';
		if (!isset($arr['item-content-color'])) $arr['item-content-color']='#ffffff';
		if (!isset($arr['item-info-color'])) $arr['item-info-color']='#ffffff';

		$item_dont_open='';
		if (!isset($arr['item-dont-open'])) $arr['item-dont-open']=0;
		if ($arr['item-dont-open']==1) $item_dont_open=' data-dont-open="1"';

		$item_dont_move='';
		if (!isset($arr['item-dont-move'])) $arr['item-dont-move']=0;
		if ($arr['item-dont-move']==1) $item_dont_move=' data-dont-move="1"';

		$item_link_square='';
		if (!isset($arr['item-link-square'])) $arr['item-link-square']=0;
		if ($arr['item-link-square']==1) $item_link_square=' data-link-square="1"';

		$custom_info_style='';
		$arrow_style='';
		$arrow_image=( !defined('YIT_USQUARE_URL') ) ? $plugin_url.'images/arrow.png' : YIT_USQUARE_URL.'/images/arrow.png';
		$w=$item_half_width_normal;
		$h=$item_height_normal;
		$img_class='half_usquare_square';
		$img_style='';
		if ($arr['item-image-position']==2) {$w=$item_width_normal; $img_class='full_usquare_square'; $img_style='max-width: 100%;';}
		
		if ($img_style!='') $img_style='style="'.$img_style.'"';
		
		$image='<img src="'.$arr['item-image'].'" class="usquare_square '.$img_class.'" '.$img_style.$alt_attr.' />';
		
		if ($settings['grayscale']==1) {
			$gray_image_class='';
			$gray_left='';
			if ($arr['item-image-position']==0) $gray_left=' left: 0;';
			if ($arr['item-image-position']==1) $gray_image_class=' right_gray_usquare_square';
			$image.='<img src="'.$arr['item-image-gray'].'" style="position: absolute;'.$gray_left.'" class="usquare_square '.$img_class.$gray_image_class.'" '.$img_style.' alt="" />';
			//echo '<pre>'; print_r($arr); echo '<pre>'; exit;
		}
		
		if ($arr['item-link-image']==1) {
			if ($arr['item-link-image-url']=='') $arr['item-link-image-url']=$arr['item-image-original'];
			$target='';
			$data_target='';
			if ($arr['item-link-image-target']!='') {$target='target="'.$arr['item-link-image-target'].'"'; $data_target='data-target="'.$arr['item-link-image-target'].'"';}
			if ($arr['item-link-image-opened']==0) {
				$image='<a '.$target.' href="'.$arr['item-link-image-url'].'" rel="'.$arr['item-link-image-rel'].'"'.$title_attr.'>'.$image.'</a>';
			} else {
				$image='<a '.$data_target.' data-href="'.$arr['item-link-image-url'].'" data-rel="'.$arr['item-link-image-rel'].'" data-only-open="1"'.$title_attr.'>'.$image.'</a>';
			}
		}

		if ($arr['item-image-position']==1) {
			$custom_info_style=' style="right: 0; text-align: right;"';
			$arrow_style=' style="float: right; padding: 0 0 5px;"';
			$arrow_image=( !defined('YIT_USQUARE_URL') ) ? $plugin_url.'images/arrow_r.png' : YIT_USQUARE_URL.'/images/arrow_r.png';
		}

$frontHtml .='<div class="usquare_block"'.$item_dont_move.$item_dont_open.$item_link_square.'>';
if ($arr['item-image-position']==0 || $arr['item-image-position']==2) $frontHtml .= $image;
if ($arr['item-image-position']!=2) {
$frontHtml .='				<div class="usquare_square half_usquare_square" style="'.$item_style.'">
					<div class="usquare_square_text_wrapper"'.$custom_info_style.'>
						<img src="'.$arrow_image.'" class="usquare_arrow" alt="arrow" '.$arrow_style.'/>
						<div class="clear"></div>
						<h2 style="color: '.$arr['item-title-color'].' !important;">'.$arr['item-title'].'</h2>
						<span style="color: '.$arr['item-description-color'].' !important;">'.$arr['item-description'].'</span>
						<div class="clear"></div>
					</div>
				</div>';
}
if ($arr['item-image-position']==1) $frontHtml .= $image;
$frontHtml.='
				<div class="usquare_block_extended" style="'.$item_style.'">
					<a class="close"><img src="'.$plugin_url.'images/close.png" alt="close"/></a>
					<ul class="social_background">';

		$target='';
		if ($arr['item-icons-target']!='') $target='target="'.$arr['item-icons-target'].'"';
			
		if (isset($icons[$num]))
		{
			$n=1;
			foreach ($icons[$num] as $icon_id => $icon_arr)
			{
				$link=$icon_arr['link'];
				$image=$icon_arr['image'];
				$frontHtml .= '<li><a '.$target.' href="'.$link.'"><img src="'.$image.'" alt="social" /></a></li>';
			}
		}

		if ($arr['item-www']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-www'].'"><img src="'.$plugin_url.'images/social-www.png" alt="www" /></a></li>';
		if ($arr['item-email']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-email'].'"><img src="'.$plugin_url.'images/social-email.png" alt="email" /></a></li>';
		if ($arr['item-facebook']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-facebook'].'"><img src="'.$plugin_url.'images/social-fb.png" alt="social" /></a></li>';
		if ($arr['item-twitter']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-twitter'].'"><img src="'.$plugin_url.'images/social-tw.png" alt="social" /></a></li>';
		if ($arr['item-linkedin']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-linkedin'].'"><img src="'.$plugin_url.'images/social-in.png" alt="social" /></a></li>';
		if ($arr['item-pinterest']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-pinterest'].'"><img src="'.$plugin_url.'images/social-pint.png" alt="social" /></a></li>';
		if ($arr['item-yahoo']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-yahoo'].'"><img src="'.$plugin_url.'images/social-yah.png" alt="social" /></a></li>';
		if ($arr['item-digg']!='') $frontHtml .= '<li><a '.$target.' href="'.$arr['item-digg'].'"><img src="'.$plugin_url.'images/social-dig.png" alt="social" /></a></li>';
$frontHtml .=					'</ul>
				
					<div class="clear"></div>
					
					<span class="bold" style="color: '.$arr['item-info-color'].' !important;">'.$settings['info-label'].'</span>
					<div class="usquare_about" style="color: '.$arr['item-content-color'].' !important;">    
					<div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>
    <div class="viewport">
        <div class="overview">
            '.$arr['item-content'].'
        </div>
    </div>
	
					</div>
				</div>
			</div>
';
	}
}
$frontHtml .= '
<div class="clear"></div>
</div>
</div>
';
}

if ($mode==0 || $mode==1) {
$frontHtml .= '
<script>
';

if ($usquare_init_number==1) $frontHtml.='var usquare_plugin_url="'.$plugin_url.'";';

$jQueryAlias='jQuery';
if ($usquare_this->alternative_jquery) $jQueryAlias='usquare_jQuery';

if (!isset($settings['push_content_below'])) $settings['push_content_below']=0;
$frontHtml.='    (function($){
		$(document).ready( function() {
			if ($("#usquare_'.$id.'").length) {
				$("#usquare_'.$id.'").uSquare({
					opening_speed:		'.$settings['opening-speed'].',
					closing_speed:		'.$settings['closing-speed'].',
					easing:				"'.$settings['easing'].'",
					grayscale:			'.$settings['grayscale'].',
					push_content_below:	'.$settings['push_content_below'].'
				});
			}
		});
    })('.$jQueryAlias.');
</script>
';
}

if ($mode==0 || $mode==2) {
$frontHtml.='<div class="clear"></div>
';
}
$frontHtml=str_replace("\r", "", $frontHtml);
$frontHtml=str_replace("\n", "", $frontHtml);
return $frontHtml;
}