/**
 * consumer/item/review.js
 * 
 * 商品詳細ページにおける感想部分
 *
 */

articleReviews = Class.create(
  Mds,
  {
    initialize: function (target) {
      this.targetElement = target;
    },

    getData: function() {
      // 検索件数
      this.limit = 5;
      // ページ数
      this.page = 0;
      this.gender = {
        '1' : '男性',
        '2' : '女性'
      };
      // 検索順序
      this.order = {
        'id_d' : "新しい順",
        'id_a' : "古い順",
        'rating_d' : "評価が高い順",
        'rating_a' : "評価が低い順"
      };
      // div の高さ
      this.divHeight = "";
      // トータル件数があるかどうか
      this.totalFlag = false;
      // トータル件数
      this.total = _variables.total;
    },

    // 改行を <br> に変換
    nl2br: function(str) {
      return str.nl2br(false);
    },

    // 詳しく見るボタン
    openDetail: function (e, id, review) {
      $('review_td_' + id).innerHTML = review;
    },

    navigationObserve: function() {
      $$('[name="id_d"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              this.page = 0;
              this.search('id_d', true);
            }.bind(this)
          );
        }.bind(this)
      );

      $$('[name="id_a"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              this.page = 0;
              this.search('id_a', true);
            }.bind(this)
          );
        }.bind(this)
      );

      $$('[name="rating_d"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              this.page = 0;
              this.search('rating_d', true);
            }.bind(this)
          );
        }.bind(this)
      );

      $$('[name="rating_a"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              this.page = 0;
              this.search('rating_a', true);
            }.bind(this)
          );
        }.bind(this)
      );

      $$('[name="prev"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              if (this.page > 0) {
                this.page--;
                this.search($('articles_review').down('input[name="order"]').getValue(), false);
              }
            }.bind(this)
          );
        }.bind(this)
      );

      $$('[name="next"]').each(
        function (a) {
          a.observe(
            'click',
            function() {
              if (this.total > (this.page + 1) * this.limit) {
                this.page++;
                this.search($('articles_review').down('input[name="order"]').getValue(), false);
              }
            }.bind(this)
          );
        }.bind(this)
      );
    },

    // リロード 時にデフォルトに戻す
    defaultOrder: function() {
      $('articles_review').down('input[name="page"]').setValue(0);
      $('articles_review').down('input[name="order"]').setValue('id_d');

    },

    /**
     * 検索する
     * @param string order 検索順
     */
    search: function (order, load) {
      if (load == true) {
        $('reviews').update(this.loading.create());
        $('now-loading').setStyle({paddingTop: '40px'});
        if (this.divHeight) {
          $('now-loading').setStyle({height: (this.divHeight - 40) + 'px'});
        }
      }
      $('articles_review').down('input[name="page"]').setValue(this.page);
      $('articles_review').down('input[name="order"]').setValue(order);
      mds.form.request(
        $('articles_review'),
        function (response) {
          var result = response.responseJSON;
          if (!result) {
            $('reviews').update('<p class="no-review red">データが取得出来ませんでした<br>ページを読み込みなおして下さい</p>');
          } else if (result.total == false) {
            $('reviews').update('<p class="no-review">この商品に対する感想はまだありません</p>');
          } else {
            if (this.totalFlag == false) {
              this.totalFlag = true;
            }
            this.show(result.article_reviews, result.total, order);
          }
        }.bind(this)
      );
    },

    /**
     * 結果の表示
     *
     * @param Array reviews 感想の配列
     * @param integer total 総件数
     * @param string order 検索順
     */
    show : function (reviews, total, order) {
      // 各エレメントの設定
      var div = new Element('div');
      var div_navigation = new Element('div');
      var p_order = new Element('p');
      var p_total = new Element('p');
      var table = new Element('table', {"cellpadding":0, "cellspacing":0, "border":0});
      var tbody = new Element('tbody');
      var p_tag = new Element('p');
      var div_clear = new Element('div');
      div_navigation.addClassName('navigation');
      div_navigation.addClassName('block-center');
      p_order.addClassName('review-order');
      p_order.addClassName('inline-left');
      p_total.addClassName('review-total');
      p_total.addClassName('block-center');
      p_order.addClassName('float-left');
      div.addClassName('review-box');
      table.addClassName('review-table');
      table.addClassName('block-center');
      p_tag.addClassName('move');
      p_tag.addClassName('inline-right');
      p_tag.addClassName('float-right');
      div_clear.addClassName('clear-both');


      // 感想の表示部分のテーブル構築
      reviews.each(
        function (review,index) {
          var tr = [
            new Element('tr'),
            new Element('tr')
          ]
          if(index%2 == 0){
            tr[0].addClassName('background-color-light');
            tr[1].addClassName('background-color-light');
          }
          var icon_report_img = new Element('img');
          icon_report_img.writeAttribute({src: '/images/article/icon-report.gif'});
          icon_report_img.addClassName('inline-middle');

          var a_allege = new Element('a', {"href": "/articles/review/allege?article_review_id=" + review.id + '&article_id=' + _variables.article_id + '&shop_id=' + _variables.shop_id});
          a_allege.insert('報告する');
          var td = {
            rating: new Element('td'),
            date: new Element('td'),
            name: new Element('td'),
            allege: new Element('td'),
            review: new Element('td', {"colspan": 4})
          };
          td.rating.addClassName('inline-left');
          td.rating.addClassName('star');
          td.rating.addClassName('font10');
          td.date.addClassName('inline-left');
          td.date.addClassName('date');
          td.name.addClassName('inline-left');
          td.name.addClassName('name');
          td.allege.addClassName('inline-right');
          td.allege.addClassName('allege');
          td.review.addClassName('inline-left');
          td.review.addClassName('td-review');
          td.review.addClassName('border-bottom');
          td.review.addClassName('font14');
          for (i = 0; review.rating > i; i++) {
            td.rating.insert('★');
          }
          td.date.update(review.created_at.gsub(/-/, "/"));
          if (review.aetas == 0) {
            td.name.insert('by&nbsp;' + review.name + '&nbsp;(10歳未満&nbsp;' + this.gender[review.gender] + ')');
          } else if (review.aetas == 100) {
            td.name.insert('by&nbsp;' + review.name + '&nbsp;(' + review.aetas + '歳以上&nbsp;' + this.gender[review.gender] + ')');
          } else {
            td.name.insert('by&nbsp;' + review.name + '&nbsp;(' + review.aetas + '代&nbsp;' + this.gender[review.gender] + ')');
          }
          td.allege.insert({bottom: icon_report_img});
          td.allege.insert(a_allege);
          if (review.review.length > 100) {
            td.review.update(this.nl2br(review.review.substr(0, 100)) + '...&nbsp;');
            td.review.writeAttribute('id', 'review_td_' + review.id);
            var a_detail = new Element('a', {"href": "javascript:void(0)"});
            a_detail.writeAttribute('id', 'review_detail_' + review.id);
            a_detail.insert('&gt&gt;全部読む');
            a_detail.observe('click', this.openDetail.bindAsEventListener(this, review.id, this.nl2br(review.review)));
            td.review.insert({bottom: a_detail});
          } else {
            td.review.update(this.nl2br(review.review));
          }
          tr[0].insert({bottom: td.rating});
          tr[0].insert({bottom: td.name});
          tr[0].insert({bottom: td.date});
          tr[0].insert({bottom: td.allege});
          tr[1].insert({bottom: td.review});
          tbody.insert({bottom: tr[0]});
          if (review.group_id != 0) {
            var tr_item_name = new Element('tr');
          if(index%2 == 0){
            tr_item_name.addClassName('background-color-light');
          }
            var td_item_name = new Element('td', {"colspan": 4});
            td_item_name.addClassName('inline-left');
            td_item_name.addClassName('item-name-text');
            td_item_name.update('<a href="/article/' + _variables.shop_id + '/' + review.article_id + '">購入した商品:&nbsp;' + review.article_name + '</a>');
            tr_item_name.insert(td_item_name);
            tbody.insert({bottom: tr_item_name});
          }
          tbody.insert({bottom: tr[1]});
        }.bind(this)
      );
      table.insert({bottom: tbody});

      // 検索順の設定
      var a_order_id_d = new Element('a');
      var a_order_id_a = new Element('a');
      var a_order_rating_d = new Element('a');
      var a_order_rating_a = new Element('a');
      if (order != 'id_d') {
        a_order_id_d.writeAttribute({href: '#review'});
        a_order_id_d.writeAttribute({name: 'id_d'});
      }
      if (order != 'id_a') {
        a_order_id_a.writeAttribute({href: '#review'});
        a_order_id_a.writeAttribute({name: 'id_a'});
      }
      if (order != 'rating_d') {
        a_order_rating_d.writeAttribute({href: '#review'});
        a_order_rating_d.writeAttribute({name: 'rating_d'});
      }
      if (order != 'rating_a') {
        a_order_rating_a.writeAttribute({href: '#review'});
        a_order_rating_a.writeAttribute({name: 'rating_a'});
      }
      a_order_id_d.insert('新しい順');
      a_order_id_a.insert('古い順');
      a_order_rating_d.insert('評価が高い順');
      a_order_rating_a.insert('評価が低い順');
      switch (order) {
        case 'id_d':
          a_order_id_d.addClassName('no-link');
          break;
        case 'id_a':
          a_order_id_a.addClassName('no-link');
          break;
        case 'rating_d':
          a_order_rating_d.addClassName('no-link');
          break;
        case 'rating_a':
          a_order_rating_a.addClassName('no-link');
          break;
      }
      var icon_sorts_img = new Element('img');
      icon_sorts_img.writeAttribute({src: '/images/article/icon-sort.gif'});
      icon_sorts_img.addClassName('inline-middle');
      p_order.insert({bottom: icon_sorts_img});
      p_order.insert({bottom: a_order_id_d});
      p_order.insert({bottom: a_order_id_d});
      p_order.insert('&nbsp;|&nbsp;');
      p_order.insert({bottom: a_order_id_a});
      p_order.insert('&nbsp;|&nbsp;');
      p_order.insert({bottom: a_order_rating_d});
      p_order.insert('&nbsp;|&nbsp;');
      p_order.insert({bottom: a_order_rating_a});
      div_navigation.insert({bottom: p_order});



      // トータルと表示件数のセット
      p_tag.insert(total + '&nbsp;件中&nbsp;&nbsp;');
      p_tag.insert((this.page * this.limit) + 1);
      p_tag.insert('&nbsp;-&nbsp;');
      if (total < (this.page + 1) * this.limit ) {
        p_tag.insert(total);
      } else {
        p_tag.insert((this.page + 1) * this.limit);
      }
      p_tag.insert('件を');
      if (this.order[$('articles_review').down('input[name="order"]').getValue()]) {
        p_tag.insert(this.order[$('articles_review').down('input[name="order"]').getValue()]);
      } else {
        p_tag.insert('新しい順');
      }
      p_tag.insert('で表示中')


      // 進む、戻るをセット
      if (total > 5) {
        var a_prev = new Element('a');
        if (this.page != 0) {
          a_prev.writeAttribute({href: '#review'})
          a_prev.writeAttribute({name: 'prev'});
        } else {
          a_prev.addClassName('no-link');
        }
        a_prev.update('&lt;&lt;&nbsp;前の5件');
        p_tag.insert({bottom: a_prev});
        p_tag.insert('&nbsp;|&nbsp;');
        var a_next = new Element('a');
        if (total > (this.page + 1) * this.limit) {
          a_next.writeAttribute({href: '#review'});
          a_next.writeAttribute({name: 'next'});
        } else {
          a_next.addClassName('no-link');
        }
        a_next.update('次の5件&nbsp;&gt;&gt;');
        p_tag.insert({bottom: a_next});
        div_navigation.insert({bottom: p_tag});
      }
      div_navigation.insert({bottom: div_clear});

      // 大枠の div に中身をセット
    
      div.insert({bottom: div_navigation.cloneNode(true)});
      div.insert({bottom: table});
      div.insert({bottom: div_navigation.cloneNode(true)});
      $('reviews').update(div);
      this.divHeight = Element.getHeight('reviews');

      // cloneNode する前だと observe が消えてしまうので、後から observe する
      this.total = total;
      this.navigationObserve();
    }
  }
);

var review = new articleReviews();
Event.observe(window, "load", function () {
  if ($('articles_review')) {
    review.getData();
    review.navigationObserve();
    review.defaultOrder();
  }
}, false);