const dvui = @import("dvui");
const WindowContext = @import("../WindowContext.zig");
const Document = @import("../models/Document.zig");
const Object = Document.Object;

const panel_gap: f32 = 12;
const panel_padding: f32 = 5;
const panel_radius: f32 = 24;
const fill_color = dvui.Color.black.opacity(0.2);

fn shapeLabel(shape: Object.ShapeKind) []const u8 {
    return switch (shape) {
        .line => "Line",
        .ellipse => "Ellipse",
        .arc => "Arc",
        .broken => "Broken line",
    };
}

fn objectTreeRow(obj: *const Object, depth: u32, row_id: *usize) void {
    const id = row_id.*;
    row_id.* += 1;
    const indent_px = depth * 18;
    var row = dvui.box(
        @src(),
        .{ .dir = .horizontal },
        .{ .padding = dvui.Rect{ .x = @floatFromInt(indent_px) }, .id_extra = id },
    );
    {
        dvui.labelNoFmt(@src(), shapeLabel(obj.shape), .{}, .{ .id_extra = id });
    }
    row.deinit();
    for (obj.children.items) |*child| {
        objectTreeRow(child, depth + 1, row_id);
    }
}

fn objectTree(ctx: *WindowContext) void {
    const active_doc = ctx.activeDocument();
    if (active_doc) |open_doc| {
        const doc = &open_doc.document;
        if (doc.objects.items.len == 0) {
            dvui.label(@src(), "No objects", .{}, .{});
        } else {
            var row_id: usize = 0;
            for (doc.objects.items) |*obj| {
                objectTreeRow(obj, 0, &row_id);
            }
        }
    } else {
        dvui.label(@src(), "No document", .{}, .{});
    }
}

pub fn leftPanel(ctx: *WindowContext) void {
    var padding = dvui.Rect.all(panel_gap);
    padding.w = 0;
    var panel = dvui.box(
        @src(),
        .{ .dir = .vertical },
        .{
            .expand = .vertical,
            .min_size_content = .{ .w = 220 },
            .background = true,
            .padding = padding,
        },
    );
    {

        // Нижняя часть: настройки
        var settings_section = dvui.box(
            @src(),
            .{ .dir = .vertical },
            .{
                .expand = .horizontal,
                .gravity_y = 1.0,
                .margin = .{ .y = 5 },
                .padding = dvui.Rect.all(panel_padding),
                .corner_radius = dvui.Rect.all(panel_radius),
                .color_fill = fill_color,
                .background = true,
            },
        );
        {
            dvui.label(@src(), "Settings", .{}, .{});

            const active_doc = ctx.activeDocument();
            if (active_doc) |doc| {
                const canvas = &doc.canvas;
                if (dvui.checkbox(@src(), &canvas.native_scaling, "Scaling", .{})) {}
                if (dvui.checkbox(@src(), &canvas.draw_document, "Draw document", .{})) {
                    canvas.requestRedraw();
                }
                if (!canvas.draw_document) {
                    if (dvui.button(@src(), if (doc.cpu_render.type == .Gradient) "Gradient" else "Squares", .{}, .{})) {
                        if (doc.cpu_render.type == .Gradient) {
                            doc.cpu_render.type = .Squares;
                        } else {
                            doc.cpu_render.type = .Gradient;
                        }
                        canvas.requestRedraw();
                    }
                }
            } else {
                dvui.label(@src(), "No document", .{}, .{});
            }
        }
        settings_section.deinit();

        // Верхняя часть: дерево объектов
        var tree_section = dvui.box(
            @src(),
            .{ .dir = .vertical },
            .{
                .expand = .both,
                .padding = dvui.Rect.all(panel_padding),
                .corner_radius = dvui.Rect.all(panel_radius),
                .color_fill = fill_color,
                .background = true,
            },
        );
        {
            dvui.label(@src(), "Objects", .{}, .{});
            var scroll = dvui.scrollArea(
                @src(),
                .{ .vertical = .auto },
                .{ .expand = .both, .background = false },
            );
            {
                objectTree(ctx);
            }
            scroll.deinit();
        }
        tree_section.deinit();
    }
    panel.deinit();
}