Solved: Round corner avatar images

Looking for a MOD? Have a MOD request? Post here for help. (Note: This forum is community supported; phpBB does not have official MOD authors)
Ideas Centre
Locked
DocSommer
Registered User
Posts: 223
Joined: Mon Aug 24, 2009 10:30 pm
Location: Hamburg

Solved: Round corner avatar images

Post by DocSommer » Sat Dec 26, 2009 3:33 pm

Question solved - here's a solution based on javascript:

Image

Download corner.js here:

http://www.netzgesta.de/corner/

Copy coner.js into your template folder, open overall_header.

find:

Code: Select all

<script type="text/javascript" src="{T_TEMPLATE_PATH}/forum_fn.js"></script>
add after:

Code: Select all

<!--
var canvascheck = document.createElement('canvas');
if(canvascheck.getContext || (document.all && document.namespaces && !window.opera)){
    document.writeln('<style type="text/css">');
    document.writeln('img.corner { visibility: hidden; }');
    document.writeln('<\/style>');
}
-->
</script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/corner.js"></script> 
Note:

If you prefer a faster avatar loading time, you can use the following code instead - the disadvantage is that you you'll see the avatars unrounded for a little moment:

Code: Select all

<script type="text/javascript" src="{T_TEMPLATE_PATH}/corner.js"></script> 



open include/functions_display.php:

find:

Code: Select all

return '<img src="' . (str_replace(' ', '%20', $avatar_img)) . '" width="' . $avatar_width . '" height="' . $avatar_height . '" alt="' . ((!empty($user->lang[$alt])) ? $user->lang[$alt] : $alt) . '" />';
inline-find:

Code: Select all

$user->lang[$alt] : $alt) . '"
inline-add after:

Code: Select all

 class="corner iradius8"
(Here you can chance the value 8 if you want another corner-radius. You can also add the other effects wich are shown and described here. Some looks really neat but I got back to just the corners because the more effects you apply the longer it takes to render the avatars - you may notice that especially on slower computers.

Finally save/upload your files and purge the template cache and check out your round corner avatars.

Thanks to:

cherokee red (http://www.phpbb.com) for the hint
kenny + vonhazey (http://www.sixstringmods.co.uk) for the solution
http://www.netzgesta.de/corner/ for the script




Initial question:

hi there,

I don't know if this is even possible (due to different resolutions file-types etc.) but wouldn't it be great if a mod could display the avatar images with round corners?
Last edited by DocSommer on Sun Dec 27, 2009 2:55 pm, edited 7 times in total.

User avatar
Brf
Support Team Member
Support Team Member
Posts: 51758
Joined: Tue May 10, 2005 7:47 pm
Location: {postrow.POSTER_FROM}
Contact:

Re: Round corner avatar images

Post by Brf » Sat Dec 26, 2009 4:33 pm

You can put whatever corners you would like on your avatar image. Does mine have square corners?

DocSommer
Registered User
Posts: 223
Joined: Mon Aug 24, 2009 10:30 pm
Location: Hamburg

Re: Round corner avatar images

Post by DocSommer » Sat Dec 26, 2009 7:12 pm

Haha - good joke. I know how to edit a picture and add transparency or whatever but I'm not planning to edit all user avatars manually :lol:

I was just thinking about a feature wich is able to do that automatically.

User avatar
Brf
Support Team Member
Support Team Member
Posts: 51758
Joined: Tue May 10, 2005 7:47 pm
Location: {postrow.POSTER_FROM}
Contact:

Re: Round corner avatar images

Post by Brf » Sat Dec 26, 2009 8:32 pm

It is more appropriate for the users to choose the borders for their avatars, or if they need them at all. Since avatars can be different sizes, it might be tricky to border them.

DocSommer
Registered User
Posts: 223
Joined: Mon Aug 24, 2009 10:30 pm
Location: Hamburg

Re: Round corner avatar images

Post by DocSommer » Sat Dec 26, 2009 10:47 pm

It is more appropriate for the users to choose the borders for their avatars
I doubt that any of my user (and basicly any at all) would start to rant because of this. We're allowing avatar sizes up to 200px so there's still plenty room for the image content if we round the corners a few px. At the end it is just a matter of taste and I think this would look great.
Since avatars can be different sizes, it might be tricky to border them.
I'm just trying to keep the mod guys on the go :lol:

User avatar
stickerboy
Former Team Member
Posts: 7349
Joined: Mon Mar 29, 2004 2:27 pm
Location: Airdrie, UK (127.0.0.1)
Name: Kenny Cameron
Contact:

Re: Round corner avatar images

Post by stickerboy » Sun Dec 27, 2009 12:01 am

I found a solution for someone that asked on my site. You can read over the topic here - http://www.sixstringmods.co.uk/viewtopic.php?f=6&t=334
Might not be the best implementation, but it seemed to work ok for them :)
I'm a web-designing code-decrypting tech-support musician
|| Twitter || Flickr || phpBB Snippets ||
Formerly known as cherokee red

DocSommer
Registered User
Posts: 223
Joined: Mon Aug 24, 2009 10:30 pm
Location: Hamburg

Re: Round corner avatar images

Post by DocSommer » Sun Dec 27, 2009 12:43 pm

great - seems it's a quick edit so I'll give it a try :)

Locked

Return to “[3.0.x] MOD Requests”