Update composer module to use the new ACL selector
- Remove ACL-specific code from compose-footer - Move compose-footer template remaining content to compose.js
This commit is contained in:
parent
39d0735236
commit
8f4f6899dd
4 changed files with 107 additions and 417 deletions
|
@ -1,250 +0,0 @@
|
|||
<script type="text/javascript">
|
||||
function updateLocationButtonDisplay(location_button, location_input)
|
||||
{
|
||||
location_button.classList.remove('btn-primary');
|
||||
if (location_input.value) {
|
||||
location_button.disabled = false;
|
||||
location_button.classList.add('btn-primary');
|
||||
location_button.title = location_button.dataset.titleClear;
|
||||
} else if (!"geolocation" in navigator) {
|
||||
location_button.disabled = true;
|
||||
location_button.title = location_button.dataset.titleUnavailable;
|
||||
} else if (location_button.disabled) {
|
||||
location_button.title = location_button.dataset.titleDisabled;
|
||||
} else {
|
||||
location_button.title = location_button.dataset.titleSet;
|
||||
}
|
||||
}
|
||||
|
||||
$(function() {
|
||||
// Jot attachment live preview.
|
||||
let $textarea = $('#comment-edit-text-0');
|
||||
$textarea.linkPreview();
|
||||
$textarea.keyup(function(){
|
||||
var textlen = $(this).val().length;
|
||||
$('#character-counter').text(textlen);
|
||||
});
|
||||
$textarea.editor_autocomplete(baseurl + '/search/acl');
|
||||
$textarea.bbco_autocomplete('bbcode');
|
||||
|
||||
let $acl_allow_input = $('#acl_allow');
|
||||
let $group_allow_input = $('[name=group_allow]');
|
||||
let $contact_allow_input = $('[name=contact_allow]');
|
||||
let $acl_deny_input = $('#acl_deny');
|
||||
let $group_deny_input = $('[name=group_deny]');
|
||||
let $contact_deny_input = $('[name=contact_deny]');
|
||||
|
||||
// Visibility accordion
|
||||
|
||||
// Prevents open panel to collapse
|
||||
// @see https://stackoverflow.com/a/43593116
|
||||
$('[data-toggle="collapse"]').click(function(e) {
|
||||
target = $(this).attr('href');
|
||||
if ($(target).hasClass('in')) {
|
||||
e.preventDefault(); // to stop the page jump to the anchor target.
|
||||
e.stopPropagation()
|
||||
}
|
||||
});
|
||||
// Accessibility: enable space and enter to open a panel when focused
|
||||
$('body').on('keyup', '[data-toggle="collapse"]:focus', function (e) {
|
||||
if (e.key === ' ' || e.key === 'Enter') {
|
||||
$(this).click();
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}
|
||||
});
|
||||
|
||||
$('#visibility-public-panel').on('show.bs.collapse', function() {
|
||||
$('#visibility-public').prop('checked', true);
|
||||
$group_allow_input.prop('disabled', true);
|
||||
$contact_allow_input.prop('disabled', true);
|
||||
$group_deny_input.prop('disabled', true);
|
||||
$contact_deny_input.prop('disabled', true);
|
||||
|
||||
$('.profile-jot-net input[type=checkbox]').each(function() {
|
||||
// Restores checkbox state if it had been saved
|
||||
if ($(this).attr('data-checked') !== undefined) {
|
||||
$(this).prop('checked', $(this).attr('data-checked') === 'true');
|
||||
}
|
||||
});
|
||||
$('.profile-jot-net input').attr('disabled', false);
|
||||
});
|
||||
|
||||
$('#visibility-custom-panel').on('show.bs.collapse', function() {
|
||||
$('#visibility-custom').prop('checked', true);
|
||||
$group_allow_input.prop('disabled', false);
|
||||
$contact_allow_input.prop('disabled', false);
|
||||
$group_deny_input.prop('disabled', false);
|
||||
$contact_deny_input.prop('disabled', false);
|
||||
|
||||
$('.profile-jot-net input[type=checkbox]').each(function() {
|
||||
// Saves current checkbox state
|
||||
$(this)
|
||||
.attr('data-checked', $(this).prop('checked'))
|
||||
.prop('checked', false);
|
||||
});
|
||||
$('.profile-jot-net input').attr('disabled', 'disabled');
|
||||
});
|
||||
|
||||
if (document.querySelector('input[name="visibility"]:checked').value === 'custom') {
|
||||
$('#visibility-custom-panel').collapse({parent: '#visibility-accordion'});
|
||||
}
|
||||
|
||||
// Custom visibility tags inputs
|
||||
|
||||
let acl_groups = new Bloodhound({
|
||||
local: {{$acl_groups|@json_encode nofilter}},
|
||||
identify: function(obj) { return obj.id; },
|
||||
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name']),
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
});
|
||||
let acl_contacts = new Bloodhound({
|
||||
local: {{$acl_contacts|@json_encode nofilter}},
|
||||
identify: function(obj) { return obj.id; },
|
||||
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
});
|
||||
let acl = new Bloodhound({
|
||||
local: {{$acl|@json_encode nofilter}},
|
||||
identify: function(obj) { return obj.id; },
|
||||
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(['name', 'addr']),
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
});
|
||||
acl.initialize();
|
||||
|
||||
let suggestionTemplate = function (item) {
|
||||
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>';
|
||||
};
|
||||
|
||||
$acl_allow_input.tagsinput({
|
||||
confirmKeys: [13, 44],
|
||||
freeInput: false,
|
||||
tagClass: function(item) {
|
||||
switch (item.type) {
|
||||
case 'group' : return 'label label-primary';
|
||||
case 'contact' :
|
||||
default:
|
||||
return 'label label-info';
|
||||
}
|
||||
},
|
||||
itemValue: 'id',
|
||||
itemText: 'name',
|
||||
itemThumb: 'micro',
|
||||
itemTitle: function(item) {
|
||||
return item.addr;
|
||||
},
|
||||
typeaheadjs: {
|
||||
name: 'contacts',
|
||||
displayKey: 'name',
|
||||
templates: {
|
||||
suggestion: suggestionTemplate
|
||||
},
|
||||
source: acl.ttAdapter()
|
||||
}
|
||||
});
|
||||
|
||||
$acl_deny_input
|
||||
.tagsinput({
|
||||
confirmKeys: [13, 44],
|
||||
freeInput: false,
|
||||
tagClass: function(item) {
|
||||
switch (item.type) {
|
||||
case 'group' : return 'label label-primary';
|
||||
case 'contact' :
|
||||
default:
|
||||
return 'label label-info';
|
||||
}
|
||||
},
|
||||
itemValue: 'id',
|
||||
itemText: 'name',
|
||||
itemThumb: 'micro',
|
||||
itemTitle: function(item) {
|
||||
return item.addr;
|
||||
},
|
||||
typeaheadjs: {
|
||||
name: 'contacts',
|
||||
displayKey: 'name',
|
||||
templates: {
|
||||
suggestion: suggestionTemplate
|
||||
},
|
||||
source: acl.ttAdapter()
|
||||
}
|
||||
});
|
||||
|
||||
// Import existing ACL into the tags input fields.
|
||||
|
||||
$group_allow_input.val().split(',').forEach(function (val) {
|
||||
$acl_allow_input.tagsinput('add', acl_groups.get(val)[0]);
|
||||
});
|
||||
$contact_allow_input.val().split(',').forEach(function (val) {
|
||||
$acl_allow_input.tagsinput('add', acl_contacts.get(val)[0]);
|
||||
});
|
||||
$group_deny_input.val().split(',').forEach(function (val) {
|
||||
$acl_deny_input.tagsinput('add', acl_groups.get(val)[0]);
|
||||
});
|
||||
$contact_deny_input.val().split(',').forEach(function (val) {
|
||||
$acl_deny_input.tagsinput('add', acl_contacts.get(val)[0]);
|
||||
});
|
||||
|
||||
// Anti-duplicate callback + acl fields value generation
|
||||
|
||||
$acl_allow_input.on('itemAdded', function (event) {
|
||||
// Removes duplicate in the opposite acl box
|
||||
$acl_deny_input.tagsinput('remove', event.item);
|
||||
|
||||
// Update the real acl field
|
||||
$group_allow_input.val('');
|
||||
$contact_allow_input.val('');
|
||||
[].forEach.call($acl_allow_input.tagsinput('items'), function (item) {
|
||||
if (item.type === 'group') {
|
||||
$group_allow_input.val($group_allow_input.val() + '<' + item.id + '>');
|
||||
} else {
|
||||
$contact_allow_input.val($contact_allow_input.val() + '<' + item.id + '>');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$acl_deny_input.on('itemAdded', function (event) {
|
||||
// Removes duplicate in the opposite acl box
|
||||
$acl_allow_input.tagsinput('remove', event.item);
|
||||
|
||||
// Update the real acl field
|
||||
$group_deny_input.val('');
|
||||
$contact_deny_input.val('');
|
||||
[].forEach.call($acl_deny_input.tagsinput('items'), function (item) {
|
||||
if (item.type === 'group') {
|
||||
$group_deny_input.val($group_allow_input.val() + '<' + item.id + '>');
|
||||
} else {
|
||||
$contact_deny_input.val($contact_allow_input.val() + '<' + item.id + '>');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
let location_button = document.getElementById('profile-location');
|
||||
let location_input = document.getElementById('jot-location');
|
||||
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
|
||||
location_input.addEventListener('change', function () {
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
location_input.addEventListener('keyup', function () {
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
|
||||
location_button.addEventListener('click', function() {
|
||||
if (location_input.value) {
|
||||
location_input.value = '';
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
} else if ("geolocation" in navigator) {
|
||||
navigator.geolocation.getCurrentPosition(function(position) {
|
||||
location_input.value = position.coords.latitude + ', ' + position.coords.longitude;
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
}, function (error) {
|
||||
location_button.disabled = true;
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
|
@ -74,82 +74,18 @@
|
|||
|
||||
<div id="comment-edit-preview-{{$id}}" class="comment-edit-preview" style="display:none;"></div>
|
||||
|
||||
<input type="hidden" name="group_allow" value="{{$group_allow}}" {{if $visibility == 'public'}}disabled{{/if}}/>
|
||||
<input type="hidden" name="contact_allow" value="{{$contact_allow}}" {{if $visibility == 'public'}}disabled{{/if}}/>
|
||||
<input type="hidden" name="group_deny" value="{{$group_deny}}" {{if $visibility == 'public'}}disabled{{/if}}/>
|
||||
<input type="hidden" name="contact_deny" value="{{$contact_deny}}" {{if $visibility == 'public'}}disabled{{/if}}/>
|
||||
{{if $type == 'post'}}
|
||||
<h3>Visibility</h3>
|
||||
<div class="panel-group" id="visibility-accordion" role="tablist" aria-multiselectable="true">
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading" id="visibility-public-heading" role="button" data-toggle="collapse" data-parent="#visibility-accordion" href="#visibility-public-panel" aria-expanded="true" aria-controls="visibility-public-panel" tabindex="14">
|
||||
<label>
|
||||
<input type="radio" name="visibility" id="visibility-public" value="public" {{if $visibility == 'public'}}checked{{/if}} style="display:none">
|
||||
<i class="fa fa-globe"></i> {{$public_title}}
|
||||
</label>
|
||||
</div>
|
||||
<div id="visibility-public-panel" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="visibility-public-heading">
|
||||
<div class="panel-body">
|
||||
<p>{{$public_desc}}</p>
|
||||
{{if $doesFederate && $jotnets_fields}}
|
||||
{{if $jotnets_fields|count < 3}}
|
||||
<div class="profile-jot-net">
|
||||
{{else}}
|
||||
<details class="profile-jot-net">
|
||||
<summary>{{$jotnets_summary}}</summary>
|
||||
{{/if}}
|
||||
<h3>{{$visibility_title}}</h3>
|
||||
{{$acl_selector nofilter}}
|
||||
|
||||
{{foreach $jotnets_fields as $jotnets_field}}
|
||||
{{if $jotnets_field.type == 'checkbox'}}
|
||||
{{include file="field_checkbox.tpl" field=$jotnets_field.field}}
|
||||
{{elseif $jotnets_field.type == 'select'}}
|
||||
{{include file="field_select.tpl" field=$jotnets_field.field}}
|
||||
{{/if}}
|
||||
{{/foreach}}
|
||||
|
||||
{{if $jotnets_fields|count >= 3}}
|
||||
</details>
|
||||
{{else}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-info">
|
||||
<div class="panel-heading collapsed" id="visibility-custom-heading" role="button" data-toggle="collapse" data-parent="#visibility-accordion" href="#visibility-custom-panel" aria-expanded="true" aria-controls="visibility-custom-panel" tabindex="15">
|
||||
<label>
|
||||
<input type="radio" name="visibility" id="visibility-custom" value="custom" {{if $visibility == 'custom'}}checked{{/if}} style="display:none">
|
||||
<i class="fa fa-lock"></i> {{$custom_title}}
|
||||
</label>
|
||||
</div>
|
||||
<div id="visibility-custom-panel" class="panel-collapse collapse" role="tabpanel" aria-labelledby="visibility-custom-heading">
|
||||
<div class="panel-body">
|
||||
<p>{{$custom_desc}}</p>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="acl_allow">Deliver to:</label>
|
||||
<input type="text" class="form-control input-lg" id="acl_allow">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="acl_deny">Except to:</label>
|
||||
<input type="text" class="form-control input-lg" id="acl_deny">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{if $doesFederate}}
|
||||
<div class="form-group">
|
||||
<label for="profile-jot-email" id="profile-jot-email-label">{{$emailcc}}</label>
|
||||
<input type="text" name="emailcc" id="profile-jot-email" class="form-control" title="{{$emtitle}}" />
|
||||
</div>
|
||||
<div id="profile-jot-email-end"></div>
|
||||
{{/if}}
|
||||
<div class="jotplugins">
|
||||
{{$jotplugins nofilter}}
|
||||
</div>
|
||||
{{else}}
|
||||
<input type="hidden" name="group_allow" value="{{$group_allow}}"/>
|
||||
<input type="hidden" name="contact_allow" value="{{$contact_allow}}"/>
|
||||
<input type="hidden" name="group_deny" value="{{$group_deny}}"/>
|
||||
<input type="hidden" name="contact_deny" value="{{$contact_deny}}"/>
|
||||
{{/if}}
|
||||
</form>
|
||||
</div>
|
||||
|
|
57
view/theme/frio/js/compose.js
Normal file
57
view/theme/frio/js/compose.js
Normal file
|
@ -0,0 +1,57 @@
|
|||
$(function() {
|
||||
// Jot attachment live preview.
|
||||
let $textarea = $('textarea[name=body]');
|
||||
$textarea.linkPreview();
|
||||
$textarea.keyup(function(){
|
||||
var textlen = $(this).val().length;
|
||||
$('#character-counter').text(textlen);
|
||||
});
|
||||
$textarea.editor_autocomplete(baseurl + '/search/acl');
|
||||
$textarea.bbco_autocomplete('bbcode');
|
||||
|
||||
let location_button = document.getElementById('profile-location');
|
||||
let location_input = document.getElementById('jot-location');
|
||||
|
||||
if (location_button && location_input) {
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
|
||||
location_input.addEventListener('change', function () {
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
location_input.addEventListener('keyup', function () {
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
|
||||
location_button.addEventListener('click', function() {
|
||||
if (location_input.value) {
|
||||
location_input.value = '';
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
} else if ("geolocation" in navigator) {
|
||||
navigator.geolocation.getCurrentPosition(function(position) {
|
||||
location_input.value = position.coords.latitude + ', ' + position.coords.longitude;
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
}, function (error) {
|
||||
location_button.disabled = true;
|
||||
updateLocationButtonDisplay(location_button, location_input);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function updateLocationButtonDisplay(location_button, location_input)
|
||||
{
|
||||
location_button.classList.remove('btn-primary');
|
||||
if (location_input.value) {
|
||||
location_button.disabled = false;
|
||||
location_button.classList.add('btn-primary');
|
||||
location_button.title = location_button.dataset.titleClear;
|
||||
} else if (!"geolocation" in navigator) {
|
||||
location_button.disabled = true;
|
||||
location_button.title = location_button.dataset.titleUnavailable;
|
||||
} else if (location_button.disabled) {
|
||||
location_button.title = location_button.dataset.titleDisabled;
|
||||
} else {
|
||||
location_button.title = location_button.dataset.titleSet;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue