Set custom publish date, but publish now if it's empty - umbraco

Question

I am trying to make a custom publish date, because the user wants to use that as the publishing date and for sorting. The date will also be displayed on the page.
Here is what I want:
The user can input a date
The date can be empty (meaning it will be published now)
It has to use that date for sorting
The date has to be set to UTC time, so it's equal for everyone in the world
I am desperate and I cannot figure out how to do this.
Here is what I have tried so far: I found a neat little plugin, which displays the user's current UTC time next to the input field, so the person knows their UTC time. I modified that to always enter the current date in the input field:
var timer = setInterval(function () {
var date = $(".custom-date").val();
if (date === "") {
$(".custom-date").focus();
$(".custom-date").click();
$(".custom-date").trigger("click");
//the date has now been set on the input field
} else if (date !== "") {
var newDate = new Date(date);
var stringDate = newDate.getFullYear() + "-" + ('0' + (newDate.getMonth() + 1)).slice(-2) + "-" + ('0' + (newDate.getDate() - 1)).slice(-2) + " " + ('0' + (newDate.getHours() - offset)).slice(-2) + ":" + ('0' + newDate.getMinutes()).slice(-2) + ":" + ('0' + newDate.getSeconds()).slice(-2);
$(".custom-date").val(stringDate);
angular.element(".custom-date").scope().$apply(function () {
angular.element(".custom-date").scope().datetimePickerValue = stringDate;
});
clearInterval(timer);
}
}, 1000);
Yes, this looks like a lot... and no, it does not work. I do the focus/click/trigger on the element, because that will automatically set the time to be the user's local time. I then turn that into UTC time (offset is the UTC time offset). Then I apply the date to the element's scope and the value gets updated both in $scope and in the view (I can actually see it).
However, when I hit save and publish, the date gets reset (it's empty in the database). It's only when I physically click on the input field and select a new date it will actually update it. I like this method, as I am in 100% control of it, so is it possible? It would seem like setting the new date on the scope doesn't trigger the actual "new date has been selected".
Alternatively I have my Razor code here:
//selection is all my elements/nodes
selection.OrderByDescending(x => x.GetProperty("publishDate") != null).ThenByDescending(x => x.GetPropertyValue("publishDate")).Where(x => x.GetPropertyValue<DateTime>("publishDate") < DateTime.UtcNow);

Answer 1

So apparently before the Angular event is triggered, I need to, at least, call these:
$(".custom-date").trigger("click");
$(".custom-date").change();
So I did that right after I set my new date and now it works.