{% extends 'group/layout.html.twig' %}
{% do script(['libs/es-ckeditor/ckeditor.js','libs/jquery-validation.js','app/js/group/index.js']) %}

{% block title %}{{'group.detail.group_name'|trans({'%title%': groupinfo.title})}} {{ parent() }}{% endblock %}


{% block keywords %}{{groupinfo.title}}{% endblock %}
{% block description %}{{groupAbout|default('')|plain_text(100)}}{% endblock %}
{% set groupNav = 'index' %}

{% block group_main %}
  <div class="panel panel-default">
    <div class="panel-heading"><h3 class="panel-title">{{'group.detail.introduction'|trans}}</h3></div>
    <div class="panel-body">
      {% if paginator.currentPage == paginator.firstPage %}
        <div class="well editor-text cke_editable cke_contents_ltr">
          {% if groupinfo.about%} {{groupinfo.about|cdn|raw}} {% else %} {{'group.detail.introduction.empty'|trans}} {% endif %}
        </div>
      {% endif %}
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-body">
      <ul class="nav nav-tabs">
        <li {% if groupNav=="index" %}class="active"{% endif %}><a href="{{path('group_show',{id:groupinfo.id})}}">{{'group.detail.group_homepage'|trans}}</a></li>
        <li {% if groupNav=="member" %}class="active"{% endif %}><a href="{{path('group_member',{id:groupinfo.id})}}">{{'group.detail.group_members'|trans}}</a></li>
        {% if is_groupmember==2 or is_granted('ROLE_ADMIN') or is_groupmember==3%}
          <li {% if groupNav=="setting" %}class="active" {% endif %}><a  href="{{path('group_set',{id:groupinfo.id})}}">{{'group.detail.group_settings'|trans}}</a></li>
        {% endif %}
      </ul>

      {{ web_macro.flash_messages() }}
      <div class="nav-filter clearfix mbl">

      <ul class="nav nav-pills nav-pills-sm">

        <li{% if condition.type == 'all' %} class="active"{% endif %}><a class="js-nav" data-target="#thread-pane" href="{{path('group_show',{id:id,num:condition.num,sort:condition.sort,isElite:0})}}">{{'group.detail.all_btn'|trans}}</a></li>

        <li{% if condition.type == 'elite' %} class="active"{% endif %}><a class="js-nav" data-target="#thread-pane" href="{{path('group_show',{id:id,type:'elite',num:condition.num,sort:condition.sort})}}">{{'group.detail.essence_btn'|trans}}</a></li>

        {% if is_feature_enabled('group_reward') %}
        <li{% if condition.type == 'reward' %} class="active"{% endif %}><a class="js-nav" data-target="#thread-pane" href="{{path('group_show',{id:id,type:'reward',num:condition.num,sort:condition.sort})}}">{{'group.detail.wanted_btn'|trans}}</a></li>
        {% endif %}

        <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">
            <span class="color-gray">{{'group.detail.order_btn'|trans}}</span>
            {% if condition.sort == 'byLastPostTime' %}
              {{'group.detail.last_reply_order_btn'|trans}}
            {% elseif condition.sort == 'byCreatedTime' %}
              {{'group.detail.newest_order_btn'|trans}}
            {% elseif condition.sort == 'byPostNum' %}
              {{'group.detail.reply_count_order_btn'|trans}}
            {% endif %}
            <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li class="{% if condition.sort == 'byCreatedTime' %}active{% endif %}"><a class="js-nav" href="{{path('group_show',{id:id,isElite:condition.type,num:condition.num,sort:'byCreatedTime'})}}">{{'group.detail.newest_order_btn'|trans}}</a></li>
            <li class="{% if condition.sort == 'byLastPostTime' %}active{% endif %}"><a class="js-nav" href="{{path('group_show',{id:id,isElite:condition.type,num:condition.num,sort:'byLastPostTime'})}}">{{'group.detail.last_reply_order_btn'|trans}}</a></li>
            <li class="{% if condition.sort == 'byPostNum' %}active{% endif %}"><a class="js-nav" href="{{path('group_show',{id:id,isElite:condition.type,num:condition.num,sort:'byPostNum'})}}">{{'group.detail.reply_count_order_btn'|trans}}</a></li>
          </ul>
        </li>
      </ul>


      </div>

      {% include 'my/learning/group/groups-threads-ul.html.twig' with {users:owner} %}

      {{ web_macro.paginator(paginator) }}
    </div>
  </div>
{% endblock %}

{% block group_side %}
  {% if is_groupmember != 0 %}
    <div class="mbm"><a href="{{path('group_thread_add',{id:groupinfo.id})}}" class="btn btn-success btn-xlg btn-block" role="button"><i class="es-icon es-icon-comment mrs text-xlg"></i>{{'group.detail.create_article'|trans}}</a>
    </div>
  {% endif %}
  <form class="mbl" action="{{path('group_search',{id:groupinfo.id})}}" method="get">
  <div class="search-with-btn">
    <input type="hidden" name="_csrf_token" value="{{ csrf_token('site') }}">
    <input type="text" class="form-control" placeholder="{{'group.detail.search_input_placeholder'|trans}}" name="keyWord">
    <button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button>
  </div>
  </form>
  {% if is_groupmember in [1, 2, 3] %}
    <div class="panel panel-default">
      <div class="panel-body group-user-info">
        <div class="media group-item">
          <div class="media-left">
            {{ web_macro.user_avatar(user, '' ,'avatar-md') }}
          </div>
          <div class="media-body">
            <p>{{ web_macro.user_link(user , '') }}

              {% if is_groupmember==1%}
              <span class="label label-primary">{{'group.detail.member'|trans}}</span>
              {% endif %}

              {% if is_groupmember==2%}
              <span class="label label-primary">{{'group.detail.leader'|trans}}</span>
              {% endif %}

              {% if is_groupmember==3%}
              <span class="label label-primary">{{'group.detail.vice_leader'|trans}}</span>
              {% endif %}
            </p>
            <a href="{{ path ('my_group_member_center') }}" class="btn btn-default btn-sm" role="button">{{'group.detail.my_group_btn'|trans}}</a>
          </div>
          <hr>
           <p class="group-message clearfix">
              <span><strong>{{userIsGroupMember.threadNum}}</strong>{{'group.detail.articles'|trans}}</span>
              <span><strong>{{userIsGroupMember.postNum}}</strong>{{'group.detail.replies'|trans}}</span>
            </p>
        </div>
      </div>
    </div>
  {% endif %}
  <div class="panel panel-default">
    <div class="panel-heading"><h3 class="panel-title">{{'group.detail.group_leader'|trans}}</h3></div>
    <div class="panel-body">
      <div class="media group-item">
        <div class="media-left">
          {{ web_macro.user_avatar(groupOwner, '') }}
        </div>
        <div class="media-body">
          <div><a class="gray-darker" href="{{path('user_show',{id:groupOwner.id})}}" title="{{groupOwner.nickname}}">{{groupOwner.nickname}}</a></div>
          <span class="text-sm gray-medium">{{ groupOwner.title|default('group.detail.group_leader.empty'|trans) }}</span>
        </div>
      </div>
    </div>
  </div>


  <div class="panel panel-default">
    <div class="panel-heading"><h3 class="panel-title">{{'group.detail.new_group_members'|trans}}</h3></div>
    <div class="panel-body">
      {% if recentlyJoinMember %}
        <ul class="user-avatar-list clearfix">
          {% for member in recentlyJoinMember %}
            <li>
              {{ web_macro.user_avatar(members[member.userId] ,'', 'avatar-sm') }}
            </li>
          {% endfor %}
        </ul>
      {% else %}
        <div class="empty">{{'group.detail.new_group_members.empty'|trans}}</div>
      {% endif %}
    </div>
  </div>

  <div class="panel panel-default">
    <div class="panel-heading"><h3 class="panel-title">{{'group.detail.hot_group'|trans}}</h3></div>
    <div class="panel-body">
      <div class="media-group-list">
      {% set hotGroups = data('HotGroup',{'count':3}) %}
      {% for group in hotGroups %}
        <div class="media media-group">
          <div class="media-left prm">
            <a href="{{path('group_show',{id:group.id})}}" title="{{group.title}}">
              <img src="{{filepath(group.logo, 'group.png')}}" alt="{{group.title}}" class="avatar-square-md">
            </a>
          </div>
          <div class="media-body">
            <div class="title">
              <a class="gray-darker" href="{{ path('group_show',{id:group.id}) }}" title="{{group.title}}">
                {{group.title}}
              </a>
            </div>
            <div class="metas">
              <span><i class="es-icon es-icon-people"></i>{{group.memberNum}}</span>
              <span><i class="es-icon es-icon-textsms"></i>{{group.threadNum}}</span>
            </div>
          </div>
        </div>
      {% else %}
        <div class="empty">{{'group.detail.hot_group_empty'|trans}}</div>
      {% endfor %}
      </div>

    </div>
  </div>

{% endblock %}
