opendev/irc-meetings
Code Issues Proposed changes
9838f4801f
irc-meetings/meetingindex.jinja
Ryan Selden 3ca7f01a32 Add a UTC clock and integrate local meeting time 
It's a bit difficult to use the meeting schedule page
if you're not in UTC time.

This patch adds a little clock at the top (in UTC time)
for those in far away time zones who don't want to keep track.
It also adds a tooltip to each time link that displays
the meeting time in the browser's local time.

The clock uses JavaScript, and is set up properly
to display a message on unsupported browsers.

Note: for tooltip functionality, Bootstrap JS
and jQuery are added with this patch (using
a CDN just like Bootstrap CSS on the same page)

To test, clone this change, run `tox`, and serve from the
output/ directory (use `python -m SimpleHTTPServer PORT`).

Change-Id: I8ec40caa425199a2efef2a0bf345dfbb07054482
2016-08-28 16:32:21 +00:00

156 lines
6.1 KiB
Django/Jinja
Raw Blame History

<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<style>
h2,h3 {margin-top: 30px;}
.masterheader {position:relative;padding:15px 30px;color:white;background-color:#760000;}
.meeting_index ul { height: auto; width:100%; }
.meeting_index ul li { display: block; }
@media(min-width: 480px){
.meeting_index ul{-webkit-column-count:1;-moz-column-count:1;column-count:1;}
}
@media(min-width: 768px){
.meeting_index ul{-webkit-column-count:2;-moz-column-count:2;column-count:2;}
}
@media(min-width: 992px){
.meeting_index ul{-webkit-column-count:3;-moz-column-count:3;column-count:3;}
}
@media(min-width: 1150px){
.meeting_index ul{-webkit-column-count:4;-moz-column-count:4;column-count:4;}
}
</style>
<title>OpenStack IRC meetings</title>
</head>
<body>
<div class="masterheader">
<h1>OpenStack IRC meetings</h1>
</div>
<div class="container">
<h2>Logging</h2>
<p>OpenStack IRC channels and logged. You can find them here:</p>
<div class="well"><span class="glyphicon glyphicon-fast-backward"></span>&nbsp;
<a href="irclogs/">IRC Channel Logs</a></div>
<p>Links to specific meeting logs can be found on meeting descriptions below.</p>
<h2>Meeting schedule</h2>
<p>The IRC meetings schedule is driven by the
<a href=http://git.openstack.org/cgit/openstack-infra/irc-meetings/tree/>openstack-infra/irc-meetings</a> repository.
To propose a change, please submit a change to that repository in Gerrit.</p>
<p>Here is the link to an ICS file containing all OpenStack IRC meetings, for
use in your favorite calendaring app:</p>
<div class="well"><span class="glyphicon glyphicon-download"></span>&nbsp;
<a href="irc-meetings.ical">iCalendar Complete Meeting Schedule</a>
</div>
<h2>Meeting details</h2>
<small>
<div class="meeting_index">
<ul>
{% for meeting in meetings|sort(attribute='project') %}
<li><a href="#{{ meeting.project|replace(' ', '_') }}">{{ meeting.project }}</a></li>
{% endfor %}
</ul>
</div>
</small>
{% for meeting in meetings|sort(attribute='project') %}
<a id="{{ meeting.project|replace(' ', '_') }}"></a>
<h3>{{ meeting.project }}</h3>
<div class="panel panel-default">
<div class="panel-heading"><small>{{ meeting.description|urlize }}</small>
</div>
<div class="panel-body">
{% for schedule in meeting.schedules %}
<div><span class="glyphicon glyphicon-time"></span>&nbsp;
{{ schedule.recurrence }} on {{ schedule.day }} at
<a data-toggle="tooltip" data-placement="top" title="NotFilledInYet" utctime="{{schedule.utc}}" weekday="{{schedule.day}}"
href="http://www.timeanddate.com/worldclock/fixedtime.html?hour={{ schedule.utc[:2] }}&amp;min={{ schedule.utc[2:] }}&amp;sec=0"
class="timelink">
{{ schedule.utc }} UTC
</a>
in <a href="ircs://irc.freenode.net:6697/{{ schedule.irc }}">#{{ schedule.irc }}</a>
(IRC <a href="https://webchat.freenode.net/?randomnick=1&channels=%23{{ schedule.irc }}&prompt=1&uio=d4">webclient</a>)
</div>
{% endfor %}
<div><span class="glyphicon glyphicon-calendar"></span>&nbsp;
<a href="calendars/{{ meeting.outfile }}">ICS file</a> for this specific
meeting</div>
<div><span class="glyphicon glyphicon-user"></span>&nbsp;
Chair (to contact for more information): {{ meeting.chair }}</div>
{% if meeting.extras.meeting_id %}
<div><span class="glyphicon glyphicon-fast-backward"></span>&nbsp;
Logs from <a href="http://eavesdrop.openstack.org/meetings/{{meeting.extras.meeting_id|replace('-', '_')}}/">past meetings</a></div>
<div><span class="glyphicon glyphicon-tags"></span>&nbsp;
Start this meeting using: <tt>#startmeeting {{meeting.extras.meeting_id|replace('-', '_')}}</tt>
</div>
{% endif %}
{% if meeting.extras.agenda_url %}
<div><span class="glyphicon glyphicon-list-alt"></span>&nbsp;
<a href="{{meeting.extras.agenda_url}}">Agenda</a> for next meeting</div>
{% endif %}
</div>
</div>
{% endfor %}
<small>Page generated on {{ timestamp }} UTC</small>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script>
function setTimeTooltips() {
var timelinks = [].slice.call(document.getElementsByClassName('timelink'));
for (var i in timelinks) {
var link = timelinks[i];
var local_date = new Date();
var local_zone_name = local_date.toLocaleString('en', {timeZoneName:'short'}).split(' ').pop();
var offset = local_date.getTimezoneOffset() / 60 * 100;
var utc_meeting_time = link.getAttribute('utctime');
var local_meeting_time = parseInt(utc_meeting_time) - offset;
var day_offset = 0;
if (local_meeting_time < 0) {
day_offset = -1;
local_meeting_time += 2400;
} else if (local_meeting_time > 2400) {
day_offset = 1;
local_meeting_time -= 2400;
}
local_meeting_time = checkUTC4DigitString(String(local_meeting_time));
var weekday = link.getAttribute('weekday');
weekday = moveWeekday(weekday, day_offset);
weekday = toTitleCase(weekday);
link.title = weekday + ' at ' + local_meeting_time + ' ' + local_zone_name;
}
}
function toTitleCase(str) {
return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}
function checkUTC4DigitString(s) { // turns '100' into '0100'
return repeat('0', 4 - s.length) + s;
}
function repeat(s, n){
var a = [];
while(a.length < n){
a.push(s);
}
return a.join('');
}
function moveWeekday(day, offset) {
var days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
var i = days.indexOf(day.toLowerCase());
i += offset;
if (i < 0)
i += 7;
else if (i > 6)
i -= 7;
return days[i];
}
$(document).ready(function(){
setTimeTooltips()
$('[data-toggle="tooltip"]').tooltip();
});
</script>
</body>
</html>
View Git Blame Copy Permalink