Рейтинг звёздочками в товаре (Решено)
-
product.tpl
{$product->rating|string_format:"%.1f"} (голосов {$product->votes|string_format:"%.0f"})
ajax-rater.js
$.fn.rater = function (options) {
var opts = $.extend({}, $.fn.rater.defaults, options);
return this.each(function () {
var $this = $(this);
var $on = $this.find('.rater-starsOn');
var $off = $this.find('.rater-starsOff');
opts.size = $on.height();
if (opts.rating == undefined) opts.rating = $on.width() / opts.size;
if (opts.id == undefined) opts.id = $this.attr('id');
$off.mousemove(function (e) {
var left = e.clientX - $off.offset().left;
var width = $off.width() - ($off.width() - left);
width = Math.ceil(width / (opts.size / opts.step)) * opts.size / opts.step;
$on.width(width);
}).hover(function (e) { $on.addClass('rater-starsHover'); }, function (e) {
$on.removeClass('rater-starsHover'); $on.width(opts.rating * opts.size);
}).click(function (e) {
var r = Math.round($on.width() / $off.width() * (opts.units * opts.step)) / opts.step;
$off.unbind('click').unbind('mousemove').unbind('mouseenter').unbind('mouseleave');
$off.css('cursor', 'default'); $on.css('cursor', 'default');
$.fn.rater.rate($this, opts, r);
}).css('cursor', 'pointer'); $on.css('cursor', 'pointer');
});
};
$.fn.rater.defaults = {
postHref: location.href,
units: 5,
step: 1
};
$.fn.rater.rate = function ($this, opts, rating) {
var $on = $this.find('.rater-starsOn');
var $off = $this.find('.rater-starsOff');
$off.fadeTo(600, 0.4, function () {
$.ajax({
url: opts.postHref,
type: "POST",
data: 'id=' + opts.id + '&rating=' + rating,
complete: function (req) {
if (req.status == 200) { //success
opts.rating = parseFloat(req.responseText);
if (opts.rating > 0) {
opts.rating = parseFloat(req.responseText);
$off.fadeTo(200, 0.1, function () {
$on.removeClass('rater-starsHover').width(opts.rating * opts.size);
var $count = $this.find('.rater-rateCount');
$count.text(parseInt($count.text()) + 1);
$this.find('.rater-rating').text(opts.rating.toFixed(1));
$off.fadeTo(200, 1);
});
//alert('Спасибо! Ваш голос учтен.');
}
else
if (opts.rating == -1) {
$off.fadeTo(200, 0.6, function () {
$this.find('.test-text').text('Вы уже голосовали!');
});
//alert('Вы уже голосовали за данный товар!');
}
else {
$off.fadeTo(200, 0.6, function () {
$this.find('.test-text').text('Вы уже голосовали!');
});
//alert('Вы уже голосовали за данный товар!');
}
} else { //failure
alert(req.responseText);
$on.removeClass('rater-starsHover').width(opts.rating * opts.size);
$this.rater(opts);
$off.fadeTo(2200, 1);
}
}
});
});
};
стили
.testRater{margin-bottom:20px;}
.rater span {vertical-align:middle;font-size:16px;}
.rater-rating {margin-top:5px;}
.rater-starsOff, .rater-starsOn {display:inline-block; height:32px; background:url(../images/stars.gif) repeat-x 0 0px;}
.rater-starsOn {display:block; max-width:160px; top:0; background-position: 0 -32px;}
.rater-starsHover {background-position: 0 -64px!important;}
Сама картинка
http://i.piccy.info/i7/d85050344b9d7acbb96e7da1ed8a9cd8/1-5-3951/3814500/stars.gif
Выглядит кошерно http://kiev-mod.ho.ua/products/samsung_s7070_diva/ -
http://upload.com.ua/get/903046009/создание rating.rar
ссылка не работает,
пожалуйста перезалейте архив -
Просьба перезалить на другой обменник!!
-
А лучше бы админу форума подумать над возможностью прикреплять файлы к постам! Это ж несерьезно - по обменникам бегать, которые то работают, то нет.
-
Кто нить откликнитесь пожалуйста....
Перезалейте или бросьте на почту...(в профиле) -
Вот мой вариант реализации рейтинга:
http://rghost.ru/36533410
http://narod.ru/disk/40815815001/simplacms2_ajax_star_rating.rar.html
http://www.mediafire.com/?fv4ke1nipdkut46 -
Noxter спасибо!!!
-
Noxter +1
-
Всегда пожалуйста=)
-
Спасибо, очень полезная вещь.
-
только с ошибками и неточностями.
я не программист, но очевидное для меня исправил.
но без толку, так и не заработало. =( -
Если у всех работает, а у вас нет, так может это от того, что не стоило исправлять?))
-
Была замечена ошибка в моей статье.
Править нужно файл product.tpl а не products.tpl, прописал ошибку машинально. -
Все сделано по инструкции, не работает... (((
-
theme}/js/project.js"> это в тегах ЛИТЕРАЛ? Посмотрите, как в код страницы выводится))
-
theme}/js/project.js">
а что не так
-
Разобрался, спс Noxter, кину на веб мани монетку, наверно это будет лучше чем большое спасибо....
-
Danya спасибо за замеченный баг!
Можно еще сделать так:
{literal}
<script src=\"design/{/literal}{$settings->theme}{literal}/js/project.js\"></script>
<script type=\"text/javascript\">
$(function() {
$('.testRater').rater({ postHref: 'ajax/rating.php' });
});
</script>
{/literal}
или так
<script src=\"design/{$settings->theme}/js/project.js\"></script>
{literal}
<script type=\"text/javascript\">
$(function() {
$('.testRater').rater({ postHref: 'ajax/rating.php' });
});
</script>
{/literal} -
На мой взгляд рейтинг должен выводиться не только в карточке товара, но также и в категории и таким образом, чтобы оценка, поставленная в карточке товара находила свое отображение в категории, но как это реализовать - может кто подскажет?
Также интересует как реализовать сортировку по рейтингу - подскажите?
Новая дискуссия
Добро пожаловать
Похоже, что Вы здесь впервые. Если хотите поучаствовать, нажмите на одну из этих кнопок!
В этой дискуссии
- arsko 23 Январь
- Danya 12 Март
- div 1 Февраль
- kors 10 Февраль
- Kosjak76 3 Март
- Kostopashka 21 Март
- Kpoxa 23 Январь
- Kurbakov 17 Февраль
- mart 4 Март
- misterk 15 Февраль
- Moles 8 Май
- nightmaar 16 Февраль
- Noxter 3 Март
- nwnet 23 Январь
- olejka 16 Февраль
- osben 4 Май
- putnik 27 Март
- ripiko 21 Март
- ruslan 25 Март
- termint 6 Февраль
- vlavr 15 Февраль
- weranda 11 Март
- zhenyaweb 3 Февраль