Writing a Conditional based on current user's 'power'?

[Retread]

1. My question is targeted at JS which will be in a Header/Footer or Plugin, not in a Layout template.
2. In this particular case, the decision will be based on whether the current user has the power to View/Search by IP:

This:if (pb.data('user').is_staff == 1){ // DO SOMETHING}doesn't set the bar high enough.



I think I need something like:if (pb.data('user').is_staff == 1 && can_ip == 1){ // DO SOMETHING}where can_ip is a variable I create based somehow on dissecting pb.data('user').group_ids then test of the groups (somehow) and determine if any of them have the View/Search by IP: power enabled?

I'm kind of lost here.

[Bennett 🚀]

Sept 13, 2019 6:30:57 GMT -8 Retread said:

1. My question is targeted at JS which will be in a Header/Footer or Plugin, not in a Layout template.
2. In this particular case, the decision will be based on whether the current user has the power to View/Search by IP:

This:if (pb.data('user').is_staff == 1){ // DO SOMETHING}doesn't set the bar high enough.



I think I need something like:if (pb.data('user').is_staff == 1 && can_ip == 1){ // DO SOMETHING}where can_ip is a variable I create based somehow on dissecting pb.data('user').group_ids then test of the groups (somehow) and determine if any of them have the View/Search by IP: power enabled?

I'm kind of lost here.

If this is just for your personal use, you could enumerate the groups in an array that are allowed to view/Search by IP and then just check to see if that is in pb.data('user').groups.

E.g.
let allowedToEdit = ['Administrator','Global Moderator', 'Moderator'];
function groupAllowed(groups, allowed){
    for(let i in groups){
        if(allowed.indexOf(groups[i]) !== -1) return true;
    }
    return false;
}
if(pb.data('user').is_staff == 1 &&  groupAllowed(pb.data('user').groups, allowedToEdit)){
//do something here
}


[Retread]

Sept 13, 2019 7:37:26 GMT -8 Bennett 🚀 said:

If this is just for your personal use, you could enumerate the groups in an array that are allowed to view/Search by IP and then just check to see if that is in pb.data('user').groups.

E.g.
let allowedToEdit = ['Administrator','Global Moderator', 'Moderator'];
function groupAllowed(groups, allowed){
    for(let i in groups){
        if(allowed.indexOf(groups[i]) !== -1) return true;
    }
    return false;
}
if(pb.data('user').is_staff == 1 &&  groupAllowed(pb.data('user').groups, allowedToEdit)){
//do something here
}


Thanks, Bennett 🚀

This will be used on different forums, not just one.

What you provided wasn't all for naught as I've gained some useful understanding from examining and testing. On the plus side, this isn't limited to just the group being displayed but all the groups to which the current user might be a member.

But it doesn't fully get me where I need go. This requires that I check all the groups by name and determine which ones (such as Administrator, Global Moderator, etc) which have the View/Search by IP: power, and specify them.

Since there will be additional groups at later times and in some cases that particular power will be enabled or disabled in existing groups, that would require me to edit the script or plugin to keep up with those changes.

[Bennett 🚀]

Sept 13, 2019 11:14:39 GMT -8 Retread said:

Sept 13, 2019 7:37:26 GMT -8 Bennett 🚀 said:

If this is just for your personal use, you could enumerate the groups in an array that are allowed to view/Search by IP and then just check to see if that is in pb.data('user').groups.

E.g.
let allowedToEdit = ['Administrator','Global Moderator', 'Moderator'];
function groupAllowed(groups, allowed){
   for(let i in groups){
       if(allowed.indexOf(groups[i]) !== -1) return true;
   }
   return false;
}
if(pb.data('user').is_staff == 1 && groupAllowed(pb.data('user').groups, allowedToEdit)){
//do something here
}


Thanks, Bennett 🚀

This will be used on different forums, not just one.

What you provided wasn't all for naught as I've gained some useful understanding from examining and testing. On the plus side, this isn't limited to just the group being displayed but all the groups to which the current user might be a member.

But it doesn't fully get me where I need go. This requires that I check all the groups by name and determine which ones (such as Administrator, Global Moderator, etc) which have the  View/Search by IP: power, and specify them.

Since there will be additional groups at later times and in some cases that particular power will be enabled or disabled in existing groups, that would require me to edit the script or plugin to keep up with those changes.

That's what I was afraid of. At the current state of the public Proboards Javascript API, there is no way to ascertain what powers a current user has. Even with the template variables there is no mention of powers, just is_staff which is also available via the JS API. So unfortunately, I don't think there is any automatic way of doing what you're looking for.

[Retread]

Sept 13, 2019 16:58:56 GMT -8 Bennett 🚀 said:

That's what I was afraid of. At the current state of the public Proboards Javascript API, there is no way to ascertain what powers a current user has. Even with the template variables there is no mention of powers, just is_staff which is also available via the JS API. So unfortunately, I don't think there is any automatic way of doing what you're looking for.

Right then. What I'm asked for might not be possible but I may be asking for the wrong thing. Perhaps I'm over-complicating the process.

I'm sure there's a way to get to my ultimate destination, as Pebble did something very similar to my overall goal with his IP Lookup 0.0.7 L plugin.

When it comes to template variables, I can use this on the User Profile layout template:

<div class="container show-user">
	<div class="title-bar">
		<h1>View Profile - $[user.name] ($[user.username])</h1>
	</div>
	<div class="content cap-bottom">
		<div class="ui-tabMenu">
			<ul class="ui-helper-clearfix">
				{foreach $[menu]}<li{if $[menu.active]} class="ui-active"{/if}><a href="$[menu.href]">$[menu.text]</a></li>{/foreach}
			</ul>
		</div>
		<div class="pad-all-double clear">
			<div class="float-left">
				<div class="float-left pad-right">$[user.avatar_medium]</div>
				<div class="name_and_group float-right">
					<span class="big_username" style="color: $[user.color];">$[user.name]</span><br />
					{if $[user.group]}
						$[user.group.name]<br />$[user.group.stars]
					{else}
						$[user.rank.name]<br />$[user.rank.stars]
					{/if}
				</div>
			</div>
			<div class="float-right controls">
				$[options]
				$[send_message_button]
				$[edit_profile_button]
				$[follow_button]
				$[invite_button]

{if $[user.ip]}
<a class="button" href="https://www.ipqualityscore.com/free-ip-lookup-proxy-vpn-test/lookup/$[user.ip]" role="button" target="_blank">Proxy Test</a>
{/if}               
                
                <div class="float-right clear pad-top">
					Username: <span class="note pad-right">$[user.username]</span>
					{if $[user.is_online]}
						Member is Online
					{else}
						Last Online: <span class="note">$[user.last_online]</span>
					{/if}
				</div>
			</div>
		</div>
		<div class="pad-all-double ui-helper-clearfix clear">
			$[content]
		</div>
	</div>
</div>

In this situation, the conditional is based on that template variable being valid for the current user who is viewing the page. ie: current user has the power to View/Search by IP

Is there a way my script can get the IP of the member associated with that page in such a way that it's only valid for the current user? Then test to see if it's valid before I proceed?

[Chris]

Perhaps you are overthinking it, why no just test for the presence of an IP submenu in the post options menu to determine if the current user has access to user IP?

$('.options_menu').find('.searchIP').length>1

[Retread]

Sept 13, 2019 20:25:59 GMT -8 Chris said:

Perhaps you are overthinking it, why no just test for the presence of an IP submenu in the post options menu to determine if the current user has access to user IP?

$('.options_menu').find('.searchIP').length>1

Chris, I don't know if there's something amiss with that or if I'm doing something wrong. That always returns false.

[Chris]

Sept 14, 2019 3:49:05 GMT -8 Retread said:

Chris, I don't know if there's something amiss with that or if I'm doing something wrong. That always returns false.

Could provide the entire code context in which you are using the conditional(e.g. the code, the page where the code is executing and the expected result given the known permissions of the user)

*Also keep in mind that menu is built client-side so if your code is executing prior to the menu getting built that would also produce the result you are describing

[Retread]

Sorry it took so long to get back to you on this, Chris .


This will be used when viewing a User Profile and I'm testing on a plain vanilla theme.

Here's the JS (in a plugin). In red are a text string for the variable I haven't learned how to get the needed value for and the test you gave for the presence of the submenu.

$(document).ready (function () {
    let crown = "<a class='button' target='_blank' title='ipqualityscore.com' href='https://www.ipqualityscore.com/free-ip-lookup-proxy-vpn-test/lookup/";
    let meat = "IP-Will-Go-Here";
    let heel ="' role='button'>Proxy Test</a>";
    let test2 = pb.plugin.get('hack').settings.boxes;    
    let crownandmeat = crown.concat(meat);
    let sandwich = crownandmeat.concat(heel);
    if ($('.options_menu').find('.searchIP').length>1){
        $("#options-container").add().before(sandwich);
    }
});

This is screenshot of what I see in the Inspector for the area of interest on that page, when a Privileged user is viewing.

SPOILER: Click to show

This is screenshot of what I see in the Inspector for the area of interest on that page, when a Non-privileged user is viewing.

SPOILER: Click to show

[Chris]

My bad! It should be ">0" not ">1" (0 means no IP submenu and generally there is only one IP submenu when an IP submenu is present)

$(function(){
let IP_Mayo =$('.options_menu').find('.searchIP'), sandwich
if (IP_Mayo.length>0){
sandwich = $('<a></a>',{
"class":"button",
"target":"_blank",
"title":"ipqualityscore.com",
"href":"https://www.ipqualityscore.com/free-ip-lookup-proxy-vpn-test/lookup/",
"role":"button"
}).append('Proxy Test');
sandwich[0].href += IP_Mayo.find('>a').text().replace('IP ','')
$("#options-container").add().before(sandwich);
}
});

[Retread]

Sept 14, 2019 21:19:01 GMT -8 Chris said:

My bad! It should be ">0" not ">1" (0 means no IP submenu and generally there is only one IP submenu when an IP submenu is present)

Thank you very kindly, Chris

You not only gave me the true/false variable on which to base the placement _{(or not)} of the button but also restructured the assembly of the sandwich and grabbed the IP value I needed.

Now I have about eighteen questions about what's actually happening here (I want to learn as much as possible as well as accomplishing the present goal). So I'll spend some time with on some reference sites so I can formulate some proper questions for the rest of it.

Regarding this:
$('.options_menu').find('.searchIP').length>0

That would create a variable based on the number of html elements with the class searchIP being greater than 0, which occur nested beneath _{(the first instance of ?)} an html element with the class options_menu?

[Chris]

The html element with the class of options_menu would be that dropdown you get when clicking on the options menu. If it has the searchIP submenu then we're in business.

[Retread]

Thanks, Chris !

I'll have more questions in the near future, but first I'll study so that most of the questions will be clarifications of what I've learned by researching the individual pieces of the coding you provided.

Oh, and thanks for editing my IP in the Inspector before taking that screenshot.

[Retread]

Chris , I hope it's okay to continue the conversation even though the original issue has been resolved?

At your convenience, whenever you have some time to don your tutor's cap, I have some questions. I'm still very early in the learning curve with JS and jQuery.

I've done my due diligence and researched the methods employed in your code but there are a few gaps in my understanding, particularly in one line. I've embedded a ridiculous number of comments and would never use these in a working copy but this seems a good way of expressing what I *think* I understand and those things I definitely don't understand.

//  the first line is shorthand for:   $(document).ready(function(){   
//  jQuery methods will follow the opening brace at the end of the line */
$(function(){	
    
    
    
    //  The variables IP_Mayo and sandwich are being declared but are not yet defined.    
	let IP_Mayo, sandwich
    
    
        
    //  There are two things happening in this next line.
    //  We have a conditional and the IP_Mayo variable is now being defined.
    //  The selector $('.options_menu') is locating any html element with the class: options_menu
    //  The find method is being employed to get the descendant element which will have the class: searchIP
    //  The variable IP_Mayo is being defined AND if there are any contents in that variable,
    //  we will execute the code which follows the opening brace at the end of the line.
    //  this decision is important to prevent creating buttons (which won't work properly anyway),
    //  for non-privileged members    
	if ( (IP_Mayo=$('.options_menu').find('.searchIP')) && IP_Mayo.length>0){
        
        
             
        //  The variable: sandwich will become the link which will perform the role of the button.
        //  We're using the jQuery selector to identify an <a> element while we are creating it.
        //  between the opening brace and the closing brace which will come many lines later,
        //  the attributes of the <a> are being defined.
		sandwich = $('<a></a>',{
		"class":"button",
		"target":"_blank",
		"title":"ipqualityscore.com", 
		"href":"https://www.ipqualityscore.com/free-ip-lookup-proxy-vpn-test/lookup/",
		"role":"button"
            
            
            
            //  At this point our link is nearly complete except for two things.
            //  The IP address will need to be added at the tail of the URL
            //  We need some text between the <a> tags.
            //  the closing brace stops the process of defining the a attributes.
            //  the closing parenthesis stops the process of defining the a element
            //  We now use the append method to add the Proxy Test text 
            //  to the non-existant text between the opening and closing <a></a> tags
		}).append('Proxy Test')
        
        
        
               
        //  Our nearly-complete sandwich is re-opened and the needed IP 
        //  is appended to the URL, but I'm not quite sure exactly what's happening here.
        //  I do know that we're using IP_Mayo to shorten the call which would have used:
        //  $('.options_menu').find('.searchIP') rather than IP_Mayo
        //  .replace seems fairly straightforward.  
        //  Since the text string we grab from the page
        //  begins with IP and a space, 
        //  we're replacing those three characters, with, nothing between the single quotes which appear after the comma.
        //  The filter for the last .find isn't clear to me.
        //  Exactly what is: ('>a') doing for us?
        //  Also, in the very beginning of this line, we seem to be redefining the variable sandwich,
        //  and appending the modified text which represents IP, to the URL
        //  but it's specifically ...  sandwich[0].href
        //  I think the .href means we're targeting the href attribute already in the variable?
        //  and the + means we're appending to what's already there.
        //  But what does the [0] do for us?
		sandwich[0].href += IP_Mayo.find('>a').text().replace('IP ','')
        
        
                
        //  We use the ID: options-container as our selector for the specific element on the page
        // and use the add method to place our sandwich on the page, before that element.
		$("#options-container").add().before(sandwich);
        
        
                
        //  We've completed execution of all the code which was dependent on our conditional
        //  The closing brace now ends that part.
	}
    
    
        
    // closing punctuation related to the very first line.
    //  say goodnight, Gracie.    
});

[Chris]

I'm not quite sure exactly what's happening here.

sandwich[0].href += IP_Mayo.find('>a').text().replace('IP ','')

Exactly what is: ('>a') doing for us?

MDN|Combinators said:

Child combinator

The child combinator is a greater-than symbol (>), which matches only when the selectors select elements that are direct children. Descendants further down the hierarchy don't match. For example, to select only <p> elements that are direct children of <article> elements:

article > p

The child combinator is looking for a first generation descendent <a> (we don't want any <a> elements further down the rabbit hole in other submenus).

But what does the [0] do for us?

jQuery deals in arrays, so when you do a lookup for $('a') or in this case create an $('<a>') element you get back an array of zero or more DOM elements, to get one element out of that array jQuery offers you the eq and get but an even easier way is to just use the array index to pop out the DOM element so you can then add to the href the DOM way rather than having to go through jQuery's attr() method which would require me to use attr() twice; once to get current value then a second time to write current value back with the appended IP ... much easier to just drop down to native javascript like I did and append the IP directly to the href attribute.