31:T50a,agendaTracker = Plot.plot({ height: 120, marginRight: 30, width: width, x: { tickFormat: timeFormat }, y: { label: null, ticks: false, domain: [0, 10] }, color: { range: ["#f5f5f5", "#619EFA", "#4daf4a"] }, marks: [ Plot.text(parsedAgenda, { // The speaker annotations on the timeline text: "speaker", x: "start", y: () => 3, fill: "#C4C4C4" }), Plot.ruleY(parsedAgenda, { // Main agenda item line segments y: () => 5, x1: "start", x2: "stop", stroke: d => current && d.topic === current.topic, strokeWidth: 7, }), Plot.ruleX(parsedAgenda, { // White ticks between bars x: "stop", y1: d => 4, y2: d => 7, strokeWidth: 3, stroke: "white" }), ...(current ? [ Plot.text([current], { // The topic label text: "topic", x: () => now, y: () => 8 }), Plot.text([current], { // The speaker label text: "speaker", x: () => now, y: d => 10 }), Plot.ruleX([now], { // Time ticker / playhead thing x: d => d, y1: () => 4.5, y2: () => 7, strokeWidth: 3 }) ] : [] ) ] })32:T1e52,// https://stackoverflow.com/questions/38399465/how-to-get-list-of-all-timezones-in-javascript aryIannaTimeZones = [ 'Europe/Andorra', 'Asia/Dubai', 'Asia/Kabul', 'Europe/Tirane', 'Asia/Yerevan', 'Antarctica/Casey', 'Antarctica/Davis', 'Antarctica/DumontDUrville', // https://bugs.chromium.org/p/chromium/issues/detail?id=928068 'Antarctica/Mawson', 'Antarctica/Palmer', 'Antarctica/Rothera', 'Antarctica/Syowa', 'Antarctica/Troll', 'Antarctica/Vostok', 'America/Argentina/Buenos_Aires', 'America/Argentina/Cordoba', 'America/Argentina/Salta', 'America/Argentina/Jujuy', 'America/Argentina/Tucuman', 'America/Argentina/Catamarca', 'America/Argentina/La_Rioja', 'America/Argentina/San_Juan', 'America/Argentina/Mendoza', 'America/Argentina/San_Luis', 'America/Argentina/Rio_Gallegos', 'America/Argentina/Ushuaia', 'Pacific/Pago_Pago', 'Europe/Vienna', 'Australia/Lord_Howe', 'Antarctica/Macquarie', 'Australia/Hobart', 'Australia/Currie', 'Australia/Melbourne', 'Australia/Sydney', 'Australia/Broken_Hill', 'Australia/Brisbane', 'Australia/Lindeman', 'Australia/Adelaide', 'Australia/Darwin', 'Australia/Perth', 'Australia/Eucla', 'Asia/Baku', 'America/Barbados', 'Asia/Dhaka', 'Europe/Brussels', 'Europe/Sofia', 'Atlantic/Bermuda', 'Asia/Brunei', 'America/La_Paz', 'America/Noronha', 'America/Belem', 'America/Fortaleza', 'America/Recife', 'America/Araguaina', 'America/Maceio', 'America/Bahia', 'America/Sao_Paulo', 'America/Campo_Grande', 'America/Cuiaba', 'America/Santarem', 'America/Porto_Velho', 'America/Boa_Vista', 'America/Manaus', 'America/Eirunepe', 'America/Rio_Branco', 'America/Nassau', 'Asia/Thimphu', 'Europe/Minsk', 'America/Belize', 'America/St_Johns', 'America/Halifax', 'America/Glace_Bay', 'America/Moncton', 'America/Goose_Bay', 'America/Blanc-Sablon', 'America/Toronto', 'America/Nipigon', 'America/Thunder_Bay', 'America/Iqaluit', 'America/Pangnirtung', 'America/Atikokan', 'America/Winnipeg', 'America/Rainy_River', 'America/Resolute', 'America/Rankin_Inlet', 'America/Regina', 'America/Swift_Current', 'America/Edmonton', 'America/Cambridge_Bay', 'America/Yellowknife', 'America/Inuvik', 'America/Creston', 'America/Dawson_Creek', 'America/Fort_Nelson', 'America/Vancouver', 'America/Whitehorse', 'America/Dawson', 'Indian/Cocos', 'Europe/Zurich', 'Africa/Abidjan', 'Pacific/Rarotonga', 'America/Santiago', 'America/Punta_Arenas', 'Pacific/Easter', 'Asia/Shanghai', 'Asia/Urumqi', 'America/Bogota', 'America/Costa_Rica', 'America/Havana', 'Atlantic/Cape_Verde', 'America/Curacao', 'Indian/Christmas', 'Asia/Nicosia', 'Asia/Famagusta', 'Europe/Prague', 'Europe/Berlin', 'Europe/Copenhagen', 'America/Santo_Domingo', 'Africa/Algiers', 'America/Guayaquil', 'Pacific/Galapagos', 'Europe/Tallinn', 'Africa/Cairo', 'Africa/El_Aaiun', 'Europe/Madrid', 'Africa/Ceuta', 'Atlantic/Canary', 'Europe/Helsinki', 'Pacific/Fiji', 'Atlantic/Stanley', 'Pacific/Chuuk', 'Pacific/Pohnpei', 'Pacific/Kosrae', 'Atlantic/Faroe', 'Europe/Paris', 'Europe/London', 'Asia/Tbilisi', 'America/Cayenne', 'Africa/Accra', 'Europe/Gibraltar', 'America/Godthab', 'America/Danmarkshavn', 'America/Scoresbysund', 'America/Thule', 'Europe/Athens', 'Atlantic/South_Georgia', 'America/Guatemala', 'Pacific/Guam', 'Africa/Bissau', 'America/Guyana', 'Asia/Hong_Kong', 'America/Tegucigalpa', 'America/Port-au-Prince', 'Europe/Budapest', 'Asia/Jakarta', 'Asia/Pontianak', 'Asia/Makassar', 'Asia/Jayapura', 'Europe/Dublin', 'Asia/Jerusalem', 'Asia/Kolkata', 'Indian/Chagos', 'Asia/Baghdad', 'Asia/Tehran', 'Atlantic/Reykjavik', 'Europe/Rome', 'America/Jamaica', 'Asia/Amman', 'Asia/Tokyo', 'Africa/Nairobi', 'Asia/Bishkek', 'Pacific/Tarawa', 'Pacific/Enderbury', 'Pacific/Kiritimati', 'Asia/Pyongyang', 'Asia/Seoul', 'Asia/Almaty', 'Asia/Qyzylorda', 'Asia/Qostanay', // https://bugs.chromium.org/p/chromium/issues/detail?id=928068 'Asia/Aqtobe', 'Asia/Aqtau', 'Asia/Atyrau', 'Asia/Oral', 'Asia/Beirut', 'Asia/Colombo', 'Africa/Monrovia', 'Europe/Vilnius', 'Europe/Luxembourg', 'Europe/Riga', 'Africa/Tripoli', 'Africa/Casablanca', 'Europe/Monaco', 'Europe/Chisinau', 'Pacific/Majuro', 'Pacific/Kwajalein', 'Asia/Yangon', 'Asia/Ulaanbaatar', 'Asia/Hovd', 'Asia/Choibalsan', 'Asia/Macau', 'America/Martinique', 'Europe/Malta', 'Indian/Mauritius', 'Indian/Maldives', 'America/Mexico_City', 'America/Cancun', 'America/Merida', 'America/Monterrey', 'America/Matamoros', 'America/Mazatlan', 'America/Chihuahua', 'America/Ojinaga', 'America/Hermosillo', 'America/Tijuana', 'America/Bahia_Banderas', 'Asia/Kuala_Lumpur', 'Asia/Kuching', 'Africa/Maputo', 'Africa/Windhoek', 'Pacific/Noumea', 'Pacific/Norfolk', 'Africa/Lagos', 'America/Managua', 'Europe/Amsterdam', 'Europe/Oslo', 'Asia/Kathmandu', 'Pacific/Nauru', 'Pacific/Niue', 'Pacific/Auckland', 'Pacific/Chatham', 'America/Panama', 'America/Lima', 'Pacific/Tahiti', 'Pacific/Marquesas', 'Pacific/Gambier', 'Pacific/Port_Moresby', 'Pacific/Bougainville', 'Asia/Manila', 'Asia/Karachi', 'Europe/Warsaw', 'America/Miquelon', 'Pacific/Pitcairn', 'America/Puerto_Rico', 'Asia/Gaza', 'Asia/Hebron', 'Europe/Lisbon', 'Atlantic/Madeira', 'Atlantic/Azores', 'Pacific/Palau', 'America/Asuncion', 'Asia/Qatar', 'Indian/Reunion', 'Europe/Bucharest', 'Europe/Belgrade', 'Europe/Kaliningrad', 'Europe/Moscow', 'Europe/Simferopol', 'Europe/Kirov', 'Europe/Astrakhan', 'Europe/Volgograd', 'Europe/Saratov', 'Europe/Ulyanovsk', 'Europe/Samara', 'Asia/Yekaterinburg', 'Asia/Omsk', 'Asia/Novosibirsk', 'Asia/Barnaul', 'Asia/Tomsk', 'Asia/Novokuznetsk', 'Asia/Krasnoyarsk', 'Asia/Irkutsk', 'Asia/Chita', 'Asia/Yakutsk', 'Asia/Khandyga', 'Asia/Vladivostok', 'Asia/Ust-Nera', 'Asia/Magadan', 'Asia/Sakhalin', 'Asia/Srednekolymsk', 'Asia/Kamchatka', 'Asia/Anadyr', 'Asia/Riyadh', 'Pacific/Guadalcanal', 'Indian/Mahe', 'Africa/Khartoum', 'Europe/Stockholm', 'Asia/Singapore', 'America/Paramaribo', 'Africa/Juba', 'Africa/Sao_Tome', 'America/El_Salvador', 'Asia/Damascus', 'America/Grand_Turk', 'Africa/Ndjamena', 'Indian/Kerguelen', 'Asia/Bangkok', 'Asia/Dushanbe', 'Pacific/Fakaofo', 'Asia/Dili', 'Asia/Ashgabat', 'Africa/Tunis', 'Pacific/Tongatapu', 'Europe/Istanbul', 'America/Port_of_Spain', 'Pacific/Funafuti', 'Asia/Taipei', 'Europe/Kiev', 'Europe/Uzhgorod', 'Europe/Zaporozhye', 'Pacific/Wake', 'America/New_York', 'America/Detroit', 'America/Kentucky/Louisville', 'America/Kentucky/Monticello', 'America/Indiana/Indianapolis', 'America/Indiana/Vincennes', 'America/Indiana/Winamac', 'America/Indiana/Marengo', 'America/Indiana/Petersburg', 'America/Indiana/Vevay', 'America/Chicago', 'America/Indiana/Tell_City', 'America/Indiana/Knox', 'America/Menominee', 'America/North_Dakota/Center', 'America/North_Dakota/New_Salem', 'America/North_Dakota/Beulah', 'America/Denver', 'America/Boise', 'America/Phoenix', 'America/Los_Angeles', 'America/Anchorage', 'America/Juneau', 'America/Sitka', 'America/Metlakatla', 'America/Yakutat', 'America/Nome', 'America/Adak', 'Pacific/Honolulu', 'America/Montevideo', 'Asia/Samarkand', 'Asia/Tashkent', 'America/Caracas', 'Asia/Ho_Chi_Minh', 'Pacific/Efate', 'Pacific/Wallis', 'Pacific/Apia', 'Africa/Johannesburg' ];33:[] 2f:{"title":"Agenda Tracker (Clock Time)","cells":[{"id":0,"value":"md`# Agenda Tracker (Clock Time)\n\nThis template helps you block out time slots for agenda items to keep your meeting on track. Plan out your upcoming meeting with this agenda tracker! Simply fill in your meeting date, time, and agenda items & times, and the agenda tracker will do the rest. \n\nSee the Start Button version of the Agenda Tracker [here](https://observablehq.com/d/8d73434ab286e26c).\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1181,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1184,"value":"md`\n\n*1. Edit the [agenda](#agenda).*\n\n*2. Set the [meeting time](#meetingTimeInput).*\n\n*3. Watch the tracker below for updates!*\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":360,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":588,"value":"countdown = {\n if (d3.max(parsedAgenda, d => d.stop) < now) return md`The meeting is over.`\n else if (meetingTime < now) {\n const segmentDiff = current.stop - now\n return md`${current.speaker}: ${formatTime(segmentDiff)} remaining` }\n const diff = meetingTime - now;\n const intervals = [\n [d3.timeDay, \"day\"],\n [d3.timeHour, \"hour\"],\n [d3.timeMinute, \"minute\"],\n [d3.timeSecond, \"second\"]\n ]\n for (const [fn, text] of intervals) {\n const count = fn.count(0, diff)\n if (count) return md`The meeting begins in ${count} ${text}${count > 1 ? \"s\" : \"\"}.`\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":124,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":1027,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":626,"value":"md`## Agenda\nEach row should have the format: \n\n~~~\n- Name: description (duration in minutes)\n~~~\n\nThe name is always displayed in the timeline; the description only shows while that item is happening.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"rawAgenda = md`\n- Arrival: casual hangs (3)\n- Wade: something (9)\n- Jessica: another thing (25)\n- Wanda: some additional stuff (9)\n- Steven: closing remarks (2)\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1199,"value":"md`
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":718,"value":"meetingTimeInput = md` ### Set Meeting Time\n\nInput the date, time and timezone of your meeting below.\n- Date should be in the format **yyyy-mm-dd**\n- Time should be in the format **HH:MM** (24-hour clock)\n- Timezone is IANA standard such as America/Los_Angeles\n\nNeed help getting your times into the right format? Check out the date and time picking helpers [below](https://observablehq.com/d/a40f96877c883c0f?ui=next#dateTimePickingHelp).\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":710,"value":"date = '2021-05-13'","pinned":true,"hidden":false,"mode":"ojs"},{"id":729,"value":"time = \"07:30\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":857,"value":"timezone = \"America/Chicago\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":1080,"value":"md`The current meeting time is \n**${prettyDate(luxdate)}**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":902,"value":"dateTimePickingHelp = md`---\n## Date and Time picking helpers\n\nUse these date/time pickers to return your date, time, and timezone in the appropriate formats.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":883,"value":"viewof d = datePicker({value: date})","pinned":false,"hidden":false,"mode":"ojs"},{"id":898,"value":"md`Set the date to: **${d}**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":772,"value":"viewof t = timePicker({value: time})","pinned":false,"hidden":false,"mode":"ojs"},{"id":886,"value":"md`Set the time to: **${t}**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":821,"value":"viewof tzs = Inputs.search(aryIannaTimeZones, { query: Intl.DateTimeFormat().resolvedOptions().timeZone})","pinned":false,"hidden":false,"mode":"ojs"},{"id":843,"value":"viewof selectedZone = Inputs.table(tzs.map(d => ({ timezone: d })))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1100,"value":"timeZoneDisplay = {\n if (selectedZone[0]) {\n return md`Set the timezone to: **${selectedZone[0].timezone}**`\n }\n else {\n return md`Select a timezone above ☝️`\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":631,"value":"md`---\n\n## Appendix`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1170,"value":"md`\nThis agenda tracker uses clock time to track and display when a meeting is about to start, how much time is left for each person or segment of the meeting while it's happening, and when the meeting has passed. The current meeting status will be visible to anyone looking at the notebook, with the times on the timeline showing up in each person's local time (according to their browser). \n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":501,"value":"meetingTime = new Date(luxdate)","pinned":false,"hidden":false,"mode":"ojs"},{"id":701,"value":"timestring = `${date}T${time}`","pinned":false,"hidden":false,"mode":"ojs"},{"id":787,"value":"luxdate = luxon.DateTime.fromISO(timestring, {zone: timezone }).toString()","pinned":false,"hidden":false,"mode":"ojs"},{"id":750,"value":"prettyDate = d => new Date(d).toLocaleString(undefined, {\n \"timeZoneName\": \"long\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"function parseAgenda(s) {\n // Regex defines 3 capture groups for speaker, topic, duration\n let re = /^[-\\*]*\\s*(\\w+): (.*) \$(.*)\$$/;\n let items = [];\n let lines = s.split(\"\\n\")\n let time = meetingTime;\n \n // Iterate through lines of text\n for (let i = 0; i < lines.length; i++) {\n // Skip blank lines\n if (lines[i] === \"\") {\n continue;\n }\n \n // Run the regex\n let [, speaker, topic, duration] = re.exec(lines[i]);\n duration = +duration;\n \n const endTime = d3.timeSecond.offset(time, duration * 60);\n \n // Create a processed agenda item\n let item = {\n speaker,\n topic,\n duration,\n start: time,\n stop: endTime\n }\n items.push(item);\n time = endTime;\n }\n \n return items;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"parsedAgenda = parseAgenda(rawAgenda.innerText);","pinned":false,"hidden":false,"mode":"ojs"},{"id":499,"value":"current = parsedAgenda.find(({start, stop}) => now >= start && now < stop)","pinned":false,"hidden":false,"mode":"ojs"},{"id":480,"value":"now = {\n do {\n yield new Date()\n // tick once a minute until a minute before the meeting\n await Promises.tick(meetingTime - new Date() > 60 * 1000 ? 60 * 1000 : 1000)\n }\n while (new Date() < d3.max(parsedAgenda, d => d.stop))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":953,"value":"formatTime = d3.timeFormat(\"%M:%S\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":987,"value":"warningThreshold = 30 * 1000","pinned":false,"hidden":false,"mode":"ojs"},{"id":521,"value":"timeFormat = (date, i) => {\n if (!i) return date.toLocaleTimeString('en-US');\n return d3.timeMinute(date) < date \n ? \":\" + date.toLocaleTimeString('en-US', {second: \"numeric\", minute: \"numeric\"})\n : d3.timeHour(date) < date ? \":\" + date.toLocaleTimeString('en-US', {minute: \"numeric\"}) \n : date.toLocaleTimeString('en-US')\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":782,"value":"luxon = require('luxon@1.26.0/build/amd/luxon.js')","pinned":false,"hidden":false,"mode":"ojs"},{"id":816,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":692,"value":"import {time as timePicker, date as datePicker} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}