{% extends "master.html" %}
{% block title %}Groups{% endblock %}
{% set tag = "groups" %}
{% from "_browseheader.html" import browse_header %}
{% from "_render_repo.html" import searchbox %}
{% from "_projectstring.html" import projectstring, projecticon %}
{% block header %}
<link nonce="{{ g.nonce }}" rel="stylesheet" href="{{
url_for('static', filename='vendor/selectize/selectize.bootstrap3.css') }}?version={{ g.version}}"/>
{% endblock %}
{% block content %}
<div class="bg-light border border-top-0 pt-2">
<div class="container">
{{browse_header(select=tag)}}
</div>
</div>
<div class="container mt-5">
<div class="row mb-3">
<div class="col align-self-center">
<h3 class="font-weight-bold">
Groups <span class="badge badge-secondary">{{ groups | length }}</span>
</h3>
</div>
<div class="col-auto form-inline">
{{searchbox(select="groups")}}
</div>
</div>
<div class="row">
{% if groups %}
{% for group in groups %}
<div class="col-lg-4 col-md-6">
<div class="border mb-4">
<div class="media p-2">
<div class="align-self-start mr-3"><span class="fa fa-users fa-fw fa-4x text-muted"></span></div>
<div class="media-body align-self-center">
<a href="{{ url_for('ui_ns.view_group', group=group.group_name)}}">
<div class="nowrap"><strong>{{ group.group_name }}</strong></div>
</a>
<div class="nowrap"><small>{{ group.display_name }}</small></div>
</div>
</div>
<div class="bg-light border-top py-1 px-2 mt-0">
<small>Formed {{ group.created |humanize }}</small>
<div class="float-right text-muted">
<span title="{{projectstring(plural=True)}}" data-toggle="tooltip" class="mr-1">
<span class="fa {{projecticon()}} pr-1"></span>
{{group.projects | count }}
</span>
<span title="Members" data-toggle="tooltip">
<span class="fa fa-user pr-1"></span>
{{group.users | count}}
</span>
</div>
</div>
</div>
</div>
{% endfor %}
{% else %}
<p>No groups have been created on this pagure instance yet</p>
{% endif %}
</div>
</div>
{% endblock %}
{% block jscripts %}
{{ super() }}
<script type="text/javascript" nonce="{{ g.nonce }}" src="{{
url_for('static', filename='vendor/selectize/selectize.min.js') }}?version={{ g.version}}" type="text/javascript"> </script>
<script type="text/javascript" nonce="{{ g.nonce }}">
$(document).ready(function() {
$('#headerSearch').on('keypress keydown keyup', function(e) {
if (e.which == 13) {
e.preventDefault();
return false;
}
});
$('#term').selectize({
valueField: 'name',
labelField: 'name',
searchField: 'group',
maxItems: 1,
create: false,
onType: function(value){
if (value == ""){
this.close();
}
},
onChange: function(value){
if (value != ""){
$('#headerSearch').submit();
}
},
load: function(query, callback) {
if (!query.length) return callback();
$.getJSON(
"{{ url_for('api_ns.api_groups') }}", {
pattern: query,
extended:1,
},
function( data ) {
callback( data.groups );
}
);
},
render: {
option: function(item, escape) {
return '<div>'
+ '<div class="groupicon-search pull-xs-left">'
+ '<span class="fa fa-users"></span>'
+ '</div>'
+ '<div class="title">'
+ '<span class="name">'
+ '<strong>' + escape(item.name) + '</strong>'
+ '</span>'
+ '</div>'
+ '<div class="description">'
+ '<small>' + escape(item.description) + '</small>'
+ '</div>'
+ '</div>';
}
}
});
});
</script>
{% endblock %}