view/templates/item/compose-footer.tpl

   1 <script type="text/javascript">
   2         function updateLocationButtonDisplay(location_button, location_input)
   3         {
   4                 location_button.classList.remove('btn-primary');
   5                 if (location_input.value) {
   6                         location_button.disabled = false;
   7                         location_button.classList.add('btn-primary');
   8                         location_button.title = location_button.dataset.titleClear;
   9                 } else if (!"geolocation" in navigator) {
  10                         location_button.disabled = true;
  11                         location_button.title = location_button.dataset.titleUnavailable;
  12                 } else if (location_button.disabled) {
  13                         location_button.title = location_button.dataset.titleDisabled;
  14                 } else {
  15                         location_button.title = location_button.dataset.titleSet;
  16                 }
  17         }
  18
  19         $(function() {
  20                 // Jot attachment live preview.
  21                 let $textarea = $('#comment-edit-text-0');
  22                 $textarea.linkPreview();
  23                 $textarea.keyup(function(){
  24                         var textlen = $(this).val().length;
  25                         $('#character-counter').text(textlen);
  26                 });
  27                 $textarea.editor_autocomplete(baseurl+"/acl");
  28                 $textarea.bbco_autocomplete('bbcode');
  29
  30                 let $acl_allow_input = $('#acl_allow');
  31                 let $group_allow_input = $('[name=group_allow]');
  32                 let $contact_allow_input = $('[name=contact_allow]');
  33                 let $acl_deny_input = $('#acl_deny');
  34                 let $group_deny_input = $('[name=group_deny]');
  35                 let $contact_deny_input = $('[name=contact_deny]');
  36
  37                 // Visibility accordion
  38
  39                 // Prevents open panel to collapse
  40                 // @see https://stackoverflow.com/a/43593116
  41                 $('[data-toggle="collapse"]').click(function(e) {
  42                         target = $(this).attr('href');
  43                         if ($(target).hasClass('in')) {
  44                                 e.preventDefault(); // to stop the page jump to the anchor target.
  45                                 e.stopPropagation()
  46                         }
  47                 });
  48                 // Accessibility: enable space and enter to open a panel when focused
  49                 $('body').on('keyup', '[data-toggle="collapse"]:focus', function (e) {
  50                         if (e.key === ' ' || e.key === 'Enter') {
  51                                 $(this).click();
  52                                 e.preventDefault();
  53                                 e.stopPropagation();
  54                         }
  55                 });
  56
  57                 $('#visibility-public-panel').on('show.bs.collapse', function() {
  58                         $('#visibility-public').prop('checked', true);
  59                         $group_allow_input.prop('disabled', true);
  60                         $contact_allow_input.prop('disabled', true);
  61                         $group_deny_input.prop('disabled', true);
  62                         $contact_deny_input.prop('disabled', true);
  63
  64                         $('.profile-jot-net input[type=checkbox]').each(function() {
  65                                 // Restores checkbox state if it had been saved
  66                                 if ($(this).attr('data-checked') !== undefined) {
  67                                         $(this).prop('checked', $(this).attr('data-checked') === 'true');
  68                                 }
  69                         });
  70                         $('.profile-jot-net input').attr('disabled', false);
  71                 });
  72
  73                 $('#visibility-custom-panel').on('show.bs.collapse', function() {
  74                         $('#visibility-custom').prop('checked', true);
  75                         $group_allow_input.prop('disabled', false);
  76                         $contact_allow_input.prop('disabled', false);
  77                         $group_deny_input.prop('disabled', false);
  78                         $contact_deny_input.prop('disabled', false);
  79
  80                         $('.profile-jot-net input[type=checkbox]').each(function() {
  81                                 // Saves current checkbox state
  82                                 $(this)
  83                                         .attr('data-checked', $(this).prop('checked'))
  84                                         .prop('checked', false);
  85                         });
  86                         $('.profile-jot-net input').attr('disabled', 'disabled');
  87                 });
  88
  89                 if (document.querySelector('input[name="visibility"]:checked').value === 'custom') {
  90                         $('#visibility-custom-panel').collapse({parent: '#visibility-accordion'});
  91                 }
  92
  93                 // Custom visibility tags inputs
  94
  95                 let acl_groups = new Bloodhound({
  96                         local: {{$acl_groups|@json_encode nofilter}},
  97                         identify: function(obj) { return obj.id; },
  98                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name']),
  99                         queryTokenizer: Bloodhound.tokenizers.whitespace,
 100                 });
 101                 let acl_contacts = new Bloodhound({
 102                         local: {{$acl_contacts|@json_encode nofilter}},
 103                         identify: function(obj) { return obj.id; },
 104                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
 105                         queryTokenizer: Bloodhound.tokenizers.whitespace,
 106                 });
 107                 let acl = new Bloodhound({
 108                         local: {{$acl|@json_encode nofilter}},
 109                         identify: function(obj) { return obj.id; },
 110                         datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
 111                         queryTokenizer: Bloodhound.tokenizers.whitespace,
 112                 });
 113                 acl.initialize();
 114
 115                 let suggestionTemplate = function (item) {
 116                         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>';
 117                 };
 118
 119                 $acl_allow_input.tagsinput({
 120                         confirmKeys: [13, 44],
 121                         cancelConfirmKeysOnEmpty: true,
 122                         freeInput: false,
 123                         tagClass: function(item) {
 124                                 switch (item.type) {
 125                                         case 'group'   : return 'label label-primary';
 126                                         case 'contact'  :
 127                                         default:
 128                                                 return 'label label-info';
 129                                 }
 130                         },
 131                         itemValue: 'id',
 132                         itemText: 'name',
 133                         itemThumb: 'micro',
 134                         itemTitle: function(item) {
 135                                 return item.addr;
 136                         },
 137                         typeaheadjs: {
 138                                 name: 'contacts',
 139                                 displayKey: 'name',
 140                                 templates: {
 141                                         suggestion: suggestionTemplate
 142                                 },
 143                                 source: acl.ttAdapter()
 144                         }
 145                 });
 146
 147                 $acl_deny_input
 148                 .tagsinput({
 149                         confirmKeys: [13, 44],
 150                         freeInput: false,
 151                         tagClass: function(item) {
 152                                 switch (item.type) {
 153                                         case 'group'   : return 'label label-primary';
 154                                         case 'contact'  :
 155                                         default:
 156                                                 return 'label label-info';
 157                                 }
 158                         },
 159                         itemValue: 'id',
 160                         itemText: 'name',
 161                         itemThumb: 'micro',
 162                         itemTitle: function(item) {
 163                                 return item.addr;
 164                         },
 165                         typeaheadjs: {
 166                                 name: 'contacts',
 167                                 displayKey: 'name',
 168                                 templates: {
 169                                         suggestion: suggestionTemplate
 170                                 },
 171                                 source: acl.ttAdapter()
 172                         }
 173                 });
 174
 175                 // Import existing ACL into the tags input fields.
 176
 177                 $group_allow_input.val().split(',').forEach(function (val) {
 178                         $acl_allow_input.tagsinput('add', acl_groups.get(val)[0]);
 179                 });
 180                 $contact_allow_input.val().split(',').forEach(function (val) {
 181                         $acl_allow_input.tagsinput('add', acl_contacts.get(val)[0]);
 182                 });
 183                 $group_deny_input.val().split(',').forEach(function (val) {
 184                         $acl_deny_input.tagsinput('add', acl_groups.get(val)[0]);
 185                 });
 186                 $contact_deny_input.val().split(',').forEach(function (val) {
 187                         $acl_deny_input.tagsinput('add', acl_contacts.get(val)[0]);
 188                 });
 189
 190                 // Anti-duplicate callback + acl fields value generation
 191
 192                 $acl_allow_input.on('itemAdded', function (event) {
 193                         // Removes duplicate in the opposite acl box
 194                         $acl_deny_input.tagsinput('remove', event.item);
 195
 196                         // Update the real acl field
 197                         $group_allow_input.val('');
 198                         $contact_allow_input.val('');
 199                         [].forEach.call($acl_allow_input.tagsinput('items'), function (item) {
 200                                 if (item.type === 'group') {
 201                                         $group_allow_input.val($group_allow_input.val() + '<' + item.id + '>');
 202                                 } else {
 203                                         $contact_allow_input.val($contact_allow_input.val() + '<' + item.id + '>');
 204                                 }
 205                         });
 206                 });
 207
 208                 $acl_deny_input.on('itemAdded', function (event) {
 209                         // Removes duplicate in the opposite acl box
 210                         $acl_allow_input.tagsinput('remove', event.item);
 211
 212                         // Update the real acl field
 213                         $group_deny_input.val('');
 214                         $contact_deny_input.val('');
 215                         [].forEach.call($acl_deny_input.tagsinput('items'), function (item) {
 216                                 if (item.type === 'group') {
 217                                         $group_deny_input.val($group_allow_input.val() + '<' + item.id + '>');
 218                                 } else {
 219                                         $contact_deny_input.val($contact_allow_input.val() + '<' + item.id + '>');
 220                                 }
 221                         });
 222                 });
 223
 224                 let location_button = document.getElementById('profile-location');
 225                 let location_input = document.getElementById('jot-location');
 226
 227                 updateLocationButtonDisplay(location_button, location_input);
 228
 229                 location_input.addEventListener('change', function () {
 230                         updateLocationButtonDisplay(location_button, location_input);
 231                 });
 232                 location_input.addEventListener('keyup', function () {
 233                         updateLocationButtonDisplay(location_button, location_input);
 234                 });
 235
 236                 location_button.addEventListener('click', function() {
 237                         if (location_input.value) {
 238                                 location_input.value = '';
 239                                 updateLocationButtonDisplay(location_button, location_input);
 240                         } else if ("geolocation" in navigator) {
 241                                 navigator.geolocation.getCurrentPosition(function(position) {
 242                                         location_input.value = position.coords.latitude + ', ' + position.coords.longitude;
 243                                         updateLocationButtonDisplay(location_button, location_input);
 244                                 }, function (error) {
 245                                         location_button.disabled = true;
 246                                         updateLocationButtonDisplay(location_button, location_input);
 247                                 });
 248                         }
 249                 });
 250         })
 251 </script>