var store, searchgrid;

function idquery() {
    var idinput = document.getElementById("idinput").value;
    store.proxy.conn.url = 'http://www.opengeohost.com/geoserver/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=stlawrence:parcels2009&CQL_FILTER=PRINTKEY%20like%20%27%25' + idinput + '%25%27&outputformat=json';
    store.load();
}

function ownerquery() {
    var ownerinput = document.getElementById("ownerinput").value;
    store.proxy.conn.url = 'http://www.opengeohost.com/geoserver/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=stlawrence:parcels2009&CQL_FILTER=OWNER%20like%20%27%25' + ownerinput + '%25%27&outputformat=json';
    store.load();
}

function addressquery() {
    var addressinput = document.getElementById("addressinput").value;
    store.proxy.conn.url = 'http://www.opengeohost.com/geoserver/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=stlawrence:parcels2009&CQL_FILTER=ADDRESS%20like%20%27%25' + addressinput + '%25%27&outputformat=json';
    store.load();
}

Ext.onReady(function () {
    var xg = Ext.grid;

    store = new Ext.data.JsonStore({
        autoLoad: false,
        url: 'http://www.opengeohost.com/geoserver/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=stlawrence:parcels2009&outputformat=json',
        root: 'features',
        fields: [{
            name: "PRINTKEY",
            mapping: "properties.PRINTKEY"
        },
        {
            name: "OWNER",
            mapping: "properties.OWNER"
        },
        {
            name: "ADDRESS",
            mapping: "properties.ADDRESS"
        },
        {
            name: "MUNI",
            mapping: "properties.MUNI"
        },
        {
            name: "PROP_CLASS",
            mapping: "properties.PROP_CLASS"
        },
        {
            name: "ACRES",
            mapping: "properties.ACRES"
        },
        {
            name: "SWIS",
            mapping: "properties.SWIS"
        },
        {
            name: "PROP_INFO",
            mapping: "properties.PROP_INFO"
        },
        {
            name: "BBOX",
            mapping: "properties.bbox"
        }],
        sortInfo: {
            field: 'OWNER',
            direction: 'ASC'
        }
    });

    var filters = new Ext.ux.grid.GridFilters({
        encode: false,
        local: true,
        filters: [{
            type: 'string',
            dataIndex: 'PRINTKEY'
        },
        {
            type: 'string',
            dataIndex: 'OWNER'
        },
        {
            type: 'string',
            dataIndex: 'ADDRESS'
        },
        {
            type: 'string',
            dataIndex: 'MUNI'
        },
        {
            type: 'numeric',
            dataIndex: 'PROP_CLASS'
        },
        {
            type: 'numeric',
            dataIndex: 'ACRES'
        },
        {
            type: 'numeric',
            dataIndex: 'SWIS'
        }]
    });

    function renderMap(value, p, record, data) {
        return String.format('<a href="#" onClick="highlightWMS(&#34;{1}&#34;); map.zoomToExtent(new OpenLayers.Bounds({0}).transform(map.displayProjection, map.googleprojection));">Zoom</a>', value, record.data.PRINTKEY);
    }

    function renderPropInfo(value, p, record) {
        return String.format('<a href="{0}&year=2009" target="_blank">PROPERTY INFO</a>', value);
    }

    searchgrid = new xg.GridPanel({
        store: store,
        plugins: [filters],
        stripeRows: true,
        cm: new xg.ColumnModel({
            defaults: {
                width: 20,
                sortable: true
            },
            columns: [{
                header: "MAP",
                width: 50,
                dataIndex: 'BBOX',
                renderer: renderMap,
                sortable: false
            },
            {
                header: "PARCEL ID",
                width: 100,
                dataIndex: 'PRINTKEY',
                filterable: true,
                sortable: true
            },
            {
                header: "OWNER",
                width: 100,
                dataIndex: 'OWNER',
                filterable: true,
                sortable: true
            },
            {
                header: "ADDRESS",
                width: 100,
                dataIndex: 'ADDRESS',
                filterable: true,
                sortable: true
            },
            {
                header: "MUNICIPALITY",
                width: 100,
                dataIndex: 'MUNI',
                filterable: true,
                sortable: true
            },
            {
                header: "PROPERTY CLASS",
                width: 100,
                dataIndex: 'PROP_CLASS',
                filterable: true,
                sortable: true
            },
            {
                header: "ACRES",
                width: 100,
                dataIndex: 'ACRES',
                filterable: true,
                sortable: true
            },
            {
                header: "SWIS",
                width: 100,
                dataIndex: 'SWIS',
                filterable: true,
                sortable: true
            },
            {
                header: "PROPERTY INFO",
                width: 100,
                dataIndex: 'PROP_INFO',
                renderer: renderPropInfo,
                filterable: false,
                sortable: false
            }]
        }),
        viewConfig: {
            forceFit: true,
            emptyText: '<br/><br/><center><div class="no_data">No results found...</div></center>'
        },
        columnLines: true,
        width: '100%',
        height: 175,
        collapsible: false,
        animCollapse: false,
        loadMask: true,
        renderTo: 'searchgrid'
    });
});
