<?php if (Mage::getStoreConfig('amazesettings/amazesettings_products/related_product')): ?>

<?php if($this->getItems()->getSize()): ?>
<!-- BEGIN CATEGORY PRODUCTS -->
<div class="related-slider">
  <div class="new_title center">
      <h2><span><?php echo $this->__('Related Products') ?></span></h2>
  </div> <!--new_title center-->
<a href="#" class="jcarousel-prev-horizontal1" id="products_slider_prev1"></a>
<a href="#" class="jcarousel-next-horizontal1" id="products_slider_next1"></a>


  <div class="jcarousel-skin-tango5">
    <div class="jcarousel-container jcarousel-container-horizontal" style="position: relative; display: block;">
       <div class="jcarousel-clip jcarousel-clip-horizontal" style="position: relative;">
 
      <ul class="products-grid jcarousel-list jcarousel-list-horizontal" id="products_slider" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; left: -590px; width: 2460px;">
       <?php foreach($this->getItems() as $_item): ?>
            <li class="item jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal" jcarouselindex="1" style="float: left; list-style: none outside none;">

              <div class="item-inner">
     <div class="product-block">
        <div class="product-image">
          <a href="<?php echo $_item->getProductUrl() ?>">
            <figure class="product-display">
          <?php echo $this->helper('amazesettings')->getLabel($_item);  ?>
          <img class="lazyOwl product-mainpic" src="<?php echo $this->helper('catalog/image')->init($_item, 'small_image')->resize(268,325) ?>" alt="<?php echo $this->htmlEscape($_item->getName()) ?>" />
          <img class="product-secondpic" src="<?php echo $this->helper('catalog/image')->init($_item, 'thumbnail')->resize(268,325) ?>" alt="<?php echo $this->htmlEscape($_item->getName()) ?>" />
            </figure>
          </a>
        </div> <!--product-image-->
        <div class="product-meta">
           <div class="product-action">
              <?php if($_item->isSaleable()): ?>
                <a href="<?php echo $this->getAddToCartUrl($_item) ?>" class="addcart"> <i class="icon-shopping-cart">&nbsp;</i> <?php echo $this->__('Add to Cart') ?></a>
              <?php else: ?>
                <p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>
              <?php endif; ?>
              <a href="<?php echo $this->helper('wishlist')->getAddUrl($_item) ?>" class="wishlist" title="<?php echo $this->__('Add to Wishlist');?>"><i class="icon-heart">&nbsp;</i></a>
              <?php if(Mage::app()->getStore()->getConfig('amazesettings/amazesettings_quickview/enable')==1){?>
                  <a data-fancybox-type="ajax" onclick="callQuickView('<?php echo Mage::getUrl('amazesettings/index/view/id/'.$_item->getId());?>');" title="<?php echo $this->__('Quick View') ?>" class="quickview"><i class="icon-zoom">&nbsp;</i></a>                    
              <?php }  ?>   
           </div> <!--product-action-->
        </div> <!--product-meta-->
     </div> <!--product-block-->

     <div class="item-info">
       <div class="info-inner">
          <div class="item-title">
            <a href="<?php echo $_item->getProductUrl() ?>" title="<?php echo $this->htmlEscape($_item->getName()) ?>">
                  <?php $prod_name = $this->htmlEscape($_item->getName()) ; 
                  if(strlen($prod_name) > 30) {echo substr($prod_name,0,30)."...";}else {echo $prod_name;}?>
            </a>
          </div> <!--item-title-->
          <div class="item-content">
            <div class="item-price">
              <?php echo $this->getPriceHtml($_item, true, '-related') ?>
            </div> <!--item-price-->
                    <?php
                        $summaryData = Mage::getModel('review/review_summary')
                                ->setStoreId($storeId)
                                ->load($_item->getId());
                        if($summaryData->getRatingSummary()) { ?>
                          <div class="rating">
                            <div class="ratings">
                                <div class="rating-box">
                                        <div class="rating" style="width: <?php echo $summaryData->getRatingSummary().'%'; ?>"></div>
                                </div> <!--rating-box-->
                            </div> <!--ratings-->
                          </div> <!--rating-->
                    <?php } else { ?>  
                            <div class="rating"><div class="ratings"><div class="rating-box"><div style="width:0%" class="rating"></div></div></div></div>
                    <?php } ?>
          </div> <!--item-content-->
       </div> <!--info-inner-->
     </div> <!--item-info-->
   </div> <!--item-inner-->

            </li>
             <?php endforeach; ?>  
        </ul>
         
        <script type="text/javascript">decorateList('block-related', 'none-recursive')</script>
  
 
  </div> <!--jcarousel-clip jcarousel-clip-horizontal-->
 
  </div> <!--jcarousel-container jcarousel-container-horizontal-->

  </div> <!--jcarousel-skin-tango5-->


</div><!--related-slider-->
   
<script type="text/javascript">
jQuery(document).ready(function($) {

        function mycarousel_initCallback(carousel) {
            $('#products_slider_next1').bind('click', function() {
                carousel.next();
                return false;
            });
            $('#products_slider_prev1').bind('click', function() {
                carousel.prev();
                return false;
            });
        };

    $('#products_slider').jcarousel({
            scroll: 1,
        initCallback: mycarousel_initCallback,
            buttonNextHTML: null,
            buttonPrevHTML: null
    });
});
</script> 
<div id="mgkquickview">
<div id="magikloading" style="display:none;text-align:center;margin-top:400px;"><img src="<?php echo $this->getSkinUrl('images/mgkloading.gif');?>" alt="loading">
</div></div>
<script type="text/javascript">
function callQuickView(qurl) { 
    jQuery('#mgkquickview').show();
    jQuery('#magikloading').show();
    jQuery.get(qurl, function(data) {
      jQuery.fancybox(data);
      jQuery('#magikloading').hide();
jQuery('#mgkquickview').hide();
    });
 }
 
</script>
<?php endif; ?>  <!-- end related product -->

<?php endif; ?>

      
                


