]> git.mxchange.org Git - friendica.git/blob - view/templates/acl_selector.tpl
[frio] Make whole ACL panel heading clickable to change visibility panel
[friendica.git] / view / templates / acl_selector.tpl
1 <div id="acl-wrapper">
2         <div class="panel-group" id="visibility-accordion" role="tablist" aria-multiselectable="true">
3                 <div class="panel panel-success">
4                         <label class="panel-heading{{if $visibility != 'public'}} collapsed{{/if}}" id="visibility-public-heading" aria-expanded="{{if $visibility == 'public'}}true{{else}}false{{/if}}">
5                                 <input type="radio" name="visibility" id="visibility-public" value="public" tabindex="14" {{if $visibility == 'public'}}checked{{/if}}>
6                                 <i class="fa fa-globe"></i> {{$public_title}}
7                         </label>
8                         <fieldset id="visibility-public-panel" class="panel-collapse collapse{{if $visibility == 'public'}} in{{/if}}" role="tabpanel" aria-labelledby="visibility-public-heading" {{if $visibility != 'public'}}disabled{{/if}}>
9                                 <div class="panel-body">
10                                         <p>{{$public_desc}}</p>
11                         {{if $for_federation}}
12                                 {{if $user_hidewall}}
13                                         <h4>{{$jotnets_summary}}</h4>
14                                 {{$jotnets_disabled_label}}
15                                 {{elseif $jotnets_fields}}
16                                     {{if $jotnets_fields|count < 3}}
17                                                                 <div class="profile-jot-net">
18                                     {{else}}
19                                                                 <details class="profile-jot-net">
20                                                                 <summary>{{$jotnets_summary}}</summary>
21                                     {{/if}}
22
23                                     {{foreach $jotnets_fields as $jotnets_field}}
24                                         {{if $jotnets_field.type == 'checkbox'}}
25                                             {{include file="field_checkbox.tpl" field=$jotnets_field.field}}
26                                         {{elseif $jotnets_field.type == 'select'}}
27                                             {{include file="field_select.tpl" field=$jotnets_field.field}}
28                                         {{/if}}
29                                     {{/foreach}}
30
31                                     {{if $jotnets_fields|count >= 3}}
32                                                                 </details>
33                                     {{else}}
34                                                                 </div>
35                                     {{/if}}
36                                     {{/if}}
37                         {{/if}}
38                                 </div>
39                         </fieldset>
40                 </div>
41                 <div class="panel panel-info">
42                         <label class="panel-heading{{if $visibility != 'custom'}} collapsed{{/if}}" id="visibility-custom-heading" aria-expanded="{{if $visibility == 'custom'}}true{{else}}false{{/if}}">
43                                 <input type="radio" name="visibility" id="visibility-custom" value="custom" tabindex="15" {{if $visibility == 'custom'}}checked{{/if}}>
44                                 <i class="fa fa-lock"></i> {{$custom_title}}
45                         </label>
46                         <fieldset id="visibility-custom-panel" class="panel-collapse collapse{{if $visibility == 'custom'}} in{{/if}}" role="tabpanel" aria-labelledby="visibility-custom-heading" {{if $visibility != 'custom'}}disabled{{/if}}>
47                                 <input type="hidden" name="group_allow" value="{{$group_allow}}"/>
48                                 <input type="hidden" name="contact_allow" value="{{$contact_allow}}"/>
49                                 <input type="hidden" name="group_deny" value="{{$group_deny}}"/>
50                                 <input type="hidden" name="contact_deny" value="{{$contact_deny}}"/>
51                                 <div class="panel-body">
52                                         <p>{{$custom_desc}}</p>
53
54                                         <div class="form-group">
55                                                 <label for="acl_allow">{{$allow_label}}</label>
56                                                 <input type="text" class="form-control input-lg" id="acl_allow">
57                                         </div>
58
59                                         <div class="form-group">
60                                                 <label for="acl_deny">{{$deny_label}}</label>
61                                                 <input type="text" class="form-control input-lg" id="acl_deny">
62                                         </div>
63                                 </div>
64                         </fieldset>
65                 </div>
66         </div>
67
68
69 {{if $for_federation}}
70         <div class="form-group">
71                 <label for="profile-jot-email" id="profile-jot-email-label">{{$emailcc}}</label>
72                 <input type="text" name="emailcc" id="profile-jot-email" class="form-control" title="{{$emtitle}}" />
73         </div>
74         <div id="profile-jot-email-end"></div>
75 {{/if}}
76 </div>
77 <script type="text/javascript">
78         $(function() {
79                 let $acl_allow_input = $('#acl_allow');
80                 let $contact_allow_input = $('[name=contact_allow]');
81                 let $group_allow_input = $('[name=group_allow]');
82                 let $acl_deny_input = $('#acl_deny');
83                 let $contact_deny_input = $('[name=contact_deny]');
84                 let $group_deny_input = $('[name=group_deny]');
85                 let $visibility_public_panel = $('#visibility-public-panel');
86                 let $visibility_custom_panel = $('#visibility-custom-panel');
87                 let $visibility_public_radio = $('#visibility-public');
88                 let $visibility_custom_radio = $('#visibility-custom');
89
90                 // Frio specific
91                 if ($.fn.collapse) {
92                         $visibility_public_panel.collapse({parent: '#visibility-accordion', toggle: false});
93                         $visibility_custom_panel.collapse({parent: '#visibility-accordion', toggle: false});
94                 }
95
96                 $visibility_public_radio.on('change', function (e) {
97                         if ($.fn.collapse) {
98                                 $visibility_public_panel.collapse('show');
99                         }
100
101                         $visibility_public_panel.prop('disabled', false);
102                         $visibility_custom_panel.prop('disabled', true);
103
104                         $('.profile-jot-net input[type=checkbox]').each(function() {
105                                 // Restores checkbox state if it had been saved
106                                 if ($(this).attr('data-checked') !== undefined) {
107                                         $(this).prop('checked', $(this).attr('data-checked') === 'true');
108                                 }
109                         });
110                         $('.profile-jot-net input').attr('disabled', false);
111                 });
112
113                 $visibility_custom_radio.on('change', function(e) {
114                         if ($.fn.collapse) {
115                                 $visibility_custom_panel.collapse('show');
116                         }
117
118                         $visibility_public_panel.prop('disabled', true);
119                         $visibility_custom_panel.prop('disabled', false);
120
121                         $('.profile-jot-net input[type=checkbox]').each(function() {
122                                 // Saves current checkbox state
123                                 $(this)
124                                         .attr('data-checked', $(this).prop('checked'))
125                                         .prop('checked', false);
126                         });
127                         $('.profile-jot-net input').attr('disabled', 'disabled');
128                 });
129
130                 // Custom visibility tags inputs
131                 let acl_groups = new Bloodhound({
132                         local: {{$acl_groups|@json_encode nofilter}},
133                         identify: function(obj) { return obj.id; },
134                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name']),
135                         queryTokenizer: Bloodhound.tokenizers.whitespace,
136                 });
137                 let acl_contacts = new Bloodhound({
138                         local: {{$acl_contacts|@json_encode nofilter}},
139                         identify: function(obj) { return obj.id; },
140                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
141                         queryTokenizer: Bloodhound.tokenizers.whitespace,
142                 });
143                 let acl = new Bloodhound({
144                         local: {{$acl_list|@json_encode nofilter}},
145                         identify: function(obj) { return obj.id; },
146                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
147                         queryTokenizer: Bloodhound.tokenizers.whitespace,
148                 });
149                 acl.initialize();
150
151                 let suggestionTemplate = function (item) {
152                         return '<div><img src="' + item.micro + '" alt="" style="float: left; width: auto; height: 2.8em; margin-right: 0.5em;"> <strong>' + item.name + '</strong><br /><em>' + item.addr + '</em></div>';
153                 };
154
155                 $acl_allow_input.tagsinput({
156                         confirmKeys: [13, 44],
157                         freeInput: false,
158                         tagClass: function(item) {
159                                 switch (item.type) {
160                                         case 'group'   : return 'label label-primary';
161                                         case 'contact'  :
162                                         default:
163                                                 return 'label label-info';
164                                 }
165                         },
166                         itemValue: 'id',
167                         itemText: 'name',
168                         itemThumb: 'micro',
169                         itemTitle: function(item) {
170                                 return item.addr;
171                         },
172                         typeaheadjs: {
173                                 name: 'contacts',
174                                 displayKey: 'name',
175                                 templates: {
176                                         suggestion: suggestionTemplate
177                                 },
178                                 source: acl.ttAdapter()
179                         }
180                 });
181
182                 $acl_deny_input
183                         .tagsinput({
184                                 confirmKeys: [13, 44],
185                                 freeInput: false,
186                                 tagClass: function(item) {
187                                         switch (item.type) {
188                                                 case 'group'   : return 'label label-primary';
189                                                 case 'contact'  :
190                                                 default:
191                                                         return 'label label-info';
192                                         }
193                                 },
194                                 itemValue: 'id',
195                                 itemText: 'name',
196                                 itemThumb: 'micro',
197                                 itemTitle: function(item) {
198                                         return item.addr;
199                                 },
200                                 typeaheadjs: {
201                                         name: 'contacts',
202                                         displayKey: 'name',
203                                         templates: {
204                                                 suggestion: suggestionTemplate
205                                         },
206                                         source: acl.ttAdapter()
207                                 }
208                         });
209
210                 // Import existing ACL into the tags input fields.
211
212                 $group_allow_input.val().split(',').forEach(function (val) {
213                         $acl_allow_input.tagsinput('add', acl_groups.get(val)[0]);
214                 });
215                 $contact_allow_input.val().split(',').forEach(function (val) {
216                         $acl_allow_input.tagsinput('add', acl_contacts.get(val)[0]);
217                 });
218                 $group_deny_input.val().split(',').forEach(function (val) {
219                         $acl_deny_input.tagsinput('add', acl_groups.get(val)[0]);
220                 });
221                 $contact_deny_input.val().split(',').forEach(function (val) {
222                         $acl_deny_input.tagsinput('add', acl_contacts.get(val)[0]);
223                 });
224
225                 // Anti-duplicate callback + acl fields value generation
226
227                 $acl_allow_input.on('itemAdded', function (event) {
228                         // Removes duplicate in the opposite acl box
229                         $acl_deny_input.tagsinput('remove', event.item);
230
231                         // Update the real acl field
232                         $group_allow_input.val('');
233                         $contact_allow_input.val('');
234                         [].forEach.call($acl_allow_input.tagsinput('items'), function (item) {
235                                 if (item.type === 'group') {
236                                         $group_allow_input.val($group_allow_input.val() + ',' + item.id);
237                                 } else {
238                                         $contact_allow_input.val($contact_allow_input.val() + ',' + item.id);
239                                 }
240                         });
241                 });
242
243                 $acl_deny_input.on('itemAdded', function (event) {
244                         // Removes duplicate in the opposite acl box
245                         $acl_allow_input.tagsinput('remove', event.item);
246
247                         // Update the real acl field
248                         $group_deny_input.val('');
249                         $contact_deny_input.val('');
250                         [].forEach.call($acl_deny_input.tagsinput('items'), function (item) {
251                                 if (item.type === 'group') {
252                                         $group_deny_input.val($group_allow_input.val() + ',' + item.id);
253                                 } else {
254                                         $contact_deny_input.val($contact_allow_input.val() + ',' + item.id);
255                                 }
256                         });
257                 });
258         });
259 </script>