Skip to content

Commit

Permalink
More agenda fixes.
Browse files Browse the repository at this point in the history 
 - Legacy-Id: 19674
  • Loading branch information
@larseggert
larseggert committed Nov 17, 2021
1 parent a8764f2 commit a114ad9
Show file tree
Hide file tree
Showing 24 changed files with 398 additions and 165 deletions.
1 change: 1 addition & 0 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ module.exports = {
"no-multiple-empty-lines": ["error", { max: 2, maxEOF: 0 }],
"quote-props": ["error", "as-needed"],
"brace-style": ["error", "1tbs", { allowSingleLine: true }],
"semi": ["error", "always"],
},
env: {
browser: true,
Expand Down
2 changes: 2 additions & 0 deletions ietf/static/css/ietf.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ $enable-negative-margins: true;
// Don't add carets to dropdowns by default.
// $enable-caret: false;

$tooltip-max-width: 100%;

// Only import what we need:
// https://getbootstrap.com/docs/5.1/customize/optimize/

Expand Down
226 changes: 138 additions & 88 deletions ietf/static/js/agenda_timezone.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,85 +9,105 @@
This should be done before calling anything else in the file.
*/

var meeting_timezone;
var local_timezone = moment.tz.guess();

// get_current_tz_cb must be overwritten using set_current_tz_cb
window.get_current_tz_cb = function () {
function get_current_tz_cb() {
throw new Error('Tried to get current timezone before callback registered. Use set_current_tz_cb().')
};

// Initialize moments
window.initialize_moments = function () {
var times=$('span.time')
$.each(times, function(i, item) {
item.start_ts = moment.unix(this.getAttribute("data-start-time")).utc();
item.end_ts = moment.unix(this.getAttribute("data-end-time")).utc();
var times = $('div.time')
$.each(times, function (i, item) {
item.start_ts = moment.unix(this.getAttribute("data-start-time"))
.utc();
item.end_ts = moment.unix(this.getAttribute("data-end-time"))
.utc();
if (this.hasAttribute("weekday")) {
item.format=2;
item.format = 2;
} else {
item.format=1;
item.format = 1;
}
if (this.hasAttribute("format")) {
item.format = +this.getAttribute("format");
}
});
var times=$('[data-slot-start-ts]')
$.each(times, function(i, item) {
item.slot_start_ts = moment.unix(this.getAttribute("data-slot-start-ts")).utc();
item.slot_end_ts = moment.unix(this.getAttribute("data-slot-end-ts")).utc();
var times = $('[data-slot-start-ts]')
$.each(times, function (i, item) {
item.slot_start_ts = moment.unix(this.getAttribute("data-slot-start-ts"))
.utc();
item.slot_end_ts = moment.unix(this.getAttribute("data-slot-end-ts"))
.utc();
});
}

window.format_time = function (t, tz, fmt) {
function format_time(t, tz, fmt) {
var out;
var mtz = meeting_timezone;
var mtz = window.meeting_timezone;
if (mtz == "") {
mtz = "UTC";
}

switch (fmt) {
case 0:
out = t.tz(tz).format('dddd, ') + '<span class="d-none d-sm-block">' +
t.tz(tz).format('MMMM Do YYYY, ') + '</span>' +
t.tz(tz).format('HH:mm') + '<span class="d-none d-sm-block">' +
t.tz(tz).format(' Z z') + '</span>';
out = t.tz(tz)
.format('dddd, ') + '<span class="">' +
t.tz(tz)
.format('MMMM Do YYYY, ') + '</span>' +
t.tz(tz)
.format('HH:mm') + '<span class="">' +
t.tz(tz)
.format(' Z z') + '</span>';
break;
case 1:
// Note, this code does not work if the meeting crosses the
// year boundary.
out = t.tz(tz).format("HH:mm");
if (+t.tz(tz).dayOfYear() < +t.tz(mtz).dayOfYear()) {
out = t.tz(tz)
.format("HH:mm");
if (+t.tz(tz)
.dayOfYear() < +t.tz(mtz)
.dayOfYear()) {
out = out + " (-1)";
} else if (+t.tz(tz).dayOfYear() > +t.tz(mtz).dayOfYear()) {
} else if (+t.tz(tz)
.dayOfYear() > +t.tz(mtz)
.dayOfYear()) {
out = out + " (+1)";
}
break;
case 2:
out = t.tz(mtz).format("dddd, ").toUpperCase() +
t.tz(tz).format("HH:mm");
if (+t.tz(tz).dayOfYear() < +t.tz(mtz).dayOfYear()) {
out = t.tz(mtz)
.format("dddd, ")
.toUpperCase() +
t.tz(tz)
.format("HH:mm");
if (+t.tz(tz)
.dayOfYear() < +t.tz(mtz)
.dayOfYear()) {
out = out + " (-1)";
} else if (+t.tz(tz).dayOfYear() > +t.tz(mtz).dayOfYear()) {
} else if (+t.tz(tz)
.dayOfYear() > +t.tz(mtz)
.dayOfYear()) {
out = out + " (+1)";
}
break;
case 3:
out = t.utc().format("YYYY-MM-DD");
out = t.utc()
.format("YYYY-MM-DD");
break;
case 4:
out = t.tz(tz).format("YYYY-MM-DD HH:mm");
out = t.tz(tz)
.format("YYYY-MM-DD HH:mm");
break;
case 5:
out = t.tz(tz).format("HH:mm");
out = t.tz(tz)
.format("HH:mm");
break;
}
return out;
}


// Format tooltip notice
window.format_tooltip_notice = function (start, end) {
function format_tooltip_notice(start, end) {
var notice = "";

if (end.isBefore()) {
Expand All @@ -102,110 +122,140 @@ window.format_tooltip_notice = function (start, end) {
}

// Format tooltip table
window.format_tooltip_table = function (start, end) {
function format_tooltip_table(start, end) {
var current_timezone = get_current_tz_cb();
var out = '<table><tr><th>Timezone</th><th>Start</th><th>End</th></tr>';
if (meeting_timezone !== "") {
out += '<tr><td class="timehead">Meeting timezone:</td><td>' +
format_time(start, meeting_timezone, 0) + '</td><td>' +
format_time(end, meeting_timezone, 0) + '</td></tr>';
var out = '<div class="text-start"><table class="table text-light table-sm"><tr><th></th><th>Session start</th><th>Session end</th></tr>';
if (window.meeting_timezone !== "") {
out += '<tr><th class="timehead">Meeting timezone</th><td>' +
format_time(start, window.meeting_timezone, 0) + '</td><td>' +
format_time(end, window.meeting_timezone, 0) + '</td></tr>';
}
out += '<tr><td class="timehead">Local timezone:</td><td>' +
out += '<tr><th class="timehead">Local timezone</th><td>' +
format_time(start, local_timezone, 0) + '</td><td>' +
format_time(end, local_timezone, 0) + '</td></tr>';
if (current_timezone !== 'UTC') {
out += '<tr><td class="timehead">Selected Timezone:</td><td>' +
out += '<tr><th class="timehead">Selected Timezone</th><td>' +
format_time(start, current_timezone, 0) + '</td><td>' +
format_time(end, current_timezone, 0) + '</td></tr>';
}
out += '<tr><td class="timehead">UTC:</td><td>' +
out += '<tr><th class="timehead">UTC</th><td>' +
format_time(start, 'UTC', 0) + '</td><td>' +
format_time(end, 'UTC', 0) + '</td></tr>';
out += '</table>' + format_tooltip_notice(start, end);
out += '</table>' + format_tooltip_notice(start, end) + '</div>';
return out;
}

// Format tooltip for item
window.format_tooltip = function (start, end) {
function format_tooltip(start, end) {
return '<div class="timetooltiptext">' +
format_tooltip_table(start, end) +
'</div>';
}

// Add tooltips
window.add_tooltips = function () {
$('span.time').each(function () {
var tooltip = $(format_tooltip(this.start_ts, this.end_ts));
tooltip[0].start_ts = this.start_ts;
tooltip[0].end_ts = this.end_ts;
tooltip[0].ustart_ts = moment(this.start_ts).add(-2, 'hours');
tooltip[0].uend_ts = moment(this.end_ts).add(2, 'hours');
$(this).parent().append(tooltip);
});
$('div.time')
.each(function () {
var tooltip = $(format_tooltip(this.start_ts, this.end_ts));
tooltip[0].start_ts = this.start_ts;
tooltip[0].end_ts = this.end_ts;
tooltip[0].ustart_ts = moment(this.start_ts)
.add(-2, 'hours');
tooltip[0].uend_ts = moment(this.end_ts)
.add(2, 'hours');
$(this)
.closest("th, td")
.attr("data-bs-toggle", "tooltip")
.attr("title", $(tooltip)
.html())
.tooltip({
html: true,
sanitize: false
});
});
}

// Update times on the agenda based on the selected timezone
window.update_times = function (newtz) {
$('span.current-tz').html(newtz);
$('span.time').each(function () {
if (this.format == 4) {
var tz = this.start_ts.tz(newtz).format(" z");
if (this.start_ts.tz(newtz).dayOfYear() ==
this.end_ts.tz(newtz).dayOfYear()) {
$(this).html(format_time(this.start_ts, newtz, this.format) +
'-' + format_time(this.end_ts, newtz, 5) + tz);
$('span.current-tz')
.html(newtz);
$('div.time')
.each(function () {
if (this.format == 4) {
var tz = this.start_ts.tz(newtz)
.format(" z");
if (this.start_ts.tz(newtz)
.dayOfYear() ==
this.end_ts.tz(newtz)
.dayOfYear()) {
$(this)
.html(format_time(this.start_ts, newtz, this.format) +
'-' + format_time(this.end_ts, newtz, 5) + tz);
} else {
$(this)
.html(format_time(this.start_ts, newtz, this.format) +
'-' +
format_time(this.end_ts, newtz, this.format) + tz);
}
} else {
$(this).html(format_time(this.start_ts, newtz, this.format) +
'-' +
format_time(this.end_ts, newtz, this.format) + tz);
$(this)
.html(format_time(this.start_ts, newtz, this.format) + '-' +
format_time(this.end_ts, newtz, this.format));
}
} else {
$(this).html(format_time(this.start_ts, newtz, this.format) + '-' +
format_time(this.end_ts, newtz, this.format));
}
});
});
update_tooltips_all();
update_clock();
}

// Highlight ongoing based on the current time
window.highlight_ongoing = function () {
$("div#now").remove("#now");
$('.ongoing').removeClass("ongoing");
var agenda_rows=$('[data-slot-start-ts]')
agenda_rows = agenda_rows.filter(function() {
return moment().isBetween(this.slot_start_ts, this.slot_end_ts);
$("div#now")
.remove("#now");
$('.table-warning')
.removeClass("table-warning");
var agenda_rows = $('[data-slot-start-ts]')
agenda_rows = agenda_rows.filter(function () {
return moment()
.isBetween(this.slot_start_ts, this.slot_end_ts);
});
agenda_rows.addClass("ongoing");
agenda_rows.first().children("th, td").
agenda_rows.addClass("table-warning");
agenda_rows.first()
.children("th, td")
.
prepend($('<div id="now" class="anchor-target"></div>'));
}

// Update tooltips
window.update_tooltips = function () {
var tooltips=$('.timetooltiptext');
tooltips.filter(function() {
return moment().isBetween(this.ustart_ts, this.uend_ts);
}).each(function () {
$(this).html(format_tooltip_table(this.start_ts, this.end_ts));
});
var tooltips = $('.timetooltiptext');
tooltips.filter(function () {
return moment()
.isBetween(this.ustart_ts, this.uend_ts);
})
.each(function () {
$(this)
.html(format_tooltip_table(this.start_ts, this.end_ts));
});
}

// Update all tooltips
window.update_tooltips_all = function () {
var tooltips=$('.timetooltiptext');
var tooltips = $('.timetooltiptext');
tooltips.each(function () {
$(this).html(format_tooltip_table(this.start_ts, this.end_ts));
$(this)
.html(format_tooltip_table(this.start_ts, this.end_ts));
});
}

// Update clock
window.update_clock = function () {
$('#current-time').html(format_time(moment(), get_current_tz_cb(), 0));
$('#current-time')
.html(format_time(moment(), get_current_tz_cb(), 0));
}

$.urlParam = function(name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
$.urlParam = function (name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)')
.exec(window.location.href);
if (results == null) {
return null;
} else {
Expand All @@ -217,10 +267,10 @@ window.init_timers = function () {
var fast_timer = 60000 / (speedup > 600 ? 600 : speedup);
update_clock();
highlight_ongoing();
setInterval(function() { update_clock(); }, fast_timer);
setInterval(function() { highlight_ongoing(); }, fast_timer);
setInterval(function() { update_tooltips(); }, fast_timer);
setInterval(function() { update_tooltips_all(); }, 3600000 / speedup);
setInterval(function () { update_clock(); }, fast_timer);
setInterval(function () { highlight_ongoing(); }, fast_timer);
setInterval(function () { update_tooltips(); }, fast_timer);
setInterval(function () { update_tooltips_all(); }, 3600000 / speedup);
}

// set method used to find current time zone
Expand Down
Loading

0 comments on commit a114ad9

Please sign in to comment.