function HostListItem()
{
    let item = $(`
        <tr>
            <td class="text-nowrap">
                <button class="btn btn-outline-primary btn-sm action-download">
                    İndir
                </button>
                <button class="btn btn-outline-danger btn-sm action-remove">
                    Kaldır
                </button>
            </td>
            <td class="text-nowrap">
                <button class="btn btn-outline-secondary btn-sm action-sha1">
                    Hesapla
                </button>
            </td>
            <td class="text-nowrap">
                <span class="action-filename">DCIM_AMG_25TEM2025.png</span>
                <br>
                <span class="text-muted">
                    (Sizin cihazda)
                </span>
            </td>
            <td class="text-nowrap">
                <div class="progress" style="height:30px">
                    <div class="progress-bar" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </td>
        </tr>
    `);
    return {
        download: item.find(".action-download"),
        hide: item.find(".action-hide"),
        remove: item.find(".action-remove"),
        sha1: item.find(".action-sha1"),
        filename: item.find(".action-filename"),
        progress: item.find(".progress"),
        container: item
    }
}

function RemoteListItem()
{
    let item = $(`
        <tr>
            <td class="text-nowrap">
                <button class="btn btn-outline-primary btn-sm action-download">
                    İndir
                </button>
                <button class="btn btn-outline-secondary btn-sm action-hide">
                    Gizle
                </button>
            </td>
            <td class="text-nowrap">
                <button class="btn btn-outline-secondary btn-sm action-sha1">
                    Hesapla
                </button>
            </td>
            <td class="text-nowrap">
                <span class="action-filename">DCIM.mp4</span>
                <br>
                <span class="text-muted">
                    (Karşı cihazda)
                </span>
            </td>
            <td class="text-nowrap">
                <div class="progress" style="height:30px">
                    <div class="progress-bar" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </td>
        </tr>
    `);
    return {
        download: item.find(".action-download"),
        hide: item.find(".action-hide"),
        remove: item.find(".action-remove"),
        sha1: item.find(".action-sha1"),
        filename: item.find(".action-filename"),
        progress: item.find(".progress"),
        container: item
    }
}

function EmptyListItem()
{
    return $(`
        <tr>
            <td class="text-center text-muted" colspan="4">
                Gönderilecek veya alınacak dosya bulunmuyor
            </td>
        </tr>
    `)
}

function formatBytes(a,b=2){if(!+a)return"0 Bytes";const c=0>b?0:b,d=Math.floor(Math.log(a)/Math.log(1024));return`${parseFloat((a/Math.pow(1024,d)).toFixed(c))} ${["Bytes","KiB","MiB","GiB","TiB","PiB","EiB","ZiB","YiB"][d]}`}


const endpoint = `wss://ws.saqut.com/socket/webserver/${("000000"+(Math.random() * 512 | 0)).slice(-6)}.sock`;

let mwse = new MWSE({
    endpoint,
    autoReconnect: true,
    autoReconnectTimeout: 60_000
});

mwse.scope(Connect);

let room;
let ip;

async function Connect()
{
    await genRoom();
    $(".network-id").text(ip);
}

async function genRoom()
{
    do{
        let vip = ip = [
            (Math.random() * 16 | 0) + 10,
            (Math.random() * 8 | 0),
            (Math.random() * 4 | 0),
            (Math.random() * 254 | 0) + 1
        ].join('.');
        room = mwse.room({
            name: `WEB3-Smash [${vip}] RO CONNECT:2`,
            description: "Web3 Smash saQut Server Application",
            joinType: "free",
            notifyActionJoined: true,
            notifyActionEjected: true,
            ifexistsJoin: false
        });
        try{
            await room.createRoom();
            break;
        }catch{
            continue;
        }
    }while(1);
}

class FileDescriptor {
    static hostfiles = new Map();
    static remotefiles = new Map();
    static hostindex = 0;
    static remoteindex = 0;

    file = null;
    listItem = null;

    constructor(isHost, item,file){
        this.file = file;
        this.listItem = item;
        $("#thelist").append(item.container);
        if(isHost)
        {
            FileDescriptor.hostfiles.set(
                ++FileDescriptor.hostindex,
                this
            );
        }else{
            FileDescriptor.remotefiles.set(
                ++FileDescriptor.remoteindex,
                this
            );
        }
        this.init();
    }
    init(){
        this.listItem.filename.html(
            this.file.name + " <span class='text-muted'>" + formatBytes(this.file.size) + "</span>"
        );
    }
};

$("#files").on('change',function(){
    for (const file of this.files) {
        $("#thelist .empty").remove();
        new FileDescriptor(
            true,
            HostListItem(),
            file
        )
    };
    $("#files").val('');
});

$(".joinroom").on("chnage",function(){

    let ip = $("#remoteadress").val();

    if(!/^\d+\.\d+\.\d+$/.test(ip)){
        return alert("  ")
    }

    $("#thelist .empty").remove();
    
    room = mwse.room({
        name: `WEB3-Smash [${vip}] RO CONNECT:2`,
        description: "Web3 Smash saQut Server Application",
        joinType: "free",
        notifyActionJoined: true,
        notifyActionEjected: true,
        ifexistsJoin: false
    });
})