[Commits] r2277 - in sandbox/cmoullet/ux: . PermalinkSelectorCombo PermalinkSelectorCombo/examples PermalinkSelectorCombo/lib PermalinkSelectorCombo/lib/GeoExt.ux
commits at geoext.org
commits at geoext.org
Sat Aug 21 14:56:12 CEST 2010
Author: cmoullet
Date: 2010-08-21 14:56:12 +0200 (Sat, 21 Aug 2010)
New Revision: 2277
Added:
sandbox/cmoullet/ux/PermalinkSelectorCombo/
sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/
sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.html
sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.js
sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/
sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/GeoExt.ux/
sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/GeoExt.ux/PermalinkSelectorCombo.js
Log:
Add a new GeoExt UX: permalink selector
Added: sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.html
===================================================================
--- sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.html (rev 0)
+++ sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.html 2010-08-21 12:56:12 UTC (rev 2277)
@@ -0,0 +1,21 @@
+<html>
+ <head>
+ <title>Permalink Selector Combo Example</title>
+
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.0/resources/css/ext-all.css" />
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.0/examples/shared/examples.css" />
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/ext-all-debug.js"></script>
+ <script type="text/javascript" src="http://www.openlayers.org/api/2.9/OpenLayers.js"></script>
+ <script type="text/javascript" src="../../../trunk/geoext/lib/GeoExt.js"></script>
+ <script type="text/javascript" src="../lib/GeoExt.ux/PermalinkSelectorCombo.js"></script>
+ <script type="text/javascript" src="PermalinkSelectorComboExample.js"></script>
+
+ </head>
+ <body>
+ <h1>Permalink Selector Combo</h1>
+ <p>This example demonstrates the permalink selector combo.<p>
+ <p>The js is not minified so it is readable. See <a href="PermalinkSelectorComboExample.js">PermalinkSelectorComboExample.js</a>.</p>
+ <div id="mappanel"></div>
+ </body>
+</html>
Added: sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.js
===================================================================
--- sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.js (rev 0)
+++ sandbox/cmoullet/ux/PermalinkSelectorCombo/examples/PermalinkSelectorComboExample.js 2010-08-21 12:56:12 UTC (rev 2277)
@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[PermalinkSelectorCombo]
+ * Permalink Selector Combo
+ * ------------------------
+ * Combo to store permalink
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+ var map = new OpenLayers.Map();
+ var layer = new OpenLayers.Layer.OSM("OSM");
+ map.addLayer(layer);
+
+ var permalinkSelectorCombo = new GeoExt.ux.PermalinkSelectorCombo({
+ map: map,
+ store: GeoExt.ux.PermalinkSelectorCombo.permalinkStore,
+ getPermalink: function() {
+ return "easting=" + this.map.center.lon + "&northing=" + this.map.center.lat;
+ }
+ });
+
+ mapPanel = new GeoExt.MapPanel({
+ title: "GeoExt MapPanel with a permalink selector combo",
+ renderTo: "mappanel",
+ height: 400,
+ width: 600,
+ map: map,
+ tbar: [permalinkSelectorCombo]
+ });
+});
Added: sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/GeoExt.ux/PermalinkSelectorCombo.js
===================================================================
--- sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/GeoExt.ux/PermalinkSelectorCombo.js (rev 0)
+++ sandbox/cmoullet/ux/PermalinkSelectorCombo/lib/GeoExt.ux/PermalinkSelectorCombo.js 2010-08-21 12:56:12 UTC (rev 2277)
@@ -0,0 +1,113 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ * module = GeoExt.ux
+ * class = PermalinkSelectorCombo
+ * base_link = `Ext.form.ComboBox <http://extjs.com/deploy/dev/docs/?class=Ext.form.ComboBox>`_
+ */
+
+Ext.namespace("GeoExt.ux");
+
+GeoExt.ux.PermalinkSelectorCombo = Ext.extend(Ext.form.ComboBox, {
+ /** api: config[map]
+ * ``OpenLayers.Map or Object`` A configured map or a configuration object
+ * for the map constructor, required only if :attr:`zoom` is set to
+ * value greater than or equal to 0.
+ */
+ /** private: property[map]
+ * ``OpenLayers.Map`` The map object.
+ */
+ map: null,
+
+ /** api: config[store]
+ * ``Ext.data.Store``: Store containing the data.
+ */
+ store: null,
+
+ /** api: config[displayField]
+ * ``String`` Display field of the combo. Default: text
+ */
+ displayField:'topic',
+
+ /** private: property[mode]
+ * ``String`` mode. Default: local
+ */
+ mode: 'local',
+
+ /** private: property[triggerAction]
+ * ``String`` triggerAction. Default: all
+ */
+ triggerAction: 'all',
+
+ /** private: property[typeAhead]
+ * ``Boolean`` typeAhead. Default: true
+ */
+ typeAhead: true,
+
+ /** private: property[minChars]
+ * ``Number`` Minimal number of characters
+ */
+ minChars: 1,
+
+ /** api: config[width]
+ * See http://www.extjs.com/deploy/dev/docs/source/BoxComponent.html#cfg-Ext.BoxComponent-width,
+ * default value is 350.
+ */
+ width: 350,
+
+ /** api: config[listWidth]
+ * See http://www.extjs.com/deploy/dev/docs/source/Combo.html#cfg-Ext.form.ComboBox-listWidth,
+ * default value is 350.
+ */
+ listWidth: 350,
+
+ /** api: config[emptyText]
+ * See http://www.extjs.com/deploy/dev/docs/source/TextField.html#cfg-Ext.form.TextField-emptyText,
+ * default value is "Select a permalink".
+ */
+ emptyText: 'Select a permalink',
+
+ /** api: config[tpl]
+ * ``Ext.XTemplate or String`` Template for presenting the result in the
+ * list (see http://www.extjs.com/deploy/dev/docs/output/Ext.XTemplate.html),
+ * if not set a default value is provided.
+ */
+ tpl: '<tpl for="."><div class="x-combo-list-item"><img src="{image}" align="left"><h1>{topic}</h1></div></tpl>',
+
+ /** private: constructor
+ */
+ initComponent: function() {
+ GeoExt.ux.PermalinkSelectorCombo.superclass.initComponent.apply(this, arguments);
+ if (!this.store) {
+ this.store = GeoExt.ux.PermalinkSelectorCombo.permalinkStore;
+ }
+ this.on("select", function(combo, record, index) {
+ var partialPermalink = record.get('partialPermalink');
+ var url = window.location.toString();
+ var query_string = url.split("?");
+ window.open(query_string[0] + "?" + this.getPermalink() + "&" + partialPermalink);
+ }, this);
+ },
+
+ getPermalink: function() {
+ return '';
+ }
+});
+
+GeoExt.ux.PermalinkSelectorCombo.permalinkStore = new Ext.data.SimpleStore({
+ fields: ['topic', 'partialPermalink', 'image'],
+ data : [
+ ['Test1', 'myValue=test&myValue1=test1','http://bellithon.medicalistes.org/IMG/png/jaune.png'],
+ ['Test2', 'myValue=test2','http://bellithon.medicalistes.org/IMG/png/rouge.png']
+ ]
+});
+
+
+/** api: xtype = gxux_permalinkselectorcombo */
+Ext.reg('gxux_permalinkselectorcombo', GeoExt.ux.PermalinkSelectorCombo);
More information about the Commits
mailing list