SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2014
    Posts
    70
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Setting time passed since last message sent / recieved

    My Chat Script So Far:

    Code:
        initChat: function () {
        
        	var cont = $('#chats');
        	var list = $('.chats', cont);
        	var form = $('.chat-form', cont);
        	var input = $('input', form);
        	var btn = $('.btn', form);
        	
        	$('.scroller', cont).slimScroll({
        		scrollTo: list.height()
        	});
        
        	var handleClick = function (e) {
        		e.preventDefault();
        
        		var text = input.val();
        		if (text.length == 0) {
        			return;
        		}
        		
        		var contains = text.match(/(@Tim marshall:|@Mark Smyth:)/i) === null ? "left" : "right";
        			sender;
        		
        		if(contains === 'right'){
        			var sender = 'Private message from: <a href="#" class="name">Bob Nilson</a>&nbsp;<br />';
        		}else{
        			var sender = '<a href="#" class="name">Bob Nilson</a>&nbsp;';
        		};
        
        		var time = new Date();
        		var time_str = time.toString('MMM dd, yyyy hh:mm:ss');
        		var tpl = '';
        		tpl += '<li class="' + contains + '">';
        		tpl += '<img class="avatar" alt="" src="../../assets/admin/layout/img/avatar1.jpg"/>';
        		tpl += '<div class="message">';
        		tpl += '<span class="arrow"></span>';
        		tpl += sender;
        		tpl += '<span class="datetime">at ' + time_str + '</span>';
        		tpl += '<span class="body">';
        		tpl += text.toString().replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/'/g, "&#39;").replace(/"/g, "&#34;");
        		tpl += '</span>';
        		tpl += '</div>';
        		tpl += '</li>';
        
        		var msg = list.append(tpl);
        		input.val("");
        		$('.scroller', cont).slimScroll({
        			scrollTo: list.height()
        		});
        	}
        
        	/*
        	$('.scroller', cont).slimScroll({
        		scrollTo: list.height()
        	});
        	*/
        
        	$('body').on('click', '.message .name', function (e) {
        		e.preventDefault(); // prevent click event
        
        		var name = $(this).text(); // get clicked user's full name
        		input.val('@' + name + ':'); // set it into the input field
        		Metronic.scrollTo(input); // scroll to input if needed
        	});
        
        	btn.click(handleClick);
        	input.keypress(function (e) {
        		if (e.which == 13) {
        			handleClick();
        			return false; //<---- Add this line
        		}
        	});
        },
    This script section starts on line 484 in index.js. You can play around with my staff chat here.

    Upon sending a message, you see something like this:

    Bob Nilson at Fri Jun 27 2014 21:30:45 GMT+0100 (GMT Daylight Time)

    Test Message
    What I am looking to do is to display a dynamic time since the message was sent. In my understanding, I believe in theory I need to edit:

    Code:
        var time = new Date();
        var time_str = time.toString('MMM dd, yyyy hh:mm:ss');
    to be a timestamp and then run through all my .datetime classes somehow displaying a time since. Alike Facebook, I would like to have certain times from lets say from 10800 (3 hours in seconds) to 14400 (4 hours in seconds) to say 'About four hours ago'.

    How can I achieve something like this?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by MrTIMarshall View Post
    How can I achieve something like this?
    Before considering how to achieve that, you are in England and I am in New Zealand, where our hours are off by a very large amount. Do you plan to adjust for such things, or are you and I likely to have conversations where the hours are all messed up, for example:

    11:41 pm MrTIMarshall: ...
    10:42 am paul_wilkins: ...
    11:42 pm MrTIMarshall: ...
    10:42 am paul_wilkins: ...

    There is though getUTCDate that can help, to which you can then apply the user's personal timezone offset to all of the times that they see.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Enthusiast
    Join Date
    Jun 2014
    Posts
    70
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Yes, there are a couple who will be using this chat from different timezones, however I plan to use the base time which is UK time.

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by MrTIMarshall View Post
    Yes, there are a couple who will be using this chat from different timezones, however I plan to use the base time which is UK time.
    For people who are not in the UK, the JavaScript from their web browser defaults to that persons local time. This is something that you might need to take into consideration.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Enthusiast
    Join Date
    Jun 2014
    Posts
    70
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Okay, lets say I have it relative to where they are for their time, what do I store in the chat log file as I was going to store UK time stamp, is there any reliable time conversions which don't mess up when the clocks go back or forth or is there another timestamp I should use?

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by MrTIMarshall View Post
    Okay, lets say I have it relative to where they are for their time, what do I store in the chat log file as I was going to store UK time stamp, is there any reliable time conversions which don't mess up when the clocks go back or forth or is there another timestamp I should use?
    UTC time is the most reliable one to store.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    SitePoint Enthusiast
    Join Date
    Jun 2014
    Posts
    70
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    There is a reliable UTC - GMT, EST, ETC timeszones usage"?

  8. #8
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by MrTIMarshall View Post
    There is a reliable UTC - GMT, EST, ETC timeszones usage"?
    Yes indeed. GMT time has been confusing because the day in some circumstances started at noon, and other issues have arised too.

    UTC is the Coordinated Universal Time that is the standard for maintaining timezones worldwide.
    http://en.wikipedia.org/wiki/List_of_UTC_time_offsets
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  9. #9
    SitePoint Enthusiast
    Join Date
    Jun 2014
    Posts
    70
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Unless you already know how to do this, I've just found this, a load of jibberish to me but it'll probably make sense to you: http://emplementation.blogspot.co.uk...tsviewers.html

  10. #10
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by MrTIMarshall View Post
    Unless you already know how to do this, I've just found this, a load of jibberish to me but it'll probably make sense to you: http://emplementation.blogspot.co.uk...tsviewers.html
    That article is from 4 years ago, which is seriously out of date because dateFormat last updated 2 months ago with fixes for those issues and more besides.
    Feel free though to use the localTimeFromUTC part of his blog post though - just be aware that it's designed to convert UTC time from the server in to local time for display on the browser.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •