<script type="text/javascript" src="catalog/javascript/jquery.fancybox-1.3.1.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
			$("a[rel=example_group]").fancybox({
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'titlePosition' 	: 'over',
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
				}
			});
		});

		function helpful_yes(review_id)
		{
			$.ajax({
				type: "get",
				url: "index.php?controller=product&action=ajax_helpful_yes&review_id="+review_id,
				success: function(data){
					var html=data;
					$("#helpful_yes"+review_id).html(html);
				}
			});
		}
		function helpful_no(review_id)
		{
			$.ajax({
				type: "get",
				url: "index.php?controller=product&action=ajax_helpful_no&review_id="+review_id,
				success: function(data){
					var html=data;
					$("#helpful_no"+review_id).html(html);
				}
			});
		}
</script>
<div id="customer-reviewss">
      <div id="customer-reviews">
      	  <div class="tab-content-title">Write a Review to get points</div>
      	  <div class="productreviews-container">
			<p class="tips">Any customers purchased this item may get 3 points through writing a Review. You also may get 5-10 points through posting products or vedios of this item you received. But the final points will be given after we verify your Review. Want to login your account to write more Reviews at &quot;My Review&quot; section by <a href="index.php?controller=waiting_review" style="color:blue;">here</a>.</p>
            <div id="transction-review">
                <div class="row box-reviews">
                	<div class="col-sm-16">
                        <div class="reviews-summary">
                           <span class="avg-label">Average rating:</span>
                           <span class="avg-number"><?php echo $rating_stars[0];?></span>
                            <div class="rating big">
                                <span class="nostar">
                                    <span class="nstar" style="width:<?php echo intval($review_ratings['avg']*20)?>%;"></span>
                                </span>
                            </div>
                            <span class="nr-votes">(<?php echo $review_total; ?> votes)</span>
                       </div>
                        <table class="rate-data">
                            <tbody>
                                <tr>
    <td rowspan="2"><b>Positive</b>  (<?php if($rating_stars[5]+$rating_stars[4]>0) echo round(doubleval(($rating_stars[4]+$rating_stars[5])/$review_total),2)*100; else echo '0'?>%)</td>
                                    <td><span class="left">5 Stars (<?php  echo $rating_stars[5]>0?$rating_stars[5]:0;?>)</span>
                 <div class="ratebar ratebar-s"><span style="width:<?php if($rating_stars[5]>0) echo round(doubleval(($rating_stars[5])/$review_total),2)*100; else echo '0'?>%;"></span></div>
                                   </td>
                                </tr>
                                <tr>
                                    <td>
                                        <span class="left">4 Stars (<?php echo $rating_stars[4]>0?$rating_stars[4]:0;?>) </span>
                <div class="ratebar ratebar-s"><span style="width:<?php if($rating_stars[4]>0) echo round(doubleval(($rating_stars[4])/$review_total),2)*100; else echo '0'?>%;"></span></div>
                                        </td>
                                    </tr>
                                <tr>
                                    <td>
    <b>Neutral</b>  (<?php if($rating_stars[3]>0) echo round(doubleval($rating_stars[3]/$review_total),2)*100; else echo '0'?>%)
                                    </td>
                                    <td>
                                        <span class="left">3 Stars (<?php echo $rating_stars[3]?$rating_stars[3]:0;?>) </span>
           <div class="ratebar ratebar-s"><span style="width:<?php if($rating_stars[3]>0) echo round(doubleval(($rating_stars[3])/$review_total),2)*100; else echo '0'?>%;"></span></div>
                                    </td>
                                </tr>
                                <tr>
                                    <td rowspan="2">
    <b>Negative</b>  (<?php if($rating_stars[2]+$rating_stars[1]>0) echo round(doubleval(($rating_stars[2]+$rating_stars[1])/$review_total),2)*100; else echo '0'?>%)</td>
                                    <td>
                                        <span class="left">2 Stars (<?php echo $rating_stars[2]?$rating_stars[2]:0;?>) </span>
                     <div class="ratebar ratebar-s"><span style="width:<?php if($rating_stars[2]>0) echo round(doubleval(($rating_stars[2])/$review_total),2)*100; else echo '0'?>%;"></span></div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <span class="left">1 Star (<?php echo $rating_stars[1]?$rating_stars[1]:0;?>) </span>
                  <div class="ratebar ratebar-s"><span style="width:<?php if($rating_stars[1]>0) echo round(doubleval(($rating_stars[1])/$review_total),2)*100; else echo '0'?>%;"></span></div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>

                    <div class="col-sm-8">
                       <div class="note clearfix">
                            <ul class="clearfix">
                                <li><a href="index.php?controller=waiting_review" class="pp">Post Photos</a></li>
                                <li class="wr"><a href="index.php?controller=waiting_review" class="wr">Write a Review</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <?php if($review_total>0) { ?>
                <div class="rating-detail">
                    <div class="main-content">
                        <table width="100%" class="rating-table widthfixed">
                            <thead>
                                <tr>
                                    <th class="th3 col-sm-5">Buyer</th>
                                    <th class="th2 col-sm-12">Review</th>
                                    <th class="th4 col-sm-7">Survey</th>
                                </tr>
                            </thead>
                            <tbody id="ajax-reviews-list">
                              <?php foreach($product_reviews as $review){?>
                                   <tr>
                                        <td class="td3">
                                            <span class="name">
                             <label><?php echo $review['author']; ?><i class="member-level"></i></label>
                             <a class="area"><img src="<?php echo $review['country_info']['icon']?>"><?php echo $review['country_info']['country_name']?></a>
                                            <p class="verified">Verified Buyer</p>
                                            </span>
                                        </td>
                                        <td class="td2">
                                        <div class="rating"><div class="nostar">
                                             <span class="nstar" style="width:<?php echo $review['rating']*20?>%;"></span>
                                            </div>
                                                </div><span class="date">Post on <?php echo substr($review['date_added'],0,-3);?></span>

                                        <div class="right review">
                                            <span><?php echo $review['content']; ?></span>
                                        </div>

                                     <div class="outpic superbox clearfix">
    								<!--<?php foreach ($review['images'] as $review_image) { ?>
    									<a class="upload-img" href="<?php echo $review_image; ?>" target="_blank" style="margin-right:2px;"> <img width="100" height="100" src="<?php echo $review_image;?>"></a>
    								<?php } ?>-->
                                    <?php foreach ($review['images'] as $review_image) { ?>
    									<a rel="example_group" class="upload-img" href="<?php echo $review_image; ?>" style="margin-right:2px;"> <img width="100" height="100" src="<?php echo $review_image;?>"></a>
    								<?php } ?>
    	                             </div>

                                        <div class="commentAction">
                                            <div class="text">Was this review helpful?</div>
                                            <a class="textbtnGray" onclick="helpful_yes(<?php echo $review['review_id']?>)"><span class="Dlink useful reviewLike">(<label id="helpful_yes<?php echo $review['review_id']?>"><?php echo $review['helpful_yes']?></label>)</span></a>
                                            <a class="textbtnGray" onclick="helpful_no(<?php echo $review['review_id']?>)"><span class="Dlink useful usefulDown reviewLike">(<label id="helpful_no<?php echo $review['review_id']?>"><?php echo $review['helpful_no']?></label>)</span></a>
                                        </div>
                                        </td>
                                        <td class="td4 last">
                                            <div style="" class="clearfix">
                                            <div><p  style="margin-left:<?php echo $review['product_size']; ?>px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value">
                                               <span>Size:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/size.jpg"></p>
                                            </div>
                                            <div style="margin:12px 0;"><p style="margin-left:<?php echo $review['product_color']; ?>px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value">
                                              <span>Color:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/color.jpg"></p>
                                            </div>
                                            <div><p  style="margin-left:<?php echo $review['product_material']; ?>px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value">
                                               <span>Material:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/material.jpg"></p>
                                            </div>
                                            </div>
                                        </td>
                              </tr>
                             <?php }?>
                          </tbody>
                        </table>
                </div>
           <div class="toolbar clearfix">
          		<div class="sorter_bottom">
                	<div class="col-sm-8 left"><b><?php echo $review_count; ?></b> Reviews</div>
                	<input type="hidden" id="review_pages_id" name="review_pages_name" value="<?php echo count($pages); ?>" />
                    <div class="col-sm-16 right">
                        <a onclick="prevReviewsList();" href="javascript:void(0);"><?php echo 'Previous'?></a>
                        <span id="review-page-num-list">
                          <?php foreach ($pages as $f_page) { ?>
                           <?php if ( $f_page['value'] < ($page - 2) ) {continue; } ?>
                          <?php if ( $f_page['value'] > ($page + 4) ) {continue; } ?>
                          <?php if ($f_page['value'] == $page) { ?>
                          <a href="javascript:void(0);" data-value="<?php $x = explode(" ",$f_page['text']);echo $x[0]; ?>" onclick="reviewsListPage(<?php echo $f_page['value'];?>)" class="page_btn selected"><?php $x = explode(" ",$f_page['text']);echo $x[0]; ?></a>
                          <?php } else { ?>
                            <a class="page_btn" data-value="<?php $x = explode(" ",$f_page['text']);echo $x[0]; ?>" onclick="reviewsListPage(<?php echo $f_page['value'];?>)"><?php $x = explode(" ",$f_page['text']);echo $x[0]; ?></a></td>
                          <?php } ?>
                          <?php } ?>
                        </span>
                        <a class="page_btn" onclick="nextReviewList()" href="javascript:void(0);"><?php echo 'Next'?></a>
                    </div>
                </div>
          </div>
         </div>
      </div>
      <?php }?>
    </div>
  </div>
</div>
<script type="text/javascript">
  var page_counts = <?php echo count($pages); ?>;

  function nowReviewsListPage() {
    var page = $('.toolbar .sorter_bottom .right .selected').attr('data-value');
    return parseInt(page);
  }

  function prevReviewsList() {
    var page = nowReviewsListPage()-1;
    page = (page < 1)?1:page;
    reviewsListPage(page);
  }

  function nextReviewList() {
    var page = nowReviewsListPage()+1;
    pages_count=$("#review_pages_id").val();
    page = (page > pages_count)?pages_count:page;
    reviewsListPage(page);
  }

  function selectReviewsListPage(spage) {
    reviewsListPage(spage);
  }

  function reviewsListPage(spage){
    $('#loading-center').show();
    $.get("<?php echo $ajax_reviews_url; ?>&p="+spage+"&count=10", function(jsonData) {
        jsonData = jsonData.replace(/(^s*)|(s*$)/g, "");
        jsonData = eval('('+jsonData+')');
        var shtml = ' ';
        var data = jsonData.data;
        $('#ajax-reviews-list').html('');
        $('.toolbar .sorter_bottom .right a').removeClass('selected');
        $('.toolbar .sorter_bottom .right a[data-value="' + spage + '"]').addClass('selected');

        var page_count_num_list_html = '';
        for(var i=0; i<page_counts; i++) {
          var page_num_val = i+1;
          if ( page_num_val < (spage - 2) ) { continue; }
          if ( page_num_val > (spage + 4) ) { continue; }
          if ( page_num_val == spage) {
            page_count_num_list_html += '<a href="javascript:void(0);" data-value="' + page_num_val + '" onclick="reviewsListPage(' + page_num_val + ')" class="page_btn selected">' + page_num_val + '</a>';
          } else {
            page_count_num_list_html += '<a class="page_btn" data-value="' + page_num_val + '" onclick="reviewsListPage(' + page_num_val + ')">' + page_num_val + '</a></td>';
          }
        }
        $("#review-page-num-list").html(page_count_num_list_html);
        for(var i in data) {
          var tr = '<tr><td class="td3"><span class="name">';
          tr += '<label>' + data[i].author + '<i class="member-level"></i></label>';
          tr += '<a class="area"><img src="' + data[i].country_info.icon + '">' + data[i].country_info.country_name + '</a>';
          tr += '<p class="verified">Verified Buyer</p></span></td>';
          tr += '<td class="td2"><div class="rating"><div class="nostar"><span class="nstar" style="width:' + data[i].rating*20 + '%;"></span></div></div>';
          var postDate = data[i].date_added.substring(0, data[i].date_added.length-3);
          tr += '<span class="date">Post on ' + postDate + '</span>';
          tr += '<div class="right review"><span>' + data[i].content + '</span></div>';
          tr += '<div class="outpic superbox clearfix">';
          if(data[i].images) {
            var review_images = data[i].images;
            for(var j=0; j<review_images.length; j++) {
              var review_image = review_images[j];
              tr += '<a class="upload-img" href="' + review_image + '" target="_blank" style="margin-right:2px;"> <img width="100" height="100" src="' + review_image + '"></a>';
            }
          }
          tr += '</div>';
          var review_id = data[i].review_id;
          tr += '<div class="commentAction">Was this review helpful?<a class="textbtnGray" onclick="helpful_yes(' + review_id + ')"><span class="Dlink useful reviewLike">(<label id="helpful_yes' + review_id + '">' + data[i].helpful_yes + '</label>)</span></a><a class="textbtnGray" onclick="helpful_no(' + review_id + ')"><span class="Dlink useful usefulDown reviewLike">(<label id="helpful_no' + review_id + '">' + data[i].helpful_no + '</label>)</span></a></div></td>';
          tr += '<td class="td4 last"><div style="" class="clearfix">';
          tr += '<div><p style="margin-left:' + data[i].product_size + 'px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value"><span>Size:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/size.jpg"></p></div>';
          tr += '<div style="margin:12px 0;"><p style="margin-left:' + data[i].product_color + 'px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value"><span>Color:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/color.jpg"></p></div>';
          tr += '<div><p  style="margin-left:' + data[i].product_material + 'px;" class="td4_span_img"><img src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/sliderHandle.gif"></p><p class="td4_span_value"><span>Material:</span><img class="td4_span_value" src="https://www.beststoreitems.com/catalog/template/beststoreitems/image/material.jpg"></p></div>';
          tr += '</div></td></tr>';
          $('#ajax-reviews-list').append(tr);

          $('#loading-center').hide();
        }
        // document.getElementById('ajax-reviews-list').innerHtml = shtml;
    });
  }
</script>

