Source: widgets/SpwReaderXml.js

/**
 * @class spw.widgets.SpwReaderXml
 */
define(["dojo/_base/declare","spw/api/SpwBaseWidget", "dojo/_base/lang", "esri/request", "dojo/on",
        "dojo/dom-construct", "dojo/query", "spw/api/ProjectionManager", "esri/graphic", "esri/geometry/Point",
        "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "dojo/_base/Color", 
        "dojo/_base/array", "esri/InfoTemplate", "dgrid/Grid", "dgrid/util/mouse", "dgrid/Selection"], 
		function(declare, SpwBaseWidget, lang, request, on, domConstruct, query, ProjectionManager,
				Graphic, Point, SimpleMarkerSymbol, SimpleLineSymbol, Color, array, InfoTemplate, 
				Grid, mouseUtil, Selection){
	
	var XmlDisplayer = null;
	
	XmlDisplayer = declare("spw.widgets.SpwReaderXml", [SpwBaseWidget], /** @lends spw.widgets.SpwReaderXml.prototype */{
		
		xmlDescriptor:{
			url:"http://www.awt.be/xml/recherche/recherche.aspx",
			parameters:{ search: "NSI", toto: "tutu" },
			masterTag: "organismes organisme",
			srId:4326,
			xTag: "adresse longitude",
			yTag: "adresse latitude",
			attrTag:["nom_organisme", "presentation", "nomenclature", "url"],
			templateTitle:"Entreprise : ${nom_organisme}",
			template: "<table><tr><td>Nom</td><td>${nom_organisme}</td></tr><tr><td>Présentation</td><td>${presentation}</td></tr><tr><td>Nomenclature</td><td>${nomenclature}</td></tr></table>"
		},
		
		_elements: null,
		_inputs: null,
		_graphics: null,
		_resultAttachPoint: null,
		_resultGrid: null,
		
		_simpleSymbol: new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 15, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([92,2,11]), 1), new Color([191,0,19,1])),
		_highlightSymbol: new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 15, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("darkgreen"), 1), new Color("green")),
		
		onActivate: function() {
			this.inherited(arguments);
			//this.displayXml();
		},
		
        /**
         * @constructs
         * @param config
         */
		constructor: function() {
			this._elements = [];
			this._inputs = [];
			this._graphics = [];
		},
		
		
		postCreate: function(){
			this.inherited(arguments);
			
			if(this.xmlDescriptor && this.xmlDescriptor.parameters){
				for(var k in this.xmlDescriptor.parameters){
					this._inputs.push(domConstruct.create("input", { type:"text", name: k, value: this.xmlDescriptor.parameters[k]}, this.domNode));
				}
			}
			
			var btn = domConstruct.create("button", { innerHTML:"Afficher" }, this.domNode);			
			on(btn, "click", lang.hitch(this, this.displayXml));

			this._resultAttachPoint = domConstruct.create("div", {"class":"dTuned"}, this.domNode);
		},
		
		displayXml: function(){
			array.forEach(this._graphics, lang.hitch(this, function(g){
				this.spwViewer.get('spwMap').removeFeature(g);
			}));
			this._elements = [];

			if(this._inputs){
				array.forEach(this._inputs, lang.hitch(this, function(input){
					this.xmlDescriptor.parameters[input.name] = input.value;
				}));
			}
			
			request({
				url:this.xmlDescriptor.url,
				content: this.xmlDescriptor.parameters,
				handleAs: "xml"
			}).then(
			    lang.hitch(this, function(response) {
			        query(this.xmlDescriptor.masterTag, response).forEach(lang.hitch(this, this.processMasterTag));
			        var columns = {};
			        array.forEach(this.xmlDescriptor.attrTag, function(a){columns[a] = {label:a};});
			        
			        var dataTable = this.spwViewer.get('spwWidgetsManager').getWidgets({widgetId:"dataTable"})[0];
			        dataTable.displayData(this._elements);
			        
//			        this._resultGrid = new (declare([Grid, Selection]))({ 
//			        	selectionMode: "single",
//			        	columns: columns
//		        	}, domConstruct.create("div", {}, this._resultAttachPoint));
//			        this._resultGrid.renderArray(this._elements);
//			        this._resultGrid.on(mouseUtil.enterRow, lang.hitch(this, this.gridRowEntered));
//			        this._resultGrid.on(mouseUtil.leaveRow, lang.hitch(this, this.gridRowLeaved));
//			        this._resultGrid.on("dgrid-select", lang.hitch(this, this.gridRowSelected));
			    }), 
			    lang.hitch(this, function(error) {
			        console.log("Error: ", error);
			    })
			);
		},
		
		gridRowEntered: function(event){
            var row = this._resultGrid.row(event);
            row.data.graphic.setSymbol(this._highlightSymbol);
        },
		
        gridRowLeaved: function(event){
            var row = this._resultGrid.row(event);
            row.data.graphic.setSymbol(this._simpleSymbol);
        },
        
        gridRowSelected: function(event){
            var row = event.rows[0];
            this.spwViewer.get('spwMap').zoomToFeature(row.data.graphic);
        },
		
		processMasterTag: function(element, idx) {
			var x = parseFloat(query(this.xmlDescriptor.xTag, element)[0].innerHTML.replace(',','.'));
			var y = parseFloat(query(this.xmlDescriptor.yTag, element)[0].innerHTML.replace(',','.'));
			
			if(this.xmlDescriptor.srId != this.spwViewer.spatialReference){
				var res = ProjectionManager.getInstance().transform(this.xmlDescriptor.srId, this.spwViewer.spatialReference, x, y);
				x = res.x;
				y = res.y;
			}
			
			var data = null;
			var g = new Graphic(new Point(x, y, this.spwViewer.get('spatialReference')), this._simpleSymbol,
					data = this.getElementAttributes(element),new InfoTemplate(this.xmlDescriptor.templateTitle, this.xmlDescriptor.template));
			this.spwViewer.get('spwMap').showFeature(g);
			this._graphics.push(g);
			
			data.graphic = g;
			this._elements.push(data);
		},
		
		getElementAttributes: function(element){
			var attr = {};
			array.forEach(this.xmlDescriptor.attrTag, lang.hitch(this, function(attrKey){
				if(attrKey[0] == '['){
					attr[attrKey] = element[attrKey];
				} else {
					attr[attrKey] = query(attrKey, element)[0].innerHTML;
				}
			}));
			return attr;
		}
        
	});

	return XmlDisplayer;
});