(function() {
    function InitializeView() {
        LoadAccounts();
        $('#cmbAccounts').change(function() {
            ToFirstPage();
        });
        $('#cmbStatuses').change(function() {
            ToFirstPage();
        });
        $('#cmbPageSize').change(function() {
            var select = $(this)[0];
            $('#hfPageSize')[0].value = select.options[select.selectedIndex].value;
            LoadOrders();
        });
        LoadOrderStatuses();
    };
    function LoadAccounts() {
        var jSelect = $('#cmbAccounts');
        if (jSelect.length > 0) {
            var select = jSelect[0];
            $.ajax({
                type: 'GET',
                url: 'services/clientservices.axd',
                data: 'method=GetAccounts',
                dataType: 'json',
                success: function(data) {
                    PopulateAccounts(select, data);
                    LoadOrders();
                },
                error: function(xhttp, status, msg) {
                    ToError(select);
                }
            });
        }
    };
    function LoadOrders() {
        var accSelect = $('#cmbAccounts')[0];
        var accountId = accSelect.options[accSelect.selectedIndex].value;
        var status = $('#cmbStatuses')[0];
        var orderStatus = status.options[status.selectedIndex].value;
        var pageNum = $('#hfPageNum')[0].value;
        var pageSize = $('#hfPageSize')[0].value;
        DisableControls();
        $.ajax({
            type: 'GET',
            url: 'services/clientservices.axd',
            data: 'method=GetOrders&accountId=' + accountId + '&orderStatus=' + orderStatus + '&pageNum=' + pageNum + '&pageSize=' + pageSize,
            dataType: 'json',
            success: function(data) {
                PopulateOrders(data);
                EnableControls();
            },
            error: function(xhttp, status, msg) {
                alert('orders error:' + xhttp + ',' + status + ',' + msg);
            }
        });
    };
    function DisableControls() {
        $('#cmbAccounts')[0].disabled = true;
        $('#cmbStatuses')[0].disabled = true;
    };
    function EnableControls() {
        $('#cmbAccounts')[0].disabled = false;
        $('#cmbStatuses')[0].disabled = false;
    };
    function PopulateAccounts(select, data) {
        PopulateSelect(select, data);
        var option = document.createElement('option');
        option.value = '';
        option.text = 'All';
        InsertOption(select, option);
        select.selectedIndex = 0;
    };
    function PopulateOrders(data) {
        var tbody = $('#tblOrders tbody:first');
        tbody.empty();
        var html = '';
        for (var i = 0; i < data.length; i++) {
            var obj = data[i];
            html += '<tr class="collapsibleGridRow">'
                + '<td></td>'
                + '<td><div class="form-label"><a class="order-id-link">' + obj.ID + '</a></div></td>'
                + '<td><div class="form-label"><a class="account-id-link">' + obj.AccountId + '</a></div></td>'
                + '<td><div class="form-label">' + obj.Status + '</div></td>'
                + '<td><div class="form-label">' + obj.TimeCreated + '</div></td>'
                + '<td><div class="form-label">' + obj.TimeProcessed + '</div></td>'
                + '<td><div class="form-label">' + GetButtonIfDefault(obj.TimeFilled, obj.TimeProcessed, 'Fill', obj.ID) + '</div></td>'
                + '<td><div class="form-label">' + GetButtonIfDefault(obj.TimeShipped, obj.TimeFilled, 'Ship', obj.ID) + '</div></td>'
                + '<td><div class="form-label">' + obj.Shipping + '</div></td>'
                + '<td><div class="form-label">' + obj.Total + '</div></td>'
                + '</tr>';
        }
        tbody.append(html);
        tbody.find('.order-id-link').each(function() {
            $(this).click(function() {
                var orderId = $(this).html();
                LoadProducts(orderId);
                return false;
            });
        });
        tbody.find('.account-id-link').each(function() {
            $(this).click(function() {
                var accountId = $(this).html();
                LoadAccountInfo(accountId);
                return false;
            });
        });
    };
    function GetButtonIfDefault(target, previous, buttonText, orderId) {
        if (target == '---' && previous != '---') {
            return '<input class="form-button" type="button" onclick="llw.Paging.SetOrderState(' + orderId + ',\'' + buttonText + '\');return false;" value="' + buttonText + '" />';
        }
        return target;
    };
    function SetOrderState(orderId, state) {
        $.ajax({
            type: 'GET',
            url: 'services/clientservices.axd',
            data: 'method=SetOrderState&orderId=' + orderId + '&orderState=' + state,
            dataType: 'json',
            success: function(data) {
                LoadOrders();
            },
            error: function(xhttp, status, msg) {
                alert('order state error:' + xhttp + ',' + status + ',' + msg);
            }
        });
    };
    function LoadAccountInfo(accountId) {
        $.ajax({
            type: 'GET',
            url: 'services/clientservices.axd',
            data: 'method=GetAccountInfo&accountId=' + accountId,
            dataType: 'json',
            success: function(data) {
                PopulateAccountInfo(data);
            },
            error: function(xhttp, status, msg) {
                alert('account info error:' + xhttp + ',' + status + ',' + msg);
            }
        });
    };
    function PopulateAccountInfo(data) {
        var pnl = $('#pnlAccount');
        pnl.find('#txtEmail').html(data.Email);
        pnl.find('#txtFirstName').html(data.FirstName);
        pnl.find('#txtLastName').html(data.LastName);
        pnl.find('#txtAddress').html(data.Address);
        pnl.find('#txtPhone').html(data.Phone);
        pnl.show('fast');
    };
    function LoadProducts(orderId) {
        $.ajax({
            type: 'GET',
            url: 'services/clientservices.axd',
            data: 'method=GetOrderProducts&orderId=' + orderId,
            dataType: 'json',
            success: function(data) {
                PopulateProducts(data);
            },
            error: function(xhttp, status, msg) {
                alert('products error:' + xhttp + ',' + status + ',' + msg);
            }
        });
    };
    function PopulateProducts(data) {
        var table = $('#pnlOrder table');
        table.empty();
        for (var i = 0; i < data.length; i++) {
            var obj = data[i];
            table.append('<tr class="option">'
                + '<td align="left">'
                    + '<div class="product-label">Type - </div>'
                    + '<div class="product-label">Chain Style - </div>'
                    + '<div class="product-label">Chain Length - </div>'
                    + '<div class="product-label">Inscription - </div>'
                    + '<div class="product-label">Font Style - </div>'
                    + '<div class="product-label">Gender - </div>'
                + '</td>'
                + '<td align="left">'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.Type, '---') + '</div>'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.ChainStyle, '---') + '</div>'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.ChainLength, '---') + '</div>'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.Inscription, '---') + '</div>'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.FontStyle, '---') + '</div>'
                    + '<div class="product-value">' + GetValueOfOrDefault(obj.Gender, '---') + '</div>'
                + '</td>'
                + '<td>'
                    + '<img src="' + obj.ImageUrl + '" width="' + obj.ImageWidth + '" height="' + obj.ImageHeight + '" /><br />'
                    + '<div class="form-label">' + obj.ImageName + '</div>'
                + '</td>'
                + '<td>'
                    + GetCheckBoxOf(obj.WillEmailPhoto, 'Will e-mail photo')
                    + GetCheckBoxOf(obj.WillMailPhoto, 'Will mail photo')
                + '</td>'
            + '</tr>');
            $('#pnlOrder').show('fast');
        };
    };
    function LoadOrderStatuses() {
        if ($('#pnlOrderStatus').length > 0) {
            $.ajax({
                type: 'GET',
                url: 'services/clientservices.axd',
                data: 'method=GetAccountOrders',
                dataType: 'json',
                success: function(data) {
                    PopulateOrderStatuses(data);
                },
                error: function(xhttp, status, msg) {
                    alert('order status error:' + xhttp + ',' + status + ',' + msg);
                }
            });
        }
    };
    function PopulateOrderStatuses(data) {
        var tbody = $('#tblOrders tbody');
        tbody.empty();
        var html = '';
        for (var i = 0; i < data.length; i++) {
            var obj = data[i];
            html += '<tr class="collapsibleGridRow">'
                + '<td>' + obj.ID + '</td>'
                + '<td>' + obj.Status + '</td>'
                + '<td>' + obj.TimeCreated + '</td>'
                + '<td>' + obj.TimeProcessed + '</td>'
                + '<td>' + obj.TimeFilled + '</td>'
                + '<td>' + obj.TimeShipped + '</td>'
                + '<td>' + obj.Shipping + '</td>'
                + '<td>' + obj.Total + '</td>'
                + '</tr>';
        }
        tbody.html(html);
    };
    function GetCheckBoxOf(prop, label) {
        if (prop.toString().toLowerCase() == "true") {
            return '<input type="checkbox" class="form-checkbox" checked="checked" /><div class="form-checkbox-label">' + label + '</div><br />';
        } else {
            return '<input type="checkbox" class="form-checkbox" /><div class="form-checkbox-label">' + label + '</div><br />';
        }
    };
    function ToFirstPage() {
        $('#hfPageNum')[0].value = '0';
        LoadOrders();
    };
    function ToPreviousPage() {
        var currentPage = parseInt($('#hfPageNum')[0].value);
        $('#hfPageNum')[0].value = Math.max(0, currentPage - 1);
        LoadOrders();
    };
    function ToNextPage() {
        var currentPage = parseInt($('#hfPageNum')[0].value);
        $('#hfPageNum')[0].value = currentPage + 1;
        LoadOrders();
    };
    function GetValueOfOrDefault(val, def) {
        if (val) {
            return val;
        } else {
            return def;
        }
    };
    function PopulateSelect(select, data) {
        select.options.length = 0;
        for (var id in data) {
            var option = document.createElement('option');
            option.value = id;
            option.text = data[id];
            AddOption(select, option);
        }
        if (select.options.length == 0) {
            ToNone(select);
        } else {
            select.disabled = false;
            select.selectedIndex = 0;
        }
    };
    function InsertOption(select, option) {
        if ($.browser.msie) {
            select.add(option, 0);
        } else {
            var firstOption = select.options[0];
            select.add(option, firstOption);
        }
    };
    function AddOption(select, option) {
        if ($.browser.msie) {
            select.add(option);
        } else {
            select.add(option, null);
        }
    };
    function ToNone(select) {
        PopulateSelect(select, { 0: 'None' });
        select.disabled = true;
    };
    function ToError(select) {
        PopulateSelect(select, { 0: 'Error' });
        select.disabled = true;
    };
    /**************** Runtime ***********************/
    if (typeof window.llw == 'undefined') {
        window.llw = {};
    };
    window.llw.Paging = {};
    window.llw.Paging.ToFirstPage = ToFirstPage;
    window.llw.Paging.ToPreviousPage = ToPreviousPage;
    window.llw.Paging.ToNextPage = ToNextPage;
    window.llw.Paging.SetOrderState = SetOrderState;

    $(function() {
        InitializeView();
    });
})();