Prevent guests from posting images

[nowdocking]

There was a code in V4 to keep guests from posting images, but it doesn't work in V5.

Is there anyone here willing to rework the code so it will work again? Thanks in advance.

This is the old code:

Global Footer

This will prevent guests from using any images (except smilies) in their posts

<script type="text/javascript">
<!--
/* stop guests posting images */
var mes = document.getElementsByName('message');
function removeImg() {
var re = mes[0].innerHTML;
re = re.replace(/\[img(.+?)?\].+?\[\/img\]/gi,'')
mes[0].innerHTML = re;
}
if(pb_username == 'Guest' && mes[0]) {
if(document.postForm)
document.postForm.onsubmit = function() { removeImg() }
else {
var form = document.getElementsByTagName('form');
for(i=0; i<form.length; i++) {
if(form.item(i).message)
form.item(i).onsubmit = function() { removeImg() }
}
}
}
//-->
</script>

[Chris]

Sept 24, 2018 13:38:54 GMT -8 nowdocking said:

There was a code in V4 to keep guests from posting images, but it doesn't work in V5.

Is there anyone here willing to rework the code so it will work again? Thanks in advance.

This got my attention because of your recent thread (Prevent Guests from posting images).

This candidate solution employs newer browser features that were not available back then to accomplish this in pure CSS which is quicker and less resource intensive that JavaScript.

<style>


.item.post:has(.guest-mini-profile) .message   {
   img:not([class]){  /* except smilies */  
   display:none;

   }
   .avatar_size_quote>img{ /* except quote avatars */
       display:inline;
   }
   /* NOTE: could also allow images within quotes but that could open a loophole because quotes are editable */
}



</style>

Notes:

1. The usual caveat about codes not being served to mobile devices applies.
   
   
2. The code depends on the theme not removing the class that identifies the mini-profile as belonging to a guest
   
   
3. The code uses the :has() selector which now works on all up-to-date major browsers.
   
   
4. The code uses CSS Nesting which works on all up-to-date major browsers.
   
   
5. Place the code in your global header to affect all installed themes or place in the stylesheet of each theme (minus the <style></style> tags) to affect only certain themes
   
   
6. Please let me know if you encounter a problem

Edit:

It occurred to me that PB now allows the user to add a class to certain BBCodes, and the [img] tag is one of them. This means a savvy user could add a class to an image to circumvent the above code. Simply dropping the exception that they are allowed to use smiles would close that loophole, but if necessary, checking for a repeating pattern in the smiley src URL would tighten that loophole. 

Editing Options:

1. To remove the smiley exception
   
   change img:not([class]){  /* except smilies */ to img{  
   

2. To allow usage of smiley or other images hosted by Proboards
   
   change img:not([class]){  /* except smilies */ to img:not(:where([src*="/images/smiley/"])):not(:where([src*="proboards.com"])):not(:where([src*="#"])){  /* except PB smilies */
   
   
   The above change to use URL pattern recognition employs the :where() selector to reduce specificity buildup, so the rule can still be overridden for exceptions such as quote avatars. It also disallows URL fragments and queries since those could be used to insert the necessary pattern.
   
   If you host smileys elsewhere and want guests to use those smileys, then the URLs of those images would have to be analyzed for a repeating pattern.