Merge pull request #380 from git-marijus/dev

instead of radio buttons use select to choose between public and custom selection
This commit is contained in:
redmatrix 2016-05-14 08:11:51 +10:00
commit 0db1594f95
3 changed files with 70 additions and 59 deletions

View File

@ -271,7 +271,8 @@ function populate_acl($defaults = null,$show_jotnets = true, $emptyACL_descripti
'$showall' => $showall_caption,
'$showallOrigin' => $showall_origin,
'$showallIcon' => $showall_icon,
'$showlimited' => t("Limit access:"),
'$select_label' => t('Who can see this'),
'$showlimited' => t('Custom selection'),
'$showlimitedDesc' => t('Select "Show" to allow viewing. "Don\'t show" lets you override and limit the scope of "Show".'),
'$show' => t("Show"),
'$hide' => t("Don't show"),

View File

@ -11,30 +11,44 @@ function ACL(backend_url, preset) {
that.deny_cid = (preset[2] || []);
that.deny_gid = (preset[3] || []);
that.group_uids = [];
that.nw = 4; //items per row. should be calulated from #acl-list.width
that.info = $("#acl-info");
that.list = $("#acl-list");
that.list_content = $("#acl-list-content");
that.item_tpl = unescape($(".acl-list-item[rel=acl-template]").html());
that.showall = $("#acl-showall");
that.showlimited = $("#acl-showlimited");
that.acl_select = $("#acl-select");
that.preset = preset;
that.self = [];
// set the initial ACL lists in case the enclosing form gets submitted before the ajax loader completes.
that.on_submit();
if (preset.length === 0) that.showall.removeClass("btn-default").addClass("btn-warning");
/*events*/
$(document).ready(function() {
that.showall.click(that.on_showall);
that.showlimited.click(that.on_showlimited);
$(document).on('click','.acl-button-show',that.on_button_show);
$(document).on('click','.acl-button-hide',that.on_button_hide);
$("#acl-search").keypress(that.on_search);
/* startup! */
that.get(0,15000);
that.on_submit();
that.acl_select.change(function(event) {
var option = that.acl_select.val();
if(option == 'option1') { // public
that.on_showall(event);
}
if(option == 'option2') { // restricted
that.on_showlimited(event);
}
});
$(document).on('click','.acl-button-show',that.on_button_show);
$(document).on('click','.acl-button-hide',that.on_button_hide);
$("#acl-search").keypress(that.on_search);
/* startup! */
that.get(0,15000);
that.on_submit();
});
}
@ -73,15 +87,9 @@ ACL.prototype.on_search = function(event) {
};
ACL.prototype.on_showall = function(event) {
// preventDefault() isn't called here as we want state changes from update_view() to be applied to the radiobutton
event.stopPropagation();
if (that.showall.hasClass("btn-warning")) {
return false;
}
that.showall.removeClass("btn-default").addClass("btn-warning");
that.allow_cid = [];
that.allow_gid = [];
that.deny_cid = [];
@ -94,11 +102,22 @@ ACL.prototype.on_showall = function(event) {
};
ACL.prototype.on_showlimited = function(event) {
// Prevent the radiobutton from being selected, as the showlimited radiobutton
// option is selected only by selecting show or hide options on channels or groups.
event.preventDefault();
// preventDefault() isn't called here as we want state changes from update_view() to be applied to the radiobutton
event.stopPropagation();
return false;
if(that.preset[0].length === 0 && that.preset[1].length === 0 && that.preset[2].length === 0 && that.preset[3].length === 0) {
that.preset[0] = [that.self[0]];
}
that.allow_cid = (that.preset[0] || []);
that.allow_gid = (that.preset[1] || []);
that.deny_cid = (that.preset[2] || []);
that.deny_gid = (that.preset[3] || []);
that.update_view();
that.on_submit();
return true; // return true so that state changes from update_view() will be applied
}
ACL.prototype.on_selectall = function(event) {
@ -199,29 +218,26 @@ ACL.prototype.set_deny = function(itemid) {
that.update_view();
};
ACL.prototype.update_radiobuttons = function(isPublic) {
that.showall.prop('checked', isPublic);
that.showlimited.prop('checked', !isPublic);
that.showlimited.prop('disabled', isPublic);
ACL.prototype.update_select = function(isPublic) {
that.showall.prop('selected', isPublic);
that.showlimited.prop('selected', !isPublic);
};
ACL.prototype.update_view = function() {
if (that.allow_gid.length === 0 && that.allow_cid.length === 0 &&
that.deny_gid.length === 0 && that.deny_cid.length === 0) {
// btn-warning indicates that the permissions are public, it was chosen because
// that.showall used to be a normal button, which btn-warning is a bootstrap style for.
that.showall.removeClass("btn-default").addClass("btn-warning");
that.update_radiobuttons(true);
if (that.allow_gid.length === 0 && that.allow_cid.length === 0 && that.deny_gid.length === 0 && that.deny_cid.length === 0) {
that.list.hide(); //hide acl-list
that.info.show(); //show acl-info
that.update_select(true);
/* jot acl */
$('#jot-perms-icon, #dialog-perms-icon').removeClass('fa-lock').addClass('fa-unlock');
$('#jot-public').show();
$('.profile-jot-net input').attr('disabled', false);
/* jot acl */
$('#jot-perms-icon, #dialog-perms-icon').removeClass('fa-lock').addClass('fa-unlock');
$('#jot-public').show();
$('.profile-jot-net input').attr('disabled', false);
} else {
that.showall.removeClass("btn-warning").addClass("btn-default");
that.update_radiobuttons(false);
that.list.show(); //show acl-list
that.info.hide(); //hide acl-info
that.update_select(false);
/* jot acl */
$('#jot-perms-icon, #dialog-perms-icon').removeClass('fa-unlock').addClass('fa-lock');
@ -300,12 +316,11 @@ ACL.prototype.get = function(start, count, search) {
};
ACL.prototype.populate = function(data) {
var height = Math.ceil(data.items.length / that.nw) * 42;
that.list_content.height(height);
$(data.items).each(function(){
html = "<div class='acl-list-item {4} {7} {5}' title='{6}' id='{2}{3}'>"+that.item_tpl+"</div>";
html = html.format(this.photo, this.name, this.type, this.xid, '', this.self, this.link, this.taggable);
if (this.uids !== undefined) that.group_uids[this.xid] = this.uids;
if (this.self === 'abook-self') that.self[0] = this.xid;
//console.log(html);
that.list_content.append(html);
});

View File

@ -12,6 +12,18 @@
{{if $aclModalDesc}}
<div id="acl-dialog-description" class="section-content-info-wrapper">{{$aclModalDesc}}</div>
{{/if}}
<label for="acl-select">{{$select_label}}</label>
<select id="acl-select" name="optionsRadios" class="form-control form-group">
<option id="acl-showall" value="option1" selected>{{$showall}}</option>
<option id="acl-showlimited" value="option2">{{$showlimited}}</option>
</select>
{{if $showallOrigin}}
<div id="acl-info" class="form-group">
<i class="fa fa-info-circle"></i>&nbsp;{{$showallOrigin}}
</div>
{{/if}}
{{if $jotnets}}
<div class="jotnets-wrapper" role="tab" id="jotnets-wrapper">
<a data-toggle="collapse" class="btn btn-block btn-default" href="#jotnets-collapse" aria-expanded="false" aria-controls="jotnets-collapse">{{$jnetModalTitle}} <span class="caret"></span></a>
@ -21,25 +33,8 @@
<div class="clear"></div>
</div>
{{/if}}
<div id="acl-wrapper">
<div id="acl-radiowrapper-showall" class="radio">
<label>
<input id="acl-showall" type="radio" name="optionsRadios" value="option1" checked>
{{if $showallIcon}}
<i class="fa {{$showallIcon}}"></i>
{{/if}}
<span id="acl-showall-caption">{{$showall}}</span>
</label>
{{if $showallOrigin}}
&nbsp;<a id="acl-info-icon" role="button" tabindex="0" class="fa fa-info-circle" data-trigger="focus" data-toggle="popover" data-placement="top" data-content="{{$showallOrigin}}"></a>
{{/if}}
</div>
<div id="acl-radiowrapper-showlimited" class="radio">
<label>
<input id="acl-showlimited" type="radio" name="optionsRadios" style="readonly" value="option2">
<span id=acl-showlimited-caption>{{$showlimited}}</span>
</label>
</div>
<div id="acl-list">
<div id="acl-search-wrapper">
<input type="text" id="acl-search" placeholder="&#xf002; {{$search}}">