<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>iphone and gis development notes &#187; javascript</title>
	<atom:link href="http:///wordpress/category/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>/wordpress</link>
	<description>By Rupert</description>
	<lastBuildDate>Sun, 29 Aug 2010 22:44:41 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>ExtJS: Window Snippet</title>
		<link>/wordpress/2008/03/extjs-window-snippet/</link>
		<comments>/wordpress/2008/03/extjs-window-snippet/#comments</comments>
		<pubDate>Wed, 26 Mar 2008 23:03:19 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[ExtJS]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://www.gisnotes.com/wordpress/index.php/2008/03/27/extjs-window-snippet/</guid>
		<description><![CDATA[Just a quick example on creating floatable windows Note that renderTo: &#8216;document.body&#8217; would result in an error, use renderTo: document.body instead var config = { id: 'win', title:'Detail', width:600, height:300, shim:false, animCollapse:false, border:false, layout: 'fit', minimizable: true, maximizable: true, closable: false, renderTo: document.body, left: 620, top: 420, constrain: true }; window1 = new Ext.Window(config); window1.setPosition(0,]]></description>
			<content:encoded><![CDATA[<p>Just a quick example on creating floatable windows</p>
<p>Note that <em>renderTo: &#8216;document.body&#8217;</em> would result in an error, use renderTo: document.body instead</p>
<p><script language="javascript">
		var config = {
		    id: 'win',
		    title:'Detail',
		    width:600,
		    height:300,
		    shim:false,
		    animCollapse:false,
		    border:false,
		    layout: 'fit',
		    minimizable: true,
		    maximizable: true,
		    closable: false,
		    renderTo: document.body,
		    left: 620,
		    top: 420,
		    constrain: true
		};
		window1 = new Ext.Window(config);
		window1.setPosition(0, 0);
		window1.show();
</script></p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/03/extjs-window-snippet/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Test Driven Development using Test.AnotherWay and mxUnit</title>
		<link>/wordpress/2008/03/test-driven-development-using-testanotherway-and-mxunit/</link>
		<comments>/wordpress/2008/03/test-driven-development-using-testanotherway-and-mxunit/#comments</comments>
		<pubDate>Wed, 19 Mar 2008 21:09:13 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[coldfusion]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[testing]]></category>

		<guid isPermaLink="false">http://www.gisnotes.com/wordpress/index.php/2008/03/20/test-driven-development-using-testanotherway-and-mxunit/</guid>
		<description><![CDATA[Time and time again, I have debugging bugs and redeveloping code which some I wrote but mostly done by others as well. Experience is still my best teacher in web development and I believe it would be a heavier burden later on if we continuously pursue rapid development without any testing at all. You may]]></description>
			<content:encoded><![CDATA[<p>Time and time again, I have debugging bugs and redeveloping code which some I wrote but mostly done by others as well. Experience is still my best teacher in web development and I believe it would be a heavier burden later on if we continuously pursue rapid development without any testing at all.</p>
<p>You may have heard of writing test cases before diving into code which is well known as Test Driven Development.  This methodology has been widely adapted in programming (Java thru JUnit, etc).  Following Kent Beck&#8217;s Test Driven Development (TDD) we will follow this simple method:</p>
<ol>
<li>Write the test <em>first</em></li>
<li>Watch the test fail</li>
<li>Write the component</li>
<li>Watch the test pass</li>
</ol>
<p><span id="more-155"></span><br />
A. <a href="http://straytree.com/TestAnotherWay/doc/index.html">Test.AnotherWay.</a> With the emerging trend in web development including javascript, I need a similar aproach which makes development consistent and debugging easier for the client/front-end.  Since I&#8217;ve been doing mostly web mapping, I have adapted a testing methodology from OpenLayers which is practical but effective.</p>
<p>1. Read <a href="http://straytree.com/TestAnotherWay/doc/index.html">Test.AnotherWay Documentation</a></p>
<p>2. Download <a href="http://straytree.com/TestAnotherWay/download/Test.AnotherWay-0.51.tar.gz">Test.AnotherWay-0.51.tar.gz</a></p>
<p>3. Let&#8217;s say my application is called <strong>myproject</strong>. Create a <em>test</em> folder under <strong>myproject</strong>.</p>
<p>4. Copy run-tests.html, list-tests.html into <strong>myproject</strong>/<em>test</em>. Don&#8217;t be surprised if you can&#8217;t find list-tests.html in Test.AnotherWay.</p>
<p>5. Writing the tests. To add a test, you should add it on <strong>list-tests.html</strong>. Test files should be named beginning with test_. For example, <em>test_index.html<br />
</em></p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">    <span style="color: #003366; font-weight: bold;">function</span> test_Map<span style="color: #009900;">&#40;</span>t<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
        t.<span style="color: #660066;">plan</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">3</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">//this should go to the Application\\'s Global Settings</span>
    	<span style="color: #003366; font-weight: bold;">var</span> baselayer <span style="color: #339933;">=</span> CS.<span style="color: #660066;">globals</span>.<span style="color: #660066;">baselayer</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">//this should go to the Application\\'s Global Settings</span>
		<span style="color: #003366; font-weight: bold;">var</span> options <span style="color: #339933;">=</span> CS.<span style="color: #660066;">globals</span>.<span style="color: #660066;">options</span><span style="color: #339933;">;</span>		
&nbsp;
		map <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> CS.<span style="color: #660066;">Map</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;div-map&quot;</span><span style="color: #339933;">,</span> baselayer<span style="color: #339933;">,</span> options<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>	<span style="color: #006600; font-style: italic;">// default options was set</span>
		t.<span style="color: #660066;">eq</span><span style="color: #009900;">&#40;</span>map.<span style="color: #660066;">getMap</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">CLASS_NAME</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;OpenLayers.Map&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;map object created successful&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		layerPlaces <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> CS.<span style="color: #660066;">VectorLayer</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;Places Layer&quot;</span><span style="color: #339933;">,</span> options<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		t.<span style="color: #660066;">eq</span><span style="color: #009900;">&#40;</span>layerPlaces.<span style="color: #660066;">getLayer</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">CLASS_NAME</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;OpenLayers.Layer.Vector&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;vector layer created successfully&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		map.<span style="color: #660066;">addVectorLayer</span><span style="color: #009900;">&#40;</span>layerPlaces<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		selectControl <span style="color: #339933;">=</span> layerPlaces.<span style="color: #660066;">getSelectControl</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		t.<span style="color: #660066;">eq</span><span style="color: #009900;">&#40;</span>selectControl.<span style="color: #660066;">CLASS_NAME</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;OpenLayers.Control.SelectFeature&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;selectFeatureControl added successfully&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    <span style="color: #009900;">&#125;</span></pre></div></div>

<p>B. For the server side, particularly ColdFusion, I have been using <a href="http://mxunit.org/doc/index.cfm">mxunit.org</a> upon following <a href="http://corfield.org/blog/index.cfm/do/blog.entry/entry/MXUnit">Sean Corfield&#8217;s blog post regarding ColdFusion Unit Testing.</a></p>
<p>1. Download from <a href="mxunit.org">mxunit.org</a></p>
<p>2. Extract to your webroot</p>
<p>3. Write your testcase as a cfc.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> metaName <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;gao li wu&quot;</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> search <span style="color: #339933;">=</span> createObject<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;component&quot;</span><span style="color: #339933;">,</span><span style="color: #3366CC;">&quot;platform.svc.search.GeoSearch&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
search.<span style="color: #660066;">setDSN</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'beijing_app'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
search.<span style="color: #660066;">setMetaName</span><span style="color: #009900;">&#40;</span>metaName<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
actual <span style="color: #339933;">=</span> search.<span style="color: #660066;">getMetaName</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
assertEquals<span style="color: #009900;">&#40;</span>actual<span style="color: #339933;">,</span>metaName<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p>Notes:<br />
1. You can <strong>show the cfdump on the test case iff the test-case passed</strong>. If your test-case <em>fails</em>, then you need to <strong>comment</strong> the assertion first so you could see the cfdump. Inserting cfdump (commented or not) is a convenient way to debug your CFM.</p>
<p>2. You can chain test cases by calling the related functions. This is very useful when you are doing a short-circuit test.</p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/03/test-driven-development-using-testanotherway-and-mxunit/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Aptana Impressions</title>
		<link>/wordpress/2008/03/aptana-impressions/</link>
		<comments>/wordpress/2008/03/aptana-impressions/#comments</comments>
		<pubDate>Sat, 15 Mar 2008 17:25:01 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[ExtJS]]></category>
		<category><![CDATA[aptana]]></category>
		<category><![CDATA[eclipse]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://www.gisnotes.com/wordpress/index.php/2008/03/16/aptana-impressions/</guid>
		<description><![CDATA[I recently downloaded Aptana Studio 1.1 Community Edition and have been using it mostly for my Javascript/ColdFusion development. Intellisense for ExtJS by using com.extjs.ext.2.0_1.0.0.00000.jar from the ExtJS blog. Umm, I am hoping someday OpenLayers can provide a similar jar file to provide code assist. I like the fact that it could clearly display an outline]]></description>
			<content:encoded><![CDATA[<p>I recently downloaded Aptana Studio 1.1 Community Edition and have been using it mostly for my Javascript/ColdFusion development.</p>
<ul>
<li>Intellisense for ExtJS by using <a href="http://orsox.mocis.at/download.php?view.1">com.extjs.ext.2.0_1.0.0.00000.jar</a> from the <a href="http://extjs.com/blog/2008/02/01/ides-plugins-and-tools-for-ext-js-20/">ExtJS blog.</a> Umm, I am hoping someday OpenLayers can provide a similar jar file to <a href="http://www.aptana.com/docs/index.php/Displaying_Code_Assist">provide code assist.</a></li>
<li>I like the fact that it could clearly display an outline of my javascript objects but <em>sometimes</em> not for all.</li>
</ul>
<p>But one of the major problems I encountered was the startup. Sometimes, for some unknown reason, Aptana cannot start using the executable it provided during the install. However, I was able to weed that problem out by instead launching it from startup.jar. All of these is documented from <a href="http://support.aptana.com/asap/browse/STU-1303">Aptana&#8217;s JIRA ticket</a>.</p>
<p>1. Downloaded and install <a href="http://www.aptana.com/">Aptana</a></p>
<p>2. Watched <a href="http://www.aptana.tv/movies/aptana_overview/Overview.html">Aptana TV Overview</a></p>
<p>3. Installed cfeclipse <a href="http://www.cfeclipse.org/update">http://www.cfeclipse.org/update</a></p>
<p>4. Installed viPlugin <a href="http://satokar.com/">http://satokar.com/</a> (Note that the viPlugin would not work with files = *.html)</p>
<p>5. Added the extjs2.0 code assist</p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/03/aptana-impressions/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Making GeoJSON outputs from PostGIS</title>
		<link>/wordpress/2008/02/making-geojson-outputs-from-postgis/</link>
		<comments>/wordpress/2008/02/making-geojson-outputs-from-postgis/#comments</comments>
		<pubDate>Sat, 23 Feb 2008 02:08:17 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[GeoJSON]]></category>
		<category><![CDATA[coldfusion]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[postgis]]></category>

		<guid isPermaLink="false">/wordpress/index.php/2008/02/23/making-geojson-outputs-from-postgis/</guid>
		<description><![CDATA[I have an internet/web application sitting on top of OpenLayers, ExtJS, ColdFusion and PostGreSQL/PostGIS. I can query the geometry from PostGIS thru ColdFusion without any problems. If you are in ColdFusion 7, then you need a postgresql driver installed, but I do suggest you use ColdFusion 8 as the driver is built-in. To display the]]></description>
			<content:encoded><![CDATA[<p>I have an internet/web application sitting on top of OpenLayers, ExtJS, ColdFusion and PostGreSQL/PostGIS. I can query the geometry from PostGIS thru ColdFusion without any problems. If you are in ColdFusion 7, then you need a postgresql driver installed, but I do suggest you use ColdFusion 8 as the driver is built-in.</p>
<p>To display the geometry, I typically use AsGML output from PostGIS and supply that path to OpenLayers. Although it works as expected, I need to invest in two (2) http calls to the server:</p>
<ul>
<li>1st Request: Call search.cfm and get the attributes (name, address, tel_no, etc&#8230;). Afterwards, display the results on an Ext.Window.</li>
<li>2nd Request: Display the geometries on OpenLayers using GML.</li>
</ul>
<p><span id="more-145"></span>We have decided in our organisation not to write out the javascript statements on AJAX calls but instead retrieve them as Data Objects (either XML or GeoJSON). Putting in javascript statements on AJAX calls seems harder to debug. GeoJSON is highly preferred for internet mapping applications since it has a unique ability to see the javascript objects quickly on the browser, making debugging easier.</p>
<p>I wrote a simple cfc below to be able to parse the geometry from PostGIS using AsText(geometry).  The function accepts a geometry as string and returns a structure containing the type and the coordinates.</p>

<div class="wp_syntax"><div class="code"><pre class="cfm" style="font-family:monospace;"><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfcomponent</span> displayname<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;GeoJSON&quot;</span> <span style="color: #0000FF;">hint</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;I am a GeoJSON Component. I parse a geometry and return it as JSON&quot;</span> output<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;false&quot;</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
	<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cffunction</span> <span style="color: #0000FF;">name</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;init&quot;</span> <span style="color: #0000FF;">access</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;public&quot;</span> output<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;false&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfreturn</span><span style="color: #0000FF;">&gt;</span></span>
	<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfreturn</span><span style="color: #0000FF;">&gt;</span></span>	
&nbsp;
	<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cffunction</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cffunction</span> <span style="color: #0000FF;">name</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;format&quot;</span> returntype<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Struct&quot;</span> output<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;false&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfargument</span> <span style="color: #0000FF;">name</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;geomtext&quot;</span> <span style="color: #0000FF;">type</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;String&quot;</span> <span style="color: #0000FF;">required</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;true&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;StructNew()&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.<span style="color: #0000FF;">type</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Mid(arguments.geomtext,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geomreplacedbrackets<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Replace(arguments.geomtext,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geomreplacedbrackets<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Replace(geomReplacedBrackets,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfloop</span> <span style="color: #0000FF;">from</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;1&quot;</span> <span style="color: #0000FF;">to</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;#Len(geomReplacedBrackets)#&quot;</span> <span style="color: #0000FF;">index</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;i&quot;</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> curchar<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Mid(geomReplacedBrackets,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span>
				<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;geometry.coordinates&quot;</span><span style="color: #0000FF;">&gt;</span></span>
	    		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> secchar<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Mid(geomReplacedBrackets,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
				<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span> <span style="color: #808080; font-style: italic;">&lt;!--- Get the next character from the current position and see if its numeric ---&gt;</span>
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> posi<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;i&quot;</span><span style="color: #0000FF;">&gt;</span></span> <span style="color: #808080; font-style: italic;">&lt;!--- Get the position of &quot;[&quot;---&gt;</span>
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> posj<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;find(']',&quot;</span><span style="color: #0000FF;">&gt;</span></span>
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> tempgeom<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Mid(geomReplacedBrackets,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> i<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;posJ&quot;</span><span style="color: #0000FF;">&gt;</span></span> <span style="color: #808080; font-style: italic;">&lt;!--- reinitialize i ---&gt;</span>
&nbsp;
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfloop</span> <span style="color: #0000FF;">list</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;#tempGeom#&quot;</span> <span style="color: #0000FF;">index</span><span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;tempGeomIndex&quot;</span> delimiters<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
						<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> tempvalue<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;[&quot;</span><span style="color: #0000FF;">&gt;</span></span>
						<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geomreplaced<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;ListAppend(geomReplaced,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfloop</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
					<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;geometry.coordinates&quot;</span><span style="color: #0000FF;">&gt;</span></span>
				<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfloop</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfelseif</span><span style="color: #0000FF;">&gt;</span></span>
				<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;geometry.coordinates&quot;</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfelseif</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Replace(geometry.coordinates,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Replace(geometry.coordinates,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
			<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfset</span> geometry.coordinates<span style="color: #0000FF;">=</span><span style="color: #009900;">&quot;Replace(geometry.coordinates,&quot;</span><span style="color: #0000FF;">&gt;</span></span>
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
		<span style="color: #333333;"><span style="color: #0000FF;">&lt;</span><span style="color: #990000; font-weight: bold;">cfreturn</span><span style="color: #0000FF;">&gt;</span></span>
	<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfreturn</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfif</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfset</span><span style="color: #0000FF;">&gt;</span></span>
&nbsp;
<span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfargument</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cffunction</span><span style="color: #0000FF;">&gt;</span></span><span style="color: #333333;"><span style="color: #0000FF;">&lt;/</span><span style="color: #990000; font-weight: bold;">cfcomponent</span><span style="color: #0000FF;">&gt;</span></span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/02/making-geojson-outputs-from-postgis/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ExtJS and OpenLayers</title>
		<link>/wordpress/2008/02/extjs-and-openlayers/</link>
		<comments>/wordpress/2008/02/extjs-and-openlayers/#comments</comments>
		<pubDate>Tue, 19 Feb 2008 00:45:18 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[ExtJS]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[openlayers]]></category>

		<guid isPermaLink="false">/wordpress/index.php/2008/02/19/extjs-and-openlayers/</guid>
		<description><![CDATA[It seems that ExtJS and OpenLayers does not blend well together. One of the bug biters that hit me was the way ExtJS was handling arrays. It would be wise for OpenLayers to be agnostic of these frameworks. for&#40; var i in blocks &#41; should be transformed to for&#40; var i = 0; i &#38;lt;]]></description>
			<content:encoded><![CDATA[<p>It seems that ExtJS and OpenLayers does not blend well together. One of the bug biters that hit me was the way ExtJS was handling arrays.  It would be wise for OpenLayers to be agnostic of these frameworks.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #000066; font-weight: bold;">for</span><span style="color: #009900;">&#40;</span> <span style="color: #003366; font-weight: bold;">var</span> i <span style="color: #000066; font-weight: bold;">in</span> blocks <span style="color: #009900;">&#41;</span> should be transformed to <span style="color: #000066; font-weight: bold;">for</span><span style="color: #009900;">&#40;</span> <span style="color: #003366; font-weight: bold;">var</span> i <span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span> i <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> blocks.<span style="color: #660066;">length</span><span style="color: #339933;">;</span> i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span></pre></div></div>

<p>I believe <a href="http://trac.openlayers.org/ticket/1362">OpenLayers Ticket#1362</a> closely resembles this bug.  Thanks to pgiraud for pointing me to the right direction.</p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/02/extjs-and-openlayers/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ExtJS QuickTip: Display other levels of a JSON object in a Grid</title>
		<link>/wordpress/2008/02/extjs-quicktip-display-other-levels-of-a-json-object-in-a-grid/</link>
		<comments>/wordpress/2008/02/extjs-quicktip-display-other-levels-of-a-json-object-in-a-grid/#comments</comments>
		<pubDate>Mon, 18 Feb 2008 15:08:39 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[ExtJS]]></category>
		<category><![CDATA[GeoJSON]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">/wordpress/index.php/2008/02/18/extjs-quicktip-display-other-levels-of-a-json-object-in-a-grid/</guid>
		<description><![CDATA[You can display an item anywhere in a JSON heirarchy/level in a Grid by using dot notation. I am beginning to like JSON as it is simply practical and amazing. To fully understand, please see geometry.type as an example. &#123; &#34;type&#34;: &#34;FeatureCollection&#34;, &#34;recordcount&#34;:6, &#34;features&#34;: &#91; &#123; &#34;type&#34;:&#34;Feature&#34;, &#34;geometry&#34;:&#123; &#34;type&#34;: &#34;MULTIPOLYGON&#34;, &#34;coordinates&#34;: &#91;&#91;&#91;&#91;116.368603,39.944314&#93;,&#91;116.381069,39.94464&#93;,&#91;116.388765,39.940265&#93;,&#91;116.390376,39.939124&#93;,&#91;116.391203,39.934381&#93;,&#91;116.391784,39.930743&#93;,&#91;116.387262,39.930638&#93;,&#91;116.387507,39.93289&#93;,&#91;116.383032,39.932688&#93;,&#91;116.382581,39.933204&#93;,&#91;116.37197,39.940531&#93;,&#91;116.368603,39.944314&#93;&#93;&#93;&#93; &#125;, &#34;gid&#34;:16055, &#34;cn_name&#34;:&#34;后海&#34;,]]></description>
			<content:encoded><![CDATA[<p>You can display an item anywhere in a JSON heirarchy/level in a Grid by using <strong>dot notation</strong>. I am beginning to like JSON as it is simply practical and amazing. To fully understand, please see <em>geometry.type</em> as an example.<span id="more-146"></span></p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #009900;">&#123;</span> <span style="color: #3366CC;">&quot;type&quot;</span><span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;FeatureCollection&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;recordcount&quot;</span><span style="color: #339933;">:</span><span style="color: #CC0000;">6</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;features&quot;</span><span style="color: #339933;">:</span> <span style="color: #009900;">&#91;</span> <span style="color: #009900;">&#123;</span> <span style="color: #3366CC;">&quot;type&quot;</span><span style="color: #339933;">:</span><span style="color: #3366CC;">&quot;Feature&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;geometry&quot;</span><span style="color: #339933;">:</span><span style="color: #009900;">&#123;</span> <span style="color: #3366CC;">&quot;type&quot;</span><span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;MULTIPOLYGON&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;coordinates&quot;</span><span style="color: #339933;">:</span> <span style="color: #009900;">&#91;</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.368603</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.944314</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.381069</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.94464</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.388765</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.940265</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.390376</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.939124</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.391203</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.934381</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.391784</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.930743</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.387262</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.930638</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.387507</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.93289</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.383032</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.932688</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.382581</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.933204</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.37197</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.940531</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">116.368603</span><span style="color: #339933;">,</span><span style="color: #CC0000;">39.944314</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#93;</span> <span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;gid&quot;</span><span style="color: #339933;">:</span><span style="color: #CC0000;">16055</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;cn_name&quot;</span><span style="color: #339933;">:</span><span style="color: #3366CC;">&quot;后海&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;py_name&quot;</span><span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;hou hai&quot;</span> <span style="color: #009900;">&#125;</span> <span style="color: #339933;">,</span> <span style="color: #009900;">&#123;</span> <span style="color: #3366CC;">&quot;type&quot;</span><span style="color: #339933;">:</span><span style="color: #3366CC;">&quot;Feature&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;geometry&quot;</span><span style="color: #339933;">:</span><span style="color: #009900;">&#123;</span> <span style="color: #3366CC;">&quot;type&quot;</span><span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;MULTIPOLYGON&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;coordinates&quot;</span><span style="color: #339933;">:</span> ....<span style="color: #009900;">&#125;</span></pre></div></div>

<p>Here is the DataStore&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">cs.<span style="color: #660066;">GridPlace</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
    <span style="color: #003366; font-weight: bold;">var</span> _placeDataStore <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> Ext.<span style="color: #660066;">data</span>.<span style="color: #660066;">Store</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>
        <span style="color: #006600; font-style: italic;">// create reader that reads the Topic records</span>
        reader<span style="color: #339933;">:</span> <span style="color: #003366; font-weight: bold;">new</span> Ext.<span style="color: #660066;">data</span>.<span style="color: #660066;">JsonReader</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>
            root<span style="color: #339933;">:</span> <span style="color: #3366CC;">'features'</span><span style="color: #339933;">,</span>
            totalProperty<span style="color: #339933;">:</span> <span style="color: #3366CC;">'recordcount'</span><span style="color: #339933;">,</span>
            id<span style="color: #339933;">:</span> <span style="color: #3366CC;">'gid'</span><span style="color: #339933;">,</span>
            fields<span style="color: #339933;">:</span> <span style="color: #009900;">&#91;</span>
                <span style="color: #3366CC;">'cn_name'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'py_name'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'geometry.type'</span>
            <span style="color: #009900;">&#93;</span>
        <span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span>
    <span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
    <span style="color: #006600; font-style: italic;">// the column model has information about grid columns</span>
    <span style="color: #006600; font-style: italic;">// dataIndex maps the column to the specific data field in</span>
    <span style="color: #006600; font-style: italic;">// the data store</span>
    <span style="color: #003366; font-weight: bold;">var</span> cm <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> Ext.<span style="color: #660066;">grid</span>.<span style="color: #660066;">ColumnModel</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#123;</span>
           id<span style="color: #339933;">:</span> <span style="color: #3366CC;">'gid'</span><span style="color: #339933;">,</span> <span style="color: #006600; font-style: italic;">// id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })</span>
           header<span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;CN_NAME&quot;</span><span style="color: #339933;">,</span>
           width<span style="color: #339933;">:</span> <span style="color: #CC0000;">100</span><span style="color: #339933;">,</span>
           dataIndex<span style="color: #339933;">:</span> <span style="color: #3366CC;">'cn_name'</span>
        <span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#123;</span>
           id<span style="color: #339933;">:</span> <span style="color: #3366CC;">'gid'</span><span style="color: #339933;">,</span> <span style="color: #006600; font-style: italic;">// id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })</span>
           header<span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;PY_NAME&quot;</span><span style="color: #339933;">,</span>
           width<span style="color: #339933;">:</span> <span style="color: #CC0000;">100</span><span style="color: #339933;">,</span>
           dataIndex<span style="color: #339933;">:</span> <span style="color: #3366CC;">'py_name'</span>
        <span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span><span style="color: #009900;">&#123;</span>
           id<span style="color: #339933;">:</span> <span style="color: #3366CC;">'gid'</span><span style="color: #339933;">,</span> <span style="color: #006600; font-style: italic;">// id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })</span>
           header<span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;GEOMTYPE&quot;</span><span style="color: #339933;">,</span>
           width<span style="color: #339933;">:</span> <span style="color: #CC0000;">100</span><span style="color: #339933;">,</span>
           dataIndex<span style="color: #339933;">:</span> <span style="color: #3366CC;">'geometry.type'</span>
        <span style="color: #009900;">&#125;</span>
    <span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/02/extjs-quicktip-display-other-levels-of-a-json-object-in-a-grid/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ExtJS Notes</title>
		<link>/wordpress/2008/01/extjs-notes/</link>
		<comments>/wordpress/2008/01/extjs-notes/#comments</comments>
		<pubDate>Fri, 04 Jan 2008 16:19:03 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[ExtJS]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">/wordpress/?p=134</guid>
		<description><![CDATA[1. How to test Ext from the extjs/docs? Ext.get(document.body).update(' &#8216;) 2. Node cannot be inserted at the specified point in the hierarchy code: 3 Answer: Possible invalid nesting of id elements within a panel or div. Check if id is the same with contentEl in a panel. For example: //in my javascript Layout.js &#123; id:]]></description>
			<content:encoded><![CDATA[<p><strong>1. How to test Ext from the extjs/docs?</strong><br />
<code>Ext.get(document.body).update(' </code></p>
<p>&#8216;)</p>
<p><strong>2. Node cannot be inserted at the specified point in the hierarchy  code: 3</strong><br />
<strong>Answer:</strong> Possible invalid nesting of id elements within a panel or div. Check if id is the same with contentEl in a panel. For example:</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//in my javascript Layout.js</span>
<span style="color: #009900;">&#123;</span>
    id<span style="color: #339933;">:</span> <span style="color: #3366CC;">'pnlPOIList'</span><span style="color: #339933;">,</span> <span style="color: #006600; font-style: italic;">//should be renamed to foo-pnlPOIList just to distinguish it from pnlPOIList</span>
    region<span style="color: #339933;">:</span> <span style="color: #3366CC;">'west'</span><span style="color: #339933;">,</span>
    contentEl<span style="color: #339933;">:</span> <span style="color: #3366CC;">'pnlPOIList'</span><span style="color: #339933;">,</span>
    title<span style="color: #339933;">:</span> <span style="color: #3366CC;">'POIList'</span><span style="color: #339933;">,</span>
    width<span style="color: #339933;">:</span> <span style="color: #CC0000;">300</span><span style="color: #339933;">,</span>
    collapsible<span style="color: #339933;">:</span><span style="color: #003366; font-weight: bold;">true</span><span style="color: #339933;">,</span>
    floatable<span style="color: #339933;">:</span><span style="color: #003366; font-weight: bold;">false</span><span style="color: #339933;">,</span>
    autoScroll<span style="color: #339933;">:</span> <span style="color: #003366; font-weight: bold;">true</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//in my index.html</span>
<span style="color: #339933;">&lt;</span>p id<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;east&quot;</span><span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;/</span>p<span style="color: #339933;">&gt;&lt;</span>p id<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;pnlMoreInformation&quot;</span><span style="color: #339933;">&gt;&lt;</span>cfinclude template<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;pnlMoreInformation.cfm&quot;</span><span style="color: #339933;">&gt;&lt;/</span>cfinclude<span style="color: #339933;">&gt;&lt;/</span>p<span style="color: #339933;">&gt;</span></pre></div></div>

<p><strong>3. A has no properties</strong><br />
<em><code>Ext.Container=Ext.extend(Ext.BoxComponent,{autoDestroy:true,defaultType:"panel",...</code></em><br />
<strong>Answer:</strong>Check the object inside the definition of an Ext Component. It may be a different object.</p>
<p><strong>4. How to debug ext app on IE?</strong><br />
<strong>Answer:</strong> This should be a javascript post instead of Ext but I&#8217;m posting it anyway. When troubleshooting javascript in IE, be careful with <em>open-ended definition with commas</em>. Firefox might be forgiving but not IE.  Meaning&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">	<span style="color: #003366; font-weight: bold;">var</span> config <span style="color: #339933;">=</span> <span style="color: #009900;">&#123;</span>
			id<span style="color: #339933;">:</span> taskbarButtonID<span style="color: #339933;">,</span>
			text<span style="color: #339933;">:</span> taskbarText<span style="color: #339933;">,</span>
			iconCls<span style="color: #339933;">:</span> iconstyle<span style="color: #339933;">,</span>
			handler<span style="color: #339933;">:</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
				<span style="color: #003366; font-weight: bold;">var</span> mywindow <span style="color: #339933;">=</span> Ext.<span style="color: #660066;">getCmp</span><span style="color: #009900;">&#40;</span>windowID<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
				mywindow.<span style="color: #660066;">setVisible</span><span style="color: #009900;">&#40;</span> <span style="color: #339933;">!</span>mywindow.<span style="color: #660066;">isVisible</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span>
		<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span></pre></div></div>

<p><strong><a href="http://www.spket.com/demos/js.html">5. Javascript Plugin for Eclipse</a></strong>. For more information, please visit <a href="http://extjs.com/blog/2008/02/01/ides-plugins-and-tools-for-ext-js-20/">ExtJS Blog: IDEs, plugins and tools for Ext JS 2.0 </a></p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2008/01/extjs-notes/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>GIS 2.0</title>
		<link>/wordpress/2007/12/gis-20/</link>
		<comments>/wordpress/2007/12/gis-20/#comments</comments>
		<pubDate>Fri, 21 Dec 2007 02:48:10 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[GIS]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[mapserver]]></category>
		<category><![CDATA[openlayers]]></category>
		<category><![CDATA[postgis]]></category>
		<category><![CDATA[postgres]]></category>

		<guid isPermaLink="false">/wordpress/?p=127</guid>
		<description><![CDATA[It&#8217;s been a long time since my previous blog post because I was caught up with numerous meetings and presentations with the recent development of &#8220;The Interface&#8220;. Developing the new beast during a 2.5 week code sprint is both enjoyable and a personal satisfaction. I have to give credit to Yahoo UI and ExtJS for]]></description>
			<content:encoded><![CDATA[<p>It&#8217;s been a long time since my previous blog post because  I was caught up with numerous meetings and presentations with the recent development of <strong>&#8220;<em>The Interface</em>&#8220;</strong>.  Developing the new beast during a 2.5 week code sprint is both enjoyable and a personal satisfaction. I have to give credit to <a href="http://developer.yahoo.com/yui/">Yahoo UI</a> and <a href="http://www.extjs.com">ExtJS</a> for a wonderful javascript library that they opened to the public.  Without ExtJS, I don&#8217;t think it would be possible to create such an interactive, compelling and impressive interface for my demos.</p>
<p>Web 2.0 has given me a chance to wrap our traditional GIS processes/solutions into a high impact presentation for our marketing/business developments. Thus, it was not a suprise to see that <a href="http://trac.mapfish.org/">CamptoCamp&#8217;s Mapfish</a> is also using extjs. It has aided me very well in data analysis and visualisation.  It may just be a meaningless term to others, however I believe we just entered the start of GIS 2.0&#8230;</p>
<p>Reflecting&#8230; I believe it is worth investing in learning PostGIS in-depth.  Though it may appear fascinating to others that a group of small applications (which I called the core platform utilising <em>Nearest Neighbor Searching</em> and <em>Geometric Unions</em>) bundled together in a Web2.0 interface is impressive, I believe I only scratched the surface of <em>what</em> and <em>how</em> PostGIS should be used. I wanted to do more, but my busy work schedule begs to finish other components of our product.</p>
<p>To be continued&#8230;</p>
<p><a href="http://www.gisnotes.com/wordpress/wp-content/uploads/2007/12/interface-small.png" title="The Interface"><img src="http://www.gisnotes.com/wordpress/wp-content/uploads/2007/12/interface-small.png" alt="The Interface" /></a></p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2007/12/gis-20/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>JSEclipse</title>
		<link>/wordpress/2007/11/jseclipse/</link>
		<comments>/wordpress/2007/11/jseclipse/#comments</comments>
		<pubDate>Tue, 06 Nov 2007 13:38:16 +0000</pubDate>
		<dc:creator>rupert</dc:creator>
				<category><![CDATA[eclipse]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">/wordpress/?p=117</guid>
		<description><![CDATA[I have an ongoing project which utilises Yahoo UI&#8217;s Javascript Libraries. There are also plans of even extending the application to use ExtJS for a more powerful window/container/layout lib. In regards to these Javascript pursuits, I need a Javascript editor for Eclipse besides my almighty vim. JSEclipse from Adobe Labs JSEclipse Installation Eclipse Update Site:]]></description>
			<content:encoded><![CDATA[<p>I have an ongoing project which utilises <a href="http://developer.yahoo.com/yui">Yahoo UI&#8217;s Javascript Libraries</a>. There are also plans of even extending the application to use <a href="http://www.extjs.com/">ExtJS</a> for a more powerful window/container/layout lib. In regards to these Javascript pursuits, I need a <em>Javascript</em> editor for Eclipse besides my almighty <em>vim</em>.</p>
<p><a href="http://www.gisnotes.com/wordpress/wp-content/uploads/2007/11/jseclipse.png" title="jseclipse.png"><img src="http://www.gisnotes.com/wordpress/wp-content/uploads/2007/11/jseclipse.png" alt="jseclipse.png" /></a></p>
<p><a href="http://labs.adobe.com/technologies/jseclipse/">JSEclipse from Adobe Labs</a></p>
<p><a href="http://www.interaktonline.com/Documentation/JSEclipse/jseclipse.htm#2000_installing.htm">JSEclipse Installation</a></p>
<p>Eclipse Update Site:<br />
Help -&gt; Software Updates -&gt; Find and Install -&gt; New</p>
<p>http://download.macromedia.com/pub/labs/jseclipse/autoinstall</p>
]]></content:encoded>
			<wfw:commentRss>/wordpress/2007/11/jseclipse/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
