[For 1.8] Daily Post Goal Progress Bar/Color

[Livewire]

https://community.mybb.com/mods.php?action=view&pid=783

After hours of digging I couldn't find a guide or tutorial how to do this until I decided to play around with the template and the codes to get it working. I will be providing the templates and .css, please remember that the progress bar when it goes to 100% or any other it will show a different color since I'm giving you my .css your more than welcome to play around with the colors yourself. If the template messes up play around with it because some forums may have custom themes!

Paste this code into postgoal template

<table class="tborder" cellspacing="0" cellpadding="5">
 <tbody>
 <tr>
 <td class="thead" align="left">Daily Post Goal</td> </tr>
<tr>
 <td class="trow1"> 
<span style="color:#9DAAAA">Posts:</span><span style="float:right;color: #9DAAAA;"> {$fetch}/{$postgoal}</span>
</td>
</tr>
<tr>
 <td class="trow1"> 
<span style="color:#9DAAAA">Status:</span><if $fetch >= $postgoal then><span style="color: #00BF00;float:right;">Reached</span><else> <span style="color: #e03131;float:right;">Not Reached</span></if>
</td>
</tr>
<tr>
 <td class="trow1">
 <div class="prog-bar-border">
 <div id="progress_bar" class="prog-bar-haxzz">
    <span id="prog-count" style="width: 0%"></span>
    <p id="prog-percent">0%</p>
</div></div>
</td> </tr> </td> </tr> </tbody> </table>

<script>
function setProgress(i){
 var y = Math.round( i );
 $('#prog-percent').html(y+'%');
 var red = 0, green = 0;
 if (i >= 80) {
        red = 137 - Math.round(((i - 137) / 34) * 34);
        green = 34;
    } else if (i >= 60) {
        red = 137;
        green = Math.round(((i - 137) /34) * 34);
    } else {
        red = 137;
        green = 34;
    }
 $('#prog-count').css('background', "rgb(" + red + "," + green + ",34)");
 if (i > 70){
 $('#prog-percent').css('color', 'white');
 } else {
 $('#prog-percent').css('color', '#fff');
 }
 $('#prog-count').width(i+'%');
}
(function() {
 var i = 0;
 var n = "{$fetch}";
 var o = parseInt(n.replace(',', ''));
 var p = {$postgoal};
 i = (o/p)*100;
 if (i > 100) i = 100;
 if (i < 0) i = 0;
 setProgress(i);
})();
 </script>

Paste this inside global.css

.prog-bar-border {
    background: #202020;
    position: relative;
    display: block;
    vertical-align: middle;
    height: 100%;
    border-radius: 1px;
    line-height: 30px;
    overflow: hidden;
}

.prog-bar-haxzz {
    background: #202020;
    width: 100%;
    color: white;
    position: relative;
    display: block;
    text-align: center;
    vertical-align: middle;
    height: 100%;
    border-radius: 6px;
    line-height: 27px;
    overflow: hidden;
}

.prog-bar-haxzz>span {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    bottom: 0;
    border-radius: 1px;
    background: rgba(82,82,82,0.8);
}

.prog-bar-haxzz>p {
    font-weight: 500;
    display: inline;
    position: relative;
    z-index: 1;
}

Preview:


If you need help with the progress bar color let me know.

[Mr.Kurd]

Can u add threads and members too?

[Livewire]

Can u add threads and members too?

Yep but if you'll have to modify the plugin or get one made custom that can have those features like threads/members.

[Eldenroot]

Great! I would like to see - number of users/thread as suggested above

[Mr.Kurd]

Can u add threads and members too?

Yep but if you'll have to modify the plugin or get one made custom that can have those features like threads/members.

I like a one realy, I don't how will you make it ; so as you like.

[shadowxss]

This user has been denied support.

note that this method does not work on handmade custom theme :'(

[Avex]

note that this method does not work on handmade custom theme :'(

Yes it does lol

Might be worth mentioning you need the PHP and Template Conditionals plugin

[Livewire]

note that this method does not work on handmade custom theme :'(

It work's on any theme, and you do need this plugin for it to work.
http://mybbhacks.zingaburga.com/showthread.php?tid=260

[AgentTesla]

Where is the postgoal template?

[kuttysoft]

https://forum.kuttysoft.com/index.php

i need help sir