BemsWebApplication.Zone = function( params, viewInfo) {
    "use strict";

    var buildingDataSource = BemsWebApplication.db.createDataSource( 'CmBuilding', true ),
        floorDataSource = BemsWebApplication.db.createDataSource( 'CmFloor', true );

    var buildings = ko.observableArray(),
        floors = ko.observableArray();

    var buildingsForSearch = ko.observableArray(),
        floorsForSearch = ko.observableArray(),

        buildingIdForSerach = ko.observable(),
        floorIdForSerach = ko.observable();

    var deferredForSearch = new $.Deferred();

    function handleChangedBuildingInSearchView( e ) {
        if( e.value === 0 ) {
            floorsForSearch( getDefaultFloorForSearch() );
        }
        else {
            BWA.DataUtil.setArrayDataSourceFilter( floorDataSource, 'BuildingId', e.value, floorsForSearch, getDefaultFloorForSearch() );        
        }
        floorIdForSerach( 0 );
    }

    var viewModel = BWA.DataGrid.createViewWithDataGrid( params, viewInfo, 'CmZone', {

            dataSourceOptions: {
                select: ['SiteId', 'FloorId', 'BuildingId', 'ZoneId', 'Name', 'CmBuilding/Name', 'CmFloor/Name', 'Target_temperature', 'Target_humidity'],
                expand: [ 'CmBuilding', 'CmFloor' ],
                extendOptions: {
                    forceOriginalField: true,
                }
            },
            columns: [
                { dataField: 'ZoneId', caption: $G('number'), width: '15%', alignment: 'center' },
                { dataField: 'CmBuilding/Name', caption: $G('buildingName'), width: '22%', alignment: 'center' },
                { dataField: 'CmFloor/Name', caption: $G('floorName'), width: '23%', alignment: 'center' },
                { dataField: 'Name', caption: $G( 'zoneName' ), width: '40%', alignment: 'center' },
                { dataField: 'Target_temperature', caption: '목표온도', width: '40%', alignment: 'center' },
                { dataField: 'Target_humidity', caption: '목표습도', width: '40%', alignment: 'center' }
                //utils.datagrid.columnIsUse( '15%' )
            ],
            popupWidth: 480,
            promiseDataInSearchView: deferredForSearch.promise(),
            searchViewItems: [ 
                { id: 'BuildingId', ignoreValue: 0, defaultValue: 0, value: buildingIdForSerach, dataSource: buildingsForSearch, handleChangedValue: handleChangedBuildingInSearchView }, 
                { id: 'FloorId', ignoreValue: 0, defaultValue: 0, withCheckId: 'BuildingId', value: floorIdForSerach, dataSource: floorsForSearch }, 
                { id: 'Name' }
            ],
            handleViewShowing: function() {
                buildingDataSource.load().done( function( buildingResults ) {
                    buildings( buildingResults );

                    buildingsForSearch( $SearchView.createArrayOfSelectBox( 'BuildingId', buildings() ) );
                    floorsForSearch( getDefaultFloorForSearch() );

                    buildingIdForSerach( 0 );
                    floorIdForSerach( 0 );
                    deferredForSearch.resolve();
                });
            },
            handleDataGridRowClick: function (id,dataGrid,clickRow,popupVisible) {
                dataGrid.clearSelection();

                var data = clickRow.data;
                var dataModel = viewModel.dataModel;
                dataModel.BuildingName = $KoSet(dataModel.BuildingName, data['CmBuilding/Name']);
                dataModel.FloorName = $KoSet(dataModel.FloorName, data['CmFloor/Name']);

                popupVisible(true);
            },
            handleAfterLoadingModelByKey: function( data, dataViewModel, isNewInPopup ) {
                if( isNewInPopup() == false ) {
                    BWA.DataUtil.setArrayDataSourceFilter( floorDataSource, 'BuildingId', dataViewModel.BuildingId(), floors );
                }
            },
            handlePopupShowing: function (that) {
            }
    } );

    function getDefaultFloorForSearch() {
        return $SearchView.createDefaultArray( 'FloorId' );        
    }

    viewModel.buildings = buildings;
    viewModel.buildingsForSearch = buildingsForSearch;
    viewModel.floors = floors;
    viewModel.floorsForSearch = floorsForSearch;

    viewModel.handleSelectBoxChangeBuilding = function( e ) {
        BWA.DataUtil.setArrayDataSourceFilter( floorDataSource, 'BuildingId', e.value, floors );
        viewModel.dataModel.FloorId( null );
    }

    return viewModel;
};