import gradio as gr
import os
import datetime
from zoneinfo import ZoneInfo
import cv2
from PIL import Image, ImageDraw, ImageFilter, ImageColor


def combin_image(input_images, back_color, margin_top, margin_between, margin_side):

    dt = datetime.datetime.now(ZoneInfo("Asia/Tokyo"))

    # フォルダ・ファイル名設定
    work_fol = dt.strftime("%Y%m%d%H%M%S")
    combin_file = dt.strftime("%Y%m%d%H%M") + ".jpg"

    # フォルダ作成
    os.makedirs(work_fol, exist_ok=True)

    back_color_rgb = tuple(back_color)

    for i, img in enumerate(input_images):

        # 対象画像読み込み
        load_img = Image.open(img)

        img_width, img_height = load_img.size

        if i == 0:

            # 上下マージン用画像生成
            img_margin = Image.new("RGB", (img_width + margin_side * 2, int(margin_between/2) + margin_top), back_color_rgb)

            img_margin.save(work_fol + "/" + "img_margin.jpg")

        # 画像を生成して貼付
        img_add_edge = Image.new("RGB", (img_width + margin_side * 2, img_height + margin_between), back_color_rgb)

        img_add_edge.paste(load_img, (margin_side, int(margin_between/2)))

        file_name = os.path.basename(img)

        print(file_name)

        img_add_edge.save(work_fol + "/" + file_name)

    im_margin = cv2.imread(work_fol + "/" + "img_margin.jpg")

    im_v = im_margin

    for i, img in enumerate(input_images):

        im = cv2.imread(work_fol + "/" + os.path.basename(img))

        im_v = cv2.vconcat([im_v, im])

    im_v = cv2.vconcat([im_v, im_margin])

    cv2.imwrite(work_fol + "/" + combin_file, im_v)

    return work_fol + "/" + combin_file

def get_rgb(color):

    if color[0:4] != "rgba":

        if color[0] != "#":

            color = "#" + color

        color_rgb = ImageColor.getrgb(color)

    else:

        r = round(float(color.split(",")[0].split("(")[1]))
        g = round(float(color.split(",")[1]))
        b = round(float(color.split(",")[2]))

        color_rgb = (r, g, b)

    return color_rgb

with gr.Blocks(title="Fliptoon Image Generator", theme=gr.themes.Citrus()) as demo:

    title = "<center><h2>Fliptoon用画像作成アプリ</h2></center>"
    message = "<center><h3>"
    message += "・画像の横幅のサイズは揃えて下さい。<br>"
    message += "・画像はファイル名の順番に結合します。ファイル名は01_XXXXXX、02_XXXXXX…などにして下さい。<br>"
    message += "</h3></center>"

    gr.Markdown(title + message)

    gr.Markdown("")   # 余白

    with gr.Row():
        with gr.Column():

          files = gr.Files(label="対象画像", file_types=['image'])
          back_color = gr.ColorPicker(label="背景色", value="ffffff", interactive=True)

          margin_top = gr.Number(label="上下マージン", value=100)

          with gr.Row():

              margin_between = gr.Number(label="コマ間マージン", value=200)
              margin_side = gr.Number(label="コマ左右マージン", value=200)

          back_color_rgb = gr.JSON(visible=False)
          btn = gr.Button(value="画像作成", variant="primary")
          sys_msg = gr.Text(label="システムメッセージ", interactive=False)

        with gr.Column():

          out_image = gr.Image(label="結合画像", width=320)

    btn.click(get_rgb, inputs=[back_color], outputs=[back_color_rgb]).success(
        combin_image, inputs=[files, back_color_rgb, margin_top, margin_between, margin_side], outputs=[out_image]
    )

demo.queue()
demo.launch(share=False, debug=True)