Ссылка на репозиторий GitHub находится внизу этой статьи

Несколько недель назад я был придурком и украл конференц-зал, который был должным образом забронирован кем-то другим. Не желая быть придурком, но также желая иметь возможность зайти в неиспользуемое пространство для совещаний, не сверяясь с моим календарем, я решил, что дисплей, показывающий доступность конференц-зала, — это именно то, что мне нужно.

Там, где я работаю, MakeStickers, мы используем Google, я имею в виду G Suite, для нашей электронной почты и календаря. Моей первой мыслью было попробовать использовать API календаря, который есть у Google. Проблема в том, что Google (правильно) хочет, чтобы фактические пользователи входили в систему через OAuth 2 при использовании API календаря. Это не совсем соответствовало концепции отображения в общественных местах, к которой я стремился.

Но я нашел кое-что еще проще: Google предлагает URL-адрес iCal-канала календаря. Вы можете найти URL-адрес, перейдя на экран настроек для любого календаря, который вы хотите. URL-адрес iCal можно найти в нижней части страницы.

Что я построил

Будучи специалистом в области .NET, я создал простой сайт asp.net для размещения своего экрана в конференц-зале. Создание веб-страницы — очевидный выбор, поскольку в наши дни почти на любом устройстве есть веб-браузер.

На фронтенде я решил использовать Vue.js, потому что это просто и просто, как мне нужно было сделать (поскольку весь этот проект был послеобеденным развлечением на работе).

Работа с iCal — серверная часть

Я полагал, что работать с данными iCal будет просто, и по большей части так оно и есть, но одна концепция, которая пришла мне в голову во время работы над этим приложением, — это разница между событиями и событиями.

Если ваш календарь похож на календарь моей компании, у вас много повторяющихся событий. В данных iCal таких вхождений на самом деле не существует — они рассчитываются на основе информации о повторении одного события.

К счастью, есть фантастическая библиотека .net, которая упрощает работу с данными iCal. Он называется iCal.net и может быть установлен через NuGet с

Установочный пакет Ical.Net — версия 4.1.9

Используя библиотеку, можно получить список всех вхождений в диапазоне данных — например, всех вхождений между настоящим моментом и следующей неделей.

С помощью этого списка вхождений вы можете создать модель представления событий календаря, в которой есть время начала и окончания, сводка родительского события и организатор, т. е. создатель события.

В своем простом приложении я создал контроллер веб-API, который возвращает список моделей представления событий в JavaScript на веб-странице.

Интерфейс

Я хотел, чтобы страница обновлялась автоматически, часто и без проблем. Это также должно было быть чертовски просто. Основная цель дисплея — позволить некоторым людям зайти в конференц-зал и сразу узнать, можно ли им его использовать, и если да, то как долго.

Список предстоящих встреч аккуратный, но на самом деле не критическая часть.

Я решил использовать Vue.js, потому что я не мастер Angular. Приложение Vue.js очень простое. Я сделал несколько вычисляемых значений для поддержки основной миссии: переменная, чтобы сказать, свободна ли комната в данный момент, и переменная, чтобы хранить сообщение, когда будет следующее забронированное время.

Поскольку работать с датами и временем сложно, я использую очень популярную библиотеку JavaScript Moment.js. Я использую метод fromNow(), чтобы получить строку, описывающую дату следующей встречи. Это великолепно. Если в течение часа, будет написано через 18 минут. Если позже в тот же день, он скажет: Через 3 часа. Если еще позже, будет сказано: Через два дня. Это действительно приятный штрих, чтобы добавить немного класса в приложение. Никто не любит смотреть Следующая встреча через 56 часов.

Собираем все вместе

Каждые 10 секунд мой код вызывает мой метод веб-API и обновляет список предстоящих событий. Это работает лучше, чем я надеялся.

Один вопрос, который у меня возник, заключался в том, как быстро будет обновляться фид Google iCal календаря конференц-зала. Оказывается, он обновляется практически мгновенно. Я также не сталкивался с какими-либо проблемами с Google из-за пингования URL-адреса iCal каждые 10 секунд.

Вы можете скачать полный исходный код с GitHub здесь: https://github.com/adamfeil/RoomCalendar

Скажи привет в Твиттере. Я @adamfeil