Keynote with vertical layout (#2794)

cherry pick from:
  * https://github.com/DarkFlippers/unleashed-firmware/pull/428/files
  * https://github.com/DarkFlippers/unleashed-firmware/pull/524/files
  Co-authored-by:
    * MX <10697207+xMasterX@users.noreply.github.com>
    * gid9798 <30450294+gid9798@users.noreply.github.com>

Co-authored-by: MX <10697207+xMasterX@users.noreply.github.com>
Co-authored-by: あく <alleteam@gmail.com>

applications/external/hid_app/hid.c

@@ -7,6 +7,7 @@
 
 enum HidDebugSubmenuIndex {
     HidSubmenuIndexKeynote,
+    HidSubmenuIndexKeynoteVertical,
     HidSubmenuIndexKeyboard,
     HidSubmenuIndexMedia,
     HidSubmenuIndexTikTok,
@@ -20,6 +21,11 @@ static void hid_submenu_callback(void* context, uint32_t index) {
     Hid* app = context;
     if(index == HidSubmenuIndexKeynote) {
         app->view_id = HidViewKeynote;
+        hid_keynote_set_orientation(app->hid_keynote, false);
+        view_dispatcher_switch_to_view(app->view_dispatcher, HidViewKeynote);
+    } else if(index == HidSubmenuIndexKeynoteVertical) {
+        app->view_id = HidViewKeynote;
+        hid_keynote_set_orientation(app->hid_keynote, true);
         view_dispatcher_switch_to_view(app->view_dispatcher, HidViewKeynote);
     } else if(index == HidSubmenuIndexKeyboard) {
         app->view_id = HidViewKeyboard;
@@ -105,6 +111,12 @@ Hid* hid_alloc(HidTransport transport) {
     app->device_type_submenu = submenu_alloc();
     submenu_add_item(
         app->device_type_submenu, "Keynote", HidSubmenuIndexKeynote, hid_submenu_callback, app);
+    submenu_add_item(
+        app->device_type_submenu,
+        "Keynote Vertical",
+        HidSubmenuIndexKeynoteVertical,
+        hid_submenu_callback,
+        app);
     submenu_add_item(
         app->device_type_submenu, "Keyboard", HidSubmenuIndexKeyboard, hid_submenu_callback, app);
     submenu_add_item(

applications/external/hid_app/views/hid_keynote.c

@@ -111,6 +111,91 @@ static void hid_keynote_draw_callback(Canvas* canvas, void* context) {
     elements_multiline_text_aligned(canvas, 91, 57, AlignLeft, AlignBottom, "Back");
 }
 
+static void hid_keynote_draw_vertical_callback(Canvas* canvas, void* context) {
+    furi_assert(context);
+    HidKeynoteModel* model = context;
+
+    // Header
+    if(model->transport == HidTransportBle) {
+        if(model->connected) {
+            canvas_draw_icon(canvas, 0, 0, &I_Ble_connected_15x15);
+        } else {
+            canvas_draw_icon(canvas, 0, 0, &I_Ble_disconnected_15x15);
+        }
+        canvas_set_font(canvas, FontPrimary);
+        elements_multiline_text_aligned(canvas, 20, 3, AlignLeft, AlignTop, "Keynote");
+    } else {
+        canvas_set_font(canvas, FontPrimary);
+        elements_multiline_text_aligned(canvas, 12, 3, AlignLeft, AlignTop, "Keynote");
+    }
+
+    canvas_draw_icon(canvas, 2, 18, &I_Pin_back_arrow_10x8);
+    canvas_set_font(canvas, FontSecondary);
+    elements_multiline_text_aligned(canvas, 15, 19, AlignLeft, AlignTop, "Hold to exit");
+
+    const uint8_t x_2 = 23;
+    const uint8_t x_1 = 2;
+    const uint8_t x_3 = 44;
+
+    const uint8_t y_1 = 44;
+    const uint8_t y_2 = 65;
+
+    // Up
+    canvas_draw_icon(canvas, x_2, y_1, &I_Button_18x18);
+    if(model->up_pressed) {
+        elements_slightly_rounded_box(canvas, x_2 + 3, y_1 + 2, 13, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    hid_keynote_draw_arrow(canvas, x_2 + 9, y_1 + 6, CanvasDirectionBottomToTop);
+    canvas_set_color(canvas, ColorBlack);
+
+    // Down
+    canvas_draw_icon(canvas, x_2, y_2, &I_Button_18x18);
+    if(model->down_pressed) {
+        elements_slightly_rounded_box(canvas, x_2 + 3, y_2 + 2, 13, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    hid_keynote_draw_arrow(canvas, x_2 + 9, y_2 + 10, CanvasDirectionTopToBottom);
+    canvas_set_color(canvas, ColorBlack);
+
+    // Left
+    canvas_draw_icon(canvas, x_1, y_2, &I_Button_18x18);
+    if(model->left_pressed) {
+        elements_slightly_rounded_box(canvas, x_1 + 3, y_2 + 2, 13, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    hid_keynote_draw_arrow(canvas, x_1 + 7, y_2 + 8, CanvasDirectionRightToLeft);
+    canvas_set_color(canvas, ColorBlack);
+
+    // Right
+    canvas_draw_icon(canvas, x_3, y_2, &I_Button_18x18);
+    if(model->right_pressed) {
+        elements_slightly_rounded_box(canvas, x_3 + 3, y_2 + 2, 13, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    hid_keynote_draw_arrow(canvas, x_3 + 11, y_2 + 8, CanvasDirectionLeftToRight);
+    canvas_set_color(canvas, ColorBlack);
+
+    // Ok
+    canvas_draw_icon(canvas, 2, 86, &I_Space_60x18);
+    if(model->ok_pressed) {
+        elements_slightly_rounded_box(canvas, 5, 88, 55, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    canvas_draw_icon(canvas, 11, 90, &I_Ok_btn_9x9);
+    elements_multiline_text_aligned(canvas, 26, 98, AlignLeft, AlignBottom, "Space");
+    canvas_set_color(canvas, ColorBlack);
+
+    // Back
+    canvas_draw_icon(canvas, 2, 107, &I_Space_60x18);
+    if(model->back_pressed) {
+        elements_slightly_rounded_box(canvas, 5, 109, 55, 13);
+        canvas_set_color(canvas, ColorWhite);
+    }
+    canvas_draw_icon(canvas, 11, 111, &I_Pin_back_arrow_10x8);
+    elements_multiline_text_aligned(canvas, 26, 119, AlignLeft, AlignBottom, "Back");
+}
+
 static void hid_keynote_process(HidKeynote* hid_keynote, InputEvent* event) {
     with_view_model(
         hid_keynote->view,
@@ -212,3 +297,16 @@ void hid_keynote_set_connected_status(HidKeynote* hid_keynote, bool connected) {
     with_view_model(
         hid_keynote->view, HidKeynoteModel * model, { model->connected = connected; }, true);
 }
+
+void hid_keynote_set_orientation(HidKeynote* hid_keynote, bool vertical) {
+    furi_assert(hid_keynote);
+
+    if(vertical) {
+        view_set_draw_callback(hid_keynote->view, hid_keynote_draw_vertical_callback);
+        view_set_orientation(hid_keynote->view, ViewOrientationVerticalFlip);
+
+    } else {
+        view_set_draw_callback(hid_keynote->view, hid_keynote_draw_callback);
+        view_set_orientation(hid_keynote->view, ViewOrientationHorizontal);
+    }
+}

applications/external/hid_app/views/hid_keynote.h

@@ -12,3 +12,5 @@ void hid_keynote_free(HidKeynote* hid_keynote);
 View* hid_keynote_get_view(HidKeynote* hid_keynote);
 
 void hid_keynote_set_connected_status(HidKeynote* hid_keynote, bool connected);
+
+void hid_keynote_set_orientation(HidKeynote* hid_keynote, bool vertical);