[RC] User Rank Progression Bar v0.2.1

A place for MOD Authors to post and receive feedback on MODs still in development. No MODs within this forum should be used within a live environment!
Get Involved
User avatar
IBBoard
Registered User
Posts: 542
Joined: Wed May 25, 2005 9:02 pm
Location: Worcestershire, UK
Contact:

[RC] User Rank Progression Bar v0.2.1

Post by IBBoard » Thu Jun 04, 2009 8:03 pm

Modification Name: User Rank Progression Bar
Author: IBBoard

Modification Description:: A small MOD that adds a progress bar showing a users progression to the next rank. The MOD also includes instructions for integration with my Special And Normal Rank Images MOD
Modification Version:: 0.2.1

Demo URL: http://forums.hiveworldterra.co.uk/view ... 72&start=0

Modification Download: http://ibboard.co.uk/mods/User_Rank_Pro ... _0.2.1.zip
Last edited by IBBoard on Wed Jul 07, 2010 6:08 pm, edited 4 times in total.

User avatar
Sam
Former Team Member
Posts: 2082
Joined: Thu Jan 22, 2009 3:59 am
Location: Sacramento, CA
Name: Sam Thompson
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by Sam » Thu Jun 04, 2009 9:02 pm

That's actually pretty cool, what are you using to create the bar for the final version? the PHP GD Library or a CSS effect?

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Thu Jun 04, 2009 9:34 pm

This looks great, IBBoard ... to be clear though, is the instructions in contrib for integration with your Special And Normal Rank Images MOD to be made in addition to the instructions in the Special And Normal Rank MOD? Or is this package basically stand alone to install both mods?

I notice that you opted to do away with the image file. I kind of liked the image file because it allowed for gradients in the progress bar ... how hard would that be to incorporate.

Lastly, I had to do a font-size=0; in the box for the other mod for IE6 to size correctly.

I’ll let you know how this all works out when I install this mod when I get home.

Thanks again!!

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Fri Jun 05, 2009 4:47 am

Works great IBBoard!! A few observations ...

I found it easier to install the Special And Normal Rank mod first, then the contrib instructions in the User Rank Progression Bar mod, then lastly the main install instructions.

In the main install instructions, I could not for the life of me find in functions_display.php:

Code: Select all

	else if ($user_posts !== false)
	{
So I wasn't quite sure where to put:

Code: Select all

	$next_rank_post_count = -1;
So far everything seems to work otherwise and I'm hoping this doesn't have adverse consequences. What does this do? It would seem to prevent incrementing the post count but under what circumstances I'm not sure.

I really like how you dealt with everything via css. I was able to manipulate the position and shape of the progress bar. I opted to do away with the % count since I am using odd thresholds and I don't want people to be able to back into what those thresholds are.

It appears you have a title over the progress bar but I don't see a corresponding languages\en\common entry. Anyway for mine, I did away with that too since I just wanted a bar.

Couple suggestions - I moved my bar below the rank images since it more corresponds to the regular rank and now it sits below it. Also, if you mess with the sizing as I did, IE6 gets thrown off so to fix that I added a font-size: 0; as such:

Code: Select all

.rank_progress_bar .bar { font-size:0; background-color: #fff; border-right: 1px solid #DACDA5; display:block; height: 3px; z-index:1; position:absolute; top: 0; left: 0 }
Thanks again IBBoard!!

User avatar
Pierce_MVP
Registered User
Posts: 10
Joined: Thu Apr 30, 2009 3:48 pm
Location: North Cyprus
Name: Can Delibaş
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by Pierce_MVP » Fri Jun 05, 2009 10:53 am

First thanks for this Mod.But how can ı edit for subsilver2 style?Please tell me.

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Fri Jun 05, 2009 3:20 pm

Ok just found something else ... since the box is styled using margin padding em, increasing and decreasing the font size distorts the box. I personally would like the box to remain a fixed width. I’m going to toy around with that one and hopefully nothing blows up (I know as much about coding as I do about quantum mathematics).

User avatar
IBBoard
Registered User
Posts: 542
Joined: Wed May 25, 2005 9:02 pm
Location: Worcestershire, UK
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by IBBoard » Fri Jun 05, 2009 7:25 pm

SyntaxError90: It's very, very simple CSS. CSS is more powerful than most people give it credit for, especially when you're using decently structured HTML.

Pierce_MVP: That depends what you want it to look like. You should be able to add the code from the Prosilver template, but it might need a bit of tweaking. I've not looked at the Subsilver template for this mod yet because (IMO) it's horrible, ugly and behind the times (i.e. stuck in the 90s using tables for layout).

youngjedikinght: Thanks for the feedback. I'll work on an update now.

In terms of ordering, it probably makes as much sense to do it in the order you said, but the "contrib" mod certainly has to be last :) (and yes, it is a set of merging instructions rather than a copy of the mod - I'll make that clearer)

Code: Select all

   else if ($user_posts !== false)
   {
should be in the middle of the get_user_rank function (line 1171 in a vanilla 3.0.4 file). The only thing it does is make sure there's always a value for that variable (e.g. if the user is at the top of their rank scheme). Thinking about it, although it'll have a value, that value will result in bad values that I need to handle for someone at the top rank.

I did miss a lang from that first release, so I'll add that in now.

You can still use an image background if you want (which I've done on my site) - just create one and edit the ".rank_progress_bar .bar" rule from:

Code: Select all

background-color: #fff;
to

Code: Select all

background: #fff url("/path/to/image.png");
I just didn't include one because I don't like Prosilver much and didn't know what would look good. If I had included the image then I'm sure someone would say "why did you include a gradiented image? it just looks stupid" ;)

IE6 is rather old now and always was terrible with CSS. I'll check it out and see how it does, but in general I ignore it as it is down to around a 10% or less market share on all of my sites. I guess it depends how ugly it looks. The other alternative would be using an "overflow: hidden" to the .rank_progress_bar CSS rule so that it shouldn't extend over the specified height (unless that doesn't work because IE used to incorrectly treat "height" as "min-height")

With the sizing, just change the margin-right to px or set an absolute width for the .rank_progress_bar - using ems is better for accessibility, though ;)

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Fri Jun 05, 2009 7:38 pm

Hey but that gradient looks ugly!! Oh, wait a minute ... :D

Actually, I like the css bar. Especially the border-right. And it’s always nice having fewer files to load so I’m going to stick with the way you had it.
IBBoard wrote:

Code: Select all

   else if ($user_posts !== false)
   {
should be in the middle of the get_user_rank function (line 1171 in a vanilla 3.0.4 file). The only thing it does is make sure there's always a value for that variable (e.g. if the user is at the top of their rank scheme). Thinking about it, although it'll have a value, that value will result in bad values that I need to handle for someone at the top rank.
Thank you for this clarification ... as my top rank is in the billions (and I as founder am barely breaking the thousand mark), I think I’ll have some time before this can cause problems haha. Still, my OCD will force me to look into this. I suspect a prior mod may be the issue.
IBBoard wrote: With the sizing, just change the margin-right to px or set an absolute width for the .rank_progress_bar - using ems is better for accessibility, though ;)
Leave it to me to worry about IE6 users and not for the visually impaired! :D ... although could you elaborate on these options? As I hinted at, my understading of coding, much less proper css application, extends to Google searches.

As for IE6 ... I hate it with a passion and wish it would just go back to the couldron that made it. Unfortunately, with a lot of people visiting websites from work (interwebs increasing productivity woot!) and companies cringing at the thought of upgrading to Vista, IE6 is a harsh reality.

Thanks again for all this, IBBoard.

User avatar
IBBoard
Registered User
Posts: 542
Joined: Wed May 25, 2005 9:02 pm
Location: Worcestershire, UK
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by IBBoard » Fri Jun 05, 2009 7:53 pm

Corporates are the one place where you can't really say "it's a dodgy old browser and you're horribly vulnerable to becoming part of a botnet - at least upgrade". TBH it has actually been a while since I checked my sites in IE as I use Firefox on Linux. I should probably check they're not too broken at some point :D My normal method is "code it how I think it should be using a basic text editor, check in Firefox, find it all looks as I expected, proceed"!

As for the appearance of the bar, what I've got is a combination of CSS and image. Everything is still CSS, but the bar has a background image in the CSS as well as the background colour (so people at least get the plain colour if they don't load the image).

The missing line should be a few lines up from the other changes. It might be about six lines further down in a vanilla 3.0.5 install because of other changes. The section looks a bit like this, though:

Code: Select all

	if (!empty($user_rank))
	{
		$rank_title = (isset($ranks['special'][$user_rank]['rank_title'])) ? $ranks['special'][$user_rank]['rank_title'] : '';
		$rank_img = (!empty($ranks['special'][$user_rank]['rank_image'])) ? '<img src="' . $phpbb_root_path . $config['ranks_path'] . '/' . $ranks['special'][$user_rank]['rank_image'] . '" alt="' . $ranks['special'][$user_rank]['rank_title'] . '" title="' . $ranks['special'][$user_rank]['rank_title'] . '" />' : '';
		$rank_img_src = (!empty($ranks['special'][$user_rank]['rank_image'])) ? $phpbb_root_path . $config['ranks_path'] . '/' . $ranks['special'][$user_rank]['rank_image'] : '';
	}
	else if ($user_posts !== false)
	{
		if (!empty($ranks['normal']))
		{
			foreach ($ranks['normal'] as $rank)
			{
I don't quite know what you wanted me to elaborate on. px are pixels and are absolute sizes, ems (and en and ex) are printing measurements and are relative to the size of the text. If you use px and someone needs to increase the font size (perhaps they have poor eyesight) then their text will grow but everything else will stay the same and the spacing will become (relatively) smaller. If you use ems and someone needs to increase the font size then the spacings will increase with it, effectively just zooming everything.

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Sat Jun 06, 2009 2:31 am

IBBoard, I found the area you were referring to in functions_display however that particular line appears to be replaced by if (!empty($ranks['normal'])) ...

Code: Select all

	if (!empty($user_rank))
	{
		$rank_title = (isset($ranks['special'][$user_rank]['rank_title'])) ? $ranks['special'][$user_rank]['rank_title'] : '';
		$rank_img = (!empty($ranks['special'][$user_rank]['rank_image'])) ? '<img src="' . $phpbb_root_path . $config['ranks_path'] . '/' . $ranks['special'][$user_rank]['rank_image'] . '" alt="' . $ranks['special'][$user_rank]['rank_title'] . '" title="' . $ranks['special'][$user_rank]['rank_title'] . '" />' : '';
		$rank_img_src = (!empty($ranks['special'][$user_rank]['rank_image'])) ? $phpbb_root_path . $config['ranks_path'] . '/' . $ranks['special'][$user_rank]['rank_image'] : '';
	}
	else
	{
		if (!empty($ranks['normal']))
		{
			foreach ($ranks['normal'] as $rank)
			{
				if ($user_posts < $rank['rank_min'])
				{
					$next_rank_post_count = $rank['rank_min'];
				}
				else
				if ($user_posts >= $rank['rank_min'])
				{
					if ($percent_complete == -1)
					{
						$rank_difference = $next_rank_post_count - $rank['rank_min'];
						$user_progress = $user_posts - $rank['rank_min'];
						$percent_complete = round(($user_progress / $rank_difference) * 100);
					}
					$rank_title = $rank['rank_title'];
					$rank_img = (!empty($rank['rank_image'])) ? '<img src="' . $phpbb_root_path . $config['ranks_path'] . '/' . $rank['rank_image'] . '" alt="' . $rank['rank_title'] . '" title="' . $rank['rank_title'] . '" />' : '';
					$rank_img_src = (!empty($rank['rank_image'])) ? $phpbb_root_path . $config['ranks_path'] . '/' . $rank['rank_image'] : '';
					break;
				}
I checked the other progress bar mod and no changes were actually made to functions_display ... what do you think?

User avatar
IBBoard
Registered User
Posts: 542
Joined: Wed May 25, 2005 9:02 pm
Location: Worcestershire, UK
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by IBBoard » Sat Jun 06, 2009 9:53 am

The other MOD didn't make changes to that file because it was using an inefficient method of doing the calculations in the viewtopic.php file :) Looking back through the patches for phpBB3 it looks like you're either a) still only on v3.0.3 or b) one of your patches since v3.0.3 didn't update properly.

youngjediknight
Registered User
Posts: 385
Joined: Wed Apr 22, 2009 2:58 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by youngjediknight » Sat Jun 06, 2009 1:41 pm

IBBoard wrote:The other MOD didn't make changes to that file because it was using an inefficient method of doing the calculations in the viewtopic.php file :) Looking back through the patches for phpBB3 it looks like you're either a) still only on v3.0.3 or b) one of your patches since v3.0.3 didn't update properly.
I'll take the first door, sir! :lol:

Lurx
Registered User
Posts: 21
Joined: Thu Dec 18, 2008 12:32 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by Lurx » Sun Jun 07, 2009 3:23 pm

I absolutely love this idea! But could it be possible to have this progress bar in the header for the logged in user? I think it would motivate users to post more. Don't know if its possible though :-)

User avatar
IBBoard
Registered User
Posts: 542
Joined: Wed May 25, 2005 9:02 pm
Location: Worcestershire, UK
Contact:

Re: [Dev] User Rank Progression Bar v0.1.0

Post by IBBoard » Sun Jun 07, 2009 3:29 pm

You mean to extend it so that it isn't just attached to posts but is also shown for each user in their "UCP/Messages/View your posts" bar? Interesting idea, although I'll probably delay it until the next version and get the "topics/PMs/profile/memberlist" stuff working first, since that's tied in with pre-existing functionality.

Lurx
Registered User
Posts: 21
Joined: Thu Dec 18, 2008 12:32 pm

Re: [Dev] User Rank Progression Bar v0.1.0

Post by Lurx » Sun Jun 07, 2009 4:54 pm

IBBoard wrote:You mean to extend it so that it isn't just attached to posts but is also shown for each user in their "UCP/Messages/View your posts" bar? Interesting idea, although I'll probably delay it until the next version and get the "topics/PMs/profile/memberlist" stuff working first, since that's tied in with pre-existing functionality.
Yep, that's what I mean! There is a mod around that does it but without a progress bar:

http://www.phpbb.com/community/viewtopi ... &p=6079805

but I'd like to have a progress bar like this too :-) I'll try and look into maybe combining these two mods myself!

Locked

Return to “[3.0.x] MODs in Development”