Show specific time

[Chris]

It's closed to guests soup but that's OK as long as there are no problems. If you notice anything strange or have a suggestion you can always post it here in this thread.

[JJ]

Hi, Chris, I've installed the code in my Global Footer and it works, but I would like to change the Bold to just regular font. I saw the all the 's in the code, but don't know enough about coding to change that to just plain old font, not bold, what do I remove?

By the way, I really love having this back, I missed it.

Thank you for your help.

Oops, sorry about that, the b in parenthisis executed. *JJ goes and stands in a corner.*

[Chris]

Oct 11, 2013 15:48:23 GMT -8 JJ said:

Hi, Chris, I've installed the code in my Global Footer and it works, but I would like to change the Bold to just regular font. I saw the all the [b]'s in the code, but don't know enough about coding to change that to just plain old font, not bold, what do I remove?

By the way, I really love having this back, I missed it.

Thank you for your help.

Oops, sorry about that, the b in parenthisis executed. *JJ goes and stands in a corner.*

The code doesn't bold anything, those [b]'s you're seeing are variable indices being used by the code not bbcode. If you're seeing bolded dates than it is more likely coming from CSS so if you want me to take a look I'll need a forum URL.


By the way (for those interested) in addition to the "time" and "recent_time" classes added by Proboards this code also adds new classes for flexible targeted styling:

"modified_time"
"today"
"yesterday"

as well as classes to target sub-components of the date

"at-time"
"at"
"year"
"month"
"day"

[JJ]

Chris, thank you for the quick response. Yes, I would appreciate you looking at my codes to tell me how I can change the bold font.

hootyowl.proboards.com/

[Chris]

JJ, since the latest post visible to guests such as myself on that forum link you just posted is dated October 4^th and I see no bolded dates I am going to assume these are dates that bear the class "recent_time" which Proboards gives to dates that are younger than 24 hours. If this is indeed the case then this is the standard behavior by the Proboards software itself. You can change this by editing the CSS stylesheet and looking for

abbr.time.recent_time {
font-style: normal;
font-weight: bold;
}

It is found around line 138 on a test forum (I just checked).
If you're look for a more plugin-like equivalent setting in the Visual Editor tab where you do not need coding knowledge then I do not know since I rarely use that tab but perhaps someone over in the support board can help you there.

[JJ]

Thank you very much, Chris, your method worked and I'm all fixed up! Sure appreciate your help.

[Rajiv]

Feb 4, 2014 21:53:03 GMT -8 Rajiv said:

Jan 31, 2014 16:35:35 GMT -8 Rajiv said:

....

.... For recent posts, might be simpler just to have the date/time appear as well, in addition to the duration since posting.

This appears to be useful:

Mar 28, 2013 10:48:14 GMT -8 Chris said:

....


<script type="text/javascript">
$('abbr.recent_time').livequery(function () {
$('abbr.time').expire();
var time = $(this).removeClass('recent_time'),
raw_date = new Date(time.data("timestamp")),
user_date = ['M d, yy', 'd M, yy'][proboards.data("time_style") || 0];
//clone to circumvent uncancellable timeouts
time.replaceWith(
$(this).clone()
.text(
$.datepicker.formatDate(user_date, raw_date)
+ ' at ' +
(proboards.data('military_time') ? $.formatTime('HH:mm', raw_date) : $.formatTime('h:mmp', raw_date))
)
);

})
</script>


I've added it to the Global Footer.

However, it also changes the timing on the Home page and Board/Thread list. I was hoping, if possible, to make the change only within a thread/Post list.

Is there a tweak that would limit the change to threads/Post Lists?

[Brian]

Here you go, Rajiv.

Changes are in green.

SPOILER: Click to show

<script type="text/javascript">
/* Replace elapsed time with specific time */
if(proboards.data('route').name != "home") {
$(function(){
for(var a=0, timeID=null; a < $.livequery.queries.length; a++){
if($.livequery.queries[a].selector == "abbr.time" && "function" == typeof $.livequery.queries[a].fn && $.livequery.queries[a].fn.toString().indexOf("non_mod_date") != -1)
{ timeID = $.livequery.queries[a].id; $.livequery.stop(timeID); break; }
}
$('abbr.time').each(function () {
var time = $(this).addClass('modified_time').removeClass('time'), raw_date = new Date(parseInt(time.data("timestamp"),10));
//this.className += " time"
if($(this).hasClass('recent_time') && !/yesterday/i.test($(this).text())){
time = time.removeClass('recent_time');
var today = raw_date.getDate() == (new Date()).getDate()?"today":"yesterday",
user_date = ['M d, yy', 'd M, yy'][proboards.data("time_style") || 0];
time.replaceWith(
$(this).clone(true).addClass('recent_time')
.html(
'<span class="'+today+'">'+today+' </span>'
+ '<span class="at">at</span> <span class="at-time">' +
(proboards.data('military_time') ? $.formatTime('HH:mm', raw_date) : $.formatTime('h:mmp', raw_date))
+'</span>'
)
);
}else if(/yesterday/i.test($(this).text())){
time.replaceWith(
$(this).clone(true)
.html(
'<span class="yesterday">yesterday </span><span class="at">at </span><span class="at-time">'
+ $(this).text().split("at ")[1]
+'</span>'
)
)
}else{
if(time.text().indexOf(" at ")== -1)
time.text($.datepicker.formatDate((proboards.data('time_style') ? 'd M yy' : 'M d, yy'), raw_date) + ' at ' + $.formatTime((proboards.data('military_time') ? 'HH:mm' : 'h:mmp'), raw_date))
time.replaceWith(function(){
for(var dt = time.text().split(" at")[0], a = dt.split(/,?\s+/), b=0, c = $('<span></span>'); b<a.length; b++){
if((d = a[b].match(/^(\d+)$/))){
if(d[1].length == 4)
c.append('<span class="year">'+a[b]+' </span>').addClass("year_"+a[b]);
else
c.append('<span class="day">'+a[b]+' </span>').addClass("day_"+a[b])
}else{
c.append('<span class="month">'+a[b]+' </span>').addClass("month_"+a[b])
}
}
c.append('<span class="at">at </span>').append('<span class="at-time">' + time.text().split(" at ")[1] + '</span>')
return time.clone(true).html('').append(c)
})
}

})
$('abbr.modified_time').addClass('time');
var ac = arguments.callee
if(!ac.func){ ac.func = function(){$.livequery.run(timeID); ac();} }
if($.inArray(ac.func, proboards.events.afterSearch) == -1){ proboards.on("afterSearch", ac.func); }
})
}
</script>

[Rajiv]

Done, thanks.

[Chris]

Brian, you da man!

Rajiv, just be aware that there is a bug in that version of the code you chose to use, that and the fact that the use of livequery in Proboards coding is officially discouraged (plugins won't be approved if they use it for example). A more up-to-date version that addresses that bug as well as the livequery issue can be found in the first reply. If you decide to use that newer version just drop it in the bottom of your post list layout and it should affect only posts.

[Brian]

Updated my post as well to utilize the most recent code.

[Rajiv]

Feb 5, 2014 16:20:57 GMT -8 Chris said:

....

Rajiv, just be aware that there is a bug in that version of the code you chose to use, that and the fact that the use of livequery in Proboards coding is officially discouraged (plugins won't be approved if they use it for example). A more up-to-date version that addresses that bug as well as the livequery issue can be found in the first reply. If you decide to use that newer version just drop it in the bottom of your post list layout and it should affect only posts.

Ok, done. Thanks.

Used the script/code from here. Got confused with the outcome, until I read this:

Mar 28, 2013 0:37:09 GMT -8 Chris said:

....

Also note that dates that contain "yesterday" are absolute (not elapsed) time since they point to a specific event in time instead of being a measure of time since that event has occurred.

[Chris]

The today/yesterday was a frequent request Rajiv simply because it was included in the last Proboards version and people find comfort in familiarity. If you do not want it then it could be changed back to standard date/time format when I have a few minutes on my hands.
I should probably just make it into a plugin so it could be easily customizable and be done with it.

[Rajiv]

I'm fine with the yesterday/today thing on the Home page and the Board/Thread list (which remain unchanged as I have placed the script/code at the bottom of the Post List layout template as you suggested), but would prefer the actual date in the Thread/Post list. If there is a tweak to the code/script, would make it simpler for me.

[Chris]

Feb 6, 2014 0:14:49 GMT -8 Rajiv said:

I'm fine with the yesterday/today thing on the Home page and the Board/Thread list (which remain unchanged as I have placed the script/code at the bottom of the Post List layout template as you suggested), but would prefer the actual date in the Thread/Post list. If there is a tweak to the code/script, would make it simpler for me.

I haven't had a chance to fully test this change for adverse effects but try adding the following red portion to the existing line in the code and it should get you there

var time = $(this).addClass('modified_time').removeClass('time').removeClass('recent_time').text(""), raw_date = new Date(parseInt(time.data("timestamp"),10));

Feb 5, 2014 16:29:02 GMT -8 Brian said:

Updated my post as well to utilize the most recent code.

Brian, the posted code appears to have had BBCode auto-correct rendering it inoperable
 (e.g. "function" == typeof $.livequery.queries[/a][a].fn)