/**
 * Sort calculator results
 *
 * @return Void
 */
$(document).on('click', '.divClass', function(e) {
    e.preventDefault();

    setDataAttrToElement($(this));

    let orderDir = $(this).attr('data-dir');
    let elements = [];

    mapElementsFromClickedRow($(this), elements);

    orderElements(elements, orderDir);
});

/**
 * Remove all the other data attributes,
 * except on the clicked one.
 *
 * @param HtmlNode thisEl
 */
function setDataAttrToElement(thisEl) {
    $('.divClass').not(thisEl).removeAttr('data-dir');
    thisEl.attr('data-dir') === 'asc' ? thisEl.attr('data-dir', 'desc') : thisEl.attr('data-dir', 'asc');
}

/**
 * Map all the divs that are below
 * the chosen sorting.
 *
 * @param  HtmlNode thisEl
 * @param  Array elements
 * @return Void
 */
function mapElementsFromClickedRow(thisEl, elements) {
    let indexOfElement = thisEl.index();
    let numOfRowsInTable = $('.calc-row > div:visible').length;
    let numOfRows = $('.calc-row:first > div:visible').length;

    for (let i = indexOfElement; i < numOfRowsInTable; i += numOfRows) {
        putElementInArray(elements, i);
    }
}

/**
 * Create object of the element with it's value,
 * and push it to array.
 *
 * @param  Array elements
 * @param  Integer i
 * @return Void
 */
function putElementInArray(elements, i) {
    let {element, elValue} = elementValue(i);

    elements.push({
        elementNode: element,
        value: elValue
    });
}

/**
 * Get text (value) of the element.
 *
 * @param  Integer i
 * @return Object
 */
function elementValue(i) {
    let element = $('.calc-row > div:visible').eq(i);
    let elValue = element.children('p').text();

    return {
        element,
        elValue: parseFloat(elValue)
    };
}

/**
 * Order elements in ascending or descending order.
 *
 * @param  Array elements
 * @param  String orderDir
 * @return Void
 */
function orderElements(elements, orderDir) {
    for (let i = elements.length - 1; i - 1 >= 0; i--) {
        let el1 = elements[i];
        let el2 = elements[i - 1];

        if (el1.value > el2.value && orderDir === 'asc') {
            swap(el2, el1);
        } else if (orderDir === 'desc') {
            swap(el2, el1);
        }
    }
}

/**
 * Swap divs of the elements.
 *
 * @param  HtmlNode el1
 * @param  HtmlNode el2
 * @return Void
 */
function swap(el1, el2) {
    el1.elementNode.parent().before(el2.elementNode.parent());
}