Merge pull request #164 from gskema/dev

[*] FO: Refactor product comment styles

themes/community-theme-16/js/modules/productcomments/js/productcomments.js

@@ -1,28 +1,21 @@
-$(document).ready(function() {
+$(function() {
   $('input.star').rating();
   $('.auto-submit-star').rating();
 
-  if (!!$.prototype.fancybox)
+  if (!!$.prototype.fancybox) {
     $('.open-comment-form').fancybox({
       'autoSize': false,
       'width': 600,
       'height': 'auto',
       'hideOnContentClick': false
     });
+  }
 
   $(document).on('click', '#id_new_comment_form .closefb', function(e) {
     e.preventDefault();
     $.fancybox.close();
   });
 
-  $(document).on('click', 'a[href=#idTab5]', function(e) {
-    $('*[id^="idTab"]').addClass('block_hidden_only_for_screen');
-    $('div#idTab5').removeClass('block_hidden_only_for_screen');
-
-    $('ul#more_info_tabs a[href^="#idTab"]').removeClass('selected');
-    $('a[href="#idTab5"]').addClass('selected');
-  });
-
   $(document).on('click', 'button.usefulness_btn', function(e) {
     var id_product_comment = $(this).data('id-product-comment');
     var is_usefull = $(this).data('is-usefull');
@@ -45,7 +38,8 @@ $(document).ready(function() {
     });
   });
 
-  $(document).on('click', 'span.report_btn', function(e) {
+  $(document).on('click', '.report_btn', function(e) {
+    e.preventDefault();
     if (confirm(confirm_report_message)) {
       var idProductComment = $(this).data('id-product-comment');
       var parent = $(this).parent();
@@ -68,15 +62,13 @@ $(document).ready(function() {
   });
 
   $(document).on('click', '#submitNewMessage', function(e) {
-    // Kill default behaviour
     e.preventDefault();
 
     // Form element
-
-    url_options = '?';
-    if (!productcomments_url_rewrite)
-      url_options = '&';
-
+    var url_options = productcomments_url_rewrite ? '?' : '&';
+    var $error = $('#new_comment_form_error');
+    $error.hide();
+
     $.ajax({
       url: productcomments_controller_url + url_options + 'action=add_comment&secure_key=' + secure_key + '&rand=' + new Date().getTime(),
       data: $('#id_new_comment_form').serialize(),
@@ -90,11 +82,11 @@ $(document).ready(function() {
           buttons[productcomment_ok] = 'productcommentRefreshPage';
           fancyChooseBox(moderation_active ? productcomment_added_moderation : productcomment_added, productcomment_title, buttons);
         } else {
-          $('#new_comment_form_error ul').html('');
+          $error.find('ul').html('');
           $.each(data.errors, function(index, value) {
-            $('#new_comment_form_error ul').append('<li>' + value + '</li>');
+            $error.find('ul').append('<li>' + value + '</li>');
           });
-          $('#new_comment_form_error').slideDown('slow');
+          $error.show();
         }
       }
     });

themes/community-theme-16/js/modules/productcomments/js/products-comparison.js

@@ -1,41 +1,3 @@
-$(document).ready(function() {
-  $('input.star').rating();
-  $('.auto-submit-star').rating();
-  $('a.cluetip').cluetip({
-    local: true,
-    cursor: 'pointer',
-    cluetipClass: 'comparison_comments',
-    dropShadow: false,
-    dropShadowSteps: 0,
-    showTitle: false,
-    tracking: true,
-    sticky: false,
-    mouseOutClose: true,
-    width: 450,
-    fx: {
-      open:       'fadeIn',
-      openSpeed:  'fast'
-    }
-  }).css('opacity', 0.8);
-
-  $('.comparison_infos a').each(function() {
-    var id_product_comment = parseInt($(this).data('id-product-comment'));
-    if (id_product_comment) {
-      $(this).click(function(e) {
-        e.preventDefault();
-      });
-      var htmlContent = $('#comments_' + id_product_comment).html();
-      $(this).popover({
-        placement: 'bottom', //placement of the popover. also can use top, bottom, left or right
-        title: false, //this is the top title bar of the popover. add some basic css
-        html: 'true', //needed to show html of course
-        content: htmlContent  //this is the content of the html box. add the image here or anything you want really.
-      });
-    }
-  });
+$(function() {
+  $('input.star, .auto-submit-star').rating();
 });
-
-function closeCommentForm() {
-  $('#sendComment').slideUp('fast');
-  $('input#addCommentButton').fadeIn('slow');
-}

themes/community-theme-16/modules/loyalty/views/templates/hook/product.tpl

@@ -13,7 +13,7 @@
     {/if}
   {/if}
 </p>
-<br class="clear" />
+
 {addJsDef point_rate=$point_rate}
 {addJsDef point_value=$point_value}
 {addJsDef points_in_cart=$points_in_cart}

themes/community-theme-16/modules/productcomments/productcomments-extra.tpl

@@ -1,11 +1,11 @@
 {if (!$content_only && (($nbComments == 0 && $too_early == false && ($is_logged || $allow_guests)) || ($nbComments != 0)))}
-  <div id="product_comments_block_extra" class="no-print" itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating">
+  <div id="product_comments_block_extra" class="hidden-print" itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating">
     {if $nbComments != 0}
       <div class="comments_note clearfix">
         <span>{l s='Rating' mod='productcomments'}&nbsp;</span>
         <div class="star_content clearfix">
           {section name="i" start=0 loop=5 step=1}
-            {if $averageTotal le $smarty.section.i.index}
+            {if $averageTotal <= $smarty.section.i.index}
               <div class="star"></div>
             {else}
               <div class="star star_on"></div>
@@ -15,25 +15,24 @@
           <meta itemprop="ratingValue" content = "{if isset($ratings.avg)}{$ratings.avg|round:1|escape:'html':'UTF-8'}{else}{$averageTotal|round:1|escape:'html':'UTF-8'}{/if}" />
           <meta itemprop="bestRating" content = "5" />
         </div>
-      </div> <!-- .comments_note -->
+      </div>
     {/if}
 
-    <ul class="comments_advices">
+    <ul class="list-unstyled comments_advices">
       {if $nbComments != 0}
         <li>
-          <a href="#idTab5" class="reviews">
-            {l s='Read reviews' mod='productcomments'} (<span itemprop="reviewCount">{$nbComments}</span>)
+          <a href="#product-reviews" class="reviews">
+            <i class="icon icon-fw icon-comment"></i> {l s='Read reviews' mod='productcomments'} (<span itemprop="reviewCount">{$nbComments}</span>)
           </a>
         </li>
       {/if}
-      {if ($too_early == false AND ($is_logged OR $allow_guests))}
+      {if ($too_early == false && ($is_logged || $allow_guests))}
         <li>
           <a class="open-comment-form" href="#new_comment_form">
-            {l s='Write a review' mod='productcomments'}
+            <i class="icon icon-fw icon-pencil"></i> {l s='Write a review' mod='productcomments'}
           </a>
         </li>
       {/if}
     </ul>
   </div>
 {/if}
-<!--  /Module ProductComments -->