Rating room

Gemfile

@@ -32,6 +32,7 @@ gem "jquery-ui-rails"
 gem "bootstrap-datepicker-rails", "~> 1.8", ">= 1.8.0.1"
 gem "country_select", "~> 4.0"
 gem "jquery-validation-rails"
+gem "ratyrate"
 
 group :development, :test do
   gem "byebug", platforms: %i[mri mingw x64_mingw]

Gemfile.lock

@@ -249,6 +249,7 @@ GEM
       activesupport (>= 5.0)
       i18n
       polyamorous (= 2.3.0)
+    ratyrate (1.2.2.alpha)
     rb-fsevent (0.10.3)
     rb-inotify (0.10.0)
       ffi (~> 1.0)
@@ -386,6 +387,7 @@ DEPENDENCIES
   puma (~> 3.11)
   rails (~> 5.2.3)
   ransack
+  ratyrate
   rspec-rails (~> 3.8)
   rubocop (~> 0.74.0)
   sass-rails (~> 5.0)

app/assets/javascripts/application.js

@@ -13,6 +13,8 @@
 //= require bootstrap-datepicker
 //= require jquery.validate
 //= require jquery.validate.additional-methods
+//= require jquery.raty
+//= require ratyrate
 
 /*global toastr*/
 toastr.options = {

app/assets/javascripts/jquery.raty.js

@@ -3,12 +3,13 @@
  *
  * The MIT License
  *
- * author:  Washington Botelho
- * github:  wbotelhos/raty
- * version: 2.9.0
+ * @author  : Washington Botelho
+ * @doc     : http://wbotelhos.com/raty
+ * @version : 2.7.0
  *
  */
 
+;
 (function($) {
   'use strict';
 
@@ -19,7 +20,7 @@
 
         methods.destroy.call(this.self);
 
-        this.opt = $.extend(true, {}, $.fn.raty.defaults, options, this.self.data());
+        this.opt = $.extend(true, {}, $.fn.raty.defaults, options);
 
         methods._adjustCallback.call(this);
         methods._adjustNumber.call(this);
@@ -58,7 +59,7 @@
     },
 
     _adjustCallback: function() {
-      var options = ['number', 'readOnly', 'score', 'scoreName', 'target', 'path'];
+      var options = ['number', 'readOnly', 'score', 'scoreName', 'target'];
 
       for (var i = 0; i < options.length; i++) {
         if (typeof this.opt[options[i]] === 'function') {
@@ -234,9 +235,8 @@
     },
 
     _bindOver: function() {
-      var
-        that   = this,
-        action = that.opt.half ? 'mousemove.raty' : 'mouseover.raty';
+      var that   = this,
+          action = that.opt.half ? 'mousemove.raty' : 'mouseover.raty';
 
       that.stars.on(action, function(evt) {
         var score = methods._getScoreByPosition.call(that, evt, this);
@@ -288,9 +288,8 @@
     },
 
     _createCancel: function() {
-      var
-        icon   = this.opt.path + this.opt.cancelOff,
-        cancel = $('<' + this.opt.starType + ' />', { title: this.opt.cancelHint, 'class': this.opt.cancelClass });
+      var icon   = this.opt.path + this.opt.cancelOff,
+          cancel = $('<' + this.opt.starType + ' />', { title: this.opt.cancelHint, 'class': this.opt.cancelClass });
 
       if (this.opt.starType === 'img') {
         cancel.attr({ src: icon, alt: 'x' });
@@ -462,16 +461,15 @@
       return this.opt.score && this.opt.score >= i ? 'starOn' : 'starOff';
     },
 
-    _resetTitle: function() {
+    _resetTitle: function(star) {
       for (var i = 0; i < this.opt.number; i++) {
         this.stars[i].title = methods._getHint.call(this, i + 1);
       }
     },
 
-    _roundHalfScore: function(score) {
-      var
-        integer = parseInt(score, 10),
-        decimal = methods._getFirstDecimal.call(this, score);
+     _roundHalfScore: function(score) {
+      var integer = parseInt(score, 10),
+          decimal = methods._getFirstDecimal.call(this, score);
 
       if (decimal !== 0) {
         decimal = decimal > 5 ? 1 : 0.5;
@@ -483,16 +481,16 @@
     _roundStars: function(score, evt) {
       var
         decimal = (score % 1).toFixed(2),
-        name ;
+        name    ;
 
       if (evt || this.move) {
         name = decimal > 0.5 ? 'starOn' : 'starHalf';
-      } else if (decimal > this.opt.round.down) { // Up: [x.76 .. x.99]
+      } else if (decimal > this.opt.round.down) {               // Up:   [x.76 .. x.99]
         name = 'starOn';
 
         if (this.opt.halfShow && decimal < this.opt.round.up) { // Half: [x.26 .. x.75]
           name = 'starHalf';
-        } else if (decimal < this.opt.round.full) { // Down: [x.00 .. x.5]
+        } else if (decimal < this.opt.round.full) {             // Down: [x.00 .. x.5]
           name = 'starOff';
         }
       }
@@ -503,7 +501,7 @@
           star = this.stars[Math.ceil(score) - 1];
 
         methods._setIcon.call(this, star, icon);
-      } // Full down: [x.00 .. x.25]
+      }                                                         // Full down: [x.00 .. x.25]
     },
 
     _setIcon: function(star, icon) {
@@ -615,9 +613,8 @@
 
     destroy: function() {
       return this.each(function() {
-        var
-          self = $(this),
-          raw  = self.data('raw');
+        var self = $(this),
+            raw  = self.data('raw');
 
         if (raw) {
           self.off('.raty').empty().css({ cursor: raw.style.cursor }).removeData('readonly');
@@ -628,9 +625,8 @@
     },
 
     getScore: function() {
-      var
-        score = [],
-        value ;
+      var score = [],
+          value ;
 
       this.each(function() {
         value = this.score.val();
@@ -673,7 +669,7 @@
 
         if (self.data('readonly') !== readonly) {
           if (readonly) {
-            self.off('.raty').children(this.opt.starType).off('.raty');
+            self.off('.raty').children('img').off('.raty');
 
             methods._lock.call(this);
           } else {
@@ -725,39 +721,40 @@
   };
 
   $.fn.raty.defaults = {
-    cancel:       false,
-    cancelClass:  'raty-cancel',
-    cancelHint:   'Cancel this rating!',
-    cancelOff:    'cancel-off.png',
-    cancelOn:     'cancel-on.png',
-    cancelPlace:  'left',
-    click:        undefined,
-    half:         false,
-    halfShow:     true,
-    hints:        ['bad', 'poor', 'regular', 'good', 'gorgeous'],
-    iconRange:    undefined,
-    mouseout:     undefined,
-    mouseover:    undefined,
-    noRatedMsg:   'Not rated yet!',
-    number:       5,
-    numberMax:    20,
-    path:         undefined,
-    precision:    false,
-    readOnly:     false,
-    round:        { down: 0.25, full: 0.6, up: 0.76 },
-    score:        undefined,
-    scoreName:    'score',
-    single:       false,
-    space:        true,
-    starHalf:     'star-half.png',
-    starOff:      'star-off.png',
-    starOn:       'star-on.png',
-    starType:     'img',
-    target:       undefined,
-    targetFormat: '{score}',
-    targetKeep:   false,
-    targetScore:  undefined,
-    targetText:   '',
-    targetType:   'hint'
+    cancel       : false,
+    cancelClass  : 'raty-cancel',
+    cancelHint   : 'Cancel this rating!',
+    cancelOff    : 'cancel-off.png',
+    cancelOn     : 'cancel-on.png',
+    cancelPlace  : 'left',
+    click        : undefined,
+    half         : false,
+    halfShow     : true,
+    hints        : ['bad', 'poor', 'regular', 'good', 'gorgeous'],
+    iconRange    : undefined,
+    mouseout     : undefined,
+    mouseover    : undefined,
+    noRatedMsg   : 'Not rated yet!',
+    number       : 5,
+    numberMax    : 20,
+    path         : undefined,
+    precision    : false,
+    readOnly     : false,
+    round        : { down: 0.25, full: 0.6, up: 0.76 },
+    score        : undefined,
+    scoreName    : 'score',
+    single       : false,
+    space        : true,
+    starHalf     : 'star-half.png',
+    starOff      : 'star-off.png',
+    starOn       : 'star-on.png',
+    starType     : 'img',
+    target       : undefined,
+    targetFormat : '{score}',
+    targetKeep   : false,
+    targetScore  : undefined,
+    targetText   : '',
+    targetType   : 'hint'
   };
+
 })(jQuery);

app/assets/javascripts/ratyrate.js.erb

@@ -0,0 +1,62 @@
+$.fn.raty.defaults.half = false;
+$.fn.raty.defaults.halfShow = true;
+$.fn.raty.defaults.path = "/assets";
+$.fn.raty.defaults.cancel = false;
+
+$(function(){
+  $(".star").each(function() {
+    var $readonly = ($(this).attr('data-readonly') == 'true');
+    var $half     = ($(this).attr('data-enable-half') == 'true');
+    var $halfShow = ($(this).attr('data-half-show') == 'true');
+    var $single   = ($(this).attr('data-single') == 'true');
+    $(this).raty({
+      score: function() {
+        return $(this).attr('data-rating')
+      },
+      number: function() {
+        return $(this).attr('data-star-count')
+      },
+      half:        $half,
+      halfShow:    $halfShow,
+      single:      $single,
+      path:        $(this).attr('data-star-path'),
+      starOn:      $(this).attr('data-star-on'),
+      starOff:     $(this).attr('data-star-off'),
+      starHalf:    $(this).attr('data-star-half'),
+      cancel:      $(this).attr('data-cancel'),
+      cancelPlace: $(this).attr('data-cancel-place'),
+      cancelHint:  $(this).attr('data-cancel-hint'),
+      cancelOn:    $(this).attr('data-cancel-on'),
+      cancelOff:   $(this).attr('data-cancel-off'),
+      noRatedMsg:  $(this).attr('data-no-rated-message'),
+      round:       $(this).attr('data-round'),
+      space:       $(this).attr('data-space'),
+      target:      $(this).attr('data-target'),
+      targetText:  $(this).attr('data-target-text'),
+      targetType:  $(this).attr('data-target-type'),
+      targetFormat: $(this).attr('data-target-format'),
+      targetScoret: $(this).attr('data-target-score'),
+      readOnly: $readonly,
+      click: function(score, evt) {
+        var _this = this;
+        if (score == null) { score = 0; }
+        $.post('<%= Rails.application.class.routes.url_helpers.rate_path %>',
+        {
+          score: score,
+          dimension: $(this).attr('data-dimension'),
+          id: $(this).attr('data-id'),
+          klass: $(this).attr('data-classname')
+        },
+        function(data) {
+          if(data) {
+            // success code goes here ...
+
+            if ($(_this).attr('data-disable-after-rate') == 'true') {
+              $(_this).raty('set', { readOnly: true, score: score });
+            }
+          }
+        });
+      }
+    });
+  });
+});

app/controllers/comments_controller.rb

@@ -30,7 +30,7 @@ def destroy
   private
 
   def comment_params
-    params.require(:comment).permit :rate, :content
+    params.require(:comment).permit :content
   end
 
   def load_room

app/controllers/rater_controller.rb

@@ -0,0 +1,14 @@
+class RaterController < ApplicationController
+  skip_before_action :verify_authenticity_token
+
+  def create
+    if user_signed_in?
+      obj = params[:klass].classify.constantize.find(params[:id])
+      obj.rate params[:score].to_f, current_user, params[:dimension]
+
+      render :json => true
+    else
+      render :json => false
+    end
+  end
+end

app/controllers/rooms_controller.rb

@@ -19,7 +19,6 @@ def show
     rooms.each{|rooms| @rooms << Room.find(rooms)}
     @comment = @room.comments.build
     @comments = @room.comments.newest
-    @average_comment = @room.comments.average(:rate) if @room.comments.present?
   end
 
   def create

app/models/average_cache.rb

@@ -0,0 +1,4 @@
+class AverageCache < ActiveRecord::Base
+  belongs_to :rater, :class_name => "User"
+  belongs_to :rateable, :polymorphic => true
+end

app/models/overall_average.rb

@@ -0,0 +1,4 @@
+class OverallAverage < ActiveRecord::Base
+  belongs_to :rateable, :polymorphic => true
+end
+

app/models/rate.rb

@@ -0,0 +1,7 @@
+class Rate < ActiveRecord::Base
+  belongs_to :rater, :class_name => "User"
+  belongs_to :rateable, :polymorphic => true
+
+  #attr_accessible :rate, :dimension
+
+end

app/models/rating_cache.rb

@@ -0,0 +1,3 @@
+class RatingCache < ActiveRecord::Base
+  belongs_to :cacheable, :polymorphic => true
+end

app/models/room.rb

@@ -28,6 +28,7 @@ class Room < ApplicationRecord
   enum type_room: { Nhà_Riêng: 0, Căn_Hộ: 1 }
 
   accepts_nested_attributes_for :room_images, allow_destroy: true
+  ratyrate_rateable "rating_room"
 
   delegate :name, to: :area, prefix: true
   delegate :name, to: :favorite_space, prefix: true

app/models/user.rb

@@ -13,6 +13,8 @@ class User < ApplicationRecord
   validates :type, presence: true
   mount_uploader :avatar, AvatarUploader
 
+  ratyrate_rater
+
   def timeout_in
     Settings.time_out.minutes
   end

app/views/comments/_comment.html.slim

@@ -2,7 +2,6 @@ div[id="comment_#{comment.id}"]
   div
     b = comment.user.name
     | :
-  .review-rating [id="rate_#{comment.id}" data-score="#{comment.rate}"]
   .review-comment
     = comment.content
   .small = time_ago_in_words(comment.created_at)