]> git.agnieray.net Git - galette.git/blobdiff - galette/templates/default/pages/member_form.html.twig
Fix groups selection widget on member form
[galette.git] / galette / templates / default / pages / member_form.html.twig
index 45541c8562a9cc2c39e9c2557e8769009b99b4b0..cbd0e0bc4bceedb9e14bd64a5859edc800599187 100644 (file)
@@ -2,11 +2,12 @@
 
 {% block content %}
 <form action="{% if self_adh %}{{ url_for("storeselfmembers") }}{% elseif not member.id %}{{ url_for("doAddMember") }}{% else %}{{ url_for("doEditMember", {"id": member.id}) }}{% endif %}" method="post" enctype="multipart/form-data" id="form" class="ui form{% if member.id %} edit-member{% endif %}">
-    {% if member.id %}
+    {% if member.id or not self_adh and members.list is defined and members.list|length > 0 %}
 <div class="ui stackable grid">
     <div class="row">
         <div class="sixteen wide tablet six wide computer five wide widescreen column order-2">
             <div class="position-sticky">
+        {% if member.id %}
                 <div class="ui basic clearing horizontally fitted segment">
 
                     <div class="ui left floated basic fitted segment">
                         <div class="ui small spaced buttons">
                     {% if member.id %}
                             <button type="submit" name="valid" class="action ui labeled icon primary button">
-                                <i class="save icon"></i> {{ _T("Save") }}
+                                <i class="save icon" aria-hidden="true"></i> {{ _T("Save") }}
                             </button>
                     {% endif %}
                             <a
                                 href="{{ url_for("member", {"id": member.id}) }}"
                                 class="ui basic labeled icon button"
                             >
-                                <i class="eye outline icon"></i>
+                                <i class="eye outline icon" aria-hidden="true"></i>
                                 {{ _T("Display") }}
                             </a>
                         </div>
                     </div>
                 </div>
                 {% include "elements/member_card.html.twig" %}
+        {% endif %}
     {% endif %}
 
-    {% if not self_adh %}
-                <div class="ui{% if not member.id %} compact{% endif %} segment">
+    {% if not self_adh and members.list is defined and members.list|length > 0 %}
+                <div class="ui basic horizontally fitted segment">
+                    <div class="ui segment">
         {% if member.hasParent() and not member.isDuplicate() %}
-                    <div class="field">
-                        <div class="ui label">
-                            <i class="linkify icon"></i>
-                            {{ _T("Attached to:") }}
-                        </div>
-                        <div class="ui celled list">
-                            <a href="{{ url_for("member", {"id": member.parent.id}) }}" class="item">{{ member.parent.sfullname }}</a>
-                        </div>
+                        <div class="field">
+                            <div class="ui label">
+                                <i class="linkify icon" aria-hidden="true"></i>
+                                {{ _T("Attached to:") }}
+                            </div>
+                            <div class="ui celled list">
+                                <a href="{{ url_for("member", {"id": member.parent.id}) }}" class="item">{{ member.parent.sfullname }}</a>
+                            </div>
             {% if not member.id %}
-                        <input type="hidden" name="parent_id" value="{{ member.parent.id }}"/>
+                            <input type="hidden" name="parent_id" value="{{ member.parent.id }}"/>
             {% endif %}
-                    </div>
+                        </div>
             {% if login.isAdmin() or login.isStaff() and (addchild is not defined or not addchild) %}
-                    <div class="field">
-                        <div class="ui toggle checkbox">
-                            <input type="checkbox" name="detach_parent" id="detach_parent" value="1"/>
-                            <label for="detach_parent">{{ _T("Detach?") }}</label>
+                        <div class="field">
+                            <div class="ui toggle checkbox">
+                                <input type="checkbox" name="detach_parent" id="detach_parent" value="1"/>
+                                <label for="detach_parent">{{ _T("Detach?") }}</label>
+                            </div>
                         </div>
-                    </div>
             {% endif %}
-        {% elseif (login.isAdmin() or login.isStaff()) and not member.hasChildren() and members.list is defined %}
-                    <div id="attach-checkbox" class="ui{% if member.isDuplicate() %} checked{% endif %} toggle checkbox">
-                        <input type="checkbox" name="attach" id="attach" value="1"{% if member.isDuplicate() %} checked="checked"{% endif %}/>
-                        <label for="attach"><i class="linkify icon"></i> {{ _T("Attach member") }}</label>
-                    </div>
-                    <span id="parent_id_elt" class="">
-                        <div id="parent_id" class="jsonly search-dropdown ui input nochosen paginated">
-                            <input id="parent_id_input" type="text" name="parent_id" value="{{ member.isDuplicate() and member.parent is defined and member.parent is not null ? member.parent.id }}" placeholder="{{ _T("Member ID") }}">
-                            <i class="jsonly displaynone dropdown icon"></i>
-                            <i class="jsonly displaynone chevron circle right icon tooltip" title="{{ _T("Next results") }}"></i>
-                            <div class="jsonly displaynone default text">{{ _T("Search for name or ID and pick member") }}</div>
+        {% elseif (login.isAdmin() or login.isStaff()) and not member.hasChildren() %}
+                        <div class="field">
+                            <div id="attach-checkbox" class="ui{% if member.isDuplicate() %} checked{% endif %} toggle checkbox">
+                                <input type="checkbox" name="attach" id="attach" value="1"{% if member.isDuplicate() %} checked="checked"{% endif %}/>
+                                <label for="attach"><i class="linkify icon" aria-hidden="true"></i> {{ _T("Attach member") }}</label>
+                            </div>
                         </div>
-                    </span>
+                        <span id="parent_id_elt" class="">
+                            <div id="parent_id" class="jsonly search-dropdown ui input paginated">
+                                <input id="parent_id_input" type="text" name="parent_id" value="{{ member.isDuplicate() and member.parent is defined and member.parent is not null ? member.parent.id }}" placeholder="{{ _T("Member ID") }}">
+                                <i class="jsonly displaynone dropdown icon" aria-hidden="true"></i>
+                                <span class="ui mini compact icon disabled button prev-results"><i class="jsonly displaynone chevron circle left icon disabled button tooltip" title="{{ _T("Load previous members...") }}" aria-hidden="true"></i></span>
+                                <span class="ui mini compact icon disabled button next-results"><i class="jsonly displaynone chevron circle right icon disabled button tooltip" title="{{ _T("Load following members...") }}" aria-hidden="true"></i></span>
+                                <div class="jsonly displaynone default text">{{ _T("Search for name or ID and pick member") }}</div>
+                                <div class="jsonly displaynone menu">
+            {% for k, v in members.list %}
+                                    <div class="item" data-value="{{ k }}">{{ v }}</div>
+            {% endfor %}
+                                </div>
+                            </div>
+                        </span>
             {% if member.isDuplicate() %}
-                    <input type="hidden" name="duplicate" value="1" />
+                        <input type="hidden" name="duplicate" value="1" />
             {% endif %}
         {% elseif member.hasChildren() %}
-                    <div class="field">
-                        <div class="ui label">
-                            <i class="linkify icon"></i>
-                            {{ _T("Parent of:") }}
-                        </div>
-                        <div class="ui celled list">
+                        <div class="field">
+                            <div class="ui label">
+                                <i class="linkify icon" aria-hidden="true"></i>
+                                {{ _T("Parent of:") }}
+                            </div>
+                            <div class="ui celled list">
             {% for child in member.children %}
-                            <a href="{{ url_for("member", {"id": child.id}) }}" class="item">{{ child.sfullname }}</a>
+                                <a href="{{ url_for("member", {"id": child.id}) }}" class="item">{{ child.sfullname }}</a>
             {% endfor %}
+                            </div>
                         </div>
-                    </div>
         {% endif %}
+                    </div>
                 </div>
     {% endif %}
 
-    {% if member.id %}
+    {% if member.id or not self_adh and members.list is defined and members.list|length > 0 %}
             </div>
         </div>
         <div class="sixteen wide tablet ten wide computer eleven wide widescreen column">
             <div class="ui center aligned yellow segment">
                 <div class="inline field">
                     <label for="redirect_on_create">{{ _T("After member creation:") }}</label>
-                    <select name="redirect_on_create" id="redirect_on_create"i class="ui search dropdown nochosen">
+                    <select name="redirect_on_create" id="redirect_on_create"i class="ui search dropdown">
                         <option value="{{ constant('Galette\\Entity\\Adherent::AFTER_ADD_DEFAULT') }}"{% if preferences.pref_redirect_on_create == constant('Galette\\Entity\\Adherent::AFTER_ADD_DEFAULT') %} selected="selected"{% endif %}>{{ _T("create a new contribution (default action)") }}</option>
                         <option value="{{ constant('Galette\\Entity\\Adherent::AFTER_ADD_TRANS') }}"{% if preferences.pref_redirect_on_create == constant('Galette\\Entity\\Adherent::AFTER_ADD_TRANS') %} selected="selected"{% endif %}>{{ _T("create a new transaction") }}</option>
                         <option value="{{ constant('Galette\\Entity\\Adherent::AFTER_ADD_NEW') }}"{% if preferences.pref_redirect_on_create == constant('Galette\\Entity\\Adherent::AFTER_ADD_NEW') %} selected="selected"{% endif %}>{{ _T("create another new member") }}</option>
             <div class="ui center aligned yellow segment">
                 <div class="inline field">
                     <div class="ui toggle checkbox">
-                        <input type="checkbox" name="mail_confirm" id="mail_confirm" value="1"{% if member.sendEMail() %} checked="checked"{% endif %}/>
+                        <input type="checkbox" name="mail_confirm" id="mail_confirm" value="1"{% if preferences.pref_bool_mailowner or member.sendEMail() %} checked="checked"{% endif %}/>
                         <label for="mail_confirm">
         {% if member.id %}
                             {{ _T("Notify member his account has been modified") }}
     {% endif %}
             <div class="ui basic center aligned fitted segment">
                 <button type="submit" name="valid" class="action ui labeled icon primary button">
-                    <i class="save icon"></i> {{ _T("Save") }}
+                    <i class="save icon" aria-hidden="true"></i> {{ _T("Save") }}
                 </button>
             {% for entry in hidden_elements %}
                 {% if entry.field_id != 'mdp_adh' %}
             {% include "components/forms/csrf.html.twig" %}
             </div>
 
-    {% if member.id %}
+    {% if member.id or not self_adh and members.list is defined and members.list|length > 0 %}
         </div>
     </div>
 </div>
 {% block javascripts %}
         <script type="text/javascript">
             {% include "elements/js/choose_adh.js.twig" with {"js_chosen_id": "#parent_id"} %}
-            var _parent_id_input = document.getElementById('parent_id_input');
-            if ( typeof(_parent_id_input) != 'undefined' && _parent_id_input != null ) {
-                document.getElementById('parent_id_input').type = 'hidden';
-            }
+            {% include "elements/js/choose_social.js.twig" %}
 
             $(function() {
                 $('#company_field.nocompany').addClass('displaynone');
                 $('#is_company').change(function(){
                     $('#company_field').toggleClass('displaynone');
-                    $('#company_field').backgroundFade(
-                        {
-                            sColor:'#ffffff',
-                            eColor:'#DDDDFF',
-                            steps:10
-                        },
-                        function() {
-                            $(this).backgroundFade(
-                                {
-                                    sColor:'#DDDDFF',
-                                    eColor:'#ffffff'
-                                }
-                            );
-                        });
                 });
 
 {% if not self_adh %}
                         //remove actual groups
                         var _form = (_managed) ? 'managed' : 'user';
                         $('#' + _form + 'groups_form').empty();
-                        var _groups = new Array();
-                        var _groups_str = '<br/><strong>';
-                        if ( _managed ) {
-                            _groups_str += '{{ _T("Manager for:")|e('js') }}';
+                        var _existing_labels = $('#groups_field .labels').children().length;
+                        var _new_labels = 0;
+                        if ($('#groups_field .labels').length === 0) {
+                            var _labels_container = '<div class="ui large labels"></div>';
+                            $('#btngroups').before(_labels_container);
                         } else {
-                            _groups_str += '{{ _T("Member of:")|e('js') }}';
+                            if (_managed) {
+                                $('#groups_field .labels').find('.label.manager').remove();
+                            } else {
+                                $('#groups_field .labels').find('.label.member').remove();
+                            }
                         }
-                        _groups_str += '</strong> ';
+                        var _groups = new Array();
+                        var _groups_str = '';
 
                         $('li[id^="group_"]').each(function(){
                             //get group values
                                 _gid + '|' + _gname + '|' +
                                 '" name="' + _iname + '[]">'
                             );
-                            if ( _groups.length > 1 ) {
-                                _groups_str += ', ';
+                            if (_managed) {
+                                _groups_str += '<span class="ui orange basic label manager">';
+                                _groups_str += '<i class="ui shield icon tooltip" title="' + '{{ _T("Group manager")|e('js') }}' + '" aria-hidden="true"></i>';
+                            } else {
+                                _groups_str += '<span class="ui orange basic label member">';
+                                _groups_str += '<i class="ui tag icon tooltip" title="' + '{{ _T("Member of group")|e('js') }}' + '" aria-hidden="true"></i>';
                             }
                             _groups_str += _gname;
+                            _groups_str += '</span>';
+                            _new_labels += 1;
                         });
-                        $('#' + _form + 'groups').html(_groups_str);
+                        $('#groups_field .labels').append(_groups_str);
+                        var _modified = '<div class="ui yellow tiny message with-transition">{{ _T("Items in this list have been modified. Don't forget to save your changes.")|e('js') }}</div>';
+                        if (_existing_labels != _new_labels) {
+                            $('#groups_field').find('.message').remove();
+                            $('#groups_field').append(_modified);
+                        }
+                        $('.message.with-transition').transition('flash');
                         $('.groups-selection').modal('hide');
                     });
 
                         $('#none_selected').remove()
                         if ( $('#group_' + _gid).length == 0 ) {
                             var _li = '<li id="group_' + _gid + '" class="item">'
-                                    + '<i class="icons"><i class="users icon"><i class="top right corner minus icon"></i></i></i>'
+                                    + '<i class="icons" aria-hidden="true"><i class="users icon"><i class="top right corner minus icon"></i></i></i>'
                                     + '<span class="ui content">' + _gname + '</span></li>';
                             $('#selected_groups ul').append(_li);
                             $('#group_' + _gid).click(function(){
                             });
                         }
                         return false;
-                    }).css('cursor', 'pointer').attr('title', '{{ _T("Click on a contribution row to attach it to the current transaction")|e('js') }}');
+                    }).css('cursor', 'pointer').attr('title', '{{ _T("Click on a row to select a group")|e('js') }}');
                 }
 
     {% if not self_adh and not member.hasChildren() %}
                 });
         {% endif %}
     {% endif %}
-                {% include "elements/js/photo_dnd.js.twig" %}
 
                 $('#ddn_adh').on('blur', function() {
                     var _bdate = $(this).val();
                         $('#member_age').html('');
                     }
                 });
+
+    {% if preferences.pref_force_picture_ratio == 1 %}
+                // Show photo cropping preferences on file selection
+                let _photo_new = document.getElementById('photo_new');
+                _photo_new.addEventListener('change', function () {
+                    if (_photo_new.files.length > 0) {
+                        let _crop_focus = document.getElementById('crop_focus_field');
+                        _crop_focus.classList.remove('displaynone');
+                        $('#crop_focus_field').transition('glow');
+                        return;
+                    }
+                });
+    {% endif %}
 {% endif %}
             });
         </script>