// ==UserScript==
// @name           Tribe Members Incoming Overview
// @description    Adds a nice overview of all tribe members receiving incoming attacks.
// @author         Devilicious#9733 (discord)
// @version        1.0
// @grant          none
// @Ticket         t13598530
// @Gekeurd op     27-12-2019
// @include        https://*.tribalwars.ae*screen=ally&mode=members
// @updateURL      https://devilicious.dev/api/tw/scripts/user/tribe_overview_incomings.user.js
// @downloadURL    https://devilicious.dev/api/tw/scripts/user/tribe_overview_incomings.user.js
// ==/UserScript==

/**
 Change log
 * 0.1 - Initial script
 * 0.2 - Support keuring
 * 0.3 - Collapsable incomings per member
 * 0.4 - Reworked table
 * 1.0 - Used a different screen for tribe leaders only. Script will now show units that are on their way.
 **/

const settings = {
    'tribe_leader': {
        body_selector: 'tbody > tr:odd',
        show_next_row: true,
        url: 'members_defense'
    },
    'normal': {
        body_selector: 'tbody > tr:not(:first)',
        show_next_row: false,
        url: 'members_troops'
    }
}

if (window.location.href.indexOf('screen=ally&mode=members') < 0) {
    window.location.assign(game_data.link_base_pure + "ally&mode=members");
}

if (typeof window.$.twAjax === 'undefined') {
    window.$.twAjax = (function () {
        let Ajax = function (options, promise) {
            this.options = options;
            this.promise = promise;
        };

        let Queue = (() => {
            let Queue = function () {
                this.list = [];
                this.working = false;
                this.length = 0;
            };

            Queue.prototype.doNext = function () {
                let item = this.dequeue(),
                    self = this;

                $.ajax(item.options).done(function () {
                    item.promise.resolve.apply(null, arguments);
                    self.start();
                }).fail(function () {
                    item.promise.reject.apply(null, arguments);
                    self.start();
                });
            };

            Queue.prototype.start = function () {
                if (this.length) {
                    this.working = true;
                    this.doNext();
                } else {
                    this.working = false;
                }
            };

            Queue.prototype.dequeue = function () {
                this.length -= 1;
                return this.list.shift();
            };

            Queue.prototype.enqueue = function (item) {
                this.list.push(item);
                this.length += 1;

                if (!this.working) {
                    this.start();
                }
            };

            return Queue;
        })();

        let orchestrator = (() => {
            // Create 5 queues to distribute requests on
            let queues = (() => {
                const needed = 5;
                let arr = [];

                for (let i = 0; i < needed; i++) {
                    arr[i] = new Queue();
                }

                return arr;
            })();

            return (item) => {
                let leastBusyQueue = queues.map(q => q.length).reduce((next, curr) => (curr < next) ? curr : next, 0);
                queues[leastBusyQueue].enqueue(item);
            };
        })();

        return function (options) {
            let promise = $.Deferred(),
                item = new Ajax(options, promise);

            orchestrator(item);

            return promise;
        };
    })();
}

const getPlayerOverviewHtml = (playerId, url) => $.twAjax({url: `${game_data.link_base_pure}ally&mode=${url}&player_id=${playerId}`});
const showErrorNotEnoughRights = (element) => element.append('<td class="lit-item" style="text-align: center"><img src="graphic/error.png" title="Deze speler heeft niet de juiste permissie gegeven om incomings te laten zien."></td>');

function insertIncomingAttacksPerPlayer(player, element) {
    const role = $('#ally_content tr.selected').find(`td:eq(${$('.lead').closest('th').index()}) img[src*="green.png"]`).length > 0 ? 'tribe_leader' : 'normal';

    return $.when(getPlayerOverviewHtml(player.id, settings[role].url)).done(function (html) {
        const overviewTable = $(html).find('#ally_content a[href*="screen=info_village"]').first().closest('table');
        if (overviewTable.find('tr:first-child th').length > 1) { //Check if at least 2 columns exist. Otherwise user has not given permission to show incoming attacks.
            const incomingsAmountNumber = overviewTable.find('tbody > tr:first-child > th:last-child').text().trim().match(/\d+/g);
            if (incomingsAmountNumber) {
                const incomingsAmount = incomingsAmountNumber.map(Number);
                if (incomingsAmount > 0) {
                    element.after('</br>');
                    overviewTable.find(settings[role].body_selector).each(function () {
                        const incomingPerVillageAmount = $(this).find('td:last-child');
                        if (incomingPerVillageAmount.text().trim() !== '0') {
                            const clonedRow = incomingPerVillageAmount.css({
                                background: "#c1a264",
                                color: "black",
                            }).parent().clone().prop('class', `incomings_${player.id}_village`).hide();
                            if (settings[role].show_next_row) {
                                const nextRow = $(this).next().clone().prop('class', `incomings_${player.id}_troops`).hide();
                                element.after(nextRow);
                            }
                            element.after(clonedRow);
                        }
                    });
                    const clonedHeader = overviewTable.find('tbody > tr:first-child').clone().prop('id', `incomings_${player.id}_list`);
                    clonedHeader.find('th:last-child').html('<img src="graphic/unit/att.png" alt="">');
                    element.after(clonedHeader.hide());
                    $('#tribe_overview_incomings_table tbody').append(
                        `<tr>
                        <td valign="top" width="70%">
                            ${$(`a[href*="screen=info_player&id=${player.id}"]`).closest('td').html()}
                        </td>
                        <td valign="top" width="30%">
                            <img src="graphic/unit/att.png" title="Binnenkomende aanvallen" style="vertical-align: -2px" alt="" class="">
                            <strong><a style="cursor: pointer" id="incomings_${player.id}_totalAmount" title="Click on this to collapse incomings">${incomingsAmount}</a></strong>
                        </td>
                    </tr>`);
                    $('#tribe_overview_incomings_table').parent().closest('table').show();
                }
                element.append(`<td class="lit-item"><strong>(${incomingsAmount})</strong></td>`);
                const incomingsAmountElement = `#incomings_${player.id}_totalAmount`;
                $(incomingsAmountElement).click(function () {
                    $(`#incomings_${player.id}_list, .incomings_${player.id}_village, .incomings_${player.id}_troops`).toggle();
                });
            } else {
                showErrorNotEnoughRights(element);
            }
        } else {
            showErrorNotEnoughRights(element);
        }
    });
}

const tribeMembersTable = $('#content_value a[href*="screen=info_player"]').first().closest('table');
tribeMembersTable.find('tr').first().append('<th><img src="graphic/unit/att.png" alt=""></th>')
tribeMembersTable.find('.row_a, .row_b').each(function () {
    insertIncomingAttacksPerPlayer({
        id: $(this).find('a').first().attr('href').match(/id=(\d+)/)[1],
        name: $(this).find('a').first().text()
    }, $(this));
});


let overviewHtml = `<table width="50%" cellspacing="0" cellpadding="0">
                <tbody>
                    <tr>
                        <td width="40%" valign="top">
                            <div class="vis">
                                <h4><img src="graphic/unit/att.png" title="Binnenkomende aanvallen" style="vertical-align: -2px" alt="" class="">Tribe overview incomings <img src="graphic/unit/att.png" title="Binnenkomende aanvallen" style="vertical-align: -2px" alt="" class=""></h4>
                                    <table id="tribe_overview_incomings_table" width="100%" class="vis">
                                        <tbody>
                                        </tbody>
                                    </table>
                            </div>
                        </td>
                </tr>
                </tbody></table>`;
$('#ally_content').before(overviewHtml);
$('#tribe_overview_incomings_table').parent().closest('table').hide();