The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Reputation Bars

5 posters

Go down

Solved Reputation Bars

Post by Swamp Fox March 22nd 2014, 3:48 pm

Hello, I just made http://swampfox.forumotion.com/ for a bunch of my friends to hang out in. We were wondering if there is a way to create Reputation Bars? 

Reputation Bars are bars that get bigger based on how much Reputation points you have until it maxes it.
We like it because it is a cool way to look at people's rep.

Reputation Bars OfIjTdh
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by Pizza Boi March 22nd 2014, 4:05 pm

Pizza Boi
Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

Back to top Go down

Solved Re: Reputation Bars

Post by Swamp Fox March 22nd 2014, 4:14 pm

So it's not possible?
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by Pizza Boi March 22nd 2014, 4:16 pm

Hi Very Happy

Yes, it is not possible.

Regards,
Pizza Boi
Pizza Boi
Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

Back to top Go down

Solved Re: Reputation Bars

Post by Swamp Fox March 22nd 2014, 4:43 pm

That's too bad
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by Pizza Boi March 22nd 2014, 5:03 pm

Hi Very Happy

Yes, it is. Hopefully, someone can think for this Smile .

Actually, why don't you suggest it?

Regards,
Pizza Boi
Pizza Boi
Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

Back to top Go down

Solved Re: Reputation Bars

Post by Ange Tuteur March 22nd 2014, 8:00 pm

Hello Swamp Fox,

This is absolutely possible, it just takes a bit of javascript. Wink

Administration panel > modules > javascript codes management > create a new script

Title : Rep bar
Placement : In the topics
Paste the code below and save :
Code:
$(document).ready(function() {
    
    repLv = {
       lv1 : 1,
       lv2 : 2,
       lv3 : 3,
       lv4 : 4,
       lv5 : 5,
       lv6 : 6,
       lv7 : 7,
       lv8 : 8
    };
    
    $('td .postdetails.poster-profile').each(function() {
       var str = $(this).text().replace(/.*Reputation:  (\d+).*/,'$1');
       var rep = Number(str);
       $(this).parent().find('.name').next().after('<div id="repu" title="'+str+' Reputation">');
       if (rep >= repLv["lv1"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv2"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv3"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv4"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv5"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv6"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv7"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv8"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
    });
});

For the style :
Display > colors > CSS stylesheet
Paste this in the sheet and submit :
Code:
#repu {
    margin:2px 0;
    width:80px;
}
.repuBlock {
    height:10px;
    width:5px;
    background:#0A0;
    border:1px solid #080;
    border-radius:2px;
    box-shadow:0 3px 3px #0C0 inset;
    display:inline-block;
}

To change how many bars display depending on your rep count you must modify this piece in the script :
Code:
   repLv = {
       lv1 : 1,
       lv2 : 2,
       lv3 : 3,
       lv4 : 4,
       lv5 : 5,
       lv6 : 6,
       lv7 : 7,
       lv8 : 8
    };

1, 2, 3, 4, ect.. Corresponds to the amount of rep it takes to achieve a new level.

result :
Reputation Bars Captu415
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Reputation Bars

Post by Pizza Boi March 22nd 2014, 8:03 pm

Ange Tuteur wrote:Hello Swamp Fox,

This is absolutely possible, it just takes a bit of javascript. Wink

Administration panel > modules > javascript codes management > create a new script

Title : Rep bar
Placement : In the topics
Paste the code below and save :
Code:
$(document).ready(function() {
    
    repLv = {
       lv1 : 1,
       lv2 : 2,
       lv3 : 3,
       lv4 : 4,
       lv5 : 5,
       lv6 : 6,
       lv7 : 7,
       lv8 : 8
    };
    
    $('td .postdetails.poster-profile').each(function() {
       var str = $(this).text().replace(/.*Reputation:  (\d+).*/,'$1');
       var rep = Number(str);
       $(this).parent().find('.name').next().after('<div id="repu" title="'+str+' Reputation">');
       if (rep >= repLv["lv1"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv2"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv3"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv4"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv5"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv6"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv7"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
       if (rep >= repLv["lv8"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
    });
});

For the style :
Display > colors > CSS stylesheet
Paste this in the sheet and submit :
Code:
#repu {
    margin:2px 0;
    width:80px;
}
.repuBlock {
    height:10px;
    width:5px;
    background:#0A0;
    border:1px solid #080;
    border-radius:2px;
    box-shadow:0 3px 3px #0C0 inset;
    display:inline-block;
}

To change how many bars display depending on your rep count you must modify this piece in the script :
Code:
   repLv = {
       lv1 : 1,
       lv2 : 2,
       lv3 : 3,
       lv4 : 4,
       lv5 : 5,
       lv6 : 6,
       lv7 : 7,
       lv8 : 8
    };

1, 2, 3, 4, ect.. Corresponds to the amount of rep it takes to achieve a new level.

result :
Reputation Bars Captu415

Hi Very Happy

Can you make a tutorial for all versions please o.o ...?

Regards,
Pizza Boi
Pizza Boi
Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

Back to top Go down

Solved Re: Reputation Bars

Post by Swamp Fox March 24th 2014, 10:16 pm

Thank you for that Very Happy
Unforunitly it didn't work..Sad

Does it have to do with the fact that I have phpbb2?
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by Ange Tuteur March 24th 2014, 10:33 pm

Hmm.. no, it should work.

Try this version instead :
Code:
   $(document).ready(function() {
        
        var version = 'phpbb2';
        
        var repName = 'Reputation';
        var repLv = {
           lv1 : 1,
           lv2 : 2,
           lv3 : 3,
           lv4 : 4,
           lv5 : 5,
           lv6 : 6,
           lv7 : 7,
           lv8 : 8
        };
        
        if (version.toLowerCase() == 'phpbb3' || version.toLowerCase() == 'invision') {
           $('.postprofile').each(function() {
              if (version.toLowerCase() == 'phpbb3') {
                  var reg = new RegExp('.*'+repName+':  (\\d+).*');
                  var str = $(this).text().replace(reg,'$1')
             }
              if (version.toLowerCase() == 'invision') {
                 var reg = new RegExp('.*'+repName+': (\\d+).*');
                  var str = $(this).text().replace(reg,'$1')
             }
              var rep = Number(str);
              $(this).find('dt').append('<div id="repu">');
              if (rep >= repLv["lv1"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv2"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv3"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv4"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv5"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv6"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv7"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv8"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              $(this).find('#repu').attr('title','Reputation level '+$(this).find('.repuBlock').length);
           });
        }
        else if (version.toLowerCase() == 'punbb') {
           $('.user').each(function() {
              var reg = new RegExp('.*'+repName+': (\\d+).*');
              var str = $(this).text().replace(reg,'$1');
              var rep = Number(str);
              $(this).find('.user-ident').prepend('<div id="repu" title="'+str+' Reputation">');
              if (rep >= repLv["lv1"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv2"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv3"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv4"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv5"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv6"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv7"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv8"]) { $(this).find('#repu').append('<span class="repuBlock">') }
              $(this).find('#repu').attr('title','Reputation level '+$(this).find('.repuBlock').length);
           });
        }
        else if (version.toLowerCase() == 'phpbb2') {
           $('td .postdetails.poster-profile').each(function() {
              var reg = new RegExp('.*'+repName+':  (\\d+).*');
              var str = $(this).text().replace(reg,'$1');
              var rep = Number(str);
              $(this).parent().find('.name').next().after('<div id="repu" title="'+str+' Reputation">');
              if (rep >= repLv["lv1"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv2"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv3"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv4"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv5"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv6"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv7"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              if (rep >= repLv["lv8"]) { $(this).parent().find('#repu').append('<span class="repuBlock">') }
              $(this).parent().find('#repu').attr('title','Reputation level '+$(this).parent().find('.repuBlock').length);
           });
        }
    });
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Reputation Bars

Post by Michael_vx March 24th 2014, 10:41 pm

Unforunitly it didn't work with me too
i wander if i miss something or i should do something or i don`t know
i`m not smart i guess 0% smart that`s me Very Happy
Michael_vx
Michael_vx
Forumember

Male Posts : 659
Reputation : 29
Language : Arabic and some English
Location : Egypt

Back to top Go down

Solved Re: Reputation Bars

Post by Swamp Fox March 25th 2014, 1:02 am

I am probably doing something wrong since I am a noob.

Hey Ange do you mind making an account on swampfox.forumotion.com
Then I can make you an admin in which you can help me?

I would really appreciate it. 

Thanks for this,
Swamp Fox
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by Michael_vx March 25th 2014, 1:05 am

Swamp Fox wrote:I am probably doing something wrong since I am a noob.

Hey Ange do you mind making an account on swampfox.forumotion.com
Then I can make you an admin in which you can help me?

I would really appreciate it. 

Thanks for this,
Swamp Fox
i`m not sure if i can do it or not
i wil make account any way
Michael_vx
Michael_vx
Forumember

Male Posts : 659
Reputation : 29
Language : Arabic and some English
Location : Egypt

Back to top Go down

Solved Re: Reputation Bars

Post by Ange Tuteur March 25th 2014, 2:30 am

Swamp Fox,

Have you enabled javascript management ?
Administration panel > modules > javascript codes management

Tick 'yes' for 'Enable Javascript code management' and save.
Reputation Bars Captu420

Michael_vx,

For the multi-version script, after installing the CSS, you must modify this part to the version of your forum :
Code:
       var version = 'phpbb2';

The four versions it is compatible with are :
phpbb2, phpbb3, punbb, and invision
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Reputation Bars

Post by Michael_vx March 25th 2014, 2:49 am

version of my forum is phpbb2
but still same i`m Unlucky or there something i should know about it better

Code:
            var repLv = {
              lv1 : 1,
              lv2 : 2,
              lv3 : 3,
              lv4 : 4,
              lv5 : 5,
              lv6 : 6,
              lv7 : 7,
              lv8 : 8
            };
           

should it be image urls here or just like that or what i`m guessing that`s could be why its not working
i think i have bad English spelling i`m just Arabic man live in Egypt Very Happy
Michael_vx
Michael_vx
Forumember

Male Posts : 659
Reputation : 29
Language : Arabic and some English
Location : Egypt

Back to top Go down

Solved Re: Reputation Bars

Post by Ange Tuteur March 25th 2014, 2:55 am

Here, I'll quote the variables that should be modifed :
Ange Tuteur wrote:To customize and make sure this script works for you, there are three variables you must modify in the script :
Code:
   var version = 'phpbb3';
    
    var repName = 'Reputation';
    var repLv = {
       lv1 : 1,
       lv2 : 2,
       lv3 : 3,
       lv4 : 4,
       lv5 : 5,
       lv6 : 6,
       lv7 : 7,
       lv8 : 8
    };

version : corresponds to the version of your forum, if your version is punbb, write punbb. Only four versions can be used : phpbb2, phpbb3, punbb, and invision.

repName : corresponds to the name of your reputation field. So the rep value can be found you must change that name to the exact name of your rep field.

repLv : 1, 2, 3, 4, ect.. corresponds to the amount of rep it takes to increase in level. In total there are 8 levels of reputation, the value is when that level is achieved.

You will most likely need to modify the repName variable. Reputation => Your language
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Reputation Bars

Post by Michael_vx March 25th 2014, 3:18 am

nuh i give up about that Very Happy
my small head wont understand i guess
i hope its works with others
Michael_vx
Michael_vx
Forumember

Male Posts : 659
Reputation : 29
Language : Arabic and some English
Location : Egypt

Back to top Go down

Solved Re: Reputation Bars

Post by Swamp Fox March 25th 2014, 7:03 pm

Wow now it worked!

Thanks so much  cheers
avatar
Swamp Fox
New Member

Posts : 14
Reputation : 1
Language : English

http://swampfox.forumotion.com/

Back to top Go down

Solved Re: Reputation Bars

Post by SLGray March 25th 2014, 8:24 pm

Problem solved & topic archived.


Reputation Bars Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51576
Reputation : 3525
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum