Post by SubDevo on May 20, 2010 1:06:09 GMT -8
Restrict Usage of Oversized Avatars by SubDevo
Tested in IE, FF, Opera, Safari and Chrome.
Ok, we have all seen it.
Members using a large image for their avatar that is resized down to 100 x 100px.
Well, it works but... If that image is say, 1024x768px, then it affects your forum loading times because it has to download the large image first before resizing it.
Just think of how your loading time will be affected with multiple members doing this!
This code checks the image URL entered in a user's Modify Profile page to make sure it is no greater than the max size you enter in the code. If it is, the user is alerted with a message asking them to use a smaller image, clears the avatar URL and stops the page from submitting.
Once the user enters a smaller image or selects one of the default avatars, the page will submit normally.
Enjoy!!!
SubDevo
Variables:
var avMax=100; // Maximum avatar image size (px) allowed.
You may change this to accept slightly larger images.
Or you may restrict the user to a smaller image. It is up to you!
If this is larger than 100, keep in mind that the image will still be resized down to 100 by ProBoards.
var mess="Your avatar image must be no larger than "+avMax+" x "+avMax+"px.\nPlease use a smaller image or use one of the default avatars.";
The message that the user will see if their image is larger than the amount you set in the first variable.
Note the use of "avMax" in this. The message will automatically use your max height and width.
Location: Main Footer
<script type="text/javascript">
/* Restrict Usage of Oversized Avatars by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var avMax=100; // Maximum avatar image size (px) allowed.
var mess="Your avatar image must be no larger than "+avMax+" x "+avMax+"px.\nPlease use a smaller image or use one of the default avatars.";
if(document.modifyForm){ var n_dMF=document.modifyForm;
n_dMF.avatarurl.onblur=n_dMF.avatarurl.onkeyup=function(){cAv();}
document.getElementsByName("profileaction")[0].onclick=function(){
cAv(); var nI=new Image(); nI.src=document.images.avatarImage.src;
if(nI.complete){
if((nI.height||nI.width)>avMax){ n_dMF.avatarurl.value=""; cAv(); alert(mess); return false;}
}else{if(n_dMF.avatarurl.value){return false;}else{doAvs();}}
}}
function cAv(){if(n_dMF.avatarurl.value){n_dMF.avatarImage.src=n_dMF.avatarurl.value;}}
</script>
EDIT:
Changed code to block non-cached images.
Thanks to Todge for bringing this to my attention.
Tested in IE, FF, Opera, Safari and Chrome.
Ok, we have all seen it.
Members using a large image for their avatar that is resized down to 100 x 100px.
Well, it works but... If that image is say, 1024x768px, then it affects your forum loading times because it has to download the large image first before resizing it.
Just think of how your loading time will be affected with multiple members doing this!
This code checks the image URL entered in a user's Modify Profile page to make sure it is no greater than the max size you enter in the code. If it is, the user is alerted with a message asking them to use a smaller image, clears the avatar URL and stops the page from submitting.
Once the user enters a smaller image or selects one of the default avatars, the page will submit normally.
Enjoy!!!
SubDevo
Variables:
var avMax=100; // Maximum avatar image size (px) allowed.
You may change this to accept slightly larger images.
Or you may restrict the user to a smaller image. It is up to you!
If this is larger than 100, keep in mind that the image will still be resized down to 100 by ProBoards.
var mess="Your avatar image must be no larger than "+avMax+" x "+avMax+"px.\nPlease use a smaller image or use one of the default avatars.";
The message that the user will see if their image is larger than the amount you set in the first variable.
Note the use of "avMax" in this. The message will automatically use your max height and width.
Location: Main Footer
<script type="text/javascript">
/* Restrict Usage of Oversized Avatars by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var avMax=100; // Maximum avatar image size (px) allowed.
var mess="Your avatar image must be no larger than "+avMax+" x "+avMax+"px.\nPlease use a smaller image or use one of the default avatars.";
if(document.modifyForm){ var n_dMF=document.modifyForm;
n_dMF.avatarurl.onblur=n_dMF.avatarurl.onkeyup=function(){cAv();}
document.getElementsByName("profileaction")[0].onclick=function(){
cAv(); var nI=new Image(); nI.src=document.images.avatarImage.src;
if(nI.complete){
if((nI.height||nI.width)>avMax){ n_dMF.avatarurl.value=""; cAv(); alert(mess); return false;}
}else{if(n_dMF.avatarurl.value){return false;}else{doAvs();}}
}}
function cAv(){if(n_dMF.avatarurl.value){n_dMF.avatarImage.src=n_dMF.avatarurl.value;}}
</script>
EDIT:
Changed code to block non-cached images.
Thanks to Todge for bringing this to my attention.