use mogwai::prelude::*;

use crate::component::upload::logic::UploadLogic;

pub(super) fn upload_preview_view( tx_canvas :broadcast::Sender<Dom>
                                 , tx_click  :broadcast::Sender<DomEvent>
                                 , filename  :String
                                 , size      :f64
                                 , mime_type :String
                                 , mtime     :f64
                                 ) -> ViewBuilder<Dom> {
    let post_build = move |dom: &mut Dom| {
        tx_canvas.try_broadcast(dom.clone()).unwrap();
    };

    builder! {
        <li style:display="flex"
            on:click=tx_click.sink()>
            <canvas width="75px"
                    height="75px"
                    post:build=post_build />
            <ul>
                <li>{format!("filename: {}", filename)}</li>
                <li>{format!("size: {}", size)}</li>
                <li>{format!("mime type: {}", mime_type)}</li>
                <li>{format!("modification time: {}", mtime)}</li>
            </ul>
        </li>
    }
}

pub(super) fn upload_view( tx_logic: broadcast::Sender<UploadLogic>
                         , rx_previews: mpmc::Receiver<ListPatch<ViewBuilder<Dom>>>
                         ) -> ViewBuilder<Dom> {
    let select_filter = tx_logic.sink()
                      . contra_map(|e| UploadLogic::Add(e));
    let upload_filter = tx_logic.sink()
                      . contra_map(|_| UploadLogic::Upload);

//            <div class="spin"></div>
    builder! {
        <div class="upload">
            <div>
                <input type="file"
                       multiple="multiple"
                       accept="image/*"
                       on:change=select_filter />
                <button on:click=upload_filter>"Upload"</button>
            </div>
            <ul patch:children=rx_previews>
            </ul>
            <p>"Click on preview to "<em>"deselect"</em>"."</p>
        </div>
    }
}