diff --git a/phpBB/adm/style/acp_permissions.html b/phpBB/adm/style/acp_permissions.html index 6dc9dca2e7..004027df41 100644 --- a/phpBB/adm/style/acp_permissions.html +++ b/phpBB/adm/style/acp_permissions.html @@ -327,14 +327,9 @@

- - + -
+ {S_HIDDEN_FIELDS} diff --git a/phpBB/adm/style/admin.css b/phpBB/adm/style/admin.css index b03cb0ba24..145bcfaec1 100644 --- a/phpBB/adm/style/admin.css +++ b/phpBB/adm/style/admin.css @@ -1858,6 +1858,7 @@ li.pagination ul { color: #000; text-align: center; border: 1px solid #AAA; + opacity: .95; } .tooltip span.top { @@ -2435,6 +2436,39 @@ fieldset.permissions .padding { display: none !important; } +.roles-options > .dropdown { + left: auto; + top: 3em; + width: 250px; +} + +.roles-options { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + width: 250px; +} + +.roles-options > span { + border: 1px solid #DEDEDE; + border-radius: 3px; + padding: 4px; + width: 250px; + display: block; + background: url('../images/arrow_down.gif') no-repeat 245px .7em; +} + +.roles-options li { + list-style: none; +} + +.roles-highlight { + background-color: #1e90ff; + color: #fff; +} + /* Classes for additional tasks ---------------------------------------- */ diff --git a/phpBB/adm/style/permission_mask.html b/phpBB/adm/style/permission_mask.html index 7b5c071693..347da3181e 100644 --- a/phpBB/adm/style/permission_mask.html +++ b/phpBB/adm/style/permission_mask.html @@ -39,11 +39,23 @@
- -
- + {% if role_options %} +
+
+ {L_NO_ROLE_ASSIGNED} + + +
+
+ {% else %}
{L_NO_ROLE_AVAILABLE}
- + {% endif %}
diff --git a/phpBB/adm/style/tooltip.js b/phpBB/adm/style/tooltip.js index 3a89008706..68964034f0 100644 --- a/phpBB/adm/style/tooltip.js +++ b/phpBB/adm/style/tooltip.js @@ -10,206 +10,196 @@ phpBB Development Team: - further adjustements */ -var head_text, tooltip_mode; +(function($) { // Avoid conflicts with other libraries + +'use strict'; + +var tooltips = []; /** -* Enable tooltip replacements for links + * Enable tooltip replacements for selects + * @param {string} id ID tag of select + * @param {string} headline Text that should appear on top of tooltip + * @param {string} [subId] Sub ID that should only be using tooltips (optional) */ -function enable_tooltips_link(id, headline, sub_id) { - var links, i, hold; +phpbb.enableTooltipsSelect = function (id, headline, subId) { + var $links, hold; - head_text = headline; + hold = $('', { + id: '_tooltip_container', + css: { + position: 'absolute' + } + }); - if (!document.getElementById || !document.getElementsByTagName) { - return; - } + $('body').append(hold); - hold = document.createElement('span'); - hold.id = '_tooltip_container'; - hold.setAttribute('id', '_tooltip_container'); - hold.style.position = 'absolute'; - - document.getElementsByTagName('body')[0].appendChild(hold); - - if (id === null) { - links = document.getElementsByTagName('a'); + if (!id) { + $links = $('.roles-options li'); } else { - links = document.getElementById(id).getElementsByTagName('a'); + $links = $('.roles-options li', '#' + id); } - for (i = 0; i < links.length; i++) { - if (sub_id) { - if (links[i].id.substr(0, sub_id.length) === sub_id) { - prepare(links[i]); + $links.each(function () { + var $this = $(this); + + if (subId) { + if ($this.parent().attr('id').substr(0, subId.length) === subId) { + phpbb.prepareTooltips($this, headline); } } else { - prepare(links[i]); + phpbb.prepareTooltips($this, headline); } - } - - tooltip_mode = 'link'; -} + }); +}; /** -* Enable tooltip replacements for selects + * Prepare elements to replace + * + * @param {jQuery} $element Element to prepare for tooltips + * @param {string} headText Text heading to display */ -function enable_tooltips_select(id, headline, sub_id) { - var links, i, hold; +phpbb.prepareTooltips = function ($element, headText) { + var $tooltip, text, $desc, $title; - head_text = headline; - - if (!document.getElementById || !document.getElementsByTagName) { - return; - } - - hold = document.createElement('span'); - hold.id = '_tooltip_container'; - hold.setAttribute('id', '_tooltip_container'); - hold.style.position = 'absolute'; - - document.getElementsByTagName('body')[0].appendChild(hold); - - if (id === null) { - links = document.getElementsByTagName('option'); - } else { - links = document.getElementById(id).getElementsByTagName('option'); - } - - for (i = 0; i < links.length; i++) { - if (sub_id) { - if (links[i].parentNode.id.substr(0, sub_id.length) === sub_id) { - prepare(links[i]); - } - } else { - prepare(links[i]); - } - } - - tooltip_mode = 'select'; -} - -/** -* Prepare elements to replace -*/ -function prepare(element) { - var tooltip, text, desc, title; - - text = element.getAttribute('title'); + text = $element.attr('data-title'); if (text === null || text.length === 0) { return; } - element.removeAttribute('title'); - tooltip = create_element('span', 'tooltip'); + $title = $('', { + class: 'top', + css: { + display: 'block' + } + }) + .append(document.createTextNode(headText)); - title = create_element('span', 'top'); - title.appendChild(document.createTextNode(head_text)); - tooltip.appendChild(title); + $desc = $('', { + class: 'bottom', + html: text, + css: { + display: 'block' + } + }); - desc = create_element('span', 'bottom'); - desc.innerHTML = text; - tooltip.appendChild(desc); + $tooltip = $('', { + class: 'tooltip', + css: { + display: 'block' + } + }) + .append($title) + .append($desc); - set_opacity(tooltip); - - element.tooltip = tooltip; - element.onmouseover = show_tooltip; - element.onmouseout = hide_tooltip; - - if (tooltip_mode === 'link') { - element.onmousemove = locate; - } -} + tooltips[$element.attr('data-id')] = $tooltip; + $element.on('mouseover', phpbb.showTooltip); + $element.on('mouseout', phpbb.hideTooltip); +}; /** -* Show tooltip + * Show tooltip + * + * @param {object} $element Element passed by .on() */ -function show_tooltip(e) { - document.getElementById('_tooltip_container').appendChild(this.tooltip); - locate(this); -} +phpbb.showTooltip = function ($element) { + var $this = $($element.target); + $('#_tooltip_container').append(tooltips[$this.attr('data-id')]); + phpbb.positionTooltip($this); +}; /** -* Hide tooltip + * Hide tooltip */ -function hide_tooltip(e) { +phpbb.hideTooltip = function () { var d = document.getElementById('_tooltip_container'); if (d.childNodes.length > 0) { d.removeChild(d.firstChild); } -} +}; /** -* Set opacity on tooltip element + * Correct positioning of tooltip container + * + * @param {jQuery} $element Tooltip element that should be positioned */ -function set_opacity(element) { - element.style.filter = 'alpha(opacity:95)'; - element.style.KHTMLOpacity = '0.95'; - element.style.MozOpacity = '0.95'; - element.style.opacity = '0.95'; -} +phpbb.positionTooltip = function ($element) { + var offset; + + $element = $element.parent(); + offset = $element.offset(); + + $('#_tooltip_container').css({ + top: offset.top + 30, + left: offset.left - 205 + }); +}; /** -* Create new element -*/ -function create_element(tag, c) { - var x = document.createElement(tag); - x.className = c; - x.style.display = 'block'; - return x; -} + * Prepare roles drop down select + */ +phpbb.prepareRolesDropdown = function () { + var $options = $('.roles-options li'); + var $rolesOptions = $options.closest('.roles-options'); + var $span = $rolesOptions.children('span'); -/** -* Correct positioning of tooltip container -*/ -function locate(e) { - var posx = 0; - var posy = 0; + // Prepare highlighting of select options and settings update + $options.each(function () { + var $this = $(this); - e = e.parentNode; - - if (e.offsetParent) { - for (posx = 0, posy = 0; e.offsetParent; e = e.offsetParent) { - posx += e.offsetLeft; - posy += e.offsetTop; + // Correctly show selected option + if (typeof $this.attr('data-selected') !== 'undefined') { + $rolesOptions.closest('.roles-options') + .children('span') + .text($this.text()) + .attr('data-default', $this.text()) + .attr('data-default-val', $this.attr('data-id')); } - } else { - posx = e.offsetLeft; - posy = e.offsetTop; + + $this.on('mouseover', function () { + var $this = $(this); + $options.removeClass('roles-highlight'); + $this.addClass('roles-highlight'); + }).on('click', function () { + var $this = $(this); + + // Update settings + set_role_settings($this.attr('data-id'), $this.attr('data-target-id')); + init_colours($this.attr('data-target-id').replace('advanced', '')); + + // Set selected setting + $rolesOptions.children('span') + .text($this.text()); + $rolesOptions.children('input[type=hidden]') + .val($this.attr('data-id')); + + // Trigger hiding of selection options + $('body').trigger('click'); + }); + }); + + // Save default text of drop down if there is no default set yet + if (typeof $span.attr('data-default') === 'undefined') { + $span.attr('data-default', $span.text()); } - if (tooltip_mode === 'link') { - document.getElementById('_tooltip_container').style.top=(posy+20) + 'px'; - document.getElementById('_tooltip_container').style.left=(posx-20) + 'px'; - } else { - document.getElementById('_tooltip_container').style.top=(posy+30) + 'px'; - document.getElementById('_tooltip_container').style.left=(posx-205) + 'px'; - } + // Prepare resetting drop down on form reset + $options.closest('form').on('reset', function () { + $span.text($span.attr('data-default')); + $rolesOptions.children('input[type=hidden]') + .val($span.attr('data-id')); + }); -/* - if (e == null) - { - e = window.event; - } +}; - if (e.pageX || e.pageY) - { - posx = e.pageX; - posy = e.pageY; - } - else if (e.clientX || e.clientY) - { - if (document.documentElement.scrollTop) - { - posx = e.clientX+document.documentElement.scrollLeft; - posy = e.clientY+document.documentElement.scrollTop; - } - else - { - posx = e.clientX+document.body.scrollLeft; - posy = e.clientY+document.body.scrollTop; - } - } -*/ -} +// Run onload functions for RolesDropdown and tooltips +$(function() { + // Enable tooltips + phpbb.enableTooltipsSelect('set-permissions', $('#set-permissions').attr('data-role-description'), 'role'); + + // Prepare dropdown + phpbb.prepareRolesDropdown(); +}); + +})(jQuery); // Avoid conflicts with other libraries diff --git a/phpBB/includes/acp/auth.php b/phpBB/includes/acp/auth.php index 644b1ac7a5..b13b1ee040 100644 --- a/phpBB/includes/acp/auth.php +++ b/phpBB/includes/acp/auth.php @@ -470,7 +470,8 @@ class auth_admin extends \phpbb\auth\auth // Build role dropdown options $current_role_id = (isset($cur_roles[$ug_id][$forum_id])) ? $cur_roles[$ug_id][$forum_id] : 0; - $s_role_options = ''; + // Output current role id to template + $template->assign_var('S_ROLE_ID', $current_role_id); @reset($roles); while (list($role_id, $role_row) = each($roles)) @@ -478,13 +479,12 @@ class auth_admin extends \phpbb\auth\auth $role_description = (!empty($user->lang[$role_row['role_description']])) ? $user->lang[$role_row['role_description']] : nl2br($role_row['role_description']); $role_name = (!empty($user->lang[$role_row['role_name']])) ? $user->lang[$role_row['role_name']] : $role_row['role_name']; - $title = ($role_description) ? ' title="' . $role_description . '"' : ''; - $s_role_options .= ''; - } - - if ($s_role_options) - { - $s_role_options = '' . $s_role_options; + $template->assign_block_vars('role_options', array( + 'ID' => $role_id, + 'ROLE_NAME' => $role_name, + 'TITLE' => $role_description, + 'SELECTED' => $role_id == $current_role_id, + )); } if (!$current_role_id && $mode != 'view') @@ -507,7 +507,6 @@ class auth_admin extends \phpbb\auth\auth $template->assign_block_vars($tpl_pmask . '.' . $tpl_fmask, array( 'NAME' => $ug_names_ary[$ug_id], - 'S_ROLE_OPTIONS' => $s_role_options, 'UG_ID' => $ug_id, 'S_CUSTOM' => $s_custom_permissions, 'FORUM_ID' => $forum_id) @@ -556,7 +555,8 @@ class auth_admin extends \phpbb\auth\auth // Build role dropdown options $current_role_id = (isset($cur_roles[$ug_id][$forum_id])) ? $cur_roles[$ug_id][$forum_id] : 0; - $s_role_options = ''; + // Output current role id to template + $template->assign_var('S_ROLE_ID', $current_role_id); @reset($roles); while (list($role_id, $role_row) = each($roles)) @@ -564,13 +564,12 @@ class auth_admin extends \phpbb\auth\auth $role_description = (!empty($user->lang[$role_row['role_description']])) ? $user->lang[$role_row['role_description']] : nl2br($role_row['role_description']); $role_name = (!empty($user->lang[$role_row['role_name']])) ? $user->lang[$role_row['role_name']] : $role_row['role_name']; - $title = ($role_description) ? ' title="' . $role_description . '"' : ''; - $s_role_options .= ''; - } - - if ($s_role_options) - { - $s_role_options = '' . $s_role_options; + $template->assign_block_vars('role_options', array( + 'ID' => $role_id, + 'ROLE_NAME' => $role_name, + 'TITLE' => $role_description, + 'SELECTED' => $role_id == $current_role_id, + )); } if (!$current_role_id && $mode != 'view') @@ -594,7 +593,6 @@ class auth_admin extends \phpbb\auth\auth $template->assign_block_vars($tpl_pmask . '.' . $tpl_fmask, array( 'NAME' => ($forum_id == 0) ? $forum_names_ary[0] : $forum_names_ary[$forum_id]['forum_name'], 'PADDING' => ($forum_id == 0) ? '' : $forum_names_ary[$forum_id]['padding'], - 'S_ROLE_OPTIONS' => $s_role_options, 'S_CUSTOM' => $s_custom_permissions, 'UG_ID' => $ug_id, 'FORUM_ID' => $forum_id)