LibGUI+Calendar: Make Calendar a common widget in LibGUI

Refactors the Calendar widget into LibGUI and updates the Calendar
app interface. Calendar widget lets layout engine manage most of
its geometry now and has a few new features like tile click
navigation, hover highlighting and a togglable year/month mode.

11 files changed, 631 insertions, 485 deletions

diff --git a/Applications/Calendar/AddEventDialog.cpp b/Applications/Calendar/AddEventDialog.cpp
index 24b3ed30e5..f6d2d1414f 100644
--- a/Applications/Calendar/AddEventDialog.cpp
+++ b/Applications/Calendar/AddEventDialog.cpp
@@ -39,14 +39,19 @@
 #include <LibGfx/Color.h>
 #include <LibGfx/Font.h>
 
-AddEventDialog::AddEventDialog(RefPtr<Calendar> calendar, Core::DateTime date_time, Window* parent_window)
+static const char* short_month_names[] = {
+    "Jan", "Feb", "Mar", "Apr", "May", "Jun",
+    "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
+};
+
+AddEventDialog::AddEventDialog(Core::DateTime date_time, Window* parent_window)
     : Dialog(parent_window)
-    , m_calendar(calendar)
     , m_date_time(date_time)
 {
     resize(158, 100);
     set_title("Add Event");
     set_resizable(false);
+    set_icon(parent_window->icon());
 
     auto& widget = set_main_widget<GUI::Widget>();
     widget.set_fill_with_background_color(true);
@@ -148,7 +153,7 @@ String AddEventDialog::MonthListModel::column_name(int column) const
 
 GUI::Variant AddEventDialog::MonthListModel::data(const GUI::ModelIndex& index, GUI::ModelRole role) const
 {
-    auto& month = Calendar::name_of_month(index.row() + 1);
+    auto& month = short_month_names[index.row()];
     if (role == GUI::ModelRole::Display) {
         switch (index.column()) {
         case Column::Month:
diff --git a/Applications/Calendar/AddEventDialog.h b/Applications/Calendar/AddEventDialog.h
index b19394c3d8..c84e494527 100644
--- a/Applications/Calendar/AddEventDialog.h
+++ b/Applications/Calendar/AddEventDialog.h
@@ -26,7 +26,7 @@
 
 #pragma once
 
-#include "Calendar.h"
+#include <LibGUI/Calendar.h>
 #include <LibGUI/Dialog.h>
 #include <LibGUI/Model.h>
 #include <LibGUI/Window.h>
@@ -36,14 +36,14 @@ class AddEventDialog final : public GUI::Dialog {
 public:
     virtual ~AddEventDialog() override;
 
-    static void show(RefPtr<Calendar> calendar, Core::DateTime date_time, Window* parent_window = nullptr)
+    static void show(Core::DateTime date_time, Window* parent_window = nullptr)
     {
-        auto dialog = AddEventDialog::construct(calendar, date_time, parent_window);
+        auto dialog = AddEventDialog::construct(date_time, parent_window);
         dialog->exec();
     }
 
 private:
-    AddEventDialog(RefPtr<Calendar> calendar, Core::DateTime date_time, Window* parent_window = nullptr);
+    AddEventDialog(Core::DateTime date_time, Window* parent_window = nullptr);
 
     class MonthListModel final : public GUI::Model {
     public:
@@ -65,6 +65,5 @@ private:
         MonthListModel();
     };
 
-    RefPtr<Calendar> m_calendar;
     Core::DateTime m_date_time;
 };
diff --git a/Applications/Calendar/CMakeLists.txt b/Applications/Calendar/CMakeLists.txt
index d08fb39f3f..77fbce1675 100644
--- a/Applications/Calendar/CMakeLists.txt
+++ b/Applications/Calendar/CMakeLists.txt
@@ -1,7 +1,5 @@
 set(SOURCES
     AddEventDialog.cpp
-    Calendar.cpp
-    CalendarWidget.cpp
     main.cpp
 )
 
diff --git a/Applications/Calendar/Calendar.cpp b/Applications/Calendar/Calendar.cpp
deleted file mode 100644
index f921169b2f..0000000000
--- a/Applications/Calendar/Calendar.cpp
+++ /dev/null
@@ -1,60 +0,0 @@
-/*
- * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
- * All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions are met:
- *
- * 1. Redistributions of source code must retain the above copyright notice, this
- *    list of conditions and the following disclaimer.
- *
- * 2. Redistributions in binary form must reproduce the above copyright notice,
- *    this list of conditions and the following disclaimer in the documentation
- *    and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
- * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
- * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
- * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
- * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
- * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
- * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
- * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
- * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-#include "Calendar.h"
-
-const String Calendar::name_of_month(int month)
-{
-    static const String month_names[] = { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" };
-    return month_names[month - 1];
-}
-
-Calendar::Calendar(Core::DateTime date_time)
-    : m_date_time(date_time)
-    , m_selected_year(date_time.year())
-    , m_selected_month(date_time.month())
-{
-}
-
-Calendar::~Calendar()
-{
-}
-
-const String Calendar::selected_date_text()
-{
-    return String::format("%s %d", name_of_month(m_selected_month).characters(), m_selected_year);
-}
-
-void Calendar::set_selected_date(int year, int month)
-{
-    m_selected_year = year;
-    m_selected_month = month;
-}
-
-bool Calendar::is_today(Core::DateTime date_time) const
-{
-    return date_time.day() == m_date_time.day() && date_time.month() == m_date_time.month() && date_time.year() == m_date_time.year();
-}
diff --git a/Applications/Calendar/Calendar.h b/Applications/Calendar/Calendar.h
deleted file mode 100644
index 4ec979cb2d..0000000000
--- a/Applications/Calendar/Calendar.h
+++ /dev/null
@@ -1,52 +0,0 @@
-/*
- * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
- * All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions are met:
- *
- * 1. Redistributions of source code must retain the above copyright notice, this
- *    list of conditions and the following disclaimer.
- *
- * 2. Redistributions in binary form must reproduce the above copyright notice,
- *    this list of conditions and the following disclaimer in the documentation
- *    and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
- * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
- * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
- * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
- * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
- * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
- * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
- * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
- * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-#pragma once
-
-#include <AK/String.h>
-#include <LibCore/DateTime.h>
-
-const String name_of_month(int month);
-
-class Calendar final : public RefCounted<Calendar> {
-public:
-    static const String name_of_month(int month);
-
-    Calendar(Core::DateTime date_time);
-    ~Calendar();
-
-    const String selected_date_text();
-    void set_selected_date(int year, int month);
-    int selected_year() const { return m_selected_year; }
-    int selected_month() const { return m_selected_month; }
-    bool is_today(Core::DateTime date_time) const;
-    void add_event(Core::DateTime date_time);
-
-private:
-    Core::DateTime m_date_time;
-    int m_selected_year { 0 };
-    int m_selected_month { 0 };
-};
diff --git a/Applications/Calendar/CalendarWidget.cpp b/Applications/Calendar/CalendarWidget.cpp
deleted file mode 100644
index 045028107d..0000000000
--- a/Applications/Calendar/CalendarWidget.cpp
+++ /dev/null
@@ -1,274 +0,0 @@
-/*
- * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
- * All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions are met:
- *
- * 1. Redistributions of source code must retain the above copyright notice, this
- *    list of conditions and the following disclaimer.
- *
- * 2. Redistributions in binary form must reproduce the above copyright notice,
- *    this list of conditions and the following disclaimer in the documentation
- *    and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
- * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
- * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
- * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
- * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
- * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
- * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
- * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
- * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-#include "CalendarWidget.h"
-#include "AddEventDialog.h"
-#include "Calendar.h"
-#include <LibCore/DateTime.h>
-#include <LibGUI/BoxLayout.h>
-#include <LibGUI/Button.h>
-#include <LibGUI/Painter.h>
-#include <LibGUI/Window.h>
-#include <LibGfx/Font.h>
-#include <LibGfx/Palette.h>
-
-CalendarWidget::CalendarWidget()
-{
-    m_calendar = adopt(*new Calendar(Core::DateTime::now()));
-
-    set_fill_with_background_color(true);
-    set_layout<GUI::VerticalBoxLayout>();
-
-    m_top_container = add<Widget>();
-    m_top_container->set_layout<GUI::HorizontalBoxLayout>();
-    m_top_container->layout()->set_margins({ 4, 4, 4, 4 });
-    m_top_container->set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
-    m_top_container->set_preferred_size(0, 45);
-
-    auto& top_left_container = m_top_container->add<Widget>();
-    top_left_container.set_layout<GUI::HorizontalBoxLayout>();
-    top_left_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
-    top_left_container.set_preferred_size(0, 45);
-    m_selected_date_label = top_left_container.add<GUI::Label>(m_calendar->selected_date_text());
-    m_selected_date_label->set_font(Gfx::Font::default_bold_font());
-    m_selected_date_label->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-    m_selected_date_label->set_preferred_size(80, 14);
-    m_selected_date_label->set_text_alignment(Gfx::TextAlignment::Center);
-
-    m_bottom_container = add<Widget>();
-
-    m_prev_month_button = top_left_container.add<GUI::Button>("<");
-    m_prev_month_button->set_font(Gfx::Font::default_bold_font());
-    m_prev_month_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-    m_prev_month_button->set_preferred_size(40, 40);
-    m_prev_month_button->on_click = [this](auto) {
-        int m_target_month = m_calendar->selected_month() - 1;
-        int m_target_year = m_calendar->selected_year();
-
-        if (m_calendar->selected_month() <= 1) {
-            m_target_month = 12;
-            m_target_year--;
-        }
-        update_calendar_tiles(m_target_year, m_target_month);
-    };
-
-    m_next_month_button = top_left_container.add<GUI::Button>(">");
-    m_next_month_button->set_font(Gfx::Font::default_bold_font());
-    m_next_month_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-    m_next_month_button->set_preferred_size(40, 40);
-    m_next_month_button->on_click = [this](auto) {
-        int m_target_month = m_calendar->selected_month() + 1;
-        int m_target_year = m_calendar->selected_year();
-
-        if (m_calendar->selected_month() >= 12) {
-            m_target_month = 1;
-            m_target_year++;
-        }
-        update_calendar_tiles(m_target_year, m_target_month);
-    };
-
-    auto& top_right_container = m_top_container->add<Widget>();
-    top_right_container.set_layout<GUI::HorizontalBoxLayout>();
-    top_right_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
-    top_right_container.set_preferred_size(0, 45);
-
-    top_right_container.layout()->add_spacer();
-
-    m_add_event_button = top_right_container.add<GUI::Button>("Add Event");
-    m_add_event_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-    m_add_event_button->set_preferred_size(100, 25);
-    m_add_event_button->on_click = [this](auto) {
-        show_add_event_window();
-    };
-
-    update_calendar_tiles(m_calendar->selected_year(), m_calendar->selected_month());
-}
-
-CalendarWidget::~CalendarWidget()
-{
-}
-
-void CalendarWidget::resize_event(GUI::ResizeEvent& event)
-{
-    if (event.size().width() < 350) {
-        if (m_next_month_button->size_policy(Orientation::Horizontal) == GUI::SizePolicy::Fixed)
-            m_next_month_button->set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
-        if (m_prev_month_button->size_policy(Orientation::Horizontal) == GUI::SizePolicy::Fixed)
-            m_prev_month_button->set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
-    } else {
-        if (m_next_month_button->size_policy(Orientation::Horizontal) == GUI::SizePolicy::Fill)
-            m_next_month_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-        if (m_prev_month_button->size_policy(Orientation::Horizontal) == GUI::SizePolicy::Fill)
-            m_prev_month_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fixed);
-    }
-
-    if (m_top_container->height() > event.size().height() / 3) {
-        if (m_top_container->is_visible())
-            m_top_container->set_visible(false);
-    } else if (!m_top_container->is_visible())
-        m_top_container->set_visible(true);
-
-    int top_container_height = (m_top_container->is_visible()) ? 47 : 0;
-    m_tile_width = event.size().width() / 7;
-    m_tile_height = (event.size().height() - top_container_height) / 5;
-
-    int i = 0;
-    for (int y = 0; y < 5; y++)
-        for (int x = 0; x < 7; x++) {
-            int x_offset = x * m_tile_width;
-            int y_offset = (y * m_tile_height);
-            m_calendar_tiles[i]->set_relative_rect(x_offset, y_offset, m_tile_width, m_tile_height);
-            i++;
-        }
-}
-
-void CalendarWidget::update_calendar_tiles(int target_year, int target_month)
-{
-    unsigned int i = 0;
-    //TODO: Modify m_tile_height if the end of the month doesn't fit onto the current tile array
-    for (int y = 0; y < 5; y++)
-        for (int x = 0; x < 7; x++) {
-            auto date_time = Core::DateTime::create(target_year, target_month, 1);
-            int x_offset = x * m_tile_width;
-            int y_offset = (y * m_tile_height);
-
-            unsigned int start_of_month = date_time.weekday();
-            unsigned int year;
-            unsigned int month;
-            unsigned int day;
-
-            if (start_of_month > i) {
-                month = (target_month - 1 == 0) ? 12 : target_month - 1;
-                year = (month == 12) ? target_year - 1 : target_year;
-                date_time.set_time(year, month, 1);
-                day = (date_time.days_in_month() - (start_of_month) + i) + 1;
-                date_time.set_time(year, month, day);
-
-            } else if ((i - start_of_month) + 1 > date_time.days_in_month()) {
-                month = (target_month + 1) > 12 ? 1 : target_month + 1;
-                year = (month == 1) ? target_year + 1 : target_year;
-                day = ((i - start_of_month) + 1) - date_time.days_in_month();
-                date_time.set_time(year, month, day);
-            } else {
-                month = target_month;
-                year = target_year;
-                day = (i - start_of_month) + 1;
-                date_time.set_time(year, month, day);
-            }
-
-            if (!m_calendar_tiles[i]) {
-                m_calendar_tiles[i] = m_bottom_container->add<CalendarTile>(*m_calendar, i, date_time);
-                m_calendar_tiles[i]->set_frame_thickness(0);
-                m_calendar_tiles[i]->set_relative_rect(x_offset, y_offset, 85, 85);
-            } else {
-                m_calendar_tiles[i]->update_values(*m_calendar, i, date_time);
-                m_calendar_tiles[i]->update();
-            }
-            i++;
-        }
-
-    m_calendar->set_selected_date(target_year, target_month);
-    m_selected_date_label->set_text(m_calendar->selected_date_text());
-}
-
-void CalendarWidget::show_add_event_window()
-{
-    AddEventDialog::show(m_calendar, Core::DateTime::now(), window());
-}
-
-CalendarWidget::CalendarTile::CalendarTile(Calendar& calendar, int index, Core::DateTime date_time)
-    : m_index(index)
-    , m_date_time(date_time)
-    , m_calendar(calendar)
-{
-    update_values(calendar, index, date_time);
-}
-
-void CalendarWidget::CalendarTile::update_values(Calendar& calendar, int index, Core::DateTime date_time)
-{
-    m_calendar = calendar;
-    m_index = index;
-    m_date_time = date_time;
-    m_display_weekday_name = index < 7;
-
-    if (m_display_weekday_name) {
-        static const String m_day_names[] = { "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" };
-        m_weekday_name = m_day_names[index];
-    }
-
-    m_display_date = (m_date_time.day() == 1) ? String::format("%s %d", Calendar::name_of_month(m_date_time.month()).characters(), m_date_time.day()) : String::number(m_date_time.day());
-}
-
-CalendarWidget::CalendarTile::~CalendarTile()
-{
-}
-
-void CalendarWidget::CalendarTile::doubleclick_event(GUI::MouseEvent& event)
-{
-    GUI::Widget::doubleclick_event(event);
-    //TOOD: Should be calling show_add_event_window. Would we just replace m_calender /w m_calender_widget?
-    AddEventDialog::show(m_calendar, m_date_time, window());
-}
-
-void CalendarWidget::CalendarTile::paint_event(GUI::PaintEvent& event)
-{
-    GUI::Frame::paint_event(event);
-
-    GUI::Painter painter(*this);
-    painter.add_clip_rect(frame_inner_rect());
-    painter.fill_rect(frame_inner_rect(), palette().base());
-
-    painter.draw_line(frame_inner_rect().top_right(), frame_inner_rect().bottom_right(), Color::NamedColor::Black);
-    if (m_index == 0 || m_index % 7 == 0)
-        painter.draw_line(frame_inner_rect().top_left(), frame_inner_rect().bottom_left(), Color::NamedColor::Black);
-
-    if (m_index < 7)
-        painter.draw_line(frame_inner_rect().top_left(), frame_inner_rect().top_right(), Color::NamedColor::Black);
-    painter.draw_line(frame_inner_rect().bottom_left(), frame_inner_rect().bottom_right(), Color::NamedColor::Black);
-
-    Gfx::IntRect day_rect = Gfx::IntRect(frame_inner_rect().x(), frame_inner_rect().y(), frame_inner_rect().width(), font().glyph_height() + 4);
-
-    int weekday_characters_width = (font().glyph_width('0') * (m_weekday_name.length() + 1)) + 4;
-    if (m_display_weekday_name && (frame_inner_rect().height() > (font().glyph_height() + 4) * 2) && (frame_inner_rect().width() > weekday_characters_width)) {
-        auto weekday_rect = Gfx::IntRect(frame_inner_rect().x(), frame_inner_rect().y(), frame_inner_rect().width(), font().glyph_height() + 4);
-        weekday_rect.set_top(frame_inner_rect().y() + 2);
-        painter.draw_text(weekday_rect, m_weekday_name, Gfx::Font::default_bold_font(), Gfx::TextAlignment::Center, palette().base_text());
-        day_rect.set_y(frame_inner_rect().y() + 15);
-    } else {
-        day_rect = Gfx::IntRect(frame_inner_rect().x(), frame_inner_rect().y(), frame_inner_rect().width(), font().glyph_height() + 4);
-        day_rect.set_y(frame_inner_rect().y() + 4);
-    }
-
-    int highlight_rect_width = (font().glyph_width('0') * (m_display_date.length() + 1)) + 2;
-    auto display_date = (m_date_time.day() == 1 && frame_inner_rect().width() > highlight_rect_width) ? m_display_date : String::number(m_date_time.day());
-
-    if (m_calendar->is_today(m_date_time)) {
-        auto highlight_rect = Gfx::IntRect(day_rect.width() / 2 - (highlight_rect_width / 2), day_rect.y(), highlight_rect_width, font().glyph_height() + 4);
-        painter.draw_rect(highlight_rect, palette().base_text());
-        painter.draw_text(day_rect, display_date, Gfx::Font::default_bold_font(), Gfx::TextAlignment::Center, palette().base_text());
-    } else
-        painter.draw_text(day_rect, display_date, Gfx::TextAlignment::Center, palette().base_text());
-}
diff --git a/Applications/Calendar/CalendarWidget.h b/Applications/Calendar/CalendarWidget.h
deleted file mode 100644
index f40d19ad61..0000000000
--- a/Applications/Calendar/CalendarWidget.h
+++ /dev/null
@@ -1,79 +0,0 @@
-/*
- * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
- * All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions are met:
- *
- * 1. Redistributions of source code must retain the above copyright notice, this
- *    list of conditions and the following disclaimer.
- *
- * 2. Redistributions in binary form must reproduce the above copyright notice,
- *    this list of conditions and the following disclaimer in the documentation
- *    and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
- * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
- * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
- * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
- * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
- * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
- * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
- * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
- * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-#pragma once
-
-#include "Calendar.h"
-#include <LibGUI/Frame.h>
-#include <LibGUI/Label.h>
-#include <LibGUI/Widget.h>
-
-class CalendarWidget final : public GUI::Widget {
-    C_OBJECT(CalendarWidget)
-
-public:
-    CalendarWidget();
-    virtual ~CalendarWidget() override;
-
-    void show_add_event_window();
-
-private:
-    virtual void resize_event(GUI::ResizeEvent&) override;
-
-    void update_calendar_tiles(int target_year, int target_month);
-
-    RefPtr<Calendar> m_calendar;
-    RefPtr<GUI::Widget> m_top_container;
-    RefPtr<GUI::Widget> m_bottom_container;
-    RefPtr<GUI::Label> m_selected_date_label;
-    RefPtr<GUI::Button> m_prev_month_button;
-    RefPtr<GUI::Button> m_next_month_button;
-    RefPtr<GUI::Button> m_add_event_button;
-
-    class CalendarTile final : public GUI::Frame {
-        C_OBJECT(CalendarTile)
-    public:
-        CalendarTile(Calendar& calendar, int index, Core::DateTime m_date_time);
-        void update_values(Calendar& calendar, int index, Core::DateTime date_time);
-        virtual ~CalendarTile() override;
-
-    private:
-        virtual void doubleclick_event(GUI::MouseEvent&) override;
-        virtual void paint_event(GUI::PaintEvent&) override;
-
-        int m_index { 0 };
-        bool m_display_weekday_name { false };
-
-        String m_weekday_name;
-        String m_display_date;
-        Core::DateTime m_date_time;
-        RefPtr<Calendar> m_calendar;
-    };
-
-    RefPtr<CalendarTile> m_calendar_tiles[35];
-    int m_tile_width { 85 };
-    int m_tile_height { 85 };
-};
diff --git a/Applications/Calendar/main.cpp b/Applications/Calendar/main.cpp
index bc4a872a97..fef03594fd 100644
--- a/Applications/Calendar/main.cpp
+++ b/Applications/Calendar/main.cpp
@@ -24,14 +24,22 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-#include "CalendarWidget.h"
+#include "AddEventDialog.h"
 #include <LibGUI/AboutDialog.h>
 #include <LibGUI/Action.h>
 #include <LibGUI/Application.h>
+#include <LibGUI/BoxLayout.h>
+#include <LibGUI/Button.h>
+#include <LibGUI/Calendar.h>
+#include <LibGUI/Icon.h>
 #include <LibGUI/Menu.h>
 #include <LibGUI/MenuBar.h>
+#include <LibGUI/ToolBar.h>
+#include <LibGUI/ToolBarContainer.h>
 #include <LibGUI/Window.h>
 #include <LibGfx/Bitmap.h>
+#include <LibGfx/Color.h>
+#include <LibGfx/Font.h>
 #include <stdio.h>
 
 int main(int argc, char** argv)
@@ -56,23 +64,111 @@ int main(int argc, char** argv)
 
     unveil(nullptr, nullptr);
 
+    auto app_icon = GUI::Icon::default_icon("app-calendar");
     auto window = GUI::Window::construct();
     window->set_title("Calendar");
-    window->resize(596, 475);
+    window->resize(600, 480);
+    window->set_icon(app_icon.bitmap_for_size(16));
 
-    auto& calendar_widget = window->set_main_widget<CalendarWidget>();
-    window->show();
-    window->set_icon(Gfx::Bitmap::load_from_file("/res/icons/16x16/app-calendar.png"));
+    auto& root_container = window->set_main_widget<GUI::Widget>();
+    root_container.set_fill_with_background_color(true);
+    root_container.set_layout<GUI::VerticalBoxLayout>();
+
+    auto& toolbar_container = root_container.add<GUI::ToolBarContainer>();
+    auto& toolbar = toolbar_container.add<GUI::ToolBar>();
+
+    auto& calendar_container = root_container.add<GUI::Frame>();
+    calendar_container.set_layout<GUI::VerticalBoxLayout>();
+    calendar_container.layout()->set_margins({ 2, 2, 2, 2 });
+    auto& calendar_widget = calendar_container.add<GUI::Calendar>(Core::DateTime::now());
+
+    RefPtr<GUI::Button> selected_calendar_button;
+
+    auto prev_date_action = GUI::Action::create("Previous date", { Mod_Alt, Key_Left }, Gfx::Bitmap::load_from_file("/res/icons/16x16/go-back.png"), [&](const GUI::Action&) {
+        unsigned int target_month = calendar_widget.selected_month();
+        unsigned int target_year = calendar_widget.selected_year();
+
+        if (calendar_widget.mode() == GUI::Calendar::Month) {
+            target_month--;
+            if (calendar_widget.selected_month() <= 1) {
+                target_month = 12;
+                target_year--;
+            }
+        } else {
+            target_year--;
+        }
+
+        calendar_widget.update_tiles(target_year, target_month);
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    });
+
+    auto next_date_action = GUI::Action::create("Next date", { Mod_Alt, Key_Right }, Gfx::Bitmap::load_from_file("/res/icons/16x16/go-forward.png"), [&](const GUI::Action&) {
+        unsigned int target_month = calendar_widget.selected_month();
+        unsigned int target_year = calendar_widget.selected_year();
+
+        if (calendar_widget.mode() == GUI::Calendar::Month) {
+            target_month++;
+            if (calendar_widget.selected_month() >= 12) {
+                target_month = 1;
+                target_year++;
+            }
+        } else {
+            target_year++;
+        }
+
+        calendar_widget.update_tiles(target_year, target_month);
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    });
+
+    auto add_event_action = GUI::Action::create("Add event", {}, Gfx::Bitmap::load_from_file("/res/icons/16x16/add-event.png"), [&](const GUI::Action&) {
+        AddEventDialog::show(calendar_widget.selected_date(), window);
+    });
+
+    auto jump_to_action = GUI::Action::create("Jump to today", {}, Gfx::Bitmap::load_from_file("/res/icons/16x16/calendar-date.png"), [&](const GUI::Action&) {
+        if (calendar_widget.mode() == GUI::Calendar::Year)
+            calendar_widget.toggle_mode();
+        calendar_widget.set_selected_date(Core::DateTime::now());
+        calendar_widget.update_tiles(Core::DateTime::now().year(), Core::DateTime::now().month());
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    });
+
+    toolbar.add_action(prev_date_action);
+    selected_calendar_button = toolbar.add<GUI::Button>(calendar_widget.selected_calendar_text());
+    selected_calendar_button->set_size_policy(GUI::SizePolicy::Fixed, GUI::SizePolicy::Fill);
+    selected_calendar_button->set_preferred_size(70, 0);
+    selected_calendar_button->set_button_style(Gfx::ButtonStyle::CoolBar);
+    selected_calendar_button->set_font(Gfx::Font::default_bold_fixed_width_font());
+    selected_calendar_button->on_click = [&](auto) {
+        calendar_widget.toggle_mode();
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    };
+    toolbar.add_action(next_date_action);
+    toolbar.add_separator();
+    toolbar.add_action(jump_to_action);
+    toolbar.add_action(add_event_action);
+
+    calendar_widget.on_calendar_tile_click = [&] {
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    };
+
+    calendar_widget.on_calendar_tile_doubleclick = [&] {
+        AddEventDialog::show(calendar_widget.selected_date(), window);
+    };
+
+    calendar_widget.on_month_tile_click = [&] {
+        selected_calendar_button->set_text(calendar_widget.selected_calendar_text());
+    };
 
     auto menubar = GUI::MenuBar::construct();
     auto& app_menu = menubar->add_menu("Calendar");
-
-    app_menu.add_action(GUI::Action::create("Add Event", { Mod_Ctrl | Mod_Shift, Key_E },
+    app_menu.add_action(GUI::Action::create("Add Event", { Mod_Ctrl | Mod_Shift, Key_E }, Gfx::Bitmap::load_from_file("/res/icons/16x16/add-event.png"),
         [&](const GUI::Action&) {
-            calendar_widget.show_add_event_window();
+            AddEventDialog::show(calendar_widget.selected_date(), window);
             return;
         }));
 
+    app_menu.add_separator();
+
     app_menu.add_action(GUI::CommonActions::make_quit_action([](auto&) {
         GUI::Application::the()->quit();
         return;
@@ -80,10 +176,10 @@ int main(int argc, char** argv)
 
     auto& help_menu = menubar->add_menu("Help");
     help_menu.add_action(GUI::Action::create("About", [&](auto&) {
-        GUI::AboutDialog::show("Calendar", Gfx::Bitmap::load_from_file("/res/icons/16x16/app-calendar.png"), window);
+        GUI::AboutDialog::show("Calendar", app_icon.bitmap_for_size(32), window);
     }));
 
     app->set_menubar(move(menubar));
-
+    window->show();
     app->exec();
 }
diff --git a/Libraries/LibGUI/CMakeLists.txt b/Libraries/LibGUI/CMakeLists.txt
index 797cceee61..3d3b9a5c57 100644
--- a/Libraries/LibGUI/CMakeLists.txt
+++ b/Libraries/LibGUI/CMakeLists.txt
@@ -8,6 +8,7 @@ set(SOURCES
     Application.cpp
     BoxLayout.cpp
     Button.cpp
+    Calendar.cpp
     CheckBox.cpp
     Clipboard.cpp
     ColorInput.cpp
diff --git a/Libraries/LibGUI/Calendar.cpp b/Libraries/LibGUI/Calendar.cpp
new file mode 100644
index 0000000000..ddae86511d
--- /dev/null
+++ b/Libraries/LibGUI/Calendar.cpp
@@ -0,0 +1,370 @@
+/*
+ * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
+ * Copyright (c) 2020, the SerenityOS developers.
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ * 1. Redistributions of source code must retain the above copyright notice, this
+ *    list of conditions and the following disclaimer.
+ *
+ * 2. Redistributions in binary form must reproduce the above copyright notice,
+ *    this list of conditions and the following disclaimer in the documentation
+ *    and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+ * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+ * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+ * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+ * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+ * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+#include <LibCore/DateTime.h>
+#include <LibGUI/BoxLayout.h>
+#include <LibGUI/Button.h>
+#include <LibGUI/Calendar.h>
+#include <LibGUI/Painter.h>
+#include <LibGUI/Window.h>
+#include <LibGfx/Font.h>
+#include <LibGfx/Palette.h>
+
+namespace GUI {
+
+static const char* long_day_names[] = {
+    "Sunday", "Monday", "Tuesday", "Wednesday",
+    "Thursday", "Friday", "Saturday"
+};
+
+static const char* short_day_names[] = { "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" };
+static const char* mini_day_names[] = { "Su", "Mo", "Tu", "We", "Th", "Fr", "Sa" };
+static const char* micro_day_names[] = { "S", "M", "T", "W", "T", "F", "S" };
+
+static const char* long_month_names[] = {
+    "January", "February", "March", "April", "May", "June",
+    "July", "August", "September", "October", "November", "December"
+};
+
+static const char* short_month_names[] = {
+    "Jan", "Feb", "Mar", "Apr", "May", "Jun",
+    "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
+};
+
+Calendar::Calendar(Core::DateTime date_time)
+    : m_selected_date(date_time)
+    , m_selected_year(date_time.year())
+    , m_selected_month(date_time.month())
+{
+    set_fill_with_background_color(true);
+    set_layout<GUI::VerticalBoxLayout>();
+    layout()->set_spacing(0);
+
+    m_day_name_container = add<GUI::Widget>();
+    m_day_name_container->set_layout<GUI::HorizontalBoxLayout>();
+    m_day_name_container->set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
+    m_day_name_container->set_preferred_size(0, 16);
+    m_day_name_container->set_fill_with_background_color(true);
+    m_day_name_container->set_background_role(Gfx::ColorRole::HoverHighlight);
+    for (auto& day : m_day_names) {
+        day = m_day_name_container->add<GUI::Label>();
+        day->set_font(Gfx::Font::default_bold_font());
+    }
+
+    m_calendar_tile_container = add<GUI::Widget>();
+    m_calendar_tile_container->set_layout<GUI::VerticalBoxLayout>();
+    m_calendar_tile_container->layout()->set_spacing(0);
+
+    for (auto& row : m_week_rows) {
+        row = m_calendar_tile_container->add<GUI::Widget>();
+        row->set_layout<GUI::HorizontalBoxLayout>();
+        row->layout()->set_spacing(0);
+    }
+
+    int i = 0;
+    for (int j = 0; j < 6; j++)
+        for (int k = 0; k < 7; k++) {
+            m_calendar_tiles[i] = m_week_rows[j]->add<CalendarTile>(i, date_time);
+            m_calendar_tiles[i]->on_click = [this](int index) {
+                m_previous_selected_date = m_selected_date;
+                m_selected_date = m_calendar_tiles[index]->get_date_time();
+                update_tiles(m_selected_date.year(), m_selected_date.month());
+                if (on_calendar_tile_click)
+                    on_calendar_tile_click();
+            };
+            m_calendar_tiles[i]->on_doubleclick = [this](int index) {
+                if (m_calendar_tiles[index]->get_date_time().day() != m_previous_selected_date.day())
+                    return;
+                if (on_calendar_tile_doubleclick)
+                    on_calendar_tile_doubleclick();
+            };
+            i++;
+        }
+
+    m_month_tile_container = add<GUI::Widget>();
+    m_month_tile_container->set_visible(false);
+    m_month_tile_container->set_layout<GUI::VerticalBoxLayout>();
+    m_month_tile_container->set_fill_with_background_color(true);
+    m_month_tile_container->set_background_role(Gfx::ColorRole::HoverHighlight);
+    m_month_tile_container->layout()->set_spacing(0);
+
+    for (auto& row : m_month_rows) {
+        row = m_month_tile_container->add<GUI::Widget>();
+        row->set_layout<GUI::HorizontalBoxLayout>();
+        row->layout()->set_spacing(0);
+    }
+
+    i = 0;
+    for (int j = 0; j < 3; j++)
+        for (int k = 0; k < 4; k++) {
+            m_month_tiles[i] = m_month_rows[j]->add<MonthTile>(i, date_time);
+            m_month_tiles[i]->set_button_style(Gfx::ButtonStyle::CoolBar);
+            m_month_tiles[i]->on_indexed_click = [this](int index) {
+                toggle_mode();
+                update_tiles(m_month_tiles[index]->get_date_time().year(), m_month_tiles[index]->get_date_time().month());
+                if (on_month_tile_click)
+                    on_month_tile_click();
+            };
+            i++;
+        }
+
+    update_tiles(selected_year(), selected_month());
+}
+
+Calendar::~Calendar()
+{
+}
+
+void Calendar::toggle_mode()
+{
+    m_mode == Month ? m_mode = Year : m_mode = Month;
+
+    if (mode() == Month) {
+        m_day_name_container->set_visible(true);
+        m_calendar_tile_container->set_visible(true);
+        m_month_tile_container->set_visible(false);
+    } else {
+        m_day_name_container->set_visible(false);
+        m_calendar_tile_container->set_visible(false);
+        m_month_tile_container->set_visible(true);
+    }
+
+    this->resize(this->height(), this->width());
+    update_tiles(selected_year(), selected_month());
+}
+
+void Calendar::set_grid(bool grid)
+{
+    if (m_grid == grid)
+        return;
+
+    m_grid = grid;
+
+    for (int i = 0; i < 42; i++) {
+        m_calendar_tiles[i]->set_grid(grid);
+        m_calendar_tiles[i]->update();
+    }
+}
+
+void Calendar::resize_event(GUI::ResizeEvent& event)
+{
+    if (m_day_name_container->is_visible()) {
+        for (int i = 0; i < 7; i++) {
+            if (event.size().width() < 120)
+                m_day_names[i]->set_text(micro_day_names[i]);
+            else if (event.size().width() < 200)
+                m_day_names[i]->set_text(mini_day_names[i]);
+            else if (event.size().width() < 480)
+                m_day_names[i]->set_text(short_day_names[i]);
+            else
+                m_day_names[i]->set_text(long_day_names[i]);
+        }
+    }
+
+    if (m_month_tile_container->is_visible()) {
+        for (int i = 0; i < 12; i++) {
+            if (event.size().width() < 250)
+                m_month_tiles[i]->set_text(short_month_names[i]);
+            else
+                m_month_tiles[i]->set_text(long_month_names[i]);
+        }
+    }
+
+    (event.size().width() < 200) ? set_grid(false) : set_grid(true);
+}
+
+void Calendar::update_tiles(unsigned int target_year, unsigned int target_month)
+{
+    set_selected_calendar(target_year, target_month);
+    if (mode() == Month) {
+        unsigned int i = 0;
+        for (int y = 0; y < 6; y++)
+            for (int x = 0; x < 7; x++) {
+                auto date_time = Core::DateTime::create(target_year, target_month, 1);
+                unsigned int start_of_month = date_time.weekday();
+                unsigned int year;
+                unsigned int month;
+                unsigned int day;
+
+                if (start_of_month > i) {
+                    month = (target_month - 1 == 0) ? 12 : target_month - 1;
+                    year = (month == 12) ? target_year - 1 : target_year;
+                    date_time.set_time(year, month, 1);
+                    day = (date_time.days_in_month() - (start_of_month) + i) + 1;
+                    date_time.set_time(year, month, day);
+                } else if ((i - start_of_month) + 1 > date_time.days_in_month()) {
+                    month = (target_month + 1) > 12 ? 1 : target_month + 1;
+                    year = (month == 1) ? target_year + 1 : target_year;
+                    day = ((i - start_of_month) + 1) - date_time.days_in_month();
+                    date_time.set_time(year, month, day);
+                } else {
+                    month = target_month;
+                    year = target_year;
+                    day = (i - start_of_month) + 1;
+                    date_time.set_time(year, month, day);
+                }
+
+                m_calendar_tiles[i]->update_values(i, date_time);
+                m_calendar_tiles[i]->set_selected(date_time.year() == m_selected_date.year() && date_time.month() == m_selected_date.month() && date_time.day() == m_selected_date.day());
+                m_calendar_tiles[i]->set_outside_selection(date_time.month() != selected_month() || date_time.year() != selected_year());
+                m_calendar_tiles[i]->update();
+                i++;
+            }
+    } else {
+        for (int i = 0; i < 12; i++) {
+            auto date_time = Core::DateTime::create(target_year, i + 1, 1);
+            m_month_tiles[i]->update_values(date_time);
+        }
+    }
+}
+
+const String Calendar::selected_calendar_text(bool long_names)
+{
+    if (mode() == Month)
+        return String::format("%s %u", long_names ? long_month_names[m_selected_month - 1] : short_month_names[m_selected_month - 1], m_selected_year);
+    else
+        return String::format("%u", m_selected_year);
+}
+
+void Calendar::set_selected_calendar(unsigned int year, unsigned int month)
+{
+    m_selected_year = year;
+    m_selected_month = month;
+}
+
+Calendar::MonthTile::MonthTile(int index, Core::DateTime date_time)
+    : m_index(index)
+    , m_date_time(date_time)
+{
+}
+
+Calendar::MonthTile::~MonthTile()
+{
+}
+
+void Calendar::MonthTile::mouseup_event(GUI::MouseEvent& event)
+{
+    if (on_indexed_click)
+        on_indexed_click(m_index);
+
+    GUI::Button::mouseup_event(event);
+}
+
+Calendar::CalendarTile::CalendarTile(int index, Core::DateTime date_time)
+{
+    set_frame_thickness(0);
+    update_values(index, date_time);
+}
+
+void Calendar::CalendarTile::update_values(int index, Core::DateTime date_time)
+{
+    m_index = index;
+    m_date_time = date_time;
+    m_display_date = (m_date_time.day() == 1) ? String::format("%s %u", short_month_names[m_date_time.month() - 1], m_date_time.day()) : String::number(m_date_time.day());
+}
+
+Calendar::CalendarTile::~CalendarTile()
+{
+}
+
+void Calendar::CalendarTile::doubleclick_event(GUI::MouseEvent&)
+{
+    if (on_doubleclick)
+        on_doubleclick(m_index);
+}
+
+void Calendar::CalendarTile::mousedown_event(GUI::MouseEvent&)
+{
+    if (on_click)
+        on_click(m_index);
+}
+void Calendar::CalendarTile::enter_event(Core::Event&)
+{
+    m_hovered = true;
+    update();
+}
+
+void Calendar::CalendarTile::leave_event(Core::Event&)
+{
+    m_hovered = false;
+    update();
+}
+
+bool Calendar::CalendarTile::is_today() const
+{
+    auto current_date_time = Core::DateTime::now();
+    return m_date_time.day() == current_date_time.day() && m_date_time.month() == current_date_time.month() && m_date_time.year() == current_date_time.year();
+}
+
+void Calendar::CalendarTile::paint_event(GUI::PaintEvent& event)
+{
+    GUI::Frame::paint_event(event);
+
+    GUI::Painter painter(*this);
+    painter.add_clip_rect(frame_inner_rect());
+
+    if (is_hovered() || is_selected())
+        painter.fill_rect(frame_inner_rect(), palette().hover_highlight());
+    else
+        painter.fill_rect(frame_inner_rect(), palette().base());
+
+    if (m_index < 7)
+        painter.draw_line(frame_inner_rect().top_left(), frame_inner_rect().top_right(), Color::NamedColor::Black);
+    if (!((m_index + 1) % 7 == 0) && has_grid())
+        painter.draw_line(frame_inner_rect().top_right(), frame_inner_rect().bottom_right(), Color::NamedColor::Black);
+    if (m_index < 35 && has_grid())
+        painter.draw_line(frame_inner_rect().bottom_left(), frame_inner_rect().bottom_right(), Color::NamedColor::Black);
+
+    Gfx::IntRect day_rect;
+    if (has_grid()) {
+        day_rect = Gfx::IntRect(frame_inner_rect().x(), frame_inner_rect().y(), frame_inner_rect().width(), font().glyph_height() + 4);
+        day_rect.set_y(frame_inner_rect().y() + 4);
+    } else {
+        day_rect = Gfx::IntRect(frame_inner_rect());
+    }
+
+    int highlight_rect_width = (font().glyph_width('0') * (m_display_date.length() + 1)) + 2;
+    auto display_date = (m_date_time.day() == 1 && frame_inner_rect().width() > highlight_rect_width) ? m_display_date : String::number(m_date_time.day());
+
+    if (is_today()) {
+        if (has_grid()) {
+            auto highlight_rect = Gfx::IntRect(day_rect.width() / 2 - (highlight_rect_width / 2), day_rect.y(), highlight_rect_width, font().glyph_height() + 4);
+            painter.draw_rect(highlight_rect, palette().base_text());
+        } else if (is_selected()) {
+            painter.draw_rect(frame_inner_rect(), palette().base_text());
+        }
+        painter.draw_text(day_rect, display_date, Gfx::Font::default_bold_font(), Gfx::TextAlignment::Center, palette().base_text());
+    } else if (is_outside_selection()) {
+        painter.draw_text(day_rect, display_date, Gfx::Font::default_font(), Gfx::TextAlignment::Center, Color::LightGray);
+    } else {
+        if (!has_grid() && is_selected())
+            painter.draw_rect(frame_inner_rect(), palette().base_text());
+        painter.draw_text(day_rect, display_date, Gfx::Font::default_font(), Gfx::TextAlignment::Center, palette().base_text());
+    }
+}
+
+}
diff --git a/Libraries/LibGUI/Calendar.h b/Libraries/LibGUI/Calendar.h
new file mode 100644
index 0000000000..a160665591
--- /dev/null
+++ b/Libraries/LibGUI/Calendar.h
@@ -0,0 +1,142 @@
+/*
+ * Copyright (c) 2019-2020, Ryan Grieb <ryan.m.grieb@gmail.com>
+ * Copyright (c) 2020, the SerenityOS developers.
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ * 1. Redistributions of source code must retain the above copyright notice, this
+ *    list of conditions and the following disclaimer.
+ *
+ * 2. Redistributions in binary form must reproduce the above copyright notice,
+ *    this list of conditions and the following disclaimer in the documentation
+ *    and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+ * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+ * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+ * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+ * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+ * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+#pragma once
+
+#include <AK/String.h>
+#include <LibCore/DateTime.h>
+#include <LibGUI/Button.h>
+#include <LibGUI/Frame.h>
+#include <LibGUI/Label.h>
+#include <LibGUI/Widget.h>
+
+namespace GUI {
+
+class Calendar final : public GUI::Widget {
+    C_OBJECT(Calendar)
+
+public:
+    enum Mode {
+        Month,
+        Year
+    };
+
+    enum {
+        ShortNames,
+        LongNames
+    };
+
+    Calendar(Core::DateTime);
+    virtual ~Calendar() override;
+
+    unsigned int selected_year() const { return m_selected_year; }
+    unsigned int selected_month() const { return m_selected_month; }
+    const String selected_calendar_text(bool long_names = ShortNames);
+    void update_tiles(unsigned int target_year, unsigned int target_month);
+    void set_selected_calendar(unsigned int year, unsigned int month);
+    void set_selected_date(Core::DateTime date_time) { m_selected_date = date_time; }
+    Core::DateTime selected_date() const { return m_selected_date; }
+    void toggle_mode();
+    void set_grid(bool grid);
+    bool has_grid() { return m_grid; }
+    Mode mode() const { return m_mode; }
+
+    Function<void()> on_calendar_tile_click;
+    Function<void()> on_calendar_tile_doubleclick;
+    Function<void()> on_month_tile_click;
+
+private:
+    virtual void resize_event(GUI::ResizeEvent&) override;
+
+    class CalendarTile final : public GUI::Frame {
+        C_OBJECT(CalendarTile)
+    public:
+        CalendarTile(int index, Core::DateTime m_date_time);
+        void update_values(int index, Core::DateTime date_time);
+        virtual ~CalendarTile() override;
+        bool is_today() const;
+        bool is_hovered() const { return m_hovered; }
+        bool is_selected() const { return m_selected; }
+        void set_selected(bool b) { m_selected = b; }
+        bool is_outside_selection() const { return m_outside_selection; }
+        void set_outside_selection(bool b) { m_outside_selection = b; }
+        bool has_grid() const { return m_grid; }
+        void set_grid(bool b) { m_grid = b; }
+        Core::DateTime get_date_time() { return m_date_time; }
+        Function<void(int index)> on_doubleclick;
+        Function<void(int index)> on_click;
+
+    private:
+        virtual void doubleclick_event(GUI::MouseEvent&) override;
+        virtual void mousedown_event(GUI::MouseEvent&) override;
+        virtual void enter_event(Core::Event&) override;
+        virtual void leave_event(Core::Event&) override;
+        virtual void paint_event(GUI::PaintEvent&) override;
+
+        int m_index { 0 };
+        bool m_outside_selection { false };
+        bool m_hovered { false };
+        bool m_selected { false };
+        bool m_grid { true };
+        String m_display_date;
+        Core::DateTime m_date_time;
+    };
+
+    class MonthTile final : public GUI::Button {
+        C_OBJECT(MonthTile)
+    public:
+        MonthTile(int index, Core::DateTime m_date_time);
+        virtual ~MonthTile() override;
+        void update_values(Core::DateTime date_time) { m_date_time = date_time; }
+        Core::DateTime get_date_time() { return m_date_time; }
+        Function<void(int index)> on_indexed_click;
+
+    private:
+        virtual void mouseup_event(GUI::MouseEvent&) override;
+
+        int m_index { 0 };
+        Core::DateTime m_date_time;
+    };
+
+    RefPtr<MonthTile> m_month_tiles[12];
+    RefPtr<CalendarTile> m_calendar_tiles[42];
+    RefPtr<GUI::Label> m_day_names[7];
+    RefPtr<GUI::Widget> m_week_rows[6];
+    RefPtr<GUI::Widget> m_month_rows[3];
+    RefPtr<GUI::Widget> m_month_tile_container;
+    RefPtr<GUI::Widget> m_calendar_tile_container;
+    RefPtr<GUI::Widget> m_day_name_container;
+
+    Core::DateTime m_selected_date;
+    Core::DateTime m_previous_selected_date;
+    unsigned int m_selected_year { 0 };
+    unsigned int m_selected_month { 0 };
+    bool m_grid { true };
+    Mode m_mode { Month };
+};
+
+}