'use strict';

// get reference to app module
var app = angular.module('app');

// controller
app.controller('appCtrl', function ($scope, $http, $interval) {

    // initialize detail visibility mode
    $scope.detailMode = wijmo.grid.detail.DetailVisibilityMode.ExpandSingle;

    // initialize animation mode
    $scope.isAnimated = true;

    // initialize detail row FlexGrid with Northwind data, DetailProvider version
    // this is used to show how to use the FlexGridDetailProvider without a directive
    $scope.initDetailProvider = function (s, e) {
        var dp = new wijmo.grid.detail.FlexGridDetailProvider(s, {

            // use animation when showing details
            isAnimated: true,

            // limit height of detail rows
            maxHeight: 250,

            // create detail cells for a given row
            createDetailCell: function (row) {
                var cell = document.createElement('div');
                s.hostElement.appendChild(cell);
                var detailGrid = new wijmo.grid.FlexGrid(cell, {
                    headersVisibility: wijmo.grid.HeadersVisibility.Column,
                    autoGenerateColumns: false,
                    itemsSource: $scope.getProducts(row.dataItem.CategoryID),
                    isReadOnly: true,
                    columns: [
                        { header: 'ID', binding: 'ProductID' },
                        { header: 'Name', binding: 'ProductName' },
                        { header: 'Qty/Unit', binding: 'QuantityPerUnit' },
                        { header: 'Unit Price', binding: 'UnitPrice' },
                        { header: 'Discontinued', binding: 'Discontinued' }
                    ]
                });
                cell.parentElement.removeChild(cell);
                return cell;
            },

            // remove details from items with odd CategoryID
            rowHasDetail: function (row) {
                return row.dataItem.CategoryID % 2 == 0;
            }
        });
    }

    // ** get NorthWind data to demonstrate

    // get products for a given category
    var products = {};
    $scope.getProducts = function (categoryID) {
        var view = products[categoryID];
        if (!view) {
            view = new wijmo.collections.CollectionView($scope.products.sourceCollection);
            view.filter = function (item) {
                return item.CategoryID == categoryID;
            }
            products[categoryID] = view;
        }
        return view;
    }

    // get categories and products from server
    var url = 'https://services.odata.org/Northwind/Northwind.svc';
    $scope.categories = new wijmo.odata.ODataCollectionView(url, 'Categories', {
        sortOnServer: false,
        loaded: function () {
            if (!$scope.$$phase) {
                $scope.$apply();
            }
        }
    });
    $scope.products = new wijmo.odata.ODataCollectionView(url, 'Products', {
        sortOnServer: false,
        loaded: function () {
            if (!$scope.$$phase) {
                $scope.$apply();
            }
        }
    });

});
