Develop Reference

Moment.js date/time base on diff timezone offset

I'm not sure how to spit out the right date/time using moment.js base on diff timezone offset
I've tried USA : MA & TX
console.log(moment().utcOffset('-5').format('ddd MM/DD/y H:mm:ss')); //MA
console.log(moment().utcOffset('-6').format('ddd MM/DD/y H:mm:ss')); //TX
I kept getting
Fri 09/17/2021 18:28:21 //MA
Fri 09/17/2021 18:28:21 //TX
I supposed to get
Fri 09/17/2021 18:28:21 //MA
Fri 09/17/2021 17:28:21 //TX
Any hints for me ?

Try this
console.log(moment.utc().format('ddd MM/DD/y H:mm:ss'), 'UTC');
console.log(moment.utc().add(-5, 'hours').format('ddd MM/DD/y H:mm:ss'), 'MA');
console.log(moment.utc().add(-6, 'hours').format('ddd MM/DD/y H:mm:ss'), 'TX');
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

Google visualization 12h format DataTable

I'm trying to get the googlevisualization datatable to show the time timeline in 12h format, but no luck so far.
google.load("visualization", "1");
google.setOnLoadCallback(new function () {
// Specify options
that.optionsContainer = {
animate: false, // Mieux pour les perfs
animateZoom: false, // Mieux pour les perfs
width: "1200px",
height: (75 + 25 * (maxGrouping + 1)) + "px", // <= abandonné
start: that.startDate,
end: that.endDate,
min: that.minDate,
max: that.maxDate,
hAxis: {
format: 'hh:mm a'
}
};
}
I've also seen this response - Change to a 24 hour format for datetime data in Google Charts - but I don't think that I'm applying it properly as I don t get any changes:
this.data= new google.visualization.DataTable();
this.data.addColumn('datetime', 'start');
this.data.addColumn('datetime', 'end');
this.data.addColumn('string', 'content');
this.data.addColumn('boolean', 'editable');
this.data.addColumn('string', 'type');
var dateFormatter = new google.visualization.DateFormat({ pattern: 'dd/MM/yyyy hh:mm a' });
dateFormatter.format(this.data, 0);
I've also tried to set the locale to 'en-US', but it doesn't work:
that.optionsContainer = { locale: 'en-US' ...}
Any ideas?
Edit:
The this.data row looks like:
[Thu Dec 12 2019 17:30:05 GMT+0200 (Eastern European Standard Time), Thu Dec 12 2019 18:45:00 GMT+0200 (Eastern European Standard Time), "<div id="IP_1050" class= .. "Inactive from 5:30 PM to 6:45 PM"></div>", false, "range"]
and the draw method
this.timeline = new links.Timeline(document.getElementById('timeline-div123'));
this.timeline.draw(this.data, this.optionsContainer);
Edit2:
I'm using this library - https://almende.github.io/chap-links-library/js/timeline/doc/#Data_Format , which does not appear to have 12h support. I'll keep looking.

can't change assigned default value to input of type date angularjs

I have the following input
<input type="date" ng-model="startDateInput" ng-change="dateConvert()" />
And I set a default value since I call a service on the load of the page and need to pass the date as a parameter
$scope.startDateInput = new Date(new Date().setFullYear(new Date().getFullYear() - 1));
console.log("$scope.startDateInput" + $scope.startDateInput)
But later on I want this value to be updated when the user touches the date input and selects a new date on the calendar that pops up.
The thing is, my value is not changed here.
stays the same as the default value.
$scope.dateConvert = function() {
var dateFrom = $scope.startDateInput;
$scope.params.startDate = dateFrom;
console.log("dateFrom " + dateFrom);
console.log(" $scope.params.startDate " + $scope.params.startDate);
}
the results of the log
dateFrom Wed Sep 13 2017 11:22:26 GMT+0100 (Western European Summer Time)
tab.accountStatement.controller.js:261 $scope.params.startDate Wed Sep 13 2017 11:22:26 GMT+0100 (Western European Summer Time)
It keeps the default value I assigned before, but why? How can I change this value?

angular.module('MyApp', [])
.controller('MyCtrl', function($scope,$filter){
$scope.default_date =$filter("date")(Date.now(), 'yyyy-MM-dd');
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<div ng-app="MyApp">
<div ng-controller="MyCtrl">
<input type="date" ng-model="default_date" value="{{default_date}}">
<p>{{default_date}}</p>
</div>
</div>

how to combine values from Datepicker & Timepicker in one variable

I have angular App U I have Datepicker & Timepicker using angular-ui when user select date $Scope.dt and set time $Scope.mytime I am trying to combine in one $Scope.SelectedDateTime I get NaN. I don't know how to fix it
update
when user select date $scope.dt value will be 'ok when user select date it will 'Thu Mar 05 2015 00:00:00 GMT-0500 (Eastern Standard Time)' and $scope.mytime value 'Thu Mar 05 2015 23:30:00 GMT-0500 (Eastern Standard Time)' how to combine them in one variable
html
<h4>Popup</h4>
<div class="row">
<div class="col-md-6">
<p class="input-group">
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
<timepicker ng-model="mytime" ng-change="changed()" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></timepicker>
<button type="button" class="btn btn-sm btn-info" ng-click="SelectedDateTime()">Today</button>
javascript
$scope.today = function() {
$scope.dt = new Date();
};
$scope.today();
$Scope.mytime = new Date();
$scope.changed = function () {
$log.log('Time changed to: ' + $scope.mytime);
};
$scope.clear = function() {
$scope.mytime = null;
};
$Scope.SelectedDateTime = function()
{
var SelectedDateTime = $scope.dt +''+$scope.mytime;
}

I solved this problem using the same ng-model for Datepicker and Timepicker.
<input type="text" ng-model="myDateModel" datepicker-options="dateOptions" ... />
<uib-timepicker ng-model="myDateModel"...></uib-timepicker>
I hope it helps you too! Good luck!

You can't concatenate or try to add date objects as if they are numbers.
What you are basically trying to do is
new Date() +" "+ new Date()
Paste that line into browser console and you will see something like:
"Thu Mar 05 2015 21:54:37 GMT-0500 (Eastern Standard Time) Thu Mar 05 2015 21:54:37 GMT-0500 (Eastern Standard Time)"
You need to deal with them as Date objects and use appropriate Date prototype methods to manipulate them
Some of the methods you would need would be:
Date.prototype.getHours()
Date.prototype.setHours()
Above assumes that you are trying to actually create a new DateTime. If not it is not clear what your expected results are
Reference: MDN Date.prototype Docs

jQuery countdown plugin multiple instances not working

i have problem with my script using jquery.countdown.js plugin, it doesn't sets multiple instances for each element i pass it to, it always sets the first instance for all, so countdowns are always the same.
link to plugin : http://keith-wood.name/countdown.html
$(function(){
$.each($('.countdown'), function() {
var _element = '.countdown-'+$(this).attr("id");
if($(_element).length > 0){
var _expDate = $(_element).attr('data-expiration').split(',');
var _datetime = Date(_expDate);
init_countdown(_element,_datetime);
}
});
});
function init_countdown(_element,_datetime){
console.log(_element + ", " + _datetime)
$(_element).countdown({
until: _datetime,
format: 'yowdHMS'
});
}
HTML:
<h5 class="muted countdown countdown-1" id="1" data-expiration="2014,10,26,14,10,35"> 2014-10-26 14:10:35</h5>
<h5 class="muted countdown countdown-2" id="2" data-expiration="2014,10,26,16,10,35"> 2014-10-26 16:10:35</h5>
<h5 class="muted countdown countdown-3" id="3" data-expiration="2014,10,26,18,10,35"> 2014-10-26 18:10:35</h5>
this is how it outputs
how can i fix this?
console.log()
.countdown-1, Sun Oct 28 2012 22:10:09 GMT+0100 (CET)
.countdown-2, Sun Oct 28 2012 22:10:09 GMT+0100 (CET)
.countdown-3, Sun Oct 28 2012 22:10:09 GMT+0100 (CET)
#Asad example:

The date constructor (in the form you are using it) accepts several integer values, not an array. You need to turn each value in the array that results from your split into a integer (using parseInt), then pass each argument individually, and not as an array.
Try this:
var _expDate = $(_element).attr('data-expiration').split(',');
_expDate.forEach(function(v,i,a){a[i]=parseInt(a[i]);});
var _datetime = new Date(_expDate[0],_expDate[1],_expDate[2],_expDate[3],_expDate[4],_expDate[5]);