{% extends "base/headermenu.html" %}
{% load i18n %}

{% block contents %}

  <p><br></p>

  <table class="pageheader">
    <tr>
      <td align="left">
        {% trans "Category" %}: {{form.instance.category|escape}}
      </td>
      <td align="right">
      </td>
    </tr>
</table>
{% if msg %}
<p><br></p>
  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content">
          <p>
            <h3>{{ msg }}</h3>
          </p>
        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>
<p><br></p>
{% endif %}
{% if form.instance.is_complete %}
<p><br></p>

  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content">
          <p>
            <h3>このオークションは終了しています。</h3>
          </p>
  {% if is_bidder %}
          <p>
            <h2 style="color:red;">おめでとうございます！あなたが落札しました。</h2>
          </p>
  {% endif %}
        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>

<p><br></p>
{% endif %}

<p><br></p>

  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content">
          <p>
            <h3>{% trans "Item Detail" %}</h3>

            <p>

              {% if user %}
                {% if not form.instance.is_complete %}
              <form action="{% url djanction.mypage.views.watchlist %}" method="post">
                <input type="button" value="ウォッチリストに追加" onclick="javascript:this.form.submit();"/>
                <input type="hidden" name="item" value="{{ form.instance.id }}">
                <input type="hidden" name="user" value="{{ user.id }}">
              </form>
               {% endif%}
              {% endif %}

              <table width="100%" border="0" collapse="0" cellspacing="10">
                <tr>
                  <th width="100" align="left">{% trans "item name" %}</th>
                  <td>{{form.instance.item_name|escape}}</td>
                </tr>
                <tr>
                  <th width="100" align="left">{% trans "item comment" %}</th><td bgcolor="#EFEFEF">{{form.instance.comment|escape|linebreaks}}</td>
                </tr>
	          {% for item in add_comment_list %}
                <tr>
                  <th width="100" align="left">{% trans "add comment" %}</th><td bgcolor="#EFEFEF">{{item.mod_date|date:"Y年m月d日(D) H:i:s"}}<br/>{{item.comment|escape}}</td>
                </tr>
	          {% endfor %}
                <tr>
                  <th width="100" align="left">{% trans "user id" %}</th>
                  <td><a href="{% url top_page %}?user_id={{form.instance.user.id}}">{{form.instance.user}}</a>&nbsp;
                      <a href="{% url djanction.rating.views.list_feedback form.instance.user.id 1 %}">({{form.instance.user.rank}})</a></td>
                </tr>
                <tr>
                  <th width="100" align="left">{% trans "end date" %}</th>
                  <td>{{form.instance.end_date|date:"Y年m月d日(D) H:i:s"}}</td>
                </tr>
                <tr>
                  <th width="100" align="left">{% trans "current price" %}</th>
                  <td><b>{{form.instance.current_price}}{% trans "$"%}</b></td>
                </tr>
{% if not form.instance.is_complete %}
                <tr>
                  <td width="100" align="left">&nbsp;</td>
                  <td>
                    <b><font color="red">{{min_bid_price}}円から入札できます。</font></b>
                  </td>
                </tr>
{% endif %}
                  <tr>
                  <th width="100" align="left">{% trans "start price" %}</th>
                  <td>{{form.instance.start_price}}{% trans "$"%}</td>
                </tr>
                <tr>
                  <th width="100" align="left">{% trans "prompt price" %}</th>
                  <td><b>{{form.instance.prompt_price}}{% trans "$"%}</b></td>
                </tr>
              </table>
{% if not form.instance.is_complete %}
              <img id="bid_btn_img" src="{% url top_page %}static/img/button_tender.png" value="入札する"
                   onclick="javascript:$(function(){bid();})" />
{% endif %}
              <table width="100%" border="0" collapse="0" cellspacing="10">
                {% if form.image1exist %}
                <tr>
                  <td><img src="{% url top_page %}static/img/items/{{ form.instance.id }}/1.jpeg" style="width:600px;" alt="{% trans 'image1' %}"></td>
                </tr>
                {% endif %}
                {% if form.image2exist %}
                <tr>
                  <td><img src="{% url top_page %}static/img/items/{{ form.instance.id }}/2.jpeg" style="width:600px;" alt="{% trans 'image2' %}"></td>
                </tr>
                {% endif %}
                {% if form.image3exist %}
                <tr>
                  <td><img src="{% url top_page %}static/img/items/{{ form.instance.id }}/3.jpeg" style="width:600px;" alt="{% trans 'image3' %}"></td>
                </tr>
                {% endif %}
                <tr>
                  <td>
<!--
<div id="jw_wrap_1277642614253"> <object width="400" height="319" id="jw_player_1277642614253" name="jw_player_1277642614253"> <param name="movie" value="http://cdn.kaltura.com/flash/jw/player/non-commercial.swf" /> <param name="allowScriptAccess" value="always" /> <param name="flashvars" value="file=http://cdn.kaltura.com/p/314701/sp/31470100/flvclipper/entry_id/1_vgiafa06/version/100000/ext/flv&image=http://cdn.kaltura.com/p/314701/sp/31470100/thumbnail/entry_id/1_vgiafa06/width/640/height/480&widgetId=jw00000001&entryId=1_vgiafa06&partnerId=314701&uiconfId=800&plugins=kalturastats" /> <embed id="jw_player__1277642614253" name="jw_player__1277642614253" src="http://cdn.kaltura.com/flash/jw/player/non-commercial.swf" width="400" height="319" allowfullscreen="true" wmode="transparent" allowscriptaccess="always" flashvars="file=http://cdn.kaltura.com/p/314701/sp/31470100/flvclipper/entry_id/1_vgiafa06/version/100000/ext/flv&image=http://cdn.kaltura.com/p/314701/sp/31470100/thumbnail/entry_id/1_vgiafa06/width/640/height/480&widgetId=jw00000001&entryId=1_vgiafa06&partnerId=314701&uiconfId=800&plugins=kalturastats" /> <noembed><a href="http://www.kaltura.org/">Open Source Video</a></noembed> </object> </div>
-->
                  </td>
                </tr>
              </table>

                <div id="bid_dialog" title="入札" style="display:none;">
                  <p id="bid_info"><span id="min_bid_price">{{min_bid_price}}</span>円から入札できます。</p>
                  <form>
                    <span id="bid_price_label">入札金額：</span>
                    <input type="text" size="10" id="bid_price" value="" style="text-align:right; ime-mode:disabled;">
                    <input type="button" value=" 入 札 " id="bid_btn" onclick="javascript:ajax_bid()" />
                    <p><br></p>
                  </form>
                  <span id="bid_result"></span>
                  <script type="text/javascript" language="javascript">
                    function ajax_bid(){
                       $('#bid_result').text('');
                       var item_id = {{ form.instance.id }}
                       var bid_price = $('#bid_price').val();//attr('value');
                       var min_bid_price = $('#min_bid_price').html()*1;
                       if(bid_price=="" || bid_price*1 < min_bid_price ) {
                           $('#bid_result').text("入札価格は"+min_bid_price+"円以上でなければなりません。");
                           return;
                       }
                       $.post(
                         '{% url djanction.item.views.bids form.instance.id %}',
                         {'bid_price':bid_price,'current_price':{{ form.instance.current_price }}}
                       );
                    }

                    function isLogin(docs){
                        var pattern = new RegExp("button_login\.png");
                        if (docs.match(pattern) != null) {
                            return false;
                        }else{
                            return true;
                        }
                    }
                    function getMessage(statusCode){
                        var msg="もう一度お試しください。";
                        switch (statusCode){
                            case "100": msg="入札可能金額が変更されました。"; break;
                            case "101": msg="入札期間が終了しました。"; break;
                            case "999": msg="管理者へ連絡してください。"; break;
                            default:;
                        }
                        return msg;
                    }
                    function _over_ (xhr){//alert(xhr.responseText);
                        if(!isLogin(xhr.responseText)){
                            $('span#bid_result').text('入札できません。ログインしてください。');
                            $('span#bid_result').css('color','red');
                            return;
                        }
                        // if bid not accepted.
                        var statusCode = xhr.responseText.substr(xhr.responseText.indexOf('status:')+7,3);
                        if(statusCode*1>99){
                            var why=getMessage(statusCode);
                            $('span#bid_result').text('入札できませんでした。'+why);
                            $('span#bid_result').css('color','red');
                            return;
                        }

                        var bid_price = $('#bid_price').val();
                        $('#min_bid_price').text(bid_price);
                        $('#bid_info').hide();
                        $('#bid_price').hide();
                        $('#bid_price_label').hide();
                        $('#bid_btn').hide();

                        var iscomplete = "入札";
                        if(bid_price*1 >= {{form.instance.prompt_price}}) {
                            iscomplete = "落札";$('#bid_btn_img').hide();
                        }
                        $('span#bid_result').text(bid_price+'で'+ iscomplete +'できました。');
                    }

                    $.ajaxSetup({cache:false});

                    $('#bid_result').ajaxStart(
                                        function(ev){/*$(this).text('start');*/}
                                   ).ajaxSend(
                                        function(ev,xhr,options){/*$(this).text('send');*/}
                                   ).ajaxSuccess(
                                        function(ev,xhr,options){_over_(xhr);/*$('#bid_result').text('success');*/}
                                   ).ajaxError(
                                        function(ev,xhr,options,err){/*$(this).text('error');alert(err);*/}
                                   ).ajaxComplete(
                                        function(ev,xhr,options){/*$('#bid_result').text('complete');*/}
                                   ).ajaxStop(
                                        function(ev){;}
                                   );

                    function bid(){
                      $('#bid_result').text('');
                      $('#bid_info').show();
                      $('#bid_price_label').show();
                      $('#bid_price').val('');
                      $('#bid_price').show();
                      $('#bid_btn').show();
                      $('#bid_dialog').dialog({open:function(ev,ui){},close:function(ev,ui){location.reload(true);}});
                    }
                  </script>
                </div>
            </p>
          </p>
        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>

<p><br></p>
<p><br></p>

  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content">
          <p>
            <h3>出品者への質問と出品者からの説明</h3>
          </p>
          <p>
            商品に関する質問と説明の連絡はここで行なってください。
          </p>
{% if not is_user_logged_in %}
          <p>
            投稿にはログインが必要です。
          </p>
{% endif %}

          {% for item in qa_object_list %}
          <p>
            <table border="0" cellpadding="0" cellspacing="1" style="width:80%;">
              <tr>
                <th width="100" bgcolor="#EFEFFF">日時:</th>
                <td bgcolor="#DFDFDF">{{item.post_date|date:"Y年m月d日(D) H:i:s"}}</td>
              </tr>
              <tr>
                <th width="100"bgcolor="#EFEFFF">ユーザID:</th>
                <td bgcolor="#EFEFEF">{{item.post_user.username|escape}}</td>
              </tr>
              <tr>
                <th width="100" bgcolor="#EFEFFF">コメント:</th>
                <td bgcolor="#EFEFEF">{{item.comment|escape|linebreaks}}</td>
              </tr>
            </table>
          </p>
          {% endfor %}

{% if is_user_logged_in %}
  {% if not form.instance.is_complete %}
          <p>
            <form action="{% url djanction.item.views.add_qa form.instance.id %}" method="post">
              <input type="hidden" name="item" value="{{ form.instance.id }}">
              <input type="hidden" name="post_user" value="{{ user.id }}">
              <table style="width:80%;">
                <tr>
                  <th width="100">
                    コメント:
                  </td>
                  <td>
                    <textarea name="comment" rows="5" style="width:100%;"></textarea><br>
                  </td>
                </tr>
                <tr>
                  <td colspan="2">
                    <input type="submit" value="投稿">
                  </td>
                </tr>
              </table>
            </form>
          </p>
  {% endif %}
{% endif %}

{% if form.instance.is_complete %}
          <p>
            オークションが終了しているため投稿はできません。
          </p>
{% endif %}

        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>

{% if form.instance.is_complete %}
<p><br></p>
<p><br></p>
  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content"><br/>
  {% if not has_feedback %}
    <p>{% if is_bidder %}出品者{% else %}落札者{% endif %}を<a href="{% url djanction.rating.views.feedback form.instance.id %}" >評価する</a></p>
  {% else %}
    <p>{% if is_bidder %}出品者{% else %}落札者{% endif %}を評価済みです。</p>
  {% endif %}
        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>

  {% if is_auction_owner %}
<p><br></p>
<p><br></p>

  <div class="mainbox">
    <div class="inner">
      <div class="top"><span></span></div>
        <div class="content">
          <p>
            <h3>商品落札後の情報交換</h3>
          </p>
          <p>
            出品者と落札者間の連絡はここで行なってください。
          </p>

          {% for item in contact_message_object_list %}
          <p>
            <table border="0" cellpadding="0" cellspacing="1" style="width:80%;">
              <tr>
                <th width="100" bgcolor="#EFEFFF">日時:</th>
                <td bgcolor="#DFDFDF">{{item.post_date|date:"Y年m月d日(D) H:i:s"}}</td>
              </tr>
              <tr>
                <th width="100"bgcolor="#EFEFFF">ユーザID:</th>
                <td bgcolor="#EFEFEF">{{item.post_user.username|escape}}</td>
              </tr>
              <tr>
                <th width="100" bgcolor="#EFEFFF">タイトル:</th>
                <td bgcolor="#EFEFEF"><b>{{item.title|escape}}</b></td>
              </tr>
              <tr>
                <th width="100" bgcolor="#EFEFFF">コメント:</th>
                <td bgcolor="#EFEFEF">{{item.comment|escape|linebreaks}}</td>
              </tr>
            </table>
          </p>
          {% endfor %}

          <p>
            <form action="{% url djanction.item.views.add_contact_message form.instance.id %}" method="post">
              <input type="hidden" name="item" value="{{ form.instance.id }}">
              <input type="hidden" name="post_user" value="{{ user.id }}">
              <table style="width:80%;">
                <tr>
                  <th width="100">
                    タイトル:
                  </td>
                  <td>
                    <input type="text" name="title" value="" maxlength="256" style="width:90%;"><br>
                  </td>
                </tr>
                <tr>
                  <th width="100">
                    コメント:
                  </td>
                  <td>
                    <textarea name="comment" rows="15" style="width:100%;"></textarea><br>
                  </td>
                </tr>
                <tr>
                  <td colspan="2">
                    <input type="submit" value="投稿">
                  </td>
                </tr>
              </table>
            </form>
          </p>

        </div>
        <div class="base"><span></span></div>
      </div>
    </div>
  </div>
  {% endif %}
{% endif %}


{% endblock %}

