function show_beacons(){
    $.ajax({
        url: "/api/user_project/" + project_id + "/all/",
        type: 'GET',
        success: function(result) {
            var beacon_managers = result.beacon_managers
            html = []
            for(var i=0; i< beacon_managers.length; i++){
                beacon = beacon_managers[i].beacon;
                html.push(['<div class="box shadow">',
                '<table class="table borderless">',
                    '<tbody>',
                      '<tr>',
                        '<td class="col-md-2">', beacon.name, '</td>',
                        '<td>'].join(""));
                            for(var j=0; j<beacon_managers[i].sites.length; j++){
                                html.push(['<p> <a href="', beacon_managers[i].sites[j].link_url, '">', beacon_managers[i].sites[j].link_url, '</a>',
                                '<button style="float: right;" onclick="removeLink(\'', beacon_managers[i].url, '\', \'', beacon_managers[i].sites[j].url,'\')" class="btn btn-danger btn-sm" >Usun</button></p>'].join(""))
                            }
                        html.push(['<p> <button class="btn btn-success" onclick="dodajLink(\'',beacon_managers[i].url, '\')">Dodaj link</button></p>',
                        '</td>',
                      '</tr>',
                    '</tbody>',
                  '</table>',
                '</div>'].join(""))
            }
            $("#container__").html(html.join(""));
        }
    });
}


function show_beacons_list(){
    $.ajax({
        url: "/api/beacon_managers/1/all/",
        type: 'GET',
        success: function(result) {
            var beacon_managers = result
            html = []
            for(var i=0; i< beacon_managers.length; i++){
                beacon = beacon_managers[i].beacon;
                html.push(['<div class="box">',
                '<table class="table borderless">',
                    '<tbody>',
                      '<tr>',
                        '<td class="col-md-2">', beacon.name, '</td>',
                        '<td>'].join(""));
                            for(var j=0; j<beacon_managers[i].sites.length; j++){
                                html.push(['<p> <a href="', beacon_managers[i].sites[j].link_url, '">', beacon_managers[i].sites[j].link_url, '</a>',
                                 ,'<button <button style="float: right;" onclick="removeLink(\'', beacon_managers[i].url, '\', \'', beacon_managers[i].sites[j].url,'\')" class="btn btn-danger btn-sm" >Usun</button></p>'].join(""))
                            }
                        html.push(['<p> <button class="btn btn-success" onclick="dodajLink(\'',beacon_managers[i].url, '\')">Dodaj link</button></p>',
                        '</td>',
                      '</tr>',
                    '</tbody>',
                  '</table>',
                '</div>'].join(""))
            }
            $("#container2__").html(html.join(""));
        }
    });
}

function removeProject(event, project_id){
    event.stopPropagation();
    $.ajax({
        url: "/api/user_project/" + project_id,
        type: 'DELETE',
        success: function(result) {
            document.location.reload()
        }
    });
}

function removeLink(beacon_manager, link){
    event.stopPropagation();
    $.ajax({
        url: beacon_manager,
        type: 'GET',
        success: function(result) {
            var index = result.sites.indexOf(link);
            result.sites = result.sites.slice(index, -1);
            $.ajax({
                url: beacon_manager,
                type: 'PUT',
                data: JSON.stringify(result),
                contentType: "application/json",
                success: function(result) {
                    document.location.reload();
                }
            });

        }
    });
}

function dodajLink(beacon_manager, beacon){

    $.getJSON("/api/category/", function(data){

        $("#myModal").modal("show");
        $("#modal-content").html('<form action="/login/" method="post" class="form-signin">\
                <p><input id="url" type="text" class="form-control" placeholder="Link url" required autofocus name="name"></p>\
                <p><input id="desc" type="text" class="form-control" placeholder="Description" required autofocus name="desc"></p>';

        html += "<select id=\"kat\" class=\"form-control\">"
        html += "<option value=\"-\">No category</option>";
        for(var i=0; i<data.results.length; i++){
            html += "<option value=\"" + data.results[i].url + "\">" + data.results[i].name + "</option>";
        }
        html += "</select>"
        html += '</form>';

        $("#modal-content").html(html)

        $("#modal-footer").html('<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>\
            <button type="button" class="btn btn-primary" id="addProjectBtn">Add beacon</button>');

        $("#addProjectBtn").off("click");
        $("#addProjectBtn").on("click", function(){
        var link_url = $("#url").val();
        var desc = $("#desc").val();
        var kat = $("#kat").val();
        if(kat == "-"){
            delete kat;
        }
        var data = {
            "link_url": link_url,
            "description": desc,
            "categories": [],
            "author": user_id,
        };

            $.ajax({
                url: "/api/sites/",
                type: 'POST',
                data: JSON.stringify(data),
                contentType: "application/json",
                success: function(beacon_manager){ return function(result) {
                    $.ajax({
                        url: beacon_manager,
                        type: 'GET',
                        data: JSON.stringify(data),
                        contentType: "application/json",
                        success: function(site_data){return function(result) {
                            result['sites'].push(site_data.url);
                            $.ajax({
                                url: result.url,
                                type: "PUT",
                                data: JSON.stringify(result),
                                contentType: "application/json",
                                success: function(){
                                    document.location.reload()
                                }
                            })
                        }}(result)
                    });
                }}(beacon_manager)
            });
        });
    });
}