[Commits] r2494 - in sandbox/cmoullet/ux/Mobile: . app

commits at geoext.org commits at geoext.org
Sat Nov 27 21:16:05 CET 2010


Author: cmoullet
Date: 2010-11-27 21:16:05 +0100 (Sat, 27 Nov 2010)
New Revision: 2494

Added:
   sandbox/cmoullet/ux/Mobile/app/
   sandbox/cmoullet/ux/Mobile/app/index.html
   sandbox/cmoullet/ux/Mobile/app/init.js
Log:
First map app prototype

Added: sandbox/cmoullet/ux/Mobile/app/index.html
===================================================================
--- sandbox/cmoullet/ux/Mobile/app/index.html	                        (rev 0)
+++ sandbox/cmoullet/ux/Mobile/app/index.html	2010-11-27 20:16:05 UTC (rev 2494)
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <title>Mobile Map Prototype</title>
+    <link rel="stylesheet" href="../sencha-touch/resources/css/sencha-touch.css" type="text/css">
+    <script type="text/javascript" src="../sencha-touch/sencha-touch.js"></script>
+    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
+    <script type="text/javascript" src="init.js"></script>
+</head>
+<body></body>
+</html>
\ No newline at end of file

Added: sandbox/cmoullet/ux/Mobile/app/init.js
===================================================================
--- sandbox/cmoullet/ux/Mobile/app/init.js	                        (rev 0)
+++ sandbox/cmoullet/ux/Mobile/app/init.js	2010-11-27 20:16:05 UTC (rev 2494)
@@ -0,0 +1,131 @@
+Ext.setup({
+    icon: 'icon.png',
+    tabletStartupScreen: 'tablet_startup.png',
+    phoneStartupScreen: 'phone_startup.png',
+    glossOnIcon: false,
+    onReady: function() {
+        var popup;
+        var searchField = Ext.create({
+            xtype : 'searchfield',
+            name  : 'swisssearch',
+            placeHolder: 'Search...',
+            listeners : {
+                keyup: function(field, e) {
+                    var key = e.browserEvent.keyCode;
+                    if (key === 13) {
+                        field.blur();
+                        Ext.util.JSONP.request({
+                            url: 'http://api.geo.admin.ch/swisssearch?lang=fr&query=lausanne&cb=Ext.util.JSONP.callback',
+                            callbackKey: 'cb',
+                            params: {
+                                lang: 'de',
+                                query: field.fieldEl.dom.value,
+                                cb: 'Ext.util.JSONP.callback'
+                            },
+                            callback: function(result) {
+                                Ext.regModel('swisssearch', {
+                                    fields: [
+                                        {
+                                            name: 'label',
+                                            type: 'string'
+                                        }
+                                    ]
+                                });
+                                if (result.results[0]) {
+                                    var store = new Ext.data.Store({
+                                        model: 'swisssearch',
+                                        data: result.results
+                                    });
+
+                                    var list = new Ext.List({
+                                        itemTpl : '{label}',
+                                        store: store,
+                                        listeners: {
+                                            selectionchange: function(selectionModel, records) {
+                                                alert('Not implemented: map recenter to: ' + records[0].data.bbox);
+                                                popup.hide();
+                                            }
+                                        }
+                                    });
+
+                                    if (popup) {
+                                        delete this.popup;
+                                    }
+                                    popup = new Ext.Panel({
+                                        floating: true,
+                                        modal: true,
+                                        centered: true,
+                                        width: 300,
+                                        height: 400,
+                                        scroll: 'vertical',
+                                        dockedItems: [
+                                            {
+                                                dock : 'top',
+                                                xtype: 'toolbar',
+                                                title: 'Search results'
+                                            }
+                                        ],
+                                        items: [
+                                            list
+                                        ]});
+                                    popup.show();
+                                }
+                            }
+                        });
+                    }
+                },
+                scope : this
+            }
+        });
+
+        var trackingButton = Ext.create({
+            xtype   : 'button',
+            iconMask: true,
+            iconCls : 'locate',
+            handler: function() {
+                alert('Not implemented: recenter with GeoLocation API');
+            }
+        });
+
+        var layerManagerButton = Ext.create({
+            xtype   : 'button',
+            text: 'Layer Manager',
+            handler: function() {
+                alert('Not implemented: layer selector');
+            }
+        });
+
+        var toolbarTop = new Ext.Toolbar({
+            dock: 'top',
+            xtype: 'toolbar',
+            ui : 'light',
+            defaults: {
+                iconMask: true
+            },
+            items : [
+                searchField,
+                {
+                    xtype: 'spacer'
+                },
+                trackingButton
+            ]
+        });
+        var toolbarBottom = new Ext.Toolbar({
+            dock: 'bottom',
+            xtype: 'toolbar',
+            ui : 'light',
+            defaults: {
+                iconMask: true
+            },
+            items : [
+                    layerManagerButton
+            ]
+        });
+
+        var panel = new Ext.Panel({
+            fullscreen: true,
+            dockedItems: [toolbarTop,toolbarBottom],
+            items: [new Ext.Map({})]
+        });
+    }
+});
\ No newline at end of file



More information about the Commits mailing list